@nice2dev/icons 1.3.15 → 1.3.17

package/dist/cjs/figmaExport.js

@@ -1,5 +1,5 @@
-'use strict';
-
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 /**
  * @file figmaExport.ts
  * @description Export utilities for Figma/Sketch integration
@@ -11,284 +11,189 @@
  * @since 2026-03
  * @license MIT
  */
-/* ────────────────────────────────────────────────────────────────────────────
-   2. HELPER FUNCTIONS
-───────────────────────────────────────────────────────────────────────────── */
-/**
- * Convert hex color to Figma RGB (0-1 range)
- */
-/**
- * Generate readable name from icon component name
- */
 function getReadableName(name) {
-    return name
-        .replace(/^Ntd/, '')
-        .replace(/([A-Z])/g, ' $1')
-        .trim();
+  return name.replace(/^Ntd/, "").replace(/([A-Z])/g, " $1").trim();
 }
-/**
- * Generate search tags from icon name and category
- */
 function generateTags(name, category) {
-    const readable = getReadableName(name).toLowerCase();
-    const words = readable.split(/\s+/);
-    const categoryLower = category.toLowerCase();
-    return [...new Set([...words, categoryLower])];
+  const readable = getReadableName(name).toLowerCase();
+  const words = readable.split(/\s+/);
+  const categoryLower = category.toLowerCase();
+  return [.../* @__PURE__ */ new Set([...words, categoryLower])];
 }
-/* ────────────────────────────────────────────────────────────────────────────
-   3. EXPORT FUNCTIONS
-───────────────────────────────────────────────────────────────────────────── */
-/**
- * Export a single icon to Figma vector node JSON
- *
- * @example
- * ```ts
- * import { exportIconToFigmaNode, NtdHome } from '@nice2dev/icons';
- *
- * const figmaNode = exportIconToFigmaNode(NtdHome, {
- *   size: 24,
- *   variant: 'solid',
- *   primaryColor: '#6c5ce7',
- * });
- * // Use in Figma plugin: figma.createNodeFromFigmaNode(figmaNode)
- * ```
- */
 function exportIconToFigmaNode(IconComponent, options = {}) {
-    const { size = 24, variant = 'solid', primaryColor: _primaryColor = '#000000', strokeWidth: _strokeWidth = 2, } = options;
-    // Render to string (requires a DOM or ReactDOMServer for real impl)
-    // This is a simplified structure - actual implementation needs SVG rendering
-    const name = IconComponent.displayName || 'Icon';
-    return {
-        type: 'FRAME',
-        name: `${getReadableName(name)} / ${variant}`,
+  const {
+    size = 24,
+    variant = "solid",
+    primaryColor: _primaryColor = "#000000",
+    strokeWidth: _strokeWidth = 2
+  } = options;
+  const name = IconComponent.displayName || "Icon";
+  return {
+    type: "FRAME",
+    name: `${getReadableName(name)} / ${variant}`,
+    width: size,
+    height: size,
+    children: [
+      {
+        type: "VECTOR",
+        name: "icon",
         width: size,
         height: size,
-        children: [
-            {
-                type: 'VECTOR',
-                name: 'icon',
-                width: size,
-                height: size,
-                vectorPaths: [],
-                constraints: {
-                    horizontal: 'SCALE',
-                    vertical: 'SCALE',
-                },
-            },
-        ],
-        fills: [],
-        padding: { top: 0, right: 0, bottom: 0, left: 0 },
-    };
+        vectorPaths: [],
+        constraints: {
+          horizontal: "SCALE",
+          vertical: "SCALE"
+        }
+      }
+    ],
+    fills: [],
+    padding: { top: 0, right: 0, bottom: 0, left: 0 }
+  };
 }
-/**
- * Export icon to SVG string for Figma import
- *
- * Returns a clean SVG string that can be imported into Figma.
- *
- * @example
- * ```ts
- * import { exportIconToSvgString } from '@nice2dev/icons';
- *
- * const svg = exportIconToSvgString(NtdHome, { variant: 'solid', size: 24 });
- * // Copy to clipboard or use in Figma plugin's figma.createNodeFromSvg()
- * ```
- */
 function exportIconToSvgString(svgElement, options = {}) {
-    const { size = 24, removeAnimations = true } = options;
-    // Clone the element to avoid modifying the original
-    const clone = svgElement.cloneNode(true);
-    // Set size
-    clone.setAttribute('width', String(size));
-    clone.setAttribute('height', String(size));
-    // Remove animation classes and styles
-    if (removeAnimations) {
-        clone.classList.remove(...Array.from(clone.classList).filter((c) => c.startsWith('ntd-anim-')));
-        clone.style.animation = '';
-        clone.style.animationName = '';
-        clone.style.animationDuration = '';
-        clone.style.removeProperty('--ntd-anim-duration');
-        // Remove SMIL animation elements
-        clone.querySelectorAll('animate, animateTransform, animateMotion').forEach((el) => el.remove());
-    }
-    // Remove data- attributes used for interaction
-    clone.removeAttribute('data-name');
-    // Serialize
-    return new XMLSerializer().serializeToString(clone);
+  const { size = 24, removeAnimations = true } = options;
+  const clone = svgElement.cloneNode(true);
+  clone.setAttribute("width", String(size));
+  clone.setAttribute("height", String(size));
+  if (removeAnimations) {
+    clone.classList.remove(...Array.from(clone.classList).filter((c) => c.startsWith("ntd-anim-")));
+    clone.style.animation = "";
+    clone.style.animationName = "";
+    clone.style.animationDuration = "";
+    clone.style.removeProperty("--ntd-anim-duration");
+    clone.querySelectorAll("animate, animateTransform, animateMotion").forEach((el) => el.remove());
+  }
+  clone.removeAttribute("data-name");
+  return new XMLSerializer().serializeToString(clone);
 }
-/**
- * Export icon as base64 data URL
- */
 function exportIconToDataUrl(svgElement, options) {
-    const svgString = exportIconToSvgString(svgElement, options);
-    const base64 = btoa(unescape(encodeURIComponent(svgString)));
-    return `data:image/svg+xml;base64,${base64}`;
+  const svgString = exportIconToSvgString(svgElement, options);
+  const base64 = btoa(unescape(encodeURIComponent(svgString)));
+  return `data:image/svg+xml;base64,${base64}`;
 }
-/**
- * Generate Figma plugin manifest for all icons
- *
- * Creates a JSON manifest that can be used by a Figma plugin
- * to display and insert icons.
- *
- * @example
- * ```ts
- * import { generateFigmaPluginManifest, allIcons } from '@nice2dev/icons';
- *
- * const manifest = generateFigmaPluginManifest(allIcons, {
- *   name: 'Nice2Dev Icons',
- *   version: '1.0.0',
- * });
- *
- * // Save as icons.json for your Figma plugin
- * ```
- */
 function generateFigmaPluginManifest(icons, options = {}) {
-    const { name = '@nice2dev/icons', version = '1.0.0' } = options;
-    // Collect categories
-    const categorySet = new Set();
-    icons.forEach((icon) => categorySet.add(icon.category));
-    const categories = Array.from(categorySet).sort();
-    // Build icon entries
-    const iconEntries = icons.map((icon) => ({
-        name: getReadableName(icon.name),
-        category: icon.category,
-        variants: [
-            'solid',
-            'sharp',
-            'outline',
-            'wireframe',
-            'duotone',
-            'cutout',
-            'vivid',
-            'mini',
-            '3d',
-            'rounded',
-        ],
-        tags: generateTags(icon.name, icon.category),
-        paths: {
-        // Paths would be extracted from actual rendering
-        // This is a placeholder structure
-        },
-    }));
-    return {
-        name,
-        version,
-        iconCount: icons.length,
-        categories,
-        icons: iconEntries,
-    };
+  const { name = "@nice2dev/icons", version = "1.0.0" } = options;
+  const categorySet = /* @__PURE__ */ new Set();
+  icons.forEach((icon) => categorySet.add(icon.category));
+  const categories = Array.from(categorySet).sort();
+  const iconEntries = icons.map((icon) => ({
+    name: getReadableName(icon.name),
+    category: icon.category,
+    variants: [
+      "solid",
+      "sharp",
+      "outline",
+      "wireframe",
+      "duotone",
+      "cutout",
+      "vivid",
+      "mini",
+      "3d",
+      "rounded"
+    ],
+    tags: generateTags(icon.name, icon.category),
+    paths: {
+      // Paths would be extracted from actual rendering
+      // This is a placeholder structure
+    }
+  }));
+  return {
+    name,
+    version,
+    iconCount: icons.length,
+    categories,
+    icons: iconEntries
+  };
 }
-/**
- * Download icons as SVG files (browser)
- *
- * Triggers a download of the icon as an SVG file.
- */
 function downloadIconAsSvg(svgElement, filename, options) {
-    const svgString = exportIconToSvgString(svgElement, options);
-    const blob = new Blob([svgString], { type: 'image/svg+xml' });
-    const url = URL.createObjectURL(blob);
-    const link = document.createElement('a');
-    link.href = url;
-    link.download = filename.endsWith('.svg') ? filename : `${filename}.svg`;
-    document.body.appendChild(link);
-    link.click();
-    document.body.removeChild(link);
-    URL.revokeObjectURL(url);
+  const svgString = exportIconToSvgString(svgElement, options);
+  const blob = new Blob([svgString], { type: "image/svg+xml" });
+  const url = URL.createObjectURL(blob);
+  const link = document.createElement("a");
+  link.href = url;
+  link.download = filename.endsWith(".svg") ? filename : `${filename}.svg`;
+  document.body.appendChild(link);
+  link.click();
+  document.body.removeChild(link);
+  URL.revokeObjectURL(url);
 }
-/**
- * Download icons as PNG (browser)
- *
- * Renders the SVG to canvas and downloads as PNG.
- */
 async function downloadIconAsPng(svgElement, filename, options = {}) {
-    const { size = 24, scale = 2, backgroundColor } = options;
-    const svgString = exportIconToSvgString(svgElement, { size });
-    const svg64 = btoa(unescape(encodeURIComponent(svgString)));
-    const imgSrc = `data:image/svg+xml;base64,${svg64}`;
-    return new Promise((resolve, reject) => {
-        const img = new Image();
-        img.onload = () => {
-            const canvas = document.createElement('canvas');
-            const scaledSize = size * scale;
-            canvas.width = scaledSize;
-            canvas.height = scaledSize;
-            const ctx = canvas.getContext('2d');
-            if (!ctx) {
-                reject(new Error('Could not get canvas context'));
-                return;
-            }
-            // Fill background if specified
-            if (backgroundColor) {
-                ctx.fillStyle = backgroundColor;
-                ctx.fillRect(0, 0, scaledSize, scaledSize);
-            }
-            // Draw image
-            ctx.drawImage(img, 0, 0, scaledSize, scaledSize);
-            // Download
-            canvas.toBlob((blob) => {
-                if (!blob) {
-                    reject(new Error('Could not create blob'));
-                    return;
-                }
-                const url = URL.createObjectURL(blob);
-                const link = document.createElement('a');
-                link.href = url;
-                link.download = filename.endsWith('.png') ? filename : `${filename}.png`;
-                document.body.appendChild(link);
-                link.click();
-                document.body.removeChild(link);
-                URL.revokeObjectURL(url);
-                resolve();
-            }, 'image/png');
-        };
-        img.onerror = () => reject(new Error('Failed to load SVG image'));
-        img.src = imgSrc;
-    });
+  const { size = 24, scale = 2, backgroundColor } = options;
+  const svgString = exportIconToSvgString(svgElement, { size });
+  const svg64 = btoa(unescape(encodeURIComponent(svgString)));
+  const imgSrc = `data:image/svg+xml;base64,${svg64}`;
+  return new Promise((resolve, reject) => {
+    const img = new Image();
+    img.onload = () => {
+      const canvas = document.createElement("canvas");
+      const scaledSize = size * scale;
+      canvas.width = scaledSize;
+      canvas.height = scaledSize;
+      const ctx = canvas.getContext("2d");
+      if (!ctx) {
+        reject(new Error("Could not get canvas context"));
+        return;
+      }
+      if (backgroundColor) {
+        ctx.fillStyle = backgroundColor;
+        ctx.fillRect(0, 0, scaledSize, scaledSize);
+      }
+      ctx.drawImage(img, 0, 0, scaledSize, scaledSize);
+      canvas.toBlob((blob) => {
+        if (!blob) {
+          reject(new Error("Could not create blob"));
+          return;
+        }
+        const url = URL.createObjectURL(blob);
+        const link = document.createElement("a");
+        link.href = url;
+        link.download = filename.endsWith(".png") ? filename : `${filename}.png`;
+        document.body.appendChild(link);
+        link.click();
+        document.body.removeChild(link);
+        URL.revokeObjectURL(url);
+        resolve();
+      }, "image/png");
+    };
+    img.onerror = () => reject(new Error("Failed to load SVG image"));
+    img.src = imgSrc;
+  });
 }
-/**
- * Copy icon SVG to clipboard
- */
 async function copyIconToClipboard(svgElement, options) {
-    var _a;
-    const svgString = exportIconToSvgString(svgElement, options);
-    if ((_a = navigator.clipboard) === null || _a === void 0 ? void 0 : _a.writeText) {
-        await navigator.clipboard.writeText(svgString);
-    }
-    else {
-        // Fallback for older browsers
-        const textarea = document.createElement('textarea');
-        textarea.value = svgString;
-        textarea.style.position = 'fixed';
-        textarea.style.opacity = '0';
-        document.body.appendChild(textarea);
-        textarea.select();
-        document.execCommand('copy');
-        document.body.removeChild(textarea);
-    }
+  const svgString = exportIconToSvgString(svgElement, options);
+  if (navigator.clipboard?.writeText) {
+    await navigator.clipboard.writeText(svgString);
+  } else {
+    const textarea = document.createElement("textarea");
+    textarea.value = svgString;
+    textarea.style.position = "fixed";
+    textarea.style.opacity = "0";
+    document.body.appendChild(textarea);
+    textarea.select();
+    document.execCommand("copy");
+    document.body.removeChild(textarea);
+  }
 }
-/**
- * Batch export multiple icons
- */
 function batchExportIcons(svgElements, format, options) {
-    const result = {};
-    for (const { element, name } of svgElements) {
-        switch (format) {
-            case 'svg':
-                result[name] = exportIconToSvgString(element, options);
-                break;
-            case 'data-url':
-                result[name] = exportIconToDataUrl(element, options);
-                break;
-            case 'json':
-                result[name] = JSON.stringify({
-                    name,
-                    svg: exportIconToSvgString(element, options),
-                });
-                break;
-        }
+  const result = {};
+  for (const { element, name } of svgElements) {
+    switch (format) {
+      case "svg":
+        result[name] = exportIconToSvgString(element, options);
+        break;
+      case "data-url":
+        result[name] = exportIconToDataUrl(element, options);
+        break;
+      case "json":
+        result[name] = JSON.stringify({
+          name,
+          svg: exportIconToSvgString(element, options)
+        });
+        break;
     }
-    return result;
+  }
+  return result;
 }
-
 exports.batchExportIcons = batchExportIcons;
 exports.copyIconToClipboard = copyIconToClipboard;
 exports.downloadIconAsPng = downloadIconAsPng;