@sekiui/elements 0.0.65 → 0.0.69

package/dist/cdn/seki-drawer-content.js

@@ -0,0 +1,267 @@
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-DJy0z1-k.js';
+
+const sekiDrawerCss = ":host{--seki-neutral-50:hsl(0, 0%, 98%);--seki-neutral-100:hsl(0, 0%, 96.1%);--seki-neutral-200:hsl(0, 0%, 89.8%);--seki-neutral-300:hsl(0, 0%, 83.1%);--seki-neutral-400:hsl(0, 0%, 63.9%);--seki-neutral-500:hsl(0, 0%, 45.1%);--seki-neutral-600:hsl(0, 0%, 32.2%);--seki-neutral-700:hsl(0, 0%, 25.1%);--seki-neutral-800:hsl(0, 0%, 14.9%);--seki-neutral-900:hsl(0, 0%, 9%);--seki-neutral-950:hsl(0, 0%, 3.9%);--seki-primary-50:hsl(210, 100%, 97%);--seki-primary-100:hsl(210, 95%, 93%);--seki-primary-200:hsl(210, 95%, 85%);--seki-primary-300:hsl(210, 90%, 73%);--seki-primary-400:hsl(210, 85%, 58%);--seki-primary-500:hsl(210, 80%, 48%);--seki-primary-600:hsl(210, 75%, 40%);--seki-primary-700:hsl(210, 70%, 32%);--seki-primary-800:hsl(210, 65%, 25%);--seki-primary-900:hsl(210, 60%, 18%);--seki-primary-950:hsl(210, 55%, 10%);--seki-success-500:hsl(142, 71%, 45%);--seki-success-600:hsl(142, 71%, 35%);--seki-warning-500:hsl(38, 92%, 50%);--seki-warning-600:hsl(38, 92%, 40%);--seki-destructive-500:hsl(0, 84.2%, 60.2%);--seki-destructive-600:hsl(0, 72%, 41%);--seki-chart-1:hsl(12, 76%, 61%);--seki-chart-2:hsl(173, 58%, 39%);--seki-chart-3:hsl(197, 37%, 24%);--seki-chart-4:hsl(43, 74%, 66%);--seki-chart-5:hsl(27, 87%, 67%)}:host{--seki-background:hsl(0, 0%, 100%);--seki-foreground:hsl(0, 0%, 3.9%);--seki-muted:hsl(0, 0%, 96.1%);--seki-muted-foreground:hsl(0, 0%, 45.1%);--seki-card:hsl(0, 0%, 100%);--seki-card-foreground:hsl(0, 0%, 3.9%);--seki-popover:hsl(0, 0%, 100%);--seki-popover-foreground:hsl(0, 0%, 3.9%);--seki-border:hsl(0, 0%, 89.8%);--seki-input:hsl(0, 0%, 89.8%);--seki-primary:hsl(0, 0%, 9%);--seki-primary-foreground:hsl(0, 0%, 98%);--seki-secondary:hsl(0, 0%, 96.1%);--seki-secondary-foreground:hsl(0, 0%, 9%);--seki-accent:hsl(0, 0%, 96.1%);--seki-accent-foreground:hsl(0, 0%, 9%);--seki-destructive:hsl(0, 84.2%, 60.2%);--seki-destructive-foreground:hsl(0, 0%, 98%);--seki-ring:hsl(0, 0%, 3.9%);--seki-bg-primary:var(--seki-background);--seki-bg-secondary:var(--seki-muted);--seki-bg-tertiary:var(--seki-accent);--seki-text-primary:var(--seki-foreground);--seki-text-secondary:var(--seki-muted-foreground);--seki-text-tertiary:var(--seki-neutral-400);--seki-border-default:var(--seki-border);--seki-border-emphasis:var(--seki-neutral-300)}:host([data-theme='dark']){--seki-background:hsl(0, 0%, 3.9%);--seki-foreground:hsl(0, 0%, 98%);--seki-muted:hsl(0, 0%, 14.9%);--seki-muted-foreground:hsl(0, 0%, 63.9%);--seki-card:hsl(0, 0%, 3.9%);--seki-card-foreground:hsl(0, 0%, 98%);--seki-popover:hsl(0, 0%, 3.9%);--seki-popover-foreground:hsl(0, 0%, 98%);--seki-border:hsl(0, 0%, 14.9%);--seki-input:hsl(0, 0%, 14.9%);--seki-primary:hsl(0, 0%, 98%);--seki-primary-foreground:hsl(0, 0%, 9%);--seki-secondary:hsl(0, 0%, 14.9%);--seki-secondary-foreground:hsl(0, 0%, 98%);--seki-accent:hsl(0, 0%, 14.9%);--seki-accent-foreground:hsl(0, 0%, 98%);--seki-destructive:hsl(0, 62.8%, 30.6%);--seki-destructive-foreground:hsl(0, 0%, 98%);--seki-ring:hsl(0, 0%, 83.1%);--seki-bg-primary:var(--seki-background);--seki-bg-secondary:var(--seki-muted);--seki-bg-tertiary:var(--seki-accent);--seki-text-primary:var(--seki-foreground);--seki-text-secondary:var(--seki-muted-foreground);--seki-text-tertiary:var(--seki-neutral-600);--seki-border-default:var(--seki-border);--seki-border-emphasis:var(--seki-neutral-700);--seki-button-primary-hover-bg:hsl(0, 0%, 98%, 0.9);--seki-button-secondary-hover-bg:hsl(0, 0%, 14.9%, 0.8)}:host{--seki-button-primary-bg:var(--seki-primary);--seki-button-primary-text:var(--seki-primary-foreground);--seki-button-primary-border:transparent;--seki-button-primary-hover-bg:hsl(0, 0%, 9%, 0.9);--seki-button-primary-hover-text:var(--seki-primary-foreground);--seki-button-primary-hover-border:transparent;--seki-button-secondary-bg:var(--seki-secondary);--seki-button-secondary-text:var(--seki-secondary-foreground);--seki-button-secondary-border:transparent;--seki-button-secondary-hover-bg:hsl(0, 0%, 96.1%, 0.8);--seki-button-secondary-hover-text:var(--seki-secondary-foreground);--seki-button-secondary-hover-border:transparent;--seki-button-outline-bg:transparent;--seki-button-outline-text:var(--seki-foreground);--seki-button-outline-border:var(--seki-input);--seki-button-outline-hover-bg:var(--seki-accent);--seki-button-outline-hover-text:var(--seki-accent-foreground);--seki-button-outline-hover-border:var(--seki-input);--seki-button-ghost-bg:transparent;--seki-button-ghost-text:var(--seki-foreground);--seki-button-ghost-border:transparent;--seki-button-ghost-hover-bg:var(--seki-accent);--seki-button-ghost-hover-text:var(--seki-accent-foreground);--seki-button-ghost-hover-border:transparent;--seki-button-destructive-bg:var(--seki-destructive);--seki-button-destructive-text:var(--seki-destructive-foreground);--seki-button-destructive-border:transparent;--seki-button-destructive-hover-bg:hsl(0, 84.2%, 60.2%, 0.9);--seki-button-destructive-hover-border:transparent;--seki-button-sm-padding-x:var(--seki-spacing-3, 0.75rem);--seki-button-sm-padding-y:0.375rem;--seki-button-sm-font-size:var(--seki-text-sm, 0.875rem);--seki-button-sm-height:2.25rem;--seki-button-md-padding-x:var(--seki-spacing-4, 1rem);--seki-button-md-padding-y:var(--seki-spacing-2, 0.5rem);--seki-button-md-font-size:var(--seki-text-base, 1rem);--seki-button-md-height:2.5rem;--seki-button-lg-padding-x:2rem;--seki-button-lg-padding-y:0.5rem;--seki-button-lg-font-size:1rem;--seki-button-lg-height:2.75rem;--seki-button-icon-sm-size:2rem;--seki-button-icon-size:2.5rem;--seki-button-icon-lg-size:3rem;--seki-button-icon-gap:0.5rem;--seki-button-link-bg:transparent;--seki-button-link-text:var(--seki-primary);--seki-button-link-border:transparent;--seki-button-link-hover-bg:transparent;--seki-button-link-hover-text:var(--seki-primary);--seki-button-link-hover-border:transparent;--seki-button-radius:var(--seki-radius-md, 0.375rem);--seki-button-font-weight:var(--seki-font-medium, 500);--seki-button-transition-duration:150ms;--seki-button-transition-timing:ease-in-out;--seki-button-shadow:var(--seki-shadow-sm, 0 1px 2px 0 rgb(0 0 0 / 0.05));--seki-button-shadow-hover:var(--seki-shadow-md, 0 4px 6px -1px rgb(0 0 0 / 0.1));--seki-button-disabled-opacity:0.5;--seki-input-bg:var(--seki-background);--seki-input-border:var(--seki-border);--seki-input-text:var(--seki-foreground);--seki-input-placeholder:var(--seki-muted-foreground);--seki-input-ring:var(--seki-ring);--seki-input-invalid-border:var(--seki-destructive);--seki-input-invalid-ring:var(--seki-destructive);--seki-input-disabled-opacity:0.5;--seki-input-radius:var(--seki-radius-md);--seki-input-ring-offset:2px;--seki-select-trigger-bg:var(--seki-background);--seki-select-trigger-border:1px solid var(--seki-border);--seki-select-trigger-bg-hover:var(--seki-muted);--seki-select-trigger-radius:var(--seki-radius-md);--seki-select-trigger-min-height:2.5rem;--seki-select-trigger-padding:0.5rem 0.75rem;--seki-select-trigger-gap:0.5rem;--seki-select-content-bg:var(--seki-popover);--seki-select-content-border:1px solid var(--seki-border);--seki-select-content-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1);--seki-select-content-radius:var(--seki-radius-md);--seki-select-content-padding:0.5rem 0;--seki-select-option-padding:0.5rem 0.75rem;--seki-select-option-gap:0.5rem;--seki-select-option-radius:var(--seki-radius-sm);--seki-select-option-bg-hover:var(--seki-muted);--seki-select-option-bg-selected:var(--seki-muted);--seki-select-group-label-padding:0.5rem 0.75rem;--seki-select-group-label-font-size:var(--seki-font-size-xs);--seki-select-group-label-font-weight:var(--seki-font-semibold);--seki-select-group-label-color:var(--seki-muted-foreground);--seki-select-group-separator:1px solid var(--seki-border)}:host{--seki-spacing-0:0;--seki-spacing-0-5:0.125rem;--seki-spacing-1:0.25rem;--seki-spacing-1-5:0.375rem;--seki-spacing-2:0.5rem;--seki-spacing-2-5:0.625rem;--seki-spacing-3:0.75rem;--seki-spacing-3-5:0.875rem;--seki-spacing-4:1rem;--seki-spacing-5:1.25rem;--seki-spacing-6:1.5rem;--seki-spacing-8:2rem;--seki-spacing-10:2.5rem;--seki-spacing-12:3rem;--seki-spacing-16:4rem;--seki-spacing-20:5rem;--seki-spacing-24:6rem;--seki-input-height-sm:2rem;--seki-input-height-md:2.5rem;--seki-input-height-lg:3rem;--seki-input-padding-x:0.75rem;--seki-input-padding-y:0.5rem;--seki-input-font-size:0.875rem;--seki-input-ring-offset:2px}:host{--seki-shadow-sm:0 1px 2px 0 rgb(0 0 0 / 0.05);--seki-shadow-md:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--seki-shadow-lg:0 10px 15px -3px rgb(0 0 0 / 0.15), 0 4px 6px -4px rgb(0 0 0 / 0.1)}:host{--seki-font-sans:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue',\n    Arial, sans-serif;--seki-font-mono:ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;--seki-text-xs:0.75rem;--seki-text-sm:0.875rem;--seki-text-base:1rem;--seki-text-lg:1.125rem;--seki-text-xl:1.25rem;--seki-text-2xl:1.5rem;--seki-text-3xl:1.875rem;--seki-text-4xl:2.25rem;--seki-font-normal:400;--seki-font-medium:500;--seki-font-semibold:600;--seki-font-bold:700;--seki-leading-tight:1.25;--seki-leading-normal:1.5;--seki-leading-relaxed:1.75}:host{--seki-radius-sm:0.25rem;--seki-radius-md:0.375rem;--seki-radius-lg:0.5rem;--seki-radius-xl:1rem;}:host{--seki-sidebar-width:16rem;--seki-sidebar-width-icon:3rem;--seki-sidebar-width-mobile:18rem;--seki-sidebar-background:hsl(0, 0%, 98%);--seki-sidebar-foreground:hsl(240, 5.3%, 26.1%);--seki-sidebar-primary:hsl(240, 5.9%, 10%);--seki-sidebar-primary-foreground:hsl(0, 0%, 98%);--seki-sidebar-accent:hsl(240, 4.8%, 95.9%);--seki-sidebar-accent-foreground:hsl(240, 5.9%, 10%);--seki-sidebar-border:hsl(220, 13%, 91%);--seki-sidebar-ring:hsl(217.2, 91.2%, 59.8%);--seki-sidebar-muted-foreground:hsl(240, 3.8%, 46.1%);--seki-sidebar-menu-button-height:2rem;--seki-sidebar-menu-button-height-lg:3rem;--seki-sidebar-menu-button-padding:0.5rem;--seki-sidebar-menu-button-gap:0.5rem;--seki-sidebar-menu-button-radius:var(--seki-radius-md, 0.375rem);--seki-sidebar-menu-sub-padding-left:1.75rem;--seki-sidebar-menu-sub-border-width:1px;--seki-sidebar-group-padding:0.5rem;--seki-sidebar-group-label-height:2rem;--seki-sidebar-group-label-padding:0.5rem;--seki-sidebar-header-height:auto;--seki-sidebar-footer-height:auto;--seki-sidebar-header-padding:0.5rem;--seki-sidebar-footer-padding:0.5rem;--seki-sidebar-content-padding:0.5rem;--seki-sidebar-rail-width:1rem;--seki-sidebar-transition-duration:200ms;--seki-sidebar-transition-timing:ease-in-out;--seki-sidebar-mobile-breakpoint:768px;--seki-sidebar-overlay-bg:hsla(0, 0%, 0%, 0.8)}:host([data-theme='dark']){--seki-sidebar-background:hsl(240, 5.9%, 10%);--seki-sidebar-foreground:hsl(240, 4.8%, 95.9%);--seki-sidebar-primary:hsl(0, 0%, 98%);--seki-sidebar-primary-foreground:hsl(240, 5.9%, 10%);--seki-sidebar-accent:hsl(240, 3.7%, 15.9%);--seki-sidebar-accent-foreground:hsl(240, 4.8%, 95.9%);--seki-sidebar-border:hsl(240, 3.7%, 15.9%);--seki-sidebar-ring:hsl(217.2, 91.2%, 59.8%);--seki-sidebar-muted-foreground:hsl(240, 5%, 64.9%)}:host{--seki-animation-fast:150ms;--seki-animation-normal:200ms;--seki-animation-slow:300ms;--seki-ease-in:cubic-bezier(0.4, 0, 1, 1);--seki-ease-out:cubic-bezier(0, 0, 0.2, 1);--seki-ease-in-out:cubic-bezier(0.4, 0, 0.2, 1);--seki-accordion-content-height:auto}@keyframes seki-fade-in{from{opacity:0}to{opacity:1}}@keyframes seki-fade-out{from{opacity:1}to{opacity:0}}@keyframes seki-scale-in{from{opacity:0;transform:scale(0.95)}to{opacity:1;transform:scale(1)}}@keyframes seki-scale-out{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0.95)}}@keyframes seki-slide-in-from-top{from{transform:translateY(-100%)}to{transform:translateY(0)}}@keyframes seki-slide-out-to-top{from{transform:translateY(0)}to{transform:translateY(-100%)}}@keyframes seki-slide-in-from-bottom{from{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes seki-slide-out-to-bottom{from{transform:translateY(0)}to{transform:translateY(100%)}}@keyframes seki-slide-in-from-left{from{transform:translateX(-100%)}to{transform:translateX(0)}}@keyframes seki-slide-out-to-left{from{transform:translateX(0)}to{transform:translateX(-100%)}}@keyframes seki-slide-in-from-right{from{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes seki-slide-out-to-right{from{transform:translateX(0)}to{transform:translateX(100%)}}@keyframes seki-accordion-down{from{height:0;opacity:0}to{height:var(--seki-accordion-content-height);opacity:1}}@keyframes seki-accordion-up{from{height:var(--seki-accordion-content-height);opacity:1}to{height:0;opacity:0}}@keyframes seki-zoom-in{from{opacity:0;transform:scale(0.96)}to{opacity:1;transform:scale(1)}}@keyframes seki-zoom-out{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0.96)}}@keyframes seki-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}@keyframes seki-pulse{0%,100%{opacity:1}50%{opacity:0.5}}@keyframes seki-bounce{0%,100%{transform:translateY(-25%);animation-timing-function:cubic-bezier(0.8, 0, 1, 1)}50%{transform:translateY(0);animation-timing-function:cubic-bezier(0, 0, 0.2, 1)}}@keyframes seki-collapsible-open{from{height:0;overflow:hidden}to{height:var(--seki-collapsible-content-height, auto)}}@keyframes seki-collapsible-close{from{height:var(--seki-collapsible-content-height, auto)}to{height:0;overflow:hidden}}@keyframes seki-toast-slide-in-right{from{transform:translateX(calc(100% + 1rem))}to{transform:translateX(0)}}@keyframes seki-toast-slide-out-right{from{transform:translateX(0)}to{transform:translateX(calc(100% + 1rem))}}@keyframes seki-toast-swipe-out{from{transform:translateX(var(--seki-toast-swipe-end-x, 0))}to{transform:translateX(calc(100% + 1rem))}}.seki-animate-fade-in{animation:seki-fade-in var(--seki-animation-normal) var(--seki-ease-out)}.seki-animate-fade-out{animation:seki-fade-out var(--seki-animation-normal) var(--seki-ease-in)}.seki-animate-scale-in{animation:seki-scale-in var(--seki-animation-normal) var(--seki-ease-out)}.seki-animate-scale-out{animation:seki-scale-out var(--seki-animation-normal) var(--seki-ease-in)}.seki-animate-spin{animation:seki-spin 1s linear infinite}.seki-animate-pulse{animation:seki-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite}.seki-animate-bounce{animation:seki-bounce 1s infinite}@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important}}:host{--seki-drawer-bg:var(--seki-background, hsl(0 0% 100%));--seki-drawer-border:var(--seki-border, hsl(240 5.9% 90%));--seki-drawer-text:var(--seki-foreground, hsl(240 10% 3.9%));--seki-drawer-text-muted:var(--seki-muted-foreground, hsl(240 3.8% 46.1%));--seki-drawer-handle-bg:var(--seki-muted-foreground, hsl(240 3.8% 46.1%));--seki-drawer-overlay-bg:rgba(0, 0, 0, 0.5);--seki-drawer-shadow:0 -10px 15px -3px rgba(0, 0, 0, 0.1), 0 -4px 6px -4px rgba(0, 0, 0, 0.1);--seki-drawer-font-family:var(--seki-font-sans, system-ui, -apple-system, sans-serif);--seki-drawer-max-height:96vh;--seki-drawer-max-width:24rem;--seki-drawer-z-index:50;--seki-drawer-snap-duration:0.3s;display:contents}:host([data-theme='dark']){--seki-drawer-bg:var(--seki-background, hsl(240 10% 3.9%));--seki-drawer-border:var(--seki-border, hsl(240 3.7% 15.9%));--seki-drawer-text:var(--seki-foreground, hsl(0 0% 98%));--seki-drawer-text-muted:var(--seki-muted-foreground, hsl(240 5% 64.9%));--seki-drawer-handle-bg:var(--seki-muted-foreground, hsl(240 5% 64.9%));--seki-drawer-overlay-bg:rgba(0, 0, 0, 0.7)}.seki-drawer{display:contents}.seki-drawer-overlay{position:fixed;inset:0;background:var(--seki-drawer-overlay-bg);z-index:var(--seki-drawer-z-index);animation:drawerFadeIn var(--seki-drawer-snap-duration) ease}@keyframes drawerFadeIn{from{opacity:0}to{opacity:1}}.seki-drawer-content{position:fixed;z-index:calc(var(--seki-drawer-z-index) + 1);background:var(--seki-drawer-bg);box-shadow:var(--seki-drawer-shadow);font-family:var(--seki-drawer-font-family);display:flex;flex-direction:column;overflow:hidden;touch-action:none;will-change:transform}.seki-drawer-content--bottom{bottom:0;left:0;right:0;max-height:var(--seki-drawer-max-height);border-top:1px solid var(--seki-drawer-border);border-top-left-radius:var(--seki-radius-lg, 0.5rem);border-top-right-radius:var(--seki-radius-lg, 0.5rem)}.seki-drawer-content--top{top:0;left:0;right:0;max-height:var(--seki-drawer-max-height);border-bottom:1px solid var(--seki-drawer-border);border-bottom-left-radius:var(--seki-radius-lg, 0.5rem);border-bottom-right-radius:var(--seki-radius-lg, 0.5rem)}.seki-drawer-content--right{top:0;right:0;bottom:0;width:var(--seki-drawer-max-width);max-width:100%;border-left:1px solid var(--seki-drawer-border)}.seki-drawer-content--left{top:0;left:0;bottom:0;width:var(--seki-drawer-max-width);max-width:100%;border-right:1px solid var(--seki-drawer-border)}.seki-drawer-handle{width:3rem;height:0.25rem;background:var(--seki-drawer-handle-bg);border-radius:9999px;margin:0.75rem auto;opacity:0.4;flex-shrink:0}.seki-drawer-content--bottom .seki-drawer-handle{margin-top:0.75rem;margin-bottom:0.5rem}.seki-drawer-content--top .seki-drawer-handle{margin-top:0.5rem;margin-bottom:0.75rem;order:999;}.seki-drawer-content--left .seki-drawer-handle,.seki-drawer-content--right .seki-drawer-handle{width:0.25rem;height:3rem;margin:auto 0.75rem}.seki-drawer-body{flex:1;overflow:auto;overscroll-behavior:contain}.seki-drawer-close-button{position:absolute;top:1rem;right:1rem;display:inline-flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;padding:0;border:none;border-radius:var(--seki-radius-sm, 4px);background:transparent;color:var(--seki-drawer-text-muted);cursor:pointer;opacity:0.7;transition:opacity 0.15s ease;z-index:1}.seki-drawer-close-button:hover{opacity:1}.seki-drawer-close-button:focus-visible{outline:2px solid var(--seki-ring, hsl(240 5.9% 10%));outline-offset:2px}.seki-drawer-close-button svg{width:1rem;height:1rem}[data-dragging=\"false\"] .seki-drawer-content{transition:transform var(--seki-drawer-snap-duration) cubic-bezier(0.32, 0.72, 0, 1)}[data-dragging=\"true\"] .seki-drawer-content{transition:none}@media (prefers-reduced-motion: reduce){.seki-drawer-overlay,.seki-drawer-content{animation:none;transition:none}}";
+
+const SekiDrawerContent$1 = /*@__PURE__*/ proxyCustomElement(class SekiDrawerContent extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+        this.requestClose = createEvent(this, "requestClose");
+        this.requestSnap = createEvent(this, "requestSnap");
+        /**
+         * Direction the drawer slides in from
+         * @default 'bottom'
+         */
+        this.direction = 'bottom';
+        /**
+         * Comma-separated snap points (0-1). E.g., "0.5,1" for half and full open
+         * @default '1'
+         */
+        this.snapPoints = '1';
+        /**
+         * Distance threshold (0-1) to trigger close when dragging
+         * @default 0.5
+         */
+        this.closeThreshold = 0.5;
+        /**
+         * Velocity threshold (px/s) to trigger close on quick swipe
+         * @default 500
+         */
+        this.velocityThreshold = 500;
+        /**
+         * Parsed snap points array
+         */
+        this.parsedSnapPoints = [1];
+        /**
+         * Current drag state
+         */
+        this.isDragging = false;
+        /**
+         * Current drag offset in pixels
+         */
+        this.dragOffset = 0;
+        /**
+         * Current open percentage (0-1)
+         */
+        this.openPercent = 1;
+        // Gesture tracking state
+        this.startY = 0;
+        this.startX = 0;
+        this.contentEl = null;
+        this.positions = [];
+        this.handleCloseClick = () => {
+            this.requestClose.emit();
+        };
+        // eslint-disable-next-line no-undef
+        this.handlePointerDown = (event) => {
+            // Only handle primary button
+            if (event.button !== 0)
+                return;
+            this.isDragging = true;
+            this.startX = event.clientX;
+            this.startY = event.clientY;
+            this.positions = [{ x: event.clientX, y: event.clientY, time: Date.now() }];
+            // Capture pointer for reliable tracking
+            event.target.setPointerCapture(event.pointerId);
+            // Update parent dragging state
+            const parent = this.el.closest('seki-drawer');
+            if (parent) {
+                parent.setAttribute('data-dragging', 'true');
+            }
+        };
+        // eslint-disable-next-line no-undef
+        this.handlePointerMove = (event) => {
+            if (!this.isDragging)
+                return;
+            const deltaX = event.clientX - this.startX;
+            const deltaY = event.clientY - this.startY;
+            // Track positions for velocity calculation
+            this.positions.push({ x: event.clientX, y: event.clientY, time: Date.now() });
+            if (this.positions.length > 5) {
+                this.positions.shift();
+            }
+            // Calculate offset based on direction
+            let offset;
+            if (this.isHorizontal) {
+                offset = this.direction === 'right' ? deltaX : -deltaX;
+            }
+            else {
+                offset = this.direction === 'bottom' ? deltaY : -deltaY;
+            }
+            // Only allow dragging in the closing direction (positive offset)
+            this.dragOffset = Math.max(0, offset);
+        };
+        // eslint-disable-next-line no-undef
+        this.handlePointerUp = (event) => {
+            if (!this.isDragging)
+                return;
+            this.isDragging = false;
+            // Release pointer capture
+            event.target.releasePointerCapture(event.pointerId);
+            // Update parent dragging state
+            const parent = this.el.closest('seki-drawer');
+            if (parent) {
+                parent.setAttribute('data-dragging', 'false');
+            }
+            // Calculate velocity
+            const velocity = this.calculateVelocity();
+            // Get drawer dimensions
+            const dimension = this.getDrawerDimension();
+            const dragPercent = dimension > 0 ? this.dragOffset / dimension : 0;
+            // Determine action based on velocity and distance
+            const isClosingDirection = this.isVelocityClosing(velocity);
+            if (isClosingDirection && Math.abs(velocity) > this.velocityThreshold) {
+                // Quick swipe in closing direction - close
+                this.requestClose.emit();
+            }
+            else if (dragPercent > this.closeThreshold) {
+                // Dragged past threshold - close
+                this.requestClose.emit();
+            }
+            else {
+                // Find nearest snap point based on current position
+                const currentOpenPercent = 1 - dragPercent;
+                const nearestPoint = this.findNearestSnapPoint(currentOpenPercent);
+                if (nearestPoint <= 0) {
+                    this.requestClose.emit();
+                }
+                else {
+                    this.requestSnap.emit({ point: nearestPoint });
+                }
+            }
+            // Reset drag offset
+            this.dragOffset = 0;
+        };
+    }
+    /**
+     * Computed: should show handle based on prop or direction default
+     */
+    get shouldShowHandle() {
+        if (this.showHandle !== undefined) {
+            return this.showHandle;
+        }
+        // Default: show handle for bottom/top, hide for sides
+        return this.direction === 'bottom' || this.direction === 'top';
+    }
+    /**
+     * Computed: is horizontal direction
+     */
+    get isHorizontal() {
+        return this.direction === 'left' || this.direction === 'right';
+    }
+    componentWillLoad() {
+        this.parseSnapPoints();
+        // Propagate direction to parent for styling
+        const parent = this.el.closest('seki-drawer');
+        if (parent) {
+            parent.setAttribute('data-direction', this.direction);
+        }
+    }
+    parseSnapPoints() {
+        const points = this.snapPoints
+            .split(',')
+            .map(s => parseFloat(s.trim()))
+            .filter(n => !isNaN(n) && n >= 0 && n <= 1)
+            .sort((a, b) => a - b);
+        this.parsedSnapPoints = points.length > 0 ? points : [1];
+    }
+    calculateVelocity() {
+        if (this.positions.length < 2)
+            return 0;
+        const first = this.positions[0];
+        const last = this.positions[this.positions.length - 1];
+        const timeDelta = (last.time - first.time) / 1000; // Convert to seconds
+        if (timeDelta === 0)
+            return 0;
+        if (this.isHorizontal) {
+            return (last.x - first.x) / timeDelta;
+        }
+        else {
+            return (last.y - first.y) / timeDelta;
+        }
+    }
+    isVelocityClosing(velocity) {
+        // Positive velocity = moving in positive direction
+        switch (this.direction) {
+            case 'bottom':
+                return velocity > 0; // Swipe down
+            case 'top':
+                return velocity < 0; // Swipe up
+            case 'right':
+                return velocity > 0; // Swipe right
+            case 'left':
+                return velocity < 0; // Swipe left
+            default:
+                return false;
+        }
+    }
+    getDrawerDimension() {
+        if (!this.contentEl)
+            return 0;
+        return this.isHorizontal
+            ? this.contentEl.offsetWidth
+            : this.contentEl.offsetHeight;
+    }
+    findNearestSnapPoint(current) {
+        return this.parsedSnapPoints.reduce((nearest, point) => Math.abs(point - current) < Math.abs(nearest - current) ? point : nearest);
+    }
+    getTransformStyle() {
+        if (this.dragOffset === 0)
+            return '';
+        if (this.isHorizontal) {
+            const sign = this.direction === 'right' ? 1 : -1;
+            return `translateX(${sign * this.dragOffset}px)`;
+        }
+        else {
+            const sign = this.direction === 'bottom' ? 1 : -1;
+            return `translateY(${sign * this.dragOffset}px)`;
+        }
+    }
+    render() {
+        const transformStyle = this.getTransformStyle();
+        return (h(Host, { key: '5bb7d5d106bee2412a1973581ee48c7f1e12dfd4', "data-direction": this.direction }, h("div", { key: 'ed450481ec4a48630f9f7ae0c0976c891d6bec09', ref: (el) => (this.contentEl = el !== null && el !== void 0 ? el : null), role: "dialog", "aria-modal": "true", "aria-label": this.ariaLabel, class: {
+                'seki-drawer-content': true,
+                [`seki-drawer-content--${this.direction}`]: true,
+            }, style: transformStyle ? { transform: transformStyle } : {}, part: "content", onPointerDown: this.handlePointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerUp }, this.shouldShowHandle && (h("div", { key: '36a530bf169fd1dd8a54b3608b31d0bacfe92cef', class: "seki-drawer-handle", part: "handle" })), h("button", { key: '63970cac2aa8c085e95378d9b8b8ebe8d32224ea', type: "button", class: "seki-drawer-close-button", "aria-label": "Close", onClick: this.handleCloseClick }, h("svg", { key: '43128bac99462f9de58726475b599a8caad72435', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("path", { key: '74a1a2e1c79542d6a9a2994618d4617133e1b6b4', d: "M18 6 6 18" }), h("path", { key: 'ad56b44c97578d7eb2419aa2091bc1a85cb8296e', d: "m6 6 12 12" }))), h("div", { key: '57dc9d1d51eb39725ed42fdd2f5fcc85b359ba5f', class: "seki-drawer-body" }, h("slot", { key: '217d5953991c77642309ed6ac0f5efb37dc951ef' })))));
+    }
+    get el() { return this; }
+    static get watchers() { return {
+        "snapPoints": ["parseSnapPoints"]
+    }; }
+    static get style() { return sekiDrawerCss; }
+}, [257, "seki-drawer-content", {
+        "direction": [1],
+        "snapPoints": [1, "snap-points"],
+        "showHandle": [4, "show-handle"],
+        "closeThreshold": [2, "close-threshold"],
+        "velocityThreshold": [2, "velocity-threshold"],
+        "ariaLabel": [1, "aria-label"],
+        "parsedSnapPoints": [32],
+        "isDragging": [32],
+        "dragOffset": [32],
+        "openPercent": [32]
+    }, undefined, {
+        "snapPoints": ["parseSnapPoints"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["seki-drawer-content"];
+    components.forEach(tagName => { switch (tagName) {
+        case "seki-drawer-content":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, SekiDrawerContent$1);
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const SekiDrawerContent = SekiDrawerContent$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { SekiDrawerContent, defineCustomElement };

package/dist/cdn/seki-drawer.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface SekiDrawer extends Components.SekiDrawer, HTMLElement {}
+export const SekiDrawer: {
+    prototype: SekiDrawer;
+    new (): SekiDrawer;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/cdn/seki-drawer.js

@@ -0,0 +1,111 @@
+import { p as proxyCustomElement, H, c as createEvent, h } from './p-DJy0z1-k.js';
+
+const sekiDrawerCss = ":host{--seki-neutral-50:hsl(0, 0%, 98%);--seki-neutral-100:hsl(0, 0%, 96.1%);--seki-neutral-200:hsl(0, 0%, 89.8%);--seki-neutral-300:hsl(0, 0%, 83.1%);--seki-neutral-400:hsl(0, 0%, 63.9%);--seki-neutral-500:hsl(0, 0%, 45.1%);--seki-neutral-600:hsl(0, 0%, 32.2%);--seki-neutral-700:hsl(0, 0%, 25.1%);--seki-neutral-800:hsl(0, 0%, 14.9%);--seki-neutral-900:hsl(0, 0%, 9%);--seki-neutral-950:hsl(0, 0%, 3.9%);--seki-primary-50:hsl(210, 100%, 97%);--seki-primary-100:hsl(210, 95%, 93%);--seki-primary-200:hsl(210, 95%, 85%);--seki-primary-300:hsl(210, 90%, 73%);--seki-primary-400:hsl(210, 85%, 58%);--seki-primary-500:hsl(210, 80%, 48%);--seki-primary-600:hsl(210, 75%, 40%);--seki-primary-700:hsl(210, 70%, 32%);--seki-primary-800:hsl(210, 65%, 25%);--seki-primary-900:hsl(210, 60%, 18%);--seki-primary-950:hsl(210, 55%, 10%);--seki-success-500:hsl(142, 71%, 45%);--seki-success-600:hsl(142, 71%, 35%);--seki-warning-500:hsl(38, 92%, 50%);--seki-warning-600:hsl(38, 92%, 40%);--seki-destructive-500:hsl(0, 84.2%, 60.2%);--seki-destructive-600:hsl(0, 72%, 41%);--seki-chart-1:hsl(12, 76%, 61%);--seki-chart-2:hsl(173, 58%, 39%);--seki-chart-3:hsl(197, 37%, 24%);--seki-chart-4:hsl(43, 74%, 66%);--seki-chart-5:hsl(27, 87%, 67%)}:host{--seki-background:hsl(0, 0%, 100%);--seki-foreground:hsl(0, 0%, 3.9%);--seki-muted:hsl(0, 0%, 96.1%);--seki-muted-foreground:hsl(0, 0%, 45.1%);--seki-card:hsl(0, 0%, 100%);--seki-card-foreground:hsl(0, 0%, 3.9%);--seki-popover:hsl(0, 0%, 100%);--seki-popover-foreground:hsl(0, 0%, 3.9%);--seki-border:hsl(0, 0%, 89.8%);--seki-input:hsl(0, 0%, 89.8%);--seki-primary:hsl(0, 0%, 9%);--seki-primary-foreground:hsl(0, 0%, 98%);--seki-secondary:hsl(0, 0%, 96.1%);--seki-secondary-foreground:hsl(0, 0%, 9%);--seki-accent:hsl(0, 0%, 96.1%);--seki-accent-foreground:hsl(0, 0%, 9%);--seki-destructive:hsl(0, 84.2%, 60.2%);--seki-destructive-foreground:hsl(0, 0%, 98%);--seki-ring:hsl(0, 0%, 3.9%);--seki-bg-primary:var(--seki-background);--seki-bg-secondary:var(--seki-muted);--seki-bg-tertiary:var(--seki-accent);--seki-text-primary:var(--seki-foreground);--seki-text-secondary:var(--seki-muted-foreground);--seki-text-tertiary:var(--seki-neutral-400);--seki-border-default:var(--seki-border);--seki-border-emphasis:var(--seki-neutral-300)}:host([data-theme='dark']){--seki-background:hsl(0, 0%, 3.9%);--seki-foreground:hsl(0, 0%, 98%);--seki-muted:hsl(0, 0%, 14.9%);--seki-muted-foreground:hsl(0, 0%, 63.9%);--seki-card:hsl(0, 0%, 3.9%);--seki-card-foreground:hsl(0, 0%, 98%);--seki-popover:hsl(0, 0%, 3.9%);--seki-popover-foreground:hsl(0, 0%, 98%);--seki-border:hsl(0, 0%, 14.9%);--seki-input:hsl(0, 0%, 14.9%);--seki-primary:hsl(0, 0%, 98%);--seki-primary-foreground:hsl(0, 0%, 9%);--seki-secondary:hsl(0, 0%, 14.9%);--seki-secondary-foreground:hsl(0, 0%, 98%);--seki-accent:hsl(0, 0%, 14.9%);--seki-accent-foreground:hsl(0, 0%, 98%);--seki-destructive:hsl(0, 62.8%, 30.6%);--seki-destructive-foreground:hsl(0, 0%, 98%);--seki-ring:hsl(0, 0%, 83.1%);--seki-bg-primary:var(--seki-background);--seki-bg-secondary:var(--seki-muted);--seki-bg-tertiary:var(--seki-accent);--seki-text-primary:var(--seki-foreground);--seki-text-secondary:var(--seki-muted-foreground);--seki-text-tertiary:var(--seki-neutral-600);--seki-border-default:var(--seki-border);--seki-border-emphasis:var(--seki-neutral-700);--seki-button-primary-hover-bg:hsl(0, 0%, 98%, 0.9);--seki-button-secondary-hover-bg:hsl(0, 0%, 14.9%, 0.8)}:host{--seki-button-primary-bg:var(--seki-primary);--seki-button-primary-text:var(--seki-primary-foreground);--seki-button-primary-border:transparent;--seki-button-primary-hover-bg:hsl(0, 0%, 9%, 0.9);--seki-button-primary-hover-text:var(--seki-primary-foreground);--seki-button-primary-hover-border:transparent;--seki-button-secondary-bg:var(--seki-secondary);--seki-button-secondary-text:var(--seki-secondary-foreground);--seki-button-secondary-border:transparent;--seki-button-secondary-hover-bg:hsl(0, 0%, 96.1%, 0.8);--seki-button-secondary-hover-text:var(--seki-secondary-foreground);--seki-button-secondary-hover-border:transparent;--seki-button-outline-bg:transparent;--seki-button-outline-text:var(--seki-foreground);--seki-button-outline-border:var(--seki-input);--seki-button-outline-hover-bg:var(--seki-accent);--seki-button-outline-hover-text:var(--seki-accent-foreground);--seki-button-outline-hover-border:var(--seki-input);--seki-button-ghost-bg:transparent;--seki-button-ghost-text:var(--seki-foreground);--seki-button-ghost-border:transparent;--seki-button-ghost-hover-bg:var(--seki-accent);--seki-button-ghost-hover-text:var(--seki-accent-foreground);--seki-button-ghost-hover-border:transparent;--seki-button-destructive-bg:var(--seki-destructive);--seki-button-destructive-text:var(--seki-destructive-foreground);--seki-button-destructive-border:transparent;--seki-button-destructive-hover-bg:hsl(0, 84.2%, 60.2%, 0.9);--seki-button-destructive-hover-border:transparent;--seki-button-sm-padding-x:var(--seki-spacing-3, 0.75rem);--seki-button-sm-padding-y:0.375rem;--seki-button-sm-font-size:var(--seki-text-sm, 0.875rem);--seki-button-sm-height:2.25rem;--seki-button-md-padding-x:var(--seki-spacing-4, 1rem);--seki-button-md-padding-y:var(--seki-spacing-2, 0.5rem);--seki-button-md-font-size:var(--seki-text-base, 1rem);--seki-button-md-height:2.5rem;--seki-button-lg-padding-x:2rem;--seki-button-lg-padding-y:0.5rem;--seki-button-lg-font-size:1rem;--seki-button-lg-height:2.75rem;--seki-button-icon-sm-size:2rem;--seki-button-icon-size:2.5rem;--seki-button-icon-lg-size:3rem;--seki-button-icon-gap:0.5rem;--seki-button-link-bg:transparent;--seki-button-link-text:var(--seki-primary);--seki-button-link-border:transparent;--seki-button-link-hover-bg:transparent;--seki-button-link-hover-text:var(--seki-primary);--seki-button-link-hover-border:transparent;--seki-button-radius:var(--seki-radius-md, 0.375rem);--seki-button-font-weight:var(--seki-font-medium, 500);--seki-button-transition-duration:150ms;--seki-button-transition-timing:ease-in-out;--seki-button-shadow:var(--seki-shadow-sm, 0 1px 2px 0 rgb(0 0 0 / 0.05));--seki-button-shadow-hover:var(--seki-shadow-md, 0 4px 6px -1px rgb(0 0 0 / 0.1));--seki-button-disabled-opacity:0.5;--seki-input-bg:var(--seki-background);--seki-input-border:var(--seki-border);--seki-input-text:var(--seki-foreground);--seki-input-placeholder:var(--seki-muted-foreground);--seki-input-ring:var(--seki-ring);--seki-input-invalid-border:var(--seki-destructive);--seki-input-invalid-ring:var(--seki-destructive);--seki-input-disabled-opacity:0.5;--seki-input-radius:var(--seki-radius-md);--seki-input-ring-offset:2px;--seki-select-trigger-bg:var(--seki-background);--seki-select-trigger-border:1px solid var(--seki-border);--seki-select-trigger-bg-hover:var(--seki-muted);--seki-select-trigger-radius:var(--seki-radius-md);--seki-select-trigger-min-height:2.5rem;--seki-select-trigger-padding:0.5rem 0.75rem;--seki-select-trigger-gap:0.5rem;--seki-select-content-bg:var(--seki-popover);--seki-select-content-border:1px solid var(--seki-border);--seki-select-content-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1);--seki-select-content-radius:var(--seki-radius-md);--seki-select-content-padding:0.5rem 0;--seki-select-option-padding:0.5rem 0.75rem;--seki-select-option-gap:0.5rem;--seki-select-option-radius:var(--seki-radius-sm);--seki-select-option-bg-hover:var(--seki-muted);--seki-select-option-bg-selected:var(--seki-muted);--seki-select-group-label-padding:0.5rem 0.75rem;--seki-select-group-label-font-size:var(--seki-font-size-xs);--seki-select-group-label-font-weight:var(--seki-font-semibold);--seki-select-group-label-color:var(--seki-muted-foreground);--seki-select-group-separator:1px solid var(--seki-border)}:host{--seki-spacing-0:0;--seki-spacing-0-5:0.125rem;--seki-spacing-1:0.25rem;--seki-spacing-1-5:0.375rem;--seki-spacing-2:0.5rem;--seki-spacing-2-5:0.625rem;--seki-spacing-3:0.75rem;--seki-spacing-3-5:0.875rem;--seki-spacing-4:1rem;--seki-spacing-5:1.25rem;--seki-spacing-6:1.5rem;--seki-spacing-8:2rem;--seki-spacing-10:2.5rem;--seki-spacing-12:3rem;--seki-spacing-16:4rem;--seki-spacing-20:5rem;--seki-spacing-24:6rem;--seki-input-height-sm:2rem;--seki-input-height-md:2.5rem;--seki-input-height-lg:3rem;--seki-input-padding-x:0.75rem;--seki-input-padding-y:0.5rem;--seki-input-font-size:0.875rem;--seki-input-ring-offset:2px}:host{--seki-shadow-sm:0 1px 2px 0 rgb(0 0 0 / 0.05);--seki-shadow-md:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--seki-shadow-lg:0 10px 15px -3px rgb(0 0 0 / 0.15), 0 4px 6px -4px rgb(0 0 0 / 0.1)}:host{--seki-font-sans:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue',\n    Arial, sans-serif;--seki-font-mono:ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;--seki-text-xs:0.75rem;--seki-text-sm:0.875rem;--seki-text-base:1rem;--seki-text-lg:1.125rem;--seki-text-xl:1.25rem;--seki-text-2xl:1.5rem;--seki-text-3xl:1.875rem;--seki-text-4xl:2.25rem;--seki-font-normal:400;--seki-font-medium:500;--seki-font-semibold:600;--seki-font-bold:700;--seki-leading-tight:1.25;--seki-leading-normal:1.5;--seki-leading-relaxed:1.75}:host{--seki-radius-sm:0.25rem;--seki-radius-md:0.375rem;--seki-radius-lg:0.5rem;--seki-radius-xl:1rem;}:host{--seki-sidebar-width:16rem;--seki-sidebar-width-icon:3rem;--seki-sidebar-width-mobile:18rem;--seki-sidebar-background:hsl(0, 0%, 98%);--seki-sidebar-foreground:hsl(240, 5.3%, 26.1%);--seki-sidebar-primary:hsl(240, 5.9%, 10%);--seki-sidebar-primary-foreground:hsl(0, 0%, 98%);--seki-sidebar-accent:hsl(240, 4.8%, 95.9%);--seki-sidebar-accent-foreground:hsl(240, 5.9%, 10%);--seki-sidebar-border:hsl(220, 13%, 91%);--seki-sidebar-ring:hsl(217.2, 91.2%, 59.8%);--seki-sidebar-muted-foreground:hsl(240, 3.8%, 46.1%);--seki-sidebar-menu-button-height:2rem;--seki-sidebar-menu-button-height-lg:3rem;--seki-sidebar-menu-button-padding:0.5rem;--seki-sidebar-menu-button-gap:0.5rem;--seki-sidebar-menu-button-radius:var(--seki-radius-md, 0.375rem);--seki-sidebar-menu-sub-padding-left:1.75rem;--seki-sidebar-menu-sub-border-width:1px;--seki-sidebar-group-padding:0.5rem;--seki-sidebar-group-label-height:2rem;--seki-sidebar-group-label-padding:0.5rem;--seki-sidebar-header-height:auto;--seki-sidebar-footer-height:auto;--seki-sidebar-header-padding:0.5rem;--seki-sidebar-footer-padding:0.5rem;--seki-sidebar-content-padding:0.5rem;--seki-sidebar-rail-width:1rem;--seki-sidebar-transition-duration:200ms;--seki-sidebar-transition-timing:ease-in-out;--seki-sidebar-mobile-breakpoint:768px;--seki-sidebar-overlay-bg:hsla(0, 0%, 0%, 0.8)}:host([data-theme='dark']){--seki-sidebar-background:hsl(240, 5.9%, 10%);--seki-sidebar-foreground:hsl(240, 4.8%, 95.9%);--seki-sidebar-primary:hsl(0, 0%, 98%);--seki-sidebar-primary-foreground:hsl(240, 5.9%, 10%);--seki-sidebar-accent:hsl(240, 3.7%, 15.9%);--seki-sidebar-accent-foreground:hsl(240, 4.8%, 95.9%);--seki-sidebar-border:hsl(240, 3.7%, 15.9%);--seki-sidebar-ring:hsl(217.2, 91.2%, 59.8%);--seki-sidebar-muted-foreground:hsl(240, 5%, 64.9%)}:host{--seki-animation-fast:150ms;--seki-animation-normal:200ms;--seki-animation-slow:300ms;--seki-ease-in:cubic-bezier(0.4, 0, 1, 1);--seki-ease-out:cubic-bezier(0, 0, 0.2, 1);--seki-ease-in-out:cubic-bezier(0.4, 0, 0.2, 1);--seki-accordion-content-height:auto}@keyframes seki-fade-in{from{opacity:0}to{opacity:1}}@keyframes seki-fade-out{from{opacity:1}to{opacity:0}}@keyframes seki-scale-in{from{opacity:0;transform:scale(0.95)}to{opacity:1;transform:scale(1)}}@keyframes seki-scale-out{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0.95)}}@keyframes seki-slide-in-from-top{from{transform:translateY(-100%)}to{transform:translateY(0)}}@keyframes seki-slide-out-to-top{from{transform:translateY(0)}to{transform:translateY(-100%)}}@keyframes seki-slide-in-from-bottom{from{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes seki-slide-out-to-bottom{from{transform:translateY(0)}to{transform:translateY(100%)}}@keyframes seki-slide-in-from-left{from{transform:translateX(-100%)}to{transform:translateX(0)}}@keyframes seki-slide-out-to-left{from{transform:translateX(0)}to{transform:translateX(-100%)}}@keyframes seki-slide-in-from-right{from{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes seki-slide-out-to-right{from{transform:translateX(0)}to{transform:translateX(100%)}}@keyframes seki-accordion-down{from{height:0;opacity:0}to{height:var(--seki-accordion-content-height);opacity:1}}@keyframes seki-accordion-up{from{height:var(--seki-accordion-content-height);opacity:1}to{height:0;opacity:0}}@keyframes seki-zoom-in{from{opacity:0;transform:scale(0.96)}to{opacity:1;transform:scale(1)}}@keyframes seki-zoom-out{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0.96)}}@keyframes seki-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}@keyframes seki-pulse{0%,100%{opacity:1}50%{opacity:0.5}}@keyframes seki-bounce{0%,100%{transform:translateY(-25%);animation-timing-function:cubic-bezier(0.8, 0, 1, 1)}50%{transform:translateY(0);animation-timing-function:cubic-bezier(0, 0, 0.2, 1)}}@keyframes seki-collapsible-open{from{height:0;overflow:hidden}to{height:var(--seki-collapsible-content-height, auto)}}@keyframes seki-collapsible-close{from{height:var(--seki-collapsible-content-height, auto)}to{height:0;overflow:hidden}}@keyframes seki-toast-slide-in-right{from{transform:translateX(calc(100% + 1rem))}to{transform:translateX(0)}}@keyframes seki-toast-slide-out-right{from{transform:translateX(0)}to{transform:translateX(calc(100% + 1rem))}}@keyframes seki-toast-swipe-out{from{transform:translateX(var(--seki-toast-swipe-end-x, 0))}to{transform:translateX(calc(100% + 1rem))}}.seki-animate-fade-in{animation:seki-fade-in var(--seki-animation-normal) var(--seki-ease-out)}.seki-animate-fade-out{animation:seki-fade-out var(--seki-animation-normal) var(--seki-ease-in)}.seki-animate-scale-in{animation:seki-scale-in var(--seki-animation-normal) var(--seki-ease-out)}.seki-animate-scale-out{animation:seki-scale-out var(--seki-animation-normal) var(--seki-ease-in)}.seki-animate-spin{animation:seki-spin 1s linear infinite}.seki-animate-pulse{animation:seki-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite}.seki-animate-bounce{animation:seki-bounce 1s infinite}@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important}}:host{--seki-drawer-bg:var(--seki-background, hsl(0 0% 100%));--seki-drawer-border:var(--seki-border, hsl(240 5.9% 90%));--seki-drawer-text:var(--seki-foreground, hsl(240 10% 3.9%));--seki-drawer-text-muted:var(--seki-muted-foreground, hsl(240 3.8% 46.1%));--seki-drawer-handle-bg:var(--seki-muted-foreground, hsl(240 3.8% 46.1%));--seki-drawer-overlay-bg:rgba(0, 0, 0, 0.5);--seki-drawer-shadow:0 -10px 15px -3px rgba(0, 0, 0, 0.1), 0 -4px 6px -4px rgba(0, 0, 0, 0.1);--seki-drawer-font-family:var(--seki-font-sans, system-ui, -apple-system, sans-serif);--seki-drawer-max-height:96vh;--seki-drawer-max-width:24rem;--seki-drawer-z-index:50;--seki-drawer-snap-duration:0.3s;display:contents}:host([data-theme='dark']){--seki-drawer-bg:var(--seki-background, hsl(240 10% 3.9%));--seki-drawer-border:var(--seki-border, hsl(240 3.7% 15.9%));--seki-drawer-text:var(--seki-foreground, hsl(0 0% 98%));--seki-drawer-text-muted:var(--seki-muted-foreground, hsl(240 5% 64.9%));--seki-drawer-handle-bg:var(--seki-muted-foreground, hsl(240 5% 64.9%));--seki-drawer-overlay-bg:rgba(0, 0, 0, 0.7)}.seki-drawer{display:contents}.seki-drawer-overlay{position:fixed;inset:0;background:var(--seki-drawer-overlay-bg);z-index:var(--seki-drawer-z-index);animation:drawerFadeIn var(--seki-drawer-snap-duration) ease}@keyframes drawerFadeIn{from{opacity:0}to{opacity:1}}.seki-drawer-content{position:fixed;z-index:calc(var(--seki-drawer-z-index) + 1);background:var(--seki-drawer-bg);box-shadow:var(--seki-drawer-shadow);font-family:var(--seki-drawer-font-family);display:flex;flex-direction:column;overflow:hidden;touch-action:none;will-change:transform}.seki-drawer-content--bottom{bottom:0;left:0;right:0;max-height:var(--seki-drawer-max-height);border-top:1px solid var(--seki-drawer-border);border-top-left-radius:var(--seki-radius-lg, 0.5rem);border-top-right-radius:var(--seki-radius-lg, 0.5rem)}.seki-drawer-content--top{top:0;left:0;right:0;max-height:var(--seki-drawer-max-height);border-bottom:1px solid var(--seki-drawer-border);border-bottom-left-radius:var(--seki-radius-lg, 0.5rem);border-bottom-right-radius:var(--seki-radius-lg, 0.5rem)}.seki-drawer-content--right{top:0;right:0;bottom:0;width:var(--seki-drawer-max-width);max-width:100%;border-left:1px solid var(--seki-drawer-border)}.seki-drawer-content--left{top:0;left:0;bottom:0;width:var(--seki-drawer-max-width);max-width:100%;border-right:1px solid var(--seki-drawer-border)}.seki-drawer-handle{width:3rem;height:0.25rem;background:var(--seki-drawer-handle-bg);border-radius:9999px;margin:0.75rem auto;opacity:0.4;flex-shrink:0}.seki-drawer-content--bottom .seki-drawer-handle{margin-top:0.75rem;margin-bottom:0.5rem}.seki-drawer-content--top .seki-drawer-handle{margin-top:0.5rem;margin-bottom:0.75rem;order:999;}.seki-drawer-content--left .seki-drawer-handle,.seki-drawer-content--right .seki-drawer-handle{width:0.25rem;height:3rem;margin:auto 0.75rem}.seki-drawer-body{flex:1;overflow:auto;overscroll-behavior:contain}.seki-drawer-close-button{position:absolute;top:1rem;right:1rem;display:inline-flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;padding:0;border:none;border-radius:var(--seki-radius-sm, 4px);background:transparent;color:var(--seki-drawer-text-muted);cursor:pointer;opacity:0.7;transition:opacity 0.15s ease;z-index:1}.seki-drawer-close-button:hover{opacity:1}.seki-drawer-close-button:focus-visible{outline:2px solid var(--seki-ring, hsl(240 5.9% 10%));outline-offset:2px}.seki-drawer-close-button svg{width:1rem;height:1rem}[data-dragging=\"false\"] .seki-drawer-content{transition:transform var(--seki-drawer-snap-duration) cubic-bezier(0.32, 0.72, 0, 1)}[data-dragging=\"true\"] .seki-drawer-content{transition:none}@media (prefers-reduced-motion: reduce){.seki-drawer-overlay,.seki-drawer-content{animation:none;transition:none}}";
+
+const SekiDrawer$1 = /*@__PURE__*/ proxyCustomElement(class SekiDrawer extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+        this.drawerOpen = createEvent(this, "drawerOpen");
+        this.drawerClose = createEvent(this, "drawerClose");
+        this.drawerSnap = createEvent(this, "drawerSnap");
+        /**
+         * Internal state for drawer open/closed
+         */
+        this.isOpen = false;
+        /**
+         * Current snap point (0-1)
+         */
+        this.currentSnapPoint = 1;
+    }
+    /**
+     * Opens the drawer
+     */
+    async open() {
+        this.isOpen = true;
+        this.currentSnapPoint = 1;
+        this.drawerOpen.emit();
+    }
+    /**
+     * Closes the drawer
+     */
+    async close() {
+        this.isOpen = false;
+        this.currentSnapPoint = 0;
+        this.drawerClose.emit();
+    }
+    /**
+     * Toggles the drawer
+     */
+    async toggle() {
+        if (this.isOpen) {
+            await this.close();
+        }
+        else {
+            await this.open();
+        }
+    }
+    /**
+     * Snaps to a specific point (0-1)
+     */
+    async snapTo(point) {
+        if (point <= 0) {
+            await this.close();
+        }
+        else {
+            this.currentSnapPoint = point;
+            this.isOpen = true;
+            this.drawerSnap.emit({ point });
+        }
+    }
+    handleTriggerClick() {
+        this.toggle();
+    }
+    handleRequestClose() {
+        this.close();
+    }
+    handleRequestSnap(event) {
+        this.snapTo(event.detail.point);
+    }
+    handleKeydown(ev) {
+        if (this.isOpen && ev.key === 'Escape') {
+            this.close();
+        }
+    }
+    render() {
+        return (h("div", { key: 'a31fdf12fbfae8155fc311d28a600f7c7fa1fc2b', class: {
+                'seki-drawer': true,
+                'seki-drawer--open': this.isOpen,
+            }, "data-snap-point": this.currentSnapPoint, part: "drawer" }, h("slot", { key: 'bfe80c5c9597018175c51211079e91896ba3bb4d' }), this.isOpen && (h("div", { key: 'd7e8c150b673bf6198ea706ee6d876f77ad7a55b', class: "seki-drawer-overlay", part: "overlay", onClick: () => this.close() }))));
+    }
+    static get style() { return sekiDrawerCss; }
+}, [257, "seki-drawer", {
+        "isOpen": [32],
+        "currentSnapPoint": [32],
+        "open": [64],
+        "close": [64],
+        "toggle": [64],
+        "snapTo": [64]
+    }, [[0, "triggerClick", "handleTriggerClick"], [0, "requestClose", "handleRequestClose"], [0, "requestSnap", "handleRequestSnap"], [8, "keydown", "handleKeydown"]]]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["seki-drawer"];
+    components.forEach(tagName => { switch (tagName) {
+        case "seki-drawer":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, SekiDrawer$1);
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const SekiDrawer = SekiDrawer$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { SekiDrawer, defineCustomElement };

package/dist/cdn/seki-dropdown-menu-checkbox.js

@@ -42,10 +42,10 @@ const SekiDropdownMenuCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class SekiDr
         this._checked = this.checked;
     }
     render() {
-        return (h(Host, { key: '50e535df7389f3c079f5ef7df376c8d6b9a463aa' }, h("div", { key: '84bf1f78b848ef16155b642c8ffe61cd99126ad6', part: "item", role: "menuitemcheckbox", class: {
+        return (h(Host, { key: '260baae1b86071e98613b965bb2e490f5f118ae4' }, h("div", { key: '71cca19b0bdca8f005ac26583156659fa3500467', part: "item", role: "menuitemcheckbox", class: {
                 'dropdown-menu-checkbox': true,
                 'dropdown-menu-checkbox--disabled': this.disabled,
-            }, tabindex: this.disabled ? -1 : 0, "aria-checked": this._checked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("span", { key: 'be68e7b650b22ca9de908b78803efcd83d8a5f1e', part: "indicator", class: "dropdown-menu-checkbox__indicator" }, this._checked && (h("svg", { key: '5a235e7d11840d3b3dc2a0501e3226a257fe02ae', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("polyline", { key: '5425469bfebab0f28fadc1019770650f67379ada', points: "20 6 9 17 4 12" })))), h("slot", { key: '17d41aab4f26dcad6fc07a82906485e702bd11d6' }))));
+            }, tabindex: this.disabled ? -1 : 0, "aria-checked": this._checked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("span", { key: '5c7df8e2061f41a976d4b61dc8c43290f404ee58', part: "indicator", class: "dropdown-menu-checkbox__indicator" }, this._checked && (h("svg", { key: '8eef4e68c5a8664c59bdd19a8f7b1d1b3afe619e', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("polyline", { key: '65e7e8073470c5073f7806a0389b0c9d5d5d394e', points: "20 6 9 17 4 12" })))), h("slot", { key: '85318678b6c9406a032d623430906b7eb4bb6918' }))));
     }
     static get watchers() { return {
         "checked": ["watchChecked"]

package/dist/cdn/seki-dropdown-menu-item.js

@@ -35,16 +35,26 @@ const SekiDropdownMenuItem$1 = /*@__PURE__*/ proxyCustomElement(class SekiDropdo
         };
     }
     getContext() {
-        const menu = this.el.closest('seki-dropdown-menu');
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        return menu ? menu._dropdownMenuContext : null;
+        // Try dropdown menu first
+        const dropdownMenu = this.el.closest('seki-dropdown-menu');
+        if (dropdownMenu) {
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            return dropdownMenu._dropdownMenuContext;
+        }
+        // Try context menu
+        const contextMenu = this.el.closest('seki-context-menu');
+        if (contextMenu) {
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            return contextMenu._contextMenuContext;
+        }
+        return null;
     }
     render() {
-        return (h(Host, { key: 'be569b372f67e0f4a68254ca6aa107be9c20e7aa' }, h("div", { key: '1f22bcf12b10c1f918d9b9da7ecbc6c2bc2d14d4', part: "item", role: "menuitem", class: {
+        return (h(Host, { key: 'd38d7f14636e2f2b62c6a8dc532d4391f5560863' }, h("div", { key: '7512f3974cd7ded0909346ee7ec8d09ed87db56d', part: "item", role: "menuitem", class: {
                 'dropdown-menu-item': true,
                 'dropdown-menu-item--disabled': this.disabled,
                 'dropdown-menu-item--inset': this.inset,
-            }, tabindex: this.disabled ? -1 : 0, "aria-disabled": this.disabled ? 'true' : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("slot", { key: 'b9d0128d3403b4f6b38478278383a98c15fcd921' }))));
+            }, tabindex: this.disabled ? -1 : 0, "aria-disabled": this.disabled ? 'true' : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("slot", { key: 'c1254310e2a4c3244e82b08172a3525a19a64b31' }))));
     }
     get el() { return this; }
     static get style() { return sekiDropdownMenuItemCss; }

package/dist/cdn/seki-dropdown-menu-label.js

@@ -15,10 +15,10 @@ const SekiDropdownMenuLabel$1 = /*@__PURE__*/ proxyCustomElement(class SekiDropd
         this.inset = false;
     }
     render() {
-        return (h(Host, { key: 'a61b4d9ee97c7eae5b0ac39262f52d840f819266' }, h("div", { key: 'd9591882cf045fd3dddf515062c7188ccb2cf148', part: "label", class: {
+        return (h(Host, { key: '76bbcdf532ae6b4d212974f04a434a2000a10d14' }, h("div", { key: 'dea417897bb24efcbcfbf775e4c5ef95c46baabb', part: "label", class: {
                 'dropdown-menu-label': true,
                 'dropdown-menu-label--inset': this.inset,
-            } }, h("slot", { key: '08b3004e77013be6b081223ac180a284280365fa' }))));
+            } }, h("slot", { key: 'f01986ae7e808e97e57d533f8c28c66269c7dee8' }))));
     }
     static get style() { return sekiDropdownMenuLabelCss; }
 }, [257, "seki-dropdown-menu-label", {

package/dist/cdn/seki-dropdown-menu-radio-group.js

@@ -33,7 +33,7 @@ const SekiDropdownMenuRadioGroup$1 = /*@__PURE__*/ proxyCustomElement(class Seki
         this._radioGroupContext.setValue(event.detail);
     }
     render() {
-        return (h(Host, { key: 'de0c1b63b8471fb4cd9396b380cae41f13be1315' }, h("div", { key: 'fc5f38afea817f40a1fca3f9256540eb29454b1b', part: "group", role: "group", class: "dropdown-menu-radio-group" }, h("slot", { key: 'a8dfd98fbcbf394e9e250434724d8a27cb66d89f' }))));
+        return (h(Host, { key: '743dea0971caf6eacd511c2e197f45b97c7a6e6c' }, h("div", { key: 'e61c223eabeb13f15e1a2ebe474c8b8ebff7c3af', part: "group", role: "group", class: "dropdown-menu-radio-group" }, h("slot", { key: '07aa22872153cc3d5c778d999d219809439f3618' }))));
     }
     static get watchers() { return {
         "value": ["watchValue"]

package/dist/cdn/seki-dropdown-menu-radio.js

@@ -48,10 +48,10 @@ const SekiDropdownMenuRadio$1 = /*@__PURE__*/ proxyCustomElement(class SekiDropd
         }
     }
     render() {
-        return (h(Host, { key: '11d051ac22871b83d89ece1b73549822e325089d' }, h("div", { key: '99cbad1d639cef0ffd61d7901b84147e9c290ac4', part: "item", role: "menuitemradio", class: {
+        return (h(Host, { key: '16d7ae2664b71c3a795f59fea06eb2ec3cf777f3' }, h("div", { key: '73cbe7d31c018094793c12fe0f7e333062a09c16', part: "item", role: "menuitemradio", class: {
                 'dropdown-menu-radio': true,
                 'dropdown-menu-radio--disabled': this.disabled,
-            }, tabindex: this.disabled ? -1 : 0, "aria-checked": this._isChecked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("span", { key: '851df3c6b080aba46174f011fde512538974db28', part: "indicator", class: "dropdown-menu-radio__indicator" }, this._isChecked && (h("svg", { key: '5f00d779565dca07a4f681de733397eaaab3b7a1', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor" }, h("circle", { key: '2cdcea3be28123cb77e01205c7ad5a9d84f528b4', cx: "12", cy: "12", r: "4" })))), h("slot", { key: '592feb955766f3edacea51a7dac6476596e84402' }))));
+            }, tabindex: this.disabled ? -1 : 0, "aria-checked": this._isChecked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, h("span", { key: 'bdf73a083438aacbd09e5786fc2a03c49da1b11a', part: "indicator", class: "dropdown-menu-radio__indicator" }, this._isChecked && (h("svg", { key: '893efae5621a0cbb36862f7ad8216115033221e6', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor" }, h("circle", { key: '61996b36d71413ef174990b55fa800fe1e61911b', cx: "12", cy: "12", r: "4" })))), h("slot", { key: '9345aa5e47cc8231f28c971807b13762936cb839' }))));
     }
     get el() { return this; }
     static get style() { return sekiDropdownMenuRadioCss; }

package/dist/cdn/seki-dropdown-menu-separator.js

@@ -11,7 +11,7 @@ const SekiDropdownMenuSeparator$1 = /*@__PURE__*/ proxyCustomElement(class SekiD
         this.__attachShadow();
     }
     render() {
-        return (h(Host, { key: 'a2fde79c6d66674749b69437d935a59379ed2bc1' }, h("div", { key: '17fee469717e65f0d11194239436fc69b73b94bc', part: "separator", role: "separator", class: "dropdown-menu-separator" })));
+        return (h(Host, { key: '549a6d47b3ea409a4cbefe833d16af6f4ccd8599' }, h("div", { key: '343c18f5765c34eed991fa2763e73bee83654a74', part: "separator", role: "separator", class: "dropdown-menu-separator" })));
     }
     static get style() { return sekiDropdownMenuSeparatorCss; }
 }, [257, "seki-dropdown-menu-separator"]);

package/dist/cdn/seki-dropdown-menu-shortcut.js

@@ -11,7 +11,7 @@ const SekiDropdownMenuShortcut$1 = /*@__PURE__*/ proxyCustomElement(class SekiDr
         this.__attachShadow();
     }
     render() {
-        return (h(Host, { key: 'fdc9b1aa9d753829c8a40880525266024aed4b4f' }, h("span", { key: '659670cc60fd40ccb770a97924dadd60e6008d38', part: "shortcut", class: "dropdown-menu-shortcut" }, h("slot", { key: 'dddcebd4582a5056c481f2042a979fcd63ed20b1' }))));
+        return (h(Host, { key: '8ec6ae149ec3ffc0a2dfd1b13d129aa7027925ac' }, h("span", { key: 'bd1f5a35e2dccb318c82514fff31d153b038713b', part: "shortcut", class: "dropdown-menu-shortcut" }, h("slot", { key: 'd0dfea6ec0ba50e3c6abbe69b65a6b4e19b5365d' }))));
     }
     static get style() { return sekiDropdownMenuShortcutCss; }
 }, [257, "seki-dropdown-menu-shortcut"]);

package/dist/cdn/seki-dropdown-menu-sub.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface SekiDropdownMenuSub extends Components.SekiDropdownMenuSub, HTMLElement {}
+export const SekiDropdownMenuSub: {
+    prototype: SekiDropdownMenuSub;
+    new (): SekiDropdownMenuSub;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;