svgfusion 1.8.0 → 1.9.0

package/dist/cli.js

@@ -893,7 +893,8 @@ var ReactGenerator = class extends ComponentGenerator {
       "title?: string;",
       "titleId?: string;",
       "desc?: string;",
-      "descId?: string;"
+      "descId?: string;",
+      "size?: string;"
     ];
     const colorProps = this.generateColorProps(colorMappings);
     if (colorProps) {
@@ -919,6 +920,7 @@ var ReactGenerator = class extends ComponentGenerator {
       "titleId: PropTypes.string,",
       "desc: PropTypes.string,",
       "descId: PropTypes.string,",
+      "size: PropTypes.string,",
       "className: PropTypes.string,",
       "style: PropTypes.object,",
       "width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),",
@@ -941,40 +943,55 @@ var ReactGenerator = class extends ComponentGenerator {
   generateComponent(result) {
     const componentName = this.getComponentName();
     const { colorMappings, metadata } = result;
-    const customProps = ["title", "titleId", "desc", "descId"];
+    const customProps = ["title", "titleId", "desc", "descId", "size"];
     const colorProps = colorMappings.map((m) => m.variableName);
     const colorClassProps = colorMappings.map((m) => `${m.variableName}Class`);
     const allCustomProps = [...customProps, ...colorProps, ...colorClassProps];
     if (metadata.features.includes("fixed-stroke-width")) {
       allCustomProps.push("isFixedStrokeWidth");
     }
+    const colorDefaults = this.generateColorDefaults(colorMappings);
+    const sizeDefault = 'size = "20"';
+    const allDefaults = [sizeDefault, colorDefaults].filter(Boolean).join(", ");
+    const defaultPropsString = allDefaults ? `, ${allDefaults}` : "";
     const customPropsDestructure = `{ ${allCustomProps.join(
       ", "
-    )}, ...svgProps }`;
+    )}${defaultPropsString}, ...svgProps }`;
+    const rootAttributes = this.generateSvgAttributes(result.ast);
     const titleElement = "{title ? <title id={titleId}>{title}</title> : null}";
     const descElement = "{desc ? <desc id={descId}>{desc}</desc> : null}";
     if (this.reactOptions.typescript) {
       const propsType = `${componentName}Props`;
       const refType = this.reactOptions.forwardRef ? `, ref: Ref<SVGSVGElement>` : "";
       const childrenJsx = result.ast.root.children.map((child) => this.elementToJsx(child, 1)).join("\n");
-      return `const ${componentName} = (${customPropsDestructure}: ${propsType}${refType}) => (
-  <svg
-    ${this.reactOptions.forwardRef ? "ref={ref}\n    " : ""}...svgProps
-  >
-    ${titleElement}
-    ${descElement}
+      return `const ${componentName} = (${customPropsDestructure}: ${propsType}${refType}) => {
+  const computedSize = size ? { width: size, height: size } : {};
+  
+  return (
+    <svg
+      ${this.reactOptions.forwardRef ? "ref={ref}\n      " : ""}${rootAttributes}
+      {...computedSize}
+      {...svgProps}
+    >
+      ${titleElement}
+      ${descElement}
 ${childrenJsx}
-  </svg>
-);`;
+    </svg>
+  );
+};`;
     } else {
       const childrenJsx = result.ast.root.children.map((child) => this.elementToJsx(child, 1)).join("\n");
-      return `const ${componentName} = (${customPropsDestructure}) => (
-  <svg {...svgProps}>
-    ${titleElement}
-    ${descElement}
+      return `const ${componentName} = (${customPropsDestructure}) => {
+  const computedSize = size ? { width: size, height: size } : {};
+  
+  return (
+    <svg ${rootAttributes}{...computedSize} {...svgProps}>
+      ${titleElement}
+      ${descElement}
 ${childrenJsx}
-  </svg>
-);`;
+    </svg>
+  );
+};`;
     }
   }
   /**
@@ -1028,6 +1045,76 @@ ${childrenJsx}
     }
     return deps;
   }
+  /**
+   * Generate SVG root attributes
+   */
+  generateSvgAttributes(ast) {
+    const attributes = [];
+    const viewBox = ast.root.attributes?.viewBox || ast.viewBox;
+    if (viewBox) {
+      attributes.push(`viewBox="${viewBox}"`);
+    }
+    const xmlns = ast.root.attributes?.xmlns || ast.namespace;
+    if (xmlns) {
+      attributes.push(`xmlns="${xmlns}"`);
+    }
+    if (!viewBox) {
+      const width = ast.root.attributes?.width || ast.width;
+      const height = ast.root.attributes?.height || ast.height;
+      if (width) {
+        attributes.push(`width="${width}"`);
+      }
+      if (height) {
+        attributes.push(`height="${height}"`);
+      }
+    }
+    return attributes.length > 0 ? attributes.join("\n    ") + "\n    " : "";
+  }
+  /**
+   * Override to add color class logic for React
+   */
+  elementToJsx(element, depth = 0) {
+    const indent = "  ".repeat(depth + 1);
+    const { tag, attributes, children, content } = element;
+    const jsxAttributes = this.attributesToJsxWithClasses(attributes);
+    const attributeString = jsxAttributes.length > 0 ? " " + jsxAttributes.join(" ") : "";
+    if (children.length === 0 && !content) {
+      return `${indent}<${tag}${attributeString} />`;
+    }
+    let result = `${indent}<${tag}${attributeString}>`;
+    if (content) {
+      result += content;
+    }
+    if (children.length > 0) {
+      result += "\n";
+      result += children.map((child) => this.elementToJsx(child, depth + 1)).join("\n");
+      result += "\n" + indent;
+    }
+    result += `</${tag}>`;
+    return result;
+  }
+  /**
+   * Convert attributes to JSX with color class logic
+   */
+  attributesToJsxWithClasses(attributes) {
+    const jsxAttributes = [];
+    Object.entries(attributes).forEach(([key, value]) => {
+      const jsxKey = this.convertAttributeName(key);
+      if ((key === "fill" || key === "stroke") && value.startsWith("{") && value.endsWith("}")) {
+        const colorVar = value.slice(1, -1);
+        jsxAttributes.push(`${jsxKey}=${value}`);
+        const classVar = `${colorVar}Class`;
+        jsxAttributes.push(`className={${classVar}}`);
+      } else {
+        if (value.startsWith("{") && value.endsWith("}")) {
+          jsxAttributes.push(`${jsxKey}=${value}`);
+        } else {
+          jsxAttributes.push(`${jsxKey}="${value}"`);
+        }
+      }
+    });
+    return jsxAttributes;
+  }
 };
 
 // src/generators/vue.ts
@@ -1098,7 +1185,7 @@ ${style}
   generateTemplate(result) {
     const { ast } = result;
     const childrenJsx = ast.root.children.map((child) => this.elementToVueTemplate(child, 2)).join("\n");
-    return `  <svg v-bind="$attrs">
+    return `  <svg v-bind="$attrs" :width="props.size || undefined" :height="props.size || undefined">
     <title v-if="props.title" :id="props.titleId">{{ props.title }}</title>
     <desc v-if="props.desc" :id="props.descId">{{ props.desc }}</desc>
 ${childrenJsx}
@@ -1110,8 +1197,20 @@ ${childrenJsx}
   elementToVueTemplate(element, depth = 0) {
     const indent = "  ".repeat(depth);
     const { tag, attributes, children, content } = element;
-    const vueAttributes = Object.entries(attributes).map(([key, value]) => `${key}="${value}"`).join(" ");
-    const attributeString = vueAttributes ? " " + vueAttributes : "";
+    const vueAttributes = [];
+    Object.entries(attributes).forEach(([key, value]) => {
+      if (value.startsWith("{") && value.endsWith("}")) {
+        const variableName = value.slice(1, -1);
+        vueAttributes.push(`:${key}="props.${variableName}"`);
+        if (key === "fill" || key === "stroke") {
+          const classVar = `${variableName}Class`;
+          vueAttributes.push(`:class="props.${classVar}"`);
+        }
+      } else {
+        vueAttributes.push(`${key}="${value}"`);
+      }
+    });
+    const attributeString = vueAttributes.length > 0 ? " " + vueAttributes.join(" ") : "";
     if (children.length === 0 && !content) {
       return `${indent}<${tag}${attributeString} />`;
     }
@@ -1151,6 +1250,7 @@ ${childrenJsx}
       lines.push("  titleId?: string;");
       lines.push("  desc?: string;");
       lines.push("  descId?: string;");
+      lines.push("  size?: string;");
       const colorProps = this.generateColorPropsInterface(colorMappings);
       if (colorProps) {
         lines.push(colorProps);
@@ -1171,6 +1271,10 @@ ${childrenJsx}
       lines.push("  style: { type: Object, default: undefined },");
       lines.push("  width: { type: [String, Number], default: undefined },");
       lines.push("  height: { type: [String, Number], default: undefined },");
+      lines.push('  size: { type: String, default: "20" },');
+    }
+    if (this.vueOptions.typescript) {
+      lines.push('  size: "20",');
     }
     colorMappings.forEach((mapping) => {
       const propName = mapping.variableName;

package/dist/index.d.mts

@@ -264,6 +264,18 @@ declare class ReactGenerator extends ComponentGenerator {
      * Get list of dependencies
      */
     private getDependencies;
+    /**
+     * Generate SVG root attributes
+     */
+    private generateSvgAttributes;
+    /**
+     * Override to add color class logic for React
+     */
+    protected elementToJsx(element: SVGElement, depth?: number): string;
+    /**
+     * Convert attributes to JSX with color class logic
+     */
+    private attributesToJsxWithClasses;
 }
 
 /**

package/dist/index.d.ts

@@ -264,6 +264,18 @@ declare class ReactGenerator extends ComponentGenerator {
      * Get list of dependencies
      */
     private getDependencies;
+    /**
+     * Generate SVG root attributes
+     */
+    private generateSvgAttributes;
+    /**
+     * Override to add color class logic for React
+     */
+    protected elementToJsx(element: SVGElement, depth?: number): string;
+    /**
+     * Convert attributes to JSX with color class logic
+     */
+    private attributesToJsxWithClasses;
 }
 
 /**

package/dist/index.js

@@ -1,38 +1,53 @@
-'use strict';var svgo=require('svgo'),promises=require('fs/promises'),path=require('path'),fs=require('fs');var y=class{parse(e){let t=this.cleanSvgContent(e),r=this.parseElement(t);return {root:r,viewBox:r.attributes.viewBox,width:r.attributes.width,height:r.attributes.height,namespace:r.attributes.xmlns}}extractColors(e){let t=[];return this.traverseElements(e.root,r=>{r.attributes.fill&&this.isValidColor(r.attributes.fill)&&t.push({value:r.attributes.fill,type:"fill",element:r,attribute:"fill"}),r.attributes.stroke&&this.isValidColor(r.attributes.stroke)&&t.push({value:r.attributes.stroke,type:"stroke",element:r,attribute:"stroke"}),r.attributes["stop-color"]&&this.isValidColor(r.attributes["stop-color"])&&t.push({value:r.attributes["stop-color"],type:"stop-color",element:r,attribute:"stop-color"});}),t}cleanSvgContent(e){return e.replace(/<\?xml[^>]*\?>/gi,"").replace(/<!--[\s\S]*?-->/g,"").trim()}parseElement(e){let t=e.match(/<svg([^>]*)>/i);if(!t)throw new Error("Invalid SVG: No svg element found");let r=this.parseAttributes(t[1]),s=this.parseChildren(e);return {tag:"svg",attributes:r,children:s}}parseAttributes(e){let t={},r=/(\w+(?:-\w+)*)=["']([^"']*)["']/g,s;for(;(s=r.exec(e))!==null;)t[s[1]]=s[2];return t}parseChildren(e){let t=[],r=e.match(/<svg[^>]*>(.*)<\/svg>/is);if(!r||!r[1])return t;let s=r[1],o=/<(\w+(?::\w+)?)([^>]*?)(?:\s*\/\s*>|>(.*?)<\/\1\s*>)/gs,i;for(;(i=o.exec(s))!==null;){let[,a,c,l]=i,p=this.parseAttributes(c),u={tag:a,attributes:p,children:[]};l!==void 0&&(l.includes("<")?u.children=this.parseNestedElements(l):l.trim()&&(u.content=l.trim())),t.push(u);}return t}parseNestedElements(e){let t=[],r=/<(\w+(?::\w+)?)([^>]*?)(?:\s*\/\s*>|>(.*?)<\/\1\s*>)/gs,s;for(;(s=r.exec(e))!==null;){let[,o,i,a]=s,c=this.parseAttributes(i),l={tag:o,attributes:c,children:[]};a!==void 0&&(a.includes("<")?l.children=this.parseNestedElements(a):a.trim()&&(l.content=a.trim())),t.push(l);}return t}traverseElements(e,t){t(e),e.children.forEach(r=>this.traverseElements(r,t));}isValidColor(e){return !e||e==="none"||e==="transparent"||e==="currentColor"?false:/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(e)||/^rgba?\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*(?:,\s*[\d.]+\s*)?\)$/.test(e)||/^hsla?\(\s*\d+\s*,\s*\d+%\s*,\s*\d+%\s*(?:,\s*[\d.]+\s*)?\)$/.test(e)?true:["red","green","blue","black","white","yellow","cyan","magenta"].includes(e.toLowerCase())}};var S=class{options;constructor(e={}){this.options={preserveOriginalNames:e.preserveOriginalNames??false,generateClasses:e.generateClasses??true,colorPrefix:e.colorPrefix??"color"};}extractColors(e){let t=[];this.traverseElement(e,t);let r=new Map;return t.forEach(s=>{this.isValidColor(s.value)&&r.set(s.value,s);}),Array.from(r.values()).sort((s,o)=>s.value.localeCompare(o.value))}apply(e){let t=this.extractColors(e),r=this.generateColorMappings(t),s=this.replaceColorsWithVariables(e,r);return {mappings:r,processedElement:s,originalColors:t.map(o=>o.value)}}generateColorMappings(e){return e.map((t,r)=>({originalColor:t.value,variableName:r===0?this.options.colorPrefix:`${this.options.colorPrefix}${r+1}`,type:t.type}))}replaceColorsWithVariables(e,t){let r=new Map(t.map(s=>[s.originalColor,s.variableName]));return this.transformElement(e,s=>{let o={...s.attributes};return o.fill&&r.has(o.fill)&&(o.fill=`{${r.get(o.fill)}}`),o.stroke&&r.has(o.stroke)&&(o.stroke=`{${r.get(o.stroke)}}`),o["stop-color"]&&r.has(o["stop-color"])&&(o["stop-color"]=`{${r.get(o["stop-color"])}}`),{...s,attributes:o}})}traverseElement(e,t){e.attributes.fill&&t.push({value:e.attributes.fill,type:"fill",element:e,attribute:"fill"}),e.attributes.stroke&&t.push({value:e.attributes.stroke,type:"stroke",element:e,attribute:"stroke"}),e.attributes["stop-color"]&&t.push({value:e.attributes["stop-color"],type:"stop-color",element:e,attribute:"stop-color"}),e.children.forEach(r=>this.traverseElement(r,t));}transformElement(e,t){let r=t(e);return {...r,children:r.children.map(s=>this.transformElement(s,t))}}isValidColor(e){return !e||e==="none"||e==="transparent"||e==="currentColor"?false:/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(e)||/^rgba?\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*(?:,\s*[\d.]+\s*)?\)$/.test(e)||/^hsla?\(\s*\d+\s*,\s*\d+%\s*,\s*\d+%\s*(?:,\s*[\d.]+\s*)?\)$/.test(e)?true:["red","green","blue","yellow","orange","purple","pink","brown","black","white","gray","grey","cyan","magenta","lime","navy"].includes(e.toLowerCase())}};var b=class{options;constructor(e={}){this.options={preserveExisting:e.preserveExisting??true,onlyIfStrokePresent:e.onlyIfStrokePresent??true};}apply(e){let t=0;return {processedElement:this.transformElement(e,s=>this.shouldAddVectorEffect(s)?(t++,{...s,attributes:{...s.attributes,"vector-effect":"non-scaling-stroke"}}):s),elementsModified:t}}shouldAddVectorEffect(e){return this.options.preserveExisting&&e.attributes["vector-effect"]||this.options.onlyIfStrokePresent&&!(e.attributes.stroke&&e.attributes.stroke!=="none"&&e.attributes.stroke!=="transparent")?false:["path","line","polyline","polygon","rect","circle","ellipse"].includes(e.tag)}transformElement(e,t){let r=t(e);return {...r,children:r.children.map(s=>this.transformElement(s,t))}}};var $=class{options;constructor(e={}){this.options={addRole:e.addRole??true,addAriaHidden:e.addAriaHidden??false,addTitle:e.addTitle??true,addDesc:e.addDesc??true,defaultRole:e.defaultRole??"img",preserveExisting:e.preserveExisting??true};}apply(e){let t=[];if(e.tag!=="svg")return {processedElement:e,attributesAdded:t};let r={...e.attributes};return this.options.addRole&&(!this.options.preserveExisting||!r.role)&&(r.role=this.options.defaultRole,t.push("role")),this.options.addAriaHidden&&(!this.options.preserveExisting||!r["aria-hidden"])&&(r["aria-hidden"]="true",t.push("aria-hidden")),this.options.addTitle&&t.push("title-support"),this.options.addDesc&&t.push("desc-support"),this.options.addTitle&&this.options.addDesc&&(!this.options.preserveExisting||!r["aria-labelledby"])?(r["aria-labelledby"]="{titleId} {descId}",t.push("aria-labelledby")):this.options.addTitle&&(!this.options.preserveExisting||!r["aria-labelledby"])&&(r["aria-labelledby"]="{titleId}",t.push("aria-labelledby")),{processedElement:{...e,attributes:r},attributesAdded:t}}generateProps(){let e=[];return this.options.addTitle&&e.push("title?: string","titleId?: string"),this.options.addDesc&&e.push("desc?: string","descId?: string"),e}generateJSXElements(e){let t=[];return e==="react"?(this.options.addDesc&&t.push("{desc ? <desc id={descId}>{desc}</desc> : null}"),this.options.addTitle&&t.push("{title ? <title id={titleId}>{title}</title> : null}")):(this.options.addDesc&&t.push('<desc v-if="desc" :id="descId">{{ desc }}</desc>'),this.options.addTitle&&t.push('<title v-if="title" :id="titleId">{{ title }}</title>')),t.join(`
-    `)}};var E=class{transform(e,t={}){let{optimize:r=true,splitColors:s=false,fixedStrokeWidth:o=false,accessibility:i=true,removeComments:a=true,removeDuplicates:c=true,minifyPaths:l=false}=t,p=this.deepCloneAst(e),u=[],d=[];return r&&(this.applyOptimizations(p,{removeComments:a,removeDuplicates:c,minifyPaths:l&&!s}),u.push("optimization")),s&&(d=this.applySplitColors(p),u.push("split-colors")),o&&(this.applyFixedStrokeWidth(p),u.push("fixed-stroke-width")),i&&(this.applyAccessibility(p),u.push("accessibility")),{ast:p,colorMappings:d,metadata:{originalColors:d.map(C=>C.originalColor),optimizationApplied:r,features:u}}}applySplitColors(e){let r=new S({generateClasses:true,colorPrefix:"color"}).apply(e.root);return e.root=r.processedElement,r.mappings}applyFixedStrokeWidth(e){let r=new b({onlyIfStrokePresent:true,preserveExisting:true}).apply(e.root);e.root=r.processedElement;}applyAccessibility(e){let r=new $({addRole:true,addTitle:true,addDesc:true,defaultRole:"img",preserveExisting:true}).apply(e.root);e.root=r.processedElement;}applyOptimizations(e,t){t.removeDuplicates&&this.removeDuplicateElements(e),t.minifyPaths&&this.minifyPaths(e),this.removeEmptyGroups(e);}removeDuplicateElements(e){}minifyPaths(e){this.traverseElements(e.root,t=>{t.tag==="path"&&t.attributes.d&&(t.attributes.d=t.attributes.d.replace(/\s+/g," ").replace(/([MLHVCSQTAZ])\s+/gi,"$1").trim());});}removeEmptyGroups(e){let t=r=>(r.children=r.children.filter(t),!(r.tag==="g"&&r.children.length===0&&!r.content));e.root.children=e.root.children.filter(t);}traverseElements(e,t){t(e),e.children.forEach(r=>this.traverseElements(r,t));}isValidColor(e){return !e||e==="none"||e==="transparent"||e==="currentColor"?false:/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(e)||/^rgba?\(.+\)$/.test(e)||/^hsla?\(.+\)$/.test(e)}deepCloneAst(e){return {...e,root:this.deepCloneElement(e.root)}}deepCloneElement(e){return {...e,attributes:{...e.attributes},children:e.children.map(t=>this.deepCloneElement(t))}}};var x=class{options;constructor(e={}){this.options={typescript:true,memo:true,forwardRef:true,exportDefault:true,componentName:"Icon",includeTypes:true,...e};}astToJsx(e){return this.elementToJsx(e.root,0)}elementToJsx(e,t=0){let r="  ".repeat(t+1),{tag:s,attributes:o,children:i,content:a}=e,c=this.attributesToJsx(o),l=c.length>0?" "+c.join(" "):"";if(i.length===0&&!a)return `${r}<${s}${l} />`;let p=`${r}<${s}${l}>`;return a&&(p+=a),i.length>0&&(p+=`
+'use strict';var svgo=require('svgo'),promises=require('fs/promises'),path=require('path'),fs=require('fs');var b=class{parse(e){let t=this.cleanSvgContent(e),r=this.parseElement(t);return {root:r,viewBox:r.attributes.viewBox,width:r.attributes.width,height:r.attributes.height,namespace:r.attributes.xmlns}}extractColors(e){let t=[];return this.traverseElements(e.root,r=>{r.attributes.fill&&this.isValidColor(r.attributes.fill)&&t.push({value:r.attributes.fill,type:"fill",element:r,attribute:"fill"}),r.attributes.stroke&&this.isValidColor(r.attributes.stroke)&&t.push({value:r.attributes.stroke,type:"stroke",element:r,attribute:"stroke"}),r.attributes["stop-color"]&&this.isValidColor(r.attributes["stop-color"])&&t.push({value:r.attributes["stop-color"],type:"stop-color",element:r,attribute:"stop-color"});}),t}cleanSvgContent(e){return e.replace(/<\?xml[^>]*\?>/gi,"").replace(/<!--[\s\S]*?-->/g,"").trim()}parseElement(e){let t=e.match(/<svg([^>]*)>/i);if(!t)throw new Error("Invalid SVG: No svg element found");let r=this.parseAttributes(t[1]),s=this.parseChildren(e);return {tag:"svg",attributes:r,children:s}}parseAttributes(e){let t={},r=/(\w+(?:-\w+)*)=["']([^"']*)["']/g,s;for(;(s=r.exec(e))!==null;)t[s[1]]=s[2];return t}parseChildren(e){let t=[],r=e.match(/<svg[^>]*>(.*)<\/svg>/is);if(!r||!r[1])return t;let s=r[1],o=/<(\w+(?::\w+)?)([^>]*?)(?:\s*\/\s*>|>(.*?)<\/\1\s*>)/gs,i;for(;(i=o.exec(s))!==null;){let[,a,l,c]=i,p=this.parseAttributes(l),u={tag:a,attributes:p,children:[]};c!==void 0&&(c.includes("<")?u.children=this.parseNestedElements(c):c.trim()&&(u.content=c.trim())),t.push(u);}return t}parseNestedElements(e){let t=[],r=/<(\w+(?::\w+)?)([^>]*?)(?:\s*\/\s*>|>(.*?)<\/\1\s*>)/gs,s;for(;(s=r.exec(e))!==null;){let[,o,i,a]=s,l=this.parseAttributes(i),c={tag:o,attributes:l,children:[]};a!==void 0&&(a.includes("<")?c.children=this.parseNestedElements(a):a.trim()&&(c.content=a.trim())),t.push(c);}return t}traverseElements(e,t){t(e),e.children.forEach(r=>this.traverseElements(r,t));}isValidColor(e){return !e||e==="none"||e==="transparent"||e==="currentColor"?false:/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(e)||/^rgba?\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*(?:,\s*[\d.]+\s*)?\)$/.test(e)||/^hsla?\(\s*\d+\s*,\s*\d+%\s*,\s*\d+%\s*(?:,\s*[\d.]+\s*)?\)$/.test(e)?true:["red","green","blue","black","white","yellow","cyan","magenta"].includes(e.toLowerCase())}};var S=class{options;constructor(e={}){this.options={preserveOriginalNames:e.preserveOriginalNames??false,generateClasses:e.generateClasses??true,colorPrefix:e.colorPrefix??"color"};}extractColors(e){let t=[];this.traverseElement(e,t);let r=new Map;return t.forEach(s=>{this.isValidColor(s.value)&&r.set(s.value,s);}),Array.from(r.values()).sort((s,o)=>s.value.localeCompare(o.value))}apply(e){let t=this.extractColors(e),r=this.generateColorMappings(t),s=this.replaceColorsWithVariables(e,r);return {mappings:r,processedElement:s,originalColors:t.map(o=>o.value)}}generateColorMappings(e){return e.map((t,r)=>({originalColor:t.value,variableName:r===0?this.options.colorPrefix:`${this.options.colorPrefix}${r+1}`,type:t.type}))}replaceColorsWithVariables(e,t){let r=new Map(t.map(s=>[s.originalColor,s.variableName]));return this.transformElement(e,s=>{let o={...s.attributes};return o.fill&&r.has(o.fill)&&(o.fill=`{${r.get(o.fill)}}`),o.stroke&&r.has(o.stroke)&&(o.stroke=`{${r.get(o.stroke)}}`),o["stop-color"]&&r.has(o["stop-color"])&&(o["stop-color"]=`{${r.get(o["stop-color"])}}`),{...s,attributes:o}})}traverseElement(e,t){e.attributes.fill&&t.push({value:e.attributes.fill,type:"fill",element:e,attribute:"fill"}),e.attributes.stroke&&t.push({value:e.attributes.stroke,type:"stroke",element:e,attribute:"stroke"}),e.attributes["stop-color"]&&t.push({value:e.attributes["stop-color"],type:"stop-color",element:e,attribute:"stop-color"}),e.children.forEach(r=>this.traverseElement(r,t));}transformElement(e,t){let r=t(e);return {...r,children:r.children.map(s=>this.transformElement(s,t))}}isValidColor(e){return !e||e==="none"||e==="transparent"||e==="currentColor"?false:/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(e)||/^rgba?\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*(?:,\s*[\d.]+\s*)?\)$/.test(e)||/^hsla?\(\s*\d+\s*,\s*\d+%\s*,\s*\d+%\s*(?:,\s*[\d.]+\s*)?\)$/.test(e)?true:["red","green","blue","yellow","orange","purple","pink","brown","black","white","gray","grey","cyan","magenta","lime","navy"].includes(e.toLowerCase())}};var E=class{options;constructor(e={}){this.options={preserveExisting:e.preserveExisting??true,onlyIfStrokePresent:e.onlyIfStrokePresent??true};}apply(e){let t=0;return {processedElement:this.transformElement(e,s=>this.shouldAddVectorEffect(s)?(t++,{...s,attributes:{...s.attributes,"vector-effect":"non-scaling-stroke"}}):s),elementsModified:t}}shouldAddVectorEffect(e){return this.options.preserveExisting&&e.attributes["vector-effect"]||this.options.onlyIfStrokePresent&&!(e.attributes.stroke&&e.attributes.stroke!=="none"&&e.attributes.stroke!=="transparent")?false:["path","line","polyline","polygon","rect","circle","ellipse"].includes(e.tag)}transformElement(e,t){let r=t(e);return {...r,children:r.children.map(s=>this.transformElement(s,t))}}};var w=class{options;constructor(e={}){this.options={addRole:e.addRole??true,addAriaHidden:e.addAriaHidden??false,addTitle:e.addTitle??true,addDesc:e.addDesc??true,defaultRole:e.defaultRole??"img",preserveExisting:e.preserveExisting??true};}apply(e){let t=[];if(e.tag!=="svg")return {processedElement:e,attributesAdded:t};let r={...e.attributes};return this.options.addRole&&(!this.options.preserveExisting||!r.role)&&(r.role=this.options.defaultRole,t.push("role")),this.options.addAriaHidden&&(!this.options.preserveExisting||!r["aria-hidden"])&&(r["aria-hidden"]="true",t.push("aria-hidden")),this.options.addTitle&&t.push("title-support"),this.options.addDesc&&t.push("desc-support"),this.options.addTitle&&this.options.addDesc&&(!this.options.preserveExisting||!r["aria-labelledby"])?(r["aria-labelledby"]="{titleId} {descId}",t.push("aria-labelledby")):this.options.addTitle&&(!this.options.preserveExisting||!r["aria-labelledby"])&&(r["aria-labelledby"]="{titleId}",t.push("aria-labelledby")),{processedElement:{...e,attributes:r},attributesAdded:t}}generateProps(){let e=[];return this.options.addTitle&&e.push("title?: string","titleId?: string"),this.options.addDesc&&e.push("desc?: string","descId?: string"),e}generateJSXElements(e){let t=[];return e==="react"?(this.options.addDesc&&t.push("{desc ? <desc id={descId}>{desc}</desc> : null}"),this.options.addTitle&&t.push("{title ? <title id={titleId}>{title}</title> : null}")):(this.options.addDesc&&t.push('<desc v-if="desc" :id="descId">{{ desc }}</desc>'),this.options.addTitle&&t.push('<title v-if="title" :id="titleId">{{ title }}</title>')),t.join(`
+    `)}};var V=class{transform(e,t={}){let{optimize:r=true,splitColors:s=false,fixedStrokeWidth:o=false,accessibility:i=true,removeComments:a=true,removeDuplicates:l=true,minifyPaths:c=false}=t,p=this.deepCloneAst(e),u=[],h=[];return r&&(this.applyOptimizations(p,{removeComments:a,removeDuplicates:l,minifyPaths:c&&!s}),u.push("optimization")),s&&(h=this.applySplitColors(p),u.push("split-colors")),o&&(this.applyFixedStrokeWidth(p),u.push("fixed-stroke-width")),i&&(this.applyAccessibility(p),u.push("accessibility")),{ast:p,colorMappings:h,metadata:{originalColors:h.map(x=>x.originalColor),optimizationApplied:r,features:u}}}applySplitColors(e){let r=new S({generateClasses:true,colorPrefix:"color"}).apply(e.root);return e.root=r.processedElement,r.mappings}applyFixedStrokeWidth(e){let r=new E({onlyIfStrokePresent:true,preserveExisting:true}).apply(e.root);e.root=r.processedElement;}applyAccessibility(e){let r=new w({addRole:true,addTitle:true,addDesc:true,defaultRole:"img",preserveExisting:true}).apply(e.root);e.root=r.processedElement;}applyOptimizations(e,t){t.removeDuplicates&&this.removeDuplicateElements(e),t.minifyPaths&&this.minifyPaths(e),this.removeEmptyGroups(e);}removeDuplicateElements(e){}minifyPaths(e){this.traverseElements(e.root,t=>{t.tag==="path"&&t.attributes.d&&(t.attributes.d=t.attributes.d.replace(/\s+/g," ").replace(/([MLHVCSQTAZ])\s+/gi,"$1").trim());});}removeEmptyGroups(e){let t=r=>(r.children=r.children.filter(t),!(r.tag==="g"&&r.children.length===0&&!r.content));e.root.children=e.root.children.filter(t);}traverseElements(e,t){t(e),e.children.forEach(r=>this.traverseElements(r,t));}isValidColor(e){return !e||e==="none"||e==="transparent"||e==="currentColor"?false:/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(e)||/^rgba?\(.+\)$/.test(e)||/^hsla?\(.+\)$/.test(e)}deepCloneAst(e){return {...e,root:this.deepCloneElement(e.root)}}deepCloneElement(e){return {...e,attributes:{...e.attributes},children:e.children.map(t=>this.deepCloneElement(t))}}};var v=class{options;constructor(e={}){this.options={typescript:true,memo:true,forwardRef:true,exportDefault:true,componentName:"Icon",includeTypes:true,...e};}astToJsx(e){return this.elementToJsx(e.root,0)}elementToJsx(e,t=0){let r="  ".repeat(t+1),{tag:s,attributes:o,children:i,content:a}=e,l=this.attributesToJsx(o),c=l.length>0?" "+l.join(" "):"";if(i.length===0&&!a)return `${r}<${s}${c} />`;let p=`${r}<${s}${c}>`;return a&&(p+=a),i.length>0&&(p+=`
 `,p+=i.map(u=>this.elementToJsx(u,t+1)).join(`
 `),p+=`
 `+r),p+=`</${s}>`,p}attributesToJsx(e){return Object.entries(e).map(([t,r])=>{let s=this.convertAttributeName(t);return r.startsWith("{")&&r.endsWith("}")?`${s}=${r}`:`${s}="${r}"`})}convertAttributeName(e){let t={class:"className",for:"htmlFor",tabindex:"tabIndex",readonly:"readOnly",maxlength:"maxLength",cellpadding:"cellPadding",cellspacing:"cellSpacing",rowspan:"rowSpan",colspan:"colSpan",usemap:"useMap",frameborder:"frameBorder",contenteditable:"contentEditable"};return e.startsWith("aria-")||e.startsWith("data-")?e:e.includes("-")?e.replace(/-([a-z])/g,(r,s)=>s.toUpperCase()):t[e]||e}generateColorProps(e){return e.length===0?"":e.map(t=>{let r=t.variableName,s=`${r}Class`;return this.options.typescript?`  ${r}?: string;
   ${s}?: string;`:`  ${r}: PropTypes.string,
   ${s}: PropTypes.string,`}).join(`
-`)}generateColorDefaults(e){return e.length===0?"":e.map(t=>{let r=t.variableName,s=t.originalColor;return `${r} = "${s}"`}).join(", ")}getComponentName(){return this.options.componentName}generateFilename(e,t){return `${e}.${t}`}sanitizeComponentName(e){return e.replace(/[^a-zA-Z0-9_$]/g,"").replace(/^[0-9]/,"_$&")}};var w=class extends x{reactOptions;constructor(e={}){super(e),this.reactOptions={...this.options,memo:e.memo??true,forwardRef:e.forwardRef??true,propTypes:e.propTypes??false,defaultProps:e.defaultProps??false,namedExport:e.namedExport??false};}generate(e){let t=this.getComponentName(),{colorMappings:r,metadata:s}=e,o=this.generateImports(),i=this.generateInterfaces(r,s.features),a=this.generateComponent(e),c=this.generateExports(t),l=[o,i,a,c].filter(Boolean).join(`
+`)}generateColorDefaults(e){return e.length===0?"":e.map(t=>{let r=t.variableName,s=t.originalColor;return `${r} = "${s}"`}).join(", ")}getComponentName(){return this.options.componentName}generateFilename(e,t){return `${e}.${t}`}sanitizeComponentName(e){return e.replace(/[^a-zA-Z0-9_$]/g,"").replace(/^[0-9]/,"_$&")}};var R=class extends v{reactOptions;constructor(e={}){super(e),this.reactOptions={...this.options,memo:e.memo??true,forwardRef:e.forwardRef??true,propTypes:e.propTypes??false,defaultProps:e.defaultProps??false,namedExport:e.namedExport??false};}generate(e){let t=this.getComponentName(),{colorMappings:r,metadata:s}=e,o=this.generateImports(),i=this.generateInterfaces(r,s.features),a=this.generateComponent(e),l=this.generateExports(t),c=[o,i,a,l].filter(Boolean).join(`
 
-`),p=this.reactOptions.typescript?"tsx":"jsx",u=this.generateFilename(t,p);return {code:l,filename:u,componentName:t,dependencies:this.getDependencies()}}generateImports(){let e=[];return this.reactOptions.typescript?(e.push("import * as React from 'react';"),this.reactOptions.forwardRef?e.push("import { Ref, forwardRef, memo } from 'react';"):this.reactOptions.memo&&e.push("import { memo } from 'react';")):(e.push("import React from 'react';"),this.reactOptions.propTypes&&e.push("import PropTypes from 'prop-types';")),e.join(`
-`)}generateInterfaces(e,t){return !this.reactOptions.typescript&&!this.reactOptions.propTypes?"":this.reactOptions.typescript?this.generateTypeScriptInterface(e,t):this.generatePropTypes(e,t)}generateTypeScriptInterface(e,t){let r=["title?: string;","titleId?: string;","desc?: string;","descId?: string;"],s=this.generateColorProps(e);return s&&r.push(s),t.includes("fixed-stroke-width")&&r.push("isFixedStrokeWidth?: boolean;"),`interface ${this.getComponentName()}Props extends React.SVGProps<SVGSVGElement> {
+`),p=this.reactOptions.typescript?"tsx":"jsx",u=this.generateFilename(t,p);return {code:c,filename:u,componentName:t,dependencies:this.getDependencies()}}generateImports(){let e=[];return this.reactOptions.typescript?(e.push("import * as React from 'react';"),this.reactOptions.forwardRef?e.push("import { Ref, forwardRef, memo } from 'react';"):this.reactOptions.memo&&e.push("import { memo } from 'react';")):(e.push("import React from 'react';"),this.reactOptions.propTypes&&e.push("import PropTypes from 'prop-types';")),e.join(`
+`)}generateInterfaces(e,t){return !this.reactOptions.typescript&&!this.reactOptions.propTypes?"":this.reactOptions.typescript?this.generateTypeScriptInterface(e,t):this.generatePropTypes(e,t)}generateTypeScriptInterface(e,t){let r=["title?: string;","titleId?: string;","desc?: string;","descId?: string;","size?: string;"],s=this.generateColorProps(e);return s&&r.push(s),t.includes("fixed-stroke-width")&&r.push("isFixedStrokeWidth?: boolean;"),`interface ${this.getComponentName()}Props extends React.SVGProps<SVGSVGElement> {
   ${r.join(`
   `)}
-}`}generatePropTypes(e,t){let r=this.getComponentName(),s=["title: PropTypes.string,","titleId: PropTypes.string,","desc: PropTypes.string,","descId: PropTypes.string,","className: PropTypes.string,","style: PropTypes.object,","width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),","height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),"],o=this.generateColorProps(e);return o&&s.push(o),t.includes("fixed-stroke-width")&&s.push("isFixedStrokeWidth: PropTypes.bool,"),`${r}.propTypes = {
+}`}generatePropTypes(e,t){let r=this.getComponentName(),s=["title: PropTypes.string,","titleId: PropTypes.string,","desc: PropTypes.string,","descId: PropTypes.string,","size: PropTypes.string,","className: PropTypes.string,","style: PropTypes.object,","width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),","height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),"],o=this.generateColorProps(e);return o&&s.push(o),t.includes("fixed-stroke-width")&&s.push("isFixedStrokeWidth: PropTypes.bool,"),`${r}.propTypes = {
   ${s.join(`
   `)}
-};`}generateComponent(e){let t=this.getComponentName(),{colorMappings:r,metadata:s}=e,o=["title","titleId","desc","descId"],i=r.map(d=>d.variableName),a=r.map(d=>`${d.variableName}Class`),c=[...o,...i,...a];s.features.includes("fixed-stroke-width")&&c.push("isFixedStrokeWidth");let l=`{ ${c.join(", ")}, ...svgProps }`,p="{title ? <title id={titleId}>{title}</title> : null}",u="{desc ? <desc id={descId}>{desc}</desc> : null}";if(this.reactOptions.typescript){let d=`${t}Props`,C=this.reactOptions.forwardRef?", ref: Ref<SVGSVGElement>":"",G=e.ast.root.children.map(O=>this.elementToJsx(O,1)).join(`
-`);return `const ${t} = (${l}: ${d}${C}) => (
-  <svg
-    ${this.reactOptions.forwardRef?`ref={ref}
-    `:""}...svgProps
-  >
-    ${p}
-    ${u}
-${G}
-  </svg>
-);`}else {let d=e.ast.root.children.map(C=>this.elementToJsx(C,1)).join(`
-`);return `const ${t} = (${l}) => (
-  <svg {...svgProps}>
-    ${p}
-    ${u}
-${d}
-  </svg>
-);`}}generateExports(e){let t=[];return this.reactOptions.forwardRef?(t.push(`const ForwardRef = forwardRef(${e});`),this.reactOptions.memo?(t.push("const Memo = memo(ForwardRef);"),this.reactOptions.exportDefault&&t.push("export default Memo;"),this.reactOptions.namedExport&&t.push(`export { Memo as ${e} };`)):(this.reactOptions.exportDefault&&t.push("export default ForwardRef;"),this.reactOptions.namedExport&&t.push(`export { ForwardRef as ${e} };`))):this.reactOptions.memo?(t.push(`const Memo = memo(${e});`),this.reactOptions.exportDefault&&t.push("export default Memo;"),this.reactOptions.namedExport&&t.push(`export { Memo as ${e} };`)):(this.reactOptions.exportDefault&&t.push(`export default ${e};`),this.reactOptions.namedExport&&t.push(`export { ${e} };`)),t.join(`
-`)}getDependencies(){let e=["react"];return this.reactOptions.propTypes&&e.push("prop-types"),e}};var V=class extends x{vueOptions;constructor(e={}){super(e),this.vueOptions={...this.options,composition:e.composition??true,scriptSetup:e.scriptSetup??true,sfc:e.sfc??true,defineComponent:e.defineComponent??false};}generate(e){let t=this.getComponentName(),r;this.vueOptions.sfc?r=this.generateSFC(e):r=this.generateJSComponent(e);let s=this.vueOptions.sfc?"vue":this.vueOptions.typescript?"ts":"js",o=this.generateFilename(t,s);return {code:r,filename:o,componentName:t,dependencies:this.getDependencies()}}generateSFC(e){let t=this.generateTemplate(e),r=this.generateScript(e),s=this.generateStyle();return `<template>
+};`}generateComponent(e){let t=this.getComponentName(),{colorMappings:r,metadata:s}=e,o=["title","titleId","desc","descId","size"],i=r.map(f=>f.variableName),a=r.map(f=>`${f.variableName}Class`),l=[...o,...i,...a];s.features.includes("fixed-stroke-width")&&l.push("isFixedStrokeWidth");let u=['size = "20"',this.generateColorDefaults(r)].filter(Boolean).join(", "),h=u?`, ${u}`:"",x=`{ ${l.join(", ")}${h}, ...svgProps }`,C=this.generateSvgAttributes(e.ast),y="{title ? <title id={titleId}>{title}</title> : null}",g="{desc ? <desc id={descId}>{desc}</desc> : null}";if(this.reactOptions.typescript){let f=`${t}Props`,d=this.reactOptions.forwardRef?", ref: Ref<SVGSVGElement>":"",D=e.ast.root.children.map(N=>this.elementToJsx(N,1)).join(`
+`);return `const ${t} = (${x}: ${f}${d}) => {
+  const computedSize = size ? { width: size, height: size } : {};
+  
+  return (
+    <svg
+      ${this.reactOptions.forwardRef?`ref={ref}
+      `:""}${C}
+      {...computedSize}
+      {...svgProps}
+    >
+      ${y}
+      ${g}
+${D}
+    </svg>
+  );
+};`}else {let f=e.ast.root.children.map(d=>this.elementToJsx(d,1)).join(`
+`);return `const ${t} = (${x}) => {
+  const computedSize = size ? { width: size, height: size } : {};
+  
+  return (
+    <svg ${C}{...computedSize} {...svgProps}>
+      ${y}
+      ${g}
+${f}
+    </svg>
+  );
+};`}}generateExports(e){let t=[];return this.reactOptions.forwardRef?(t.push(`const ForwardRef = forwardRef(${e});`),this.reactOptions.memo?(t.push("const Memo = memo(ForwardRef);"),this.reactOptions.exportDefault&&t.push("export default Memo;"),this.reactOptions.namedExport&&t.push(`export { Memo as ${e} };`)):(this.reactOptions.exportDefault&&t.push("export default ForwardRef;"),this.reactOptions.namedExport&&t.push(`export { ForwardRef as ${e} };`))):this.reactOptions.memo?(t.push(`const Memo = memo(${e});`),this.reactOptions.exportDefault&&t.push("export default Memo;"),this.reactOptions.namedExport&&t.push(`export { Memo as ${e} };`)):(this.reactOptions.exportDefault&&t.push(`export default ${e};`),this.reactOptions.namedExport&&t.push(`export { ${e} };`)),t.join(`
+`)}getDependencies(){let e=["react"];return this.reactOptions.propTypes&&e.push("prop-types"),e}generateSvgAttributes(e){let t=[],r=e.root.attributes?.viewBox||e.viewBox;r&&t.push(`viewBox="${r}"`);let s=e.root.attributes?.xmlns||e.namespace;if(s&&t.push(`xmlns="${s}"`),!r){let o=e.root.attributes?.width||e.width,i=e.root.attributes?.height||e.height;o&&t.push(`width="${o}"`),i&&t.push(`height="${i}"`);}return t.length>0?t.join(`
+    `)+`
+    `:""}elementToJsx(e,t=0){let r="  ".repeat(t+1),{tag:s,attributes:o,children:i,content:a}=e,l=this.attributesToJsxWithClasses(o),c=l.length>0?" "+l.join(" "):"";if(i.length===0&&!a)return `${r}<${s}${c} />`;let p=`${r}<${s}${c}>`;return a&&(p+=a),i.length>0&&(p+=`
+`,p+=i.map(u=>this.elementToJsx(u,t+1)).join(`
+`),p+=`
+`+r),p+=`</${s}>`,p}attributesToJsxWithClasses(e){let t=[];return Object.entries(e).forEach(([r,s])=>{let o=this.convertAttributeName(r);if((r==="fill"||r==="stroke")&&s.startsWith("{")&&s.endsWith("}")){let i=s.slice(1,-1);t.push(`${o}=${s}`);let a=`${i}Class`;t.push(`className={${a}}`);}else s.startsWith("{")&&s.endsWith("}")?t.push(`${o}=${s}`):t.push(`${o}="${s}"`);}),t}};var G=class extends v{vueOptions;constructor(e={}){super(e),this.vueOptions={...this.options,composition:e.composition??true,scriptSetup:e.scriptSetup??true,sfc:e.sfc??true,defineComponent:e.defineComponent??false};}generate(e){let t=this.getComponentName(),r;this.vueOptions.sfc?r=this.generateSFC(e):r=this.generateJSComponent(e);let s=this.vueOptions.sfc?"vue":this.vueOptions.typescript?"ts":"js",o=this.generateFilename(t,s);return {code:r,filename:o,componentName:t,dependencies:this.getDependencies()}}generateSFC(e){let t=this.generateTemplate(e),r=this.generateScript(e),s=this.generateStyle();return `<template>
 ${t}
 </template>
 
@@ -44,20 +59,20 @@ ${this.vueOptions.scriptSetup?`defineOptions({ inheritAttrs: false });
 
 ${s?`<style scoped>
 ${s}
-</style>`:""}`}generateJSComponent(e){return this.vueOptions.composition?this.generateCompositionAPI(e):this.generateOptionsAPI(e)}generateTemplate(e){let{ast:t}=e;return `  <svg v-bind="$attrs">
+</style>`:""}`}generateJSComponent(e){return this.vueOptions.composition?this.generateCompositionAPI(e):this.generateOptionsAPI(e)}generateTemplate(e){let{ast:t}=e;return `  <svg v-bind="$attrs" :width="props.size || undefined" :height="props.size || undefined">
     <title v-if="props.title" :id="props.titleId">{{ props.title }}</title>
     <desc v-if="props.desc" :id="props.descId">{{ props.desc }}</desc>
 ${t.root.children.map(s=>this.elementToVueTemplate(s,2)).join(`
 `)}
-  </svg>`}elementToVueTemplate(e,t=0){let r="  ".repeat(t),{tag:s,attributes:o,children:i,content:a}=e,c=Object.entries(o).map(([u,d])=>`${u}="${d}"`).join(" "),l=c?" "+c:"";if(i.length===0&&!a)return `${r}<${s}${l} />`;let p=`${r}<${s}${l}>`;return a&&(p+=a),i.length>0&&(p+=`
+  </svg>`}elementToVueTemplate(e,t=0){let r="  ".repeat(t),{tag:s,attributes:o,children:i,content:a}=e,l=[];Object.entries(o).forEach(([u,h])=>{if(h.startsWith("{")&&h.endsWith("}")){let x=h.slice(1,-1);if(l.push(`:${u}="props.${x}"`),u==="fill"||u==="stroke"){let C=`${x}Class`;l.push(`:class="props.${C}"`);}}else l.push(`${u}="${h}"`);});let c=l.length>0?" "+l.join(" "):"";if(i.length===0&&!a)return `${r}<${s}${c} />`;let p=`${r}<${s}${c}>`;return a&&(p+=a),i.length>0&&(p+=`
 `,p+=i.map(u=>this.elementToVueTemplate(u,t+1)).join(`
 `),p+=`
-`+r),p+=`</${s}>`,p}generateScript(e){return this.vueOptions.scriptSetup?this.generateScriptSetup(e):this.vueOptions.composition?this.generateCompositionAPI(e):this.generateOptionsAPI(e)}generateScriptSetup(e){let{colorMappings:t,metadata:r}=e,s=[];if(this.vueOptions.typescript){s.push("interface Props extends SVGAttributes {"),s.push("  title?: string;"),s.push("  titleId?: string;"),s.push("  desc?: string;"),s.push("  descId?: string;");let o=this.generateColorPropsInterface(t);o&&s.push(o),r.features.includes("fixed-stroke-width")&&s.push("  isFixedStrokeWidth?: boolean;"),s.push("}"),s.push(""),s.push("const props = withDefaults(defineProps<Props>(), {");}else s.push("const props = defineProps({"),s.push("  title: { type: String, default: undefined },"),s.push("  titleId: { type: String, default: undefined },"),s.push("  desc: { type: String, default: undefined },"),s.push("  descId: { type: String, default: undefined },"),s.push("  class: { type: String, default: undefined },"),s.push("  style: { type: Object, default: undefined },"),s.push("  width: { type: [String, Number], default: undefined },"),s.push("  height: { type: [String, Number], default: undefined },");return t.forEach(o=>{let i=o.variableName,a=o.originalColor,c=`${i}Class`;this.vueOptions.typescript?(s.push(`  ${i}: '${a}',`),s.push(`  ${c}: undefined,`)):(s.push(`  ${i}: { type: String, default: '${a}' },`),s.push(`  ${c}: { type: String, default: undefined },`));}),r.features.includes("fixed-stroke-width")&&(this.vueOptions.typescript?s.push("  isFixedStrokeWidth: false,"):s.push("  isFixedStrokeWidth: { type: Boolean, default: false },")),s.push("});"),s.join(`
-`)}generateCompositionAPI(e){let{colorMappings:t,metadata:r}=e,s=this.getComponentName(),o=[];return o.push("import { defineComponent } from 'vue';"),o.push(""),o.push("export default defineComponent({"),o.push(`  name: '${s}',`),o.push("  props: {"),o.push("    title: { type: String, default: undefined },"),o.push("    titleId: { type: String, default: undefined },"),o.push("    desc: { type: String, default: undefined },"),o.push("    descId: { type: String, default: undefined },"),o.push("    class: { type: String, default: undefined },"),o.push("    style: { type: Object, default: undefined },"),o.push("    width: { type: [String, Number], default: undefined },"),o.push("    height: { type: [String, Number], default: undefined },"),t.forEach(i=>{let a=i.variableName,c=i.originalColor,l=`${a}Class`;o.push(`    ${a}: { type: String, default: '${c}' },`),o.push(`    ${l}: { type: String, default: undefined },`);}),r.features.includes("fixed-stroke-width")&&o.push("    isFixedStrokeWidth: { type: Boolean, default: false },"),o.push("  },"),o.push("  setup() {"),o.push("    return {};"),o.push("  },"),o.push("});"),o.join(`
-`)}generateOptionsAPI(e){let{colorMappings:t,metadata:r}=e,s=this.getComponentName(),o=[];return o.push("export default {"),o.push(`  name: '${s}',`),o.push("  props: {"),o.push("    title: { type: String, default: undefined },"),o.push("    titleId: { type: String, default: undefined },"),o.push("    desc: { type: String, default: undefined },"),o.push("    descId: { type: String, default: undefined },"),o.push("    class: { type: String, default: undefined },"),o.push("    style: { type: Object, default: undefined },"),o.push("    width: { type: [String, Number], default: undefined },"),o.push("    height: { type: [String, Number], default: undefined },"),t.forEach(i=>{let a=i.variableName,c=i.originalColor,l=`${a}Class`;o.push(`    ${a}: { type: String, default: '${c}' },`),o.push(`    ${l}: { type: String, default: undefined },`);}),r.features.includes("fixed-stroke-width")&&o.push("    isFixedStrokeWidth: { type: Boolean, default: false },"),o.push("  },"),o.push("};"),o.join(`
+`+r),p+=`</${s}>`,p}generateScript(e){return this.vueOptions.scriptSetup?this.generateScriptSetup(e):this.vueOptions.composition?this.generateCompositionAPI(e):this.generateOptionsAPI(e)}generateScriptSetup(e){let{colorMappings:t,metadata:r}=e,s=[];if(this.vueOptions.typescript){s.push("interface Props extends SVGAttributes {"),s.push("  title?: string;"),s.push("  titleId?: string;"),s.push("  desc?: string;"),s.push("  descId?: string;"),s.push("  size?: string;");let o=this.generateColorPropsInterface(t);o&&s.push(o),r.features.includes("fixed-stroke-width")&&s.push("  isFixedStrokeWidth?: boolean;"),s.push("}"),s.push(""),s.push("const props = withDefaults(defineProps<Props>(), {");}else s.push("const props = defineProps({"),s.push("  title: { type: String, default: undefined },"),s.push("  titleId: { type: String, default: undefined },"),s.push("  desc: { type: String, default: undefined },"),s.push("  descId: { type: String, default: undefined },"),s.push("  class: { type: String, default: undefined },"),s.push("  style: { type: Object, default: undefined },"),s.push("  width: { type: [String, Number], default: undefined },"),s.push("  height: { type: [String, Number], default: undefined },"),s.push('  size: { type: String, default: "20" },');return this.vueOptions.typescript&&s.push('  size: "20",'),t.forEach(o=>{let i=o.variableName,a=o.originalColor,l=`${i}Class`;this.vueOptions.typescript?(s.push(`  ${i}: '${a}',`),s.push(`  ${l}: undefined,`)):(s.push(`  ${i}: { type: String, default: '${a}' },`),s.push(`  ${l}: { type: String, default: undefined },`));}),r.features.includes("fixed-stroke-width")&&(this.vueOptions.typescript?s.push("  isFixedStrokeWidth: false,"):s.push("  isFixedStrokeWidth: { type: Boolean, default: false },")),s.push("});"),s.join(`
+`)}generateCompositionAPI(e){let{colorMappings:t,metadata:r}=e,s=this.getComponentName(),o=[];return o.push("import { defineComponent } from 'vue';"),o.push(""),o.push("export default defineComponent({"),o.push(`  name: '${s}',`),o.push("  props: {"),o.push("    title: { type: String, default: undefined },"),o.push("    titleId: { type: String, default: undefined },"),o.push("    desc: { type: String, default: undefined },"),o.push("    descId: { type: String, default: undefined },"),o.push("    class: { type: String, default: undefined },"),o.push("    style: { type: Object, default: undefined },"),o.push("    width: { type: [String, Number], default: undefined },"),o.push("    height: { type: [String, Number], default: undefined },"),t.forEach(i=>{let a=i.variableName,l=i.originalColor,c=`${a}Class`;o.push(`    ${a}: { type: String, default: '${l}' },`),o.push(`    ${c}: { type: String, default: undefined },`);}),r.features.includes("fixed-stroke-width")&&o.push("    isFixedStrokeWidth: { type: Boolean, default: false },"),o.push("  },"),o.push("  setup() {"),o.push("    return {};"),o.push("  },"),o.push("});"),o.join(`
+`)}generateOptionsAPI(e){let{colorMappings:t,metadata:r}=e,s=this.getComponentName(),o=[];return o.push("export default {"),o.push(`  name: '${s}',`),o.push("  props: {"),o.push("    title: { type: String, default: undefined },"),o.push("    titleId: { type: String, default: undefined },"),o.push("    desc: { type: String, default: undefined },"),o.push("    descId: { type: String, default: undefined },"),o.push("    class: { type: String, default: undefined },"),o.push("    style: { type: Object, default: undefined },"),o.push("    width: { type: [String, Number], default: undefined },"),o.push("    height: { type: [String, Number], default: undefined },"),t.forEach(i=>{let a=i.variableName,l=i.originalColor,c=`${a}Class`;o.push(`    ${a}: { type: String, default: '${l}' },`),o.push(`    ${c}: { type: String, default: undefined },`);}),r.features.includes("fixed-stroke-width")&&o.push("    isFixedStrokeWidth: { type: Boolean, default: false },"),o.push("  },"),o.push("};"),o.join(`
 `)}generateStyle(){return ""}generateColorPropsInterface(e){return e.length===0?"":e.map(t=>{let r=t.variableName,s=`${r}Class`;return `  ${r}?: string;
   ${s}?: string;`}).join(`
-`)}getDependencies(){return ["vue"]}};var R=class{parser;transformer;constructor(){this.parser=new y,this.transformer=new E;}convert(e,t){try{let r=this.parser.parse(e),s=this.transformer.transform(r,t.transformation),o;return t.framework==="react"?o=new w(t.generator):o=new V(t.generator),{...o.generate(s),metadata:s.metadata}}catch(r){throw new Error(`SVG conversion failed: ${r instanceof Error?r.message:String(r)}`)}}extractColors(e){let t=this.parser.parse(e),r=this.parser.extractColors(t);return Array.from(new Set(r.map(s=>s.value))).sort()}validate(e){let t=[];try{let r=this.parser.parse(e);r.root||t.push("No root SVG element found"),!r.viewBox&&!r.width&&!r.height&&t.push("SVG should have viewBox or width/height attributes");}catch(r){t.push(r instanceof Error?r.message:String(r));}return {valid:t.length===0,errors:t}}};async function N(n,e={}){return new R().convert(n,{...e,framework:"react"})}async function D(n,e={}){return new R().convert(n,{...e,framework:"vue"})}var W={plugins:[{name:"preset-default",params:{overrides:{removeViewBox:false,removeTitle:false,removeDesc:false,removeUselessStrokeAndFill:false,convertColors:{currentColor:true,names2hex:true,rgb2hex:true,shorthex:true,shortname:true}}}},"removeDimensions","cleanupNumericValues"]};function z(n,e=W){try{return svgo.optimize(n,e).data}catch(t){throw new Error(`Failed to optimize SVG: ${t}`)}}function J(n){let e=[{name:"preset-default",params:{overrides:{removeViewBox:!n.removeViewBox,removeTitle:!n.removeTitle,removeDesc:!n.removeDesc,removeUselessStrokeAndFill:!n.preserveClasses,convertColors:n.preserveColors?false:{currentColor:true,names2hex:true,rgb2hex:true,shorthex:true,shortname:true}}}},"cleanupNumericValues"];return n.removeDimensions!==false&&e.push("removeDimensions"),{plugins:e}}async function Q(n){try{return await promises.readFile(n,"utf-8")}catch(e){throw new Error(`Failed to read SVG file: ${n}. ${e}`)}}async function K(n,e){try{await M(path.dirname(n)),await promises.writeFile(n,e,"utf-8");}catch(t){throw new Error(`Failed to write SVG file: ${n}. ${t}`)}}async function X(n,e){try{await M(path.dirname(n)),await promises.writeFile(n,e,"utf-8");}catch(t){throw new Error(`Failed to write component file: ${n}. ${t}`)}}async function F(n,e=false){try{let t=await promises.readdir(n),r=[];for(let s of t){let o=path.join(n,s),i=await promises.stat(o);if(i.isDirectory()&&e){let a=await F(o,e);r.push(...a);}else i.isFile()&&path.extname(s).toLowerCase()===".svg"&&r.push(o);}return r}catch(t){throw new Error(`Failed to read directory: ${n}. ${t}`)}}async function M(n){fs.existsSync(n)||await promises.mkdir(n,{recursive:true});}var v=n=>n.match(/[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*[a-z]*|[A-Z]|[0-9]+[a-z]*/g)?.map(e=>e.charAt(0).toUpperCase()+e.slice(1).toLowerCase()).join("")||"";function Y(n){let e=n.replace(/\.svg$/i,"");return e=ee(e),v(e)}function ee(n){let e=n.toLowerCase().replace(/[^a-zA-Z0-9]/g," ");return e=e.replace(/\s+/g," ").trim(),e}function te(n){return v(n.replace(/[^a-zA-Z0-9]/g," "))}function re(n,e,t){let r=e?v(e):"",s=t?v(t):"",o=v(n);return `${r}${o}${s}`}function se(n,e){let{format:t,exportType:r,typescript:s}=e,o=[...n].sort((i,a)=>i.componentName.localeCompare(a.componentName));return r==="default"?ne(o):oe(o,t,s)}function oe(n,e,t){let r="";r+=`// Auto-generated index file for tree-shaking
+`)}getDependencies(){return ["vue"]}};var O=class{parser;transformer;constructor(){this.parser=new b,this.transformer=new V;}convert(e,t){try{let r=this.parser.parse(e),s=this.transformer.transform(r,t.transformation),o;return t.framework==="react"?o=new R(t.generator):o=new G(t.generator),{...o.generate(s),metadata:s.metadata}}catch(r){throw new Error(`SVG conversion failed: ${r instanceof Error?r.message:String(r)}`)}}extractColors(e){let t=this.parser.parse(e),r=this.parser.extractColors(t);return Array.from(new Set(r.map(s=>s.value))).sort()}validate(e){let t=[];try{let r=this.parser.parse(e);r.root||t.push("No root SVG element found"),!r.viewBox&&!r.width&&!r.height&&t.push("SVG should have viewBox or width/height attributes");}catch(r){t.push(r instanceof Error?r.message:String(r));}return {valid:t.length===0,errors:t}}};async function j(n,e={}){return new O().convert(n,{...e,framework:"react"})}async function z(n,e={}){return new O().convert(n,{...e,framework:"vue"})}var B={plugins:[{name:"preset-default",params:{overrides:{removeViewBox:false,removeTitle:false,removeDesc:false,removeUselessStrokeAndFill:false,convertColors:{currentColor:true,names2hex:true,rgb2hex:true,shorthex:true,shortname:true}}}},"removeDimensions","cleanupNumericValues"]};function J(n,e=B){try{return svgo.optimize(n,e).data}catch(t){throw new Error(`Failed to optimize SVG: ${t}`)}}function q(n){let e=[{name:"preset-default",params:{overrides:{removeViewBox:!n.removeViewBox,removeTitle:!n.removeTitle,removeDesc:!n.removeDesc,removeUselessStrokeAndFill:!n.preserveClasses,convertColors:n.preserveColors?false:{currentColor:true,names2hex:true,rgb2hex:true,shorthex:true,shortname:true}}}},"cleanupNumericValues"];return n.removeDimensions!==false&&e.push("removeDimensions"),{plugins:e}}async function X(n){try{return await promises.readFile(n,"utf-8")}catch(e){throw new Error(`Failed to read SVG file: ${n}. ${e}`)}}async function Y(n,e){try{await M(path.dirname(n)),await promises.writeFile(n,e,"utf-8");}catch(t){throw new Error(`Failed to write SVG file: ${n}. ${t}`)}}async function ee(n,e){try{await M(path.dirname(n)),await promises.writeFile(n,e,"utf-8");}catch(t){throw new Error(`Failed to write component file: ${n}. ${t}`)}}async function F(n,e=false){try{let t=await promises.readdir(n),r=[];for(let s of t){let o=path.join(n,s),i=await promises.stat(o);if(i.isDirectory()&&e){let a=await F(o,e);r.push(...a);}else i.isFile()&&path.extname(s).toLowerCase()===".svg"&&r.push(o);}return r}catch(t){throw new Error(`Failed to read directory: ${n}. ${t}`)}}async function M(n){fs.existsSync(n)||await promises.mkdir(n,{recursive:true});}var $=n=>n.match(/[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*[a-z]*|[A-Z]|[0-9]+[a-z]*/g)?.map(e=>e.charAt(0).toUpperCase()+e.slice(1).toLowerCase()).join("")||"";function te(n){let e=n.replace(/\.svg$/i,"");return e=re(e),$(e)}function re(n){let e=n.toLowerCase().replace(/[^a-zA-Z0-9]/g," ");return e=e.replace(/\s+/g," ").trim(),e}function se(n){return $(n.replace(/[^a-zA-Z0-9]/g," "))}function oe(n,e,t){let r=e?$(e):"",s=t?$(t):"",o=$(n);return `${r}${o}${s}`}function ne(n,e){let{format:t,exportType:r,typescript:s}=e,o=[...n].sort((i,a)=>i.componentName.localeCompare(a.componentName));return r==="default"?ae(o):ie(o,t,s)}function ie(n,e,t){let r="";r+=`// Auto-generated index file for tree-shaking
 `,r+=`// This file exports all components for optimal bundling
 
 `;for(let s of n){let o=T(s.filename);r+=`export { default as ${s.componentName} } from './${o}';
@@ -67,7 +82,7 @@ ${t.root.children.map(s=>this.elementToVueTemplate(s,2)).join(`
 `,r+=`export type IconComponents = {
 `;for(let s of n)r+=`  ${s.componentName}: IconComponent;
 `;r+=`};
-`;}return r}function ne(n,e,t){let r="";r+=`// Auto-generated index file
+`;}return r}function ae(n,e,t){let r="";r+=`// Auto-generated index file
 `,r+=`// Warning: Default exports are less tree-shakeable
 
 `;for(let s of n){let o=T(s.filename);r+=`import ${s.componentName} from './${o}';
@@ -78,7 +93,7 @@ export default {
 `,r+=`
 // Individual exports for flexibility
 `;for(let s of n)r+=`export { default as ${s.componentName} } from './${T(s.filename)}';
-`;return r}function T(n){return n.replace(/\.(tsx?|jsx?|vue)$/,"")}function I(n){let e=new Set,t=new Set,r=new Set,s=new Set,o=[/fill="([^"]*?)"/g,/fill='([^']*?)'/g,/fill:\s*([^;}\s]+)/g],i=[/stroke="([^"]*?)"/g,/stroke='([^']*?)'/g,/stroke:\s*([^;}\s]+)/g],a=[/stop-color="([^"]*?)"/g,/stop-color='([^']*?)'/g,/stop-color:\s*([^;}\s]+)/g];o.forEach(m=>{let h;for(;(h=m.exec(n))!==null;){let f=h[1].trim();k(f)&&(e.add(f),s.add(f));}}),i.forEach(m=>{let h;for(;(h=m.exec(n))!==null;){let f=h[1].trim();k(f)&&(t.add(f),s.add(f));}}),a.forEach(m=>{let h;for(;(h=m.exec(n))!==null;){let f=h[1].trim();k(f)&&(r.add(f),s.add(f));}});let c=Array.from(e).sort(),l=Array.from(t).sort(),p=Array.from(r).sort(),u=Array.from(s).sort(),d=new Map,C=new Map,G=new Map,O=new Map;return u.forEach((m,h)=>{let f=h===0?"color":`color${h+1}`;O.set(m,f),c.includes(m)&&d.set(m,f),l.includes(m)&&C.set(m,f),p.includes(m)&&G.set(m,f);}),{colors:u,colorMap:O,fillColors:c,strokeColors:l,gradientColors:p,fillColorMap:d,strokeColorMap:C,gradientColorMap:G}}function ie(n){let e=I(n),t=new Map,r=/<(path|circle|rect|ellipse|line|polyline|polygon)[^>]*>/g,s;for(;(s=r.exec(n))!==null;){let o=s[0],i=o.match(/d="([^"]*?)"/),a=o.match(/fill="([^"]*?)"/);if(i&&a){let c=i[1].substring(0,50),l=a[1],p=e.colorMap.get(l);p&&t.set(c,p);}}return {colorInfo:e,elementColorMap:t}}function ae(n,e,t){let r=n,s=t==="react"?/(<path[^>]*d="([^"]{1,50})[^"]*"[^>]*fill=){[^}]*currentColor[^}]*}([^>]*>)/g:/(<path[^>]*d="([^"]{1,50})[^"]*"[^>]*fill=)"currentColor"([^>]*>)/g;return r=r.replace(s,(o,i,a,c)=>{let l=e.get(a);return l?t==="react"?`${i}{${l}}${c}`:`${i}"${l}"${c}`:o}),r}function le(n,e){return n.length===0?"":n.map((r,s)=>{let o=s===0?"color":`color${s+1}`,i=`${o}Class`;return e==="react"?`  ${o}?: string;
+`;return r}function T(n){return n.replace(/\.(tsx?|jsx?|vue)$/,"")}function I(n){let e=new Set,t=new Set,r=new Set,s=new Set,o=[/fill="([^"]*?)"/g,/fill='([^']*?)'/g,/fill:\s*([^;}\s]+)/g],i=[/stroke="([^"]*?)"/g,/stroke='([^']*?)'/g,/stroke:\s*([^;}\s]+)/g],a=[/stop-color="([^"]*?)"/g,/stop-color='([^']*?)'/g,/stop-color:\s*([^;}\s]+)/g];o.forEach(g=>{let f;for(;(f=g.exec(n))!==null;){let d=f[1].trim();A(d)&&(e.add(d),s.add(d));}}),i.forEach(g=>{let f;for(;(f=g.exec(n))!==null;){let d=f[1].trim();A(d)&&(t.add(d),s.add(d));}}),a.forEach(g=>{let f;for(;(f=g.exec(n))!==null;){let d=f[1].trim();A(d)&&(r.add(d),s.add(d));}});let l=Array.from(e).sort(),c=Array.from(t).sort(),p=Array.from(r).sort(),u=Array.from(s).sort(),h=new Map,x=new Map,C=new Map,y=new Map;return u.forEach((g,f)=>{let d=f===0?"color":`color${f+1}`;y.set(g,d),l.includes(g)&&h.set(g,d),c.includes(g)&&x.set(g,d),p.includes(g)&&C.set(g,d);}),{colors:u,colorMap:y,fillColors:l,strokeColors:c,gradientColors:p,fillColorMap:h,strokeColorMap:x,gradientColorMap:C}}function le(n){let e=I(n),t=new Map,r=/<(path|circle|rect|ellipse|line|polyline|polygon)[^>]*>/g,s;for(;(s=r.exec(n))!==null;){let o=s[0],i=o.match(/d="([^"]*?)"/),a=o.match(/fill="([^"]*?)"/);if(i&&a){let l=i[1].substring(0,50),c=a[1],p=e.colorMap.get(c);p&&t.set(l,p);}}return {colorInfo:e,elementColorMap:t}}function pe(n,e,t){let r=n,s=t==="react"?/(<path[^>]*d="([^"]{1,50})[^"]*"[^>]*fill=){[^}]*currentColor[^}]*}([^>]*>)/g:/(<path[^>]*d="([^"]{1,50})[^"]*"[^>]*fill=)"currentColor"([^>]*>)/g;return r=r.replace(s,(o,i,a,l)=>{let c=e.get(a);return c?t==="react"?`${i}{${c}}${l}`:`${i}"${c}"${l}`:o}),r}function ce(n,e){return n.length===0?"":n.map((r,s)=>{let o=s===0?"color":`color${s+1}`,i=`${o}Class`;return e==="react"?`  ${o}?: string;
   ${i}?: string;`:`    ${o}: { type: String, default: 'currentColor' },
     ${i}: { type: String, default: '' },`}).join(`
-`)}function k(n){return !n||n==="none"||n==="transparent"||n==="currentColor"?false:/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(n)||/^rgba?\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*(?:,\s*[\d.]+\s*)?\)$/.test(n)||/^hsla?\(\s*\d+\s*,\s*\d+%\s*,\s*\d+%\s*(?:,\s*[\d.]+\s*)?\)$/.test(n)?true:["red","green","blue","yellow","orange","purple","pink","brown","black","white","gray","grey","cyan","magenta","lime","maroon","navy","olive","silver","teal","aqua","fuchsia"].includes(n.toLowerCase())}exports.AccessibilityFeature=$;exports.ColorSplittingFeature=S;exports.ComponentGenerator=x;exports.ReactGenerator=w;exports.SVGFusion=R;exports.SVGParser=y;exports.SVGTransformer=E;exports.StrokeFixingFeature=b;exports.VueGenerator=V;exports.convertToReact=N;exports.convertToVue=D;exports.createSvgoConfig=J;exports.extractColors=I;exports.extractColorsWithElementMapping=ie;exports.formatComponentName=re;exports.generateColorProps=le;exports.generateIndexFile=se;exports.optimizeSvg=z;exports.pascalCase=v;exports.readSvgDirectory=F;exports.readSvgFile=Q;exports.replaceCurrentColorWithVariables=ae;exports.sanitizeComponentName=te;exports.svgToComponentName=Y;exports.writeComponentFile=X;exports.writeSvgFile=K;
+`)}function A(n){return !n||n==="none"||n==="transparent"||n==="currentColor"?false:/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(n)||/^rgba?\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*(?:,\s*[\d.]+\s*)?\)$/.test(n)||/^hsla?\(\s*\d+\s*,\s*\d+%\s*,\s*\d+%\s*(?:,\s*[\d.]+\s*)?\)$/.test(n)?true:["red","green","blue","yellow","orange","purple","pink","brown","black","white","gray","grey","cyan","magenta","lime","maroon","navy","olive","silver","teal","aqua","fuchsia"].includes(n.toLowerCase())}exports.AccessibilityFeature=w;exports.ColorSplittingFeature=S;exports.ComponentGenerator=v;exports.ReactGenerator=R;exports.SVGFusion=O;exports.SVGParser=b;exports.SVGTransformer=V;exports.StrokeFixingFeature=E;exports.VueGenerator=G;exports.convertToReact=j;exports.convertToVue=z;exports.createSvgoConfig=q;exports.extractColors=I;exports.extractColorsWithElementMapping=le;exports.formatComponentName=oe;exports.generateColorProps=ce;exports.generateIndexFile=ne;exports.optimizeSvg=J;exports.pascalCase=$;exports.readSvgDirectory=F;exports.readSvgFile=X;exports.replaceCurrentColorWithVariables=pe;exports.sanitizeComponentName=se;exports.svgToComponentName=te;exports.writeComponentFile=ee;exports.writeSvgFile=Y;

package/dist/index.mjs

@@ -1,38 +1,53 @@
-import {optimize}from'svgo';import {readFile,writeFile,readdir,stat,mkdir}from'fs/promises';import {dirname,join,extname}from'path';import {existsSync}from'fs';var S=class{parse(e){let t=this.cleanSvgContent(e),r=this.parseElement(t);return {root:r,viewBox:r.attributes.viewBox,width:r.attributes.width,height:r.attributes.height,namespace:r.attributes.xmlns}}extractColors(e){let t=[];return this.traverseElements(e.root,r=>{r.attributes.fill&&this.isValidColor(r.attributes.fill)&&t.push({value:r.attributes.fill,type:"fill",element:r,attribute:"fill"}),r.attributes.stroke&&this.isValidColor(r.attributes.stroke)&&t.push({value:r.attributes.stroke,type:"stroke",element:r,attribute:"stroke"}),r.attributes["stop-color"]&&this.isValidColor(r.attributes["stop-color"])&&t.push({value:r.attributes["stop-color"],type:"stop-color",element:r,attribute:"stop-color"});}),t}cleanSvgContent(e){return e.replace(/<\?xml[^>]*\?>/gi,"").replace(/<!--[\s\S]*?-->/g,"").trim()}parseElement(e){let t=e.match(/<svg([^>]*)>/i);if(!t)throw new Error("Invalid SVG: No svg element found");let r=this.parseAttributes(t[1]),s=this.parseChildren(e);return {tag:"svg",attributes:r,children:s}}parseAttributes(e){let t={},r=/(\w+(?:-\w+)*)=["']([^"']*)["']/g,s;for(;(s=r.exec(e))!==null;)t[s[1]]=s[2];return t}parseChildren(e){let t=[],r=e.match(/<svg[^>]*>(.*)<\/svg>/is);if(!r||!r[1])return t;let s=r[1],o=/<(\w+(?::\w+)?)([^>]*?)(?:\s*\/\s*>|>(.*?)<\/\1\s*>)/gs,i;for(;(i=o.exec(s))!==null;){let[,a,c,l]=i,p=this.parseAttributes(c),u={tag:a,attributes:p,children:[]};l!==void 0&&(l.includes("<")?u.children=this.parseNestedElements(l):l.trim()&&(u.content=l.trim())),t.push(u);}return t}parseNestedElements(e){let t=[],r=/<(\w+(?::\w+)?)([^>]*?)(?:\s*\/\s*>|>(.*?)<\/\1\s*>)/gs,s;for(;(s=r.exec(e))!==null;){let[,o,i,a]=s,c=this.parseAttributes(i),l={tag:o,attributes:c,children:[]};a!==void 0&&(a.includes("<")?l.children=this.parseNestedElements(a):a.trim()&&(l.content=a.trim())),t.push(l);}return t}traverseElements(e,t){t(e),e.children.forEach(r=>this.traverseElements(r,t));}isValidColor(e){return !e||e==="none"||e==="transparent"||e==="currentColor"?false:/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(e)||/^rgba?\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*(?:,\s*[\d.]+\s*)?\)$/.test(e)||/^hsla?\(\s*\d+\s*,\s*\d+%\s*,\s*\d+%\s*(?:,\s*[\d.]+\s*)?\)$/.test(e)?true:["red","green","blue","black","white","yellow","cyan","magenta"].includes(e.toLowerCase())}};var b=class{options;constructor(e={}){this.options={preserveOriginalNames:e.preserveOriginalNames??false,generateClasses:e.generateClasses??true,colorPrefix:e.colorPrefix??"color"};}extractColors(e){let t=[];this.traverseElement(e,t);let r=new Map;return t.forEach(s=>{this.isValidColor(s.value)&&r.set(s.value,s);}),Array.from(r.values()).sort((s,o)=>s.value.localeCompare(o.value))}apply(e){let t=this.extractColors(e),r=this.generateColorMappings(t),s=this.replaceColorsWithVariables(e,r);return {mappings:r,processedElement:s,originalColors:t.map(o=>o.value)}}generateColorMappings(e){return e.map((t,r)=>({originalColor:t.value,variableName:r===0?this.options.colorPrefix:`${this.options.colorPrefix}${r+1}`,type:t.type}))}replaceColorsWithVariables(e,t){let r=new Map(t.map(s=>[s.originalColor,s.variableName]));return this.transformElement(e,s=>{let o={...s.attributes};return o.fill&&r.has(o.fill)&&(o.fill=`{${r.get(o.fill)}}`),o.stroke&&r.has(o.stroke)&&(o.stroke=`{${r.get(o.stroke)}}`),o["stop-color"]&&r.has(o["stop-color"])&&(o["stop-color"]=`{${r.get(o["stop-color"])}}`),{...s,attributes:o}})}traverseElement(e,t){e.attributes.fill&&t.push({value:e.attributes.fill,type:"fill",element:e,attribute:"fill"}),e.attributes.stroke&&t.push({value:e.attributes.stroke,type:"stroke",element:e,attribute:"stroke"}),e.attributes["stop-color"]&&t.push({value:e.attributes["stop-color"],type:"stop-color",element:e,attribute:"stop-color"}),e.children.forEach(r=>this.traverseElement(r,t));}transformElement(e,t){let r=t(e);return {...r,children:r.children.map(s=>this.transformElement(s,t))}}isValidColor(e){return !e||e==="none"||e==="transparent"||e==="currentColor"?false:/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(e)||/^rgba?\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*(?:,\s*[\d.]+\s*)?\)$/.test(e)||/^hsla?\(\s*\d+\s*,\s*\d+%\s*,\s*\d+%\s*(?:,\s*[\d.]+\s*)?\)$/.test(e)?true:["red","green","blue","yellow","orange","purple","pink","brown","black","white","gray","grey","cyan","magenta","lime","navy"].includes(e.toLowerCase())}};var $=class{options;constructor(e={}){this.options={preserveExisting:e.preserveExisting??true,onlyIfStrokePresent:e.onlyIfStrokePresent??true};}apply(e){let t=0;return {processedElement:this.transformElement(e,s=>this.shouldAddVectorEffect(s)?(t++,{...s,attributes:{...s.attributes,"vector-effect":"non-scaling-stroke"}}):s),elementsModified:t}}shouldAddVectorEffect(e){return this.options.preserveExisting&&e.attributes["vector-effect"]||this.options.onlyIfStrokePresent&&!(e.attributes.stroke&&e.attributes.stroke!=="none"&&e.attributes.stroke!=="transparent")?false:["path","line","polyline","polygon","rect","circle","ellipse"].includes(e.tag)}transformElement(e,t){let r=t(e);return {...r,children:r.children.map(s=>this.transformElement(s,t))}}};var E=class{options;constructor(e={}){this.options={addRole:e.addRole??true,addAriaHidden:e.addAriaHidden??false,addTitle:e.addTitle??true,addDesc:e.addDesc??true,defaultRole:e.defaultRole??"img",preserveExisting:e.preserveExisting??true};}apply(e){let t=[];if(e.tag!=="svg")return {processedElement:e,attributesAdded:t};let r={...e.attributes};return this.options.addRole&&(!this.options.preserveExisting||!r.role)&&(r.role=this.options.defaultRole,t.push("role")),this.options.addAriaHidden&&(!this.options.preserveExisting||!r["aria-hidden"])&&(r["aria-hidden"]="true",t.push("aria-hidden")),this.options.addTitle&&t.push("title-support"),this.options.addDesc&&t.push("desc-support"),this.options.addTitle&&this.options.addDesc&&(!this.options.preserveExisting||!r["aria-labelledby"])?(r["aria-labelledby"]="{titleId} {descId}",t.push("aria-labelledby")):this.options.addTitle&&(!this.options.preserveExisting||!r["aria-labelledby"])&&(r["aria-labelledby"]="{titleId}",t.push("aria-labelledby")),{processedElement:{...e,attributes:r},attributesAdded:t}}generateProps(){let e=[];return this.options.addTitle&&e.push("title?: string","titleId?: string"),this.options.addDesc&&e.push("desc?: string","descId?: string"),e}generateJSXElements(e){let t=[];return e==="react"?(this.options.addDesc&&t.push("{desc ? <desc id={descId}>{desc}</desc> : null}"),this.options.addTitle&&t.push("{title ? <title id={titleId}>{title}</title> : null}")):(this.options.addDesc&&t.push('<desc v-if="desc" :id="descId">{{ desc }}</desc>'),this.options.addTitle&&t.push('<title v-if="title" :id="titleId">{{ title }}</title>')),t.join(`
-    `)}};var w=class{transform(e,t={}){let{optimize:r=true,splitColors:s=false,fixedStrokeWidth:o=false,accessibility:i=true,removeComments:a=true,removeDuplicates:c=true,minifyPaths:l=false}=t,p=this.deepCloneAst(e),u=[],d=[];return r&&(this.applyOptimizations(p,{removeComments:a,removeDuplicates:c,minifyPaths:l&&!s}),u.push("optimization")),s&&(d=this.applySplitColors(p),u.push("split-colors")),o&&(this.applyFixedStrokeWidth(p),u.push("fixed-stroke-width")),i&&(this.applyAccessibility(p),u.push("accessibility")),{ast:p,colorMappings:d,metadata:{originalColors:d.map(x=>x.originalColor),optimizationApplied:r,features:u}}}applySplitColors(e){let r=new b({generateClasses:true,colorPrefix:"color"}).apply(e.root);return e.root=r.processedElement,r.mappings}applyFixedStrokeWidth(e){let r=new $({onlyIfStrokePresent:true,preserveExisting:true}).apply(e.root);e.root=r.processedElement;}applyAccessibility(e){let r=new E({addRole:true,addTitle:true,addDesc:true,defaultRole:"img",preserveExisting:true}).apply(e.root);e.root=r.processedElement;}applyOptimizations(e,t){t.removeDuplicates&&this.removeDuplicateElements(e),t.minifyPaths&&this.minifyPaths(e),this.removeEmptyGroups(e);}removeDuplicateElements(e){}minifyPaths(e){this.traverseElements(e.root,t=>{t.tag==="path"&&t.attributes.d&&(t.attributes.d=t.attributes.d.replace(/\s+/g," ").replace(/([MLHVCSQTAZ])\s+/gi,"$1").trim());});}removeEmptyGroups(e){let t=r=>(r.children=r.children.filter(t),!(r.tag==="g"&&r.children.length===0&&!r.content));e.root.children=e.root.children.filter(t);}traverseElements(e,t){t(e),e.children.forEach(r=>this.traverseElements(r,t));}isValidColor(e){return !e||e==="none"||e==="transparent"||e==="currentColor"?false:/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(e)||/^rgba?\(.+\)$/.test(e)||/^hsla?\(.+\)$/.test(e)}deepCloneAst(e){return {...e,root:this.deepCloneElement(e.root)}}deepCloneElement(e){return {...e,attributes:{...e.attributes},children:e.children.map(t=>this.deepCloneElement(t))}}};var v=class{options;constructor(e={}){this.options={typescript:true,memo:true,forwardRef:true,exportDefault:true,componentName:"Icon",includeTypes:true,...e};}astToJsx(e){return this.elementToJsx(e.root,0)}elementToJsx(e,t=0){let r="  ".repeat(t+1),{tag:s,attributes:o,children:i,content:a}=e,c=this.attributesToJsx(o),l=c.length>0?" "+c.join(" "):"";if(i.length===0&&!a)return `${r}<${s}${l} />`;let p=`${r}<${s}${l}>`;return a&&(p+=a),i.length>0&&(p+=`
+import {optimize}from'svgo';import {readFile,writeFile,readdir,stat,mkdir}from'fs/promises';import {dirname,join,extname}from'path';import {existsSync}from'fs';var S=class{parse(e){let t=this.cleanSvgContent(e),r=this.parseElement(t);return {root:r,viewBox:r.attributes.viewBox,width:r.attributes.width,height:r.attributes.height,namespace:r.attributes.xmlns}}extractColors(e){let t=[];return this.traverseElements(e.root,r=>{r.attributes.fill&&this.isValidColor(r.attributes.fill)&&t.push({value:r.attributes.fill,type:"fill",element:r,attribute:"fill"}),r.attributes.stroke&&this.isValidColor(r.attributes.stroke)&&t.push({value:r.attributes.stroke,type:"stroke",element:r,attribute:"stroke"}),r.attributes["stop-color"]&&this.isValidColor(r.attributes["stop-color"])&&t.push({value:r.attributes["stop-color"],type:"stop-color",element:r,attribute:"stop-color"});}),t}cleanSvgContent(e){return e.replace(/<\?xml[^>]*\?>/gi,"").replace(/<!--[\s\S]*?-->/g,"").trim()}parseElement(e){let t=e.match(/<svg([^>]*)>/i);if(!t)throw new Error("Invalid SVG: No svg element found");let r=this.parseAttributes(t[1]),s=this.parseChildren(e);return {tag:"svg",attributes:r,children:s}}parseAttributes(e){let t={},r=/(\w+(?:-\w+)*)=["']([^"']*)["']/g,s;for(;(s=r.exec(e))!==null;)t[s[1]]=s[2];return t}parseChildren(e){let t=[],r=e.match(/<svg[^>]*>(.*)<\/svg>/is);if(!r||!r[1])return t;let s=r[1],o=/<(\w+(?::\w+)?)([^>]*?)(?:\s*\/\s*>|>(.*?)<\/\1\s*>)/gs,i;for(;(i=o.exec(s))!==null;){let[,a,l,c]=i,p=this.parseAttributes(l),u={tag:a,attributes:p,children:[]};c!==void 0&&(c.includes("<")?u.children=this.parseNestedElements(c):c.trim()&&(u.content=c.trim())),t.push(u);}return t}parseNestedElements(e){let t=[],r=/<(\w+(?::\w+)?)([^>]*?)(?:\s*\/\s*>|>(.*?)<\/\1\s*>)/gs,s;for(;(s=r.exec(e))!==null;){let[,o,i,a]=s,l=this.parseAttributes(i),c={tag:o,attributes:l,children:[]};a!==void 0&&(a.includes("<")?c.children=this.parseNestedElements(a):a.trim()&&(c.content=a.trim())),t.push(c);}return t}traverseElements(e,t){t(e),e.children.forEach(r=>this.traverseElements(r,t));}isValidColor(e){return !e||e==="none"||e==="transparent"||e==="currentColor"?false:/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(e)||/^rgba?\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*(?:,\s*[\d.]+\s*)?\)$/.test(e)||/^hsla?\(\s*\d+\s*,\s*\d+%\s*,\s*\d+%\s*(?:,\s*[\d.]+\s*)?\)$/.test(e)?true:["red","green","blue","black","white","yellow","cyan","magenta"].includes(e.toLowerCase())}};var E=class{options;constructor(e={}){this.options={preserveOriginalNames:e.preserveOriginalNames??false,generateClasses:e.generateClasses??true,colorPrefix:e.colorPrefix??"color"};}extractColors(e){let t=[];this.traverseElement(e,t);let r=new Map;return t.forEach(s=>{this.isValidColor(s.value)&&r.set(s.value,s);}),Array.from(r.values()).sort((s,o)=>s.value.localeCompare(o.value))}apply(e){let t=this.extractColors(e),r=this.generateColorMappings(t),s=this.replaceColorsWithVariables(e,r);return {mappings:r,processedElement:s,originalColors:t.map(o=>o.value)}}generateColorMappings(e){return e.map((t,r)=>({originalColor:t.value,variableName:r===0?this.options.colorPrefix:`${this.options.colorPrefix}${r+1}`,type:t.type}))}replaceColorsWithVariables(e,t){let r=new Map(t.map(s=>[s.originalColor,s.variableName]));return this.transformElement(e,s=>{let o={...s.attributes};return o.fill&&r.has(o.fill)&&(o.fill=`{${r.get(o.fill)}}`),o.stroke&&r.has(o.stroke)&&(o.stroke=`{${r.get(o.stroke)}}`),o["stop-color"]&&r.has(o["stop-color"])&&(o["stop-color"]=`{${r.get(o["stop-color"])}}`),{...s,attributes:o}})}traverseElement(e,t){e.attributes.fill&&t.push({value:e.attributes.fill,type:"fill",element:e,attribute:"fill"}),e.attributes.stroke&&t.push({value:e.attributes.stroke,type:"stroke",element:e,attribute:"stroke"}),e.attributes["stop-color"]&&t.push({value:e.attributes["stop-color"],type:"stop-color",element:e,attribute:"stop-color"}),e.children.forEach(r=>this.traverseElement(r,t));}transformElement(e,t){let r=t(e);return {...r,children:r.children.map(s=>this.transformElement(s,t))}}isValidColor(e){return !e||e==="none"||e==="transparent"||e==="currentColor"?false:/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(e)||/^rgba?\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*(?:,\s*[\d.]+\s*)?\)$/.test(e)||/^hsla?\(\s*\d+\s*,\s*\d+%\s*,\s*\d+%\s*(?:,\s*[\d.]+\s*)?\)$/.test(e)?true:["red","green","blue","yellow","orange","purple","pink","brown","black","white","gray","grey","cyan","magenta","lime","navy"].includes(e.toLowerCase())}};var w=class{options;constructor(e={}){this.options={preserveExisting:e.preserveExisting??true,onlyIfStrokePresent:e.onlyIfStrokePresent??true};}apply(e){let t=0;return {processedElement:this.transformElement(e,s=>this.shouldAddVectorEffect(s)?(t++,{...s,attributes:{...s.attributes,"vector-effect":"non-scaling-stroke"}}):s),elementsModified:t}}shouldAddVectorEffect(e){return this.options.preserveExisting&&e.attributes["vector-effect"]||this.options.onlyIfStrokePresent&&!(e.attributes.stroke&&e.attributes.stroke!=="none"&&e.attributes.stroke!=="transparent")?false:["path","line","polyline","polygon","rect","circle","ellipse"].includes(e.tag)}transformElement(e,t){let r=t(e);return {...r,children:r.children.map(s=>this.transformElement(s,t))}}};var V=class{options;constructor(e={}){this.options={addRole:e.addRole??true,addAriaHidden:e.addAriaHidden??false,addTitle:e.addTitle??true,addDesc:e.addDesc??true,defaultRole:e.defaultRole??"img",preserveExisting:e.preserveExisting??true};}apply(e){let t=[];if(e.tag!=="svg")return {processedElement:e,attributesAdded:t};let r={...e.attributes};return this.options.addRole&&(!this.options.preserveExisting||!r.role)&&(r.role=this.options.defaultRole,t.push("role")),this.options.addAriaHidden&&(!this.options.preserveExisting||!r["aria-hidden"])&&(r["aria-hidden"]="true",t.push("aria-hidden")),this.options.addTitle&&t.push("title-support"),this.options.addDesc&&t.push("desc-support"),this.options.addTitle&&this.options.addDesc&&(!this.options.preserveExisting||!r["aria-labelledby"])?(r["aria-labelledby"]="{titleId} {descId}",t.push("aria-labelledby")):this.options.addTitle&&(!this.options.preserveExisting||!r["aria-labelledby"])&&(r["aria-labelledby"]="{titleId}",t.push("aria-labelledby")),{processedElement:{...e,attributes:r},attributesAdded:t}}generateProps(){let e=[];return this.options.addTitle&&e.push("title?: string","titleId?: string"),this.options.addDesc&&e.push("desc?: string","descId?: string"),e}generateJSXElements(e){let t=[];return e==="react"?(this.options.addDesc&&t.push("{desc ? <desc id={descId}>{desc}</desc> : null}"),this.options.addTitle&&t.push("{title ? <title id={titleId}>{title}</title> : null}")):(this.options.addDesc&&t.push('<desc v-if="desc" :id="descId">{{ desc }}</desc>'),this.options.addTitle&&t.push('<title v-if="title" :id="titleId">{{ title }}</title>')),t.join(`
+    `)}};var R=class{transform(e,t={}){let{optimize:r=true,splitColors:s=false,fixedStrokeWidth:o=false,accessibility:i=true,removeComments:a=true,removeDuplicates:l=true,minifyPaths:c=false}=t,p=this.deepCloneAst(e),u=[],x=[];return r&&(this.applyOptimizations(p,{removeComments:a,removeDuplicates:l,minifyPaths:c&&!s}),u.push("optimization")),s&&(x=this.applySplitColors(p),u.push("split-colors")),o&&(this.applyFixedStrokeWidth(p),u.push("fixed-stroke-width")),i&&(this.applyAccessibility(p),u.push("accessibility")),{ast:p,colorMappings:x,metadata:{originalColors:x.map(C=>C.originalColor),optimizationApplied:r,features:u}}}applySplitColors(e){let r=new E({generateClasses:true,colorPrefix:"color"}).apply(e.root);return e.root=r.processedElement,r.mappings}applyFixedStrokeWidth(e){let r=new w({onlyIfStrokePresent:true,preserveExisting:true}).apply(e.root);e.root=r.processedElement;}applyAccessibility(e){let r=new V({addRole:true,addTitle:true,addDesc:true,defaultRole:"img",preserveExisting:true}).apply(e.root);e.root=r.processedElement;}applyOptimizations(e,t){t.removeDuplicates&&this.removeDuplicateElements(e),t.minifyPaths&&this.minifyPaths(e),this.removeEmptyGroups(e);}removeDuplicateElements(e){}minifyPaths(e){this.traverseElements(e.root,t=>{t.tag==="path"&&t.attributes.d&&(t.attributes.d=t.attributes.d.replace(/\s+/g," ").replace(/([MLHVCSQTAZ])\s+/gi,"$1").trim());});}removeEmptyGroups(e){let t=r=>(r.children=r.children.filter(t),!(r.tag==="g"&&r.children.length===0&&!r.content));e.root.children=e.root.children.filter(t);}traverseElements(e,t){t(e),e.children.forEach(r=>this.traverseElements(r,t));}isValidColor(e){return !e||e==="none"||e==="transparent"||e==="currentColor"?false:/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(e)||/^rgba?\(.+\)$/.test(e)||/^hsla?\(.+\)$/.test(e)}deepCloneAst(e){return {...e,root:this.deepCloneElement(e.root)}}deepCloneElement(e){return {...e,attributes:{...e.attributes},children:e.children.map(t=>this.deepCloneElement(t))}}};var $=class{options;constructor(e={}){this.options={typescript:true,memo:true,forwardRef:true,exportDefault:true,componentName:"Icon",includeTypes:true,...e};}astToJsx(e){return this.elementToJsx(e.root,0)}elementToJsx(e,t=0){let r="  ".repeat(t+1),{tag:s,attributes:o,children:i,content:a}=e,l=this.attributesToJsx(o),c=l.length>0?" "+l.join(" "):"";if(i.length===0&&!a)return `${r}<${s}${c} />`;let p=`${r}<${s}${c}>`;return a&&(p+=a),i.length>0&&(p+=`
 `,p+=i.map(u=>this.elementToJsx(u,t+1)).join(`
 `),p+=`
 `+r),p+=`</${s}>`,p}attributesToJsx(e){return Object.entries(e).map(([t,r])=>{let s=this.convertAttributeName(t);return r.startsWith("{")&&r.endsWith("}")?`${s}=${r}`:`${s}="${r}"`})}convertAttributeName(e){let t={class:"className",for:"htmlFor",tabindex:"tabIndex",readonly:"readOnly",maxlength:"maxLength",cellpadding:"cellPadding",cellspacing:"cellSpacing",rowspan:"rowSpan",colspan:"colSpan",usemap:"useMap",frameborder:"frameBorder",contenteditable:"contentEditable"};return e.startsWith("aria-")||e.startsWith("data-")?e:e.includes("-")?e.replace(/-([a-z])/g,(r,s)=>s.toUpperCase()):t[e]||e}generateColorProps(e){return e.length===0?"":e.map(t=>{let r=t.variableName,s=`${r}Class`;return this.options.typescript?`  ${r}?: string;
   ${s}?: string;`:`  ${r}: PropTypes.string,
   ${s}: PropTypes.string,`}).join(`
-`)}generateColorDefaults(e){return e.length===0?"":e.map(t=>{let r=t.variableName,s=t.originalColor;return `${r} = "${s}"`}).join(", ")}getComponentName(){return this.options.componentName}generateFilename(e,t){return `${e}.${t}`}sanitizeComponentName(e){return e.replace(/[^a-zA-Z0-9_$]/g,"").replace(/^[0-9]/,"_$&")}};var V=class extends v{reactOptions;constructor(e={}){super(e),this.reactOptions={...this.options,memo:e.memo??true,forwardRef:e.forwardRef??true,propTypes:e.propTypes??false,defaultProps:e.defaultProps??false,namedExport:e.namedExport??false};}generate(e){let t=this.getComponentName(),{colorMappings:r,metadata:s}=e,o=this.generateImports(),i=this.generateInterfaces(r,s.features),a=this.generateComponent(e),c=this.generateExports(t),l=[o,i,a,c].filter(Boolean).join(`
+`)}generateColorDefaults(e){return e.length===0?"":e.map(t=>{let r=t.variableName,s=t.originalColor;return `${r} = "${s}"`}).join(", ")}getComponentName(){return this.options.componentName}generateFilename(e,t){return `${e}.${t}`}sanitizeComponentName(e){return e.replace(/[^a-zA-Z0-9_$]/g,"").replace(/^[0-9]/,"_$&")}};var G=class extends ${reactOptions;constructor(e={}){super(e),this.reactOptions={...this.options,memo:e.memo??true,forwardRef:e.forwardRef??true,propTypes:e.propTypes??false,defaultProps:e.defaultProps??false,namedExport:e.namedExport??false};}generate(e){let t=this.getComponentName(),{colorMappings:r,metadata:s}=e,o=this.generateImports(),i=this.generateInterfaces(r,s.features),a=this.generateComponent(e),l=this.generateExports(t),c=[o,i,a,l].filter(Boolean).join(`
 
-`),p=this.reactOptions.typescript?"tsx":"jsx",u=this.generateFilename(t,p);return {code:l,filename:u,componentName:t,dependencies:this.getDependencies()}}generateImports(){let e=[];return this.reactOptions.typescript?(e.push("import * as React from 'react';"),this.reactOptions.forwardRef?e.push("import { Ref, forwardRef, memo } from 'react';"):this.reactOptions.memo&&e.push("import { memo } from 'react';")):(e.push("import React from 'react';"),this.reactOptions.propTypes&&e.push("import PropTypes from 'prop-types';")),e.join(`
-`)}generateInterfaces(e,t){return !this.reactOptions.typescript&&!this.reactOptions.propTypes?"":this.reactOptions.typescript?this.generateTypeScriptInterface(e,t):this.generatePropTypes(e,t)}generateTypeScriptInterface(e,t){let r=["title?: string;","titleId?: string;","desc?: string;","descId?: string;"],s=this.generateColorProps(e);return s&&r.push(s),t.includes("fixed-stroke-width")&&r.push("isFixedStrokeWidth?: boolean;"),`interface ${this.getComponentName()}Props extends React.SVGProps<SVGSVGElement> {
+`),p=this.reactOptions.typescript?"tsx":"jsx",u=this.generateFilename(t,p);return {code:c,filename:u,componentName:t,dependencies:this.getDependencies()}}generateImports(){let e=[];return this.reactOptions.typescript?(e.push("import * as React from 'react';"),this.reactOptions.forwardRef?e.push("import { Ref, forwardRef, memo } from 'react';"):this.reactOptions.memo&&e.push("import { memo } from 'react';")):(e.push("import React from 'react';"),this.reactOptions.propTypes&&e.push("import PropTypes from 'prop-types';")),e.join(`
+`)}generateInterfaces(e,t){return !this.reactOptions.typescript&&!this.reactOptions.propTypes?"":this.reactOptions.typescript?this.generateTypeScriptInterface(e,t):this.generatePropTypes(e,t)}generateTypeScriptInterface(e,t){let r=["title?: string;","titleId?: string;","desc?: string;","descId?: string;","size?: string;"],s=this.generateColorProps(e);return s&&r.push(s),t.includes("fixed-stroke-width")&&r.push("isFixedStrokeWidth?: boolean;"),`interface ${this.getComponentName()}Props extends React.SVGProps<SVGSVGElement> {
   ${r.join(`
   `)}
-}`}generatePropTypes(e,t){let r=this.getComponentName(),s=["title: PropTypes.string,","titleId: PropTypes.string,","desc: PropTypes.string,","descId: PropTypes.string,","className: PropTypes.string,","style: PropTypes.object,","width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),","height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),"],o=this.generateColorProps(e);return o&&s.push(o),t.includes("fixed-stroke-width")&&s.push("isFixedStrokeWidth: PropTypes.bool,"),`${r}.propTypes = {
+}`}generatePropTypes(e,t){let r=this.getComponentName(),s=["title: PropTypes.string,","titleId: PropTypes.string,","desc: PropTypes.string,","descId: PropTypes.string,","size: PropTypes.string,","className: PropTypes.string,","style: PropTypes.object,","width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),","height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),"],o=this.generateColorProps(e);return o&&s.push(o),t.includes("fixed-stroke-width")&&s.push("isFixedStrokeWidth: PropTypes.bool,"),`${r}.propTypes = {
   ${s.join(`
   `)}
-};`}generateComponent(e){let t=this.getComponentName(),{colorMappings:r,metadata:s}=e,o=["title","titleId","desc","descId"],i=r.map(d=>d.variableName),a=r.map(d=>`${d.variableName}Class`),c=[...o,...i,...a];s.features.includes("fixed-stroke-width")&&c.push("isFixedStrokeWidth");let l=`{ ${c.join(", ")}, ...svgProps }`,p="{title ? <title id={titleId}>{title}</title> : null}",u="{desc ? <desc id={descId}>{desc}</desc> : null}";if(this.reactOptions.typescript){let d=`${t}Props`,x=this.reactOptions.forwardRef?", ref: Ref<SVGSVGElement>":"",O=e.ast.root.children.map(T=>this.elementToJsx(T,1)).join(`
-`);return `const ${t} = (${l}: ${d}${x}) => (
-  <svg
-    ${this.reactOptions.forwardRef?`ref={ref}
-    `:""}...svgProps
-  >
-    ${p}
-    ${u}
-${O}
-  </svg>
-);`}else {let d=e.ast.root.children.map(x=>this.elementToJsx(x,1)).join(`
-`);return `const ${t} = (${l}) => (
-  <svg {...svgProps}>
-    ${p}
-    ${u}
-${d}
-  </svg>
-);`}}generateExports(e){let t=[];return this.reactOptions.forwardRef?(t.push(`const ForwardRef = forwardRef(${e});`),this.reactOptions.memo?(t.push("const Memo = memo(ForwardRef);"),this.reactOptions.exportDefault&&t.push("export default Memo;"),this.reactOptions.namedExport&&t.push(`export { Memo as ${e} };`)):(this.reactOptions.exportDefault&&t.push("export default ForwardRef;"),this.reactOptions.namedExport&&t.push(`export { ForwardRef as ${e} };`))):this.reactOptions.memo?(t.push(`const Memo = memo(${e});`),this.reactOptions.exportDefault&&t.push("export default Memo;"),this.reactOptions.namedExport&&t.push(`export { Memo as ${e} };`)):(this.reactOptions.exportDefault&&t.push(`export default ${e};`),this.reactOptions.namedExport&&t.push(`export { ${e} };`)),t.join(`
-`)}getDependencies(){let e=["react"];return this.reactOptions.propTypes&&e.push("prop-types"),e}};var R=class extends v{vueOptions;constructor(e={}){super(e),this.vueOptions={...this.options,composition:e.composition??true,scriptSetup:e.scriptSetup??true,sfc:e.sfc??true,defineComponent:e.defineComponent??false};}generate(e){let t=this.getComponentName(),r;this.vueOptions.sfc?r=this.generateSFC(e):r=this.generateJSComponent(e);let s=this.vueOptions.sfc?"vue":this.vueOptions.typescript?"ts":"js",o=this.generateFilename(t,s);return {code:r,filename:o,componentName:t,dependencies:this.getDependencies()}}generateSFC(e){let t=this.generateTemplate(e),r=this.generateScript(e),s=this.generateStyle();return `<template>
+};`}generateComponent(e){let t=this.getComponentName(),{colorMappings:r,metadata:s}=e,o=["title","titleId","desc","descId","size"],i=r.map(f=>f.variableName),a=r.map(f=>`${f.variableName}Class`),l=[...o,...i,...a];s.features.includes("fixed-stroke-width")&&l.push("isFixedStrokeWidth");let u=['size = "20"',this.generateColorDefaults(r)].filter(Boolean).join(", "),x=u?`, ${u}`:"",C=`{ ${l.join(", ")}${x}, ...svgProps }`,v=this.generateSvgAttributes(e.ast),b="{title ? <title id={titleId}>{title}</title> : null}",g="{desc ? <desc id={descId}>{desc}</desc> : null}";if(this.reactOptions.typescript){let f=`${t}Props`,d=this.reactOptions.forwardRef?", ref: Ref<SVGSVGElement>":"",N=e.ast.root.children.map(j=>this.elementToJsx(j,1)).join(`
+`);return `const ${t} = (${C}: ${f}${d}) => {
+  const computedSize = size ? { width: size, height: size } : {};
+  
+  return (
+    <svg
+      ${this.reactOptions.forwardRef?`ref={ref}
+      `:""}${v}
+      {...computedSize}
+      {...svgProps}
+    >
+      ${b}
+      ${g}
+${N}
+    </svg>
+  );
+};`}else {let f=e.ast.root.children.map(d=>this.elementToJsx(d,1)).join(`
+`);return `const ${t} = (${C}) => {
+  const computedSize = size ? { width: size, height: size } : {};
+  
+  return (
+    <svg ${v}{...computedSize} {...svgProps}>
+      ${b}
+      ${g}
+${f}
+    </svg>
+  );
+};`}}generateExports(e){let t=[];return this.reactOptions.forwardRef?(t.push(`const ForwardRef = forwardRef(${e});`),this.reactOptions.memo?(t.push("const Memo = memo(ForwardRef);"),this.reactOptions.exportDefault&&t.push("export default Memo;"),this.reactOptions.namedExport&&t.push(`export { Memo as ${e} };`)):(this.reactOptions.exportDefault&&t.push("export default ForwardRef;"),this.reactOptions.namedExport&&t.push(`export { ForwardRef as ${e} };`))):this.reactOptions.memo?(t.push(`const Memo = memo(${e});`),this.reactOptions.exportDefault&&t.push("export default Memo;"),this.reactOptions.namedExport&&t.push(`export { Memo as ${e} };`)):(this.reactOptions.exportDefault&&t.push(`export default ${e};`),this.reactOptions.namedExport&&t.push(`export { ${e} };`)),t.join(`
+`)}getDependencies(){let e=["react"];return this.reactOptions.propTypes&&e.push("prop-types"),e}generateSvgAttributes(e){let t=[],r=e.root.attributes?.viewBox||e.viewBox;r&&t.push(`viewBox="${r}"`);let s=e.root.attributes?.xmlns||e.namespace;if(s&&t.push(`xmlns="${s}"`),!r){let o=e.root.attributes?.width||e.width,i=e.root.attributes?.height||e.height;o&&t.push(`width="${o}"`),i&&t.push(`height="${i}"`);}return t.length>0?t.join(`
+    `)+`
+    `:""}elementToJsx(e,t=0){let r="  ".repeat(t+1),{tag:s,attributes:o,children:i,content:a}=e,l=this.attributesToJsxWithClasses(o),c=l.length>0?" "+l.join(" "):"";if(i.length===0&&!a)return `${r}<${s}${c} />`;let p=`${r}<${s}${c}>`;return a&&(p+=a),i.length>0&&(p+=`
+`,p+=i.map(u=>this.elementToJsx(u,t+1)).join(`
+`),p+=`
+`+r),p+=`</${s}>`,p}attributesToJsxWithClasses(e){let t=[];return Object.entries(e).forEach(([r,s])=>{let o=this.convertAttributeName(r);if((r==="fill"||r==="stroke")&&s.startsWith("{")&&s.endsWith("}")){let i=s.slice(1,-1);t.push(`${o}=${s}`);let a=`${i}Class`;t.push(`className={${a}}`);}else s.startsWith("{")&&s.endsWith("}")?t.push(`${o}=${s}`):t.push(`${o}="${s}"`);}),t}};var O=class extends ${vueOptions;constructor(e={}){super(e),this.vueOptions={...this.options,composition:e.composition??true,scriptSetup:e.scriptSetup??true,sfc:e.sfc??true,defineComponent:e.defineComponent??false};}generate(e){let t=this.getComponentName(),r;this.vueOptions.sfc?r=this.generateSFC(e):r=this.generateJSComponent(e);let s=this.vueOptions.sfc?"vue":this.vueOptions.typescript?"ts":"js",o=this.generateFilename(t,s);return {code:r,filename:o,componentName:t,dependencies:this.getDependencies()}}generateSFC(e){let t=this.generateTemplate(e),r=this.generateScript(e),s=this.generateStyle();return `<template>
 ${t}
 </template>
 
@@ -44,41 +59,41 @@ ${this.vueOptions.scriptSetup?`defineOptions({ inheritAttrs: false });
 
 ${s?`<style scoped>
 ${s}
-</style>`:""}`}generateJSComponent(e){return this.vueOptions.composition?this.generateCompositionAPI(e):this.generateOptionsAPI(e)}generateTemplate(e){let{ast:t}=e;return `  <svg v-bind="$attrs">
+</style>`:""}`}generateJSComponent(e){return this.vueOptions.composition?this.generateCompositionAPI(e):this.generateOptionsAPI(e)}generateTemplate(e){let{ast:t}=e;return `  <svg v-bind="$attrs" :width="props.size || undefined" :height="props.size || undefined">
     <title v-if="props.title" :id="props.titleId">{{ props.title }}</title>
     <desc v-if="props.desc" :id="props.descId">{{ props.desc }}</desc>
 ${t.root.children.map(s=>this.elementToVueTemplate(s,2)).join(`
 `)}
-  </svg>`}elementToVueTemplate(e,t=0){let r="  ".repeat(t),{tag:s,attributes:o,children:i,content:a}=e,c=Object.entries(o).map(([u,d])=>`${u}="${d}"`).join(" "),l=c?" "+c:"";if(i.length===0&&!a)return `${r}<${s}${l} />`;let p=`${r}<${s}${l}>`;return a&&(p+=a),i.length>0&&(p+=`
+  </svg>`}elementToVueTemplate(e,t=0){let r="  ".repeat(t),{tag:s,attributes:o,children:i,content:a}=e,l=[];Object.entries(o).forEach(([u,x])=>{if(x.startsWith("{")&&x.endsWith("}")){let C=x.slice(1,-1);if(l.push(`:${u}="props.${C}"`),u==="fill"||u==="stroke"){let v=`${C}Class`;l.push(`:class="props.${v}"`);}}else l.push(`${u}="${x}"`);});let c=l.length>0?" "+l.join(" "):"";if(i.length===0&&!a)return `${r}<${s}${c} />`;let p=`${r}<${s}${c}>`;return a&&(p+=a),i.length>0&&(p+=`
 `,p+=i.map(u=>this.elementToVueTemplate(u,t+1)).join(`
 `),p+=`
-`+r),p+=`</${s}>`,p}generateScript(e){return this.vueOptions.scriptSetup?this.generateScriptSetup(e):this.vueOptions.composition?this.generateCompositionAPI(e):this.generateOptionsAPI(e)}generateScriptSetup(e){let{colorMappings:t,metadata:r}=e,s=[];if(this.vueOptions.typescript){s.push("interface Props extends SVGAttributes {"),s.push("  title?: string;"),s.push("  titleId?: string;"),s.push("  desc?: string;"),s.push("  descId?: string;");let o=this.generateColorPropsInterface(t);o&&s.push(o),r.features.includes("fixed-stroke-width")&&s.push("  isFixedStrokeWidth?: boolean;"),s.push("}"),s.push(""),s.push("const props = withDefaults(defineProps<Props>(), {");}else s.push("const props = defineProps({"),s.push("  title: { type: String, default: undefined },"),s.push("  titleId: { type: String, default: undefined },"),s.push("  desc: { type: String, default: undefined },"),s.push("  descId: { type: String, default: undefined },"),s.push("  class: { type: String, default: undefined },"),s.push("  style: { type: Object, default: undefined },"),s.push("  width: { type: [String, Number], default: undefined },"),s.push("  height: { type: [String, Number], default: undefined },");return t.forEach(o=>{let i=o.variableName,a=o.originalColor,c=`${i}Class`;this.vueOptions.typescript?(s.push(`  ${i}: '${a}',`),s.push(`  ${c}: undefined,`)):(s.push(`  ${i}: { type: String, default: '${a}' },`),s.push(`  ${c}: { type: String, default: undefined },`));}),r.features.includes("fixed-stroke-width")&&(this.vueOptions.typescript?s.push("  isFixedStrokeWidth: false,"):s.push("  isFixedStrokeWidth: { type: Boolean, default: false },")),s.push("});"),s.join(`
-`)}generateCompositionAPI(e){let{colorMappings:t,metadata:r}=e,s=this.getComponentName(),o=[];return o.push("import { defineComponent } from 'vue';"),o.push(""),o.push("export default defineComponent({"),o.push(`  name: '${s}',`),o.push("  props: {"),o.push("    title: { type: String, default: undefined },"),o.push("    titleId: { type: String, default: undefined },"),o.push("    desc: { type: String, default: undefined },"),o.push("    descId: { type: String, default: undefined },"),o.push("    class: { type: String, default: undefined },"),o.push("    style: { type: Object, default: undefined },"),o.push("    width: { type: [String, Number], default: undefined },"),o.push("    height: { type: [String, Number], default: undefined },"),t.forEach(i=>{let a=i.variableName,c=i.originalColor,l=`${a}Class`;o.push(`    ${a}: { type: String, default: '${c}' },`),o.push(`    ${l}: { type: String, default: undefined },`);}),r.features.includes("fixed-stroke-width")&&o.push("    isFixedStrokeWidth: { type: Boolean, default: false },"),o.push("  },"),o.push("  setup() {"),o.push("    return {};"),o.push("  },"),o.push("});"),o.join(`
-`)}generateOptionsAPI(e){let{colorMappings:t,metadata:r}=e,s=this.getComponentName(),o=[];return o.push("export default {"),o.push(`  name: '${s}',`),o.push("  props: {"),o.push("    title: { type: String, default: undefined },"),o.push("    titleId: { type: String, default: undefined },"),o.push("    desc: { type: String, default: undefined },"),o.push("    descId: { type: String, default: undefined },"),o.push("    class: { type: String, default: undefined },"),o.push("    style: { type: Object, default: undefined },"),o.push("    width: { type: [String, Number], default: undefined },"),o.push("    height: { type: [String, Number], default: undefined },"),t.forEach(i=>{let a=i.variableName,c=i.originalColor,l=`${a}Class`;o.push(`    ${a}: { type: String, default: '${c}' },`),o.push(`    ${l}: { type: String, default: undefined },`);}),r.features.includes("fixed-stroke-width")&&o.push("    isFixedStrokeWidth: { type: Boolean, default: false },"),o.push("  },"),o.push("};"),o.join(`
+`+r),p+=`</${s}>`,p}generateScript(e){return this.vueOptions.scriptSetup?this.generateScriptSetup(e):this.vueOptions.composition?this.generateCompositionAPI(e):this.generateOptionsAPI(e)}generateScriptSetup(e){let{colorMappings:t,metadata:r}=e,s=[];if(this.vueOptions.typescript){s.push("interface Props extends SVGAttributes {"),s.push("  title?: string;"),s.push("  titleId?: string;"),s.push("  desc?: string;"),s.push("  descId?: string;"),s.push("  size?: string;");let o=this.generateColorPropsInterface(t);o&&s.push(o),r.features.includes("fixed-stroke-width")&&s.push("  isFixedStrokeWidth?: boolean;"),s.push("}"),s.push(""),s.push("const props = withDefaults(defineProps<Props>(), {");}else s.push("const props = defineProps({"),s.push("  title: { type: String, default: undefined },"),s.push("  titleId: { type: String, default: undefined },"),s.push("  desc: { type: String, default: undefined },"),s.push("  descId: { type: String, default: undefined },"),s.push("  class: { type: String, default: undefined },"),s.push("  style: { type: Object, default: undefined },"),s.push("  width: { type: [String, Number], default: undefined },"),s.push("  height: { type: [String, Number], default: undefined },"),s.push('  size: { type: String, default: "20" },');return this.vueOptions.typescript&&s.push('  size: "20",'),t.forEach(o=>{let i=o.variableName,a=o.originalColor,l=`${i}Class`;this.vueOptions.typescript?(s.push(`  ${i}: '${a}',`),s.push(`  ${l}: undefined,`)):(s.push(`  ${i}: { type: String, default: '${a}' },`),s.push(`  ${l}: { type: String, default: undefined },`));}),r.features.includes("fixed-stroke-width")&&(this.vueOptions.typescript?s.push("  isFixedStrokeWidth: false,"):s.push("  isFixedStrokeWidth: { type: Boolean, default: false },")),s.push("});"),s.join(`
+`)}generateCompositionAPI(e){let{colorMappings:t,metadata:r}=e,s=this.getComponentName(),o=[];return o.push("import { defineComponent } from 'vue';"),o.push(""),o.push("export default defineComponent({"),o.push(`  name: '${s}',`),o.push("  props: {"),o.push("    title: { type: String, default: undefined },"),o.push("    titleId: { type: String, default: undefined },"),o.push("    desc: { type: String, default: undefined },"),o.push("    descId: { type: String, default: undefined },"),o.push("    class: { type: String, default: undefined },"),o.push("    style: { type: Object, default: undefined },"),o.push("    width: { type: [String, Number], default: undefined },"),o.push("    height: { type: [String, Number], default: undefined },"),t.forEach(i=>{let a=i.variableName,l=i.originalColor,c=`${a}Class`;o.push(`    ${a}: { type: String, default: '${l}' },`),o.push(`    ${c}: { type: String, default: undefined },`);}),r.features.includes("fixed-stroke-width")&&o.push("    isFixedStrokeWidth: { type: Boolean, default: false },"),o.push("  },"),o.push("  setup() {"),o.push("    return {};"),o.push("  },"),o.push("});"),o.join(`
+`)}generateOptionsAPI(e){let{colorMappings:t,metadata:r}=e,s=this.getComponentName(),o=[];return o.push("export default {"),o.push(`  name: '${s}',`),o.push("  props: {"),o.push("    title: { type: String, default: undefined },"),o.push("    titleId: { type: String, default: undefined },"),o.push("    desc: { type: String, default: undefined },"),o.push("    descId: { type: String, default: undefined },"),o.push("    class: { type: String, default: undefined },"),o.push("    style: { type: Object, default: undefined },"),o.push("    width: { type: [String, Number], default: undefined },"),o.push("    height: { type: [String, Number], default: undefined },"),t.forEach(i=>{let a=i.variableName,l=i.originalColor,c=`${a}Class`;o.push(`    ${a}: { type: String, default: '${l}' },`),o.push(`    ${c}: { type: String, default: undefined },`);}),r.features.includes("fixed-stroke-width")&&o.push("    isFixedStrokeWidth: { type: Boolean, default: false },"),o.push("  },"),o.push("};"),o.join(`
 `)}generateStyle(){return ""}generateColorPropsInterface(e){return e.length===0?"":e.map(t=>{let r=t.variableName,s=`${r}Class`;return `  ${r}?: string;
   ${s}?: string;`}).join(`
-`)}getDependencies(){return ["vue"]}};var G=class{parser;transformer;constructor(){this.parser=new S,this.transformer=new w;}convert(e,t){try{let r=this.parser.parse(e),s=this.transformer.transform(r,t.transformation),o;return t.framework==="react"?o=new V(t.generator):o=new R(t.generator),{...o.generate(s),metadata:s.metadata}}catch(r){throw new Error(`SVG conversion failed: ${r instanceof Error?r.message:String(r)}`)}}extractColors(e){let t=this.parser.parse(e),r=this.parser.extractColors(t);return Array.from(new Set(r.map(s=>s.value))).sort()}validate(e){let t=[];try{let r=this.parser.parse(e);r.root||t.push("No root SVG element found"),!r.viewBox&&!r.width&&!r.height&&t.push("SVG should have viewBox or width/height attributes");}catch(r){t.push(r instanceof Error?r.message:String(r));}return {valid:t.length===0,errors:t}}};async function D(n,e={}){return new G().convert(n,{...e,framework:"react"})}async function j(n,e={}){return new G().convert(n,{...e,framework:"vue"})}var z={plugins:[{name:"preset-default",params:{overrides:{removeViewBox:false,removeTitle:false,removeDesc:false,removeUselessStrokeAndFill:false,convertColors:{currentColor:true,names2hex:true,rgb2hex:true,shorthex:true,shortname:true}}}},"removeDimensions","cleanupNumericValues"]};function J(n,e=z){try{return optimize(n,e).data}catch(t){throw new Error(`Failed to optimize SVG: ${t}`)}}function B(n){let e=[{name:"preset-default",params:{overrides:{removeViewBox:!n.removeViewBox,removeTitle:!n.removeTitle,removeDesc:!n.removeDesc,removeUselessStrokeAndFill:!n.preserveClasses,convertColors:n.preserveColors?false:{currentColor:true,names2hex:true,rgb2hex:true,shorthex:true,shortname:true}}}},"cleanupNumericValues"];return n.removeDimensions!==false&&e.push("removeDimensions"),{plugins:e}}async function K(n){try{return await readFile(n,"utf-8")}catch(e){throw new Error(`Failed to read SVG file: ${n}. ${e}`)}}async function X(n,e){try{await I(dirname(n)),await writeFile(n,e,"utf-8");}catch(t){throw new Error(`Failed to write SVG file: ${n}. ${t}`)}}async function Y(n,e){try{await I(dirname(n)),await writeFile(n,e,"utf-8");}catch(t){throw new Error(`Failed to write component file: ${n}. ${t}`)}}async function M(n,e=false){try{let t=await readdir(n),r=[];for(let s of t){let o=join(n,s),i=await stat(o);if(i.isDirectory()&&e){let a=await M(o,e);r.push(...a);}else i.isFile()&&extname(s).toLowerCase()===".svg"&&r.push(o);}return r}catch(t){throw new Error(`Failed to read directory: ${n}. ${t}`)}}async function I(n){existsSync(n)||await mkdir(n,{recursive:true});}var y=n=>n.match(/[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*[a-z]*|[A-Z]|[0-9]+[a-z]*/g)?.map(e=>e.charAt(0).toUpperCase()+e.slice(1).toLowerCase()).join("")||"";function ee(n){let e=n.replace(/\.svg$/i,"");return e=te(e),y(e)}function te(n){let e=n.toLowerCase().replace(/[^a-zA-Z0-9]/g," ");return e=e.replace(/\s+/g," ").trim(),e}function re(n){return y(n.replace(/[^a-zA-Z0-9]/g," "))}function se(n,e,t){let r=e?y(e):"",s=t?y(t):"",o=y(n);return `${r}${o}${s}`}function oe(n,e){let{format:t,exportType:r,typescript:s}=e,o=[...n].sort((i,a)=>i.componentName.localeCompare(a.componentName));return r==="default"?ie(o):ne(o,t,s)}function ne(n,e,t){let r="";r+=`// Auto-generated index file for tree-shaking
+`)}getDependencies(){return ["vue"]}};var T=class{parser;transformer;constructor(){this.parser=new S,this.transformer=new R;}convert(e,t){try{let r=this.parser.parse(e),s=this.transformer.transform(r,t.transformation),o;return t.framework==="react"?o=new G(t.generator):o=new O(t.generator),{...o.generate(s),metadata:s.metadata}}catch(r){throw new Error(`SVG conversion failed: ${r instanceof Error?r.message:String(r)}`)}}extractColors(e){let t=this.parser.parse(e),r=this.parser.extractColors(t);return Array.from(new Set(r.map(s=>s.value))).sort()}validate(e){let t=[];try{let r=this.parser.parse(e);r.root||t.push("No root SVG element found"),!r.viewBox&&!r.width&&!r.height&&t.push("SVG should have viewBox or width/height attributes");}catch(r){t.push(r instanceof Error?r.message:String(r));}return {valid:t.length===0,errors:t}}};async function z(n,e={}){return new T().convert(n,{...e,framework:"react"})}async function W(n,e={}){return new T().convert(n,{...e,framework:"vue"})}var J={plugins:[{name:"preset-default",params:{overrides:{removeViewBox:false,removeTitle:false,removeDesc:false,removeUselessStrokeAndFill:false,convertColors:{currentColor:true,names2hex:true,rgb2hex:true,shorthex:true,shortname:true}}}},"removeDimensions","cleanupNumericValues"]};function q(n,e=J){try{return optimize(n,e).data}catch(t){throw new Error(`Failed to optimize SVG: ${t}`)}}function L(n){let e=[{name:"preset-default",params:{overrides:{removeViewBox:!n.removeViewBox,removeTitle:!n.removeTitle,removeDesc:!n.removeDesc,removeUselessStrokeAndFill:!n.preserveClasses,convertColors:n.preserveColors?false:{currentColor:true,names2hex:true,rgb2hex:true,shorthex:true,shortname:true}}}},"cleanupNumericValues"];return n.removeDimensions!==false&&e.push("removeDimensions"),{plugins:e}}async function Y(n){try{return await readFile(n,"utf-8")}catch(e){throw new Error(`Failed to read SVG file: ${n}. ${e}`)}}async function ee(n,e){try{await I(dirname(n)),await writeFile(n,e,"utf-8");}catch(t){throw new Error(`Failed to write SVG file: ${n}. ${t}`)}}async function te(n,e){try{await I(dirname(n)),await writeFile(n,e,"utf-8");}catch(t){throw new Error(`Failed to write component file: ${n}. ${t}`)}}async function M(n,e=false){try{let t=await readdir(n),r=[];for(let s of t){let o=join(n,s),i=await stat(o);if(i.isDirectory()&&e){let a=await M(o,e);r.push(...a);}else i.isFile()&&extname(s).toLowerCase()===".svg"&&r.push(o);}return r}catch(t){throw new Error(`Failed to read directory: ${n}. ${t}`)}}async function I(n){existsSync(n)||await mkdir(n,{recursive:true});}var y=n=>n.match(/[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*[a-z]*|[A-Z]|[0-9]+[a-z]*/g)?.map(e=>e.charAt(0).toUpperCase()+e.slice(1).toLowerCase()).join("")||"";function re(n){let e=n.replace(/\.svg$/i,"");return e=se(e),y(e)}function se(n){let e=n.toLowerCase().replace(/[^a-zA-Z0-9]/g," ");return e=e.replace(/\s+/g," ").trim(),e}function oe(n){return y(n.replace(/[^a-zA-Z0-9]/g," "))}function ne(n,e,t){let r=e?y(e):"",s=t?y(t):"",o=y(n);return `${r}${o}${s}`}function ie(n,e){let{format:t,exportType:r,typescript:s}=e,o=[...n].sort((i,a)=>i.componentName.localeCompare(a.componentName));return r==="default"?le(o):ae(o,t,s)}function ae(n,e,t){let r="";r+=`// Auto-generated index file for tree-shaking
 `,r+=`// This file exports all components for optimal bundling
 
-`;for(let s of n){let o=k(s.filename);r+=`export { default as ${s.componentName} } from './${o}';
+`;for(let s of n){let o=A(s.filename);r+=`export { default as ${s.componentName} } from './${o}';
 `;}if(t&&e==="ts"){r+=`
 // TypeScript component types
 `,r+=`export type IconComponent = React.ComponentType<React.SVGProps<SVGSVGElement>>;
 `,r+=`export type IconComponents = {
 `;for(let s of n)r+=`  ${s.componentName}: IconComponent;
 `;r+=`};
-`;}return r}function ie(n,e,t){let r="";r+=`// Auto-generated index file
+`;}return r}function le(n,e,t){let r="";r+=`// Auto-generated index file
 `,r+=`// Warning: Default exports are less tree-shakeable
 
-`;for(let s of n){let o=k(s.filename);r+=`import ${s.componentName} from './${o}';
+`;for(let s of n){let o=A(s.filename);r+=`import ${s.componentName} from './${o}';
 `;}r+=`
 export default {
 `;for(let s of n)r+=`  ${s.componentName},
 `;r+=`};
 `,r+=`
 // Individual exports for flexibility
-`;for(let s of n)r+=`export { default as ${s.componentName} } from './${k(s.filename)}';
-`;return r}function k(n){return n.replace(/\.(tsx?|jsx?|vue)$/,"")}function N(n){let e=new Set,t=new Set,r=new Set,s=new Set,o=[/fill="([^"]*?)"/g,/fill='([^']*?)'/g,/fill:\s*([^;}\s]+)/g],i=[/stroke="([^"]*?)"/g,/stroke='([^']*?)'/g,/stroke:\s*([^;}\s]+)/g],a=[/stop-color="([^"]*?)"/g,/stop-color='([^']*?)'/g,/stop-color:\s*([^;}\s]+)/g];o.forEach(h=>{let C;for(;(C=h.exec(n))!==null;){let f=C[1].trim();A(f)&&(e.add(f),s.add(f));}}),i.forEach(h=>{let C;for(;(C=h.exec(n))!==null;){let f=C[1].trim();A(f)&&(t.add(f),s.add(f));}}),a.forEach(h=>{let C;for(;(C=h.exec(n))!==null;){let f=C[1].trim();A(f)&&(r.add(f),s.add(f));}});let c=Array.from(e).sort(),l=Array.from(t).sort(),p=Array.from(r).sort(),u=Array.from(s).sort(),d=new Map,x=new Map,O=new Map,T=new Map;return u.forEach((h,C)=>{let f=C===0?"color":`color${C+1}`;T.set(h,f),c.includes(h)&&d.set(h,f),l.includes(h)&&x.set(h,f),p.includes(h)&&O.set(h,f);}),{colors:u,colorMap:T,fillColors:c,strokeColors:l,gradientColors:p,fillColorMap:d,strokeColorMap:x,gradientColorMap:O}}function ae(n){let e=N(n),t=new Map,r=/<(path|circle|rect|ellipse|line|polyline|polygon)[^>]*>/g,s;for(;(s=r.exec(n))!==null;){let o=s[0],i=o.match(/d="([^"]*?)"/),a=o.match(/fill="([^"]*?)"/);if(i&&a){let c=i[1].substring(0,50),l=a[1],p=e.colorMap.get(l);p&&t.set(c,p);}}return {colorInfo:e,elementColorMap:t}}function le(n,e,t){let r=n,s=t==="react"?/(<path[^>]*d="([^"]{1,50})[^"]*"[^>]*fill=){[^}]*currentColor[^}]*}([^>]*>)/g:/(<path[^>]*d="([^"]{1,50})[^"]*"[^>]*fill=)"currentColor"([^>]*>)/g;return r=r.replace(s,(o,i,a,c)=>{let l=e.get(a);return l?t==="react"?`${i}{${l}}${c}`:`${i}"${l}"${c}`:o}),r}function pe(n,e){return n.length===0?"":n.map((r,s)=>{let o=s===0?"color":`color${s+1}`,i=`${o}Class`;return e==="react"?`  ${o}?: string;
+`;for(let s of n)r+=`export { default as ${s.componentName} } from './${A(s.filename)}';
+`;return r}function A(n){return n.replace(/\.(tsx?|jsx?|vue)$/,"")}function D(n){let e=new Set,t=new Set,r=new Set,s=new Set,o=[/fill="([^"]*?)"/g,/fill='([^']*?)'/g,/fill:\s*([^;}\s]+)/g],i=[/stroke="([^"]*?)"/g,/stroke='([^']*?)'/g,/stroke:\s*([^;}\s]+)/g],a=[/stop-color="([^"]*?)"/g,/stop-color='([^']*?)'/g,/stop-color:\s*([^;}\s]+)/g];o.forEach(g=>{let f;for(;(f=g.exec(n))!==null;){let d=f[1].trim();k(d)&&(e.add(d),s.add(d));}}),i.forEach(g=>{let f;for(;(f=g.exec(n))!==null;){let d=f[1].trim();k(d)&&(t.add(d),s.add(d));}}),a.forEach(g=>{let f;for(;(f=g.exec(n))!==null;){let d=f[1].trim();k(d)&&(r.add(d),s.add(d));}});let l=Array.from(e).sort(),c=Array.from(t).sort(),p=Array.from(r).sort(),u=Array.from(s).sort(),x=new Map,C=new Map,v=new Map,b=new Map;return u.forEach((g,f)=>{let d=f===0?"color":`color${f+1}`;b.set(g,d),l.includes(g)&&x.set(g,d),c.includes(g)&&C.set(g,d),p.includes(g)&&v.set(g,d);}),{colors:u,colorMap:b,fillColors:l,strokeColors:c,gradientColors:p,fillColorMap:x,strokeColorMap:C,gradientColorMap:v}}function pe(n){let e=D(n),t=new Map,r=/<(path|circle|rect|ellipse|line|polyline|polygon)[^>]*>/g,s;for(;(s=r.exec(n))!==null;){let o=s[0],i=o.match(/d="([^"]*?)"/),a=o.match(/fill="([^"]*?)"/);if(i&&a){let l=i[1].substring(0,50),c=a[1],p=e.colorMap.get(c);p&&t.set(l,p);}}return {colorInfo:e,elementColorMap:t}}function ce(n,e,t){let r=n,s=t==="react"?/(<path[^>]*d="([^"]{1,50})[^"]*"[^>]*fill=){[^}]*currentColor[^}]*}([^>]*>)/g:/(<path[^>]*d="([^"]{1,50})[^"]*"[^>]*fill=)"currentColor"([^>]*>)/g;return r=r.replace(s,(o,i,a,l)=>{let c=e.get(a);return c?t==="react"?`${i}{${c}}${l}`:`${i}"${c}"${l}`:o}),r}function ue(n,e){return n.length===0?"":n.map((r,s)=>{let o=s===0?"color":`color${s+1}`,i=`${o}Class`;return e==="react"?`  ${o}?: string;
   ${i}?: string;`:`    ${o}: { type: String, default: 'currentColor' },
     ${i}: { type: String, default: '' },`}).join(`
-`)}function A(n){return !n||n==="none"||n==="transparent"||n==="currentColor"?false:/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(n)||/^rgba?\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*(?:,\s*[\d.]+\s*)?\)$/.test(n)||/^hsla?\(\s*\d+\s*,\s*\d+%\s*,\s*\d+%\s*(?:,\s*[\d.]+\s*)?\)$/.test(n)?true:["red","green","blue","yellow","orange","purple","pink","brown","black","white","gray","grey","cyan","magenta","lime","maroon","navy","olive","silver","teal","aqua","fuchsia"].includes(n.toLowerCase())}export{E as AccessibilityFeature,b as ColorSplittingFeature,v as ComponentGenerator,V as ReactGenerator,G as SVGFusion,S as SVGParser,w as SVGTransformer,$ as StrokeFixingFeature,R as VueGenerator,D as convertToReact,j as convertToVue,B as createSvgoConfig,N as extractColors,ae as extractColorsWithElementMapping,se as formatComponentName,pe as generateColorProps,oe as generateIndexFile,J as optimizeSvg,y as pascalCase,M as readSvgDirectory,K as readSvgFile,le as replaceCurrentColorWithVariables,re as sanitizeComponentName,ee as svgToComponentName,Y as writeComponentFile,X as writeSvgFile};
+`)}function k(n){return !n||n==="none"||n==="transparent"||n==="currentColor"?false:/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(n)||/^rgba?\(\s*\d+\s*,\s*\d+\s*,\s*\d+\s*(?:,\s*[\d.]+\s*)?\)$/.test(n)||/^hsla?\(\s*\d+\s*,\s*\d+%\s*,\s*\d+%\s*(?:,\s*[\d.]+\s*)?\)$/.test(n)?true:["red","green","blue","yellow","orange","purple","pink","brown","black","white","gray","grey","cyan","magenta","lime","maroon","navy","olive","silver","teal","aqua","fuchsia"].includes(n.toLowerCase())}export{V as AccessibilityFeature,E as ColorSplittingFeature,$ as ComponentGenerator,G as ReactGenerator,T as SVGFusion,S as SVGParser,R as SVGTransformer,w as StrokeFixingFeature,O as VueGenerator,z as convertToReact,W as convertToVue,L as createSvgoConfig,D as extractColors,pe as extractColorsWithElementMapping,ne as formatComponentName,ue as generateColorProps,ie as generateIndexFile,q as optimizeSvg,y as pascalCase,M as readSvgDirectory,Y as readSvgFile,ce as replaceCurrentColorWithVariables,oe as sanitizeComponentName,re as svgToComponentName,te as writeComponentFile,ee as writeSvgFile};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "svgfusion",
-  "version": "1.8.0",
+  "version": "1.9.0",
   "description": "A powerful CLI tool and library that converts SVG files into production-ready React and Vue 3 components with native SVG props inheritance, TypeScript support, and custom SVGFusion engine.",
   "main": "dist/index.js",
   "module": "dist/index.mjs",