le-kit 0.1.13 → 0.1.15

package/dist/{collection/dist/collection → components}/themes/minimal.css

@@ -62,6 +62,7 @@
   /* Surface colors */
   --le-color-surface: #ffffff;
   --le-color-surface-elevated: #ffffff;
+  --le-color-surface-alt: #f3f4f6;
   
   /* Text colors */
   --le-color-text-primary: #111827;
@@ -71,6 +72,7 @@
   
   /* Border colors */
   --le-color-border: #e5e7eb;
+  --le-color-border-hover: #a7aaae;
   --le-color-border-light: #f3f4f6;
   --le-color-border-dark: #d1d5db;
 
@@ -79,7 +81,7 @@
   --le-color-border-input: #c8cfdd;
 
   /* Focus ring */
-  --le-color-focus: rgba(17, 24, 39, 0.3);
+  --le-color-focus: rgba(17, 24, 39, 0.15);
   
   /* Border radius - sharp/minimal */
   --le-radius-none: 0;
@@ -91,6 +93,7 @@
   --le-radius-full: 9999px;
   
   /* Shadows - very subtle */
+  --le-color-shadow: color-mix(in srgb, var(--le-color-primary) 80%, transparent);
   --le-shadow-none: none;
   --le-shadow-sm: none;
   --le-shadow-md: 0 1px 2px rgba(0, 0, 0, 0.05);

package/dist/{le-kit/dist/collection → components}/themes/warm.css

@@ -62,6 +62,7 @@
   /* Surface colors */
   --le-color-surface: #ffffff;
   --le-color-surface-elevated: #ffffff;
+  --le-color-surface-alt: #ffebba;
   
   /* Text colors */
   --le-color-text-primary: #78350f;
@@ -71,6 +72,7 @@
   
   /* Border colors */
   --le-color-border: #fcd34d;
+  --le-color-border-hover: #ee8349;
   --le-color-border-light: #fde68a;
   --le-color-border-dark: #fbbf24;
 
@@ -79,7 +81,7 @@
   --le-color-border-input: #e7d4c4;
 
   /* Focus ring */
-  --le-color-focus: rgba(234, 88, 12, 0.5);
+  --le-color-focus: rgba(234, 88, 12, 0.15);
   
   /* Border radius - slightly rounded */
   --le-radius-none: 0;
@@ -91,6 +93,7 @@
   --le-radius-full: 9999px;
   
   /* Shadows - warm tinted */
+  --le-color-shadow: color-mix(in srgb, var(--le-color-primary) 80%, transparent);
   --le-shadow-none: none;
   --le-shadow-sm: 0 1px 2px rgba(234, 88, 12, 0.05);
   --le-shadow-md: 0 4px 6px rgba(234, 88, 12, 0.1), 0 2px 4px rgba(234, 88, 12, 0.06);

package/dist/components/utils.js

@@ -140,17 +140,17 @@ let leKitConfig = {
      * 1. Copy the manifest from node_modules/le-kit/custom-elements.json to your public folder
      * 2. Or set this to point to where the manifest is served
      */
-    manifestUrl: '/custom-elements.json',
+    manifestFile: '/custom-elements.json',
 };
 /**
  * Configure le-kit global settings.
  *
  * @example
  * ```ts
- * import { configureLeki } from 'le-kit';
+ * import { configureLeKit } from 'le-kit';
  *
- * configureLeki({
- *   manifestUrl: '/assets/custom-elements.json'
+ * configureLeKit({
+ *   manifestFile: 'custom-elements.json'
  * });
  * ```
  */

package/dist/components/utils.js.map

@@ -1 +1 @@
-{"file":"utils.js","mappings":"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","names":[],"sources":["src/global/app.ts","src/utils/utils.ts"],"sourcesContent":["import { setMode } from '@stencil/core';\n\nexport type LeKitMode = 'default' | 'admin' | string;\nexport type LeKitTheme = 'default' | 'dark' | string;\n\n/**\n * Global mode initialization for le-kit components.\n *\n * Mode inheritance works as follows:\n * 1. Check the element's own `mode` attribute\n * 2. Traverse up the DOM to find a parent with `mode` attribute\n * 3. Check the document root element (html) for `mode` attribute\n * 4. Fall back to 'default'\n *\n * This allows setting mode at any level:\n * - `<html mode=\"admin\">` - all components in admin mode\n * - `<le-card mode=\"admin\">` - this card and its children in admin mode\n */\nfunction initializeMode() {\n  setMode((el: HTMLElement): LeKitMode => {\n    // 1. Check element's own mode attribute\n    const ownMode = el.getAttribute('mode');\n    if (ownMode) {\n      return ownMode as LeKitMode;\n    }\n\n    // 2. Traverse up the DOM tree to find inherited mode\n    let parent = el.parentElement;\n    while (parent) {\n      const parentMode = parent.getAttribute('mode');\n      if (parentMode) {\n        return parentMode as LeKitMode;\n      }\n      parent = parent.parentElement;\n    }\n\n    // 3. Check document root element\n    const rootMode = document.documentElement.getAttribute('mode');\n    if (rootMode) {\n      return rootMode as LeKitMode;\n    }\n\n    // 4. Default mode\n    return 'default';\n  });\n}\n\n// Default export for Stencil global script\nexport default initializeMode;\n\n/**\n * Helper function to get the current mode for an element.\n * Can be used programmatically in components.\n * \n * This function traverses both regular DOM and shadow DOM boundaries\n * to find the nearest mode attribute.\n */\nexport function getMode(el: HTMLElement): LeKitMode {\n  // Check element's own mode\n  const ownMode = el.getAttribute('mode');\n  if (ownMode) {\n    return ownMode as LeKitMode;\n  }\n\n  // Traverse up DOM, crossing shadow boundaries\n  let current: Node | null = el;\n  while (current) {\n    // Try parent element first\n    if (current instanceof Element && current.parentElement) {\n      current = current.parentElement;\n      const mode = (current as HTMLElement).getAttribute?.('mode');\n      if (mode) {\n        return mode as LeKitMode;\n      }\n    } else {\n      // No parent element - check if we're in a shadow root\n      const root = current.getRootNode();\n      if (root instanceof ShadowRoot) {\n        // Cross the shadow boundary to the host element\n        current = root.host;\n        const mode = (current as HTMLElement).getAttribute?.('mode');\n        if (mode) {\n          return mode as LeKitMode;\n        }\n      } else {\n        // We've reached the document root\n        break;\n      }\n    }\n  }\n\n  // Check document root\n  const rootMode = document.documentElement.getAttribute('mode');\n  if (rootMode) {\n    return rootMode as LeKitMode;\n  }\n\n  return 'default';\n}\n\n/**\n * Helper function to get the current theme for an element.\n * Theme inheritance works the same as mode - cascades through DOM.\n */\nexport function getTheme(el: HTMLElement): LeKitTheme {\n  // Check element's own theme\n  const ownTheme = el.getAttribute('theme');\n  if (ownTheme) {\n    return ownTheme as LeKitTheme;\n  }\n\n  // Traverse up DOM\n  let parent = el.parentElement;\n  while (parent) {\n    const parentTheme = parent.getAttribute('theme');\n    if (parentTheme) {\n      return parentTheme as LeKitTheme;\n    }\n    parent = parent.parentElement;\n  }\n\n  // Check root\n  const rootTheme = document.documentElement.getAttribute('theme');\n  if (rootTheme) {\n    return rootTheme as LeKitTheme;\n  }\n\n  return 'default';\n}\n\n/**\n * Helper function to set mode on the document root.\n * Useful for switching all components to admin mode.\n */\nexport function setGlobalMode(mode: LeKitMode): void {\n  document.documentElement.setAttribute('mode', mode);\n}\n\n/**\n * Helper function to set theme on the document root.\n * Useful for switching all components to a different theme.\n */\nexport function setGlobalTheme(theme: LeKitTheme): void {\n  document.documentElement.setAttribute('theme', theme);\n}\n\n/**\n * Global configuration for le-kit\n */\nlet leKitConfig = {\n  /**\n   * URL to the custom-elements.json manifest.\n   * Used by admin components (le-component, le-slot) to load component metadata.\n   * \n   * Default: '/custom-elements.json' (served from app root)\n   * \n   * For apps using le-kit, you may need to:\n   * 1. Copy the manifest from node_modules/le-kit/custom-elements.json to your public folder\n   * 2. Or set this to point to where the manifest is served\n   */\n  manifestUrl: '/custom-elements.json',\n};\n\n/**\n * Configure le-kit global settings.\n * \n * @example\n * ```ts\n * import { configureLeki } from 'le-kit';\n * \n * configureLeki({\n *   manifestUrl: '/assets/custom-elements.json'\n * });\n * ```\n */\nexport function configureLeKit(config: Partial<typeof leKitConfig>): void {\n  leKitConfig = { ...leKitConfig, ...config };\n}\n\n/**\n * Get the current le-kit configuration.\n */\nexport function getLeKitConfig(): typeof leKitConfig {\n  return leKitConfig;\n}\n","/**\n * Utility functions for le-kit components\n */\n\nimport { getMode } from '../global/app';\n\n/**\n * Generates a unique ID for component instances\n */\nexport function generateId(prefix: string = 'le'): string {\n  return `${prefix}-${Math.random().toString(36).substring(2, 9)}`;\n}\n\n/**\n * Parses a comma-separated string into an array\n */\nexport function parseCommaSeparated(value: string | undefined): string[] {\n  if (!value) return [];\n  return value\n    .split(',')\n    .map(s => s.trim())\n    .filter(Boolean);\n}\n\n/**\n * Checks if a slot has content\n */\nexport function slotHasContent(el: HTMLElement, slotName: string = ''): boolean {\n  const selector = slotName ? `[slot=\"${slotName}\"]` : ':not([slot])';\n  return el.querySelector(selector) !== null;\n}\n\n/**\n * Sets up a MutationObserver to track mode changes on ancestor elements.\n * Returns a cleanup function to disconnect the observer.\n * \n * If the element or any ancestor has an explicit `mode` attribute, that creates\n * a \"mode boundary\" - the mode is determined from that point, not from further up.\n * This allows components like le-popover to force default mode for their children.\n * \n * @param el - The component's host element\n * @param callback - Function to call when mode changes, receives the new mode\n * @returns Cleanup function to disconnect the observer\n * \n * @example\n * ```tsx\n * export class MyComponent {\n *   @Element() el: HTMLElement;\n *   @State() adminMode: boolean = false;\n *   private disconnectModeObserver?: () => void;\n * \n *   connectedCallback() {\n *     this.disconnectModeObserver = observeModeChanges(this.el, (mode) => {\n *       this.adminMode = mode === 'admin';\n *     });\n *   }\n * \n *   disconnectedCallback() {\n *     this.disconnectModeObserver?.();\n *   }\n * }\n * ```\n */\nexport function observeModeChanges(\n  el: HTMLElement,\n  callback: (mode: string) => void\n): () => void {\n  // Call immediately with current mode\n  callback(getMode(el));\n\n  // Set up observer for mode attribute changes\n  const observer = new MutationObserver(() => {\n    callback(getMode(el));\n  });\n\n  // Observe the element itself (for mode boundary changes)\n  observer.observe(el, {\n    attributes: true,\n    attributeFilter: ['mode'],\n  });\n\n  // Observe document root\n  observer.observe(document.documentElement, {\n    attributes: true,\n    attributeFilter: ['mode'],\n  });\n\n  // Traverse up, crossing shadow boundaries, and observe each element\n  let current: Node | null = el;\n  while (current) {\n    if (current instanceof Element && current.parentElement) {\n      current = current.parentElement;\n      observer.observe(current, {\n        attributes: true,\n        attributeFilter: ['mode'],\n      });\n      // If this element has an explicit mode, it's a boundary\n      if ((current as Element).hasAttribute('mode')) {\n        break;\n      }\n    } else {\n      // Check if we're in a shadow root\n      const root = current.getRootNode();\n      if (root instanceof ShadowRoot) {\n        // Cross the shadow boundary and observe the host\n        current = root.host;\n        observer.observe(current, {\n          attributes: true,\n          attributeFilter: ['mode'],\n        });\n        // If the host has an explicit mode, it's a boundary\n        if ((current as Element).hasAttribute('mode')) {\n          break;\n        }\n      } else {\n        break;\n      }\n    }\n  }\n\n  // Return cleanup function\n  return () => observer.disconnect();\n}\n\n/**\n * Combines multiple class names into a single string, filtering out falsy values.\n * \n * @param classes - arguments of class names, undefined, arrays, objects with boolean values and nested combinations of these\n * @returns Combined class names string\n */\nexport function classnames(...classes: any[]): string {\n  const result: string[] = [];\n\n  classes.forEach(cls => {\n    if (!cls) return;\n\n    if (typeof cls === 'string') {\n      result.push(cls);\n    } else if (Array.isArray(cls)) {\n      result.push(classnames(...cls));\n    } else if (typeof cls === 'object') {\n      Object.entries(cls).forEach(([key, value]) => {\n        if (value) {\n          result.push(key);\n        }\n      });\n    }\n  });\n\n  return result.join(' ');\n}\n"],"version":3}
+{"file":"utils.js","mappings":"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","names":[],"sources":["src/global/app.ts","src/utils/utils.ts"],"sourcesContent":["import { setMode } from '@stencil/core';\n\nexport type LeKitMode = 'default' | 'admin' | string;\nexport type LeKitTheme = 'default' | 'dark' | string;\n\n/**\n * Global mode initialization for le-kit components.\n *\n * Mode inheritance works as follows:\n * 1. Check the element's own `mode` attribute\n * 2. Traverse up the DOM to find a parent with `mode` attribute\n * 3. Check the document root element (html) for `mode` attribute\n * 4. Fall back to 'default'\n *\n * This allows setting mode at any level:\n * - `<html mode=\"admin\">` - all components in admin mode\n * - `<le-card mode=\"admin\">` - this card and its children in admin mode\n */\nfunction initializeMode() {\n  setMode((el: HTMLElement): LeKitMode => {\n    // 1. Check element's own mode attribute\n    const ownMode = el.getAttribute('mode');\n    if (ownMode) {\n      return ownMode as LeKitMode;\n    }\n\n    // 2. Traverse up the DOM tree to find inherited mode\n    let parent = el.parentElement;\n    while (parent) {\n      const parentMode = parent.getAttribute('mode');\n      if (parentMode) {\n        return parentMode as LeKitMode;\n      }\n      parent = parent.parentElement;\n    }\n\n    // 3. Check document root element\n    const rootMode = document.documentElement.getAttribute('mode');\n    if (rootMode) {\n      return rootMode as LeKitMode;\n    }\n\n    // 4. Default mode\n    return 'default';\n  });\n}\n\n// Default export for Stencil global script\nexport default initializeMode;\n\n/**\n * Helper function to get the current mode for an element.\n * Can be used programmatically in components.\n * \n * This function traverses both regular DOM and shadow DOM boundaries\n * to find the nearest mode attribute.\n */\nexport function getMode(el: HTMLElement): LeKitMode {\n  // Check element's own mode\n  const ownMode = el.getAttribute('mode');\n  if (ownMode) {\n    return ownMode as LeKitMode;\n  }\n\n  // Traverse up DOM, crossing shadow boundaries\n  let current: Node | null = el;\n  while (current) {\n    // Try parent element first\n    if (current instanceof Element && current.parentElement) {\n      current = current.parentElement;\n      const mode = (current as HTMLElement).getAttribute?.('mode');\n      if (mode) {\n        return mode as LeKitMode;\n      }\n    } else {\n      // No parent element - check if we're in a shadow root\n      const root = current.getRootNode();\n      if (root instanceof ShadowRoot) {\n        // Cross the shadow boundary to the host element\n        current = root.host;\n        const mode = (current as HTMLElement).getAttribute?.('mode');\n        if (mode) {\n          return mode as LeKitMode;\n        }\n      } else {\n        // We've reached the document root\n        break;\n      }\n    }\n  }\n\n  // Check document root\n  const rootMode = document.documentElement.getAttribute('mode');\n  if (rootMode) {\n    return rootMode as LeKitMode;\n  }\n\n  return 'default';\n}\n\n/**\n * Helper function to get the current theme for an element.\n * Theme inheritance works the same as mode - cascades through DOM.\n */\nexport function getTheme(el: HTMLElement): LeKitTheme {\n  // Check element's own theme\n  const ownTheme = el.getAttribute('theme');\n  if (ownTheme) {\n    return ownTheme as LeKitTheme;\n  }\n\n  // Traverse up DOM\n  let parent = el.parentElement;\n  while (parent) {\n    const parentTheme = parent.getAttribute('theme');\n    if (parentTheme) {\n      return parentTheme as LeKitTheme;\n    }\n    parent = parent.parentElement;\n  }\n\n  // Check root\n  const rootTheme = document.documentElement.getAttribute('theme');\n  if (rootTheme) {\n    return rootTheme as LeKitTheme;\n  }\n\n  return 'default';\n}\n\n/**\n * Helper function to set mode on the document root.\n * Useful for switching all components to admin mode.\n */\nexport function setGlobalMode(mode: LeKitMode): void {\n  document.documentElement.setAttribute('mode', mode);\n}\n\n/**\n * Helper function to set theme on the document root.\n * Useful for switching all components to a different theme.\n */\nexport function setGlobalTheme(theme: LeKitTheme): void {\n  document.documentElement.setAttribute('theme', theme);\n}\n\n/**\n * Global configuration for le-kit\n */\nlet leKitConfig = {\n  /**\n   * URL to the custom-elements.json manifest.\n   * Used by admin components (le-component, le-slot) to load component metadata.\n   * \n   * Default: '/custom-elements.json' (served from app root)\n   * \n   * For apps using le-kit, you may need to:\n   * 1. Copy the manifest from node_modules/le-kit/custom-elements.json to your public folder\n   * 2. Or set this to point to where the manifest is served\n   */\n  manifestFile: '/custom-elements.json',\n};\n\n/**\n * Configure le-kit global settings.\n * \n * @example\n * ```ts\n * import { configureLeKit } from 'le-kit';\n * \n * configureLeKit({\n *   manifestFile: 'custom-elements.json'\n * });\n * ```\n */\nexport function configureLeKit(config: Partial<typeof leKitConfig>): void {\n  leKitConfig = { ...leKitConfig, ...config };\n}\n\n/**\n * Get the current le-kit configuration.\n */\nexport function getLeKitConfig(): typeof leKitConfig {\n  return leKitConfig;\n}\n","/**\n * Utility functions for le-kit components\n */\n\nimport { getMode } from '../global/app';\n\n/**\n * Generates a unique ID for component instances\n */\nexport function generateId(prefix: string = 'le'): string {\n  return `${prefix}-${Math.random().toString(36).substring(2, 9)}`;\n}\n\n/**\n * Parses a comma-separated string into an array\n */\nexport function parseCommaSeparated(value: string | undefined): string[] {\n  if (!value) return [];\n  return value\n    .split(',')\n    .map(s => s.trim())\n    .filter(Boolean);\n}\n\n/**\n * Checks if a slot has content\n */\nexport function slotHasContent(el: HTMLElement, slotName: string = ''): boolean {\n  const selector = slotName ? `[slot=\"${slotName}\"]` : ':not([slot])';\n  return el.querySelector(selector) !== null;\n}\n\n/**\n * Sets up a MutationObserver to track mode changes on ancestor elements.\n * Returns a cleanup function to disconnect the observer.\n * \n * If the element or any ancestor has an explicit `mode` attribute, that creates\n * a \"mode boundary\" - the mode is determined from that point, not from further up.\n * This allows components like le-popover to force default mode for their children.\n * \n * @param el - The component's host element\n * @param callback - Function to call when mode changes, receives the new mode\n * @returns Cleanup function to disconnect the observer\n * \n * @example\n * ```tsx\n * export class MyComponent {\n *   @Element() el: HTMLElement;\n *   @State() adminMode: boolean = false;\n *   private disconnectModeObserver?: () => void;\n * \n *   connectedCallback() {\n *     this.disconnectModeObserver = observeModeChanges(this.el, (mode) => {\n *       this.adminMode = mode === 'admin';\n *     });\n *   }\n * \n *   disconnectedCallback() {\n *     this.disconnectModeObserver?.();\n *   }\n * }\n * ```\n */\nexport function observeModeChanges(\n  el: HTMLElement,\n  callback: (mode: string) => void\n): () => void {\n  // Call immediately with current mode\n  callback(getMode(el));\n\n  // Set up observer for mode attribute changes\n  const observer = new MutationObserver(() => {\n    callback(getMode(el));\n  });\n\n  // Observe the element itself (for mode boundary changes)\n  observer.observe(el, {\n    attributes: true,\n    attributeFilter: ['mode'],\n  });\n\n  // Observe document root\n  observer.observe(document.documentElement, {\n    attributes: true,\n    attributeFilter: ['mode'],\n  });\n\n  // Traverse up, crossing shadow boundaries, and observe each element\n  let current: Node | null = el;\n  while (current) {\n    if (current instanceof Element && current.parentElement) {\n      current = current.parentElement;\n      observer.observe(current, {\n        attributes: true,\n        attributeFilter: ['mode'],\n      });\n      // If this element has an explicit mode, it's a boundary\n      if ((current as Element).hasAttribute('mode')) {\n        break;\n      }\n    } else {\n      // Check if we're in a shadow root\n      const root = current.getRootNode();\n      if (root instanceof ShadowRoot) {\n        // Cross the shadow boundary and observe the host\n        current = root.host;\n        observer.observe(current, {\n          attributes: true,\n          attributeFilter: ['mode'],\n        });\n        // If the host has an explicit mode, it's a boundary\n        if ((current as Element).hasAttribute('mode')) {\n          break;\n        }\n      } else {\n        break;\n      }\n    }\n  }\n\n  // Return cleanup function\n  return () => observer.disconnect();\n}\n\n/**\n * Combines multiple class names into a single string, filtering out falsy values.\n * \n * @param classes - arguments of class names, undefined, arrays, objects with boolean values and nested combinations of these\n * @returns Combined class names string\n */\nexport function classnames(...classes: any[]): string {\n  const result: string[] = [];\n\n  classes.forEach(cls => {\n    if (!cls) return;\n\n    if (typeof cls === 'string') {\n      result.push(cls);\n    } else if (Array.isArray(cls)) {\n      result.push(classnames(...cls));\n    } else if (typeof cls === 'object') {\n      Object.entries(cls).forEach(([key, value]) => {\n        if (value) {\n          result.push(key);\n        }\n      });\n    }\n  });\n\n  return result.join(' ');\n}\n"],"version":3}