le-kit 0.1.14 → 0.1.16

package/dist/le-kit/dist/components/themes/base.css

@@ -71,10 +71,10 @@
   /* ============================================
    * TRANSITIONS
    * ============================================ */
-  --le-transition-fast: 100ms;
-  --le-transition-normal: 200ms;
-  --le-transition-slow: 300ms;
-  --le-transition-easing: cubic-bezier(0.4, 0, 0.2, 1);
+  --le-transition-fast: 150ms ease;
+  --le-transition-normal: 250ms ease;
+  --le-transition-slow: 400ms ease;
+  --le-transition-bounce: 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
 
   /* ============================================
    * Z-INDEX LAYERS

package/dist/le-kit/dist/components/themes/dark.css

@@ -62,6 +62,7 @@
   /* Surface colors */
   --le-color-surface: #1e1e1e;
   --le-color-surface-elevated: #2d2d2d;
+  --le-color-surface-alt: #334155;
   
   /* Text colors */
   --le-color-text-primary: #ffffff;
@@ -71,6 +72,7 @@
   
   /* Border colors */
   --le-color-border: #333333;
+  --le-color-border-hover: #205e9b;
   --le-color-border-light: #2d2d2d;
   --le-color-border-dark: #444444;
 
@@ -79,7 +81,7 @@
   --le-color-border-input: #515c6b;
 
   /* Focus ring */
-  --le-color-focus: rgba(77, 166, 255, 0.5);
+  --le-color-focus: rgba(77, 166, 255, 0.15);
   
   /* Border radius - same as default */
   --le-radius-none: 0;
@@ -91,6 +93,7 @@
   --le-radius-full: 9999px;
   
   /* Shadows - darker for dark mode */
+  --le-color-shadow: color-mix(in srgb, var(--le-color-primary) 90%, transparent);
   --le-shadow-none: none;
   --le-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
   --le-shadow-md: 0 1px 3px rgba(0, 0, 0, 0.4), 0 1px 2px rgba(0, 0, 0, 0.3);

package/dist/le-kit/dist/components/themes/default.css

@@ -70,6 +70,7 @@
   /* Surface colors (cards, modals, etc.) */
   --le-color-surface: #ffffff;
   --le-color-surface-elevated: #ffffff;
+  --le-color-surface-alt: #e9ebed;
   
   /* Text colors */
   --le-color-text-primary: #212121;
@@ -79,6 +80,7 @@
   
   /* Border colors */
   --le-color-border: #e0e0e0;
+  --le-color-border-hover: #9dd1ff;
   --le-color-border-light: #eeeeee;
   --le-color-border-dark: #bdbdbd;
 
@@ -87,7 +89,7 @@
   --le-color-border-input: #c4d6e6;
   
   /* Focus ring */
-  --le-color-focus: rgba(0, 136, 255, 0.5);
+  --le-color-focus: rgba(0, 136, 255, 0.15);
   
   /* Border radius */
   --le-radius-none: 0;
@@ -99,6 +101,7 @@
   --le-radius-full: 9999px;
   
   /* Shadows */
+  --le-color-shadow: color-mix(in srgb, var(--le-color-primary) 80%, transparent);
   --le-shadow-none: none;
   --le-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
   --le-shadow-md: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.06);

package/dist/le-kit/dist/components/themes/gradient.css

@@ -62,6 +62,7 @@
   /* Surface colors */
   --le-color-surface: rgba(255, 255, 255, 0.95);
   --le-color-surface-elevated: #ffffff;
+  --le-color-surface-alt: #e5def5;
   
   /* Text colors */
   --le-color-text-primary: #1f2937;
@@ -71,6 +72,7 @@
   
   /* Border colors */
   --le-color-border: rgba(139, 92, 246, 0.3);
+  --le-color-border-hover: rgba(172, 140, 246, 0.4);
   --le-color-border-light: rgba(139, 92, 246, 0.1);
   --le-color-border-dark: rgba(139, 92, 246, 0.5);
 
@@ -79,7 +81,7 @@
   --le-color-border-input: #eccddd;
   
   /* Focus ring */
-  --le-color-focus: rgba(139, 92, 246, 0.5);
+  --le-color-focus: rgba(139, 92, 246, 0.15);
   
   /* Border radius - more rounded */
   --le-radius-none: 0;
@@ -91,6 +93,7 @@
   --le-radius-full: 9999px;
   
   /* Shadows - purple 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(139, 92, 246, 0.1);
   --le-shadow-md: 0 4px 6px rgba(139, 92, 246, 0.15), 0 2px 4px rgba(139, 92, 246, 0.1);

package/dist/le-kit/dist/components/themes/index.css

@@ -35,6 +35,7 @@
   --le-font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
   --le-font-family-mono: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, monospace;
   
+  --le-font-size-2xs: 0.625rem;
   --le-font-size-xs: 0.75rem;
   --le-font-size-sm: 0.875rem;
   --le-font-size-md: 1rem;
@@ -69,345 +70,7 @@
   --le-z-tooltip: 1070;
 }
 
-/* ============================================
-   DEFAULT THEME
-   Clean, professional light theme
-   ============================================ */
-
-:root,
-[theme="default"] {
-  /* Primary Colors */
-  --le-color-primary: #3b82f6;
-  --le-color-primary-hover: #2563eb;
-  --le-color-primary-active: #1d4ed8;
-  --le-color-primary-subtle: #eff6ff;
-  --le-color-on-primary: #ffffff;
-
-  /* Secondary Colors */
-  --le-color-secondary: #64748b;
-  --le-color-secondary-hover: #475569;
-  --le-color-secondary-active: #334155;
-  --le-color-secondary-subtle: #f1f5f9;
-  --le-color-on-secondary: #ffffff;
-
-  /* Semantic Colors */
-  --le-color-success: #22c55e;
-  --le-color-success-subtle: #f0fdf4;
-  --le-color-on-success: #ffffff;
-
-  --le-color-warning: #f59e0b;
-  --le-color-warning-subtle: #fffbeb;
-  --le-color-on-warning: #000000;
-
-  --le-color-error: #ef4444;
-  --le-color-error-subtle: #fef2f2;
-  --le-color-on-error: #ffffff;
-
-  --le-color-info: #06b6d4;
-  --le-color-info-subtle: #ecfeff;
-  --le-color-on-info: #ffffff;
-
-  /* Surface Colors */
-  --le-color-background: #ffffff;
-  --le-color-surface: #ffffff;
-  --le-color-surface-raised: #ffffff;
-  --le-color-surface-overlay: rgba(0, 0, 0, 0.5);
-
-  /* Text Colors */
-  --le-color-text: #1e293b;
-  --le-color-text-secondary: #64748b;
-  --le-color-text-muted: #94a3b8;
-  --le-color-text-inverse: #ffffff;
-
-  /* Border Colors */
-  --le-color-border: #e2e8f0;
-  --le-color-border-strong: #cbd5e1;
-  --le-color-border-focus: var(--le-color-primary);
-
-  /* Border Radius */
-  --le-radius-none: 0;
-  --le-radius-sm: 4px;
-  --le-radius-md: 7px;
-  --le-radius-lg: 12px;
-  --le-radius-xl: 16px;
-  --le-radius-2xl: 24px;
-  --le-radius-full: 9999px;
-
-  /* Shadows */
-  --le-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
-  --le-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
-  --le-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
-  --le-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
-  --le-shadow-focus: 0 0 0 3px rgba(59, 130, 246, 0.3);
-}
-
-/* ============================================
-   DARK THEME
-   Modern dark mode with blue accents
-   ============================================ */
-
-[theme="dark"] {
-  /* Primary Colors */
-  --le-color-primary: #60a5fa;
-  --le-color-primary-hover: #93c5fd;
-  --le-color-primary-active: #3b82f6;
-  --le-color-primary-subtle: #1e3a5f;
-  --le-color-on-primary: #0f172a;
-
-  /* Secondary Colors */
-  --le-color-secondary: #94a3b8;
-  --le-color-secondary-hover: #cbd5e1;
-  --le-color-secondary-active: #64748b;
-  --le-color-secondary-subtle: #1e293b;
-  --le-color-on-secondary: #0f172a;
-
-  /* Semantic Colors */
-  --le-color-success: #4ade80;
-  --le-color-success-subtle: #14532d;
-  --le-color-on-success: #0f172a;
-
-  --le-color-warning: #fbbf24;
-  --le-color-warning-subtle: #422006;
-  --le-color-on-warning: #0f172a;
-
-  --le-color-error: #f87171;
-  --le-color-error-subtle: #450a0a;
-  --le-color-on-error: #0f172a;
-
-  --le-color-info: #22d3ee;
-  --le-color-info-subtle: #164e63;
-  --le-color-on-info: #0f172a;
-
-  /* Surface Colors */
-  --le-color-background: #0f172a;
-  --le-color-surface: #1e293b;
-  --le-color-surface-raised: #334155;
-  --le-color-surface-overlay: rgba(0, 0, 0, 0.7);
-
-  /* Text Colors */
-  --le-color-text: #f1f5f9;
-  --le-color-text-secondary: #94a3b8;
-  --le-color-text-muted: #64748b;
-  --le-color-text-inverse: #0f172a;
-
-  /* Border Colors */
-  --le-color-border: #334155;
-  --le-color-border-strong: #475569;
-  --le-color-border-focus: var(--le-color-primary);
-
-  /* Shadows (adjusted for dark mode) */
-  --le-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
-  --le-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4), 0 2px 4px -2px rgba(0, 0, 0, 0.3);
-  --le-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.4), 0 4px 6px -4px rgba(0, 0, 0, 0.3);
-  --le-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.5), 0 8px 10px -6px rgba(0, 0, 0, 0.4);
-  --le-shadow-focus: 0 0 0 3px rgba(96, 165, 250, 0.4);
-}
-
-/* ============================================
-   GRADIENT THEME
-   Vibrant gradients with purple/pink accents
-   ============================================ */
-
-[theme="gradient"] {
-  /* Primary Colors - Purple gradient feel */
-  --le-color-primary: #8b5cf6;
-  --le-color-primary-hover: #a78bfa;
-  --le-color-primary-active: #7c3aed;
-  --le-color-primary-subtle: #f5f3ff;
-  --le-color-on-primary: #ffffff;
-
-  /* Secondary Colors - Pink accent */
-  --le-color-secondary: #ec4899;
-  --le-color-secondary-hover: #f472b6;
-  --le-color-secondary-active: #db2777;
-  --le-color-secondary-subtle: #fdf2f8;
-  --le-color-on-secondary: #ffffff;
-
-  /* Semantic Colors */
-  --le-color-success: #10b981;
-  --le-color-success-subtle: #ecfdf5;
-  --le-color-on-success: #ffffff;
-
-  --le-color-warning: #f59e0b;
-  --le-color-warning-subtle: #fffbeb;
-  --le-color-on-warning: #000000;
-
-  --le-color-error: #f43f5e;
-  --le-color-error-subtle: #fff1f2;
-  --le-color-on-error: #ffffff;
-
-  --le-color-info: #06b6d4;
-  --le-color-info-subtle: #ecfeff;
-  --le-color-on-info: #ffffff;
-
-  /* Surface Colors */
-  --le-color-background: linear-gradient(135deg, #faf5ff 0%, #fdf2f8 50%, #fff7ed 100%);
-  --le-color-surface: rgba(255, 255, 255, 0.9);
-  --le-color-surface-raised: #ffffff;
-  --le-color-surface-overlay: rgba(139, 92, 246, 0.3);
-
-  /* Text Colors */
-  --le-color-text: #1f2937;
-  --le-color-text-secondary: #6b7280;
-  --le-color-text-muted: #9ca3af;
-  --le-color-text-inverse: #ffffff;
-
-  /* Border Colors */
-  --le-color-border: rgba(139, 92, 246, 0.2);
-  --le-color-border-strong: rgba(139, 92, 246, 0.4);
-  --le-color-border-focus: var(--le-color-primary);
-
-  /* Border Radius - More rounded for playful feel */
-  --le-radius-sm: 6px;
-  --le-radius-md: 12px;
-  --le-radius-lg: 16px;
-  --le-radius-xl: 20px;
-  --le-radius-2xl: 28px;
-
-  /* Shadows - Colored shadows */
-  --le-shadow-sm: 0 1px 3px 0 rgba(139, 92, 246, 0.1);
-  --le-shadow-md: 0 4px 6px -1px rgba(139, 92, 246, 0.15), 0 2px 4px -2px rgba(236, 72, 153, 0.1);
-  --le-shadow-lg: 0 10px 15px -3px rgba(139, 92, 246, 0.2), 0 4px 6px -4px rgba(236, 72, 153, 0.15);
-  --le-shadow-xl: 0 20px 25px -5px rgba(139, 92, 246, 0.25), 0 8px 10px -6px rgba(236, 72, 153, 0.2);
-  --le-shadow-focus: 0 0 0 3px rgba(139, 92, 246, 0.4);
-}
-
-/* ============================================
-   MINIMAL THEME
-   Clean, minimal design with subtle grays
-   ============================================ */
-
-[theme="minimal"] {
-  /* Primary Colors - Subtle dark gray */
-  --le-color-primary: #374151;
-  --le-color-primary-hover: #1f2937;
-  --le-color-primary-active: #111827;
-  --le-color-primary-subtle: #f3f4f6;
-  --le-color-on-primary: #ffffff;
-
-  /* Secondary Colors - Light gray */
-  --le-color-secondary: #9ca3af;
-  --le-color-secondary-hover: #6b7280;
-  --le-color-secondary-active: #4b5563;
-  --le-color-secondary-subtle: #f9fafb;
-  --le-color-on-secondary: #ffffff;
-
-  /* Semantic Colors - Muted versions */
-  --le-color-success: #059669;
-  --le-color-success-subtle: #f0fdf4;
-  --le-color-on-success: #ffffff;
-
-  --le-color-warning: #d97706;
-  --le-color-warning-subtle: #fffbeb;
-  --le-color-on-warning: #ffffff;
-
-  --le-color-error: #dc2626;
-  --le-color-error-subtle: #fef2f2;
-  --le-color-on-error: #ffffff;
-
-  --le-color-info: #0891b2;
-  --le-color-info-subtle: #ecfeff;
-  --le-color-on-info: #ffffff;
-
-  /* Surface Colors */
-  --le-color-background: #fafafa;
-  --le-color-surface: #ffffff;
-  --le-color-surface-raised: #ffffff;
-  --le-color-surface-overlay: rgba(0, 0, 0, 0.4);
-
-  /* Text Colors */
-  --le-color-text: #111827;
-  --le-color-text-secondary: #6b7280;
-  --le-color-text-muted: #9ca3af;
-  --le-color-text-inverse: #ffffff;
-
-  /* Border Colors - Very subtle */
-  --le-color-border: #e5e7eb;
-  --le-color-border-strong: #d1d5db;
-  --le-color-border-focus: var(--le-color-primary);
-
-  /* Border Radius - Sharp, minimal */
-  --le-radius-none: 0;
-  --le-radius-sm: 2px;
-  --le-radius-md: 4px;
-  --le-radius-lg: 6px;
-  --le-radius-xl: 8px;
-  --le-radius-2xl: 12px;
-  --le-radius-full: 9999px;
-
-  /* Shadows - Minimal, subtle */
-  --le-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.03);
-  --le-shadow-md: 0 2px 4px -1px rgba(0, 0, 0, 0.06);
-  --le-shadow-lg: 0 4px 8px -2px rgba(0, 0, 0, 0.08);
-  --le-shadow-xl: 0 8px 16px -4px rgba(0, 0, 0, 0.1);
-  --le-shadow-focus: 0 0 0 2px rgba(55, 65, 81, 0.2);
-}
-
-/* ============================================
-   WARM THEME
-   Warm earthy tones with orange/amber accents
-   ============================================ */
-
-[theme="warm"] {
-  /* Primary Colors - Warm orange */
-  --le-color-primary: #ea580c;
-  --le-color-primary-hover: #f97316;
-  --le-color-primary-active: #c2410c;
-  --le-color-primary-subtle: #fff7ed;
-  --le-color-on-primary: #ffffff;
-
-  /* Secondary Colors - Warm brown */
-  --le-color-secondary: #78716c;
-  --le-color-secondary-hover: #57534e;
-  --le-color-secondary-active: #44403c;
-  --le-color-secondary-subtle: #fafaf9;
-  --le-color-on-secondary: #ffffff;
-
-  /* Semantic Colors */
-  --le-color-success: #65a30d;
-  --le-color-success-subtle: #f7fee7;
-  --le-color-on-success: #ffffff;
-
-  --le-color-warning: #d97706;
-  --le-color-warning-subtle: #fffbeb;
-  --le-color-on-warning: #000000;
-
-  --le-color-error: #dc2626;
-  --le-color-error-subtle: #fef2f2;
-  --le-color-on-error: #ffffff;
-
-  --le-color-info: #0891b2;
-  --le-color-info-subtle: #ecfeff;
-  --le-color-on-info: #ffffff;
-
-  /* Surface Colors - Warm tinted */
-  --le-color-background: #fffbf5;
-  --le-color-surface: #ffffff;
-  --le-color-surface-raised: #ffffff;
-  --le-color-surface-overlay: rgba(120, 53, 15, 0.4);
-
-  /* Text Colors - Warm grays */
-  --le-color-text: #292524;
-  --le-color-text-secondary: #78716c;
-  --le-color-text-muted: #a8a29e;
-  --le-color-text-inverse: #ffffff;
-
-  /* Border Colors - Warm tinted */
-  --le-color-border: #e7e5e4;
-  --le-color-border-strong: #d6d3d1;
-  --le-color-border-focus: var(--le-color-primary);
-
-  /* Border Radius - Soft, friendly */
-  --le-radius-sm: 4px;
-  --le-radius-md: 8px;
-  --le-radius-lg: 12px;
-  --le-radius-xl: 16px;
-  --le-radius-2xl: 24px;
-
-  /* Shadows - Warm tinted */
-  --le-shadow-sm: 0 1px 2px 0 rgba(120, 53, 15, 0.05);
-  --le-shadow-md: 0 4px 6px -1px rgba(120, 53, 15, 0.1), 0 2px 4px -2px rgba(120, 53, 15, 0.08);
-  --le-shadow-lg: 0 10px 15px -3px rgba(120, 53, 15, 0.12), 0 4px 6px -4px rgba(120, 53, 15, 0.1);
-  --le-shadow-xl: 0 20px 25px -5px rgba(120, 53, 15, 0.15), 0 8px 10px -6px rgba(120, 53, 15, 0.12);
-  --le-shadow-focus: 0 0 0 3px rgba(234, 88, 12, 0.3);
+/* Utility class to hide elements when header is shrunk */
+.header-is-shrunk .hidden-on-shrink {
+  display: none;
 }

package/dist/le-kit/dist/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/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/le-kit/index.esm.js

@@ -1,116 +1,2 @@
-export { g as generateId, p as parseCommaSeparated, s as slotHasContent } from './utils-cwSNy7ZS.js';
-export { h as configureLeKit, i as getLeKitConfig, a as getMode, e as getTheme, d as setGlobalMode, f as setGlobalTheme } from './index-CAY3Hk_i.js';
-
-/**
- * Programmatic API for le-popup component
- *
- * These functions allow you to show popups without manually creating elements.
- *
- * @example
- * // Alert
- * await leAlert('Something happened!');
- *
- * // Confirm
- * const confirmed = await leConfirm('Are you sure?');
- * if (confirmed) { ... }
- *
- * // Prompt
- * const name = await lePrompt('What is your name?');
- * if (name !== null) { ... }
- */
-/**
- * Show an alert popup with a message
- * @param message - The message to display
- * @param options - Optional configuration
- * @returns Promise that resolves when closed
- *
- * @example
- * await leAlert('File saved successfully!');
- * await leAlert('Error occurred', { title: 'Error', theme: 'dark' });
- */
-async function leAlert(message, options = {}) {
-    const popup = createPopupElement(message, { ...options, type: 'alert' });
-    document.body.appendChild(popup);
-    await popup.show();
-    popup.remove();
-}
-/**
- * Show a confirm popup with OK/Cancel buttons
- * @param message - The message to display
- * @param options - Optional configuration
- * @returns Promise that resolves to true (confirmed) or false (cancelled)
- *
- * @example
- * const confirmed = await leConfirm('Delete this item?');
- * if (confirmed) {
- *   deleteItem();
- * }
- */
-async function leConfirm(message, options = {}) {
-    const popup = createPopupElement(message, { ...options, type: 'confirm' });
-    document.body.appendChild(popup);
-    const result = await popup.show();
-    popup.remove();
-    return result.confirmed;
-}
-/**
- * Show a prompt popup with an input field
- * @param message - The message to display
- * @param options - Optional configuration (including defaultValue, placeholder)
- * @returns Promise that resolves to the input value or null if cancelled
- *
- * @example
- * const name = await lePrompt('Enter your name:', {
- *   title: 'Welcome',
- *   placeholder: 'John Doe',
- *   defaultValue: 'Guest'
- * });
- * if (name !== null) {
- *   greetUser(name);
- * }
- */
-async function lePrompt(message, options = {}) {
-    const popup = createPopupElement(message, { ...options, type: 'prompt' });
-    document.body.appendChild(popup);
-    const result = await popup.show();
-    popup.remove();
-    return result.confirmed ? (result.value ?? '') : null;
-}
-/**
- * Create a popup element with the given configuration
- */
-function createPopupElement(message, options) {
-    const popup = document.createElement('le-popup');
-    popup.message = message;
-    popup.type = options.type || 'alert';
-    if (options.title)
-        popup.popupTitle = options.title;
-    if (options.modal !== undefined)
-        popup.modal = options.modal;
-    if (options.position)
-        popup.position = options.position;
-    if (options.confirmText)
-        popup.confirmText = options.confirmText;
-    if (options.cancelText)
-        popup.cancelText = options.cancelText;
-    if (options.placeholder)
-        popup.placeholder = options.placeholder;
-    if (options.defaultValue)
-        popup.defaultValue = options.defaultValue;
-    if (options.theme)
-        popup.setAttribute('theme', options.theme);
-    return popup;
-}
-
-/**
- * @fileoverview Entry point for le-kit component library
- *
- * This file exports utilities, types, and helper functions.
- * Components are auto-registered and available as custom elements.
- *
- * @see README.md for usage instructions
- */
-// Utility exports
-
-export { leAlert, leConfirm, lePrompt };
-//# sourceMappingURL=index.esm.js.map
+export{g as generateId,p as parseCommaSeparated,s as slotHasContent}from"./p-txKmCJHv.js";export{l as configureLeKit,f as getLeKitConfig,a as getMode,j as getTheme,i as setGlobalMode,k as setGlobalTheme}from"./p-hmBwv43R.js";async function t(t,e={}){const n=o(t,{...e,type:"alert"});document.body.appendChild(n);await n.show();n.remove()}async function e(t,e={}){const n=o(t,{...e,type:"confirm"});document.body.appendChild(n);const a=await n.show();n.remove();return a.confirmed}async function n(t,e={}){const n=o(t,{...e,type:"prompt"});document.body.appendChild(n);const a=await n.show();n.remove();return a.confirmed?a.value??"":null}function o(t,e){const n=document.createElement("le-popup");n.message=t;n.type=e.type||"alert";n.mode="default";if(e.title)n.popupTitle=e.title;if(e.modal!==undefined)n.modal=e.modal;if(e.position)n.position=e.position;if(e.confirmText)n.confirmText=e.confirmText;if(e.cancelText)n.cancelText=e.cancelText;if(e.placeholder)n.placeholder=e.placeholder;if(e.defaultValue)n.defaultValue=e.defaultValue;if(e.theme)n.setAttribute("theme",e.theme);return n}export{t as leAlert,e as leConfirm,n as lePrompt};
+//# sourceMappingURL=index.esm.js.map

package/dist/le-kit/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["src/components/le-popup/le-popup.api.ts","src/index.ts"],"sourcesContent":["/**\n * Programmatic API for le-popup component\n * \n * These functions allow you to show popups without manually creating elements.\n * \n * @example\n * // Alert\n * await leAlert('Something happened!');\n * \n * // Confirm\n * const confirmed = await leConfirm('Are you sure?');\n * if (confirmed) { ... }\n * \n * // Prompt\n * const name = await lePrompt('What is your name?');\n * if (name !== null) { ... }\n */\n\nimport type { PopupType, PopupPosition, PopupResult } from './le-popup';\n\n/**\n * Options for programmatic popup functions\n */\nexport interface PopupOptions {\n  title?: string;\n  type?: PopupType;\n  modal?: boolean;\n  position?: PopupPosition;\n  confirmText?: string;\n  cancelText?: string;\n  placeholder?: string;\n  defaultValue?: string;\n  theme?: string;\n}\n\n/**\n * Interface for the le-popup custom element\n */\ninterface HTMLLePopupElement extends HTMLElement {\n  open: boolean;\n  type: PopupType;\n  popupTitle?: string;\n  message?: string;\n  modal: boolean;\n  position: PopupPosition;\n  confirmText: string;\n  cancelText: string;\n  placeholder: string;\n  defaultValue: string;\n  show(): Promise<PopupResult>;\n  hide(confirmed?: boolean): Promise<void>;\n}\n\n/**\n * Show an alert popup with a message\n * @param message - The message to display\n * @param options - Optional configuration\n * @returns Promise that resolves when closed\n * \n * @example\n * await leAlert('File saved successfully!');\n * await leAlert('Error occurred', { title: 'Error', theme: 'dark' });\n */\nexport async function leAlert(message: string, options: PopupOptions = {}): Promise<void> {\n  const popup = createPopupElement(message, { ...options, type: 'alert' });\n  document.body.appendChild(popup);\n  \n  await popup.show();\n  popup.remove();\n}\n\n/**\n * Show a confirm popup with OK/Cancel buttons\n * @param message - The message to display\n * @param options - Optional configuration\n * @returns Promise that resolves to true (confirmed) or false (cancelled)\n * \n * @example\n * const confirmed = await leConfirm('Delete this item?');\n * if (confirmed) {\n *   deleteItem();\n * }\n */\nexport async function leConfirm(message: string, options: PopupOptions = {}): Promise<boolean> {\n  const popup = createPopupElement(message, { ...options, type: 'confirm' });\n  document.body.appendChild(popup);\n  \n  const result = await popup.show();\n  popup.remove();\n  \n  return result.confirmed;\n}\n\n/**\n * Show a prompt popup with an input field\n * @param message - The message to display\n * @param options - Optional configuration (including defaultValue, placeholder)\n * @returns Promise that resolves to the input value or null if cancelled\n * \n * @example\n * const name = await lePrompt('Enter your name:', { \n *   title: 'Welcome',\n *   placeholder: 'John Doe',\n *   defaultValue: 'Guest'\n * });\n * if (name !== null) {\n *   greetUser(name);\n * }\n */\nexport async function lePrompt(message: string, options: PopupOptions = {}): Promise<string | null> {\n  const popup = createPopupElement(message, { ...options, type: 'prompt' });\n  document.body.appendChild(popup);\n  \n  const result = await popup.show();\n  popup.remove();\n  \n  return result.confirmed ? (result.value ?? '') : null;\n}\n\n/**\n * Create a popup element with the given configuration\n */\nfunction createPopupElement(message: string, options: PopupOptions): HTMLLePopupElement {\n  const popup = document.createElement('le-popup') as HTMLLePopupElement;\n  \n  popup.message = message;\n  popup.type = options.type || 'alert';\n  \n  if (options.title) popup.popupTitle = options.title;\n  if (options.modal !== undefined) popup.modal = options.modal;\n  if (options.position) popup.position = options.position;\n  if (options.confirmText) popup.confirmText = options.confirmText;\n  if (options.cancelText) popup.cancelText = options.cancelText;\n  if (options.placeholder) popup.placeholder = options.placeholder;\n  if (options.defaultValue) popup.defaultValue = options.defaultValue;\n  if (options.theme) popup.setAttribute('theme', options.theme);\n  \n  return popup;\n}\n","/**\n * @fileoverview Entry point for le-kit component library\n *\n * This file exports utilities, types, and helper functions.\n * Components are auto-registered and available as custom elements.\n *\n * @see README.md for usage instructions\n */\n\n// Utility exports\nexport { generateId, parseCommaSeparated, slotHasContent } from './utils/utils';\n\n// Global mode and theme helpers\nexport { getMode, setGlobalMode, getTheme, setGlobalTheme, configureLeKit, getLeKitConfig } from './global/app';\nexport type { LeKitMode, LeKitTheme } from './global/app';\n\n// Popup/dialog programmatic API\nexport { leAlert, leConfirm, lePrompt } from './components/le-popup/le-popup.api';\nexport type { PopupOptions } from './components/le-popup/le-popup.api';\nexport type { PopupResult, PopupType, PopupPosition } from './components/le-popup/le-popup';\n\n// Type exports\nexport type * from './components.d.ts';\n"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;AAgBG;AAqCH;;;;;;;;;AASG;AACI,eAAe,OAAO,CAAC,OAAe,EAAE,UAAwB,EAAE,EAAA;AACvE,IAAA,MAAM,KAAK,GAAG,kBAAkB,CAAC,OAAO,EAAE,EAAE,GAAG,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;AACxE,IAAA,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;AAEhC,IAAA,MAAM,KAAK,CAAC,IAAI,EAAE;IAClB,KAAK,CAAC,MAAM,EAAE;AAChB;AAEA;;;;;;;;;;;AAWG;AACI,eAAe,SAAS,CAAC,OAAe,EAAE,UAAwB,EAAE,EAAA;AACzE,IAAA,MAAM,KAAK,GAAG,kBAAkB,CAAC,OAAO,EAAE,EAAE,GAAG,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;AAC1E,IAAA,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;AAEhC,IAAA,MAAM,MAAM,GAAG,MAAM,KAAK,CAAC,IAAI,EAAE;IACjC,KAAK,CAAC,MAAM,EAAE;IAEd,OAAO,MAAM,CAAC,SAAS;AACzB;AAEA;;;;;;;;;;;;;;;AAeG;AACI,eAAe,QAAQ,CAAC,OAAe,EAAE,UAAwB,EAAE,EAAA;AACxE,IAAA,MAAM,KAAK,GAAG,kBAAkB,CAAC,OAAO,EAAE,EAAE,GAAG,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;AACzE,IAAA,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;AAEhC,IAAA,MAAM,MAAM,GAAG,MAAM,KAAK,CAAC,IAAI,EAAE;IACjC,KAAK,CAAC,MAAM,EAAE;AAEd,IAAA,OAAO,MAAM,CAAC,SAAS,IAAI,MAAM,CAAC,KAAK,IAAI,EAAE,IAAI,IAAI;AACvD;AAEA;;AAEG;AACH,SAAS,kBAAkB,CAAC,OAAe,EAAE,OAAqB,EAAA;IAChE,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAuB;AAEtE,IAAA,KAAK,CAAC,OAAO,GAAG,OAAO;IACvB,KAAK,CAAC,IAAI,GAAG,OAAO,CAAC,IAAI,IAAI,OAAO;IAEpC,IAAI,OAAO,CAAC,KAAK;AAAE,QAAA,KAAK,CAAC,UAAU,GAAG,OAAO,CAAC,KAAK;AACnD,IAAA,IAAI,OAAO,CAAC,KAAK,KAAK,SAAS;AAAE,QAAA,KAAK,CAAC,KAAK,GAAG,OAAO,CAAC,KAAK;IAC5D,IAAI,OAAO,CAAC,QAAQ;AAAE,QAAA,KAAK,CAAC,QAAQ,GAAG,OAAO,CAAC,QAAQ;IACvD,IAAI,OAAO,CAAC,WAAW;AAAE,QAAA,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW;IAChE,IAAI,OAAO,CAAC,UAAU;AAAE,QAAA,KAAK,CAAC,UAAU,GAAG,OAAO,CAAC,UAAU;IAC7D,IAAI,OAAO,CAAC,WAAW;AAAE,QAAA,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW;IAChE,IAAI,OAAO,CAAC,YAAY;AAAE,QAAA,KAAK,CAAC,YAAY,GAAG,OAAO,CAAC,YAAY;IACnE,IAAI,OAAO,CAAC,KAAK;QAAE,KAAK,CAAC,YAAY,CAAC,OAAO,EAAE,OAAO,CAAC,KAAK,CAAC;AAE7D,IAAA,OAAO,KAAK;AACd;;AC1IA;;;;;;;AAOG;AAEH;;;;"}
+{"version":3,"file":"index.esm.js","sources":["src/components/le-popup/le-popup.api.ts"],"sourcesContent":["/**\n * Programmatic API for le-popup component\n *\n * These functions allow you to show popups without manually creating elements.\n *\n * @example\n * // Alert\n * await leAlert('Something happened!');\n *\n * // Confirm\n * const confirmed = await leConfirm('Are you sure?');\n * if (confirmed) { ... }\n *\n * // Prompt\n * const name = await lePrompt('What is your name?');\n * if (name !== null) { ... }\n */\n\nimport { LeKitMode } from '../..';\nimport type { PopupType, PopupPosition, PopupResult } from './le-popup';\n\n/**\n * Options for programmatic popup functions\n */\nexport interface PopupOptions {\n  title?: string;\n  type?: PopupType;\n  modal?: boolean;\n  position?: PopupPosition;\n  confirmText?: string;\n  cancelText?: string;\n  placeholder?: string;\n  defaultValue?: string;\n  theme?: string;\n}\n\n/**\n * Interface for the le-popup custom element\n */\ninterface HTMLLePopupElement extends HTMLElement {\n  open: boolean;\n  type: PopupType;\n  mode: LeKitMode;\n  popupTitle?: string;\n  message?: string;\n  modal: boolean;\n  position: PopupPosition;\n  confirmText: string;\n  cancelText: string;\n  placeholder: string;\n  defaultValue: string;\n  show(): Promise<PopupResult>;\n  hide(confirmed?: boolean): Promise<void>;\n}\n\n/**\n * Show an alert popup with a message\n * @param message - The message to display\n * @param options - Optional configuration\n * @returns Promise that resolves when closed\n *\n * @example\n * await leAlert('File saved successfully!');\n * await leAlert('Error occurred', { title: 'Error', theme: 'dark' });\n */\nexport async function leAlert(message: string, options: PopupOptions = {}): Promise<void> {\n  const popup = createPopupElement(message, { ...options, type: 'alert' });\n  document.body.appendChild(popup);\n\n  await popup.show();\n  popup.remove();\n}\n\n/**\n * Show a confirm popup with OK/Cancel buttons\n * @param message - The message to display\n * @param options - Optional configuration\n * @returns Promise that resolves to true (confirmed) or false (cancelled)\n *\n * @example\n * const confirmed = await leConfirm('Delete this item?');\n * if (confirmed) {\n *   deleteItem();\n * }\n */\nexport async function leConfirm(message: string, options: PopupOptions = {}): Promise<boolean> {\n  const popup = createPopupElement(message, { ...options, type: 'confirm' });\n  document.body.appendChild(popup);\n\n  const result = await popup.show();\n  popup.remove();\n\n  return result.confirmed;\n}\n\n/**\n * Show a prompt popup with an input field\n * @param message - The message to display\n * @param options - Optional configuration (including defaultValue, placeholder)\n * @returns Promise that resolves to the input value or null if cancelled\n *\n * @example\n * const name = await lePrompt('Enter your name:', {\n *   title: 'Welcome',\n *   placeholder: 'John Doe',\n *   defaultValue: 'Guest'\n * });\n * if (name !== null) {\n *   greetUser(name);\n * }\n */\nexport async function lePrompt(\n  message: string,\n  options: PopupOptions = {},\n): Promise<string | null> {\n  const popup = createPopupElement(message, { ...options, type: 'prompt' });\n  document.body.appendChild(popup);\n\n  const result = await popup.show();\n  popup.remove();\n\n  return result.confirmed ? result.value ?? '' : null;\n}\n\n/**\n * Create a popup element with the given configuration\n */\nfunction createPopupElement(message: string, options: PopupOptions): HTMLLePopupElement {\n  const popup = document.createElement('le-popup') as HTMLLePopupElement;\n\n  popup.message = message;\n  popup.type = options.type || 'alert';\n  popup.mode = 'default';\n\n  if (options.title) popup.popupTitle = options.title;\n  if (options.modal !== undefined) popup.modal = options.modal;\n  if (options.position) popup.position = options.position;\n  if (options.confirmText) popup.confirmText = options.confirmText;\n  if (options.cancelText) popup.cancelText = options.cancelText;\n  if (options.placeholder) popup.placeholder = options.placeholder;\n  if (options.defaultValue) popup.defaultValue = options.defaultValue;\n  if (options.theme) popup.setAttribute('theme', options.theme);\n\n  return popup;\n}\n"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;AAgBG;AAuCH;;;;;;;;;AASG;AACI,eAAe,OAAO,CAAC,OAAe,EAAE,UAAwB,EAAE,EAAA;AACvE,IAAA,MAAM,KAAK,GAAG,kBAAkB,CAAC,OAAO,EAAE,EAAE,GAAG,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;AACxE,IAAA,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;AAEhC,IAAA,MAAM,KAAK,CAAC,IAAI,EAAE;IAClB,KAAK,CAAC,MAAM,EAAE;AAChB;AAEA;;;;;;;;;;;AAWG;AACI,eAAe,SAAS,CAAC,OAAe,EAAE,UAAwB,EAAE,EAAA;AACzE,IAAA,MAAM,KAAK,GAAG,kBAAkB,CAAC,OAAO,EAAE,EAAE,GAAG,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;AAC1E,IAAA,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;AAEhC,IAAA,MAAM,MAAM,GAAG,MAAM,KAAK,CAAC,IAAI,EAAE;IACjC,KAAK,CAAC,MAAM,EAAE;IAEd,OAAO,MAAM,CAAC,SAAS;AACzB;AAEA;;;;;;;;;;;;;;;AAeG;AACI,eAAe,QAAQ,CAC5B,OAAe,EACf,UAAwB,EAAE,EAAA;AAE1B,IAAA,MAAM,KAAK,GAAG,kBAAkB,CAAC,OAAO,EAAE,EAAE,GAAG,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;AACzE,IAAA,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;AAEhC,IAAA,MAAM,MAAM,GAAG,MAAM,KAAK,CAAC,IAAI,EAAE;IACjC,KAAK,CAAC,MAAM,EAAE;AAEd,IAAA,OAAO,MAAM,CAAC,SAAS,GAAG,MAAM,CAAC,KAAK,IAAI,EAAE,GAAG,IAAI;AACrD;AAEA;;AAEG;AACH,SAAS,kBAAkB,CAAC,OAAe,EAAE,OAAqB,EAAA;IAChE,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAuB;AAEtE,IAAA,KAAK,CAAC,OAAO,GAAG,OAAO;IACvB,KAAK,CAAC,IAAI,GAAG,OAAO,CAAC,IAAI,IAAI,OAAO;AACpC,IAAA,KAAK,CAAC,IAAI,GAAG,SAAS;IAEtB,IAAI,OAAO,CAAC,KAAK;AAAE,QAAA,KAAK,CAAC,UAAU,GAAG,OAAO,CAAC,KAAK;AACnD,IAAA,IAAI,OAAO,CAAC,KAAK,KAAK,SAAS;AAAE,QAAA,KAAK,CAAC,KAAK,GAAG,OAAO,CAAC,KAAK;IAC5D,IAAI,OAAO,CAAC,QAAQ;AAAE,QAAA,KAAK,CAAC,QAAQ,GAAG,OAAO,CAAC,QAAQ;IACvD,IAAI,OAAO,CAAC,WAAW;AAAE,QAAA,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW;IAChE,IAAI,OAAO,CAAC,UAAU;AAAE,QAAA,KAAK,CAAC,UAAU,GAAG,OAAO,CAAC,UAAU;IAC7D,IAAI,OAAO,CAAC,WAAW;AAAE,QAAA,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW;IAChE,IAAI,OAAO,CAAC,YAAY;AAAE,QAAA,KAAK,CAAC,YAAY,GAAG,OAAO,CAAC,YAAY;IACnE,IAAI,OAAO,CAAC,KAAK;QAAE,KAAK,CAAC,YAAY,CAAC,OAAO,EAAE,OAAO,CAAC,KAAK,CAAC;AAE7D,IAAA,OAAO,KAAK;AACd;;;;"}