@woodylab/payload 0.0.19 → 0.0.22

package/dist/index.cjs.js

@@ -1,12 +1,289 @@
 'use strict';
 
 var fields_index = require('./index-DhejC-CC.js');
-var config_index = require('./index-Ds44OSfM.js');
+var config_index = require('./index-D0uU9RKm.js');
 var fieldRoles = require('./fieldRoles-ByWB8j1Q.js');
 
+const hexToRgb = (hex) => {
+    // Rimuove il simbolo `#` se presente
+    const cleanedHex = hex.replace(/^#/, '');
+    // Controlla che il colore sia valido (3 o 6 caratteri)
+    if (!/^([A-Fa-f0-9]{3}|[A-Fa-f0-9]{6})$/.test(cleanedHex)) {
+        throw new Error(`Colore HEX non valido: ${hex}`);
+    }
+    // In caso di formato corto (es. "FFF"), lo converte in formato lungo (es. "FFFFFF")
+    const expandedHex = cleanedHex.length === 3
+        ? cleanedHex
+            .split('')
+            .map(char => char + char)
+            .join('')
+        : cleanedHex;
+    // Converte il valore HEX in decimali per R, G e B
+    const r = parseInt(expandedHex.slice(0, 2), 16);
+    const g = parseInt(expandedHex.slice(2, 4), 16);
+    const b = parseInt(expandedHex.slice(4, 6), 16);
+    return { r, g, b };
+};
 
+function generateCssVars(settings) {
+    // Gestione robusta dei font
+    const fontWeights = [300, 400, 500, 600, 700, 800];
+    const fontsToImport = [settings.headingFont, settings.textFont]
+        .filter(Boolean)
+        .map(f => {
+        if (!f)
+            return '';
+        // Aggiungiamo il parametro wght per specificare i pesi da caricare
+        return `@import url('https://fonts.googleapis.com/css2?family=${f.replace(/ /g, "+")}:wght@${fontWeights.join(';')}&display=swap');`;
+    })
+        .join("\n");
+    const generateOpacityVariants = (color, name) => {
+        if (!color) {
+            return '';
+        }
+        try {
+            const rgbValue = hexToRgb(color);
+            if (!rgbValue || typeof rgbValue.r !== 'number' ||
+                typeof rgbValue.g !== 'number' ||
+                typeof rgbValue.b !== 'number') {
+                console.warn(`Impossibile convertire il colore ${name}: ${color}`);
+                return '';
+            }
+            const { r, g, b } = rgbValue;
+            const opacityVars = Array.from({ length: 9 }, (_, i) => {
+                const opacity = (i + 1) * 10;
+                return `--color-${name}-${opacity}: rgba(${r}, ${g}, ${b}, ${opacity / 100});`;
+            }).join("\n");
+            return `
+        --color-${name}: rgb(${r}, ${g}, ${b}); /* Default (opacità 1) */
+        ${opacityVars}
+      `;
+        }
+        catch (error) {
+            console.warn(`Errore nella generazione delle varianti di opacità per ${name}: ${error}`);
+            return '';
+        }
+    };
+    // Genera variabili solo per i colori forniti
+    const primaryVars = generateOpacityVariants(settings.primaryColor, "primary");
+    const secondaryVars = generateOpacityVariants(settings.secondaryColor, "secondary");
+    const accentVars = generateOpacityVariants(settings.accentColor, "accent");
+    const darkVars = generateOpacityVariants(settings.darkColor, "dark");
+    const lightVars = generateOpacityVariants(settings.lightColor, "light");
+    // Genera i valori dei font in modo sicuro
+    const headingFontValue = settings.headingFont
+        ? `'${settings.headingFont}', sans-serif`
+        : 'system-layout, sans-serif';
+    const textFontValue = settings.textFont
+        ? `'${settings.textFont}', sans-serif`
+        : 'system-layout, sans-serif';
+    return `
+    ${fontsToImport}
+
+    :root {
+      --font-heading: ${headingFontValue};
+      --font-text: ${textFontValue};
+      --color-white: #ffffff;
+      --color-black: #000000;
+      --color-foreground: ${settings.foregroundColor || '#FFFFFF'};
+      ${primaryVars}
+      ${secondaryVars}
+      ${accentVars}
+      ${darkVars}
+      ${lightVars}
+    }
+  `;
+}
+
+function getButtonClasses(config) {
+    const { buttonStyle = 'solid', buttonColor = 'primary', buttonSize = 'default', buttonRounded = 'default', iconPosition = 'left', textColor, // Aggiungiamo il colore del testo
+    additionalEffects = [], } = config;
+    const classes = [
+        'inline-flex',
+        'items-center',
+        'justify-center',
+        'font-medium',
+        'focus:outline-none',
+        'focus-visible:ring-2',
+        'focus-visible:ring-offset-2',
+    ];
+    // Stile base
+    switch (buttonStyle) {
+        case 'solid':
+            classes.push(`bg-${buttonColor}`);
+            // Usa textColor se specificato, altrimenti usa il colore predefinito basato sul buttonColor
+            if (textColor) {
+                classes.push(`text-${textColor}`);
+            }
+            else {
+                classes.push(buttonColor === 'light' ? 'text-dark' : 'text-white');
+            }
+            classes.push(`hover:bg-${buttonColor}/90`);
+            break;
+        case 'outline':
+            classes.push(`border`);
+            classes.push(`border-${buttonColor}`);
+            // Usa textColor se specificato, altrimenti usa il colore del bottone
+            if (textColor) {
+                classes.push(`text-${textColor}`);
+                // Mantieni lo stesso colore di testo per l'hover, a meno che non sia specificato diversamente
+                classes.push(`hover:text-${textColor}`);
+            }
+            else {
+                classes.push(`text-${buttonColor}`);
+                classes.push(`hover:text-${buttonColor === 'light' ? 'dark' : 'white'}`);
+            }
+            classes.push(`hover:bg-${buttonColor}`);
+            break;
+        case 'ghost':
+            // Usa textColor se specificato, altrimenti usa il colore del bottone
+            if (textColor) {
+                classes.push(`text-${textColor}`);
+            }
+            else {
+                classes.push(`text-${buttonColor}`);
+            }
+            classes.push(`hover:bg-${buttonColor}/10`);
+            break;
+        case 'link':
+            // Usa textColor se specificato, altrimenti usa il colore del bottone
+            if (textColor) {
+                classes.push(`text-${textColor}`);
+            }
+            else {
+                classes.push(`text-${buttonColor}`);
+            }
+            classes.push('hover:underline');
+            break;
+    }
+    // Dimensione
+    switch (buttonSize) {
+        case 'small':
+            classes.push('text-xs px-2.5 py-1.5');
+            break;
+        case 'default':
+            classes.push('text-sm px-4 py-2');
+            break;
+        case 'medium':
+            classes.push('text-base px-5 py-2.5');
+            break;
+        case 'large':
+            classes.push('text-lg px-6 py-3');
+            break;
+        case 'xl':
+            classes.push('text-xl px-8 py-4');
+            break;
+    }
+    // Se è solo icona, aggiusta il padding per renderlo quadrato/rotondo
+    if (config.useIcon && iconPosition === 'only') {
+        classes.push('p-0');
+        switch (buttonSize) {
+            case 'small':
+                classes.push('w-7 h-7');
+                break;
+            case 'default':
+                classes.push('w-9 h-9');
+                break;
+            case 'medium':
+                classes.push('w-10 h-10');
+                break;
+            case 'large':
+                classes.push('w-12 h-12');
+                break;
+            case 'xl':
+                classes.push('w-14 h-14');
+                break;
+        }
+    }
+    // Arrotondamento
+    switch (buttonRounded) {
+        case 'none':
+            classes.push('rounded-none');
+            break;
+        case 'sm':
+            classes.push('rounded-sm');
+            break;
+        case 'default':
+            classes.push('rounded');
+            break;
+        case 'lg':
+            classes.push('rounded-lg');
+            break;
+        case 'full':
+            classes.push('rounded-full');
+            break;
+    }
+    // Effetti aggiuntivi
+    if (additionalEffects) {
+        if (additionalEffects.includes('shadow')) {
+            classes.push('shadow-md hover:shadow-lg');
+        }
+        if (additionalEffects.includes('transition')) {
+            classes.push('transition-all duration-200');
+        }
+        if (additionalEffects.includes('scale')) {
+            classes.push('transform hover:scale-105');
+        }
+    }
+    // Aggiungi la classe focus-ring per il colore appropriato
+    classes.push(`focus-visible:ring-${buttonColor}/50`);
+    return classes.join(' ');
+}
+
+function getClassName(config) {
+    // Mantieni tutte le altre classi Tailwind, ma ometti quelle di colore di sfondo
+    const classList = [];
+    // Gestione campi compositi
+    ['p', 'm'].forEach((field) => {
+        if (config[field]?.className) {
+            classList.push(config[field].className);
+        }
+    });
+    // Gestione campi diretti
+    ['fs', 'h', 'container'].forEach((field) => {
+        if (config[field]) {
+            classList.push(config[field]);
+        }
+    });
+    // Altre classi che non sono colori dinamici
+    if (config.bgi && config.bgi.url) {
+        classList.push('bg-no-repeat bg-cover');
+    }
+    if (config.boxShadow) {
+        classList.push(config.boxShadow);
+    }
+    if (config.borderRadius) {
+        classList.push(config.borderRadius);
+    }
+    return classList.join(' ');
+}
+
+function getInlineStyles(config) {
+    const styles = {};
+    // Gestisci il background color con stile inline
+    if (config.bgc) {
+        styles.backgroundColor = config.bgc;
+    }
+    // Gestione background image
+    if (config.bgi && config.bgi.url) {
+        styles.backgroundImage = `url("${config.bgi.url}")`;
+        // Gestione focal point
+        if (typeof config.bgi.focalX === 'number' && typeof config.bgi.focalY === 'number') {
+            styles.backgroundPosition = `${config.bgi.focalX}% ${config.bgi.focalY}%`;
+        }
+    }
+    return styles;
+}
 
 exports.Fields = fields_index.index;
 exports.Config = config_index.index;
+exports.generatePreviewPath = config_index.generatePreviewPath;
+exports.googleFonts = config_index.GoogleFonts;
 exports.Tailwind = fieldRoles.index;
+exports.iconsList = fieldRoles.iconsList;
+exports.generateCssVars = generateCssVars;
+exports.getButtonClasses = getButtonClasses;
+exports.getClassName = getClassName;
+exports.getInlineStyles = getInlineStyles;
+exports.hexToRgb = hexToRgb;
 //# sourceMappingURL=index.cjs.js.map

package/dist/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}
+{"version":3,"file":"index.cjs.js","sources":["../src/hexToRgb.ts","../src/generateCssVars.ts","../src/getButtonClasses.ts","../src/getClassName.ts","../src/getInlineStyles.ts"],"sourcesContent":["const hexToRgb = (hex: string): { r: number; g: number; b: number } => {\n    // Rimuove il simbolo `#` se presente\n    const cleanedHex = hex.replace(/^#/, '');\n\n    // Controlla che il colore sia valido (3 o 6 caratteri)\n    if (!/^([A-Fa-f0-9]{3}|[A-Fa-f0-9]{6})$/.test(cleanedHex)) {\n        throw new Error(`Colore HEX non valido: ${hex}`);\n    }\n\n    // In caso di formato corto (es. \"FFF\"), lo converte in formato lungo (es. \"FFFFFF\")\n    const expandedHex =\n        cleanedHex.length === 3\n            ? cleanedHex\n                .split('')\n                .map(char => char + char)\n                .join('')\n            : cleanedHex;\n\n    // Converte il valore HEX in decimali per R, G e B\n    const r = parseInt(expandedHex.slice(0, 2), 16);\n    const g = parseInt(expandedHex.slice(2, 4), 16);\n    const b = parseInt(expandedHex.slice(4, 6), 16);\n\n    return { r, g, b };\n};\n\nexport default hexToRgb;","import hexToRgb from \"./hexToRgb\";\n\nfunction generateCssVars(settings: {\n  headingFont?: string;\n  textFont?: string;\n  foregroundColor?: string;\n  primaryColor?: string;\n  secondaryColor?: string;\n  accentColor?: string;\n  darkColor?: string;\n  lightColor?: string;\n}): string {\n  // Gestione robusta dei font\n  const fontWeights = [300, 400, 500, 600, 700, 800];\n\n  const fontsToImport = [settings.headingFont, settings.textFont]\n    .filter(Boolean)\n    .map(f => {\n      if (!f) return '';\n      // Aggiungiamo il parametro wght per specificare i pesi da caricare\n      return `@import url('https://fonts.googleapis.com/css2?family=${f.replace(\n        / /g,\n        \"+\"\n      )}:wght@${fontWeights.join(';')}&display=swap');`\n    })\n    .join(\"\\n\");\n\n\n  const generateOpacityVariants = (color: string | undefined, name: string): string => {\n    if (!color) {\n      return '';\n    }\n\n    try {\n      const rgbValue = hexToRgb(color);\n\n      if (!rgbValue || typeof rgbValue.r !== 'number' ||\n          typeof rgbValue.g !== 'number' ||\n          typeof rgbValue.b !== 'number') {\n        console.warn(`Impossibile convertire il colore ${name}: ${color}`);\n        return '';\n      }\n\n      const { r, g, b } = rgbValue;\n\n      const opacityVars = Array.from({ length: 9 }, (_, i) => {\n        const opacity = (i + 1) * 10;\n        return `--color-${name}-${opacity}: rgba(${r}, ${g}, ${b}, ${opacity / 100});`;\n      }).join(\"\\n\");\n\n      return `\n        --color-${name}: rgb(${r}, ${g}, ${b}); /* Default (opacità 1) */\n        ${opacityVars}\n      `;\n    } catch (error) {\n      console.warn(`Errore nella generazione delle varianti di opacità per ${name}: ${error}`);\n      return '';\n    }\n  };\n\n  // Genera variabili solo per i colori forniti\n  const primaryVars = generateOpacityVariants(settings.primaryColor, \"primary\");\n  const secondaryVars = generateOpacityVariants(settings.secondaryColor, \"secondary\");\n  const accentVars = generateOpacityVariants(settings.accentColor, \"accent\");\n  const darkVars = generateOpacityVariants(settings.darkColor, \"dark\");\n  const lightVars = generateOpacityVariants(settings.lightColor, \"light\");\n\n  // Genera i valori dei font in modo sicuro\n  const headingFontValue = settings.headingFont\n      ? `'${settings.headingFont}', sans-serif`\n      : 'system-layout, sans-serif';\n\n  const textFontValue = settings.textFont\n      ? `'${settings.textFont}', sans-serif`\n      : 'system-layout, sans-serif';\n\n  return `\n    ${fontsToImport}\n\n    :root {\n      --font-heading: ${headingFontValue};\n      --font-text: ${textFontValue};\n      --color-white: #ffffff;\n      --color-black: #000000;\n      --color-foreground: ${settings.foregroundColor || '#FFFFFF'};\n      ${primaryVars}\n      ${secondaryVars}\n      ${accentVars}\n      ${darkVars}\n      ${lightVars}\n    }\n  `;\n}\n\nexport default generateCssVars;\n","export type ButtonConfig = {\n  show: boolean\n  buttonStyle?: 'solid' | 'outline' | 'ghost' | 'link'\n  buttonColor?: 'primary' | 'secondary' | 'accent' | 'dark' | 'light'\n  buttonSize?: 'small' | 'default' | 'medium' | 'large' | 'xl'\n  buttonRounded?: 'none' | 'sm' | 'default' | 'lg' | 'full'\n  useIcon?: boolean\n  iconPosition?: 'left' | 'right' | 'only'\n  iconName?: string\n  iconVariant?: 'outline' | 'solid'\n  alignment?: 'left' | 'center' | 'right'\n  textColor?: 'primary' | 'secondary' | 'accent' | 'dark' | 'light' | 'white' | 'black'\n  additionalEffects?: ('shadow' | 'transition' | 'scale')[]\n}\n\nexport type ActionConfig = ButtonConfig & {\n  show?: boolean\n  actionType?: 'internalLink' | 'externalLink' | 'customAction'\n  internalLink?: {\n    relationTo: string\n    value: {\n      slug: string\n      id: string\n    }\n  }\n  externalLink?: string\n  customActionId?: string\n  label?: string\n  onClick?: () => void\n}\n\nfunction getButtonClasses(config: ActionConfig): string {\n  const {\n    buttonStyle = 'solid',\n    buttonColor = 'primary',\n    buttonSize = 'default',\n    buttonRounded = 'default',\n    iconPosition = 'left',\n    textColor, // Aggiungiamo il colore del testo\n    additionalEffects = [],\n  } = config\n\n  const classes: string[] = [\n    'inline-flex',\n    'items-center',\n    'justify-center',\n    'font-medium',\n    'focus:outline-none',\n    'focus-visible:ring-2',\n    'focus-visible:ring-offset-2',\n  ]\n\n  // Stile base\n  switch (buttonStyle) {\n    case 'solid':\n      classes.push(`bg-${buttonColor}`)\n      // Usa textColor se specificato, altrimenti usa il colore predefinito basato sul buttonColor\n      if (textColor) {\n        classes.push(`text-${textColor}`)\n      } else {\n        classes.push(buttonColor === 'light' ? 'text-dark' : 'text-white')\n      }\n      classes.push(`hover:bg-${buttonColor}/90`)\n      break\n    case 'outline':\n      classes.push(`border`)\n      classes.push(`border-${buttonColor}`)\n      // Usa textColor se specificato, altrimenti usa il colore del bottone\n      if (textColor) {\n        classes.push(`text-${textColor}`)\n        // Mantieni lo stesso colore di testo per l'hover, a meno che non sia specificato diversamente\n        classes.push(`hover:text-${textColor}`)\n      } else {\n        classes.push(`text-${buttonColor}`)\n        classes.push(`hover:text-${buttonColor === 'light' ? 'dark' : 'white'}`)\n      }\n      classes.push(`hover:bg-${buttonColor}`)\n      break\n    case 'ghost':\n      // Usa textColor se specificato, altrimenti usa il colore del bottone\n      if (textColor) {\n        classes.push(`text-${textColor}`)\n      } else {\n        classes.push(`text-${buttonColor}`)\n      }\n      classes.push(`hover:bg-${buttonColor}/10`)\n      break\n    case 'link':\n      // Usa textColor se specificato, altrimenti usa il colore del bottone\n      if (textColor) {\n        classes.push(`text-${textColor}`)\n      } else {\n        classes.push(`text-${buttonColor}`)\n      }\n      classes.push('hover:underline')\n      break\n  }\n\n  // Dimensione\n  switch (buttonSize) {\n    case 'small':\n      classes.push('text-xs px-2.5 py-1.5')\n      break\n    case 'default':\n      classes.push('text-sm px-4 py-2')\n      break\n    case 'medium':\n      classes.push('text-base px-5 py-2.5')\n      break\n    case 'large':\n      classes.push('text-lg px-6 py-3')\n      break\n    case 'xl':\n      classes.push('text-xl px-8 py-4')\n      break\n  }\n\n  // Se è solo icona, aggiusta il padding per renderlo quadrato/rotondo\n  if (config.useIcon && iconPosition === 'only') {\n    classes.push('p-0')\n    switch (buttonSize) {\n      case 'small':\n        classes.push('w-7 h-7')\n        break\n      case 'default':\n        classes.push('w-9 h-9')\n        break\n      case 'medium':\n        classes.push('w-10 h-10')\n        break\n      case 'large':\n        classes.push('w-12 h-12')\n        break\n      case 'xl':\n        classes.push('w-14 h-14')\n        break\n    }\n  }\n\n  // Arrotondamento\n  switch (buttonRounded) {\n    case 'none':\n      classes.push('rounded-none')\n      break\n    case 'sm':\n      classes.push('rounded-sm')\n      break\n    case 'default':\n      classes.push('rounded')\n      break\n    case 'lg':\n      classes.push('rounded-lg')\n      break\n    case 'full':\n      classes.push('rounded-full')\n      break\n  }\n\n  // Effetti aggiuntivi\n  if (additionalEffects) {\n    if (additionalEffects.includes('shadow')) {\n      classes.push('shadow-md hover:shadow-lg')\n    }\n    if (additionalEffects.includes('transition')) {\n      classes.push('transition-all duration-200')\n    }\n    if (additionalEffects.includes('scale')) {\n      classes.push('transform hover:scale-105')\n    }\n  }\n\n  // Aggiungi la classe focus-ring per il colore appropriato\n  classes.push(`focus-visible:ring-${buttonColor}/50`)\n\n  return classes.join(' ')\n}\n\nexport default getButtonClasses\n","function getClassName(config: any): string {\n    // Mantieni tutte le altre classi Tailwind, ma ometti quelle di colore di sfondo\n    const classList: string[] = [];\n\n    // Gestione campi compositi\n    ['p', 'm'].forEach((field) => {\n        if (config[field]?.className) {\n            classList.push(config[field].className);\n        }\n    });\n\n    // Gestione campi diretti\n    ['fs', 'h', 'container'].forEach((field) => {\n        if (config[field]) {\n            classList.push(config[field]);\n        }\n    });\n\n    // Altre classi che non sono colori dinamici\n    if (config.bgi && config.bgi.url) {\n        classList.push('bg-no-repeat bg-cover');\n    }\n    if (config.boxShadow) {\n      classList.push(config.boxShadow);\n    }\n  if (config.borderRadius) {\n    classList.push(config.borderRadius);\n  }\n\n    return classList.join(' ');\n}\nexport default getClassName;\n","import React from 'react'\n\nfunction getInlineStyles(config: any): React.CSSProperties {\n  const styles: React.CSSProperties = {}\n\n  // Gestisci il background color con stile inline\n  if (config.bgc) {\n    styles.backgroundColor = config.bgc\n  }\n\n  // Gestione background image\n  if (config.bgi && config.bgi.url) {\n    styles.backgroundImage = `url(\"${config.bgi.url}\")`\n\n    // Gestione focal point\n    if (typeof config.bgi.focalX === 'number' && typeof config.bgi.focalY === 'number') {\n      styles.backgroundPosition = `${config.bgi.focalX}% ${config.bgi.focalY}%`\n    }\n  }\n\n  return styles\n}\n\nexport default getInlineStyles\n"],"names":[],"mappings":";;;;;;AAAA,MAAM,QAAQ,GAAG,CAAC,GAAW,KAAyC;;IAElE,MAAM,UAAU,GAAG,GAAG,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC;;IAGxC,IAAI,CAAC,mCAAmC,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE;AACvD,QAAA,MAAM,IAAI,KAAK,CAAC,0BAA0B,GAAG,CAAA,CAAE,CAAC;IACpD;;AAGA,IAAA,MAAM,WAAW,GACb,UAAU,CAAC,MAAM,KAAK;AAClB,UAAE;aACG,KAAK,CAAC,EAAE;aACR,GAAG,CAAC,IAAI,IAAI,IAAI,GAAG,IAAI;aACvB,IAAI,CAAC,EAAE;UACV,UAAU;;AAGpB,IAAA,MAAM,CAAC,GAAG,QAAQ,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;AAC/C,IAAA,MAAM,CAAC,GAAG,QAAQ,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;AAC/C,IAAA,MAAM,CAAC,GAAG,QAAQ,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;AAE/C,IAAA,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AACtB;;ACtBA,SAAS,eAAe,CAAC,QASxB,EAAA;;AAEC,IAAA,MAAM,WAAW,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAElD,MAAM,aAAa,GAAG,CAAC,QAAQ,CAAC,WAAW,EAAE,QAAQ,CAAC,QAAQ;SAC3D,MAAM,CAAC,OAAO;SACd,GAAG,CAAC,CAAC,IAAG;AACP,QAAA,IAAI,CAAC,CAAC;AAAE,YAAA,OAAO,EAAE;;AAEjB,QAAA,OAAO,yDAAyD,CAAC,CAAC,OAAO,CACvE,IAAI,EACJ,GAAG,CACJ,CAAA,MAAA,EAAS,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,kBAAkB;AACnD,IAAA,CAAC;SACA,IAAI,CAAC,IAAI,CAAC;AAGb,IAAA,MAAM,uBAAuB,GAAG,CAAC,KAAyB,EAAE,IAAY,KAAY;QAClF,IAAI,CAAC,KAAK,EAAE;AACV,YAAA,OAAO,EAAE;QACX;AAEA,QAAA,IAAI;AACF,YAAA,MAAM,QAAQ,GAAG,QAAQ,CAAC,KAAK,CAAC;YAEhC,IAAI,CAAC,QAAQ,IAAI,OAAO,QAAQ,CAAC,CAAC,KAAK,QAAQ;AAC3C,gBAAA,OAAO,QAAQ,CAAC,CAAC,KAAK,QAAQ;AAC9B,gBAAA,OAAO,QAAQ,CAAC,CAAC,KAAK,QAAQ,EAAE;gBAClC,OAAO,CAAC,IAAI,CAAC,CAAA,iCAAA,EAAoC,IAAI,CAAA,EAAA,EAAK,KAAK,CAAA,CAAE,CAAC;AAClE,gBAAA,OAAO,EAAE;YACX;YAEA,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,QAAQ;AAE5B,YAAA,MAAM,WAAW,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,KAAI;gBACrD,MAAM,OAAO,GAAG,CAAC,CAAC,GAAG,CAAC,IAAI,EAAE;AAC5B,gBAAA,OAAO,CAAA,QAAA,EAAW,IAAI,CAAA,CAAA,EAAI,OAAO,UAAU,CAAC,CAAA,EAAA,EAAK,CAAC,CAAA,EAAA,EAAK,CAAC,CAAA,EAAA,EAAK,OAAO,GAAG,GAAG,IAAI;AAChF,YAAA,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;YAEb,OAAO;AACK,gBAAA,EAAA,IAAI,CAAA,MAAA,EAAS,CAAC,CAAA,EAAA,EAAK,CAAC,KAAK,CAAC,CAAA;UAClC,WAAW;OACd;QACH;QAAE,OAAO,KAAK,EAAE;YACd,OAAO,CAAC,IAAI,CAAC,CAAA,uDAAA,EAA0D,IAAI,CAAA,EAAA,EAAK,KAAK,CAAA,CAAE,CAAC;AACxF,YAAA,OAAO,EAAE;QACX;AACF,IAAA,CAAC;;IAGD,MAAM,WAAW,GAAG,uBAAuB,CAAC,QAAQ,CAAC,YAAY,EAAE,SAAS,CAAC;IAC7E,MAAM,aAAa,GAAG,uBAAuB,CAAC,QAAQ,CAAC,cAAc,EAAE,WAAW,CAAC;IACnF,MAAM,UAAU,GAAG,uBAAuB,CAAC,QAAQ,CAAC,WAAW,EAAE,QAAQ,CAAC;IAC1E,MAAM,QAAQ,GAAG,uBAAuB,CAAC,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC;IACpE,MAAM,SAAS,GAAG,uBAAuB,CAAC,QAAQ,CAAC,UAAU,EAAE,OAAO,CAAC;;AAGvE,IAAA,MAAM,gBAAgB,GAAG,QAAQ,CAAC;AAC9B,UAAE,CAAA,CAAA,EAAI,QAAQ,CAAC,WAAW,CAAA,aAAA;UACxB,2BAA2B;AAEjC,IAAA,MAAM,aAAa,GAAG,QAAQ,CAAC;AAC3B,UAAE,CAAA,CAAA,EAAI,QAAQ,CAAC,QAAQ,CAAA,aAAA;UACrB,2BAA2B;IAEjC,OAAO;MACH,aAAa;;;wBAGK,gBAAgB,CAAA;qBACnB,aAAa,CAAA;;;4BAGN,QAAQ,CAAC,eAAe,IAAI,SAAS,CAAA;QACzD,WAAW;QACX,aAAa;QACb,UAAU;QACV,QAAQ;QACR,SAAS;;GAEd;AACH;;AC7DA,SAAS,gBAAgB,CAAC,MAAoB,EAAA;IAC5C,MAAM,EACJ,WAAW,GAAG,OAAO,EACrB,WAAW,GAAG,SAAS,EACvB,UAAU,GAAG,SAAS,EACtB,aAAa,GAAG,SAAS,EACzB,YAAY,GAAG,MAAM,EACrB,SAAS;AACT,IAAA,iBAAiB,GAAG,EAAE,GACvB,GAAG,MAAM;AAEV,IAAA,MAAM,OAAO,GAAa;QACxB,aAAa;QACb,cAAc;QACd,gBAAgB;QAChB,aAAa;QACb,oBAAoB;QACpB,sBAAsB;QACtB,6BAA6B;KAC9B;;IAGD,QAAQ,WAAW;AACjB,QAAA,KAAK,OAAO;AACV,YAAA,OAAO,CAAC,IAAI,CAAC,MAAM,WAAW,CAAA,CAAE,CAAC;;YAEjC,IAAI,SAAS,EAAE;AACb,gBAAA,OAAO,CAAC,IAAI,CAAC,QAAQ,SAAS,CAAA,CAAE,CAAC;YACnC;iBAAO;AACL,gBAAA,OAAO,CAAC,IAAI,CAAC,WAAW,KAAK,OAAO,GAAG,WAAW,GAAG,YAAY,CAAC;YACpE;AACA,YAAA,OAAO,CAAC,IAAI,CAAC,YAAY,WAAW,CAAA,GAAA,CAAK,CAAC;YAC1C;AACF,QAAA,KAAK,SAAS;AACZ,YAAA,OAAO,CAAC,IAAI,CAAC,CAAA,MAAA,CAAQ,CAAC;AACtB,YAAA,OAAO,CAAC,IAAI,CAAC,UAAU,WAAW,CAAA,CAAE,CAAC;;YAErC,IAAI,SAAS,EAAE;AACb,gBAAA,OAAO,CAAC,IAAI,CAAC,QAAQ,SAAS,CAAA,CAAE,CAAC;;AAEjC,gBAAA,OAAO,CAAC,IAAI,CAAC,cAAc,SAAS,CAAA,CAAE,CAAC;YACzC;iBAAO;AACL,gBAAA,OAAO,CAAC,IAAI,CAAC,QAAQ,WAAW,CAAA,CAAE,CAAC;AACnC,gBAAA,OAAO,CAAC,IAAI,CAAC,CAAA,WAAA,EAAc,WAAW,KAAK,OAAO,GAAG,MAAM,GAAG,OAAO,CAAA,CAAE,CAAC;YAC1E;AACA,YAAA,OAAO,CAAC,IAAI,CAAC,YAAY,WAAW,CAAA,CAAE,CAAC;YACvC;AACF,QAAA,KAAK,OAAO;;YAEV,IAAI,SAAS,EAAE;AACb,gBAAA,OAAO,CAAC,IAAI,CAAC,QAAQ,SAAS,CAAA,CAAE,CAAC;YACnC;iBAAO;AACL,gBAAA,OAAO,CAAC,IAAI,CAAC,QAAQ,WAAW,CAAA,CAAE,CAAC;YACrC;AACA,YAAA,OAAO,CAAC,IAAI,CAAC,YAAY,WAAW,CAAA,GAAA,CAAK,CAAC;YAC1C;AACF,QAAA,KAAK,MAAM;;YAET,IAAI,SAAS,EAAE;AACb,gBAAA,OAAO,CAAC,IAAI,CAAC,QAAQ,SAAS,CAAA,CAAE,CAAC;YACnC;iBAAO;AACL,gBAAA,OAAO,CAAC,IAAI,CAAC,QAAQ,WAAW,CAAA,CAAE,CAAC;YACrC;AACA,YAAA,OAAO,CAAC,IAAI,CAAC,iBAAiB,CAAC;YAC/B;;;IAIJ,QAAQ,UAAU;AAChB,QAAA,KAAK,OAAO;AACV,YAAA,OAAO,CAAC,IAAI,CAAC,uBAAuB,CAAC;YACrC;AACF,QAAA,KAAK,SAAS;AACZ,YAAA,OAAO,CAAC,IAAI,CAAC,mBAAmB,CAAC;YACjC;AACF,QAAA,KAAK,QAAQ;AACX,YAAA,OAAO,CAAC,IAAI,CAAC,uBAAuB,CAAC;YACrC;AACF,QAAA,KAAK,OAAO;AACV,YAAA,OAAO,CAAC,IAAI,CAAC,mBAAmB,CAAC;YACjC;AACF,QAAA,KAAK,IAAI;AACP,YAAA,OAAO,CAAC,IAAI,CAAC,mBAAmB,CAAC;YACjC;;;IAIJ,IAAI,MAAM,CAAC,OAAO,IAAI,YAAY,KAAK,MAAM,EAAE;AAC7C,QAAA,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC;QACnB,QAAQ,UAAU;AAChB,YAAA,KAAK,OAAO;AACV,gBAAA,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC;gBACvB;AACF,YAAA,KAAK,SAAS;AACZ,gBAAA,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC;gBACvB;AACF,YAAA,KAAK,QAAQ;AACX,gBAAA,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC;gBACzB;AACF,YAAA,KAAK,OAAO;AACV,gBAAA,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC;gBACzB;AACF,YAAA,KAAK,IAAI;AACP,gBAAA,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC;gBACzB;;IAEN;;IAGA,QAAQ,aAAa;AACnB,QAAA,KAAK,MAAM;AACT,YAAA,OAAO,CAAC,IAAI,CAAC,cAAc,CAAC;YAC5B;AACF,QAAA,KAAK,IAAI;AACP,YAAA,OAAO,CAAC,IAAI,CAAC,YAAY,CAAC;YAC1B;AACF,QAAA,KAAK,SAAS;AACZ,YAAA,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC;YACvB;AACF,QAAA,KAAK,IAAI;AACP,YAAA,OAAO,CAAC,IAAI,CAAC,YAAY,CAAC;YAC1B;AACF,QAAA,KAAK,MAAM;AACT,YAAA,OAAO,CAAC,IAAI,CAAC,cAAc,CAAC;YAC5B;;;IAIJ,IAAI,iBAAiB,EAAE;AACrB,QAAA,IAAI,iBAAiB,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;AACxC,YAAA,OAAO,CAAC,IAAI,CAAC,2BAA2B,CAAC;QAC3C;AACA,QAAA,IAAI,iBAAiB,CAAC,QAAQ,CAAC,YAAY,CAAC,EAAE;AAC5C,YAAA,OAAO,CAAC,IAAI,CAAC,6BAA6B,CAAC;QAC7C;AACA,QAAA,IAAI,iBAAiB,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE;AACvC,YAAA,OAAO,CAAC,IAAI,CAAC,2BAA2B,CAAC;QAC3C;IACF;;AAGA,IAAA,OAAO,CAAC,IAAI,CAAC,sBAAsB,WAAW,CAAA,GAAA,CAAK,CAAC;AAEpD,IAAA,OAAO,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;AAC1B;;AC/KA,SAAS,YAAY,CAAC,MAAW,EAAA;;IAE7B,MAAM,SAAS,GAAa,EAAE;;IAG9B,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,KAAK,KAAI;AACzB,QAAA,IAAI,MAAM,CAAC,KAAK,CAAC,EAAE,SAAS,EAAE;YAC1B,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC;QAC3C;AACJ,IAAA,CAAC,CAAC;;AAGF,IAAA,CAAC,IAAI,EAAE,GAAG,EAAE,WAAW,CAAC,CAAC,OAAO,CAAC,CAAC,KAAK,KAAI;AACvC,QAAA,IAAI,MAAM,CAAC,KAAK,CAAC,EAAE;YACf,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACjC;AACJ,IAAA,CAAC,CAAC;;IAGF,IAAI,MAAM,CAAC,GAAG,IAAI,MAAM,CAAC,GAAG,CAAC,GAAG,EAAE;AAC9B,QAAA,SAAS,CAAC,IAAI,CAAC,uBAAuB,CAAC;IAC3C;AACA,IAAA,IAAI,MAAM,CAAC,SAAS,EAAE;AACpB,QAAA,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC;IAClC;AACF,IAAA,IAAI,MAAM,CAAC,YAAY,EAAE;AACvB,QAAA,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC;IACrC;AAEE,IAAA,OAAO,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC;AAC9B;;AC5BA,SAAS,eAAe,CAAC,MAAW,EAAA;IAClC,MAAM,MAAM,GAAwB,EAAE;;AAGtC,IAAA,IAAI,MAAM,CAAC,GAAG,EAAE;AACd,QAAA,MAAM,CAAC,eAAe,GAAG,MAAM,CAAC,GAAG;IACrC;;IAGA,IAAI,MAAM,CAAC,GAAG,IAAI,MAAM,CAAC,GAAG,CAAC,GAAG,EAAE;QAChC,MAAM,CAAC,eAAe,GAAG,CAAA,KAAA,EAAQ,MAAM,CAAC,GAAG,CAAC,GAAG,CAAA,EAAA,CAAI;;AAGnD,QAAA,IAAI,OAAO,MAAM,CAAC,GAAG,CAAC,MAAM,KAAK,QAAQ,IAAI,OAAO,MAAM,CAAC,GAAG,CAAC,MAAM,KAAK,QAAQ,EAAE;AAClF,YAAA,MAAM,CAAC,kBAAkB,GAAG,CAAA,EAAG,MAAM,CAAC,GAAG,CAAC,MAAM,CAAA,EAAA,EAAK,MAAM,CAAC,GAAG,CAAC,MAAM,GAAG;QAC3E;IACF;AAEA,IAAA,OAAO,MAAM;AACf;;;;;;;;;;;;;;"}

package/dist/index.d.ts

@@ -1,3 +1,11 @@
 export * as Fields from './fields';
 export * as Config from './config';
 export * as Tailwind from './tailwind';
+export { default as generateCssVars } from './generateCssVars';
+export { default as generatePreviewPath } from './generatePreviewPath';
+export { default as getButtonClasses } from './getButtonClasses';
+export { default as getClassName } from './getClassName';
+export { default as getInlineStyles } from './getInlineStyles';
+export { default as googleFonts } from './googleFonts';
+export { default as hexToRgb } from './hexToRgb';
+export { default as iconsList } from './iconsList';

package/dist/index.esm.js

@@ -1,4 +1,277 @@
-export { i as Fields } from './index-zJMnbEc6.js';
-export { i as Config } from './index-BPmTpfXE.js';
-export { i as Tailwind } from './fieldRoles-C_8MuKLB.js';
+export { i as Fields } from './index-DwDOFamE.js';
+export { i as Config, g as generatePreviewPath, G as googleFonts } from './index-DUzSwmzd.js';
+export { i as Tailwind, a as iconsList } from './fieldRoles-CJKOMPeo.js';
+
+const hexToRgb = (hex) => {
+    // Rimuove il simbolo `#` se presente
+    const cleanedHex = hex.replace(/^#/, '');
+    // Controlla che il colore sia valido (3 o 6 caratteri)
+    if (!/^([A-Fa-f0-9]{3}|[A-Fa-f0-9]{6})$/.test(cleanedHex)) {
+        throw new Error(`Colore HEX non valido: ${hex}`);
+    }
+    // In caso di formato corto (es. "FFF"), lo converte in formato lungo (es. "FFFFFF")
+    const expandedHex = cleanedHex.length === 3
+        ? cleanedHex
+            .split('')
+            .map(char => char + char)
+            .join('')
+        : cleanedHex;
+    // Converte il valore HEX in decimali per R, G e B
+    const r = parseInt(expandedHex.slice(0, 2), 16);
+    const g = parseInt(expandedHex.slice(2, 4), 16);
+    const b = parseInt(expandedHex.slice(4, 6), 16);
+    return { r, g, b };
+};
+
+function generateCssVars(settings) {
+    // Gestione robusta dei font
+    const fontWeights = [300, 400, 500, 600, 700, 800];
+    const fontsToImport = [settings.headingFont, settings.textFont]
+        .filter(Boolean)
+        .map(f => {
+        if (!f)
+            return '';
+        // Aggiungiamo il parametro wght per specificare i pesi da caricare
+        return `@import url('https://fonts.googleapis.com/css2?family=${f.replace(/ /g, "+")}:wght@${fontWeights.join(';')}&display=swap');`;
+    })
+        .join("\n");
+    const generateOpacityVariants = (color, name) => {
+        if (!color) {
+            return '';
+        }
+        try {
+            const rgbValue = hexToRgb(color);
+            if (!rgbValue || typeof rgbValue.r !== 'number' ||
+                typeof rgbValue.g !== 'number' ||
+                typeof rgbValue.b !== 'number') {
+                console.warn(`Impossibile convertire il colore ${name}: ${color}`);
+                return '';
+            }
+            const { r, g, b } = rgbValue;
+            const opacityVars = Array.from({ length: 9 }, (_, i) => {
+                const opacity = (i + 1) * 10;
+                return `--color-${name}-${opacity}: rgba(${r}, ${g}, ${b}, ${opacity / 100});`;
+            }).join("\n");
+            return `
+        --color-${name}: rgb(${r}, ${g}, ${b}); /* Default (opacità 1) */
+        ${opacityVars}
+      `;
+        }
+        catch (error) {
+            console.warn(`Errore nella generazione delle varianti di opacità per ${name}: ${error}`);
+            return '';
+        }
+    };
+    // Genera variabili solo per i colori forniti
+    const primaryVars = generateOpacityVariants(settings.primaryColor, "primary");
+    const secondaryVars = generateOpacityVariants(settings.secondaryColor, "secondary");
+    const accentVars = generateOpacityVariants(settings.accentColor, "accent");
+    const darkVars = generateOpacityVariants(settings.darkColor, "dark");
+    const lightVars = generateOpacityVariants(settings.lightColor, "light");
+    // Genera i valori dei font in modo sicuro
+    const headingFontValue = settings.headingFont
+        ? `'${settings.headingFont}', sans-serif`
+        : 'system-layout, sans-serif';
+    const textFontValue = settings.textFont
+        ? `'${settings.textFont}', sans-serif`
+        : 'system-layout, sans-serif';
+    return `
+    ${fontsToImport}
+
+    :root {
+      --font-heading: ${headingFontValue};
+      --font-text: ${textFontValue};
+      --color-white: #ffffff;
+      --color-black: #000000;
+      --color-foreground: ${settings.foregroundColor || '#FFFFFF'};
+      ${primaryVars}
+      ${secondaryVars}
+      ${accentVars}
+      ${darkVars}
+      ${lightVars}
+    }
+  `;
+}
+
+function getButtonClasses(config) {
+    const { buttonStyle = 'solid', buttonColor = 'primary', buttonSize = 'default', buttonRounded = 'default', iconPosition = 'left', textColor, // Aggiungiamo il colore del testo
+    additionalEffects = [], } = config;
+    const classes = [
+        'inline-flex',
+        'items-center',
+        'justify-center',
+        'font-medium',
+        'focus:outline-none',
+        'focus-visible:ring-2',
+        'focus-visible:ring-offset-2',
+    ];
+    // Stile base
+    switch (buttonStyle) {
+        case 'solid':
+            classes.push(`bg-${buttonColor}`);
+            // Usa textColor se specificato, altrimenti usa il colore predefinito basato sul buttonColor
+            if (textColor) {
+                classes.push(`text-${textColor}`);
+            }
+            else {
+                classes.push(buttonColor === 'light' ? 'text-dark' : 'text-white');
+            }
+            classes.push(`hover:bg-${buttonColor}/90`);
+            break;
+        case 'outline':
+            classes.push(`border`);
+            classes.push(`border-${buttonColor}`);
+            // Usa textColor se specificato, altrimenti usa il colore del bottone
+            if (textColor) {
+                classes.push(`text-${textColor}`);
+                // Mantieni lo stesso colore di testo per l'hover, a meno che non sia specificato diversamente
+                classes.push(`hover:text-${textColor}`);
+            }
+            else {
+                classes.push(`text-${buttonColor}`);
+                classes.push(`hover:text-${buttonColor === 'light' ? 'dark' : 'white'}`);
+            }
+            classes.push(`hover:bg-${buttonColor}`);
+            break;
+        case 'ghost':
+            // Usa textColor se specificato, altrimenti usa il colore del bottone
+            if (textColor) {
+                classes.push(`text-${textColor}`);
+            }
+            else {
+                classes.push(`text-${buttonColor}`);
+            }
+            classes.push(`hover:bg-${buttonColor}/10`);
+            break;
+        case 'link':
+            // Usa textColor se specificato, altrimenti usa il colore del bottone
+            if (textColor) {
+                classes.push(`text-${textColor}`);
+            }
+            else {
+                classes.push(`text-${buttonColor}`);
+            }
+            classes.push('hover:underline');
+            break;
+    }
+    // Dimensione
+    switch (buttonSize) {
+        case 'small':
+            classes.push('text-xs px-2.5 py-1.5');
+            break;
+        case 'default':
+            classes.push('text-sm px-4 py-2');
+            break;
+        case 'medium':
+            classes.push('text-base px-5 py-2.5');
+            break;
+        case 'large':
+            classes.push('text-lg px-6 py-3');
+            break;
+        case 'xl':
+            classes.push('text-xl px-8 py-4');
+            break;
+    }
+    // Se è solo icona, aggiusta il padding per renderlo quadrato/rotondo
+    if (config.useIcon && iconPosition === 'only') {
+        classes.push('p-0');
+        switch (buttonSize) {
+            case 'small':
+                classes.push('w-7 h-7');
+                break;
+            case 'default':
+                classes.push('w-9 h-9');
+                break;
+            case 'medium':
+                classes.push('w-10 h-10');
+                break;
+            case 'large':
+                classes.push('w-12 h-12');
+                break;
+            case 'xl':
+                classes.push('w-14 h-14');
+                break;
+        }
+    }
+    // Arrotondamento
+    switch (buttonRounded) {
+        case 'none':
+            classes.push('rounded-none');
+            break;
+        case 'sm':
+            classes.push('rounded-sm');
+            break;
+        case 'default':
+            classes.push('rounded');
+            break;
+        case 'lg':
+            classes.push('rounded-lg');
+            break;
+        case 'full':
+            classes.push('rounded-full');
+            break;
+    }
+    // Effetti aggiuntivi
+    if (additionalEffects) {
+        if (additionalEffects.includes('shadow')) {
+            classes.push('shadow-md hover:shadow-lg');
+        }
+        if (additionalEffects.includes('transition')) {
+            classes.push('transition-all duration-200');
+        }
+        if (additionalEffects.includes('scale')) {
+            classes.push('transform hover:scale-105');
+        }
+    }
+    // Aggiungi la classe focus-ring per il colore appropriato
+    classes.push(`focus-visible:ring-${buttonColor}/50`);
+    return classes.join(' ');
+}
+
+function getClassName(config) {
+    // Mantieni tutte le altre classi Tailwind, ma ometti quelle di colore di sfondo
+    const classList = [];
+    // Gestione campi compositi
+    ['p', 'm'].forEach((field) => {
+        if (config[field]?.className) {
+            classList.push(config[field].className);
+        }
+    });
+    // Gestione campi diretti
+    ['fs', 'h', 'container'].forEach((field) => {
+        if (config[field]) {
+            classList.push(config[field]);
+        }
+    });
+    // Altre classi che non sono colori dinamici
+    if (config.bgi && config.bgi.url) {
+        classList.push('bg-no-repeat bg-cover');
+    }
+    if (config.boxShadow) {
+        classList.push(config.boxShadow);
+    }
+    if (config.borderRadius) {
+        classList.push(config.borderRadius);
+    }
+    return classList.join(' ');
+}
+
+function getInlineStyles(config) {
+    const styles = {};
+    // Gestisci il background color con stile inline
+    if (config.bgc) {
+        styles.backgroundColor = config.bgc;
+    }
+    // Gestione background image
+    if (config.bgi && config.bgi.url) {
+        styles.backgroundImage = `url("${config.bgi.url}")`;
+        // Gestione focal point
+        if (typeof config.bgi.focalX === 'number' && typeof config.bgi.focalY === 'number') {
+            styles.backgroundPosition = `${config.bgi.focalX}% ${config.bgi.focalY}%`;
+        }
+    }
+    return styles;
+}
+
+export { generateCssVars, getButtonClasses, getClassName, getInlineStyles, hexToRgb };
 //# sourceMappingURL=index.esm.js.map