@mhmo91/schmancy 0.9.17 → 0.9.19

package/dist/navigation-rail.js.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-rail.js","names":[],"sources":["../src/navigation-rail/navigation-rail-item.ts","../src/navigation-rail/navigation-rail.ts"],"sourcesContent":["import { $LitElement } from '@mixins/index'\nimport { html, PropertyValues } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { when } from 'lit/directives/when.js'\nimport { BehaviorSubject, fromEvent, merge, takeUntil } from 'rxjs'\nimport { delay, distinctUntilChanged, tap } from 'rxjs/operators'\n\nexport type NavigationRailItemClickEvent = CustomEvent<{\n\ticon: string\n\tlabel: string\n\tvalue: string\n\tactive: boolean\n}>\n\n/**\n * Material Design 3 Navigation Rail Item Component\n * @see https://m3.material.io/components/navigation-rail/overview\n *\n * `<schmancy-navigation-rail-item>` component\n *\n * Individual navigation item for use within a navigation rail.\n * Represents a single destination or action with an icon and optional label.\n *\n * @element schmancy-navigation-rail-item\n * @slot icon - Slot for the navigation item icon (e.g., schmancy-icon)\n * @slot - Default slot for custom content\n * @slot badge - Custom badge content\n *\n * @fires navigate - When the item is clicked\n *\n * @csspart container - The main item container\n * @csspart indicator - The active indicator\n * @csspart icon - The icon container\n * @csspart label - The label text\n * @csspart badge - The badge element\n *\n * @example\n * <schmancy-navigation-rail-item\n *   icon=\"home\"\n *   label=\"Home\"\n *   value=\"/home\"\n *   badge=\"3\"\n *   active>\n * </schmancy-navigation-rail-item>\n *\n * @example\n * <!-- Using 'selected' alias -->\n * <schmancy-navigation-rail-item\n *   icon=\"settings\"\n *   label=\"Settings\"\n *   value=\"/settings\"\n *   selected>\n * </schmancy-navigation-rail-item>\n *\n * @example\n * <!-- With custom icon -->\n * <schmancy-navigation-rail-item label=\"Dashboard\">\n *   <schmancy-icon slot=\"icon\">dashboard</schmancy-icon>\n * </schmancy-navigation-rail-item>\n */\n@customElement('schmancy-navigation-rail-item')\nexport class SchmancyNavigationRailItem extends $LitElement() {\n\t// Observable state\n\tprivate hovering$ = new BehaviorSubject<boolean>(false)\n\tprivate pressing$ = new BehaviorSubject<boolean>(false)\n\tprivate active$ = new BehaviorSubject<boolean>(false)\n\n\t// Properties\n\t/**\n\t * Icon name (Material Symbols icon)\n\t */\n\t@property({ type: String })\n\ticon = ''\n\n\t/**\n\t * Label text for the navigation item\n\t */\n\t@property({ type: String })\n\tlabel = ''\n\n\t/**\n\t * Value associated with this item (useful for routing)\n\t */\n\t@property({ type: String })\n\tvalue = ''\n\n\t/**\n\t * Whether this item is currently active/selected\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tget active() {\n\t\treturn this.active$.value\n\t}\n\tset active(value: boolean) {\n\t\tthis.active$.next(value)\n\t}\n\n\t/**\n\t * Whether this item is currently selected (alias for active)\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tget selected() {\n\t\treturn this.active\n\t}\n\tset selected(value: boolean) {\n\t\tthis.active = value\n\t}\n\n\t/**\n\t * Badge text or number to display\n\t */\n\t@property({ type: String })\n\tbadge = ''\n\n\t/**\n\t * Badge variant\n\t */\n\t@property({ type: String })\n\tbadgeVariant: 'error' | 'primary' | 'secondary' = 'error'\n\n\t/**\n\t * Whether to show the label (controlled by parent rail)\n\t * @default false\n\t */\n\t@property({ type: Boolean, attribute: 'show-label' })\n\tshowLabel = false\n\n\t/**\n\t * Whether this item is disabled\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tdisabled = false\n\n\t/**\n\t * Whether this is a nested item (sub-navigation)\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tnested = false\n\n\t/**\n\t * Whether this item represents a group separator\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tgroup = false\n\n\t// State\n\t@state()\n\tprivate showRipple = false\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\n\t\t// Set up hover tracking\n\t\tmerge(\n\t\t\tfromEvent(this, 'mouseenter').pipe(tap(() => this.hovering$.next(true))),\n\t\t\tfromEvent(this, 'mouseleave').pipe(tap(() => this.hovering$.next(false))),\n\t\t)\n\t\t\t.pipe(takeUntil(this.disconnecting))\n\t\t\t.subscribe()\n\n\t\t// Set up press tracking\n\t\tmerge(\n\t\t\tfromEvent(this, 'mousedown').pipe(tap(() => this.pressing$.next(true))),\n\t\t\tfromEvent(this, 'mouseup').pipe(tap(() => this.pressing$.next(false))),\n\t\t\tfromEvent(this, 'mouseleave').pipe(tap(() => this.pressing$.next(false))),\n\t\t)\n\t\t\t.pipe(takeUntil(this.disconnecting))\n\t\t\t.subscribe()\n\n\t\t// Ripple effect with M3 timing\n\t\tthis.pressing$\n\t\t\t.pipe(\n\t\t\t\ttap(pressing => {\n\t\t\t\t\tif (pressing && !this.disabled) {\n\t\t\t\t\t\tthis.showRipple = true\n\t\t\t\t\t}\n\t\t\t\t}),\n\t\t\t\t// M3 standard ripple duration\n\t\t\t\tdelay(600),\n\t\t\t\ttap(() => (this.showRipple = false)),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe()\n\n\t\t// Subscribe to active state changes for reactive updates\n\t\tthis.active$\n\t\t\t.pipe(\n\t\t\t\tdistinctUntilChanged(),\n\t\t\t\ttap(isActive => {\n\t\t\t\t\tthis.requestUpdate()\n\t\t\t\t\t// Update ARIA attributes reactively\n\t\t\t\t\tthis.setAttribute('aria-selected', String(isActive))\n\t\t\t\t\tthis.setAttribute('tabindex', isActive ? '0' : '-1')\n\t\t\t\t}),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe()\n\n\t\t// Set ARIA attributes\n\t\tthis.setAttribute('role', 'listitem')\n\t\tif (!this.hasAttribute('tabindex')) {\n\t\t\tthis.setAttribute('tabindex', this.active ? '0' : '-1')\n\t\t}\n\t}\n\n\tupdated(changedProperties: PropertyValues) {\n\t\tsuper.updated(changedProperties)\n\n\t\t// Active state is now handled by the BehaviorSubject subscription\n\t\t// So we don't need to duplicate it here\n\n\t\tif (changedProperties.has('disabled')) {\n\t\t\tthis.setAttribute('aria-disabled', String(this.disabled))\n\t\t}\n\n\t\tif (changedProperties.has('label')) {\n\t\t\tthis.setAttribute('aria-label', this.label)\n\t\t}\n\t}\n\n\t/**\n\t * Handle click events\n\t */\n\tprivate handleClick(event: Event) {\n\t\tif (this.disabled) {\n\t\t\tevent.preventDefault()\n\t\t\tevent.stopPropagation()\n\t\t\treturn\n\t\t}\n\n\t\t// Emit navigate event with the value\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('navigate', {\n\t\t\t\tdetail: this.value || this.label,\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\n\t\t// Visual feedback is handled by the ripple effect in connectedCallback\n\t\t// The parent rail will confirm and update via activeIndex\n\t}\n\n\t/**\n\t * Handle keyboard events\n\t */\n\tprivate handleKeyDown(event: KeyboardEvent) {\n\t\tif (this.disabled) return\n\n\t\tif (event.key === 'Enter' || event.key === ' ') {\n\t\t\tevent.preventDefault()\n\t\t\tthis.click()\n\t\t}\n\t}\n\n\tprotected render() {\n\t\tconst hasCustomIcon = !!this.querySelector('[slot=\"icon\"]')\n\t\tconst hasCustomBadge = this.querySelector('[slot=\"badge\"]')\n\n\t\t// M3 Navigation Rail Item classes with theme integration\n\t\tconst containerClasses = this.classMap({\n\t\t\t// Layout & Spacing (M3 56px height, 12px vertical padding)\n\t\t\t'flex flex-col items-center justify-center': true,\n\t\t\t'min-h-14 w-full': true, // min-h-14 = 56px\n\t\t\t'py-3': true, // py-3 = 12px top/bottom\n\t\t\t'gap-1': true, // gap-1 = 4px\n\n\t\t\t// M3 Shape & Interaction\n\t\t\t'rounded-lg': true, // M3 large corner radius\n\t\t\t'cursor-pointer': true,\n\t\t\trelative: true,\n\t\t\t'select-none': true,\n\t\t\t'box-border': true,\n\n\t\t\t// Colors & States\n\t\t\t'text-surface-onVariant': !this.active,\n\t\t\t'text-secondary-onContainer': this.active,\n\t\t\t'hover:bg-surface-containerHighest': true,\n\n\t\t\t// Transitions (M3 emphasized motion)\n\t\t\t'transition-all duration-150 ease-out': true,\n\n\t\t\t// Disabled state\n\t\t\t'pointer-events-none opacity-38': this.disabled,\n\n\t\t\t// Active ripple effect\n\t\t\t'[&>.ripple]:scale-100': this.showRipple,\n\n\t\t\t// Nested item adjustments\n\t\t\t'min-h-12 pl-8': this.nested, // 48px height, 32px left padding for nested\n\n\t\t\t// Group separator\n\t\t\t'mb-2 after:absolute after:bottom-[-4px] after:left-3 after:right-3 after:h-px after:bg-outline-variant after:opacity-12':\n\t\t\t\tthis.group,\n\t\t})\n\n\t\t// Icon container with active indicator\n\t\tconst iconContainerClasses = this.classMap({\n\t\t\t'flex items-center justify-center': true,\n\t\t\t'w-auto min-w-14 h-8': true, // 56px min-width, 32px height\n\t\t\t'shrink-0 relative z-10': true,\n\t\t})\n\n\t\t// Active indicator behind icon\n\t\tconst indicatorClasses = this.classMap({\n\t\t\t'absolute top-1/2 left-1/2 opacity-30': true,\n\t\t\t'w-14 h-8': true, // 56px x 32px\n\t\t\t'rounded-lg': true, // M3 large corner radius\n\t\t\t'bg-secondary-container': true,\n\t\t\t'transition-transform duration-150 ease-out': true,\n\t\t\t// Transform based on active state\n\t\t\t'scale-0 -translate-x-1/2 -translate-y-1/2': !this.active,\n\t\t\t'scale-100 -translate-x-1/2 -translate-y-1/2': this.active,\n\t\t})\n\n\t\t// Icon styling\n\t\tconst iconClasses = this.classMap({\n\t\t\t'relative z-100': true,\n\t\t\t'text-2xl leading-none': !this.nested, // 24px icon for normal\n\t\t\t'text-xl leading-none': this.nested, // 20px icon for nested\n\t\t\t// Material Symbols font variations handled via CSS custom properties\n\t\t})\n\n\t\t// Label styling\n\t\tconst labelClasses = this.classMap({\n\t\t\t'text-xs font-medium leading-4': true, // 12px, medium weight, 16px line height\n\t\t\t'text-center': true,\n\t\t\t'overflow-hidden text-ellipsis whitespace-nowrap': true,\n\t\t\t'z-10 max-w-14 px-1': true, // max 56px width, 4px horizontal padding\n\t\t\thidden: !this.showLabel && !this.label, // Hide if not shown or no label\n\t\t})\n\n\t\t// Badge styling with dynamic colors\n\t\tconst badgeClasses = this.classMap({\n\t\t\t'absolute top-2 right-3': true, // 8px from top, 12px from right\n\t\t\t'min-w-4 h-4': true, // 16px min-width and height\n\t\t\t'rounded-sm': true, // M3 small corner radius\n\t\t\t'text-xs font-semibold': true, // 11px, 600 weight\n\t\t\t'flex items-center justify-center': true,\n\t\t\t'px-1 box-border z-20': true, // 4px padding\n\t\t\t'animate-pulse': true, // Pulse animation\n\t\t\t// Dynamic background based on variant\n\t\t\t'bg-error-default text-error-on': this.badgeVariant === 'error',\n\t\t\t'bg-primary-default text-primary-on': this.badgeVariant === 'primary',\n\t\t\t'bg-secondary-default text-secondary-on': this.badgeVariant === 'secondary',\n\t\t})\n\n\t\t// Ripple effect classes\n\t\tconst rippleClasses = this.classMap({\n\t\t\t'absolute inset-0 rounded-lg overflow-hidden z-0': true,\n\t\t\t'before:content-[\"\"] before:absolute before:top-1/2 before:left-1/2': true,\n\t\t\t'before:w-0 before:h-0 before:rounded-full': true,\n\t\t\t'before:bg-current before:opacity-0': true,\n\t\t\t'before:-translate-x-1/2 before:-translate-y-1/2': true,\n\t\t\t'before:transition-all before:duration-300': true,\n\t\t\t// Active state\n\t\t\t'before:w-[200%] before:h-[200%] before:opacity-12': this.showRipple,\n\t\t})\n\n\t\treturn html`\n\t\t\t<div\n\t\t\t\tclass=${containerClasses}\n\t\t\t\tpart=\"container\"\n\t\t\t\t@click=${this.handleClick}\n\t\t\t\t@keydown=${this.handleKeyDown}\n\t\t\t\tstyle=\"outline: ${this.matches(':focus-visible')\n\t\t\t\t\t? '2px solid var(--schmancy-sys-color-primary-default)'\n\t\t\t\t\t: 'none'}; outline-offset: 2px;\"\n\t\t\t>\n\t\t\t\t<span class=${rippleClasses} aria-hidden=\"true\"></span>\n\n\t\t\t\t<div class=${iconContainerClasses} part=\"icon\">\n\t\t\t\t\t<span class=${indicatorClasses} part=\"indicator\" aria-hidden=\"true\"></span>\n\t\t\t\t\t${when(\n\t\t\t\t\t\thasCustomIcon,\n\t\t\t\t\t\t() => html`<slot class=\"relative\" name=\"icon\"></slot>`,\n\t\t\t\t\t\t() =>\n\t\t\t\t\t\t\twhen(\n\t\t\t\t\t\t\t\tthis.icon,\n\t\t\t\t\t\t\t\t() => html`\n\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\tclass=${iconClasses}\n\t\t\t\t\t\t\t\t\t\tpart=\"icon-text\"\n\t\t\t\t\t\t\t\t\t\tstyle=\"font-family: 'Material Symbols Outlined'; font-variation-settings: 'FILL' ${this.active\n\t\t\t\t\t\t\t\t\t\t\t? '1'\n\t\t\t\t\t\t\t\t\t\t\t: '0'}, 'wght' 400, 'GRAD' 0, 'opsz' ${this.nested ? '20' : '24'};\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t${this.icon}\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t`,\n\t\t\t\t\t\t\t),\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\n\t\t\t\t${when(this.label, () => html`<span class=${labelClasses} part=\"label\">${this.label}</span>`)}\n\t\t\t\t${when(\n\t\t\t\t\tthis.badge,\n\t\t\t\t\t() => html`\n\t\t\t\t\t\t${when(\n\t\t\t\t\t\t\thasCustomBadge,\n\t\t\t\t\t\t\t() => html`<slot name=\"badge\"></slot>`,\n\t\t\t\t\t\t\t() => html`\n\t\t\t\t\t\t\t\t<span class=${badgeClasses} part=\"badge\" aria-label=\"${this.badge} notifications\"> ${this.badge} </span>\n\t\t\t\t\t\t\t`,\n\t\t\t\t\t\t)}\n\t\t\t\t\t`,\n\t\t\t\t)}\n\n\t\t\t\t<!-- Tooltip shown via title attribute -->\n\t\t\t\t${when(\n\t\t\t\t\tthis.hasAttribute('title'),\n\t\t\t\t\t() => html`\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass=\"\n\t\t\t\t\t\t\tabsolute left-[calc(100%+8px)] top-1/2 -translate-y-1/2\n\t\t\t\t\t\t\tbg-surface-inverse text-surface-inverseOn\n\t\t\t\t\t\t\tpx-2 py-1 rounded-sm text-xs whitespace-nowrap\n\t\t\t\t\t\t\tz-1000 pointer-events-none opacity-0\n\t\t\t\t\t\t\thover:opacity-100 hover:translate-x-0\n\t\t\t\t\t\t\ttransition-all duration-150 ease-out\n\t\t\t\t\t\t\t-translate-x-1\n\t\t\t\t\t\t\"\n\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t${this.getAttribute('title')}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t`,\n\t\t\t\t)}\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-navigation-rail-item': SchmancyNavigationRailItem\n\t}\n}\n","import { $LitElement } from '@mixins/index'\r\nimport { html, PropertyValues } from 'lit'\r\nimport { customElement, property, queryAssignedElements, state } from 'lit/decorators.js'\r\nimport { BehaviorSubject, fromEvent, takeUntil } from 'rxjs'\r\nimport { distinctUntilChanged, tap } from 'rxjs/operators'\r\nimport { SchmancyNavigationRailItem } from './navigation-rail-item'\r\n\r\nexport type NavigateEvent = CustomEvent<string>\r\n\r\nexport type NavigationRailMenuClickEvent = CustomEvent<void>\r\n\r\nexport type NavigationRailFabClickEvent = CustomEvent<void>\r\n\r\n\r\nexport type LabelVisibility = 'all' | 'selected' | 'none'\r\n\r\n/**\r\n * Material Design 3 Navigation Rail Component\r\n * @see https://m3.material.io/components/navigation-rail/overview\r\n *\r\n * `<schmancy-navigation-rail>` component\r\n *\r\n * A Material Design 3 vertical navigation component positioned on the left side of an application.\r\n * Navigation rails provide access to between 3-7 primary destinations with a compact footprint.\r\n * Automatically hides in fullscreen mode when triggered via schmancyTheme.next({ fullscreen: true }).\r\n *\r\n * @element schmancy-navigation-rail\r\n * @slot fab - Slot for a floating action button at the top\r\n * @slot menu - Slot for a menu icon or button below the FAB\r\n * @slot header - Custom header content slot\r\n * @slot footer - Custom footer content slot\r\n * @slot - Default slot for navigation rail items\r\n *\r\n * @fires navigate - When a navigation item is selected\r\n * @fires menu-click - When the menu button is clicked\r\n * @fires fab-click - When the FAB is clicked\r\n *\r\n * @csspart rail - The main rail container\r\n * @csspart header - The header section\r\n * @csspart nav - The navigation items container\r\n * @csspart footer - The footer section\r\n *\r\n * @example\r\n * <schmancy-navigation-rail activeIndex=\"0\">\r\n *   <schmancy-button slot=\"fab\" variant=\"filled\" aria-label=\"Compose\">\r\n *     <schmancy-icon>add</schmancy-icon>\r\n *   </schmancy-button>\r\n *   <schmancy-button slot=\"menu\" variant=\"text\" aria-label=\"Menu\">\r\n *     <schmancy-icon>menu</schmancy-icon>\r\n *   </schmancy-button>\r\n *   <schmancy-navigation-rail-item icon=\"home\" label=\"Home\"></schmancy-navigation-rail-item>\r\n *   <schmancy-navigation-rail-item icon=\"search\" label=\"Search\"></schmancy-navigation-rail-item>\r\n *   <schmancy-navigation-rail-item icon=\"favorite\" label=\"Favorites\" badge=\"3\"></schmancy-navigation-rail-item>\r\n *   <schmancy-navigation-rail-item icon=\"settings\" label=\"Settings\"></schmancy-navigation-rail-item>\r\n * </schmancy-navigation-rail>\r\n */\r\n@customElement('schmancy-navigation-rail')\r\nexport class SchmancyNavigationRail extends $LitElement() {\r\n\t// Observable state\r\n\tprivate activeIndex$ = new BehaviorSubject<number>(-1)\r\n\r\n\t// Properties\r\n\t/**\r\n\t * The currently active item index\r\n\t * @default -1\r\n\t */\r\n\t@property({ type: Number })\r\n\tget activeIndex() {\r\n\t\treturn this.activeIndex$.value\r\n\t}\r\n\tset activeIndex(value: number) {\r\n\t\tthis.activeIndex$.next(value)\r\n\t}\r\n\r\n\t/**\r\n\t * The currently active item value (for programmatic selection)\r\n\t */\r\n\t@property({ type: String })\r\n\tget activeValue() {\r\n\t\treturn this._activeValue\r\n\t}\r\n\tset activeValue(value: string) {\r\n\t\tthis._activeValue = value\r\n\t\tthis.updateActiveByValue(value)\r\n\t}\r\n\tprivate _activeValue = ''\r\n\r\n\t/**\r\n\t * When to show labels for navigation items\r\n\t * 'all' - Always show labels for all items\r\n\t * 'selected' - Only show label for selected item\r\n\t * 'none' - Never show labels\r\n\t * @default 'all'\r\n\t */\r\n\t@property({ type: String, attribute: 'label-visibility', reflect: true })\r\n\tlabelVisibility: LabelVisibility = 'all'\r\n\r\n\t/**\r\n\t * Alignment of navigation items\r\n\t * @default 'top'\r\n\t */\r\n\t@property({ type: String, reflect: true })\r\n\talignment: 'top' | 'center' | 'bottom' = 'top'\r\n\r\n\t/**\r\n\t * Show tooltips when labels are hidden\r\n\t * @default true\r\n\t */\r\n\t@property({ type: Boolean })\r\n\tshowTooltips = true\r\n\r\n\t/**\r\n\t * Enable keyboard navigation\r\n\t * @default true\r\n\t */\r\n\t@property({ type: Boolean })\r\n\tkeyboardNavigation = true\r\n\r\n\t/**\r\n\t * Whether the navigation rail is expanded\r\n\t * @default false\r\n\t */\r\n\t@property({ type: Boolean, reflect: true })\r\n\texpanded = false\r\n\r\n\r\n\t// State\r\n\t@state()\r\n\tprivate focusedIndex = -1\r\n\r\n\t@state()\r\n\tprivate hasHeaderContent = false\r\n\r\n\t@state()\r\n\tprivate isFullscreen = false\r\n\r\n\t// Queries\r\n\r\n\t@queryAssignedElements({ flatten: true })\r\n\tprivate allElements!: Element[]\r\n\r\n\tprivate get navigationItems(): SchmancyNavigationRailItem[] {\r\n\t\treturn this.allElements.filter(el => el.tagName === 'SCHMANCY-NAVIGATION-RAIL-ITEM') as SchmancyNavigationRailItem[]\r\n\t}\r\n\r\n\tconnectedCallback() {\r\n\t\tsuper.connectedCallback()\r\n\r\n\t\t// Set up keyboard navigation if enabled\r\n\t\tif (this.keyboardNavigation) {\r\n\t\t\tthis.addEventListener('keydown', this.handleKeyDown)\r\n\t\t}\r\n\r\n\t\t// Subscribe to active index changes with distinct values only\r\n\t\tthis.activeIndex$\r\n\t\t\t.pipe(\r\n\t\t\t\tdistinctUntilChanged(),\r\n\t\t\t\ttap(index => this.updateActiveStates(index)),\r\n\t\t\t\ttakeUntil(this.disconnecting),\r\n\t\t\t)\r\n\t\t\t.subscribe()\r\n\r\n\t\t// Listen to fullscreen events\r\n\t\tfromEvent(window, 'fullscreen').pipe(\r\n\t\t\ttap((event: Event) => {\r\n\t\t\t\tconst customEvent = event as CustomEvent\r\n\t\t\t\tthis.isFullscreen = customEvent.detail\r\n\t\t\t}),\r\n\t\t\ttakeUntil(this.disconnecting)\r\n\t\t).subscribe()\r\n\r\n\t\t// Listen for navigate events from child items\r\n\t\tthis.setupNavigateListener()\r\n\r\n\t\t// Set up label visibility\r\n\t\tthis.updateLabelVisibility()\r\n\r\n\t\t// Update ARIA attributes\r\n\t\tthis.setAttribute('role', 'navigation')\r\n\t\tthis.setAttribute('aria-label', 'Main navigation')\r\n\t}\r\n\r\n\tupdated(changedProperties: PropertyValues) {\r\n\t\tsuper.updated(changedProperties)\r\n\r\n\t\tif (changedProperties.has('labelVisibility')) {\r\n\t\t\tthis.updateLabelVisibility()\r\n\t\t}\r\n\r\n\t\tif (changedProperties.has('activeValue')) {\r\n\t\t\tthis.updateActiveByValue(this.activeValue)\r\n\t\t}\r\n\r\n\t\tif (changedProperties.has('expanded')) {\r\n\t\t\tthis.updateLabelVisibility()\r\n\t\t}\r\n\t}\r\n\r\n\tprivate updateActiveStates(index: number) {\r\n\t\tthis.navigationItems.forEach((item, i) => {\r\n\t\t\tconst isActive = i === index\r\n\t\t\titem.active = isActive\r\n\t\t\titem.setAttribute('aria-selected', String(isActive))\r\n\t\t\titem.setAttribute('tabindex', isActive ? '0' : '-1')\r\n\r\n\t\t\t// Update activeValue when index changes\r\n\t\t\tif (isActive) {\r\n\t\t\t\tthis._activeValue = item.value || item.label || ''\r\n\t\t\t}\r\n\t\t})\r\n\t}\r\n\r\n\tprivate updateActiveByValue(value: string) {\r\n\t\tconst index = this.navigationItems.findIndex(item => item.getAttribute('value') === value || item.label === value)\r\n\t\tif (index >= 0) {\r\n\t\t\tthis.activeIndex = index\r\n\t\t}\r\n\t}\r\n\r\n\tprivate updateLabelVisibility() {\r\n\t\tthis.navigationItems.forEach((item, i) => {\r\n\t\t\tlet shouldShowLabel = false\r\n\r\n\t\t\t// M3 Spec: In expanded state, always show all labels\r\n\t\t\tif (this.expanded) {\r\n\t\t\t\tshouldShowLabel = true\r\n\t\t\t} else {\r\n\t\t\t\t// In collapsed state, respect labelVisibility setting\r\n\t\t\t\tshouldShowLabel =\r\n\t\t\t\t\tthis.labelVisibility === 'all' || (this.labelVisibility === 'selected' && i === this.activeIndex)\r\n\t\t\t}\r\n\r\n\t\t\titem.showLabel = shouldShowLabel\r\n\r\n\t\t\t// Add tooltips when labels are hidden (only in collapsed state)\r\n\t\t\tif (this.showTooltips && !shouldShowLabel && !this.expanded && item.label) {\r\n\t\t\t\titem.setAttribute('title', item.label)\r\n\t\t\t} else {\r\n\t\t\t\titem.removeAttribute('title')\r\n\t\t\t}\r\n\t\t})\r\n\t}\r\n\r\n\t// Note: Hover-based label showing removed for M3 compliance\r\n\t// Labels are now controlled via labelVisibility property and expanded state\r\n\r\n\t/**\r\n\t * Programmatically expand the navigation rail\r\n\t */\r\n\texpand() {\r\n\t\tthis.expanded = true\r\n\t}\r\n\r\n\t/**\r\n\t * Programmatically collapse the navigation rail\r\n\t */\r\n\tcollapse() {\r\n\t\tthis.expanded = false\r\n\t}\r\n\r\n\t/**\r\n\t * Add a boat item to the navigation rail\r\n\t * @param config Configuration for the boat item\r\n\t * @returns The created or existing navigation rail item element\r\n\t */\r\n\tpublic addBoatItem(config: { id: string; title: string; icon?: string }) {\r\n\t\t// Check if item already exists\r\n\t\tconst existingItem = this.querySelector(`[value=\"${config.id}\"]`) as HTMLElement\r\n\t\tif (existingItem) {\r\n\t\t\t// Item already exists, just return it\r\n\t\t\treturn existingItem\r\n\t\t}\r\n\r\n\t\t// Create new item\r\n\t\tconst item = document.createElement('schmancy-navigation-rail-item')\r\n\t\titem.setAttribute('value', config.id)\r\n\t\titem.innerHTML = `\r\n\t\t\t<schmancy-icon slot=\"icon\">${config.icon || 'widgets'}</schmancy-icon>\r\n\t\t\t${config.title}\r\n\t\t`\r\n\t\t// Add to the rail before any footer content\r\n\t\tconst footer = this.querySelector('[slot=\"footer\"]')\r\n\t\tif (footer) {\r\n\t\t\tthis.insertBefore(item, footer)\r\n\t\t} else {\r\n\t\t\tthis.appendChild(item)\r\n\t\t}\r\n\t\treturn item\r\n\t}\r\n\r\n\t/**\r\n\t * Toggle the navigation rail between expanded and collapsed states\r\n\t */\r\n\ttoggle() {\r\n\t\tthis.expanded = !this.expanded\r\n\t}\r\n\r\n\r\n\tprivate handleKeyDown(event: KeyboardEvent) {\r\n\t\tconst items = this.navigationItems\r\n\t\tif (items.length === 0) return\r\n\r\n\t\tlet newIndex = this.focusedIndex >= 0 ? this.focusedIndex : this.activeIndex\r\n\r\n\t\tswitch (event.key) {\r\n\t\t\tcase 'ArrowDown':\r\n\t\t\t\tevent.preventDefault()\r\n\t\t\t\tnewIndex = (newIndex + 1) % items.length\r\n\t\t\t\tbreak\r\n\t\t\tcase 'ArrowUp':\r\n\t\t\t\tevent.preventDefault()\r\n\t\t\t\tnewIndex = newIndex <= 0 ? items.length - 1 : newIndex - 1\r\n\t\t\t\tbreak\r\n\t\t\tcase 'Home':\r\n\t\t\t\tevent.preventDefault()\r\n\t\t\t\tnewIndex = 0\r\n\t\t\t\tbreak\r\n\t\t\tcase 'End':\r\n\t\t\t\tevent.preventDefault()\r\n\t\t\t\tnewIndex = items.length - 1\r\n\t\t\t\tbreak\r\n\t\t\tcase 'Enter':\r\n\t\t\tcase ' ':\r\n\t\t\t\tevent.preventDefault()\r\n\t\t\t\tif (newIndex >= 0) {\r\n\t\t\t\t\titems[newIndex].click()\r\n\t\t\t\t}\r\n\t\t\t\treturn\r\n\t\t\tdefault:\r\n\t\t\t\treturn\r\n\t\t}\r\n\r\n\t\tthis.focusedIndex = newIndex\r\n\t\titems[newIndex].focus()\r\n\t}\r\n\r\n\tprivate handleFabClick(event: Event) {\r\n\t\tevent.stopPropagation()\r\n\t\tthis.dispatchEvent(\r\n\t\t\tnew CustomEvent('fab-click', {\r\n\t\t\t\tbubbles: true,\r\n\t\t\t\tcomposed: true,\r\n\t\t\t}),\r\n\t\t)\r\n\t}\r\n\r\n\tprivate handleMenuClick(event: Event) {\r\n\t\tevent.stopPropagation()\r\n\t\tthis.dispatchEvent(\r\n\t\t\tnew CustomEvent('menu-click', {\r\n\t\t\t\tbubbles: true,\r\n\t\t\t\tcomposed: true,\r\n\t\t\t}),\r\n\t\t)\r\n\t}\r\n\r\n\tprotected render() {\r\n\t\t// Host-level classes for the navigation rail\r\n\t\tconst hostClasses = this.classMap({\r\n\t\t\t// Layout & Structure - Fixed width to prevent layout shift\r\n\t\t\t'flex flex-col': true,\r\n\t\t\t'h-full': true,\r\n\t\t\t'box-border relative overflow-visible': true,\r\n\t\t\t'z-10 hover:z-[100]': true, // Base z-index, elevated on hover for overlay\r\n\r\n\t\t\t// Width - collapses to 0 when fullscreen\r\n\t\t\t'w-20': !this.isFullscreen, // w-20 = 80px fixed width (M3 spec: 80dp)\r\n\t\t\t'w-0': this.isFullscreen, // Collapse width to 0 in fullscreen\r\n\r\n\t\t\t// Visibility and transition\r\n\t\t\t'transition-all duration-300 ease-emphasized': true,\r\n\t\t\t'opacity-100': !this.isFullscreen,\r\n\t\t\t'opacity-0 pointer-events-none': this.isFullscreen,\r\n\t\t\t'overflow-hidden': this.isFullscreen, // Hide overflow when collapsed\r\n\t\t})\r\n\r\n\t\t// Rail container - programmatically controlled width\r\n\t\tconst railClasses = this.classMap({\r\n\t\t\t// Layout & Structure\r\n\t\t\t'flex flex-col h-full': true,\r\n\t\t\t'box-border relative': true,\r\n\t\t\t'py-2': true,\r\n\r\n\r\n\t\t\t// M3 Colors & Theme\r\n\t\t\t'bg-container-lowest text-surface-on': true,\r\n\r\n\t\t\t// M3 Motion - smooth transitions for width and shadow\r\n\t\t\t'transition-all duration-300 ease-emphasized': true,\r\n\r\n\t\t\t// Collapsed state (default) - M3 standard 80px width\r\n\t\t\t'w-20': !this.expanded, // w-20 = 80px (M3 spec: 80dp)\r\n\t\t\t'px-3': !this.expanded, // px-3 = 12px (M3 spec: 12px to center 56px items)\r\n\r\n\t\t\t// Expanded state - M3 expanded width with shadow\r\n\t\t\t'w-60': this.expanded, // w-60 = 240px expanded width\r\n\t\t\t'px-4': this.expanded, // Larger padding when expanded\r\n\t\t\t'shadow-lg': this.expanded, // M3 elevation 3 shadow when expanded\r\n\t\t})\r\n\r\n\t\t// Header section classes - hidden when no content\r\n\t\tconst headerClasses = this.classMap({\r\n\t\t\t'flex flex-col items-center gap-1': true,\r\n\t\t\t'hidden': !this.hasHeaderContent,\r\n\t\t})\r\n\r\n\t\t// Navigation container classes with alignment\r\n\t\tconst navClasses = this.classMap({\r\n\t\t\t'flex-1 flex flex-col gap-3': true, // gap-3 = 12px (M3 spec: 12px item spacing)\r\n\t\t\t'min-h-0': true, // Allow flex shrinking and proper scroll container height calculation\r\n\t\t\t// Alignment variants\r\n\t\t\t'justify-start': this.alignment === 'top',\r\n\t\t\t'justify-center': this.alignment === 'center',\r\n\t\t\t'justify-end': this.alignment === 'bottom',\r\n\t\t})\r\n\r\n\t\t// Footer section classes\r\n\t\tconst footerClasses = this.classMap({\r\n\t\t\t'flex flex-col items-center gap-1 mt-auto pt-2': true,\r\n\t\t})\r\n\r\n\t\treturn html`\r\n\t\t\t<div\r\n\t\t\t\tclass=${hostClasses}\r\n\t\t\t>\r\n\t\t\t\t<div class=${railClasses} part=\"rail\">\r\n\t\t\t\t\t<div class=${headerClasses} part=\"header\">\r\n\t\t\t\t\t\t<slot name=\"fab\" @click=${this.handleFabClick} @slotchange=${this.handleHeaderSlotChange}></slot>\r\n\t\t\t\t\t\t<slot name=\"menu\" @click=${this.handleMenuClick} @slotchange=${this.handleHeaderSlotChange}></slot>\r\n\t\t\t\t\t\t<slot name=\"header\" @slotchange=${this.handleHeaderSlotChange}></slot>\r\n\t\t\t\t\t</div>\r\n\r\n\t\t\t\t\t<nav class=${navClasses} part=\"nav\" role=\"list\">\r\n\t\t\t\t\t\t<schmancy-scroll hide direction=\"vertical\">\r\n\t\t\t\t\t\t\t<slot @slotchange=${this.handleSlotChange}></slot>\r\n\t\t\t\t\t\t</schmancy-scroll>\r\n\t\t\t\t\t</nav>\r\n\r\n\t\t\t\t\t<div class=${footerClasses} part=\"footer\">\r\n\t\t\t\t\t\t<slot name=\"footer\"></slot>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t`\r\n\t}\r\n\r\n\tprivate setupNavigateListener() {\r\n\t\t// Listen for navigate events from child items\r\n\t\tthis.addEventListener('navigate', (e: Event) => {\r\n\t\t\tif (e instanceof CustomEvent) {\r\n\t\t\t\tconst value = e.detail\r\n\t\t\t\t// Find the item that dispatched the event and update active state\r\n\t\t\t\tconst itemIndex = this.navigationItems.findIndex(item => item.value === value || item.label === value)\r\n\t\t\t\tif (itemIndex >= 0) {\r\n\t\t\t\t\tthis.activeIndex = itemIndex\r\n\t\t\t\t\tthis._activeValue = value\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t})\r\n\t}\r\n\r\n\tprivate handleHeaderSlotChange() {\r\n\t\t// Check if any header slot has content\r\n\t\tconst headerDiv = this.shadowRoot?.querySelector('[part=\"header\"]')\r\n\t\tif (headerDiv) {\r\n\t\t\tconst allSlots = headerDiv.querySelectorAll('slot')\r\n\t\t\tthis.hasHeaderContent = Array.from(allSlots).some(s =>\r\n\t\t\t\ts.assignedNodes({ flatten: true }).length > 0\r\n\t\t\t)\r\n\t\t}\r\n\t}\r\n\r\n\tprivate handleSlotChange() {\r\n\t\t// Update items when slot content changes\r\n\t\tthis.updateLabelVisibility()\r\n\t\tthis.updateActiveStates(this.activeIndex)\r\n\r\n\t\t// Set ARIA attributes on items\r\n\t\tthis.navigationItems.forEach((item, index) => {\r\n\t\t\titem.setAttribute('role', 'listitem')\r\n\t\t\tif (!item.hasAttribute('tabindex')) {\r\n\t\t\t\titem.setAttribute('tabindex', index === this.activeIndex ? '0' : '-1')\r\n\t\t\t}\r\n\t\t})\r\n\t}\r\n}\r\n\r\ndeclare global {\r\n\tinterface HTMLElementTagNameMap {\r\n\t\t'schmancy-navigation-rail': SchmancyNavigationRail\r\n\t}\r\n}\r\n"],"mappings":"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"}
+{"version":3,"file":"navigation-rail.js","names":[],"sources":["../src/navigation-rail/navigation-rail-item.ts","../src/navigation-rail/navigation-rail.ts"],"sourcesContent":["import { $LitElement } from '@mixins/index'\nimport { html, PropertyValues } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { when } from 'lit/directives/when.js'\nimport { BehaviorSubject, fromEvent, merge, takeUntil } from 'rxjs'\nimport { delay, distinctUntilChanged, tap } from 'rxjs/operators'\n\nexport type NavigationRailItemClickEvent = CustomEvent<{\n\ticon: string\n\tlabel: string\n\tvalue: string\n\tactive: boolean\n}>\n\n/**\n * Single destination inside schmancy-navigation-rail — vertically-stacked icon + optional label. @see https://m3.material.io/components/navigation-rail/overview\n *\n * @element schmancy-navigation-rail-item\n * @summary Always nested inside schmancy-navigation-rail. Use `icon` attr for a Material Symbols glyph, or slot=icon for custom content. Supports a `badge` slot for notification dots / counts.\n * @platform button click - Styled vertical navigation target. Degrades to a plain `<button>` if the tag never registers.\n * @slot icon - Slot for the navigation item icon (e.g., schmancy-icon)\n * @slot - Default slot for custom content\n * @slot badge - Custom badge content\n *\n * @fires navigate - When the item is clicked\n *\n * @csspart container - The main item container\n * @csspart indicator - The active indicator\n * @csspart icon - The icon container\n * @csspart label - The label text\n * @csspart badge - The badge element\n *\n * @example\n * <schmancy-navigation-rail-item\n *   icon=\"home\"\n *   label=\"Home\"\n *   value=\"/home\"\n *   badge=\"3\"\n *   active>\n * </schmancy-navigation-rail-item>\n *\n * @example\n * <!-- Using 'selected' alias -->\n * <schmancy-navigation-rail-item\n *   icon=\"settings\"\n *   label=\"Settings\"\n *   value=\"/settings\"\n *   selected>\n * </schmancy-navigation-rail-item>\n *\n * @example\n * <!-- With custom icon -->\n * <schmancy-navigation-rail-item label=\"Dashboard\">\n *   <schmancy-icon slot=\"icon\">dashboard</schmancy-icon>\n * </schmancy-navigation-rail-item>\n */\n@customElement('schmancy-navigation-rail-item')\nexport class SchmancyNavigationRailItem extends $LitElement() {\n\t// Observable state\n\tprivate hovering$ = new BehaviorSubject<boolean>(false)\n\tprivate pressing$ = new BehaviorSubject<boolean>(false)\n\tprivate active$ = new BehaviorSubject<boolean>(false)\n\n\t// Properties\n\t/**\n\t * Icon name (Material Symbols icon)\n\t */\n\t@property({ type: String })\n\ticon = ''\n\n\t/**\n\t * Label text for the navigation item\n\t */\n\t@property({ type: String })\n\tlabel = ''\n\n\t/**\n\t * Value associated with this item (useful for routing)\n\t */\n\t@property({ type: String })\n\tvalue = ''\n\n\t/**\n\t * Whether this item is currently active/selected\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tget active() {\n\t\treturn this.active$.value\n\t}\n\tset active(value: boolean) {\n\t\tthis.active$.next(value)\n\t}\n\n\t/**\n\t * Whether this item is currently selected (alias for active)\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tget selected() {\n\t\treturn this.active\n\t}\n\tset selected(value: boolean) {\n\t\tthis.active = value\n\t}\n\n\t/**\n\t * Badge text or number to display\n\t */\n\t@property({ type: String })\n\tbadge = ''\n\n\t/**\n\t * Badge variant\n\t */\n\t@property({ type: String })\n\tbadgeVariant: 'error' | 'primary' | 'secondary' = 'error'\n\n\t/**\n\t * Whether to show the label (controlled by parent rail)\n\t * @default false\n\t */\n\t@property({ type: Boolean, attribute: 'show-label' })\n\tshowLabel = false\n\n\t/**\n\t * Whether this item is disabled\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tdisabled = false\n\n\t/**\n\t * Whether this is a nested item (sub-navigation)\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tnested = false\n\n\t/**\n\t * Whether this item represents a group separator\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\tgroup = false\n\n\t// State\n\t@state()\n\tprivate showRipple = false\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\n\t\t// Set up hover tracking\n\t\tmerge(\n\t\t\tfromEvent(this, 'mouseenter').pipe(tap(() => this.hovering$.next(true))),\n\t\t\tfromEvent(this, 'mouseleave').pipe(tap(() => this.hovering$.next(false))),\n\t\t)\n\t\t\t.pipe(takeUntil(this.disconnecting))\n\t\t\t.subscribe()\n\n\t\t// Set up press tracking\n\t\tmerge(\n\t\t\tfromEvent(this, 'mousedown').pipe(tap(() => this.pressing$.next(true))),\n\t\t\tfromEvent(this, 'mouseup').pipe(tap(() => this.pressing$.next(false))),\n\t\t\tfromEvent(this, 'mouseleave').pipe(tap(() => this.pressing$.next(false))),\n\t\t)\n\t\t\t.pipe(takeUntil(this.disconnecting))\n\t\t\t.subscribe()\n\n\t\t// Ripple effect with M3 timing\n\t\tthis.pressing$\n\t\t\t.pipe(\n\t\t\t\ttap(pressing => {\n\t\t\t\t\tif (pressing && !this.disabled) {\n\t\t\t\t\t\tthis.showRipple = true\n\t\t\t\t\t}\n\t\t\t\t}),\n\t\t\t\t// M3 standard ripple duration\n\t\t\t\tdelay(600),\n\t\t\t\ttap(() => (this.showRipple = false)),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe()\n\n\t\t// Subscribe to active state changes for reactive updates\n\t\tthis.active$\n\t\t\t.pipe(\n\t\t\t\tdistinctUntilChanged(),\n\t\t\t\ttap(isActive => {\n\t\t\t\t\tthis.requestUpdate()\n\t\t\t\t\t// Update ARIA attributes reactively\n\t\t\t\t\tthis.setAttribute('aria-selected', String(isActive))\n\t\t\t\t\tthis.setAttribute('tabindex', isActive ? '0' : '-1')\n\t\t\t\t}),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe()\n\n\t\t// Set ARIA attributes\n\t\tthis.setAttribute('role', 'listitem')\n\t\tif (!this.hasAttribute('tabindex')) {\n\t\t\tthis.setAttribute('tabindex', this.active ? '0' : '-1')\n\t\t}\n\t}\n\n\tupdated(changedProperties: PropertyValues) {\n\t\tsuper.updated(changedProperties)\n\n\t\t// Active state is now handled by the BehaviorSubject subscription\n\t\t// So we don't need to duplicate it here\n\n\t\tif (changedProperties.has('disabled')) {\n\t\t\tthis.setAttribute('aria-disabled', String(this.disabled))\n\t\t}\n\n\t\tif (changedProperties.has('label')) {\n\t\t\tthis.setAttribute('aria-label', this.label)\n\t\t}\n\t}\n\n\t/**\n\t * Handle click events\n\t */\n\tprivate handleClick(event: Event) {\n\t\tif (this.disabled) {\n\t\t\tevent.preventDefault()\n\t\t\tevent.stopPropagation()\n\t\t\treturn\n\t\t}\n\n\t\t// Emit navigate event with the value\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('navigate', {\n\t\t\t\tdetail: this.value || this.label,\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\n\t\t// Visual feedback is handled by the ripple effect in connectedCallback\n\t\t// The parent rail will confirm and update via activeIndex\n\t}\n\n\t/**\n\t * Handle keyboard events\n\t */\n\tprivate handleKeyDown(event: KeyboardEvent) {\n\t\tif (this.disabled) return\n\n\t\tif (event.key === 'Enter' || event.key === ' ') {\n\t\t\tevent.preventDefault()\n\t\t\tthis.click()\n\t\t}\n\t}\n\n\tprotected render() {\n\t\tconst hasCustomIcon = !!this.querySelector('[slot=\"icon\"]')\n\t\tconst hasCustomBadge = this.querySelector('[slot=\"badge\"]')\n\n\t\t// M3 Navigation Rail Item classes with theme integration\n\t\tconst containerClasses = this.classMap({\n\t\t\t// Layout & Spacing (M3 56px height, 12px vertical padding)\n\t\t\t'flex flex-col items-center justify-center': true,\n\t\t\t'min-h-14 w-full': true, // min-h-14 = 56px\n\t\t\t'py-3': true, // py-3 = 12px top/bottom\n\t\t\t'gap-1': true, // gap-1 = 4px\n\n\t\t\t// M3 Shape & Interaction\n\t\t\t'rounded-lg': true, // M3 large corner radius\n\t\t\t'cursor-pointer': true,\n\t\t\trelative: true,\n\t\t\t'select-none': true,\n\t\t\t'box-border': true,\n\n\t\t\t// Colors & States\n\t\t\t'text-surface-onVariant': !this.active,\n\t\t\t'text-secondary-onContainer': this.active,\n\t\t\t'hover:bg-surface-containerHighest': true,\n\n\t\t\t// Transitions (M3 emphasized motion)\n\t\t\t'transition-all duration-150 ease-out': true,\n\n\t\t\t// Disabled state\n\t\t\t'pointer-events-none opacity-38': this.disabled,\n\n\t\t\t// Active ripple effect\n\t\t\t'[&>.ripple]:scale-100': this.showRipple,\n\n\t\t\t// Nested item adjustments\n\t\t\t'min-h-12 pl-8': this.nested, // 48px height, 32px left padding for nested\n\n\t\t\t// Group separator\n\t\t\t'mb-2 after:absolute after:bottom-[-4px] after:left-3 after:right-3 after:h-px after:bg-outline-variant after:opacity-12':\n\t\t\t\tthis.group,\n\t\t})\n\n\t\t// Icon container with active indicator\n\t\tconst iconContainerClasses = this.classMap({\n\t\t\t'flex items-center justify-center': true,\n\t\t\t'w-auto min-w-14 h-8': true, // 56px min-width, 32px height\n\t\t\t'shrink-0 relative z-10': true,\n\t\t})\n\n\t\t// Active indicator behind icon\n\t\tconst indicatorClasses = this.classMap({\n\t\t\t'absolute top-1/2 left-1/2 opacity-30': true,\n\t\t\t'w-14 h-8': true, // 56px x 32px\n\t\t\t'rounded-lg': true, // M3 large corner radius\n\t\t\t'bg-secondary-container': true,\n\t\t\t'transition-transform duration-150 ease-out': true,\n\t\t\t// Transform based on active state\n\t\t\t'scale-0 -translate-x-1/2 -translate-y-1/2': !this.active,\n\t\t\t'scale-100 -translate-x-1/2 -translate-y-1/2': this.active,\n\t\t})\n\n\t\t// Icon styling\n\t\tconst iconClasses = this.classMap({\n\t\t\t'relative z-100': true,\n\t\t\t'text-2xl leading-none': !this.nested, // 24px icon for normal\n\t\t\t'text-xl leading-none': this.nested, // 20px icon for nested\n\t\t\t// Material Symbols font variations handled via CSS custom properties\n\t\t})\n\n\t\t// Label styling\n\t\tconst labelClasses = this.classMap({\n\t\t\t'text-xs font-medium leading-4': true, // 12px, medium weight, 16px line height\n\t\t\t'text-center': true,\n\t\t\t'overflow-hidden text-ellipsis whitespace-nowrap': true,\n\t\t\t'z-10 max-w-14 px-1': true, // max 56px width, 4px horizontal padding\n\t\t\thidden: !this.showLabel && !this.label, // Hide if not shown or no label\n\t\t})\n\n\t\t// Badge styling with dynamic colors\n\t\tconst badgeClasses = this.classMap({\n\t\t\t'absolute top-2 right-3': true, // 8px from top, 12px from right\n\t\t\t'min-w-4 h-4': true, // 16px min-width and height\n\t\t\t'rounded-sm': true, // M3 small corner radius\n\t\t\t'text-xs font-semibold': true, // 11px, 600 weight\n\t\t\t'flex items-center justify-center': true,\n\t\t\t'px-1 box-border z-20': true, // 4px padding\n\t\t\t'animate-pulse': true, // Pulse animation\n\t\t\t// Dynamic background based on variant\n\t\t\t'bg-error-default text-error-on': this.badgeVariant === 'error',\n\t\t\t'bg-primary-default text-primary-on': this.badgeVariant === 'primary',\n\t\t\t'bg-secondary-default text-secondary-on': this.badgeVariant === 'secondary',\n\t\t})\n\n\t\t// Ripple effect classes\n\t\tconst rippleClasses = this.classMap({\n\t\t\t'absolute inset-0 rounded-lg overflow-hidden z-0': true,\n\t\t\t'before:content-[\"\"] before:absolute before:top-1/2 before:left-1/2': true,\n\t\t\t'before:w-0 before:h-0 before:rounded-full': true,\n\t\t\t'before:bg-current before:opacity-0': true,\n\t\t\t'before:-translate-x-1/2 before:-translate-y-1/2': true,\n\t\t\t'before:transition-all before:duration-300': true,\n\t\t\t// Active state\n\t\t\t'before:w-[200%] before:h-[200%] before:opacity-12': this.showRipple,\n\t\t})\n\n\t\treturn html`\n\t\t\t<div\n\t\t\t\tclass=${containerClasses}\n\t\t\t\tpart=\"container\"\n\t\t\t\t@click=${this.handleClick}\n\t\t\t\t@keydown=${this.handleKeyDown}\n\t\t\t\tstyle=\"outline: ${this.matches(':focus-visible')\n\t\t\t\t\t? '2px solid var(--schmancy-sys-color-primary-default)'\n\t\t\t\t\t: 'none'}; outline-offset: 2px;\"\n\t\t\t>\n\t\t\t\t<span class=${rippleClasses} aria-hidden=\"true\"></span>\n\n\t\t\t\t<div class=${iconContainerClasses} part=\"icon\">\n\t\t\t\t\t<span class=${indicatorClasses} part=\"indicator\" aria-hidden=\"true\"></span>\n\t\t\t\t\t${when(\n\t\t\t\t\t\thasCustomIcon,\n\t\t\t\t\t\t() => html`<slot class=\"relative\" name=\"icon\"></slot>`,\n\t\t\t\t\t\t() =>\n\t\t\t\t\t\t\twhen(\n\t\t\t\t\t\t\t\tthis.icon,\n\t\t\t\t\t\t\t\t() => html`\n\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\tclass=${iconClasses}\n\t\t\t\t\t\t\t\t\t\tpart=\"icon-text\"\n\t\t\t\t\t\t\t\t\t\tstyle=\"font-family: 'Material Symbols Outlined'; font-variation-settings: 'FILL' ${this.active\n\t\t\t\t\t\t\t\t\t\t\t? '1'\n\t\t\t\t\t\t\t\t\t\t\t: '0'}, 'wght' 400, 'GRAD' 0, 'opsz' ${this.nested ? '20' : '24'};\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t${this.icon}\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t`,\n\t\t\t\t\t\t\t),\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\n\t\t\t\t${when(this.label, () => html`<span class=${labelClasses} part=\"label\">${this.label}</span>`)}\n\t\t\t\t${when(\n\t\t\t\t\tthis.badge,\n\t\t\t\t\t() => html`\n\t\t\t\t\t\t${when(\n\t\t\t\t\t\t\thasCustomBadge,\n\t\t\t\t\t\t\t() => html`<slot name=\"badge\"></slot>`,\n\t\t\t\t\t\t\t() => html`\n\t\t\t\t\t\t\t\t<span class=${badgeClasses} part=\"badge\" aria-label=\"${this.badge} notifications\"> ${this.badge} </span>\n\t\t\t\t\t\t\t`,\n\t\t\t\t\t\t)}\n\t\t\t\t\t`,\n\t\t\t\t)}\n\n\t\t\t\t<!-- Tooltip shown via title attribute -->\n\t\t\t\t${when(\n\t\t\t\t\tthis.hasAttribute('title'),\n\t\t\t\t\t() => html`\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass=\"\n\t\t\t\t\t\t\tabsolute left-[calc(100%+8px)] top-1/2 -translate-y-1/2\n\t\t\t\t\t\t\tbg-surface-inverse text-surface-inverseOn\n\t\t\t\t\t\t\tpx-2 py-1 rounded-sm text-xs whitespace-nowrap\n\t\t\t\t\t\t\tz-1000 pointer-events-none opacity-0\n\t\t\t\t\t\t\thover:opacity-100 hover:translate-x-0\n\t\t\t\t\t\t\ttransition-all duration-150 ease-out\n\t\t\t\t\t\t\t-translate-x-1\n\t\t\t\t\t\t\"\n\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t${this.getAttribute('title')}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t`,\n\t\t\t\t)}\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-navigation-rail-item': SchmancyNavigationRailItem\n\t}\n}\n","import { $LitElement } from '@mixins/index'\r\nimport { html, PropertyValues } from 'lit'\r\nimport { customElement, property, queryAssignedElements, state } from 'lit/decorators.js'\r\nimport { BehaviorSubject, fromEvent, takeUntil } from 'rxjs'\r\nimport { distinctUntilChanged, tap } from 'rxjs/operators'\r\nimport { SchmancyNavigationRailItem } from './navigation-rail-item'\r\n\r\nexport type NavigateEvent = CustomEvent<string>\r\n\r\nexport type NavigationRailMenuClickEvent = CustomEvent<void>\r\n\r\nexport type NavigationRailFabClickEvent = CustomEvent<void>\r\n\r\n\r\nexport type LabelVisibility = 'all' | 'selected' | 'none'\r\n\r\n/**\r\n * Vertical navigation rail — Material Design 3 compact left-side nav for desktop / tablet layouts with 3–7 primary destinations. Auto-hides in fullscreen mode. @see https://m3.material.io/components/navigation-rail/overview\r\n *\r\n * @element schmancy-navigation-rail\r\n * @summary Use as the desktop counterpart of schmancy-navigation-bar: same destinations, different form factor. Prefer schmancy-nav-drawer when you also want a drawer + app-bar combo.\r\n * @example\r\n * <schmancy-navigation-rail activeIndex=\"0\">\r\n *   <schmancy-icon-button slot=\"fab\" variant=\"filled\">\r\n *     <schmancy-icon>add</schmancy-icon>\r\n *   </schmancy-icon-button>\r\n *   <schmancy-navigation-rail-item icon=\"home\" label=\"Home\"></schmancy-navigation-rail-item>\r\n *   <schmancy-navigation-rail-item icon=\"search\" label=\"Search\"></schmancy-navigation-rail-item>\r\n *   <schmancy-navigation-rail-item icon=\"settings\" label=\"Settings\"></schmancy-navigation-rail-item>\r\n * </schmancy-navigation-rail>\r\n * @platform nav - Vertical styled nav. Degrades to a plain vertical flex container if the tag never registers.\r\n * @slot fab - Slot for a floating action button at the top\r\n * @slot menu - Slot for a menu icon or button below the FAB\r\n * @slot header - Custom header content slot\r\n * @slot footer - Custom footer content slot\r\n * @slot - Default slot for navigation rail items\r\n *\r\n * @fires navigate - When a navigation item is selected\r\n * @fires menu-click - When the menu button is clicked\r\n * @fires fab-click - When the FAB is clicked\r\n *\r\n * @csspart rail - The main rail container\r\n * @csspart header - The header section\r\n * @csspart nav - The navigation items container\r\n * @csspart footer - The footer section\r\n *\r\n * @example\r\n * <schmancy-navigation-rail activeIndex=\"0\">\r\n *   <schmancy-button slot=\"fab\" variant=\"filled\" aria-label=\"Compose\">\r\n *     <schmancy-icon>add</schmancy-icon>\r\n *   </schmancy-button>\r\n *   <schmancy-button slot=\"menu\" variant=\"text\" aria-label=\"Menu\">\r\n *     <schmancy-icon>menu</schmancy-icon>\r\n *   </schmancy-button>\r\n *   <schmancy-navigation-rail-item icon=\"home\" label=\"Home\"></schmancy-navigation-rail-item>\r\n *   <schmancy-navigation-rail-item icon=\"search\" label=\"Search\"></schmancy-navigation-rail-item>\r\n *   <schmancy-navigation-rail-item icon=\"favorite\" label=\"Favorites\" badge=\"3\"></schmancy-navigation-rail-item>\r\n *   <schmancy-navigation-rail-item icon=\"settings\" label=\"Settings\"></schmancy-navigation-rail-item>\r\n * </schmancy-navigation-rail>\r\n */\r\n@customElement('schmancy-navigation-rail')\r\nexport class SchmancyNavigationRail extends $LitElement() {\r\n\t// Observable state\r\n\tprivate activeIndex$ = new BehaviorSubject<number>(-1)\r\n\r\n\t// Properties\r\n\t/**\r\n\t * The currently active item index\r\n\t * @default -1\r\n\t */\r\n\t@property({ type: Number })\r\n\tget activeIndex() {\r\n\t\treturn this.activeIndex$.value\r\n\t}\r\n\tset activeIndex(value: number) {\r\n\t\tthis.activeIndex$.next(value)\r\n\t}\r\n\r\n\t/**\r\n\t * The currently active item value (for programmatic selection)\r\n\t */\r\n\t@property({ type: String })\r\n\tget activeValue() {\r\n\t\treturn this._activeValue\r\n\t}\r\n\tset activeValue(value: string) {\r\n\t\tthis._activeValue = value\r\n\t\tthis.updateActiveByValue(value)\r\n\t}\r\n\tprivate _activeValue = ''\r\n\r\n\t/**\r\n\t * When to show labels for navigation items\r\n\t * 'all' - Always show labels for all items\r\n\t * 'selected' - Only show label for selected item\r\n\t * 'none' - Never show labels\r\n\t * @default 'all'\r\n\t */\r\n\t@property({ type: String, attribute: 'label-visibility', reflect: true })\r\n\tlabelVisibility: LabelVisibility = 'all'\r\n\r\n\t/**\r\n\t * Alignment of navigation items\r\n\t * @default 'top'\r\n\t */\r\n\t@property({ type: String, reflect: true })\r\n\talignment: 'top' | 'center' | 'bottom' = 'top'\r\n\r\n\t/**\r\n\t * Show tooltips when labels are hidden\r\n\t * @default true\r\n\t */\r\n\t@property({ type: Boolean })\r\n\tshowTooltips = true\r\n\r\n\t/**\r\n\t * Enable keyboard navigation\r\n\t * @default true\r\n\t */\r\n\t@property({ type: Boolean })\r\n\tkeyboardNavigation = true\r\n\r\n\t/**\r\n\t * Whether the navigation rail is expanded\r\n\t * @default false\r\n\t */\r\n\t@property({ type: Boolean, reflect: true })\r\n\texpanded = false\r\n\r\n\r\n\t// State\r\n\t@state()\r\n\tprivate focusedIndex = -1\r\n\r\n\t@state()\r\n\tprivate hasHeaderContent = false\r\n\r\n\t@state()\r\n\tprivate isFullscreen = false\r\n\r\n\t// Queries\r\n\r\n\t@queryAssignedElements({ flatten: true })\r\n\tprivate allElements!: Element[]\r\n\r\n\tprivate get navigationItems(): SchmancyNavigationRailItem[] {\r\n\t\treturn this.allElements.filter(el => el.tagName === 'SCHMANCY-NAVIGATION-RAIL-ITEM') as SchmancyNavigationRailItem[]\r\n\t}\r\n\r\n\tconnectedCallback() {\r\n\t\tsuper.connectedCallback()\r\n\r\n\t\t// Set up keyboard navigation if enabled\r\n\t\tif (this.keyboardNavigation) {\r\n\t\t\tthis.addEventListener('keydown', this.handleKeyDown)\r\n\t\t}\r\n\r\n\t\t// Subscribe to active index changes with distinct values only\r\n\t\tthis.activeIndex$\r\n\t\t\t.pipe(\r\n\t\t\t\tdistinctUntilChanged(),\r\n\t\t\t\ttap(index => this.updateActiveStates(index)),\r\n\t\t\t\ttakeUntil(this.disconnecting),\r\n\t\t\t)\r\n\t\t\t.subscribe()\r\n\r\n\t\t// Listen to fullscreen events\r\n\t\tfromEvent(window, 'fullscreen').pipe(\r\n\t\t\ttap((event: Event) => {\r\n\t\t\t\tconst customEvent = event as CustomEvent\r\n\t\t\t\tthis.isFullscreen = customEvent.detail\r\n\t\t\t}),\r\n\t\t\ttakeUntil(this.disconnecting)\r\n\t\t).subscribe()\r\n\r\n\t\t// Listen for navigate events from child items\r\n\t\tthis.setupNavigateListener()\r\n\r\n\t\t// Set up label visibility\r\n\t\tthis.updateLabelVisibility()\r\n\r\n\t\t// Update ARIA attributes\r\n\t\tthis.setAttribute('role', 'navigation')\r\n\t\tthis.setAttribute('aria-label', 'Main navigation')\r\n\t}\r\n\r\n\tupdated(changedProperties: PropertyValues) {\r\n\t\tsuper.updated(changedProperties)\r\n\r\n\t\tif (changedProperties.has('labelVisibility')) {\r\n\t\t\tthis.updateLabelVisibility()\r\n\t\t}\r\n\r\n\t\tif (changedProperties.has('activeValue')) {\r\n\t\t\tthis.updateActiveByValue(this.activeValue)\r\n\t\t}\r\n\r\n\t\tif (changedProperties.has('expanded')) {\r\n\t\t\tthis.updateLabelVisibility()\r\n\t\t}\r\n\t}\r\n\r\n\tprivate updateActiveStates(index: number) {\r\n\t\tthis.navigationItems.forEach((item, i) => {\r\n\t\t\tconst isActive = i === index\r\n\t\t\titem.active = isActive\r\n\t\t\titem.setAttribute('aria-selected', String(isActive))\r\n\t\t\titem.setAttribute('tabindex', isActive ? '0' : '-1')\r\n\r\n\t\t\t// Update activeValue when index changes\r\n\t\t\tif (isActive) {\r\n\t\t\t\tthis._activeValue = item.value || item.label || ''\r\n\t\t\t}\r\n\t\t})\r\n\t}\r\n\r\n\tprivate updateActiveByValue(value: string) {\r\n\t\tconst index = this.navigationItems.findIndex(item => item.getAttribute('value') === value || item.label === value)\r\n\t\tif (index >= 0) {\r\n\t\t\tthis.activeIndex = index\r\n\t\t}\r\n\t}\r\n\r\n\tprivate updateLabelVisibility() {\r\n\t\tthis.navigationItems.forEach((item, i) => {\r\n\t\t\tlet shouldShowLabel = false\r\n\r\n\t\t\t// M3 Spec: In expanded state, always show all labels\r\n\t\t\tif (this.expanded) {\r\n\t\t\t\tshouldShowLabel = true\r\n\t\t\t} else {\r\n\t\t\t\t// In collapsed state, respect labelVisibility setting\r\n\t\t\t\tshouldShowLabel =\r\n\t\t\t\t\tthis.labelVisibility === 'all' || (this.labelVisibility === 'selected' && i === this.activeIndex)\r\n\t\t\t}\r\n\r\n\t\t\titem.showLabel = shouldShowLabel\r\n\r\n\t\t\t// Add tooltips when labels are hidden (only in collapsed state)\r\n\t\t\tif (this.showTooltips && !shouldShowLabel && !this.expanded && item.label) {\r\n\t\t\t\titem.setAttribute('title', item.label)\r\n\t\t\t} else {\r\n\t\t\t\titem.removeAttribute('title')\r\n\t\t\t}\r\n\t\t})\r\n\t}\r\n\r\n\t// Note: Hover-based label showing removed for M3 compliance\r\n\t// Labels are now controlled via labelVisibility property and expanded state\r\n\r\n\t/**\r\n\t * Programmatically expand the navigation rail\r\n\t */\r\n\texpand() {\r\n\t\tthis.expanded = true\r\n\t}\r\n\r\n\t/**\r\n\t * Programmatically collapse the navigation rail\r\n\t */\r\n\tcollapse() {\r\n\t\tthis.expanded = false\r\n\t}\r\n\r\n\t/**\r\n\t * Add a boat item to the navigation rail\r\n\t * @param config Configuration for the boat item\r\n\t * @returns The created or existing navigation rail item element\r\n\t */\r\n\tpublic addBoatItem(config: { id: string; title: string; icon?: string }) {\r\n\t\t// Check if item already exists\r\n\t\tconst existingItem = this.querySelector(`[value=\"${config.id}\"]`) as HTMLElement\r\n\t\tif (existingItem) {\r\n\t\t\t// Item already exists, just return it\r\n\t\t\treturn existingItem\r\n\t\t}\r\n\r\n\t\t// Create new item\r\n\t\tconst item = document.createElement('schmancy-navigation-rail-item')\r\n\t\titem.setAttribute('value', config.id)\r\n\t\titem.innerHTML = `\r\n\t\t\t<schmancy-icon slot=\"icon\">${config.icon || 'widgets'}</schmancy-icon>\r\n\t\t\t${config.title}\r\n\t\t`\r\n\t\t// Add to the rail before any footer content\r\n\t\tconst footer = this.querySelector('[slot=\"footer\"]')\r\n\t\tif (footer) {\r\n\t\t\tthis.insertBefore(item, footer)\r\n\t\t} else {\r\n\t\t\tthis.appendChild(item)\r\n\t\t}\r\n\t\treturn item\r\n\t}\r\n\r\n\t/**\r\n\t * Toggle the navigation rail between expanded and collapsed states\r\n\t */\r\n\ttoggle() {\r\n\t\tthis.expanded = !this.expanded\r\n\t}\r\n\r\n\r\n\tprivate handleKeyDown(event: KeyboardEvent) {\r\n\t\tconst items = this.navigationItems\r\n\t\tif (items.length === 0) return\r\n\r\n\t\tlet newIndex = this.focusedIndex >= 0 ? this.focusedIndex : this.activeIndex\r\n\r\n\t\tswitch (event.key) {\r\n\t\t\tcase 'ArrowDown':\r\n\t\t\t\tevent.preventDefault()\r\n\t\t\t\tnewIndex = (newIndex + 1) % items.length\r\n\t\t\t\tbreak\r\n\t\t\tcase 'ArrowUp':\r\n\t\t\t\tevent.preventDefault()\r\n\t\t\t\tnewIndex = newIndex <= 0 ? items.length - 1 : newIndex - 1\r\n\t\t\t\tbreak\r\n\t\t\tcase 'Home':\r\n\t\t\t\tevent.preventDefault()\r\n\t\t\t\tnewIndex = 0\r\n\t\t\t\tbreak\r\n\t\t\tcase 'End':\r\n\t\t\t\tevent.preventDefault()\r\n\t\t\t\tnewIndex = items.length - 1\r\n\t\t\t\tbreak\r\n\t\t\tcase 'Enter':\r\n\t\t\tcase ' ':\r\n\t\t\t\tevent.preventDefault()\r\n\t\t\t\tif (newIndex >= 0) {\r\n\t\t\t\t\titems[newIndex].click()\r\n\t\t\t\t}\r\n\t\t\t\treturn\r\n\t\t\tdefault:\r\n\t\t\t\treturn\r\n\t\t}\r\n\r\n\t\tthis.focusedIndex = newIndex\r\n\t\titems[newIndex].focus()\r\n\t}\r\n\r\n\tprivate handleFabClick(event: Event) {\r\n\t\tevent.stopPropagation()\r\n\t\tthis.dispatchEvent(\r\n\t\t\tnew CustomEvent('fab-click', {\r\n\t\t\t\tbubbles: true,\r\n\t\t\t\tcomposed: true,\r\n\t\t\t}),\r\n\t\t)\r\n\t}\r\n\r\n\tprivate handleMenuClick(event: Event) {\r\n\t\tevent.stopPropagation()\r\n\t\tthis.dispatchEvent(\r\n\t\t\tnew CustomEvent('menu-click', {\r\n\t\t\t\tbubbles: true,\r\n\t\t\t\tcomposed: true,\r\n\t\t\t}),\r\n\t\t)\r\n\t}\r\n\r\n\tprotected render() {\r\n\t\t// Host-level classes for the navigation rail\r\n\t\tconst hostClasses = this.classMap({\r\n\t\t\t// Layout & Structure - Fixed width to prevent layout shift\r\n\t\t\t'flex flex-col': true,\r\n\t\t\t'h-full': true,\r\n\t\t\t'box-border relative overflow-visible': true,\r\n\t\t\t'z-10 hover:z-[100]': true, // Base z-index, elevated on hover for overlay\r\n\r\n\t\t\t// Width - collapses to 0 when fullscreen\r\n\t\t\t'w-20': !this.isFullscreen, // w-20 = 80px fixed width (M3 spec: 80dp)\r\n\t\t\t'w-0': this.isFullscreen, // Collapse width to 0 in fullscreen\r\n\r\n\t\t\t// Visibility and transition\r\n\t\t\t'transition-all duration-300 ease-emphasized': true,\r\n\t\t\t'opacity-100': !this.isFullscreen,\r\n\t\t\t'opacity-0 pointer-events-none': this.isFullscreen,\r\n\t\t\t'overflow-hidden': this.isFullscreen, // Hide overflow when collapsed\r\n\t\t})\r\n\r\n\t\t// Rail container - programmatically controlled width\r\n\t\tconst railClasses = this.classMap({\r\n\t\t\t// Layout & Structure\r\n\t\t\t'flex flex-col h-full': true,\r\n\t\t\t'box-border relative': true,\r\n\t\t\t'py-2': true,\r\n\r\n\r\n\t\t\t// M3 Colors & Theme\r\n\t\t\t'bg-container-lowest text-surface-on': true,\r\n\r\n\t\t\t// M3 Motion - smooth transitions for width and shadow\r\n\t\t\t'transition-all duration-300 ease-emphasized': true,\r\n\r\n\t\t\t// Collapsed state (default) - M3 standard 80px width\r\n\t\t\t'w-20': !this.expanded, // w-20 = 80px (M3 spec: 80dp)\r\n\t\t\t'px-3': !this.expanded, // px-3 = 12px (M3 spec: 12px to center 56px items)\r\n\r\n\t\t\t// Expanded state - M3 expanded width with shadow\r\n\t\t\t'w-60': this.expanded, // w-60 = 240px expanded width\r\n\t\t\t'px-4': this.expanded, // Larger padding when expanded\r\n\t\t\t'shadow-lg': this.expanded, // M3 elevation 3 shadow when expanded\r\n\t\t})\r\n\r\n\t\t// Header section classes - hidden when no content\r\n\t\tconst headerClasses = this.classMap({\r\n\t\t\t'flex flex-col items-center gap-1': true,\r\n\t\t\t'hidden': !this.hasHeaderContent,\r\n\t\t})\r\n\r\n\t\t// Navigation container classes with alignment\r\n\t\tconst navClasses = this.classMap({\r\n\t\t\t'flex-1 flex flex-col gap-3': true, // gap-3 = 12px (M3 spec: 12px item spacing)\r\n\t\t\t'min-h-0': true, // Allow flex shrinking and proper scroll container height calculation\r\n\t\t\t// Alignment variants\r\n\t\t\t'justify-start': this.alignment === 'top',\r\n\t\t\t'justify-center': this.alignment === 'center',\r\n\t\t\t'justify-end': this.alignment === 'bottom',\r\n\t\t})\r\n\r\n\t\t// Footer section classes\r\n\t\tconst footerClasses = this.classMap({\r\n\t\t\t'flex flex-col items-center gap-1 mt-auto pt-2': true,\r\n\t\t})\r\n\r\n\t\treturn html`\r\n\t\t\t<div\r\n\t\t\t\tclass=${hostClasses}\r\n\t\t\t>\r\n\t\t\t\t<div class=${railClasses} part=\"rail\">\r\n\t\t\t\t\t<div class=${headerClasses} part=\"header\">\r\n\t\t\t\t\t\t<slot name=\"fab\" @click=${this.handleFabClick} @slotchange=${this.handleHeaderSlotChange}></slot>\r\n\t\t\t\t\t\t<slot name=\"menu\" @click=${this.handleMenuClick} @slotchange=${this.handleHeaderSlotChange}></slot>\r\n\t\t\t\t\t\t<slot name=\"header\" @slotchange=${this.handleHeaderSlotChange}></slot>\r\n\t\t\t\t\t</div>\r\n\r\n\t\t\t\t\t<nav class=${navClasses} part=\"nav\" role=\"list\">\r\n\t\t\t\t\t\t<schmancy-scroll hide direction=\"vertical\">\r\n\t\t\t\t\t\t\t<slot @slotchange=${this.handleSlotChange}></slot>\r\n\t\t\t\t\t\t</schmancy-scroll>\r\n\t\t\t\t\t</nav>\r\n\r\n\t\t\t\t\t<div class=${footerClasses} part=\"footer\">\r\n\t\t\t\t\t\t<slot name=\"footer\"></slot>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t`\r\n\t}\r\n\r\n\tprivate setupNavigateListener() {\r\n\t\t// Listen for navigate events from child items\r\n\t\tthis.addEventListener('navigate', (e: Event) => {\r\n\t\t\tif (e instanceof CustomEvent) {\r\n\t\t\t\tconst value = e.detail\r\n\t\t\t\t// Find the item that dispatched the event and update active state\r\n\t\t\t\tconst itemIndex = this.navigationItems.findIndex(item => item.value === value || item.label === value)\r\n\t\t\t\tif (itemIndex >= 0) {\r\n\t\t\t\t\tthis.activeIndex = itemIndex\r\n\t\t\t\t\tthis._activeValue = value\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t})\r\n\t}\r\n\r\n\tprivate handleHeaderSlotChange() {\r\n\t\t// Check if any header slot has content\r\n\t\tconst headerDiv = this.shadowRoot?.querySelector('[part=\"header\"]')\r\n\t\tif (headerDiv) {\r\n\t\t\tconst allSlots = headerDiv.querySelectorAll('slot')\r\n\t\t\tthis.hasHeaderContent = Array.from(allSlots).some(s =>\r\n\t\t\t\ts.assignedNodes({ flatten: true }).length > 0\r\n\t\t\t)\r\n\t\t}\r\n\t}\r\n\r\n\tprivate handleSlotChange() {\r\n\t\t// Update items when slot content changes\r\n\t\tthis.updateLabelVisibility()\r\n\t\tthis.updateActiveStates(this.activeIndex)\r\n\r\n\t\t// Set ARIA attributes on items\r\n\t\tthis.navigationItems.forEach((item, index) => {\r\n\t\t\titem.setAttribute('role', 'listitem')\r\n\t\t\tif (!item.hasAttribute('tabindex')) {\r\n\t\t\t\titem.setAttribute('tabindex', index === this.activeIndex ? '0' : '-1')\r\n\t\t\t}\r\n\t\t})\r\n\t}\r\n}\r\n\r\ndeclare global {\r\n\tinterface HTMLElementTagNameMap {\r\n\t\t'schmancy-navigation-rail': SchmancyNavigationRail\r\n\t}\r\n}\r\n"],"mappings":"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"}

package/dist/sheet-DdlZhnDG.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"sheet-DdlZhnDG.cjs","names":[],"sources":["../src/sheet/hook.ts","../src/sheet/sheet.ts"],"sourcesContent":["// @watch decorator\n//\n// Runs when an observed property changes, e.g. @property or @state, but before the component updates.\n//\n// To wait for an update to complete after a change occurs, use `await this.updateComplete` in the handler. To start\n// watching after the initial update/render, use `{ waitUntilFirstUpdate: true }` or `this.hasUpdated` in the handler.\n//\n// Usage:\n//\n//  @watch('propName')\n//  handlePropChange(oldValue, newValue) {\n//    ...\n//  }\n//\ninterface WatchOptions {\n\twaitUntilFirstUpdate?: boolean\n}\n\nexport function on(propName: string, options?: WatchOptions) {\n\treturn (protoOrDescriptor: any, name: string): any => {\n\t\tconst { willUpdate } = protoOrDescriptor\n\n\t\toptions = Object.assign({ waitUntilFirstUpdate: false }, options) as WatchOptions\n\n\t\tprotoOrDescriptor.willUpdate = function (changedProps: Map<string, any>) {\n\t\t\twillUpdate.call(this, changedProps)\n\n\t\t\tif (changedProps.has(propName)) {\n\t\t\t\tconst oldValue = changedProps.get(propName)\n\t\t\t\tconst newValue = this[propName]\n\n\t\t\t\tif (oldValue !== newValue) {\n\t\t\t\t\tif (!options?.waitUntilFirstUpdate || this.hasUpdated) {\n\t\t\t\t\t\tthis[name].call(this, oldValue, newValue)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n","import { $LitElement } from '@mixins/index'\nimport { area } from '../area'\nimport { html, css } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { fromEvent, merge, takeUntil, tap, filter } from 'rxjs'\nimport { on } from './hook'\nimport { SchmancySheetPosition, sheet } from './sheet.service'\nimport { BLACKBIRD_EASING, DURATION_ENTER, DURATION_EXIT, DURATION_BACKDROP, EASE_OUT, EASE_IN } from '../utils/animation'\n\n@customElement('schmancy-sheet')\nexport default class SchmancySheet extends $LitElement(css`\n\t:host {\n\t\tposition: fixed;\n\t\tinset: 0;\n\t\tz-index: var(--schmancy-overlay-z, 999);\n\t\tdisplay: none;\n\t}\n\t:host([open]) {\n\t\tdisplay: block;\n\t}\n\n\t/* Luminous edge glow on sheet panel */\n\t.content {\n\t\tbox-shadow: -8px 0 40px -8px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 15%, transparent);\n\t}\n\n\t:host([position='bottom']) .content {\n\t\tbox-shadow: 0 -8px 40px -8px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 15%, transparent);\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t.content { box-shadow: var(--schmancy-sys-elevation-3); }\n\t}\n`) {\n\t// uid is inherited from $LitElement mixin - auto-generated or set via attribute\n\t@property({ type: Boolean, reflect: true }) open = false\n\t@property({ type: String, reflect: true }) position: SchmancySheetPosition = SchmancySheetPosition.Side\n\t@property({ type: Boolean, reflect: true }) persist = false\n\t@property({ type: Boolean, reflect: true }) lock = false\n\t@property({ type: Boolean, reflect: true }) handleHistory = true\n\n\tprivate lastFocusedElement: HTMLElement | null = null\n\t@query('.overlay') private overlayEl!: HTMLDivElement\n\t@query('.content') private contentEl!: HTMLDivElement\n\n\t@on('open')\n\tonOpenChange(_oldValue: boolean, newValue: boolean) {\n\t\tif (newValue) {\n\t\t\tthis.lastFocusedElement = document.activeElement as HTMLElement\n\t\t\tthis.setBackgroundInert(true)\n\t\t\tthis.animateIn()\n\t\t\tthis.focus()\n\t\t} else {\n\t\t\tthis.animateOut()\n\t\t\tthis.setBackgroundInert(false)\n\t\t\tthis.lastFocusedElement?.focus()\n\t\t\tthis.lastFocusedElement = null\n\t\t}\n\t}\n\n\tprivate animateIn() {\n\t\tif (!this.overlayEl || !this.contentEl) return\n\n\t\tthis.overlayEl.animate([{ opacity: 0 }, { opacity: 1 }], {\n\t\t\tduration: DURATION_BACKDROP,\n\t\t\teasing: EASE_OUT,\n\t\t\tfill: 'forwards',\n\t\t})\n\n\t\tconst animation =\n\t\t\tthis.position === SchmancySheetPosition.Side\n\t\t\t\t? [\n\t\t\t\t\t\t{ opacity: 0, transform: 'translateX(100%) scale(0.95)' },\n\t\t\t\t\t\t{ opacity: 1, transform: 'translateX(0) scale(1)' },\n\t\t\t\t\t]\n\t\t\t\t: [\n\t\t\t\t\t\t{ opacity: 0, transform: 'translateY(100%) scale(0.95)' },\n\t\t\t\t\t\t{ opacity: 1, transform: 'translateY(0) scale(1)' },\n\t\t\t\t\t]\n\n\t\tthis.contentEl.animate(animation, {\n\t\t\tduration: DURATION_ENTER,\n\t\t\teasing: BLACKBIRD_EASING,\n\t\t\tfill: 'forwards',\n\t\t})\n\t}\n\n\tprivate animateOut() {\n\t\tif (!this.overlayEl || !this.contentEl) return\n\n\t\tthis.overlayEl.animate([{ opacity: 1 }, { opacity: 0 }], {\n\t\t\tduration: DURATION_EXIT,\n\t\t\teasing: EASE_OUT,\n\t\t\tfill: 'forwards',\n\t\t})\n\n\t\tconst animation =\n\t\t\tthis.position === SchmancySheetPosition.Side\n\t\t\t\t? [\n\t\t\t\t\t\t{ opacity: 1, transform: 'translateX(0) scale(1)' },\n\t\t\t\t\t\t{ opacity: 0, transform: 'translateX(100%) scale(0.98)' },\n\t\t\t\t\t]\n\t\t\t\t: [\n\t\t\t\t\t\t{ opacity: 1, transform: 'translateY(0) scale(1)' },\n\t\t\t\t\t\t{ opacity: 0, transform: 'translateY(100%) scale(0.98)' },\n\t\t\t\t\t]\n\n\t\tthis.contentEl.animate(animation, {\n\t\t\tduration: DURATION_EXIT,\n\t\t\teasing: EASE_IN,\n\t\t\tfill: 'forwards',\n\t\t})\n\t}\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\tthis.setupEventListeners()\n\t}\n\n\tdisconnectedCallback() {\n\t\tsuper.disconnectedCallback()\n\t\tthis.disconnecting.next(true)\n\t}\n\n\tprivate setupEventListeners() {\n\t\t// Handle browser back button\n\t\tconst popState$ = fromEvent<PopStateEvent>(window, 'popstate').pipe(\n\t\t\tfilter(() => this.handleHistory),\n\t\t\ttap(e => {\n\t\t\t\te.preventDefault()\n\t\t\t\tthis.closeSheet()\n\t\t\t}),\n\t\t)\n\n\t\t// Handle ESC key\n\t\tconst keyUp$ = fromEvent<KeyboardEvent>(this, 'keydown').pipe(\n\t\t\ttap(event => {\n\t\t\t\tif (event.key === 'Escape' && !this.lock && this.open) {\n\t\t\t\t\tevent.preventDefault()\n\t\t\t\t\tevent.stopPropagation()\n\t\t\t\t\tsheet.dismiss(this.uid)\n\t\t\t\t}\n\t\t\t}),\n\t\t)\n\n\t\t// Handle render events from sheet service\n\t\tconst render$ = fromEvent<CustomEvent>(window, 'schmancy-sheet-render').pipe(\n\t\t\tfilter(e => e.detail.uid === this.uid),\n\t\t\ttap(e => {\n\t\t\t\tarea.push({\n\t\t\t\t\tarea: this.uid,\n\t\t\t\t\tcomponent: e.detail.component,\n\t\t\t\t\tprops: e.detail.props,\n\t\t\t\t\thistoryStrategy: 'silent',\n\t\t\t\t})\n\t\t\t}),\n\t\t)\n\n\t\t// Handle dismiss events from sheet service\n\t\tconst dismiss$ = fromEvent<CustomEvent>(window, 'schmancy-sheet-dismiss').pipe(\n\t\t\tfilter(e => e.detail.uid === this.uid),\n\t\t\ttap(() => {\n\t\t\t\tthis.closeSheet()\n\t\t\t}),\n\t\t)\n\n\t\tmerge(popState$, keyUp$, render$, dismiss$).pipe(takeUntil(this.disconnecting)).subscribe()\n\t}\n\n\tprivate setBackgroundInert(inert: boolean) {\n\t\tconst parent = this.parentElement\n\t\tif (!parent) return\n\n\t\tArray.from(parent.children).forEach(child => {\n\t\t\tif (child !== this && child instanceof HTMLElement) {\n\t\t\t\tchild.toggleAttribute('inert', inert)\n\t\t\t}\n\t\t})\n\t}\n\n\tcloseSheet() {\n\t\tthis.open = false\n\t\tthis.dispatchEvent(new CustomEvent('close'))\n\t}\n\n\toverride focus() {\n\t\t// delegatesFocus in shadowRootOptions handles automatic focus\n\t\t// Just focus first element with autofocus attribute if present\n\t\tconst element = this.querySelector('[autofocus]')\n\t\tif (element instanceof HTMLElement) {\n\t\t\telement.focus()\n\t\t}\n\t}\n\n\tprivate handleOverlayClick = (e: Event) => {\n\t\te.stopPropagation()\n\t\tif (!this.lock) {\n\t\t\tsheet.dismiss(this.uid)\n\t\t}\n\t}\n\n\trender() {\n\t\tconst sheetClasses = `absolute inset-0 flex h-full`\n\n\t\tconst overlayClasses = `overlay absolute inset-0 bg-surface-container/10 backdrop-blur-lg backdrop-saturate-150 ${this.lock ? '' : 'cursor-pointer'}`\n\n\t\tconst contentClasses =\n\t\t\tthis.position === SchmancySheetPosition.Side\n\t\t\t\t? 'content h-full min-w-[320px] max-w-[90vw] w-fit ml-auto z-10'\n\t\t\t\t: 'content w-full mt-auto rounded-t-2xl max-h-[90vh] z-10'\n\n\t\tconst surfaceClasses =\n\t\t\tthis.position === SchmancySheetPosition.Side\n\t\t\t\t? 'h-full overflow-auto'\n\t\t\t\t: 'max-h-[90vh] overflow-auto'\n\n\t\treturn html`\n\t\t\t<div class=${sheetClasses} role=\"dialog\" aria-hidden=${!this.open} aria-modal=${this.open} tabindex=\"0\">\n\t\t\t\t<div class=${overlayClasses} @click=${this.handleOverlayClick}></div>\n\t\t\t\t<div class=${contentClasses}>\n\t\t\t\t\t<schmancy-surface rounded=\"left\" fill=\"all\" id=\"body\" class=${surfaceClasses} type=\"solid\">\n\t\t\t\t\t\t<schmancy-area class=\"size-full overflow-auto\" name=${this.uid}>\n\t\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t\t</schmancy-area>\n\t\t\t\t\t</schmancy-surface>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-sheet': SchmancySheet\n\t}\n}\n"],"mappings":"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"}
+{"version":3,"file":"sheet-DdlZhnDG.cjs","names":[],"sources":["../src/sheet/hook.ts","../src/sheet/sheet.ts"],"sourcesContent":["// @watch decorator\n//\n// Runs when an observed property changes, e.g. @property or @state, but before the component updates.\n//\n// To wait for an update to complete after a change occurs, use `await this.updateComplete` in the handler. To start\n// watching after the initial update/render, use `{ waitUntilFirstUpdate: true }` or `this.hasUpdated` in the handler.\n//\n// Usage:\n//\n//  @watch('propName')\n//  handlePropChange(oldValue, newValue) {\n//    ...\n//  }\n//\ninterface WatchOptions {\n\twaitUntilFirstUpdate?: boolean\n}\n\nexport function on(propName: string, options?: WatchOptions) {\n\treturn (protoOrDescriptor: any, name: string): any => {\n\t\tconst { willUpdate } = protoOrDescriptor\n\n\t\toptions = Object.assign({ waitUntilFirstUpdate: false }, options) as WatchOptions\n\n\t\tprotoOrDescriptor.willUpdate = function (changedProps: Map<string, any>) {\n\t\t\twillUpdate.call(this, changedProps)\n\n\t\t\tif (changedProps.has(propName)) {\n\t\t\t\tconst oldValue = changedProps.get(propName)\n\t\t\t\tconst newValue = this[propName]\n\n\t\t\t\tif (oldValue !== newValue) {\n\t\t\t\t\tif (!options?.waitUntilFirstUpdate || this.hasUpdated) {\n\t\t\t\t\t\tthis[name].call(this, oldValue, newValue)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n","import { $LitElement } from '@mixins/index'\nimport { area } from '../area'\nimport { html, css } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { fromEvent, merge, takeUntil, tap, filter } from 'rxjs'\nimport { on } from './hook'\nimport { SchmancySheetPosition, sheet } from './sheet.service'\nimport { BLACKBIRD_EASING, DURATION_ENTER, DURATION_EXIT, DURATION_BACKDROP, EASE_OUT, EASE_IN } from '../utils/animation'\n\n/**\n * Side-docked or bottom-docked panel — a dialog variant that slides in from an edge. Driven imperatively by the `sheet` service; rarely instantiated directly.\n *\n * @element schmancy-sheet\n * @summary Prefer `sheet.open({ component, position })` over placing this element declaratively — the service handles stacking, focus, close on outside-click, ESC, and router integration.\n * @example\n * import { sheet, SchmancySheetPosition } from '@mhmo91/schmancy'\n * sheet.open({\n *   component: new MyEditorElement(),\n *   position: SchmancySheetPosition.Side,\n *   title: 'Edit item',\n * })\n * @platform dialog close - Positioned-fixed panel with backdrop. Degrades to a `<dialog>` if the tag never registers — loses slide animation, keeps focus trap + dismiss.\n * @attr position - `'side' | 'bottom'`. Which edge the sheet docks to.\n * @attr open - Boolean; sheet is visible when true.\n * @fires close - When the sheet is dismissed (backdrop click, close button, ESC).\n */\n@customElement('schmancy-sheet')\nexport default class SchmancySheet extends $LitElement(css`\n\t:host {\n\t\tposition: fixed;\n\t\tinset: 0;\n\t\tz-index: var(--schmancy-overlay-z, 999);\n\t\tdisplay: none;\n\t}\n\t:host([open]) {\n\t\tdisplay: block;\n\t}\n\n\t/* Luminous edge glow on sheet panel */\n\t.content {\n\t\tbox-shadow: -8px 0 40px -8px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 15%, transparent);\n\t}\n\n\t:host([position='bottom']) .content {\n\t\tbox-shadow: 0 -8px 40px -8px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 15%, transparent);\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t.content { box-shadow: var(--schmancy-sys-elevation-3); }\n\t}\n`) {\n\t// uid is inherited from $LitElement mixin - auto-generated or set via attribute\n\t@property({ type: Boolean, reflect: true }) open = false\n\t@property({ type: String, reflect: true }) position: SchmancySheetPosition = SchmancySheetPosition.Side\n\t@property({ type: Boolean, reflect: true }) persist = false\n\t@property({ type: Boolean, reflect: true }) lock = false\n\t@property({ type: Boolean, reflect: true }) handleHistory = true\n\n\tprivate lastFocusedElement: HTMLElement | null = null\n\t@query('.overlay') private overlayEl!: HTMLDivElement\n\t@query('.content') private contentEl!: HTMLDivElement\n\n\t@on('open')\n\tonOpenChange(_oldValue: boolean, newValue: boolean) {\n\t\tif (newValue) {\n\t\t\tthis.lastFocusedElement = document.activeElement as HTMLElement\n\t\t\tthis.setBackgroundInert(true)\n\t\t\tthis.animateIn()\n\t\t\tthis.focus()\n\t\t} else {\n\t\t\tthis.animateOut()\n\t\t\tthis.setBackgroundInert(false)\n\t\t\tthis.lastFocusedElement?.focus()\n\t\t\tthis.lastFocusedElement = null\n\t\t}\n\t}\n\n\tprivate animateIn() {\n\t\tif (!this.overlayEl || !this.contentEl) return\n\n\t\tthis.overlayEl.animate([{ opacity: 0 }, { opacity: 1 }], {\n\t\t\tduration: DURATION_BACKDROP,\n\t\t\teasing: EASE_OUT,\n\t\t\tfill: 'forwards',\n\t\t})\n\n\t\tconst animation =\n\t\t\tthis.position === SchmancySheetPosition.Side\n\t\t\t\t? [\n\t\t\t\t\t\t{ opacity: 0, transform: 'translateX(100%) scale(0.95)' },\n\t\t\t\t\t\t{ opacity: 1, transform: 'translateX(0) scale(1)' },\n\t\t\t\t\t]\n\t\t\t\t: [\n\t\t\t\t\t\t{ opacity: 0, transform: 'translateY(100%) scale(0.95)' },\n\t\t\t\t\t\t{ opacity: 1, transform: 'translateY(0) scale(1)' },\n\t\t\t\t\t]\n\n\t\tthis.contentEl.animate(animation, {\n\t\t\tduration: DURATION_ENTER,\n\t\t\teasing: BLACKBIRD_EASING,\n\t\t\tfill: 'forwards',\n\t\t})\n\t}\n\n\tprivate animateOut() {\n\t\tif (!this.overlayEl || !this.contentEl) return\n\n\t\tthis.overlayEl.animate([{ opacity: 1 }, { opacity: 0 }], {\n\t\t\tduration: DURATION_EXIT,\n\t\t\teasing: EASE_OUT,\n\t\t\tfill: 'forwards',\n\t\t})\n\n\t\tconst animation =\n\t\t\tthis.position === SchmancySheetPosition.Side\n\t\t\t\t? [\n\t\t\t\t\t\t{ opacity: 1, transform: 'translateX(0) scale(1)' },\n\t\t\t\t\t\t{ opacity: 0, transform: 'translateX(100%) scale(0.98)' },\n\t\t\t\t\t]\n\t\t\t\t: [\n\t\t\t\t\t\t{ opacity: 1, transform: 'translateY(0) scale(1)' },\n\t\t\t\t\t\t{ opacity: 0, transform: 'translateY(100%) scale(0.98)' },\n\t\t\t\t\t]\n\n\t\tthis.contentEl.animate(animation, {\n\t\t\tduration: DURATION_EXIT,\n\t\t\teasing: EASE_IN,\n\t\t\tfill: 'forwards',\n\t\t})\n\t}\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\tthis.setupEventListeners()\n\t}\n\n\tdisconnectedCallback() {\n\t\tsuper.disconnectedCallback()\n\t\tthis.disconnecting.next(true)\n\t}\n\n\tprivate setupEventListeners() {\n\t\t// Handle browser back button\n\t\tconst popState$ = fromEvent<PopStateEvent>(window, 'popstate').pipe(\n\t\t\tfilter(() => this.handleHistory),\n\t\t\ttap(e => {\n\t\t\t\te.preventDefault()\n\t\t\t\tthis.closeSheet()\n\t\t\t}),\n\t\t)\n\n\t\t// Handle ESC key\n\t\tconst keyUp$ = fromEvent<KeyboardEvent>(this, 'keydown').pipe(\n\t\t\ttap(event => {\n\t\t\t\tif (event.key === 'Escape' && !this.lock && this.open) {\n\t\t\t\t\tevent.preventDefault()\n\t\t\t\t\tevent.stopPropagation()\n\t\t\t\t\tsheet.dismiss(this.uid)\n\t\t\t\t}\n\t\t\t}),\n\t\t)\n\n\t\t// Handle render events from sheet service\n\t\tconst render$ = fromEvent<CustomEvent>(window, 'schmancy-sheet-render').pipe(\n\t\t\tfilter(e => e.detail.uid === this.uid),\n\t\t\ttap(e => {\n\t\t\t\tarea.push({\n\t\t\t\t\tarea: this.uid,\n\t\t\t\t\tcomponent: e.detail.component,\n\t\t\t\t\tprops: e.detail.props,\n\t\t\t\t\thistoryStrategy: 'silent',\n\t\t\t\t})\n\t\t\t}),\n\t\t)\n\n\t\t// Handle dismiss events from sheet service\n\t\tconst dismiss$ = fromEvent<CustomEvent>(window, 'schmancy-sheet-dismiss').pipe(\n\t\t\tfilter(e => e.detail.uid === this.uid),\n\t\t\ttap(() => {\n\t\t\t\tthis.closeSheet()\n\t\t\t}),\n\t\t)\n\n\t\tmerge(popState$, keyUp$, render$, dismiss$).pipe(takeUntil(this.disconnecting)).subscribe()\n\t}\n\n\tprivate setBackgroundInert(inert: boolean) {\n\t\tconst parent = this.parentElement\n\t\tif (!parent) return\n\n\t\tArray.from(parent.children).forEach(child => {\n\t\t\tif (child !== this && child instanceof HTMLElement) {\n\t\t\t\tchild.toggleAttribute('inert', inert)\n\t\t\t}\n\t\t})\n\t}\n\n\tcloseSheet() {\n\t\tthis.open = false\n\t\tthis.dispatchEvent(new CustomEvent('close'))\n\t}\n\n\toverride focus() {\n\t\t// delegatesFocus in shadowRootOptions handles automatic focus\n\t\t// Just focus first element with autofocus attribute if present\n\t\tconst element = this.querySelector('[autofocus]')\n\t\tif (element instanceof HTMLElement) {\n\t\t\telement.focus()\n\t\t}\n\t}\n\n\tprivate handleOverlayClick = (e: Event) => {\n\t\te.stopPropagation()\n\t\tif (!this.lock) {\n\t\t\tsheet.dismiss(this.uid)\n\t\t}\n\t}\n\n\trender() {\n\t\tconst sheetClasses = `absolute inset-0 flex h-full`\n\n\t\tconst overlayClasses = `overlay absolute inset-0 bg-surface-container/10 backdrop-blur-lg backdrop-saturate-150 ${this.lock ? '' : 'cursor-pointer'}`\n\n\t\tconst contentClasses =\n\t\t\tthis.position === SchmancySheetPosition.Side\n\t\t\t\t? 'content h-full min-w-[320px] max-w-[90vw] w-fit ml-auto z-10'\n\t\t\t\t: 'content w-full mt-auto rounded-t-2xl max-h-[90vh] z-10'\n\n\t\tconst surfaceClasses =\n\t\t\tthis.position === SchmancySheetPosition.Side\n\t\t\t\t? 'h-full overflow-auto'\n\t\t\t\t: 'max-h-[90vh] overflow-auto'\n\n\t\treturn html`\n\t\t\t<div class=${sheetClasses} role=\"dialog\" aria-hidden=${!this.open} aria-modal=${this.open} tabindex=\"0\">\n\t\t\t\t<div class=${overlayClasses} @click=${this.handleOverlayClick}></div>\n\t\t\t\t<div class=${contentClasses}>\n\t\t\t\t\t<schmancy-surface rounded=\"left\" fill=\"all\" id=\"body\" class=${surfaceClasses} type=\"solid\">\n\t\t\t\t\t\t<schmancy-area class=\"size-full overflow-auto\" name=${this.uid}>\n\t\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t\t</schmancy-area>\n\t\t\t\t\t</schmancy-surface>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-sheet': SchmancySheet\n\t}\n}\n"],"mappings":"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"}

package/dist/sheet-LFVo5iN4.js.map

@@ -1 +1 @@
-{"version":3,"file":"sheet-LFVo5iN4.js","names":[],"sources":["../src/sheet/hook.ts","../src/sheet/sheet.ts"],"sourcesContent":["// @watch decorator\n//\n// Runs when an observed property changes, e.g. @property or @state, but before the component updates.\n//\n// To wait for an update to complete after a change occurs, use `await this.updateComplete` in the handler. To start\n// watching after the initial update/render, use `{ waitUntilFirstUpdate: true }` or `this.hasUpdated` in the handler.\n//\n// Usage:\n//\n//  @watch('propName')\n//  handlePropChange(oldValue, newValue) {\n//    ...\n//  }\n//\ninterface WatchOptions {\n\twaitUntilFirstUpdate?: boolean\n}\n\nexport function on(propName: string, options?: WatchOptions) {\n\treturn (protoOrDescriptor: any, name: string): any => {\n\t\tconst { willUpdate } = protoOrDescriptor\n\n\t\toptions = Object.assign({ waitUntilFirstUpdate: false }, options) as WatchOptions\n\n\t\tprotoOrDescriptor.willUpdate = function (changedProps: Map<string, any>) {\n\t\t\twillUpdate.call(this, changedProps)\n\n\t\t\tif (changedProps.has(propName)) {\n\t\t\t\tconst oldValue = changedProps.get(propName)\n\t\t\t\tconst newValue = this[propName]\n\n\t\t\t\tif (oldValue !== newValue) {\n\t\t\t\t\tif (!options?.waitUntilFirstUpdate || this.hasUpdated) {\n\t\t\t\t\t\tthis[name].call(this, oldValue, newValue)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n","import { $LitElement } from '@mixins/index'\nimport { area } from '../area'\nimport { html, css } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { fromEvent, merge, takeUntil, tap, filter } from 'rxjs'\nimport { on } from './hook'\nimport { SchmancySheetPosition, sheet } from './sheet.service'\nimport { BLACKBIRD_EASING, DURATION_ENTER, DURATION_EXIT, DURATION_BACKDROP, EASE_OUT, EASE_IN } from '../utils/animation'\n\n@customElement('schmancy-sheet')\nexport default class SchmancySheet extends $LitElement(css`\n\t:host {\n\t\tposition: fixed;\n\t\tinset: 0;\n\t\tz-index: var(--schmancy-overlay-z, 999);\n\t\tdisplay: none;\n\t}\n\t:host([open]) {\n\t\tdisplay: block;\n\t}\n\n\t/* Luminous edge glow on sheet panel */\n\t.content {\n\t\tbox-shadow: -8px 0 40px -8px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 15%, transparent);\n\t}\n\n\t:host([position='bottom']) .content {\n\t\tbox-shadow: 0 -8px 40px -8px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 15%, transparent);\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t.content { box-shadow: var(--schmancy-sys-elevation-3); }\n\t}\n`) {\n\t// uid is inherited from $LitElement mixin - auto-generated or set via attribute\n\t@property({ type: Boolean, reflect: true }) open = false\n\t@property({ type: String, reflect: true }) position: SchmancySheetPosition = SchmancySheetPosition.Side\n\t@property({ type: Boolean, reflect: true }) persist = false\n\t@property({ type: Boolean, reflect: true }) lock = false\n\t@property({ type: Boolean, reflect: true }) handleHistory = true\n\n\tprivate lastFocusedElement: HTMLElement | null = null\n\t@query('.overlay') private overlayEl!: HTMLDivElement\n\t@query('.content') private contentEl!: HTMLDivElement\n\n\t@on('open')\n\tonOpenChange(_oldValue: boolean, newValue: boolean) {\n\t\tif (newValue) {\n\t\t\tthis.lastFocusedElement = document.activeElement as HTMLElement\n\t\t\tthis.setBackgroundInert(true)\n\t\t\tthis.animateIn()\n\t\t\tthis.focus()\n\t\t} else {\n\t\t\tthis.animateOut()\n\t\t\tthis.setBackgroundInert(false)\n\t\t\tthis.lastFocusedElement?.focus()\n\t\t\tthis.lastFocusedElement = null\n\t\t}\n\t}\n\n\tprivate animateIn() {\n\t\tif (!this.overlayEl || !this.contentEl) return\n\n\t\tthis.overlayEl.animate([{ opacity: 0 }, { opacity: 1 }], {\n\t\t\tduration: DURATION_BACKDROP,\n\t\t\teasing: EASE_OUT,\n\t\t\tfill: 'forwards',\n\t\t})\n\n\t\tconst animation =\n\t\t\tthis.position === SchmancySheetPosition.Side\n\t\t\t\t? [\n\t\t\t\t\t\t{ opacity: 0, transform: 'translateX(100%) scale(0.95)' },\n\t\t\t\t\t\t{ opacity: 1, transform: 'translateX(0) scale(1)' },\n\t\t\t\t\t]\n\t\t\t\t: [\n\t\t\t\t\t\t{ opacity: 0, transform: 'translateY(100%) scale(0.95)' },\n\t\t\t\t\t\t{ opacity: 1, transform: 'translateY(0) scale(1)' },\n\t\t\t\t\t]\n\n\t\tthis.contentEl.animate(animation, {\n\t\t\tduration: DURATION_ENTER,\n\t\t\teasing: BLACKBIRD_EASING,\n\t\t\tfill: 'forwards',\n\t\t})\n\t}\n\n\tprivate animateOut() {\n\t\tif (!this.overlayEl || !this.contentEl) return\n\n\t\tthis.overlayEl.animate([{ opacity: 1 }, { opacity: 0 }], {\n\t\t\tduration: DURATION_EXIT,\n\t\t\teasing: EASE_OUT,\n\t\t\tfill: 'forwards',\n\t\t})\n\n\t\tconst animation =\n\t\t\tthis.position === SchmancySheetPosition.Side\n\t\t\t\t? [\n\t\t\t\t\t\t{ opacity: 1, transform: 'translateX(0) scale(1)' },\n\t\t\t\t\t\t{ opacity: 0, transform: 'translateX(100%) scale(0.98)' },\n\t\t\t\t\t]\n\t\t\t\t: [\n\t\t\t\t\t\t{ opacity: 1, transform: 'translateY(0) scale(1)' },\n\t\t\t\t\t\t{ opacity: 0, transform: 'translateY(100%) scale(0.98)' },\n\t\t\t\t\t]\n\n\t\tthis.contentEl.animate(animation, {\n\t\t\tduration: DURATION_EXIT,\n\t\t\teasing: EASE_IN,\n\t\t\tfill: 'forwards',\n\t\t})\n\t}\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\tthis.setupEventListeners()\n\t}\n\n\tdisconnectedCallback() {\n\t\tsuper.disconnectedCallback()\n\t\tthis.disconnecting.next(true)\n\t}\n\n\tprivate setupEventListeners() {\n\t\t// Handle browser back button\n\t\tconst popState$ = fromEvent<PopStateEvent>(window, 'popstate').pipe(\n\t\t\tfilter(() => this.handleHistory),\n\t\t\ttap(e => {\n\t\t\t\te.preventDefault()\n\t\t\t\tthis.closeSheet()\n\t\t\t}),\n\t\t)\n\n\t\t// Handle ESC key\n\t\tconst keyUp$ = fromEvent<KeyboardEvent>(this, 'keydown').pipe(\n\t\t\ttap(event => {\n\t\t\t\tif (event.key === 'Escape' && !this.lock && this.open) {\n\t\t\t\t\tevent.preventDefault()\n\t\t\t\t\tevent.stopPropagation()\n\t\t\t\t\tsheet.dismiss(this.uid)\n\t\t\t\t}\n\t\t\t}),\n\t\t)\n\n\t\t// Handle render events from sheet service\n\t\tconst render$ = fromEvent<CustomEvent>(window, 'schmancy-sheet-render').pipe(\n\t\t\tfilter(e => e.detail.uid === this.uid),\n\t\t\ttap(e => {\n\t\t\t\tarea.push({\n\t\t\t\t\tarea: this.uid,\n\t\t\t\t\tcomponent: e.detail.component,\n\t\t\t\t\tprops: e.detail.props,\n\t\t\t\t\thistoryStrategy: 'silent',\n\t\t\t\t})\n\t\t\t}),\n\t\t)\n\n\t\t// Handle dismiss events from sheet service\n\t\tconst dismiss$ = fromEvent<CustomEvent>(window, 'schmancy-sheet-dismiss').pipe(\n\t\t\tfilter(e => e.detail.uid === this.uid),\n\t\t\ttap(() => {\n\t\t\t\tthis.closeSheet()\n\t\t\t}),\n\t\t)\n\n\t\tmerge(popState$, keyUp$, render$, dismiss$).pipe(takeUntil(this.disconnecting)).subscribe()\n\t}\n\n\tprivate setBackgroundInert(inert: boolean) {\n\t\tconst parent = this.parentElement\n\t\tif (!parent) return\n\n\t\tArray.from(parent.children).forEach(child => {\n\t\t\tif (child !== this && child instanceof HTMLElement) {\n\t\t\t\tchild.toggleAttribute('inert', inert)\n\t\t\t}\n\t\t})\n\t}\n\n\tcloseSheet() {\n\t\tthis.open = false\n\t\tthis.dispatchEvent(new CustomEvent('close'))\n\t}\n\n\toverride focus() {\n\t\t// delegatesFocus in shadowRootOptions handles automatic focus\n\t\t// Just focus first element with autofocus attribute if present\n\t\tconst element = this.querySelector('[autofocus]')\n\t\tif (element instanceof HTMLElement) {\n\t\t\telement.focus()\n\t\t}\n\t}\n\n\tprivate handleOverlayClick = (e: Event) => {\n\t\te.stopPropagation()\n\t\tif (!this.lock) {\n\t\t\tsheet.dismiss(this.uid)\n\t\t}\n\t}\n\n\trender() {\n\t\tconst sheetClasses = `absolute inset-0 flex h-full`\n\n\t\tconst overlayClasses = `overlay absolute inset-0 bg-surface-container/10 backdrop-blur-lg backdrop-saturate-150 ${this.lock ? '' : 'cursor-pointer'}`\n\n\t\tconst contentClasses =\n\t\t\tthis.position === SchmancySheetPosition.Side\n\t\t\t\t? 'content h-full min-w-[320px] max-w-[90vw] w-fit ml-auto z-10'\n\t\t\t\t: 'content w-full mt-auto rounded-t-2xl max-h-[90vh] z-10'\n\n\t\tconst surfaceClasses =\n\t\t\tthis.position === SchmancySheetPosition.Side\n\t\t\t\t? 'h-full overflow-auto'\n\t\t\t\t: 'max-h-[90vh] overflow-auto'\n\n\t\treturn html`\n\t\t\t<div class=${sheetClasses} role=\"dialog\" aria-hidden=${!this.open} aria-modal=${this.open} tabindex=\"0\">\n\t\t\t\t<div class=${overlayClasses} @click=${this.handleOverlayClick}></div>\n\t\t\t\t<div class=${contentClasses}>\n\t\t\t\t\t<schmancy-surface rounded=\"left\" fill=\"all\" id=\"body\" class=${surfaceClasses} type=\"solid\">\n\t\t\t\t\t\t<schmancy-area class=\"size-full overflow-auto\" name=${this.uid}>\n\t\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t\t</schmancy-area>\n\t\t\t\t\t</schmancy-surface>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-sheet': SchmancySheet\n\t}\n}\n"],"mappings":"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"}
+{"version":3,"file":"sheet-LFVo5iN4.js","names":[],"sources":["../src/sheet/hook.ts","../src/sheet/sheet.ts"],"sourcesContent":["// @watch decorator\n//\n// Runs when an observed property changes, e.g. @property or @state, but before the component updates.\n//\n// To wait for an update to complete after a change occurs, use `await this.updateComplete` in the handler. To start\n// watching after the initial update/render, use `{ waitUntilFirstUpdate: true }` or `this.hasUpdated` in the handler.\n//\n// Usage:\n//\n//  @watch('propName')\n//  handlePropChange(oldValue, newValue) {\n//    ...\n//  }\n//\ninterface WatchOptions {\n\twaitUntilFirstUpdate?: boolean\n}\n\nexport function on(propName: string, options?: WatchOptions) {\n\treturn (protoOrDescriptor: any, name: string): any => {\n\t\tconst { willUpdate } = protoOrDescriptor\n\n\t\toptions = Object.assign({ waitUntilFirstUpdate: false }, options) as WatchOptions\n\n\t\tprotoOrDescriptor.willUpdate = function (changedProps: Map<string, any>) {\n\t\t\twillUpdate.call(this, changedProps)\n\n\t\t\tif (changedProps.has(propName)) {\n\t\t\t\tconst oldValue = changedProps.get(propName)\n\t\t\t\tconst newValue = this[propName]\n\n\t\t\t\tif (oldValue !== newValue) {\n\t\t\t\t\tif (!options?.waitUntilFirstUpdate || this.hasUpdated) {\n\t\t\t\t\t\tthis[name].call(this, oldValue, newValue)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n","import { $LitElement } from '@mixins/index'\nimport { area } from '../area'\nimport { html, css } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { fromEvent, merge, takeUntil, tap, filter } from 'rxjs'\nimport { on } from './hook'\nimport { SchmancySheetPosition, sheet } from './sheet.service'\nimport { BLACKBIRD_EASING, DURATION_ENTER, DURATION_EXIT, DURATION_BACKDROP, EASE_OUT, EASE_IN } from '../utils/animation'\n\n/**\n * Side-docked or bottom-docked panel — a dialog variant that slides in from an edge. Driven imperatively by the `sheet` service; rarely instantiated directly.\n *\n * @element schmancy-sheet\n * @summary Prefer `sheet.open({ component, position })` over placing this element declaratively — the service handles stacking, focus, close on outside-click, ESC, and router integration.\n * @example\n * import { sheet, SchmancySheetPosition } from '@mhmo91/schmancy'\n * sheet.open({\n *   component: new MyEditorElement(),\n *   position: SchmancySheetPosition.Side,\n *   title: 'Edit item',\n * })\n * @platform dialog close - Positioned-fixed panel with backdrop. Degrades to a `<dialog>` if the tag never registers — loses slide animation, keeps focus trap + dismiss.\n * @attr position - `'side' | 'bottom'`. Which edge the sheet docks to.\n * @attr open - Boolean; sheet is visible when true.\n * @fires close - When the sheet is dismissed (backdrop click, close button, ESC).\n */\n@customElement('schmancy-sheet')\nexport default class SchmancySheet extends $LitElement(css`\n\t:host {\n\t\tposition: fixed;\n\t\tinset: 0;\n\t\tz-index: var(--schmancy-overlay-z, 999);\n\t\tdisplay: none;\n\t}\n\t:host([open]) {\n\t\tdisplay: block;\n\t}\n\n\t/* Luminous edge glow on sheet panel */\n\t.content {\n\t\tbox-shadow: -8px 0 40px -8px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 15%, transparent);\n\t}\n\n\t:host([position='bottom']) .content {\n\t\tbox-shadow: 0 -8px 40px -8px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 15%, transparent);\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t.content { box-shadow: var(--schmancy-sys-elevation-3); }\n\t}\n`) {\n\t// uid is inherited from $LitElement mixin - auto-generated or set via attribute\n\t@property({ type: Boolean, reflect: true }) open = false\n\t@property({ type: String, reflect: true }) position: SchmancySheetPosition = SchmancySheetPosition.Side\n\t@property({ type: Boolean, reflect: true }) persist = false\n\t@property({ type: Boolean, reflect: true }) lock = false\n\t@property({ type: Boolean, reflect: true }) handleHistory = true\n\n\tprivate lastFocusedElement: HTMLElement | null = null\n\t@query('.overlay') private overlayEl!: HTMLDivElement\n\t@query('.content') private contentEl!: HTMLDivElement\n\n\t@on('open')\n\tonOpenChange(_oldValue: boolean, newValue: boolean) {\n\t\tif (newValue) {\n\t\t\tthis.lastFocusedElement = document.activeElement as HTMLElement\n\t\t\tthis.setBackgroundInert(true)\n\t\t\tthis.animateIn()\n\t\t\tthis.focus()\n\t\t} else {\n\t\t\tthis.animateOut()\n\t\t\tthis.setBackgroundInert(false)\n\t\t\tthis.lastFocusedElement?.focus()\n\t\t\tthis.lastFocusedElement = null\n\t\t}\n\t}\n\n\tprivate animateIn() {\n\t\tif (!this.overlayEl || !this.contentEl) return\n\n\t\tthis.overlayEl.animate([{ opacity: 0 }, { opacity: 1 }], {\n\t\t\tduration: DURATION_BACKDROP,\n\t\t\teasing: EASE_OUT,\n\t\t\tfill: 'forwards',\n\t\t})\n\n\t\tconst animation =\n\t\t\tthis.position === SchmancySheetPosition.Side\n\t\t\t\t? [\n\t\t\t\t\t\t{ opacity: 0, transform: 'translateX(100%) scale(0.95)' },\n\t\t\t\t\t\t{ opacity: 1, transform: 'translateX(0) scale(1)' },\n\t\t\t\t\t]\n\t\t\t\t: [\n\t\t\t\t\t\t{ opacity: 0, transform: 'translateY(100%) scale(0.95)' },\n\t\t\t\t\t\t{ opacity: 1, transform: 'translateY(0) scale(1)' },\n\t\t\t\t\t]\n\n\t\tthis.contentEl.animate(animation, {\n\t\t\tduration: DURATION_ENTER,\n\t\t\teasing: BLACKBIRD_EASING,\n\t\t\tfill: 'forwards',\n\t\t})\n\t}\n\n\tprivate animateOut() {\n\t\tif (!this.overlayEl || !this.contentEl) return\n\n\t\tthis.overlayEl.animate([{ opacity: 1 }, { opacity: 0 }], {\n\t\t\tduration: DURATION_EXIT,\n\t\t\teasing: EASE_OUT,\n\t\t\tfill: 'forwards',\n\t\t})\n\n\t\tconst animation =\n\t\t\tthis.position === SchmancySheetPosition.Side\n\t\t\t\t? [\n\t\t\t\t\t\t{ opacity: 1, transform: 'translateX(0) scale(1)' },\n\t\t\t\t\t\t{ opacity: 0, transform: 'translateX(100%) scale(0.98)' },\n\t\t\t\t\t]\n\t\t\t\t: [\n\t\t\t\t\t\t{ opacity: 1, transform: 'translateY(0) scale(1)' },\n\t\t\t\t\t\t{ opacity: 0, transform: 'translateY(100%) scale(0.98)' },\n\t\t\t\t\t]\n\n\t\tthis.contentEl.animate(animation, {\n\t\t\tduration: DURATION_EXIT,\n\t\t\teasing: EASE_IN,\n\t\t\tfill: 'forwards',\n\t\t})\n\t}\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\t\tthis.setupEventListeners()\n\t}\n\n\tdisconnectedCallback() {\n\t\tsuper.disconnectedCallback()\n\t\tthis.disconnecting.next(true)\n\t}\n\n\tprivate setupEventListeners() {\n\t\t// Handle browser back button\n\t\tconst popState$ = fromEvent<PopStateEvent>(window, 'popstate').pipe(\n\t\t\tfilter(() => this.handleHistory),\n\t\t\ttap(e => {\n\t\t\t\te.preventDefault()\n\t\t\t\tthis.closeSheet()\n\t\t\t}),\n\t\t)\n\n\t\t// Handle ESC key\n\t\tconst keyUp$ = fromEvent<KeyboardEvent>(this, 'keydown').pipe(\n\t\t\ttap(event => {\n\t\t\t\tif (event.key === 'Escape' && !this.lock && this.open) {\n\t\t\t\t\tevent.preventDefault()\n\t\t\t\t\tevent.stopPropagation()\n\t\t\t\t\tsheet.dismiss(this.uid)\n\t\t\t\t}\n\t\t\t}),\n\t\t)\n\n\t\t// Handle render events from sheet service\n\t\tconst render$ = fromEvent<CustomEvent>(window, 'schmancy-sheet-render').pipe(\n\t\t\tfilter(e => e.detail.uid === this.uid),\n\t\t\ttap(e => {\n\t\t\t\tarea.push({\n\t\t\t\t\tarea: this.uid,\n\t\t\t\t\tcomponent: e.detail.component,\n\t\t\t\t\tprops: e.detail.props,\n\t\t\t\t\thistoryStrategy: 'silent',\n\t\t\t\t})\n\t\t\t}),\n\t\t)\n\n\t\t// Handle dismiss events from sheet service\n\t\tconst dismiss$ = fromEvent<CustomEvent>(window, 'schmancy-sheet-dismiss').pipe(\n\t\t\tfilter(e => e.detail.uid === this.uid),\n\t\t\ttap(() => {\n\t\t\t\tthis.closeSheet()\n\t\t\t}),\n\t\t)\n\n\t\tmerge(popState$, keyUp$, render$, dismiss$).pipe(takeUntil(this.disconnecting)).subscribe()\n\t}\n\n\tprivate setBackgroundInert(inert: boolean) {\n\t\tconst parent = this.parentElement\n\t\tif (!parent) return\n\n\t\tArray.from(parent.children).forEach(child => {\n\t\t\tif (child !== this && child instanceof HTMLElement) {\n\t\t\t\tchild.toggleAttribute('inert', inert)\n\t\t\t}\n\t\t})\n\t}\n\n\tcloseSheet() {\n\t\tthis.open = false\n\t\tthis.dispatchEvent(new CustomEvent('close'))\n\t}\n\n\toverride focus() {\n\t\t// delegatesFocus in shadowRootOptions handles automatic focus\n\t\t// Just focus first element with autofocus attribute if present\n\t\tconst element = this.querySelector('[autofocus]')\n\t\tif (element instanceof HTMLElement) {\n\t\t\telement.focus()\n\t\t}\n\t}\n\n\tprivate handleOverlayClick = (e: Event) => {\n\t\te.stopPropagation()\n\t\tif (!this.lock) {\n\t\t\tsheet.dismiss(this.uid)\n\t\t}\n\t}\n\n\trender() {\n\t\tconst sheetClasses = `absolute inset-0 flex h-full`\n\n\t\tconst overlayClasses = `overlay absolute inset-0 bg-surface-container/10 backdrop-blur-lg backdrop-saturate-150 ${this.lock ? '' : 'cursor-pointer'}`\n\n\t\tconst contentClasses =\n\t\t\tthis.position === SchmancySheetPosition.Side\n\t\t\t\t? 'content h-full min-w-[320px] max-w-[90vw] w-fit ml-auto z-10'\n\t\t\t\t: 'content w-full mt-auto rounded-t-2xl max-h-[90vh] z-10'\n\n\t\tconst surfaceClasses =\n\t\t\tthis.position === SchmancySheetPosition.Side\n\t\t\t\t? 'h-full overflow-auto'\n\t\t\t\t: 'max-h-[90vh] overflow-auto'\n\n\t\treturn html`\n\t\t\t<div class=${sheetClasses} role=\"dialog\" aria-hidden=${!this.open} aria-modal=${this.open} tabindex=\"0\">\n\t\t\t\t<div class=${overlayClasses} @click=${this.handleOverlayClick}></div>\n\t\t\t\t<div class=${contentClasses}>\n\t\t\t\t\t<schmancy-surface rounded=\"left\" fill=\"all\" id=\"body\" class=${surfaceClasses} type=\"solid\">\n\t\t\t\t\t\t<schmancy-area class=\"size-full overflow-auto\" name=${this.uid}>\n\t\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t\t</schmancy-area>\n\t\t\t\t\t</schmancy-surface>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-sheet': SchmancySheet\n\t}\n}\n"],"mappings":"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"}

package/dist/{splash-screen-COg3Z6n8.js.map → splash-screen-BHgb3c3Q.js.map}

@@ -1 +1 @@
-{"version":3,"file":"splash-screen-COg3Z6n8.js","names":[],"sources":["../src/splash-screen/splash-screen.ts"],"sourcesContent":["import { $LitElement } from '@mixins/litElement.mixin'\nimport { css, html } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { styleMap } from 'lit/directives/style-map.js'\nimport { fromEvent, of, timer, zip } from 'rxjs'\nimport { take, takeUntil, tap } from 'rxjs/operators'\n\nexport type SchmancySplashScreenDoneEvent = CustomEvent<void>\n\n/**\n * Full-viewport splash overlay that dismisses once a minimum duration has\n * elapsed and (optionally) an external `ready` signal has fired. The splash\n * fades out while the underlying app content fades in.\n *\n * Bring-your-own visuals: the `splash` slot is empty by default so the\n * component pulls in no dependencies. Provide a logo, spinner, or\n * animation from the consumer side.\n *\n * @element schmancy-splash-screen\n * @slot splash - Content rendered on the splash layer (logo, spinner, etc.).\n * @slot - Default slot for the actual app content, revealed once dismissed.\n * @fires schmancy-splash-done - `CustomEvent<void>` when the splash dismisses.\n *\n * @example\n * ```html\n * <schmancy-splash-screen min-duration=\"1200\">\n *   <my-logo slot=\"splash\"></my-logo>\n *   <my-app></my-app>\n * </schmancy-splash-screen>\n * ```\n */\n@customElement('schmancy-splash-screen')\nexport default class SchmancySplashScreen extends $LitElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tposition: relative;\n\t}\n\n\t.splash-layer {\n\t\tposition: fixed;\n\t\tinset: 0;\n\t\tz-index: 50;\n\t\toverflow: hidden;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tbackground: var(\n\t\t\t--schmancy-splash-background,\n\t\t\tvar(--schmancy-sys-color-surface-containerLowest, #000)\n\t\t);\n\t\ttransition: opacity var(--schmancy-splash-transition, 500ms) ease-out;\n\t}\n\n\t.content-layer {\n\t\tdisplay: block;\n\t\twidth: 100%;\n\t\ttransition: opacity var(--schmancy-splash-transition, 500ms) ease-in-out;\n\t}\n`) {\n\t/**\n\t * Minimum duration (ms) the splash layer stays visible. Prevents a flash\n\t * when the app loads faster than expected.\n\t */\n\t@property({ type: Number, attribute: 'min-duration' }) minDuration = 1500\n\n\t/**\n\t * When true, the splash dismisses on the `minDuration` timer alone.\n\t * When false (default), it additionally waits for an external ready signal\n\t * (a `ready` event on this element, or a call to `this.ready()`).\n\t */\n\t@property({ type: Boolean }) auto = false\n\n\t/**\n\t * When true, the splash starts hidden. Use this for imperative control.\n\t */\n\t@property({ type: Boolean, attribute: 'initially-hidden' }) initiallyHidden = false\n\n\t@state() private _visible = true\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\n\t\tif (this.initiallyHidden) {\n\t\t\tthis._visible = false\n\t\t\treturn\n\t\t}\n\n\t\tconst readySignal$ = this.auto ? of(null) : fromEvent<Event>(this, 'ready').pipe(take(1))\n\t\tconst minTimer$ = timer(this.minDuration)\n\n\t\tzip(readySignal$, minTimer$)\n\t\t\t.pipe(\n\t\t\t\ttake(1),\n\t\t\t\ttap(() => this._dismiss()),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe()\n\t}\n\n\t/**\n\t * Imperative API: signal that the app is ready and dismiss the splash\n\t * after the minimum duration has elapsed.\n\t */\n\tpublic ready(): void {\n\t\tthis.dispatchEvent(new Event('ready'))\n\t}\n\n\t/**\n\t * Force the splash to show again (e.g. between route transitions).\n\t */\n\tpublic show(): void {\n\t\tthis._visible = true\n\t}\n\n\tprivate _dismiss(): void {\n\t\tthis._visible = false\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent<void>('schmancy-splash-done', {\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\t}\n\n\trender() {\n\t\treturn html`\n\t\t\t<div\n\t\t\t\tclass=\"splash-layer\"\n\t\t\t\taria-hidden=${!this._visible}\n\t\t\t\tstyle=${styleMap({\n\t\t\t\t\topacity: this._visible ? '1' : '0',\n\t\t\t\t\tpointerEvents: this._visible ? 'auto' : 'none',\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t<slot name=\"splash\"></slot>\n\t\t\t</div>\n\t\t\t<div\n\t\t\t\tclass=\"content-layer\"\n\t\t\t\tstyle=${styleMap({\n\t\t\t\t\topacity: this._visible ? '0' : '1',\n\t\t\t\t\tpointerEvents: this._visible ? 'none' : 'auto',\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t<slot></slot>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-splash-screen': SchmancySplashScreen\n\t}\n}\n"],"mappings":";;;;;;;AAgCe,IAAA,IAAA,cAAmC,EAAY,CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;kCA+BK,MAAA,KAAA,OAAA,CAOjC,GAAA,KAAA,kBAAA,CAK0C,GAAA,KAAA,WAAA,CAElD;;CAE5B,oBAAA;AACC,QAAM,mBAAA,EAEF,KAAK,kBACR,KAAK,WAAA,CAAW,IAOjB,EAHqB,KAAK,OAAO,EAAG,KAAA,GAAQ,EAAiB,MAAM,QAAA,CAAS,KAAK,EAAK,EAAA,CAAA,EACpE,EAAM,KAAK,YAAA,CAAA,CAG3B,KACA,EAAK,EAAA,EACL,QAAU,KAAK,UAAA,CAAA,EACf,EAAU,KAAK,cAAA,CAAA,CAEf,WAAA;;CAOH,QAAA;AACC,OAAK,cAAc,IAAI,MAAM,QAAA,CAAA;;CAM9B,OAAA;AACC,OAAK,WAAA,CAAW;;CAGjB,WAAA;AACC,OAAK,WAAA,CAAW,GAChB,KAAK,cACJ,IAAI,YAAkB,wBAAwB;GAC7C,SAAA,CAAS;GACT,UAAA,CAAU;GAAA,CAAA,CAAA;;CAKb,SAAA;AACC,SAAO,CAAI;;;mBAGM,KAAK,SAAA;YACZ,EAAS;GAChB,SAAS,KAAK,WAAW,MAAM;GAC/B,eAAe,KAAK,WAAW,SAAS;GAAA,CAAA,CAAA;;;;;;YAOjC,EAAS;GAChB,SAAS,KAAK,WAAW,MAAM;GAC/B,eAAe,KAAK,WAAW,SAAS;GAAA,CAAA,CAAA;;;;;;;GA7E3C,EAAS;CAAE,MAAM;CAAQ,WAAW;CAAA,CAAA,CAAA,EAAiB,EAAA,WAAA,eAAA,KAAA,EAAA,EAAA,EAAA,CAOrD,EAAS,EAAE,MAAM,SAAA,CAAA,CAAA,EAAU,EAAA,WAAA,QAAA,KAAA,EAAA,EAAA,EAAA,CAK3B,EAAS;CAAE,MAAM;CAAS,WAAW;CAAA,CAAA,CAAA,EAAqB,EAAA,WAAA,mBAAA,KAAA,EAAA,EAAA,EAAA,CAE1D,GAAA,CAAA,EAAO,EAAA,WAAA,YAAA,KAAA,EAAA,EAAA,IAAA,EAAA,CA9CR,EAAc,yBAAA,CAAA,EAAyB,EAAA"}
+{"version":3,"file":"splash-screen-BHgb3c3Q.js","names":[],"sources":["../src/splash-screen/splash-screen.ts"],"sourcesContent":["import { $LitElement } from '@mixins/litElement.mixin'\nimport { css, html } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { styleMap } from 'lit/directives/style-map.js'\nimport { fromEvent, of, timer, zip } from 'rxjs'\nimport { take, takeUntil, tap } from 'rxjs/operators'\n\nexport type SchmancySplashScreenDoneEvent = CustomEvent<void>\n\n/**\n * Full-viewport splash overlay that dismisses once a minimum duration has\n * elapsed and (optionally) an external `ready` signal has fired. The splash\n * fades out while the underlying app content fades in.\n *\n * Bring-your-own visuals: the `splash` slot is empty by default so the\n * component pulls in no dependencies. Provide a logo, spinner, or\n * animation from the consumer side.\n *\n * @element schmancy-splash-screen\n * @slot splash - Content rendered on the splash layer (logo, spinner, etc.).\n * @slot - Default slot for the actual app content, revealed once dismissed.\n * @fires schmancy-splash-done - `CustomEvent<void>` when the splash dismisses.\n *\n * @example\n * ```html\n * <schmancy-splash-screen min-duration=\"1200\">\n *   <my-logo slot=\"splash\"></my-logo>\n *   <my-app></my-app>\n * </schmancy-splash-screen>\n * ```\n */\n@customElement('schmancy-splash-screen')\nexport default class SchmancySplashScreen extends $LitElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tposition: relative;\n\t}\n\n\t.splash-layer {\n\t\tposition: fixed;\n\t\tinset: 0;\n\t\tz-index: 50;\n\t\toverflow: hidden;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tbackground: var(\n\t\t\t--schmancy-splash-background,\n\t\t\tvar(--schmancy-sys-color-surface-containerLowest, #000)\n\t\t);\n\t\ttransition: opacity var(--schmancy-splash-transition, 500ms) ease-out;\n\t}\n\n\t.content-layer {\n\t\tdisplay: block;\n\t\twidth: 100%;\n\t\ttransition: opacity var(--schmancy-splash-transition, 500ms) ease-in-out;\n\t}\n`) {\n\t/**\n\t * Minimum duration (ms) the splash layer stays visible. Prevents a flash\n\t * when the app loads faster than expected.\n\t */\n\t@property({ type: Number, attribute: 'min-duration' }) minDuration = 1500\n\n\t/**\n\t * When true, the splash dismisses on the `minDuration` timer alone.\n\t * When false (default), it additionally waits for an external ready signal\n\t * (a `ready` event on this element, or a call to `this.ready()`).\n\t */\n\t@property({ type: Boolean }) auto = false\n\n\t/**\n\t * When true, the splash starts hidden. Use this for imperative control.\n\t */\n\t@property({ type: Boolean, attribute: 'initially-hidden' }) initiallyHidden = false\n\n\t@state() private _visible = true\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\n\t\tif (this.initiallyHidden) {\n\t\t\tthis._visible = false\n\t\t\treturn\n\t\t}\n\n\t\tconst readySignal$ = this.auto ? of(null) : fromEvent<Event>(this, 'ready').pipe(take(1))\n\t\tconst minTimer$ = timer(this.minDuration)\n\n\t\tzip(readySignal$, minTimer$)\n\t\t\t.pipe(\n\t\t\t\ttake(1),\n\t\t\t\ttap(() => this._dismiss()),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe()\n\t}\n\n\t/**\n\t * Imperative API: signal that the app is ready and dismiss the splash\n\t * after the minimum duration has elapsed.\n\t */\n\tpublic ready(): void {\n\t\tthis.dispatchEvent(new Event('ready'))\n\t}\n\n\t/**\n\t * Force the splash to show again (e.g. between route transitions).\n\t */\n\tpublic show(): void {\n\t\tthis._visible = true\n\t}\n\n\tprivate _dismiss(): void {\n\t\tthis._visible = false\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent<void>('schmancy-splash-done', {\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\t}\n\n\trender() {\n\t\treturn html`\n\t\t\t<div\n\t\t\t\tclass=\"splash-layer\"\n\t\t\t\taria-hidden=${!this._visible}\n\t\t\t\tstyle=${styleMap({\n\t\t\t\t\topacity: this._visible ? '1' : '0',\n\t\t\t\t\tpointerEvents: this._visible ? 'auto' : 'none',\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t<slot name=\"splash\"></slot>\n\t\t\t</div>\n\t\t\t<div\n\t\t\t\tclass=\"content-layer\"\n\t\t\t\tstyle=${styleMap({\n\t\t\t\t\topacity: this._visible ? '0' : '1',\n\t\t\t\t\tpointerEvents: this._visible ? 'none' : 'auto',\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t<slot></slot>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-splash-screen': SchmancySplashScreen\n\t}\n}\n"],"mappings":";;;;;;;AAgCe,IAAA,IAAA,cAAmC,EAAY,CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;kCA+BK,MAAA,KAAA,OAAA,CAOjC,GAAA,KAAA,kBAAA,CAK0C,GAAA,KAAA,WAAA,CAElD;;CAE5B,oBAAA;AACC,QAAM,mBAAA,EAEF,KAAK,kBACR,KAAK,WAAA,CAAW,IAOjB,EAHqB,KAAK,OAAO,EAAG,KAAA,GAAQ,EAAiB,MAAM,QAAA,CAAS,KAAK,EAAK,EAAA,CAAA,EACpE,EAAM,KAAK,YAAA,CAAA,CAG3B,KACA,EAAK,EAAA,EACL,QAAU,KAAK,UAAA,CAAA,EACf,EAAU,KAAK,cAAA,CAAA,CAEf,WAAA;;CAOH,QAAA;AACC,OAAK,cAAc,IAAI,MAAM,QAAA,CAAA;;CAM9B,OAAA;AACC,OAAK,WAAA,CAAW;;CAGjB,WAAA;AACC,OAAK,WAAA,CAAW,GAChB,KAAK,cACJ,IAAI,YAAkB,wBAAwB;GAC7C,SAAA,CAAS;GACT,UAAA,CAAU;GAAA,CAAA,CAAA;;CAKb,SAAA;AACC,SAAO,CAAI;;;mBAGM,KAAK,SAAA;YACZ,EAAS;GAChB,SAAS,KAAK,WAAW,MAAM;GAC/B,eAAe,KAAK,WAAW,SAAS;GAAA,CAAA,CAAA;;;;;;YAOjC,EAAS;GAChB,SAAS,KAAK,WAAW,MAAM;GAC/B,eAAe,KAAK,WAAW,SAAS;GAAA,CAAA,CAAA;;;;;;;GA7E3C,EAAS;CAAE,MAAM;CAAQ,WAAW;CAAA,CAAA,CAAA,EAAiB,EAAA,WAAA,eAAA,KAAA,EAAA,EAAA,EAAA,CAOrD,EAAS,EAAE,MAAM,SAAA,CAAA,CAAA,EAAU,EAAA,WAAA,QAAA,KAAA,EAAA,EAAA,EAAA,CAK3B,EAAS;CAAE,MAAM;CAAS,WAAW;CAAA,CAAA,CAAA,EAAqB,EAAA,WAAA,mBAAA,KAAA,EAAA,EAAA,EAAA,CAE1D,GAAA,CAAA,EAAO,EAAA,WAAA,YAAA,KAAA,EAAA,EAAA,IAAA,EAAA,CA9CR,EAAc,yBAAA,CAAA,EAAyB,EAAA"}

package/dist/{splash-screen-C9HqX2nR.cjs.map → splash-screen-DteUfSV3.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"splash-screen-C9HqX2nR.cjs","names":[],"sources":["../src/splash-screen/splash-screen.ts"],"sourcesContent":["import { $LitElement } from '@mixins/litElement.mixin'\nimport { css, html } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { styleMap } from 'lit/directives/style-map.js'\nimport { fromEvent, of, timer, zip } from 'rxjs'\nimport { take, takeUntil, tap } from 'rxjs/operators'\n\nexport type SchmancySplashScreenDoneEvent = CustomEvent<void>\n\n/**\n * Full-viewport splash overlay that dismisses once a minimum duration has\n * elapsed and (optionally) an external `ready` signal has fired. The splash\n * fades out while the underlying app content fades in.\n *\n * Bring-your-own visuals: the `splash` slot is empty by default so the\n * component pulls in no dependencies. Provide a logo, spinner, or\n * animation from the consumer side.\n *\n * @element schmancy-splash-screen\n * @slot splash - Content rendered on the splash layer (logo, spinner, etc.).\n * @slot - Default slot for the actual app content, revealed once dismissed.\n * @fires schmancy-splash-done - `CustomEvent<void>` when the splash dismisses.\n *\n * @example\n * ```html\n * <schmancy-splash-screen min-duration=\"1200\">\n *   <my-logo slot=\"splash\"></my-logo>\n *   <my-app></my-app>\n * </schmancy-splash-screen>\n * ```\n */\n@customElement('schmancy-splash-screen')\nexport default class SchmancySplashScreen extends $LitElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tposition: relative;\n\t}\n\n\t.splash-layer {\n\t\tposition: fixed;\n\t\tinset: 0;\n\t\tz-index: 50;\n\t\toverflow: hidden;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tbackground: var(\n\t\t\t--schmancy-splash-background,\n\t\t\tvar(--schmancy-sys-color-surface-containerLowest, #000)\n\t\t);\n\t\ttransition: opacity var(--schmancy-splash-transition, 500ms) ease-out;\n\t}\n\n\t.content-layer {\n\t\tdisplay: block;\n\t\twidth: 100%;\n\t\ttransition: opacity var(--schmancy-splash-transition, 500ms) ease-in-out;\n\t}\n`) {\n\t/**\n\t * Minimum duration (ms) the splash layer stays visible. Prevents a flash\n\t * when the app loads faster than expected.\n\t */\n\t@property({ type: Number, attribute: 'min-duration' }) minDuration = 1500\n\n\t/**\n\t * When true, the splash dismisses on the `minDuration` timer alone.\n\t * When false (default), it additionally waits for an external ready signal\n\t * (a `ready` event on this element, or a call to `this.ready()`).\n\t */\n\t@property({ type: Boolean }) auto = false\n\n\t/**\n\t * When true, the splash starts hidden. Use this for imperative control.\n\t */\n\t@property({ type: Boolean, attribute: 'initially-hidden' }) initiallyHidden = false\n\n\t@state() private _visible = true\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\n\t\tif (this.initiallyHidden) {\n\t\t\tthis._visible = false\n\t\t\treturn\n\t\t}\n\n\t\tconst readySignal$ = this.auto ? of(null) : fromEvent<Event>(this, 'ready').pipe(take(1))\n\t\tconst minTimer$ = timer(this.minDuration)\n\n\t\tzip(readySignal$, minTimer$)\n\t\t\t.pipe(\n\t\t\t\ttake(1),\n\t\t\t\ttap(() => this._dismiss()),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe()\n\t}\n\n\t/**\n\t * Imperative API: signal that the app is ready and dismiss the splash\n\t * after the minimum duration has elapsed.\n\t */\n\tpublic ready(): void {\n\t\tthis.dispatchEvent(new Event('ready'))\n\t}\n\n\t/**\n\t * Force the splash to show again (e.g. between route transitions).\n\t */\n\tpublic show(): void {\n\t\tthis._visible = true\n\t}\n\n\tprivate _dismiss(): void {\n\t\tthis._visible = false\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent<void>('schmancy-splash-done', {\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\t}\n\n\trender() {\n\t\treturn html`\n\t\t\t<div\n\t\t\t\tclass=\"splash-layer\"\n\t\t\t\taria-hidden=${!this._visible}\n\t\t\t\tstyle=${styleMap({\n\t\t\t\t\topacity: this._visible ? '1' : '0',\n\t\t\t\t\tpointerEvents: this._visible ? 'auto' : 'none',\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t<slot name=\"splash\"></slot>\n\t\t\t</div>\n\t\t\t<div\n\t\t\t\tclass=\"content-layer\"\n\t\t\t\tstyle=${styleMap({\n\t\t\t\t\topacity: this._visible ? '0' : '1',\n\t\t\t\t\tpointerEvents: this._visible ? 'none' : 'auto',\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t<slot></slot>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-splash-screen': SchmancySplashScreen\n\t}\n}\n"],"mappings":"mQAgCe,IAAA,EAAA,cAAmC,EAAA,EAAY,EAAA,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;kDA+BK,KAAA,KAAA,KAAA,CAOjC,EAAA,KAAA,gBAAA,CAK0C,EAAA,KAAA,SAAA,CAElD,EAE5B,mBAAA,CACC,MAAM,mBAAA,CAEF,KAAK,gBACR,KAAK,SAAA,CAAW,GAOjB,EAAA,EAAA,KAHqB,KAAK,MAAA,EAAA,EAAA,IAAU,KAAA,EAAK,EAAA,EAAA,WAAoB,KAAM,QAAA,CAAS,MAAA,EAAA,EAAA,MAAU,EAAA,CAAA,EAAG,EAAA,EAAA,OACjE,KAAK,YAAA,CAAA,CAG3B,MAAA,EAAA,EAAA,MACK,EAAA,EAAE,EAAA,EAAA,SACG,KAAK,UAAA,CAAA,EAAW,EAAA,EAAA,WAChB,KAAK,cAAA,CAAA,CAEf,WAAA,CAOH,OAAA,CACC,KAAK,cAAc,IAAI,MAAM,QAAA,CAAA,CAM9B,MAAA,CACC,KAAK,SAAA,CAAW,EAGjB,UAAA,CACC,KAAK,SAAA,CAAW,EAChB,KAAK,cACJ,IAAI,YAAkB,uBAAwB,CAC7C,QAAA,CAAS,EACT,SAAA,CAAU,EAAA,CAAA,CAAA,CAKb,QAAA,CACC,MAAO,GAAA,IAAI;;;mBAGM,KAAK,SAAA;2BACH,CAChB,QAAS,KAAK,SAAW,IAAM,IAC/B,cAAe,KAAK,SAAW,OAAS,OAAA,CAAA,CAAA;;;;;;2BAOxB,CAChB,QAAS,KAAK,SAAW,IAAM,IAC/B,cAAe,KAAK,SAAW,OAAS,OAAA,CAAA,CAAA;;;;0BA7ElC,CAAE,KAAM,OAAQ,UAAW,eAAA,CAAA,CAAA,CAAiB,EAAA,UAAA,cAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAO5C,CAAE,KAAM,QAAA,CAAA,CAAA,CAAU,EAAA,UAAA,OAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAKlB,CAAE,KAAM,QAAS,UAAW,mBAAA,CAAA,CAAA,CAAqB,EAAA,UAAA,kBAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,QAAA,CAAA,CAEnD,EAAA,UAAA,WAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,eA9CM,yBAAA,CAAA,CAAyB,EAAA"}
+{"version":3,"file":"splash-screen-DteUfSV3.cjs","names":[],"sources":["../src/splash-screen/splash-screen.ts"],"sourcesContent":["import { $LitElement } from '@mixins/litElement.mixin'\nimport { css, html } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { styleMap } from 'lit/directives/style-map.js'\nimport { fromEvent, of, timer, zip } from 'rxjs'\nimport { take, takeUntil, tap } from 'rxjs/operators'\n\nexport type SchmancySplashScreenDoneEvent = CustomEvent<void>\n\n/**\n * Full-viewport splash overlay that dismisses once a minimum duration has\n * elapsed and (optionally) an external `ready` signal has fired. The splash\n * fades out while the underlying app content fades in.\n *\n * Bring-your-own visuals: the `splash` slot is empty by default so the\n * component pulls in no dependencies. Provide a logo, spinner, or\n * animation from the consumer side.\n *\n * @element schmancy-splash-screen\n * @slot splash - Content rendered on the splash layer (logo, spinner, etc.).\n * @slot - Default slot for the actual app content, revealed once dismissed.\n * @fires schmancy-splash-done - `CustomEvent<void>` when the splash dismisses.\n *\n * @example\n * ```html\n * <schmancy-splash-screen min-duration=\"1200\">\n *   <my-logo slot=\"splash\"></my-logo>\n *   <my-app></my-app>\n * </schmancy-splash-screen>\n * ```\n */\n@customElement('schmancy-splash-screen')\nexport default class SchmancySplashScreen extends $LitElement(css`\n\t:host {\n\t\tdisplay: block;\n\t\tposition: relative;\n\t}\n\n\t.splash-layer {\n\t\tposition: fixed;\n\t\tinset: 0;\n\t\tz-index: 50;\n\t\toverflow: hidden;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tbackground: var(\n\t\t\t--schmancy-splash-background,\n\t\t\tvar(--schmancy-sys-color-surface-containerLowest, #000)\n\t\t);\n\t\ttransition: opacity var(--schmancy-splash-transition, 500ms) ease-out;\n\t}\n\n\t.content-layer {\n\t\tdisplay: block;\n\t\twidth: 100%;\n\t\ttransition: opacity var(--schmancy-splash-transition, 500ms) ease-in-out;\n\t}\n`) {\n\t/**\n\t * Minimum duration (ms) the splash layer stays visible. Prevents a flash\n\t * when the app loads faster than expected.\n\t */\n\t@property({ type: Number, attribute: 'min-duration' }) minDuration = 1500\n\n\t/**\n\t * When true, the splash dismisses on the `minDuration` timer alone.\n\t * When false (default), it additionally waits for an external ready signal\n\t * (a `ready` event on this element, or a call to `this.ready()`).\n\t */\n\t@property({ type: Boolean }) auto = false\n\n\t/**\n\t * When true, the splash starts hidden. Use this for imperative control.\n\t */\n\t@property({ type: Boolean, attribute: 'initially-hidden' }) initiallyHidden = false\n\n\t@state() private _visible = true\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\n\t\tif (this.initiallyHidden) {\n\t\t\tthis._visible = false\n\t\t\treturn\n\t\t}\n\n\t\tconst readySignal$ = this.auto ? of(null) : fromEvent<Event>(this, 'ready').pipe(take(1))\n\t\tconst minTimer$ = timer(this.minDuration)\n\n\t\tzip(readySignal$, minTimer$)\n\t\t\t.pipe(\n\t\t\t\ttake(1),\n\t\t\t\ttap(() => this._dismiss()),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe()\n\t}\n\n\t/**\n\t * Imperative API: signal that the app is ready and dismiss the splash\n\t * after the minimum duration has elapsed.\n\t */\n\tpublic ready(): void {\n\t\tthis.dispatchEvent(new Event('ready'))\n\t}\n\n\t/**\n\t * Force the splash to show again (e.g. between route transitions).\n\t */\n\tpublic show(): void {\n\t\tthis._visible = true\n\t}\n\n\tprivate _dismiss(): void {\n\t\tthis._visible = false\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent<void>('schmancy-splash-done', {\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\t}\n\n\trender() {\n\t\treturn html`\n\t\t\t<div\n\t\t\t\tclass=\"splash-layer\"\n\t\t\t\taria-hidden=${!this._visible}\n\t\t\t\tstyle=${styleMap({\n\t\t\t\t\topacity: this._visible ? '1' : '0',\n\t\t\t\t\tpointerEvents: this._visible ? 'auto' : 'none',\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t<slot name=\"splash\"></slot>\n\t\t\t</div>\n\t\t\t<div\n\t\t\t\tclass=\"content-layer\"\n\t\t\t\tstyle=${styleMap({\n\t\t\t\t\topacity: this._visible ? '0' : '1',\n\t\t\t\t\tpointerEvents: this._visible ? 'none' : 'auto',\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t<slot></slot>\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-splash-screen': SchmancySplashScreen\n\t}\n}\n"],"mappings":"mQAgCe,IAAA,EAAA,cAAmC,EAAA,EAAY,EAAA,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;kDA+BK,KAAA,KAAA,KAAA,CAOjC,EAAA,KAAA,gBAAA,CAK0C,EAAA,KAAA,SAAA,CAElD,EAE5B,mBAAA,CACC,MAAM,mBAAA,CAEF,KAAK,gBACR,KAAK,SAAA,CAAW,GAOjB,EAAA,EAAA,KAHqB,KAAK,MAAA,EAAA,EAAA,IAAU,KAAA,EAAK,EAAA,EAAA,WAAoB,KAAM,QAAA,CAAS,MAAA,EAAA,EAAA,MAAU,EAAA,CAAA,EAAG,EAAA,EAAA,OACjE,KAAK,YAAA,CAAA,CAG3B,MAAA,EAAA,EAAA,MACK,EAAA,EAAE,EAAA,EAAA,SACG,KAAK,UAAA,CAAA,EAAW,EAAA,EAAA,WAChB,KAAK,cAAA,CAAA,CAEf,WAAA,CAOH,OAAA,CACC,KAAK,cAAc,IAAI,MAAM,QAAA,CAAA,CAM9B,MAAA,CACC,KAAK,SAAA,CAAW,EAGjB,UAAA,CACC,KAAK,SAAA,CAAW,EAChB,KAAK,cACJ,IAAI,YAAkB,uBAAwB,CAC7C,QAAA,CAAS,EACT,SAAA,CAAU,EAAA,CAAA,CAAA,CAKb,QAAA,CACC,MAAO,GAAA,IAAI;;;mBAGM,KAAK,SAAA;2BACH,CAChB,QAAS,KAAK,SAAW,IAAM,IAC/B,cAAe,KAAK,SAAW,OAAS,OAAA,CAAA,CAAA;;;;;;2BAOxB,CAChB,QAAS,KAAK,SAAW,IAAM,IAC/B,cAAe,KAAK,SAAW,OAAS,OAAA,CAAA,CAAA;;;;0BA7ElC,CAAE,KAAM,OAAQ,UAAW,eAAA,CAAA,CAAA,CAAiB,EAAA,UAAA,cAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAO5C,CAAE,KAAM,QAAA,CAAA,CAAA,CAAU,EAAA,UAAA,OAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,UAKlB,CAAE,KAAM,QAAS,UAAW,mBAAA,CAAA,CAAA,CAAqB,EAAA,UAAA,kBAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,QAAA,CAAA,CAEnD,EAAA,UAAA,WAAA,IAAA,GAAA,CAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,eA9CM,yBAAA,CAAA,CAAyB,EAAA"}

package/dist/splash-screen.cjs

@@ -1 +1 @@
-require(`./splash-screen-C9HqX2nR.cjs`);
+require(`./splash-screen-DteUfSV3.cjs`);

package/dist/splash-screen.js

@@ -1 +1 @@
-import "./splash-screen-COg3Z6n8.js";
+import "./splash-screen-BHgb3c3Q.js";

package/dist/{src-C7niWYur.js → src-BGj6ufWS.js}

@@ -58,7 +58,7 @@ import "./sheet-LFVo5iN4.js";
 import "./slider.js";
 import "./steps.js";
 import "./surface.js";
-import "./table-hBEZRxM_.js";
+import "./table-Dwt66SR6.js";
 import "./tabs-C7r4TqcX.js";
 import "./textarea-CS-KdSLz.js";
 import "./theme-Cq_c9IO3.js";
@@ -66,13 +66,13 @@ import "./theme-button-OJl2ma0u.js";
 import "./tooltip.js";
 import "./tree.js";
 import { SchmancyEvents as d } from "./types.js";
-import "./typewriter-DyN7xa0n.js";
+import "./typewriter.js";
 import "./typography.js";
-import "./utils-xBXLvebz.js";
+import "./utils-Bp2jhyZc.js";
 import "./breadcrumb.js";
 import "./kbd.js";
 import "./skeleton.js";
-import "./splash-screen-COg3Z6n8.js";
+import "./splash-screen-BHgb3c3Q.js";
 import "./switch.js";
 import "./visually-hidden.js";
 import { BehaviorSubject as f, Observable as ne, Subject as p, bufferTime as re, concatMap as ie, debounceTime as m, delay as ae, distinctUntilChanged as oe, filter as se, from as ce, fromEvent as h, interval as le, map as g, merge as _, of as v, startWith as ue, take as de, takeUntil as y, tap as b, throwIfEmpty as fe, timeout as pe, timer as me, zip as he } from "rxjs";