@stachelock/ui 0.1.9 → 0.2.1

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/utils/component-registry.ts","../src/components/UiRadialProgressBar.vue","../src/components/inputs/InputsShowcase.vue","../src/plugin.ts"],"sourcesContent":["import { defineAsyncComponent, type Component } from 'vue'\nimport UiTextInput from '../components/UiTextInput.vue'\nimport type { ComponentMap } from '../types/form'\n\n/**\n * Default component map for dynamic forms\n */\nexport const defaultComponentMap: ComponentMap = {\n  text: {\n    component: 'TextInput',\n    loader: () => Promise.resolve(UiTextInput)\n  },\n  email: {\n    component: 'TextInput',\n    loader: () => Promise.resolve(UiTextInput)\n  },\n  password: {\n    component: 'TextInput',\n    loader: () => Promise.resolve(UiTextInput)\n  },\n  number: {\n    component: 'TextInput',\n    loader: () => Promise.resolve(UiTextInput)\n  },\n  tel: {\n    component: 'TextInput',\n    loader: () => Promise.resolve(UiTextInput)\n  },\n  url: {\n    component: 'TextInput',\n    loader: () => Promise.resolve(UiTextInput)\n  },\n  textarea: {\n    component: 'TextAreaInput',\n    loader: () => import('../components/inputs/TextAreaInput.vue')\n  },\n  select: {\n    component: 'SelectInput',\n    loader: () => import('../components/inputs/SelectInput.vue')\n  },\n  combobox: {\n    component: 'ComboboxInput',\n    loader: () => import('../components/inputs/ComboboxInput.vue')\n  },\n  checkbox: {\n    component: 'CheckboxInput',\n    loader: () => import('../components/inputs/CheckboxInput.vue')\n  },\n  switch: {\n    component: 'SwitchInput',\n    loader: () => import('../components/inputs/SwitchInput.vue')\n  }\n}\n\n/**\n * Component registry class for managing dynamic form components\n */\nexport class ComponentRegistry {\n  private componentMap: ComponentMap = { ...defaultComponentMap }\n  private loadedComponents: Map<string, Component> = new Map()\n\n  /**\n   * Register a new component type\n   */\n  register(type: string, component: string, loader: () => Promise<any>): void {\n    this.componentMap[type] = { component, loader }\n    // Clear cached component if it exists\n    this.loadedComponents.delete(type)\n  }\n\n  /**\n   * Get a component for a field type\n   */\n  getComponent(type: string): Component | null {\n    const mapItem = this.componentMap[type]\n    if (!mapItem) {\n      console.warn(`Component type \"${type}\" is not registered`)\n      return null\n    }\n\n    // Return cached component if available\n    if (this.loadedComponents.has(type)) {\n      return this.loadedComponents.get(type)!\n    }\n\n    // Create async component\n    const asyncComponent = defineAsyncComponent({\n      loader: mapItem.loader,\n      delay: 0\n    })\n\n    this.loadedComponents.set(type, asyncComponent)\n    return asyncComponent\n  }\n\n  /**\n   * Check if a component type is registered\n   */\n  hasComponent(type: string): boolean {\n    return type in this.componentMap\n  }\n\n  /**\n   * Get all registered component types\n   */\n  getRegisteredTypes(): string[] {\n    return Object.keys(this.componentMap)\n  }\n\n  /**\n   * Unregister a component type\n   */\n  unregister(type: string): void {\n    delete this.componentMap[type]\n    this.loadedComponents.delete(type)\n  }\n\n  /**\n   * Clear all cached components\n   */\n  clearCache(): void {\n    this.loadedComponents.clear()\n  }\n}\n\n// Global component registry instance\nexport const componentRegistry = new ComponentRegistry()\n\n/**\n * Register a component type globally\n */\nexport function registerComponent(type: string, component: string, loader: () => Promise<any>): void {\n  componentRegistry.register(type, component, loader)\n}\n\n/**\n * Get a component for a field type\n */\nexport function getComponent(type: string): Component | null {\n  return componentRegistry.getComponent(type)\n}\n","<template>\n  <div class=\"sl-relative\" :class=\"sizeClass\">\n    <svg viewBox=\"0 0 36 36\" class=\"sl-transform -sl-rotate-90 sl-w-full sl-h-full\">\n      <path class=\"sl-fill-none sl-stroke-gray-300\" stroke-width=\"3.8\"\n        d=\"M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831\" />\n      <path\n        class=\"sl-fill-none sl-stroke-stachelock-600 sl-stroke-linecap-round sl-transition-[stroke-dasharray] sl-duration-500 sl-ease-out\"\n        :stroke-dasharray=\"progress + ', 100'\" stroke-width=\"3.8\"\n        d=\"M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831\" />\n    </svg>\n    <div v-if=\"label && label.length > 0\"\n      class=\"sl-absolute sl-top-1/2 sl-left-1/2 sl-transform -sl-translate-x-1/2 -sl-translate-y-1/2 sl-text-center\">{{ label }}</div>\n    <div v-if=\"showProgressLabel\"\n      class=\"sl-absolute sl-top-1/2 sl-left-1/2 sl-transform -sl-translate-x-1/2 -sl-translate-y-1/2 sl-text-center sl-text-xs\">\n      {{ progress }}%\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue';\n\ntype RadialProgressBarSize = 'xs' | 'sm' | 'md' | 'lg';\n\nconst props = defineProps({\n  progress: {\n    type: Number,\n    default: 0\n  },\n  label: {\n    type: String,\n    default: ''\n  },\n  showProgressLabel: {\n    type: Boolean,\n    default: false\n  },\n  size: {\n    type: String as () => RadialProgressBarSize,\n    default: 'md'\n  }\n});\n\nconst sizeClass = computed(() => {\n  switch (props.size) {\n    case 'xs':\n      return 'sl-h-4 sl-w-4'\n    case 'sm':\n      return 'sl-h-8 sl-w-8'\n    case 'md':\n      return 'sl-h-12 sl-w-12'\n    case 'lg':\n      return 'sl-h-16 sl-w-16'\n    default:\n      return 'sl-h-8 sl-w-8'\n  }\n});\n\nconst progress = ref(props.progress);\n\nwatch(() => props.progress, (newValue) => {\n  progress.value = newValue;\n});\n</script>\n\n<style scoped>\n</style>\n","<template>\n  <section class=\"sl-bg-white sl-rounded-lg sl-shadow sl-p-6\">\n    <h2 class=\"sl-text-xl sl-font-semibold sl-mb-4\">All Inputs Showcase</h2>\n\n    <div class=\"sl-space-y-8\">\n      <!-- Text Input -->\n      <div>\n        <h3 class=\"sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2\">Text Input</h3>\n        <TextInput\n          name=\"demoText\"\n          label=\"Text Input\"\n          placeholder=\"Type something...\"\n          v-model:value=\"state.text\"\n        />\n      </div>\n\n      <!-- Text Area Input -->\n      <div>\n        <h3 class=\"sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2\">Text Area</h3>\n        <TextAreaInput\n          name=\"demoTextArea\"\n          label=\"Text Area\"\n          placeholder=\"Write a longer message...\"\n          :rows=\"4\"\n          :maxlength=\"200\"\n          v-model=\"state.textArea\"\n        />\n      </div>\n\n      <!-- Switch Input -->\n      <div>\n        <h3 class=\"sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2\">Switch</h3>\n        <SwitchInput\n          name=\"demoSwitch\"\n          label=\"Enable feature\"\n          v-model=\"state.switchOn\"\n          textTrue=\"ON\"\n          textFalse=\"OFF\"\n        />\n      </div>\n\n      <!-- Checkbox Input -->\n      <div>\n        <h3 class=\"sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2\">Checkbox</h3>\n        <CheckboxInput\n          name=\"demoCheckbox\"\n          label=\"I agree to the terms\"\n          v-model=\"state.checkbox\"\n        />\n      </div>\n\n      <!-- Select Input -->\n      <div class=\"sl-grid sl-grid-cols-1 sl-md:grid-cols-2 sl-gap-6\">\n        <div>\n          <h3 class=\"sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2\">Select (Single)</h3>\n          <SelectInput\n            name=\"demoSelect\"\n            label=\"Favorite Fruit\"\n            placeholder=\"Select a fruit\"\n            :items=\"fruits\"\n            v-model=\"state.selectedFruit\"\n          />\n        </div>\n        <div>\n          <h3 class=\"sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2\">Select (Multiple)</h3>\n          <SelectInput\n            name=\"demoSelectMulti\"\n            label=\"Favorite Languages\"\n            placeholder=\"Select languages\"\n            :items=\"languages\"\n            multiple\n            showAll\n            v-model=\"state.selectedLanguages\"\n          />\n        </div>\n      </div>\n\n      <!-- Combobox Input -->\n      <div>\n        <h3 class=\"sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2\">Combobox</h3>\n        <ComboboxInput\n          name=\"demoCombobox\"\n          label=\"Search a City\"\n          placeholder=\"Start typing...\"\n          :items=\"cities\"\n          v-model=\"state.selectedCity\"\n        />\n      </div>\n\n      <!-- Current State -->\n      <div class=\"sl-bg-gray-50 sl-rounded-md sl-p-4 sl-text-sm sl-text-gray-700\">\n        <div class=\"sl-font-semibold sl-mb-1\">State</div>\n        <pre class=\"sl-whitespace-pre-wrap\">{{ state }}</pre>\n      </div>\n    </div>\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport { reactive } from 'vue'\nimport TextInput from '../UiTextInput.vue'\nimport TextAreaInput from './TextAreaInput.vue'\nimport SwitchInput from './SwitchInput.vue'\nimport CheckboxInput from './CheckboxInput.vue'\nimport SelectInput from './SelectInput.vue'\nimport ComboboxInput from './ComboboxInput.vue'\n\nconst state = reactive({\n  text: '',\n  textArea: '',\n  switchOn: false,\n  checkbox: false,\n  selectedFruit: null as null | { id: number; name: string },\n  selectedLanguages: [] as Array<{ id: number; name: string }>,\n  selectedCity: null as null | { id: number; name: string },\n})\n\nconst fruits = [\n  { id: 1, name: 'Apple' },\n  { id: 2, name: 'Banana' },\n  { id: 3, name: 'Cherry' },\n  { id: 4, name: 'Durian', disabled: true },\n]\n\nconst languages = [\n  { id: 1, name: 'TypeScript' },\n  { id: 2, name: 'JavaScript' },\n  { id: 3, name: 'Python' },\n  { id: 4, name: 'Go' },\n  { id: 5, name: 'Rust' },\n]\n\nconst cities = [\n  { id: 1, name: 'New York' },\n  { id: 2, name: 'San Francisco' },\n  { id: 3, name: 'Seattle' },\n  { id: 4, name: 'Austin' },\n  { id: 5, name: 'Chicago' },\n  { id: 6, name: 'Denver' },\n  { id: 7, name: 'Miami' },\n  { id: 8, name: 'Boston' },\n]\n</script>\n\n\n","import type { App } from 'vue';\nimport * as components from './components';\nimport * as layouts from './components/layouts';\nimport * as inputs from './components/inputs';\nimport * as calendars from './components/calendars';\nimport * as forms from './components/forms';\n\n// Combine all components\nconst allComponents = {\n  ...components,\n  ...layouts,\n  ...inputs,\n  ...calendars,\n  ...forms,\n};\n\n// Plugin interface\nexport interface StachelockUIOptions {\n  /**\n   * Component name prefix (default: 'Sl')\n   */\n  prefix?: string;\n  /**\n   * Array of component names to install globally\n   */\n  components?: string[];\n  /**\n   * Whether to install all components globally\n   */\n  installAll?: boolean;\n}\n\n// Vue plugin\nexport const StachelockUI = {\n  install(app: App, options: StachelockUIOptions = {}) {\n    const { prefix = 'Sl', installAll = false, components: selectedComponents } = options;\n\n    // Register components\n    Object.entries(allComponents).forEach(([name, component]) => {\n      const shouldInstall = installAll || \n        (selectedComponents && selectedComponents.includes(name)) ||\n        (!selectedComponents && !installAll);\n\n      if (shouldInstall) {\n        // Register non-prefixed\n        app.component(name, component);\n        // Also register prefixed alias for back-compat\n        const prefixedName = name.startsWith(prefix) ? name : `${prefix}${name}`;\n        app.component(prefixedName, component);\n      }\n    });\n  }\n};\n\nexport default StachelockUI;\n"],"names":["defaultComponentMap","UiTextInput","ComponentRegistry","type","component","loader","mapItem","asyncComponent","defineAsyncComponent","componentRegistry","registerComponent","getComponent","props","__props","sizeClass","computed","progress","ref","watch","newValue","_createElementBlock","_normalizeClass","_openBlock","_hoisted_1","_createElementVNode","_hoisted_3","_toDisplayString","_hoisted_4","state","reactive","fruits","languages","cities","_cache","_hoisted_2","_createVNode","TextInput","$event","TextAreaInput","SwitchInput","CheckboxInput","SelectInput","ComboboxInput","_hoisted_5","allComponents","components","layouts","inputs","calendars","forms","StachelockUI","app","options","prefix","installAll","selectedComponents","name","prefixedName"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../src/utils/component-registry.ts","../src/config/design-tokens.ts","../src/config/css-variables.ts","../src/components/UiRadialProgressBar.vue","../src/components/inputs/InputsShowcase.vue","../src/plugin.ts"],"sourcesContent":["import { defineAsyncComponent, type Component } from 'vue'\nimport UiTextInput from '../components/UiTextInput.vue'\nimport type { ComponentMap } from '../types/form'\n\n/**\n * Default component map for dynamic forms\n */\nexport const defaultComponentMap: ComponentMap = {\n  text: {\n    component: 'TextInput',\n    loader: () => Promise.resolve(UiTextInput)\n  },\n  email: {\n    component: 'TextInput',\n    loader: () => Promise.resolve(UiTextInput)\n  },\n  password: {\n    component: 'TextInput',\n    loader: () => Promise.resolve(UiTextInput)\n  },\n  number: {\n    component: 'TextInput',\n    loader: () => Promise.resolve(UiTextInput)\n  },\n  tel: {\n    component: 'TextInput',\n    loader: () => Promise.resolve(UiTextInput)\n  },\n  url: {\n    component: 'TextInput',\n    loader: () => Promise.resolve(UiTextInput)\n  },\n  textarea: {\n    component: 'TextAreaInput',\n    loader: () => import('../components/inputs/TextAreaInput.vue')\n  },\n  select: {\n    component: 'SelectInput',\n    loader: () => import('../components/inputs/SelectInput.vue')\n  },\n  combobox: {\n    component: 'ComboboxInput',\n    loader: () => import('../components/inputs/ComboboxInput.vue')\n  },\n  checkbox: {\n    component: 'CheckboxInput',\n    loader: () => import('../components/inputs/CheckboxInput.vue')\n  },\n  switch: {\n    component: 'SwitchInput',\n    loader: () => import('../components/inputs/SwitchInput.vue')\n  }\n}\n\n/**\n * Component registry class for managing dynamic form components\n */\nexport class ComponentRegistry {\n  private componentMap: ComponentMap = { ...defaultComponentMap }\n  private loadedComponents: Map<string, Component> = new Map()\n\n  /**\n   * Register a new component type\n   */\n  register(type: string, component: string, loader: () => Promise<any>): void {\n    this.componentMap[type] = { component, loader }\n    // Clear cached component if it exists\n    this.loadedComponents.delete(type)\n  }\n\n  /**\n   * Get a component for a field type\n   */\n  getComponent(type: string): Component | null {\n    const mapItem = this.componentMap[type]\n    if (!mapItem) {\n      console.warn(`Component type \"${type}\" is not registered`)\n      return null\n    }\n\n    // Return cached component if available\n    if (this.loadedComponents.has(type)) {\n      return this.loadedComponents.get(type)!\n    }\n\n    // Create async component\n    const asyncComponent = defineAsyncComponent({\n      loader: mapItem.loader,\n      delay: 0\n    })\n\n    this.loadedComponents.set(type, asyncComponent)\n    return asyncComponent\n  }\n\n  /**\n   * Check if a component type is registered\n   */\n  hasComponent(type: string): boolean {\n    return type in this.componentMap\n  }\n\n  /**\n   * Get all registered component types\n   */\n  getRegisteredTypes(): string[] {\n    return Object.keys(this.componentMap)\n  }\n\n  /**\n   * Unregister a component type\n   */\n  unregister(type: string): void {\n    delete this.componentMap[type]\n    this.loadedComponents.delete(type)\n  }\n\n  /**\n   * Clear all cached components\n   */\n  clearCache(): void {\n    this.loadedComponents.clear()\n  }\n}\n\n// Global component registry instance\nexport const componentRegistry = new ComponentRegistry()\n\n/**\n * Register a component type globally\n */\nexport function registerComponent(type: string, component: string, loader: () => Promise<any>): void {\n  componentRegistry.register(type, component, loader)\n}\n\n/**\n * Get a component for a field type\n */\nexport function getComponent(type: string): Component | null {\n  return componentRegistry.getComponent(type)\n}\n","export interface StachelockUIDesignTokens {\n  colors?: {\n    primary?: {\n      50?: string;\n      100?: string;\n      200?: string;\n      300?: string;\n      400?: string;\n      500?: string;\n      600?: string;\n      700?: string;\n      800?: string;\n      900?: string;\n    };\n    stachelock?: {\n      50?: string;\n      100?: string;\n      200?: string;\n      300?: string;\n      400?: string;\n      500?: string;\n      600?: string;\n      700?: string;\n      800?: string;\n      900?: string;\n    };\n    [key: string]: any;\n  };\n  spacing?: {\n    [key: string]: string;\n  };\n  borderRadius?: {\n    [key: string]: string;\n  };\n  shadows?: {\n    [key: string]: string;\n  };\n  typography?: {\n    fontFamily?: {\n      [key: string]: string[];\n    };\n    fontSize?: {\n      [key: string]: string;\n    };\n  };\n  breakpoints?: {\n    [key: string]: string;\n  };\n}\n\nexport const defaultDesignTokens: StachelockUIDesignTokens = {\n  colors: {\n    primary: {\n      50: '#edeff9',\n      100: '#dbdff2',\n      200: '#b8bfe6',\n      300: '#949ed9',\n      400: '#717ecd',\n      500: '#4d5ec0',\n      600: '#3e4b9a',\n      700: '#2e3873',\n      800: '#1f264d',\n      900: '#0f1326',\n    },\n    stachelock: {\n      50: '#edeff9',\n      100: '#dbdff2',\n      200: '#b8bfe6',\n      300: '#949ed9',\n      400: '#717ecd',\n      500: '#4d5ec0',\n      600: '#3e4b9a',\n      700: '#2e3873',\n      800: '#1f264d',\n      900: '#0f1326',\n    },\n  },\n  spacing: {\n    '0': '0',\n    '1': '0.25rem',\n    '2': '0.5rem',\n    '3': '0.75rem',\n    '4': '1rem',\n    '5': '1.25rem',\n    '6': '1.5rem',\n    '8': '2rem',\n    '10': '2.5rem',\n    '12': '3rem',\n    '16': '4rem',\n    '20': '5rem',\n    '24': '6rem',\n    '32': '8rem',\n    '40': '10rem',\n    '48': '12rem',\n    '56': '14rem',\n    '64': '16rem',\n    '72': '18rem',\n    '80': '20rem',\n    '96': '24rem',\n  },\n  borderRadius: {\n    'none': '0',\n    'sm': '0.125rem',\n    'DEFAULT': '0.25rem',\n    'md': '0.375rem',\n    'lg': '0.5rem',\n    'xl': '0.75rem',\n    '2xl': '1rem',\n    '3xl': '1.5rem',\n    'full': '9999px',\n  },\n  shadows: {\n    'sm': '0 1px 2px 0 rgb(0 0 0 / 0.05)',\n    'DEFAULT': '0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)',\n    'md': '0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)',\n    'lg': '0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)',\n    'xl': '0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)',\n    '2xl': '0 25px 50px -12px rgb(0 0 0 / 0.25)',\n    'inner': 'inset 0 2px 4px 0 rgb(0 0 0 / 0.05)',\n    'none': 'none',\n  },\n  typography: {\n    fontFamily: {\n      sans: ['Inter', 'ui-sans-serif', 'system-ui', 'sans-serif'],\n      serif: ['ui-serif', 'Georgia', 'Cambria', 'serif'],\n      mono: ['ui-monospace', 'SFMono-Regular', 'Menlo', 'Monaco', 'Consolas', 'monospace'],\n    },\n    fontSize: {\n      'xs': '0.75rem',\n      'sm': '0.875rem',\n      'base': '1rem',\n      'lg': '1.125rem',\n      'xl': '1.25rem',\n      '2xl': '1.5rem',\n      '3xl': '1.875rem',\n      '4xl': '2.25rem',\n      '5xl': '3rem',\n      '6xl': '3.75rem',\n      '7xl': '4.5rem',\n      '8xl': '6rem',\n      '9xl': '8rem',\n    },\n  },\n  breakpoints: {\n    'sm': '640px',\n    'md': '768px',\n    'lg': '1024px',\n    'xl': '1280px',\n    '2xl': '1536px',\n  },\n};\n\nexport function mergeDesignTokens(\n  customTokens: StachelockUIDesignTokens,\n  defaults: StachelockUIDesignTokens = defaultDesignTokens\n): StachelockUIDesignTokens {\n  const merged = { ...defaults };\n  \n  // Deep merge function for nested objects\n  function deepMerge(target: any, source: any): any {\n    if (source && typeof source === 'object' && !Array.isArray(source)) {\n      for (const key in source) {\n        if (source.hasOwnProperty(key)) {\n          if (target[key] && typeof target[key] === 'object' && !Array.isArray(target[key])) {\n            target[key] = deepMerge(target[key], source[key]);\n          } else {\n            target[key] = source[key];\n          }\n        }\n      }\n    }\n    return target;\n  }\n  \n  return deepMerge(merged, customTokens);\n}\n","import type { StachelockUIDesignTokens } from './design-tokens';\n\nexport function generateCSSVariables(tokens: StachelockUIDesignTokens): string {\n  let css = ':root {\\n';\n  \n  // Generate color variables\n  if (tokens.colors) {\n    Object.entries(tokens.colors).forEach(([colorName, colorShades]) => {\n      if (typeof colorShades === 'object' && colorShades !== null) {\n        Object.entries(colorShades).forEach(([shade, value]) => {\n          const variableName = shade === 'DEFAULT' ? colorName : `${colorName}-${shade}`;\n          css += `  --sl-color-${variableName}: ${value};\\n`;\n        });\n      }\n    });\n  }\n  \n  // Generate spacing variables\n  if (tokens.spacing) {\n    Object.entries(tokens.spacing).forEach(([name, value]) => {\n      css += `  --sl-spacing-${name}: ${value};\\n`;\n    });\n  }\n  \n  // Generate border radius variables\n  if (tokens.borderRadius) {\n    Object.entries(tokens.borderRadius).forEach(([name, value]) => {\n      const variableName = name === 'DEFAULT' ? 'radius' : `radius-${name}`;\n      css += `  --sl-${variableName}: ${value};\\n`;\n    });\n  }\n  \n  // Generate shadow variables\n  if (tokens.shadows) {\n    Object.entries(tokens.shadows).forEach(([name, value]) => {\n      const variableName = name === 'DEFAULT' ? 'shadow' : `shadow-${name}`;\n      css += `  --sl-${variableName}: ${value};\\n`;\n    });\n  }\n  \n  // Generate typography variables\n  if (tokens.typography) {\n    if (tokens.typography.fontFamily) {\n      Object.entries(tokens.typography.fontFamily).forEach(([name, fonts]) => {\n        css += `  --sl-font-family-${name}: ${fonts.join(', ')};\\n`;\n      });\n    }\n    \n    if (tokens.typography.fontSize) {\n      Object.entries(tokens.typography.fontSize).forEach(([name, size]) => {\n        css += `  --sl-font-size-${name}: ${size};\\n`;\n      });\n    }\n  }\n  \n  // Generate breakpoint variables\n  if (tokens.breakpoints) {\n    Object.entries(tokens.breakpoints).forEach(([name, value]) => {\n      css += `  --sl-breakpoint-${name}: ${value};\\n`;\n    });\n  }\n  \n  // Add some computed variables\n  css += `  --sl-ring-color: var(--sl-color-primary-600, #3e4b9a);\\n`;\n  css += `  --sl-ring-offset-color: #ffffff;\\n`;\n  css += `  --sl-ring-width: 2px;\\n`;\n  css += `  --sl-outline-color: var(--sl-color-primary-600, #3e4b9a);\\n`;\n  css += `  --sl-outline-width: 2px;\\n`;\n  \n  css += '}\\n\\n';\n  \n  // Add dark mode variables\n  css += '@media (prefers-color-scheme: dark) {\\n';\n  css += '  :root {\\n';\n  css += '    --sl-ring-color: var(--sl-color-primary-600, #3e4b9a);\\n';\n  css += '  }\\n';\n  css += '}\\n';\n  \n  return css;\n}\n\nexport function generateTailwindConfig(tokens: StachelockUIDesignTokens): string {\n  let config = 'export default {\\n';\n  config += '  prefix: \"sl-\",\\n';\n  config += '  theme: {\\n';\n  config += '    extend: {\\n';\n  \n  // Colors\n  if (tokens.colors) {\n    config += '      colors: {\\n';\n    Object.entries(tokens.colors).forEach(([colorName, colorShades]) => {\n      if (typeof colorShades === 'object' && colorShades !== null) {\n        config += `        \"${colorName}\": {\\n`;\n        Object.entries(colorShades).forEach(([shade, value]) => {\n          const shadeName = shade === 'DEFAULT' ? 'DEFAULT' : shade;\n          config += `          \"${shadeName}\": \"${value}\",\\n`;\n        });\n        config += '        },\\n';\n      }\n    });\n    config += '      },\\n';\n  }\n  \n  // Spacing\n  if (tokens.spacing) {\n    config += '      spacing: {\\n';\n    Object.entries(tokens.spacing).forEach(([name, value]) => {\n      config += `        \"${name}\": \"${value}\",\\n`;\n    });\n    config += '      },\\n';\n  }\n  \n  // Border radius\n  if (tokens.borderRadius) {\n    config += '      borderRadius: {\\n';\n    Object.entries(tokens.borderRadius).forEach(([name, value]) => {\n      const configName = name === 'DEFAULT' ? 'DEFAULT' : name;\n      config += `        \"${configName}\": \"${value}\",\\n`;\n    });\n    config += '      },\\n';\n  }\n  \n  // Shadows\n  if (tokens.shadows) {\n    config += '      boxShadow: {\\n';\n    Object.entries(tokens.shadows).forEach(([name, value]) => {\n      const configName = name === 'DEFAULT' ? 'DEFAULT' : name;\n      config += `        \"${configName}\": \"${value}\",\\n`;\n    });\n    config += '      },\\n';\n  }\n  \n  // Typography\n  if (tokens.typography) {\n    if (tokens.typography.fontFamily) {\n      config += '      fontFamily: {\\n';\n      Object.entries(tokens.typography.fontFamily).forEach(([name, fonts]) => {\n        config += `        \"${name}\": [${fonts.map(f => `\"${f}\"`).join(', ')}],\\n`;\n      });\n      config += '      },\\n';\n    }\n    \n    if (tokens.typography.fontSize) {\n      config += '      fontSize: {\\n';\n      Object.entries(tokens.typography.fontSize).forEach(([name, size]) => {\n        config += `        \"${name}\": \"${size}\",\\n`;\n      });\n      config += '      },\\n';\n    }\n  }\n  \n  config += '    },\\n';\n  config += '  },\\n';\n  config += '};\\n';\n  \n  return config;\n}\n","<template>\n  <div class=\"sl-relative\" :class=\"sizeClass\">\n    <svg viewBox=\"0 0 36 36\" class=\"sl-transform -sl-rotate-90 sl-w-full sl-h-full\">\n      <path class=\"sl-fill-none sl-stroke-gray-300\" stroke-width=\"3.8\"\n        d=\"M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831\" />\n      <path\n        class=\"sl-fill-none sl-stroke-stachelock-600 sl-stroke-linecap-round sl-transition-[stroke-dasharray] sl-duration-500 sl-ease-out\"\n        :stroke-dasharray=\"progress + ', 100'\" stroke-width=\"3.8\"\n        d=\"M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831\" />\n    </svg>\n    <div v-if=\"label && label.length > 0\"\n      class=\"sl-absolute sl-top-1/2 sl-left-1/2 sl-transform -sl-translate-x-1/2 -sl-translate-y-1/2 sl-text-center\">{{ label }}</div>\n    <div v-if=\"showProgressLabel\"\n      class=\"sl-absolute sl-top-1/2 sl-left-1/2 sl-transform -sl-translate-x-1/2 -sl-translate-y-1/2 sl-text-center sl-text-xs\">\n      {{ progress }}%\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue';\n\ntype RadialProgressBarSize = 'xs' | 'sm' | 'md' | 'lg';\n\nconst props = defineProps({\n  progress: {\n    type: Number,\n    default: 0\n  },\n  label: {\n    type: String,\n    default: ''\n  },\n  showProgressLabel: {\n    type: Boolean,\n    default: false\n  },\n  size: {\n    type: String as () => RadialProgressBarSize,\n    default: 'md'\n  }\n});\n\nconst sizeClass = computed(() => {\n  switch (props.size) {\n    case 'xs':\n      return 'sl-h-4 sl-w-4'\n    case 'sm':\n      return 'sl-h-8 sl-w-8'\n    case 'md':\n      return 'sl-h-12 sl-w-12'\n    case 'lg':\n      return 'sl-h-16 sl-w-16'\n    default:\n      return 'sl-h-8 sl-w-8'\n  }\n});\n\nconst progress = ref(props.progress);\n\nwatch(() => props.progress, (newValue) => {\n  progress.value = newValue;\n});\n</script>\n\n<style scoped>\n</style>\n","<template>\n  <section class=\"sl-bg-white sl-rounded-lg sl-shadow sl-p-6\">\n    <h2 class=\"sl-text-xl sl-font-semibold sl-mb-4\">All Inputs Showcase</h2>\n\n    <div class=\"sl-space-y-8\">\n      <!-- Text Input -->\n      <div>\n        <h3 class=\"sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2\">Text Input</h3>\n        <TextInput\n          name=\"demoText\"\n          label=\"Text Input\"\n          placeholder=\"Type something...\"\n          v-model:value=\"state.text\"\n        />\n      </div>\n\n      <!-- Text Area Input -->\n      <div>\n        <h3 class=\"sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2\">Text Area</h3>\n        <TextAreaInput\n          name=\"demoTextArea\"\n          label=\"Text Area\"\n          placeholder=\"Write a longer message...\"\n          :rows=\"4\"\n          :maxlength=\"200\"\n          v-model=\"state.textArea\"\n        />\n      </div>\n\n      <!-- Switch Input -->\n      <div>\n        <h3 class=\"sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2\">Switch</h3>\n        <SwitchInput\n          name=\"demoSwitch\"\n          label=\"Enable feature\"\n          v-model=\"state.switchOn\"\n          textTrue=\"ON\"\n          textFalse=\"OFF\"\n        />\n      </div>\n\n      <!-- Checkbox Input -->\n      <div>\n        <h3 class=\"sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2\">Checkbox</h3>\n        <CheckboxInput\n          name=\"demoCheckbox\"\n          label=\"I agree to the terms\"\n          v-model=\"state.checkbox\"\n        />\n      </div>\n\n      <!-- Select Input -->\n      <div class=\"sl-grid sl-grid-cols-1 sl-md:grid-cols-2 sl-gap-6\">\n        <div>\n          <h3 class=\"sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2\">Select (Single)</h3>\n          <SelectInput\n            name=\"demoSelect\"\n            label=\"Favorite Fruit\"\n            placeholder=\"Select a fruit\"\n            :items=\"fruits\"\n            v-model=\"state.selectedFruit\"\n          />\n        </div>\n        <div>\n          <h3 class=\"sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2\">Select (Multiple)</h3>\n          <SelectInput\n            name=\"demoSelectMulti\"\n            label=\"Favorite Languages\"\n            placeholder=\"Select languages\"\n            :items=\"languages\"\n            multiple\n            showAll\n            v-model=\"state.selectedLanguages\"\n          />\n        </div>\n      </div>\n\n      <!-- Combobox Input -->\n      <div>\n        <h3 class=\"sl-text-sm sl-font-medium sl-text-gray-700 sl-mb-2\">Combobox</h3>\n        <ComboboxInput\n          name=\"demoCombobox\"\n          label=\"Search a City\"\n          placeholder=\"Start typing...\"\n          :items=\"cities\"\n          v-model=\"state.selectedCity\"\n        />\n      </div>\n\n      <!-- Current State -->\n      <div class=\"sl-bg-gray-50 sl-rounded-md sl-p-4 sl-text-sm sl-text-gray-700\">\n        <div class=\"sl-font-semibold sl-mb-1\">State</div>\n        <pre class=\"sl-whitespace-pre-wrap\">{{ state }}</pre>\n      </div>\n    </div>\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport { reactive } from 'vue'\nimport TextInput from '../UiTextInput.vue'\nimport TextAreaInput from './TextAreaInput.vue'\nimport SwitchInput from './SwitchInput.vue'\nimport CheckboxInput from './CheckboxInput.vue'\nimport SelectInput from './SelectInput.vue'\nimport ComboboxInput from './ComboboxInput.vue'\n\nconst state = reactive({\n  text: '',\n  textArea: '',\n  switchOn: false,\n  checkbox: false,\n  selectedFruit: null as null | { id: number; name: string },\n  selectedLanguages: [] as Array<{ id: number; name: string }>,\n  selectedCity: null as null | { id: number; name: string },\n})\n\nconst fruits = [\n  { id: 1, name: 'Apple' },\n  { id: 2, name: 'Banana' },\n  { id: 3, name: 'Cherry' },\n  { id: 4, name: 'Durian', disabled: true },\n]\n\nconst languages = [\n  { id: 1, name: 'TypeScript' },\n  { id: 2, name: 'JavaScript' },\n  { id: 3, name: 'Python' },\n  { id: 4, name: 'Go' },\n  { id: 5, name: 'Rust' },\n]\n\nconst cities = [\n  { id: 1, name: 'New York' },\n  { id: 2, name: 'San Francisco' },\n  { id: 3, name: 'Seattle' },\n  { id: 4, name: 'Austin' },\n  { id: 5, name: 'Chicago' },\n  { id: 6, name: 'Denver' },\n  { id: 7, name: 'Miami' },\n  { id: 8, name: 'Boston' },\n]\n</script>\n\n\n","import type { App } from 'vue';\nimport * as components from './components';\nimport * as layouts from './components/layouts';\nimport * as inputs from './components/inputs';\nimport * as calendars from './components/calendars';\nimport * as forms from './components/forms';\n\n// Combine all components\nconst allComponents = {\n  ...components,\n  ...layouts,\n  ...inputs,\n  ...calendars,\n  ...forms,\n};\n\n// Plugin interface\nexport interface StachelockUIOptions {\n  /**\n   * Component name prefix (default: 'Sl')\n   */\n  prefix?: string;\n  /**\n   * Array of component names to install globally\n   */\n  components?: string[];\n  /**\n   * Whether to install all components globally\n   */\n  installAll?: boolean;\n}\n\n// Vue plugin\nexport const StachelockUI = {\n  install(app: App, options: StachelockUIOptions = {}) {\n    const { prefix = 'Sl', installAll = false, components: selectedComponents } = options;\n\n    // Register components\n    Object.entries(allComponents).forEach(([name, component]) => {\n      const shouldInstall = installAll || \n        (selectedComponents && selectedComponents.includes(name)) ||\n        (!selectedComponents && !installAll);\n\n      if (shouldInstall) {\n        // Register non-prefixed\n        app.component(name, component);\n        // Also register prefixed alias for back-compat\n        const prefixedName = name.startsWith(prefix) ? name : `${prefix}${name}`;\n        app.component(prefixedName, component);\n      }\n    });\n  }\n};\n\nexport default StachelockUI;\n"],"names":["defaultComponentMap","UiTextInput","ComponentRegistry","type","component","loader","mapItem","asyncComponent","defineAsyncComponent","componentRegistry","registerComponent","getComponent","defaultDesignTokens","mergeDesignTokens","customTokens","defaults","merged","deepMerge","target","source","key","generateCSSVariables","tokens","css","colorName","colorShades","shade","value","variableName","name","fonts","size","generateTailwindConfig","config","f","props","__props","sizeClass","computed","progress","ref","watch","newValue","_createElementBlock","_normalizeClass","_openBlock","_hoisted_1","_createElementVNode","_hoisted_3","_toDisplayString","_hoisted_4","state","reactive","fruits","languages","cities","_cache","_hoisted_2","_createVNode","TextInput","$event","TextAreaInput","SwitchInput","CheckboxInput","SelectInput","ComboboxInput","_hoisted_5","allComponents","components","layouts","inputs","calendars","forms","StachelockUI","app","options","prefix","installAll","selectedComponents","prefixedName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOO,MAAMA,KAAoC;AAAA,EAC/C,MAAM;AAAA,IACJ,WAAW;AAAA,IACX,QAAQ,MAAM,QAAQ,QAAQC,CAAW;AAAA,EAAA;AAAA,EAE3C,OAAO;AAAA,IACL,WAAW;AAAA,IACX,QAAQ,MAAM,QAAQ,QAAQA,CAAW;AAAA,EAAA;AAAA,EAE3C,UAAU;AAAA,IACR,WAAW;AAAA,IACX,QAAQ,MAAM,QAAQ,QAAQA,CAAW;AAAA,EAAA;AAAA,EAE3C,QAAQ;AAAA,IACN,WAAW;AAAA,IACX,QAAQ,MAAM,QAAQ,QAAQA,CAAW;AAAA,EAAA;AAAA,EAE3C,KAAK;AAAA,IACH,WAAW;AAAA,IACX,QAAQ,MAAM,QAAQ,QAAQA,CAAW;AAAA,EAAA;AAAA,EAE3C,KAAK;AAAA,IACH,WAAW;AAAA,IACX,QAAQ,MAAM,QAAQ,QAAQA,CAAW;AAAA,EAAA;AAAA,EAE3C,UAAU;AAAA,IACR,WAAW;AAAA,IACX,QAAQ,MAAM,OAAO,2BAAwC;AAAA,EAAA;AAAA,EAE/D,QAAQ;AAAA,IACN,WAAW;AAAA,IACX,QAAQ,MAAM,OAAO,yBAAsC;AAAA,EAAA;AAAA,EAE7D,UAAU;AAAA,IACR,WAAW;AAAA,IACX,QAAQ,MAAM,OAAO,2BAAwC;AAAA,EAAA;AAAA,EAE/D,UAAU;AAAA,IACR,WAAW;AAAA,IACX,QAAQ,MAAM,OAAO,2BAAwC;AAAA,EAAA;AAAA,EAE/D,QAAQ;AAAA,IACN,WAAW;AAAA,IACX,QAAQ,MAAM,OAAO,yBAAsC;AAAA,EAAA;AAE/D;AAKO,MAAMC,GAAkB;AAAA,EACrB,eAA6B,EAAE,GAAGF,GAAA;AAAA,EAClC,uCAA+C,IAAA;AAAA;AAAA;AAAA;AAAA,EAKvD,SAASG,GAAcC,GAAmBC,GAAkC;AAC1E,SAAK,aAAaF,CAAI,IAAI,EAAE,WAAAC,GAAW,QAAAC,EAAA,GAEvC,KAAK,iBAAiB,OAAOF,CAAI;AAAA,EACnC;AAAA;AAAA;AAAA;AAAA,EAKA,aAAaA,GAAgC;AAC3C,UAAMG,IAAU,KAAK,aAAaH,CAAI;AACtC,QAAI,CAACG;AACH,qBAAQ,KAAK,mBAAmBH,CAAI,qBAAqB,GAClD;AAIT,QAAI,KAAK,iBAAiB,IAAIA,CAAI;AAChC,aAAO,KAAK,iBAAiB,IAAIA,CAAI;AAIvC,UAAMI,IAAiBC,EAAqB;AAAA,MAC1C,QAAQF,EAAQ;AAAA,MAChB,OAAO;AAAA,IAAA,CACR;AAED,gBAAK,iBAAiB,IAAIH,GAAMI,CAAc,GACvCA;AAAA,EACT;AAAA;AAAA;AAAA;AAAA,EAKA,aAAaJ,GAAuB;AAClC,WAAOA,KAAQ,KAAK;AAAA,EACtB;AAAA;AAAA;AAAA;AAAA,EAKA,qBAA+B;AAC7B,WAAO,OAAO,KAAK,KAAK,YAAY;AAAA,EACtC;AAAA;AAAA;AAAA;AAAA,EAKA,WAAWA,GAAoB;AAC7B,WAAO,KAAK,aAAaA,CAAI,GAC7B,KAAK,iBAAiB,OAAOA,CAAI;AAAA,EACnC;AAAA;AAAA;AAAA;AAAA,EAKA,aAAmB;AACjB,SAAK,iBAAiB,MAAA;AAAA,EACxB;AACF;AAGO,MAAMM,IAAoB,IAAIP,GAAA;AAK9B,SAASQ,GAAkBP,GAAcC,GAAmBC,GAAkC;AACnG,EAAAI,EAAkB,SAASN,GAAMC,GAAWC,CAAM;AACpD;AAKO,SAASM,GAAaR,GAAgC;AAC3D,SAAOM,EAAkB,aAAaN,CAAI;AAC5C;AC1FO,MAAMS,KAAgD;AAAA,EAC3D,QAAQ;AAAA,IACN,SAAS;AAAA,MACP,IAAI;AAAA,MACJ,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,IAAA;AAAA,IAEP,YAAY;AAAA,MACV,IAAI;AAAA,MACJ,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,MACL,KAAK;AAAA,IAAA;AAAA,EACP;AAAA,EAEF,SAAS;AAAA,IACP,GAAK;AAAA,IACL,GAAK;AAAA,IACL,GAAK;AAAA,IACL,GAAK;AAAA,IACL,GAAK;AAAA,IACL,GAAK;AAAA,IACL,GAAK;AAAA,IACL,GAAK;AAAA,IACL,IAAM;AAAA,IACN,IAAM;AAAA,IACN,IAAM;AAAA,IACN,IAAM;AAAA,IACN,IAAM;AAAA,IACN,IAAM;AAAA,IACN,IAAM;AAAA,IACN,IAAM;AAAA,IACN,IAAM;AAAA,IACN,IAAM;AAAA,IACN,IAAM;AAAA,IACN,IAAM;AAAA,IACN,IAAM;AAAA,EAAA;AAAA,EAER,cAAc;AAAA,IACZ,MAAQ;AAAA,IACR,IAAM;AAAA,IACN,SAAW;AAAA,IACX,IAAM;AAAA,IACN,IAAM;AAAA,IACN,IAAM;AAAA,IACN,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAQ;AAAA,EAAA;AAAA,EAEV,SAAS;AAAA,IACP,IAAM;AAAA,IACN,SAAW;AAAA,IACX,IAAM;AAAA,IACN,IAAM;AAAA,IACN,IAAM;AAAA,IACN,OAAO;AAAA,IACP,OAAS;AAAA,IACT,MAAQ;AAAA,EAAA;AAAA,EAEV,YAAY;AAAA,IACV,YAAY;AAAA,MACV,MAAM,CAAC,SAAS,iBAAiB,aAAa,YAAY;AAAA,MAC1D,OAAO,CAAC,YAAY,WAAW,WAAW,OAAO;AAAA,MACjD,MAAM,CAAC,gBAAgB,kBAAkB,SAAS,UAAU,YAAY,WAAW;AAAA,IAAA;AAAA,IAErF,UAAU;AAAA,MACR,IAAM;AAAA,MACN,IAAM;AAAA,MACN,MAAQ;AAAA,MACR,IAAM;AAAA,MACN,IAAM;AAAA,MACN,OAAO;AAAA,MACP,OAAO;AAAA,MACP,OAAO;AAAA,MACP,OAAO;AAAA,MACP,OAAO;AAAA,MACP,OAAO;AAAA,MACP,OAAO;AAAA,MACP,OAAO;AAAA,IAAA;AAAA,EACT;AAAA,EAEF,aAAa;AAAA,IACX,IAAM;AAAA,IACN,IAAM;AAAA,IACN,IAAM;AAAA,IACN,IAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAEX;AAEO,SAASC,GACdC,GACAC,IAAqCH,IACX;AAC1B,QAAMI,IAAS,EAAE,GAAGD,EAAA;AAGpB,WAASE,EAAUC,GAAaC,GAAkB;AAChD,QAAIA,KAAU,OAAOA,KAAW,YAAY,CAAC,MAAM,QAAQA,CAAM;AAC/D,iBAAWC,KAAOD;AAChB,QAAIA,EAAO,eAAeC,CAAG,MACvBF,EAAOE,CAAG,KAAK,OAAOF,EAAOE,CAAG,KAAM,YAAY,CAAC,MAAM,QAAQF,EAAOE,CAAG,CAAC,IAC9EF,EAAOE,CAAG,IAAIH,EAAUC,EAAOE,CAAG,GAAGD,EAAOC,CAAG,CAAC,IAEhDF,EAAOE,CAAG,IAAID,EAAOC,CAAG;AAKhC,WAAOF;AAAA,EACT;AAEA,SAAOD,EAAUD,GAAQF,CAAY;AACvC;AC7KO,SAASO,GAAqBC,GAA0C;AAC7E,MAAIC,IAAM;AAAA;AAGV,SAAID,EAAO,UACT,OAAO,QAAQA,EAAO,MAAM,EAAE,QAAQ,CAAC,CAACE,GAAWC,CAAW,MAAM;AAClE,IAAI,OAAOA,KAAgB,YAAYA,MAAgB,QACrD,OAAO,QAAQA,CAAW,EAAE,QAAQ,CAAC,CAACC,GAAOC,CAAK,MAAM;AACtD,YAAMC,IAAeF,MAAU,YAAYF,IAAY,GAAGA,CAAS,IAAIE,CAAK;AAC5E,MAAAH,KAAO,gBAAgBK,CAAY,KAAKD,CAAK;AAAA;AAAA,IAC/C,CAAC;AAAA,EAEL,CAAC,GAICL,EAAO,WACT,OAAO,QAAQA,EAAO,OAAO,EAAE,QAAQ,CAAC,CAACO,GAAMF,CAAK,MAAM;AACxD,IAAAJ,KAAO,kBAAkBM,CAAI,KAAKF,CAAK;AAAA;AAAA,EACzC,CAAC,GAICL,EAAO,gBACT,OAAO,QAAQA,EAAO,YAAY,EAAE,QAAQ,CAAC,CAACO,GAAMF,CAAK,MAAM;AAC7D,UAAMC,IAAeC,MAAS,YAAY,WAAW,UAAUA,CAAI;AACnE,IAAAN,KAAO,UAAUK,CAAY,KAAKD,CAAK;AAAA;AAAA,EACzC,CAAC,GAICL,EAAO,WACT,OAAO,QAAQA,EAAO,OAAO,EAAE,QAAQ,CAAC,CAACO,GAAMF,CAAK,MAAM;AACxD,UAAMC,IAAeC,MAAS,YAAY,WAAW,UAAUA,CAAI;AACnE,IAAAN,KAAO,UAAUK,CAAY,KAAKD,CAAK;AAAA;AAAA,EACzC,CAAC,GAICL,EAAO,eACLA,EAAO,WAAW,cACpB,OAAO,QAAQA,EAAO,WAAW,UAAU,EAAE,QAAQ,CAAC,CAACO,GAAMC,CAAK,MAAM;AACtE,IAAAP,KAAO,sBAAsBM,CAAI,KAAKC,EAAM,KAAK,IAAI,CAAC;AAAA;AAAA,EACxD,CAAC,GAGCR,EAAO,WAAW,YACpB,OAAO,QAAQA,EAAO,WAAW,QAAQ,EAAE,QAAQ,CAAC,CAACO,GAAME,CAAI,MAAM;AACnE,IAAAR,KAAO,oBAAoBM,CAAI,KAAKE,CAAI;AAAA;AAAA,EAC1C,CAAC,IAKDT,EAAO,eACT,OAAO,QAAQA,EAAO,WAAW,EAAE,QAAQ,CAAC,CAACO,GAAMF,CAAK,MAAM;AAC5D,IAAAJ,KAAO,qBAAqBM,CAAI,KAAKF,CAAK;AAAA;AAAA,EAC5C,CAAC,GAIHJ,KAAO;AAAA,GACPA,KAAO;AAAA,GACPA,KAAO;AAAA,GACPA,KAAO;AAAA,GACPA,KAAO;AAAA,GAEPA,KAAO;AAAA;AAAA,GAGPA,KAAO;AAAA,GACPA,KAAO;AAAA,GACPA,KAAO;AAAA,GACPA,KAAO;AAAA,GACPA,KAAO;AAAA,GAEAA;AACT;AAEO,SAASS,GAAuBV,GAA0C;AAC/E,MAAIW,IAAS;AAAA;AACb,SAAAA,KAAU;AAAA,GACVA,KAAU;AAAA,GACVA,KAAU;AAAA,GAGNX,EAAO,WACTW,KAAU;AAAA,GACV,OAAO,QAAQX,EAAO,MAAM,EAAE,QAAQ,CAAC,CAACE,GAAWC,CAAW,MAAM;AAClE,IAAI,OAAOA,KAAgB,YAAYA,MAAgB,SACrDQ,KAAU,YAAYT,CAAS;AAAA,GAC/B,OAAO,QAAQC,CAAW,EAAE,QAAQ,CAAC,CAACC,GAAOC,CAAK,MAAM;AAEtD,MAAAM,KAAU,cADQP,MAAU,YAAY,YAAYA,CACnB,OAAOC,CAAK;AAAA;AAAA,IAC/C,CAAC,GACDM,KAAU;AAAA;AAAA,EAEd,CAAC,GACDA,KAAU;AAAA,IAIRX,EAAO,YACTW,KAAU;AAAA,GACV,OAAO,QAAQX,EAAO,OAAO,EAAE,QAAQ,CAAC,CAACO,GAAMF,CAAK,MAAM;AACxD,IAAAM,KAAU,YAAYJ,CAAI,OAAOF,CAAK;AAAA;AAAA,EACxC,CAAC,GACDM,KAAU;AAAA,IAIRX,EAAO,iBACTW,KAAU;AAAA,GACV,OAAO,QAAQX,EAAO,YAAY,EAAE,QAAQ,CAAC,CAACO,GAAMF,CAAK,MAAM;AAE7D,IAAAM,KAAU,YADSJ,MAAS,YAAY,YAAYA,CACpB,OAAOF,CAAK;AAAA;AAAA,EAC9C,CAAC,GACDM,KAAU;AAAA,IAIRX,EAAO,YACTW,KAAU;AAAA,GACV,OAAO,QAAQX,EAAO,OAAO,EAAE,QAAQ,CAAC,CAACO,GAAMF,CAAK,MAAM;AAExD,IAAAM,KAAU,YADSJ,MAAS,YAAY,YAAYA,CACpB,OAAOF,CAAK;AAAA;AAAA,EAC9C,CAAC,GACDM,KAAU;AAAA,IAIRX,EAAO,eACLA,EAAO,WAAW,eACpBW,KAAU;AAAA,GACV,OAAO,QAAQX,EAAO,WAAW,UAAU,EAAE,QAAQ,CAAC,CAACO,GAAMC,CAAK,MAAM;AACtE,IAAAG,KAAU,YAAYJ,CAAI,OAAOC,EAAM,IAAI,CAAAI,MAAK,IAAIA,CAAC,GAAG,EAAE,KAAK,IAAI,CAAC;AAAA;AAAA,EACtE,CAAC,GACDD,KAAU;AAAA,IAGRX,EAAO,WAAW,aACpBW,KAAU;AAAA,GACV,OAAO,QAAQX,EAAO,WAAW,QAAQ,EAAE,QAAQ,CAAC,CAACO,GAAME,CAAI,MAAM;AACnE,IAAAE,KAAU,YAAYJ,CAAI,OAAOE,CAAI;AAAA;AAAA,EACvC,CAAC,GACDE,KAAU;AAAA,KAIdA,KAAU;AAAA,GACVA,KAAU;AAAA,GACVA,KAAU;AAAA,GAEHA;AACT;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACpIA,UAAME,IAAQC,GAmBRC,IAAYC,EAAS,MAAM;AAC/B,cAAQH,EAAM,MAAA;AAAA,QACZ,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT;AACE,iBAAO;AAAA,MAAA;AAAA,IAEb,CAAC,GAEKI,IAAWC,EAAIL,EAAM,QAAQ;AAEnC,WAAAM,EAAM,MAAMN,EAAM,UAAU,CAACO,MAAa;AACxC,MAAAH,EAAS,QAAQG;AAAA,IACnB,CAAC,mBA7DCC,EAeM,OAAA;AAAA,MAfD,OAAKC,EAAA,CAAC,eAAsBP,EAAA,KAAS,CAAA;AAAA,IAAA;OACxCQ,KAAAF,EAOM,OAPNG,IAOM;AAAA,wBANJC,EACsF,QAAA;AAAA,UADhF,OAAM;AAAA,UAAkC,gBAAa;AAAA,UACzD,GAAE;AAAA,QAAA;QACJA,EAGsF,QAAA;AAAA,UAFpF,OAAM;AAAA,UACL,oBAAkBR,EAAA,QAAQ;AAAA,UAAY,gBAAa;AAAA,UACpD,GAAE;AAAA,QAAA;;MAEKH,EAAA,SAASA,EAAA,MAAM,SAAM,UAAhCO,EACkI,OADlIK,IACkIC,EAAdb,EAAA,KAAK,GAAA,CAAA;MAC9GA,EAAA,qBAAXS,EAAA,GAAAF,EAGM,OAHNO,IAGMD,EADDV,EAAA,KAAQ,IAAG,MAChB,CAAA;;;;;;;;;;;;;;;;;;;;;AC4FJ,UAAMY,IAAQC,EAAS;AAAA,MACrB,MAAM;AAAA,MACN,UAAU;AAAA,MACV,UAAU;AAAA,MACV,UAAU;AAAA,MACV,eAAe;AAAA,MACf,mBAAmB,CAAA;AAAA,MACnB,cAAc;AAAA,IAAA,CACf,GAEKC,IAAS;AAAA,MACb,EAAE,IAAI,GAAG,MAAM,QAAA;AAAA,MACf,EAAE,IAAI,GAAG,MAAM,SAAA;AAAA,MACf,EAAE,IAAI,GAAG,MAAM,SAAA;AAAA,MACf,EAAE,IAAI,GAAG,MAAM,UAAU,UAAU,GAAA;AAAA,IAAK,GAGpCC,IAAY;AAAA,MAChB,EAAE,IAAI,GAAG,MAAM,aAAA;AAAA,MACf,EAAE,IAAI,GAAG,MAAM,aAAA;AAAA,MACf,EAAE,IAAI,GAAG,MAAM,SAAA;AAAA,MACf,EAAE,IAAI,GAAG,MAAM,KAAA;AAAA,MACf,EAAE,IAAI,GAAG,MAAM,OAAA;AAAA,IAAO,GAGlBC,IAAS;AAAA,MACb,EAAE,IAAI,GAAG,MAAM,WAAA;AAAA,MACf,EAAE,IAAI,GAAG,MAAM,gBAAA;AAAA,MACf,EAAE,IAAI,GAAG,MAAM,UAAA;AAAA,MACf,EAAE,IAAI,GAAG,MAAM,SAAA;AAAA,MACf,EAAE,IAAI,GAAG,MAAM,UAAA;AAAA,MACf,EAAE,IAAI,GAAG,MAAM,SAAA;AAAA,MACf,EAAE,IAAI,GAAG,MAAM,QAAA;AAAA,MACf,EAAE,IAAI,GAAG,MAAM,SAAA;AAAA,IAAS;sBA3IxBV,EAAA,GAAAF,EA8FU,WA9FVG,IA8FU;AAAA,MA7FRU,EAAA,EAAA,MAAAA,EAAA,EAAA,IAAAT,EAAwE,MAAA,EAApE,OAAM,sCAAA,GAAsC,uBAAmB,EAAA;AAAA,MAEnEA,EA0FM,OA1FNU,IA0FM;AAAA,QAxFJV,EAQM,OAAA,MAAA;AAAA,UAPJS,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAAT,EAA8E,MAAA,EAA1E,OAAM,qDAAA,GAAqD,cAAU,EAAA;AAAA,UACzEW,EAKEC,GAAA;AAAA,YAJA,MAAK;AAAA,YACL,OAAM;AAAA,YACN,aAAY;AAAA,YACJ,OAAOR,EAAM;AAAA,YAAN,kBAAAK,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAI,MAAAT,EAAM,OAAIS;AAAA,UAAA;;QAK7Bb,EAUM,OAAA,MAAA;AAAA,UATJS,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAAT,EAA6E,MAAA,EAAzE,OAAM,qDAAA,GAAqD,aAAS,EAAA;AAAA,UACxEW,EAOEG,GAAA;AAAA,YANA,MAAK;AAAA,YACL,OAAM;AAAA,YACN,aAAY;AAAA,YACX,MAAM;AAAA,YACN,WAAW;AAAA,YACH,YAAAV,EAAM;AAAA,YAAN,uBAAAK,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAI,MAAAT,EAAM,WAAQS;AAAA,UAAA;;QAK3Bb,EASM,OAAA,MAAA;AAAA,UARJS,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAAT,EAA0E,MAAA,EAAtE,OAAM,qDAAA,GAAqD,UAAM,EAAA;AAAA,UACrEW,EAMEI,GAAA;AAAA,YALA,MAAK;AAAA,YACL,OAAM;AAAA,YACG,YAAAX,EAAM;AAAA,YAAN,uBAAAK,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAI,MAAAT,EAAM,WAAQS;AAAA,YACvB,UAAS;AAAA,YACT,WAAU;AAAA,UAAA;;QAKdb,EAOM,OAAA,MAAA;AAAA,UANJS,EAAA,EAAA,MAAAA,EAAA,EAAA,IAAAT,EAA4E,MAAA,EAAxE,OAAM,qDAAA,GAAqD,YAAQ,EAAA;AAAA,UACvEW,EAIEK,GAAA;AAAA,YAHA,MAAK;AAAA,YACL,OAAM;AAAA,YACG,YAAAZ,EAAM;AAAA,YAAN,uBAAAK,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAI,MAAAT,EAAM,WAAQS;AAAA,UAAA;;QAK3Bb,EAuBM,OAvBNC,IAuBM;AAAA,UAtBJD,EASM,OAAA,MAAA;AAAA,YARJS,EAAA,EAAA,MAAAA,EAAA,EAAA,IAAAT,EAAmF,MAAA,EAA/E,OAAM,qDAAA,GAAqD,mBAAe,EAAA;AAAA,YAC9EW,EAMEM,GAAA;AAAA,cALA,MAAK;AAAA,cACL,OAAM;AAAA,cACN,aAAY;AAAA,cACX,OAAOX;AAAA,cACC,YAAAF,EAAM;AAAA,cAAN,uBAAAK,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAI,MAAAT,EAAM,gBAAaS;AAAA,YAAA;;UAGhCb,EAWM,OAAA,MAAA;AAAA,YAVJS,EAAA,EAAA,MAAAA,EAAA,EAAA,IAAAT,EAAqF,MAAA,EAAjF,OAAM,qDAAA,GAAqD,qBAAiB,EAAA;AAAA,YAChFW,EAQEM,GAAA;AAAA,cAPA,MAAK;AAAA,cACL,OAAM;AAAA,cACN,aAAY;AAAA,cACX,OAAOV;AAAA,cACR,UAAA;AAAA,cACA,SAAA;AAAA,cACS,YAAAH,EAAM;AAAA,cAAN,uBAAAK,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAI,MAAAT,EAAM,oBAAiBS;AAAA,YAAA;;;QAMtCb,EASM,OAAA,MAAA;AAAA,UARJS,EAAA,EAAA,MAAAA,EAAA,EAAA,IAAAT,EAA4E,MAAA,EAAxE,OAAM,qDAAA,GAAqD,YAAQ,EAAA;AAAA,UACvEW,EAMEO,GAAA;AAAA,YALA,MAAK;AAAA,YACL,OAAM;AAAA,YACN,aAAY;AAAA,YACX,OAAOV;AAAA,YACC,YAAAJ,EAAM;AAAA,YAAN,uBAAAK,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAI,MAAAT,EAAM,eAAYS;AAAA,UAAA;;QAK/Bb,EAGM,OAHNG,IAGM;AAAA,UAFJM,EAAA,EAAA,MAAAA,EAAA,EAAA,IAAAT,EAAiD,OAAA,EAA5C,OAAM,2BAAA,GAA2B,SAAK,EAAA;AAAA,UAC3CA,EAAqD,OAArDmB,IAAqDjB,EAAdE,CAAK,GAAA,CAAA;AAAA,QAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;8CCpF9CgB,KAAgB;AAAA,EACpB,GAAGC;AAAA,EACH,GAAGC;AAAA,EACH,GAAGC;AAAA,EACH,GAAGC;AAAA,EACH,GAAGC;AACL,GAmBaC,KAAe;AAAA,EAC1B,QAAQC,GAAUC,IAA+B,IAAI;AACnD,UAAM,EAAE,QAAAC,IAAS,MAAM,YAAAC,IAAa,IAAO,YAAYC,MAAuBH;AAG9E,WAAO,QAAQR,EAAa,EAAE,QAAQ,CAAC,CAACtC,GAAMzB,CAAS,MAAM;AAK3D,UAJsByE,KACnBC,KAAsBA,EAAmB,SAASjD,CAAI,KACtD,CAACiD,KAAsB,CAACD,GAER;AAEjB,QAAAH,EAAI,UAAU7C,GAAMzB,CAAS;AAE7B,cAAM2E,IAAelD,EAAK,WAAW+C,CAAM,IAAI/C,IAAO,GAAG+C,CAAM,GAAG/C,CAAI;AACtE,QAAA6C,EAAI,UAAUK,GAAc3E,CAAS;AAAA,MACvC;AAAA,IACF,CAAC;AAAA,EACH;AACF;"}

package/dist/src/config/css-variables.d.ts

@@ -0,0 +1,5 @@
+import { StachelockUIDesignTokens } from './design-tokens';
+
+export declare function generateCSSVariables(tokens: StachelockUIDesignTokens): string;
+export declare function generateTailwindConfig(tokens: StachelockUIDesignTokens): string;
+//# sourceMappingURL=css-variables.d.ts.map

package/dist/src/config/css-variables.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"css-variables.d.ts","sourceRoot":"","sources":["../../../src/config/css-variables.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,iBAAiB,CAAC;AAEhE,wBAAgB,oBAAoB,CAAC,MAAM,EAAE,wBAAwB,GAAG,MAAM,CA6E7E;AAED,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,wBAAwB,GAAG,MAAM,CA2E/E"}

package/dist/src/config/design-tokens.d.ts

@@ -0,0 +1,52 @@
+export interface StachelockUIDesignTokens {
+    colors?: {
+        primary?: {
+            50?: string;
+            100?: string;
+            200?: string;
+            300?: string;
+            400?: string;
+            500?: string;
+            600?: string;
+            700?: string;
+            800?: string;
+            900?: string;
+        };
+        stachelock?: {
+            50?: string;
+            100?: string;
+            200?: string;
+            300?: string;
+            400?: string;
+            500?: string;
+            600?: string;
+            700?: string;
+            800?: string;
+            900?: string;
+        };
+        [key: string]: any;
+    };
+    spacing?: {
+        [key: string]: string;
+    };
+    borderRadius?: {
+        [key: string]: string;
+    };
+    shadows?: {
+        [key: string]: string;
+    };
+    typography?: {
+        fontFamily?: {
+            [key: string]: string[];
+        };
+        fontSize?: {
+            [key: string]: string;
+        };
+    };
+    breakpoints?: {
+        [key: string]: string;
+    };
+}
+export declare const defaultDesignTokens: StachelockUIDesignTokens;
+export declare function mergeDesignTokens(customTokens: StachelockUIDesignTokens, defaults?: StachelockUIDesignTokens): StachelockUIDesignTokens;
+//# sourceMappingURL=design-tokens.d.ts.map

package/dist/src/config/design-tokens.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"design-tokens.d.ts","sourceRoot":"","sources":["../../../src/config/design-tokens.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,wBAAwB;IACvC,MAAM,CAAC,EAAE;QACP,OAAO,CAAC,EAAE;YACR,EAAE,CAAC,EAAE,MAAM,CAAC;YACZ,GAAG,CAAC,EAAE,MAAM,CAAC;YACb,GAAG,CAAC,EAAE,MAAM,CAAC;YACb,GAAG,CAAC,EAAE,MAAM,CAAC;YACb,GAAG,CAAC,EAAE,MAAM,CAAC;YACb,GAAG,CAAC,EAAE,MAAM,CAAC;YACb,GAAG,CAAC,EAAE,MAAM,CAAC;YACb,GAAG,CAAC,EAAE,MAAM,CAAC;YACb,GAAG,CAAC,EAAE,MAAM,CAAC;YACb,GAAG,CAAC,EAAE,MAAM,CAAC;SACd,CAAC;QACF,UAAU,CAAC,EAAE;YACX,EAAE,CAAC,EAAE,MAAM,CAAC;YACZ,GAAG,CAAC,EAAE,MAAM,CAAC;YACb,GAAG,CAAC,EAAE,MAAM,CAAC;YACb,GAAG,CAAC,EAAE,MAAM,CAAC;YACb,GAAG,CAAC,EAAE,MAAM,CAAC;YACb,GAAG,CAAC,EAAE,MAAM,CAAC;YACb,GAAG,CAAC,EAAE,MAAM,CAAC;YACb,GAAG,CAAC,EAAE,MAAM,CAAC;YACb,GAAG,CAAC,EAAE,MAAM,CAAC;YACb,GAAG,CAAC,EAAE,MAAM,CAAC;SACd,CAAC;QACF,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;KACpB,CAAC;IACF,OAAO,CAAC,EAAE;QACR,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;KACvB,CAAC;IACF,YAAY,CAAC,EAAE;QACb,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;KACvB,CAAC;IACF,OAAO,CAAC,EAAE;QACR,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;KACvB,CAAC;IACF,UAAU,CAAC,EAAE;QACX,UAAU,CAAC,EAAE;YACX,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;SACzB,CAAC;QACF,QAAQ,CAAC,EAAE;YACT,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;SACvB,CAAC;KACH,CAAC;IACF,WAAW,CAAC,EAAE;QACZ,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;KACvB,CAAC;CACH;AAED,eAAO,MAAM,mBAAmB,EAAE,wBAoGjC,CAAC;AAEF,wBAAgB,iBAAiB,CAC/B,YAAY,EAAE,wBAAwB,EACtC,QAAQ,GAAE,wBAA8C,GACvD,wBAAwB,CAoB1B"}

package/dist/src/config/index.d.ts

@@ -0,0 +1,3 @@
+export * from './css-variables';
+export * from './design-tokens';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/config/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/config/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC"}

package/dist/src/index.d.ts

@@ -1,6 +1,8 @@
 export * from './types';
 export * from './utils/id';
 export * from './utils/component-registry';
+export * from './config/design-tokens';
+export * from './config/css-variables';
 export * from './components';
 export * from './components/layouts';
 export * from './components/inputs';

package/dist/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AACA,cAAc,SAAS,CAAC;AAGxB,cAAc,YAAY,CAAC;AAC3B,cAAc,4BAA4B,CAAC;AAG3C,cAAc,cAAc,CAAC;AAG7B,cAAc,sBAAsB,CAAC;AAGrC,cAAc,qBAAqB,CAAC;AAGpC,cAAc,wBAAwB,CAAC;AAGvC,cAAc,oBAAoB,CAAC;AAGnC,OAAO,EAAE,YAAY,EAAE,KAAK,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAClE,OAAO,EAAE,YAAY,IAAI,OAAO,EAAE,MAAM,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AACA,cAAc,SAAS,CAAC;AAGxB,cAAc,YAAY,CAAC;AAC3B,cAAc,4BAA4B,CAAC;AAG3C,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AAGvC,cAAc,cAAc,CAAC;AAG7B,cAAc,sBAAsB,CAAC;AAGrC,cAAc,qBAAqB,CAAC;AAGpC,cAAc,wBAAwB,CAAC;AAGvC,cAAc,oBAAoB,CAAC;AAGnC,OAAO,EAAE,YAAY,EAAE,KAAK,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAClE,OAAO,EAAE,YAAY,IAAI,OAAO,EAAE,MAAM,UAAU,CAAC"}

package/dist/src/plugin/configure.d.ts

@@ -0,0 +1,28 @@
+import { App } from 'vue';
+import { StachelockUIDesignTokens } from '../config/design-tokens';
+
+export interface StachelockUIOptions {
+    designTokens?: StachelockUIDesignTokens;
+    prefix?: string;
+    injectCSS?: boolean;
+}
+export interface StachelockUIPlugin {
+    install: (app: App, options?: StachelockUIOptions) => void;
+    configure: (options: StachelockUIOptions) => void;
+    getDesignTokens: () => StachelockUIDesignTokens;
+    generateCSS: () => string;
+}
+declare class StachelockUIPluginImpl implements StachelockUIPlugin {
+    private designTokens;
+    private prefix;
+    private injectCSS;
+    constructor();
+    install(app: App, options?: StachelockUIOptions): void;
+    configure(options: StachelockUIOptions): void;
+    getDesignTokens(): StachelockUIDesignTokens;
+    generateCSS(): string;
+    private injectCSSVariables;
+}
+export declare const StachelockUI: StachelockUIPlugin;
+export { StachelockUIPluginImpl };
+//# sourceMappingURL=configure.d.ts.map

package/dist/src/plugin/configure.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"configure.d.ts","sourceRoot":"","sources":["../../../src/plugin/configure.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC/B,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AAIxE,MAAM,WAAW,mBAAmB;IAClC,YAAY,CAAC,EAAE,wBAAwB,CAAC;IACxC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,kBAAkB;IACjC,OAAO,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,OAAO,CAAC,EAAE,mBAAmB,KAAK,IAAI,CAAC;IAC3D,SAAS,EAAE,CAAC,OAAO,EAAE,mBAAmB,KAAK,IAAI,CAAC;IAClD,eAAe,EAAE,MAAM,wBAAwB,CAAC;IAChD,WAAW,EAAE,MAAM,MAAM,CAAC;CAC3B;AAED,cAAM,sBAAuB,YAAW,kBAAkB;IACxD,OAAO,CAAC,YAAY,CAA2B;IAC/C,OAAO,CAAC,MAAM,CAAiB;IAC/B,OAAO,CAAC,SAAS,CAAiB;;IAQlC,OAAO,CAAC,GAAG,EAAE,GAAG,EAAE,OAAO,GAAE,mBAAwB;IAkBnD,SAAS,CAAC,OAAO,EAAE,mBAAmB;IActC,eAAe,IAAI,wBAAwB;IAI3C,WAAW,IAAI,MAAM;IAIrB,OAAO,CAAC,kBAAkB;CAe3B;AAGD,eAAO,MAAM,YAAY,EAAE,kBAAiD,CAAC;AAG7E,OAAO,EAAE,sBAAsB,EAAE,CAAC"}

package/dist/src/plugin/index.d.ts

@@ -0,0 +1,2 @@
+export * from './configure';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/plugin/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/plugin/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC"}

package/examples/custom-tokens.json

@@ -0,0 +1,70 @@
+{
+  "colors": {
+    "primary": {
+      "50": "#f0f9ff",
+      "100": "#e0f2fe",
+      "200": "#bae6fd",
+      "300": "#7dd3fc",
+      "400": "#38bdf8",
+      "500": "#0ea5e9",
+      "600": "#0284c7",
+      "700": "#0369a1",
+      "800": "#075985",
+      "900": "#0c4a6e"
+    },
+    "stachelock": {
+      "50": "#fef2f2",
+      "100": "#fee2e2",
+      "200": "#fecaca",
+      "300": "#fca5a5",
+      "400": "#f87171",
+      "500": "#ef4444",
+      "600": "#dc2626",
+      "700": "#b91c1c",
+      "800": "#991b1b",
+      "900": "#7f1d1d"
+    },
+    "accent": {
+      "50": "#fdf4ff",
+      "100": "#fae8ff",
+      "200": "#f5d0fe",
+      "300": "#f0abfc",
+      "400": "#e879f9",
+      "500": "#d946ef",
+      "600": "#c026d3",
+      "700": "#a21caf",
+      "800": "#86198f",
+      "900": "#701a75"
+    }
+  },
+  "spacing": {
+    "18": "4.5rem",
+    "22": "5.5rem",
+    "26": "6.5rem",
+    "30": "7.5rem"
+  },
+  "borderRadius": {
+    "2xl": "1rem",
+    "3xl": "1.5rem",
+    "4xl": "2rem"
+  },
+  "shadows": {
+    "glow": "0 0 20px rgba(59, 130, 246, 0.5)",
+    "glow-lg": "0 0 40px rgba(59, 130, 246, 0.3)"
+  },
+  "typography": {
+    "fontFamily": {
+      "display": ["Poppins", "ui-sans-serif", "system-ui", "sans-serif"],
+      "mono": ["JetBrains Mono", "ui-monospace", "SFMono-Regular", "Menlo", "Monaco", "Consolas", "monospace"]
+    },
+    "fontSize": {
+      "2xs": "0.625rem",
+      "3xl": "1.875rem",
+      "4xl": "2.25rem"
+    }
+  },
+  "breakpoints": {
+    "3xl": "1600px",
+    "4xl": "1920px"
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stachelock/ui",
-  "version": "0.1.9",
+  "version": "0.2.1",
   "description": "A comprehensive Vue 3 UI component library built with Tailwind CSS",
   "type": "module",
   "main": "./dist/index.js",
@@ -13,6 +13,7 @@
     },
     "./style.css": "./dist/style.css",
     "./tailwind.config.js": "./dist/tailwind.config.js",
+    "./generate-config": "./scripts/generate-config.cjs",
     "./components/*": {
       "import": "./dist/components/*.js",
       "types": "./dist/components/*.d.ts"
@@ -37,8 +38,14 @@
   "files": [
     "dist",
     "tailwind.config.js",
-    "README.md"
+    "scripts",
+    "examples",
+    "README.md",
+    "CUSTOMIZATION.md"
   ],
+  "bin": {
+    "stachelock-ui": "./scripts/generate-config.cjs"
+  },
   "scripts": {
     "dev": "vite",
     "build": "vite build && npm run build:css",
@@ -57,7 +64,8 @@
     "prepack": "npm run build",
     "postpack": "rm -rf dist",
     "generate-indexes": "node scripts/generateRecursiveIndex.cjs",
-    "prebuild": "npm run generate-indexes"
+    "prebuild": "npm run generate-indexes",
+    "generate-config": "node scripts/generate-config.cjs"
   },
   "keywords": [
     "vue",

package/scripts/build-css.cjs

@@ -0,0 +1,29 @@
+const { execSync } = require('child_process');
+const fs = require('fs');
+const path = require('path');
+
+console.log('🔨 Building Tailwind CSS with sl- prefix...');
+
+try {
+  // Run Tailwind CLI to build the CSS
+  execSync('npx tailwindcss -i ./src/style.css -o ./dist/style.css --minify', { 
+    stdio: 'inherit',
+    cwd: process.cwd()
+  });
+  
+  console.log('✅ Tailwind CSS built successfully!');
+  
+  // Read the generated CSS to verify it contains the sl- prefixed utilities
+  const cssContent = fs.readFileSync('./dist/style.css', 'utf8');
+  
+  // Check if it contains some basic sl- prefixed utilities
+  if (cssContent.includes('.sl-bg-') || cssContent.includes('.sl-text-') || cssContent.includes('.sl-flex')) {
+    console.log('✅ CSS contains sl- prefixed Tailwind utilities');
+  } else {
+    console.log('⚠️  CSS may not contain expected sl- prefixed utilities');
+  }
+  
+} catch (error) {
+  console.error('❌ Error building Tailwind CSS:', error.message);
+  process.exit(1);
+}

package/scripts/generate-config.cjs

@@ -0,0 +1,83 @@
+#!/usr/bin/env node
+
+const fs = require('fs');
+const path = require('path');
+
+console.log('🎨 Stachelock UI Config Generator');
+console.log('==================================\n');
+
+// Get command line arguments
+const args = process.argv.slice(2);
+const configFile = args[0];
+const outputDir = args[1] || './';
+
+if (!configFile) {
+  console.log('Usage: node generate-config.cjs <config-file> [output-dir]');
+  console.log('');
+  console.log('Example:');
+  console.log('  node generate-config.cjs ./my-tokens.json ./generated/');
+  console.log('');
+  console.log('The config file should contain design tokens in the StachelockUIDesignTokens format.');
+  console.log('See the documentation for the expected format.');
+  process.exit(1);
+}
+
+if (!fs.existsSync(configFile)) {
+  console.error(`❌ Config file not found: ${configFile}`);
+  process.exit(1);
+}
+
+try {
+  // Read and parse the config file
+  console.log(`📖 Reading config from: ${configFile}`);
+  const configContent = fs.readFileSync(configFile, 'utf8');
+  const customTokens = JSON.parse(configContent);
+  
+  // Import the required functions
+  const { mergeDesignTokens, defaultDesignTokens } = require('../dist/config/design-tokens.js');
+  const { generateCSSVariables, generateTailwindConfig } = require('../dist/config/css-variables.js');
+  
+  // Merge with default tokens
+  console.log('🔄 Merging with default design tokens...');
+  const mergedTokens = mergeDesignTokens(customTokens, defaultDesignTokens);
+  
+  // Generate CSS variables
+  console.log('🎨 Generating CSS variables...');
+  const cssVariables = generateCSSVariables(mergedTokens);
+  
+  // Generate Tailwind config
+  console.log('⚙️  Generating Tailwind config...');
+  const tailwindConfig = generateTailwindConfig(mergedTokens);
+  
+  // Ensure output directory exists
+  if (!fs.existsSync(outputDir)) {
+    fs.mkdirSync(outputDir, { recursive: true });
+  }
+  
+  // Write CSS variables file
+  const cssOutputPath = path.join(outputDir, 'stachelock-ui-variables.css');
+  fs.writeFileSync(cssOutputPath, cssVariables);
+  console.log(`✅ CSS variables written to: ${cssOutputPath}`);
+  
+  // Write Tailwind config file
+  const configOutputPath = path.join(outputDir, 'stachelock-ui-tailwind.config.js');
+  fs.writeFileSync(configOutputPath, tailwindConfig);
+  console.log(`✅ Tailwind config written to: ${configOutputPath}`);
+  
+  // Write merged tokens JSON for reference
+  const tokensOutputPath = path.join(outputDir, 'stachelock-ui-tokens.json');
+  fs.writeFileSync(tokensOutputPath, JSON.stringify(mergedTokens, null, 2));
+  console.log(`✅ Merged tokens written to: ${tokensOutputPath}`);
+  
+  console.log('\n🎉 Configuration generation complete!');
+  console.log('\nNext steps:');
+  console.log('1. Import the CSS variables in your main CSS file:');
+  console.log(`   @import "${cssOutputPath}";`);
+  console.log('2. Use the Tailwind config in your tailwind.config.js:');
+  console.log(`   const stachelockConfig = require("${configOutputPath}");`);
+  console.log('3. Merge it with your existing config as needed.');
+  
+} catch (error) {
+  console.error('❌ Error generating configuration:', error.message);
+  process.exit(1);
+}