Add docs site (#161)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

package.json

@@ -25,6 +25,6 @@
     "@changesets/cli": "^2.18.1"
   },
   "devDependencies": {
-    "prettier": "^2.8.4"
+    "prettier": "^3.1.1"
   }
 }

packages/core/src/index.ts

@@ -3,7 +3,7 @@ import { createPlugin } from "./vite-plugin-astro-icon.js";
 import type { AstroIntegration } from "astro";
 
 export default function createIntegration(
-  opts: IntegrationOptions = {}
+  opts: IntegrationOptions = {},
 ): AstroIntegration {
   return {
     name: "astro-icon",

packages/core/src/loaders/loadIconifyCollections.ts

@@ -33,16 +33,16 @@ export default async function loadIconifyCollections({
   const possibleCollections = await Promise.all(
     installedCollections.map((collectionName) =>
       loadCollection(collectionName).then(
-        (possibleCollection) => [collectionName, possibleCollection] as const
-      )
-    )
+        (possibleCollection) => [collectionName, possibleCollection] as const,
+      ),
+    ),
   );
 
   const collections = possibleCollections.reduce<AstroIconCollectionMap>(
     (acc, [name, collection]) => {
       if (!collection) {
         console.error(
-          `[astro-icon] "${name}" does not appear to be a valid iconify collection! Did you install the "@iconify-json/${name}" dependency?`
+          `[astro-icon] "${name}" does not appear to be a valid iconify collection! Did you install the "@iconify-json/${name}" dependency?`,
         );
         return acc;
       }
@@ -58,29 +58,29 @@ export default async function loadIconifyCollections({
       const reducedCollection = getIcons(collection, requestedIcons);
       if (!reducedCollection) {
         console.error(
-          `[astro-icon] "${name}" failed to load the specified icons!`
+          `[astro-icon] "${name}" failed to load the specified icons!`,
         );
         return acc;
       } else if (
         Object.keys(reducedCollection.icons).length !== requestedIcons.length
       ) {
         console.error(
-          `[astro-icon] "${name}" failed to load at least one of the specified icons! Verify the icon names are included in the icon collection.`
+          `[astro-icon] "${name}" failed to load at least one of the specified icons! Verify the icon names are included in the icon collection.`,
         );
       }
 
       acc[name] = reducedCollection;
       return acc;
     },
-    {}
+    {},
   );
 
   return collections;
 }
 
 export async function loadCollection(
   name: string,
-  autoInstall?: AutoInstall
+  autoInstall?: AutoInstall,
 ): Promise<IconCollection | void> {
   if (!name) return;
 

packages/core/src/loaders/loadLocalCollection.ts

@@ -10,7 +10,7 @@ import type { SVG, Color, SVGOOptions } from "../../typings/iconify";
 
 export default async function createLocalCollection(
   dir: string,
-  options: SVGOOptions = { plugins: ["preset-default"] }
+  options: SVGOOptions = { plugins: ["preset-default"] },
 ): Promise<IconCollection> {
   // Import icons
   const local = await importDirectory(dir, {

packages/core/src/vite-plugin-astro-icon.ts

@@ -17,7 +17,7 @@ interface PluginContext extends Pick<AstroConfig, "root" | "output"> {
 let collections: AstroIconCollectionMap | undefined;
 export function createPlugin(
   { include = {}, iconDir = "src/icons", svgoOptions }: IntegrationOptions,
-  ctx: PluginContext
+  ctx: PluginContext,
 ): Plugin {
   const { root } = ctx;
   const virtualModuleId = "virtual:astro-icon";
@@ -46,7 +46,7 @@ export function createPlugin(
         await generateIconTypeDefinitions(Object.values(collections), root);
 
         return `export default ${JSON.stringify(
-          collections
+          collections,
         )};\nexport const config = ${JSON.stringify({ include })}`;
       }
     },
@@ -55,7 +55,7 @@ export function createPlugin(
 
 function logCollections(
   collections: AstroIconCollectionMap,
-  { logger }: PluginContext
+  { logger }: PluginContext,
 ) {
   if (Object.keys(collections).length === 0) {
     logger.warn("No icons detected!");
@@ -68,7 +68,7 @@ function logCollections(
 async function generateIconTypeDefinitions(
   collections: IconCollection[],
   rootDir: URL,
-  defaultPack = "local"
+  defaultPack = "local",
 ): Promise<void> {
   const typeFile = new URL("./.astro/icon.d.ts", rootDir);
   await ensureDir(new URL("./", typeFile));
@@ -93,14 +93,14 @@ declare module 'virtual:astro-icon' {
                     collection.prefix === defaultPack
                       ? ""
                       : `${collection.prefix}:`
-                  }${icon}"`
-              )
+                  }${icon}"`,
+              ),
             )
             .flat(1)
             .join("")
         : "never"
     };
-}`
+}`,
   );
 }
 

packages/www/.gitignore

@@ -1,3 +1,21 @@
-node_modules
-.astro
-.vercel
+# build output
+dist/
+# generated types
+.astro/
+
+# dependencies
+node_modules/
+
+# logs
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+
+# environment variables
+.env
+.env.production
+
+# macOS-specific files
+.DS_Store

packages/www/README.md

@@ -0,0 +1,44 @@
+# Astro Icon Docs
+
+[![Built with Starlight](https://astro.badg.es/v2/built-with-starlight/tiny.svg)](https://starlight.astro.build)
+
+## 🚀 Project Structure
+
+Inside of this Astro + Starlight project, you'll see the following folders and files:
+
+```
+.
+├── public/
+├── src/
+│   ├── assets/
+│   ├── content/
+│   │   ├── docs/
+│   │   └── config.ts
+│   └── env.d.ts
+├── astro.config.mjs
+├── package.json
+└── tsconfig.json
+```
+
+Starlight looks for `.md` or `.mdx` files in the `src/content/docs/` directory. Each file is exposed as a route based on its file name.
+
+Images can be added to `src/assets/` and embedded in Markdown with a relative link.
+
+Static assets, like favicons, can be placed in the `public/` directory.
+
+## 🧞 Commands
+
+All commands are run from the root of the project, from a terminal:
+
+| Command                   | Action                                           |
+| :------------------------ | :----------------------------------------------- |
+| `npm install`             | Installs dependencies                            |
+| `npm run dev`             | Starts local dev server at `localhost:4321`      |
+| `npm run build`           | Build your production site to `./dist/`          |
+| `npm run preview`         | Preview your build locally, before deploying     |
+| `npm run astro ...`       | Run CLI commands like `astro add`, `astro check` |
+| `npm run astro -- --help` | Get help using the Astro CLI                     |
+
+## 👀 Want to learn more?
+
+Check out [Starlight’s docs](https://starlight.astro.build/), read [the Astro documentation](https://docs.astro.build), or jump into the [Astro Discord server](https://astro.build/chat).

packages/www/astro.config.mjs

@@ -1,16 +1,37 @@
-// @ts-check
 import { defineConfig } from 'astro/config';
-import icon from 'astro-icon';
+import starlight from '@astrojs/starlight';
 
 // https://astro.build/config
 export default defineConfig({
-    site: 'https://github.com',
-    base: '/natemoo-re/astro-icon',
-    integrations: [
-        icon({
-            include: {
-              pixelarticons: ['external-link'],
-            }
-        })
-    ]
+	integrations: [
+		starlight({
+			title: 'Astro Icon',
+			social: {
+				github: 'https://github.com/natemoo-re/astro-icon',
+			},
+			sidebar: [
+				{
+					label: 'Start Here',
+					items: [
+						{ label: 'Getting Started', link: '/getting-started/' },
+						{ label: 'Upgrade to v1', link: '/guides/upgrade/v1/' },
+						{ label: 'Acknowledgements', link: '/acknowledgements/' },
+					],
+				},
+				{
+					label: 'Guides',
+					items: [
+						{ label: 'Customizing Icons', link: '/guides/customization/' },
+						{ label: 'Components', link: '/guides/components/' },
+						{ label: 'CSS & Styling', link: '/guides/styling/' },
+						{ label: 'Deployment', link: '/guides/deployment/' },
+					],
+				},
+				{
+					label: 'Reference',
+					autogenerate: { directory: 'reference' },
+				},
+			],
+		}),
+	],
 });

packages/www/package.json

@@ -1,22 +1,19 @@
 {
   "name": "www",
-  "version": "0.0.9",
-  "private": true,
   "type": "module",
+  "version": "0.0.1",
   "scripts": {
     "dev": "astro dev",
     "start": "astro dev",
-    "build": "pnpm run check && astro build",
+    "build": "astro check && astro build",
     "preview": "astro preview",
-    "check": "astro check"
+    "astro": "astro"
   },
   "dependencies": {
     "@astrojs/check": "^0.3.4",
-    "@iconify-json/pixelarticons": "^1.1.6",
+    "@astrojs/starlight": "^0.15.1",
+    "astro": "^4.0.7",
+    "sharp": "^0.32.5",
     "typescript": "^5.0.4"
-  },
-  "devDependencies": {
-    "astro": "^4.0.0",
-    "astro-icon": "workspace:*"
   }
 }