Feat: New Virtual Import for components! (#49)

.changeset/strange-pigs-train.md

@@ -0,0 +1,5 @@
+---
+"@matthiesenxyz/astro-gists": patch
+---
+
+NEW: we now have a virtual import available to use instead! to use this new import simply do `import { GetGist, GetGistGroup } from "astro-gists:components"` and you'll be good to go at the first boot of your dev server!

package/README.md

@@ -85,9 +85,7 @@ This Utility is meant to display a single Gist as Codeblocks using ExpressiveCod
 
 ```astro
 ---
-import { GetGist } from "@matthiesenxyz/astro-gists/components"
-// OR
-import GetGist from "@matthiesenxyz/astro-gists/GetGist"
+import { GetGist } from "astro-gists:components"
 ---
 <GetGist 
 	gistId="your-gist-id-here"
@@ -101,9 +99,7 @@ This Utility is meant to display an entire collection of Gists by ID
 
 ```astro
 ---
-import { GetGistGroup } from "@matthiesenxyz/astro-gists/components"
-// OR
-import GetGistGroup from "@matthiesenxyz/astro-gists/GetGistGroup"
+import { GetGistGroup } from "astro-gists:components"
 ---
 <GetGistGroup 
 	gistId="your-gist-id-here"

package/package.json

@@ -45,7 +45,7 @@
     "@octokit/types": "^12.6.0",
     "astro-integration-kit": "^0.5.1",
     "expressive-code": "^0.33.4",
-    "hast-util-to-html": "^8.0.4",
+    "hast-util-to-html": "8.0.4",
     "octokit": "^3.1.2",
     "vite": "^5.1.6"
   }

package/src/ExpressiveCode/components/Code.astro

@@ -29,7 +29,7 @@ const jsModules = await engine.getJsModules();
 const { renderedGroupAst, styles } = await engine.render({
 	language: lang, meta, locale, code,
   parentDocument: {
-    positionInDocument: { groupIndex,},
+    positionInDocument: { groupIndex },
   },
   props, })
 

package/src/components/GetGist.astro

@@ -19,8 +19,8 @@ export interface Props {
 
 const { gistId, filename, wrap, showLineNumbers } = Astro.props as Props;
 
-const WRAP = wrap ? wrap : wrap == undefined ? true : false;
-const SLN = showLineNumbers ? showLineNumbers : showLineNumbers == undefined ? true : false;
+const WRAP = wrap ? wrap : wrap === undefined ? true : false;
+const SLN = showLineNumbers ? showLineNumbers : showLineNumbers === undefined ? true : false;
 
 const Gist = await getGistFile( gistId, filename);
 

package/src/components/GetGistGroup.astro

@@ -17,8 +17,8 @@ export interface Props {
 
 const { gistId, wrap, showLineNumbers } = Astro.props as Props;
 
-const WRAP = wrap ? wrap : wrap == undefined ? true : false;
-const SLN = showLineNumbers ? showLineNumbers : showLineNumbers == undefined ? true : false;
+const WRAP = wrap ? wrap : wrap === undefined ? true : false;
+const SLN = showLineNumbers ? showLineNumbers : showLineNumbers === undefined ? true : false;
 
 const Gist = await getGistGroup(gistId);
 

package/src/integration.ts

@@ -2,6 +2,7 @@ import { defineIntegration, createResolver } from "astro-integration-kit"
 import { corePlugins } from "astro-integration-kit/plugins"
 import { isThereAToken, TOKEN_MISSING_ERROR } from "./lib"
 import { optionsSchema } from "./index"
+import { readFileSync } from "node:fs";
 
 /** 
  * Astro-Gist - An Astro.js integration for embedding GitHub Gists in your Astro.js project.
@@ -15,7 +16,7 @@ export default defineIntegration({
 
 	return {
 	  "astro:config:setup": ({ 
-		watchIntegration, addVirtualImports, logger,
+		watchIntegration, addVirtualImports, logger, addDts
 	}) => {
 		logger.info("Setting up Astro Gists Integration.")
 		const configSetup = logger.fork("astro-gists/config:setup")
@@ -29,8 +30,14 @@ export default defineIntegration({
 		// Add virtual imports
 		addVirtualImports({
 			"virtual:astro-gists/config": `export default ${JSON.stringify(options)}`,
+			"astro-gists:components": `export * from "@matthiesenxyz/astro-gists/components";`
 		});
 
+		addDts({
+			name: "astro-gists",
+			content: readFileSync(resolve("./stubs/astro-gists.d.ts"), "utf-8")
+		})
+
 	  },
 	  "astro:config:done": ({ logger }) => {
 		const configDone = logger.fork("astro-gists/config:done")

package/src/stubs/astro-gists.d.ts

@@ -0,0 +1,3 @@
+declare module "astro-gists:components" {
+  export * from "@matthiesenxyz/astro-gists/components";
+}

playground/astro.config.mjs

@@ -4,5 +4,6 @@ import mdx from "@astrojs/mdx"
 
 // https://astro.build/config
 export default defineConfig({
-  integrations: [astroGist(),mdx()]
+  integrations: [astroGist(), mdx()]
 });
+

playground/src/env.d.ts

@@ -1 +1,3 @@
+/// <reference path="../.astro/types.d.ts" />
 /// <reference types="astro/client" />
+/// <reference types="../.astro/astro-gists.d.ts" />

playground/src/pages/virtual.astro

@@ -0,0 +1,14 @@
+---
+import { GetGist, GetGistGroup } from "astro-gists:components"
+
+---
+<h1>Dev: Playground (Virtual Imports)</h1>
+
+
+<GetGist 
+	gistId="cce7f3f1d9322710be8196aa344186ba"
+	filename="hello.md" 
+/>
+<GetGistGroup 
+	gistId="84243fa11bf96a59bfb237152eb52fa7"
+/>

pnpm-lock.yaml

@@ -33,7 +33,7 @@ importers:
         specifier: ^0.33.4
         version: 0.33.4
       hast-util-to-html:
-        specifier: ^8.0.4
+        specifier: 8.0.4
         version: 8.0.4
       octokit:
         specifier: ^3.1.2