fix: starter template icons fix and auto resize of custon icons are reverted (#1298)

* fix: starter template icons fix and auto resize of custon icons are reverted

* fix: slidev icon revert

icons/slidev.svg

@@ -1,3 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+<svg xmlns='http://www.w3.org/2000/svg' width='29' height='28' fill='none'><g clip-path='url(#a)'><mask id='b' width='29' height='29' x='0' y='-1' maskUnits='userSpaceOnUse' style='mask-type:luminance'><path fill='#fff' d='M28.573-.002h-28v28h28v-28Z'/></mask><g mask='url(#b)'><path fill='#4B4B4B' d='M22.243 3.408H7.634A3.652 3.652 0 0 0 3.982 7.06v14.61a3.652 3.652 0 0 0 3.652 3.651h14.609a3.652 3.652 0 0 0 3.652-3.652V7.06a3.652 3.652 0 0 0-3.652-3.652Z'/><path fill='#7B7B7B' d='M22.486 10.955c0-6.052-4.905-10.957-10.956-10.957C5.479-.002.573 4.903.573 10.955c0 6.05 4.906 10.956 10.957 10.956 6.05 0 10.956-4.905 10.956-10.956Z'/><path fill='#fff' d='M14.239 15.563c-.287-1.07-.43-1.604-.288-1.974.123-.322.378-.576.7-.7.37-.141.904.002 1.974.288l5.315 1.425c1.07.286 1.604.43 1.853.737.217.268.31.616.256.956-.062.391-.453.782-1.236 1.565l-3.891 3.892c-.783.782-1.174 1.174-1.565 1.236-.34.054-.688-.04-.957-.257-.307-.248-.45-.783-.737-1.853l-1.424-5.315Z'/></g></g><defs><clipPath id='a'><path fill='#fff' d='M.574 0h28v28h-28z'/></clipPath></defs></svg>
-  <path fill="currentColor" d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V5h14v14zm-5-7l-3 3.72L9 13l-3 4h12l-4-5z"/>
-</svg>

package.json

@@ -65,7 +65,7 @@
     "@radix-ui/react-collapsible": "^1.0.3",
     "@radix-ui/react-context-menu": "^2.2.2",
     "@radix-ui/react-dialog": "^1.1.5",
-    "@radix-ui/react-dropdown-menu": "^2.1.2",
+    "@radix-ui/react-dropdown-menu": "^2.1.6",
     "@radix-ui/react-label": "^2.1.1",
     "@radix-ui/react-popover": "^1.1.5",
     "@radix-ui/react-progress": "^1.0.3",
@@ -104,7 +104,6 @@
     "jspdf": "^2.5.2",
     "jszip": "^3.10.1",
     "nanostores": "^0.10.3",
-    "next": "^15.1.5",
     "ollama-ai-provider": "^0.15.2",
     "path-browserify": "^1.0.1",
     "react": "^18.3.1",

uno.config.ts

@@ -1,52 +1,23 @@
 import { globSync } from 'fast-glob';
 import fs from 'node:fs/promises';
-import { basename, resolve } from 'node:path';
+import { basename } from 'node:path';
 import { defineConfig, presetIcons, presetUno, transformerDirectives } from 'unocss';
-import type { IconifyJSON } from '@iconify/types';
 
-// Debug: Log the current working directory and icon paths
+const iconPaths = globSync('./icons/*.svg');
-console.log('CWD:', process.cwd());
-
-// Use resolve to get absolute path and normalize slashes
-const iconsDir = resolve(process.cwd(), 'icons');
-const iconPaths = globSync('*.svg', {
-  cwd: iconsDir,
-  absolute: true,
-  onlyFiles: true,
-});
-
-console.log('Found icons:', iconPaths);
 
 const collectionName = 'bolt';
 
-const customIconCollection = {
+const customIconCollection = iconPaths.reduce(
-  [collectionName]: iconPaths.reduce(
+  (acc, iconPath) => {
-    (acc, iconPath) => {
+    const [iconName] = basename(iconPath).split('.');
-      const [iconName] = basename(iconPath).split('.');
-      console.log(`Loading icon: ${iconName} from ${iconPath}`); // Debug log
 
-      acc[iconName] = async () => {
+    acc[collectionName] ??= {};
-        try {
+    acc[collectionName][iconName] = async () => fs.readFile(iconPath, 'utf8');
-          const content = await fs.readFile(iconPath, 'utf8');
 
-          // Simplified SVG processing
+    return acc;
-          return content
+  },
-            .replace(/fill="[^"]*"/g, 'fill="currentColor"')
+  {} as Record<string, Record<string, () => Promise<string>>>,
-            .replace(/fill='[^']*'/g, "fill='currentColor'")
+);
-            .replace(/width="[^"]*"/g, 'width="24"')
-            .replace(/height="[^"]*"/g, 'height="24"')
-            .replace(/viewBox="[^"]*"/g, 'viewBox="0 0 24 24"');
-        } catch (error) {
-          console.error(`Error loading icon ${iconName}:`, error);
-          return '';
-        }
-      };
-
-      return acc;
-    },
-    {} as Record<string, () => Promise<string>>,
-  ),
-};
 
 const BASE_COLORS = {
   white: '#FFFFFF',
@@ -128,9 +99,7 @@ const COLOR_PRIMITIVES = {
 
 export default defineConfig({
   safelist: [
-    // Explicitly safelist all icon combinations
+    ...Object.keys(customIconCollection[collectionName] || {}).map(x => `i-bolt:${x}`)
-    ...Object.keys(customIconCollection[collectionName] || {}).map((x) => `i-${collectionName}-${x}`),
-    ...Object.keys(customIconCollection[collectionName] || {}).map((x) => `i-${collectionName}:${x}`),
   ],
   shortcuts: {
     'bolt-ease-cubic-bezier': 'ease-[cubic-bezier(0.4,0,0.2,1)]',
@@ -273,27 +242,9 @@ export default defineConfig({
     presetIcons({
       warn: true,
       collections: {
-        bolt: customIconCollection.bolt,
+        ...customIconCollection,
-        ph: async () => {
-          const icons = await import('@iconify-json/ph/icons.json');
-          return icons.default as IconifyJSON;
-        },
-      },
-      extraProperties: {
-        display: 'inline-block',
-        'vertical-align': 'middle',
-        width: '24px',
-        height: '24px',
-      },
-      customizations: {
-        customize(props) {
-          return {
-            ...props,
-            width: '24px',
-            height: '24px',
-          };
-        },
       },
+      unit: 'em',
     }),
   ],
 });