initial

layers/ui/modules/icons.ts

@@ -0,0 +1,94 @@
+import {
+  addComponent,
+  addTemplate,
+  addTypeTemplate,
+  createResolver,
+  defineNuxtModule,
+  installModule,
+} from '@nuxt/kit'
+import { globby } from 'globby'
+import { FileSystemIconLoader } from 'unplugin-icons/loaders'
+import IconsResolver from 'unplugin-icons/resolver'
+
+export default defineNuxtModule({
+  async setup(_, nuxt) {
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-expect-error
+    const resolver = createResolver(import.meta.url)
+
+    const svgTransformer = (svg: string) => {
+      return svg.replace(/^<svg /, '<svg fill="currentColor" ')
+    }
+
+    await installModule('unplugin-icons/nuxt', {
+      customCollections: {
+        'icon': FileSystemIconLoader(
+          resolver.resolve('../assets/icons'),
+          svgTransformer,
+        ),
+        'icon-s': FileSystemIconLoader(
+          resolver.resolve('../assets/small-icons'),
+          svgTransformer,
+        ),
+      },
+    })
+
+    const resolveIcon = IconsResolver({
+      enabledCollections: [],
+      customCollections: ['icon', 'icon-s'],
+      prefix: 'ui',
+    })
+
+    // Icons
+    const icons = (
+      await globby('**/*.svg', {
+        cwd: resolver.resolve('../assets/icons'),
+      })
+    ).map(icon => icon.replace('.svg', ''))
+
+    const iconComponents = icons.map((icon) => {
+      const name = `ui-icon-${icon}`
+      const component = resolveIcon(name)
+
+      return addComponent({
+        name,
+        filePath: component,
+        global: 'sync',
+      })
+    })
+    await Promise.all(iconComponents)
+
+    // Small icons
+    const smallIcons = (
+      await globby('**/*.svg', {
+        cwd: resolver.resolve('../assets/small-icons'),
+      })
+    ).map(icon => `s-${icon.replace('.svg', '')}`)
+
+    const smallIconComponents = smallIcons.map((icon) => {
+      const name = `ui-icon-${icon}`
+      const component = resolveIcon(name)
+
+      return addComponent({
+        name,
+        filePath: component,
+        global: 'sync',
+      })
+    })
+    await Promise.all(smallIconComponents)
+
+    addTemplate({
+      filename: 'ui/available-icons.mjs',
+      getContents: () =>
+        `export default ${JSON.stringify([icons, smallIcons].flat())}`,
+    })
+
+    addTypeTemplate({
+      filename: 'types/ui/icons.d.ts',
+      getContents: () => `
+        const icons = ${JSON.stringify([icons, smallIcons].flat())} as const;
+        export type UiIcon = typeof icons[number];
+      `,
+    })
+  },
+})