@mhmo91/schmancy 0.10.24 → 0.10.26

package/dist/navigation-rail.js

@@ -1,4 +1,4 @@
-import { c as e } from "./mixins-C42OILRS.js";
+import { c as e } from "./mixins-CKbQ6BJo.js";
 import { a as t } from "./active-host-BP0zy_Y9.js";
 import { BehaviorSubject as n, fromEvent as r, merge as i, takeUntil as a } from "rxjs";
 import { delay as o, distinctUntilChanged as s, tap as c } from "rxjs/operators";
@@ -44,9 +44,8 @@ var h = class extends e {
 	}
 	render() {
 		let e = !!this.querySelector("[slot=\"icon\"]"), t = this.querySelector("[slot=\"badge\"]"), n = this.classMap({
-			"flex flex-col items-center justify-center": !0,
+			"flex flex-col items-center justify-start": !0,
 			"min-h-14 w-full": !0,
-			"py-3": !0,
 			"gap-1": !0,
 			"rounded-lg": !0,
 			"cursor-pointer": !0,
@@ -116,13 +115,9 @@ var h = class extends e {
 				<div class=${r} part="icon">
 					<span class=${i} part="indicator" aria-hidden="true"></span>
 					${m(e, () => p`<slot class="relative" name="icon"></slot>`, () => m(this.icon, () => p`
-									<span
-										class=${a}
-										part="icon-text"
-										style="font-family: 'Material Symbols Outlined'; font-variation-settings: 'FILL' ${this.active ? "1" : "0"}, 'wght' 400, 'GRAD' 0, 'opsz' ${this.nested ? "20" : "24"};"
-									>
-										${this.icon}
-									</span>
+									<schmancy-icon class=${a} part="icon-text">
+										${this.active ? `${this.icon}-fill` : this.icon}
+									</schmancy-icon>
 								`))}
 				</div>
 
@@ -286,7 +281,6 @@ var g = class extends e {
 		}), t = this.classMap({
 			"flex flex-col h-full": !0,
 			"box-border relative": !0,
-			"py-2": !0,
 			"bg-container-lowest text-surface-on": !0,
 			"transition-all duration-300 ease-emphasized": !0,
 			"w-20": !this.expanded,

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 { SchmancyElement } 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 SchmancyElement {\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 { SchmancyElement } 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 SchmancyElement {\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 { SchmancyElement } 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 SchmancyElement {\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 minimum hit target; vertical padding is consumer-controlled)\n\t\t\t// justify-start pins the icon to the row top so its vertical center is invariant\n\t\t\t// across label-visibility states — consumer rows can align siblings to it.\n\t\t\t'flex flex-col items-center justify-start': true,\n\t\t\t'min-h-14 w-full': true, // min-h-14 = 56px\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<schmancy-icon class=${iconClasses} part=\"icon-text\">\n\t\t\t\t\t\t\t\t\t\t${this.active ? `${this.icon}-fill` : this.icon}\n\t\t\t\t\t\t\t\t\t</schmancy-icon>\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 { SchmancyElement } 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 SchmancyElement {\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\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/{notification-CllYkvlR.js → notification-BqyMYtP7.js}

@@ -1,7 +1,7 @@
-import { c as e } from "./mixins-C42OILRS.js";
+import { c as e } from "./mixins-CKbQ6BJo.js";
 import { a as t } from "./active-host-BP0zy_Y9.js";
 import { t as n } from "./audio-CxO5a2HL.js";
-import "./progress-CnMPp-9a.js";
+import "./progress-YjdEWDI5.js";
 import { BehaviorSubject as r, NEVER as i, catchError as a, finalize as o, interval as s, tap as c, timer as l } from "rxjs";
 import { distinctUntilChanged as u, map as d, switchMap as f, takeUntil as p, tap as m } from "rxjs/operators";
 import { customElement as h, property as g, state as _ } from "lit/decorators.js";

package/dist/{notification-CllYkvlR.js.map → notification-BqyMYtP7.js.map}

@@ -1 +1 @@
-{"version":3,"file":"notification-CllYkvlR.js","names":[],"sources":["../src/notification/notification.scss?inline","../src/notification/notification.ts","../src/notification/notification-service.ts","../src/notification/notify.ts"],"sourcesContent":[":host {\n\tdisplay: block;\n}\n\n.notification {\n\tposition: relative;\n\tdisplay: flex;\n\talign-items: flex-start;\n\tgap: 10px;\n\tpadding: 12px;\n\tpadding-right: 32px;\n\tbackground: var(--schmancy-sys-color-surface-container);\n\tborder-radius: var(--schmancy-sys-shape-corner-extraLarge, 16px);\n\tcolor: var(--schmancy-sys-color-surface-on);\n\tmax-width: 320px;\n\toverflow: hidden;\n\n\t/* Type-colored luminous glow */\n\t--notification-glow-color: var(--schmancy-sys-color-primary-default);\n\tbox-shadow: 0 4px 24px -6px color-mix(in srgb, var(--notification-glow-color) 18%, transparent);\n\n\ttransition:\n\t\tbox-shadow 300ms ease,\n\t\ttransform 300ms cubic-bezier(0.34, 1.56, 0.64, 1);\n\n\t&.info { --notification-glow-color: var(--schmancy-sys-color-primary-default); }\n\t&.success { --notification-glow-color: var(--schmancy-sys-color-success-default); }\n\t&.warning { --notification-glow-color: var(--schmancy-sys-color-warning-default); }\n\t&.error { --notification-glow-color: var(--schmancy-sys-color-error-default); }\n\n\t&.hovered {\n\t\tbox-shadow: 0 8px 32px -4px color-mix(in srgb, var(--notification-glow-color) 28%, transparent);\n\t\ttransform: translateY(-2px);\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\ttransition: box-shadow 200ms ease;\n\t\t&.hovered { transform: none; }\n\t}\n}\n\n.emoji {\n\tfont-size: 20px;\n\tline-height: 1;\n\tflex-shrink: 0;\n\tmargin-top: 1px;\n}\n\n.content {\n\tflex: 1;\n\tmin-width: 0;\n}\n\n.title {\n\tfont-weight: 500;\n\tfont-size: 13px;\n\tline-height: 1.4;\n\tmargin-bottom: 2px;\n\tletter-spacing: 0.01em;\n\n\t.info & {\n\t\tcolor: var(--schmancy-sys-color-primary-default);\n\t}\n\t.success & {\n\t\tcolor: var(--schmancy-sys-color-success-default);\n\t}\n\t.warning & {\n\t\tcolor: var(--schmancy-sys-color-tertiary-default);\n\t}\n\t.error & {\n\t\tcolor: var(--schmancy-sys-color-error-default);\n\t}\n}\n\n.message {\n\tfont-size: 13px;\n\tline-height: 1.4;\n\topacity: 0.75;\n\tletter-spacing: 0.01em;\n}\n\n.close {\n\tposition: absolute;\n\ttop: 8px;\n\tright: 6px;\n\tbackground: none;\n\tborder: none;\n\tfont-size: 16px;\n\tfont-weight: 300;\n\tcolor: var(--schmancy-sys-color-surface-onVariant);\n\tcursor: pointer;\n\tpadding: 4px 6px;\n\tline-height: 1;\n\topacity: 0.4;\n\tborder-radius: var(--schmancy-sys-shape-corner-full, 50%);\n\ttransition: opacity 200ms ease;\n\n\t&:hover {\n\t\topacity: 0.8;\n\t}\n\n\t&:focus-visible {\n\t\toutline: none;\n\t\topacity: 1;\n\t\tbox-shadow:\n\t\t\t0 0 0 2px var(--schmancy-sys-color-primary-default),\n\t\t\t0 0 8px -2px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 25%, transparent);\n\t}\n}\n\n.progress {\n\tposition: absolute;\n\tbottom: 0;\n\tleft: 0;\n\tright: 0;\n}\n","import { SchmancyElement } from '@mixins/index'\nimport { html, unsafeCSS } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { BehaviorSubject, timer, interval, NEVER } from 'rxjs'\nimport { switchMap, takeUntil, map, tap, distinctUntilChanged } from 'rxjs/operators'\nimport '../progress/progress'\nimport style from './notification.scss?inline'\n\nexport type NotificationType = 'info' | 'success' | 'warning' | 'error'\n\n/**\n * Calculate a point on an arc between two points\n */\nfunction calculateArcPoint(\n\tstart: { x: number; y: number },\n\tend: { x: number; y: number },\n\tarcDirection: 'up' | 'down' = 'up',\n\tintensity: number = 0.3,\n): { x: number; y: number } {\n\tconst midX = (start.x + end.x) / 2\n\tconst midY = (start.y + end.y) / 2\n\tconst distance = Math.sqrt(Math.pow(end.x - start.x, 2) + Math.pow(end.y - start.y, 2))\n\tconst arcHeight = Math.min(distance * intensity, 150)\n\treturn {\n\t\tx: midX,\n\t\ty: arcDirection === 'up' ? midY - arcHeight : midY + arcHeight,\n\t}\n}\n\n/**\n * @fires close - When notification is closed\n */\n@customElement('sch-notification')\nexport default class SchmancyNotification extends SchmancyElement {\n\tstatic styles = [unsafeCSS(style)];\n\n\t@property({ type: String }) title = ''\n\t@property({ type: String }) message = ''\n\t@property({ type: String }) type: NotificationType = 'info'\n\t@property({ type: Boolean }) closable = true\n\t@property({ type: Number }) duration = 5000 // 0 means no auto-close\n\t@property({ type: String }) id = `notification-${Date.now()}-${Math.floor(Math.random() * 10000)}`\n\t@property({ type: Boolean }) playSound = true\n\t@property({ type: Boolean }) showProgress = false // Show indeterminate progress bar\n\t@property({ type: Object }) startPosition: { x: number; y: number } = { x: 0, y: 0 }\n\n\t@state() private _visible = true\n\t@state() private _progress = 100\n\t@state() private _hovered = false\n\t@state() private _closing = false\n\n\tprivate paused$ = new BehaviorSubject<boolean>(false)\n\tprivate startTime = 0\n\tprivate pausedAt = 0\n\tprivate elapsedBeforePause = 0\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\n\t\t// Set fixed positioning for blackbird animation\n\t\tthis.style.position = 'fixed'\n\t\tthis.style.top = '16px'\n\t\tthis.style.right = '16px'\n\t\tthis.style.zIndex = '10001'\n\t\tthis.style.opacity = '0'\n\n\t\t// Animate in after first render\n\t\tthis.updateComplete.then(() => {\n\t\t\tthis.animateIn()\n\t\t\treturn\n\t\t})\n\n\t\tif (this.duration > 0) {\n\t\t\tthis.setupAutoClose()\n\t\t\tthis.setupProgressUpdates()\n\t\t}\n\n\t\tif (this.playSound) {\n\t\t\tthis._playSound()\n\t\t}\n\t}\n\n\tprivate async animateIn() {\n\t\t// Get the notification element's final position\n\t\tconst rect = this.getBoundingClientRect()\n\t\tconst targetX = rect.left + rect.width / 2\n\t\tconst targetY = rect.top + rect.height / 2\n\n\t\t// Calculate arc point for upward arc\n\t\tconst arcPoint = calculateArcPoint(this.startPosition, { x: targetX, y: targetY }, 'up', 0.3)\n\n\t\t// Animate from click position to final position with arc\n\t\tawait this.animate(\n\t\t\t[\n\t\t\t\t{\n\t\t\t\t\ttransform: `translate(${this.startPosition.x - targetX}px, ${this.startPosition.y - targetY}px) scale(0.1)`,\n\t\t\t\t\topacity: 0,\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\ttransform: `translate(${arcPoint.x - targetX}px, ${arcPoint.y - targetY}px) scale(0.6)`,\n\t\t\t\t\topacity: 0.9,\n\t\t\t\t\toffset: 0.5,\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\ttransform: 'translate(0, 0) scale(1)',\n\t\t\t\t\topacity: 1,\n\t\t\t\t},\n\t\t\t],\n\t\t\t{\n\t\t\t\tduration: 400,\n\t\t\t\teasing: 'cubic-bezier(0.34, 1.2, 0.64, 1)',\n\t\t\t\tfill: 'forwards',\n\t\t\t},\n\t\t).finished\n\t}\n\n\tprivate setupAutoClose() {\n\t\tif (this.duration <= 0) return\n\n\t\tthis.startTime = Date.now()\n\t\tthis.elapsedBeforePause = 0\n\n\t\tthis.paused$\n\t\t\t.pipe(\n\t\t\t\tswitchMap(paused => {\n\t\t\t\t\tif (paused) {\n\t\t\t\t\t\tthis.pausedAt = Date.now()\n\t\t\t\t\t\tthis.elapsedBeforePause += this.pausedAt - this.startTime\n\t\t\t\t\t\treturn NEVER\n\t\t\t\t\t} else {\n\t\t\t\t\t\tthis.startTime = Date.now()\n\t\t\t\t\t\tconst remaining = this.duration - this.elapsedBeforePause\n\t\t\t\t\t\tif (remaining <= 0) {\n\t\t\t\t\t\t\tthis.close()\n\t\t\t\t\t\t\treturn NEVER\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn timer(remaining)\n\t\t\t\t\t}\n\t\t\t\t}),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe(() => this.close())\n\t}\n\n\tprivate setupProgressUpdates() {\n\t\tif (this.duration <= 0) return\n\n\t\tinterval(16)\n\t\t\t.pipe(\n\t\t\t\tswitchMap(() =>\n\t\t\t\t\tthis.paused$.pipe(\n\t\t\t\t\t\tmap(paused => {\n\t\t\t\t\t\t\tif (paused) return this._progress\n\t\t\t\t\t\t\tconst elapsed = this.elapsedBeforePause + (Date.now() - this.startTime)\n\t\t\t\t\t\t\tconst remaining = Math.max(0, this.duration - elapsed)\n\t\t\t\t\t\t\treturn (remaining / this.duration) * 100\n\t\t\t\t\t\t}),\n\t\t\t\t\t),\n\t\t\t\t),\n\t\t\t\tdistinctUntilChanged(),\n\t\t\t\ttap(progress => {\n\t\t\t\t\tthis._progress = progress\n\t\t\t\t}),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe()\n\t}\n\n\tprivate _playSound() {\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('playsound', {\n\t\t\t\tdetail: { type: this.type },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\t}\n\n\tprivate _handleMouseEnter() {\n\t\tthis._hovered = true\n\t\tthis.paused$.next(true)\n\t}\n\n\tprivate _handleMouseLeave() {\n\t\tthis._hovered = false\n\t\tthis.paused$.next(false)\n\t}\n\n\tpublic async close() {\n\t\tif (this._closing) return\n\t\tthis._closing = true\n\t\tthis._visible = false\n\n\t\t// Animate out before dispatching close event\n\t\tawait this.animate(\n\t\t\t[\n\t\t\t\t{ transform: 'translate(0, 0) scale(1)', opacity: 1 },\n\t\t\t\t{ transform: 'translate(0, -20px) scale(0.8)', opacity: 0 },\n\t\t\t],\n\t\t\t{\n\t\t\t\tduration: 200,\n\t\t\t\teasing: 'cubic-bezier(0.4, 0, 1, 1)',\n\t\t\t\tfill: 'forwards',\n\t\t\t},\n\t\t).finished\n\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('close', {\n\t\t\t\tdetail: { id: this.id },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\t}\n\n\tprivate _getEmoji(): string {\n\t\tswitch (this.type) {\n\t\t\tcase 'success':\n\t\t\t\treturn '\\u2705'\n\t\t\tcase 'warning':\n\t\t\t\treturn '\\u26A0\\uFE0F'\n\t\t\tcase 'error':\n\t\t\t\treturn '\\u274C'\n\t\t\tdefault:\n\t\t\t\treturn '\\u{1F4A1}'\n\t\t}\n\t}\n\n\trender() {\n\t\tif (!this._visible && this._closing) return html``\n\n\t\treturn html`\n\t\t\t<div\n\t\t\t\tclass=\"notification ${this.type} ${this._closing ? 'closing' : ''} ${this._hovered ? 'hovered' : ''}\"\n\t\t\t\trole=\"alert\"\n\t\t\t\t@mouseenter=${this._handleMouseEnter}\n\t\t\t\t@mouseleave=${this._handleMouseLeave}\n\t\t\t>\n\t\t\t\t<span class=\"emoji\">${this._getEmoji()}</span>\n\t\t\t\t<div class=\"content\">\n\t\t\t\t\t${this.title ? html`<div class=\"title\">${this.title}</div>` : ''}\n\t\t\t\t\t<div class=\"message\">${this.message}</div>\n\t\t\t\t</div>\n\t\t\t\t${this.closable\n\t\t\t\t\t? html`\n\t\t\t\t\t\t\t<button class=\"close\" aria-label=\"Close notification\" @click=${this.close}>x</button>\n\t\t\t\t\t\t`\n\t\t\t\t\t: ''}\n\t\t\t\t${this.showProgress || this.duration > 0\n\t\t\t\t\t? html`<schmancy-progress\n\t\t\t\t\t\tclass=\"progress\"\n\t\t\t\t\t\tsize=\"xs\"\n\t\t\t\t\t\t.value=${this._progress}\n\t\t\t\t\t\t?indeterminate=${this.showProgress && this.duration === 0}\n\t\t\t\t\t></schmancy-progress>`\n\t\t\t\t\t: ''}\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sch-notification': SchmancyNotification\n\t}\n}\n","import { $sounds, type Feeling } from '../audio'\nimport SchmancyNotification, { NotificationType } from './notification'\n\nexport interface NotificationOptions {\n\tid?: string\n\ttitle?: string\n\tmessage: string\n\ttype?: NotificationType\n\tduration?: number\n\tclosable?: boolean\n\tplaySound?: boolean\n\tshowProgress?: boolean\n}\n\nconst typeToFeeling: Record<NotificationType, Feeling> = {\n\tinfo: 'curious',\n\tsuccess: 'content',\n\twarning: 'anxious',\n\terror: 'disappointed',\n}\n\n// Track last mouse position\nlet lastClickPosition = { x: window.innerWidth - 100, y: 50 }\n\n// Global mousedown listener to track click position\nif (typeof window !== 'undefined') {\n\twindow.addEventListener(\n\t\t'mousedown',\n\t\t(e: MouseEvent) => {\n\t\t\tlastClickPosition = { x: e.clientX, y: e.clientY }\n\t\t},\n\t\t{ capture: true, passive: true },\n\t)\n}\n\n// Track current notification element\nlet currentNotification: SchmancyNotification | null = null\n\n/**\n * Notification service for centralized notification management.\n * Provides a simple API for showing notifications.\n */\nexport class NotificationService {\n\tprivate static instance: NotificationService\n\tprivate notificationStack: string[] = []\n\tprivate audioVolume = 0.1\n\n\t// Default notification options\n\tprivate static DEFAULT_OPTIONS: Partial<NotificationOptions> = {\n\t\tduration: 1000, // 1 seconds - long enough to be readable\n\t\tclosable: true,\n\t\tplaySound: true,\n\t}\n\n\t// Type-specific default durations (in milliseconds)\n\tprivate static TYPE_DURATIONS: Record<NotificationType, number> = {\n\t\tsuccess: 1500, // 1.5 seconds - quick confirmation\n\t\tinfo: 2000, // 2 seconds - informational\n\t\twarning: 2500, // 2.5 seconds - needs attention\n\t\terror: 2500, // 2.5 seconds - important\n\t}\n\n\t// Private constructor for singleton pattern\n\tprivate constructor() {\n\t\t$sounds.setVolume(this.audioVolume)\n\t}\n\n\t/**\n\t * Get the singleton instance\n\t */\n\tpublic static getInstance(): NotificationService {\n\t\tif (!NotificationService.instance) {\n\t\t\tNotificationService.instance = new NotificationService()\n\t\t}\n\t\treturn NotificationService.instance\n\t}\n\n\t/**\n\t * Show a notification\n\t * @returns The ID of the created notification\n\t */\n\tpublic notify(options: NotificationOptions): string {\n\t\t// Apply default options\n\t\tconst completeOptions = {\n\t\t\t...NotificationService.DEFAULT_OPTIONS,\n\t\t\t...options,\n\t\t\t// Override with duraton from options if provided, otherwise use default\n\t\t\tduration: options.duration ?? NotificationService.DEFAULT_OPTIONS.duration,\n\t\t}\n\n\t\tconst id = completeOptions.id || `notification-${Date.now()}-${Math.floor(Math.random() * 10000)}`\n\n\t\t// Add to stack for tracking\n\t\tthis.notificationStack.push(id)\n\n\t\t// Remove existing notification if any (only 1 at a time)\n\t\tif (currentNotification) {\n\t\t\tcurrentNotification.remove()\n\t\t\tcurrentNotification = null\n\t\t}\n\n\t\t// Create the notification element directly\n\t\tconst notification = document.createElement('sch-notification') as SchmancyNotification\n\t\tnotification.id = id\n\t\tnotification.title = completeOptions.title || ''\n\t\tnotification.message = completeOptions.message\n\t\tnotification.type = completeOptions.type || 'info'\n\t\tnotification.duration = completeOptions.duration ?? 1000\n\t\tnotification.closable = completeOptions.closable !== false\n\t\tnotification.playSound = false // We handle sound here\n\t\tnotification.showProgress = completeOptions.showProgress || false\n\t\tnotification.startPosition = { ...lastClickPosition }\n\n\t\t// Play sound if enabled\n\t\tif (completeOptions.playSound !== false) {\n\t\t\t$sounds.play(typeToFeeling[notification.type])\n\t\t}\n\n\t\t// Listen for close event\n\t\tnotification.addEventListener('close', () => {\n\t\t\tconst index = this.notificationStack.indexOf(id)\n\t\t\tif (index > -1) {\n\t\t\t\tthis.notificationStack.splice(index, 1)\n\t\t\t}\n\t\t\tnotification.remove()\n\t\t\tif (currentNotification === notification) {\n\t\t\t\tcurrentNotification = null\n\t\t\t}\n\t\t})\n\n\t\t// Append to body\n\t\tdocument.body.appendChild(notification)\n\t\tcurrentNotification = notification\n\n\t\treturn id\n\t}\n\n\t/**\n\t * Dismiss a notification\n\t * @param id Optional notification ID. If not provided, dismisses the most recent notification\n\t */\n\tpublic dismiss(id?: string): void {\n\t\tlet targetId: string | undefined\n\n\t\tif (id) {\n\t\t\t// Remove specific notification from stack\n\t\t\tconst index = this.notificationStack.indexOf(id)\n\t\t\tif (index > -1) {\n\t\t\t\tthis.notificationStack.splice(index, 1)\n\t\t\t\ttargetId = id\n\t\t\t}\n\t\t} else {\n\t\t\t// Remove most recent notification (last in stack)\n\t\t\ttargetId = this.notificationStack.pop()\n\t\t}\n\n\t\tif (targetId && currentNotification && currentNotification.id === targetId) {\n\t\t\tcurrentNotification.close()\n\t\t}\n\t}\n\n\t/**\n\t * Update a notification's content\n\t */\n\tpublic update(id: string, options: Partial<NotificationOptions>): void {\n\t\tif (currentNotification && currentNotification.id === id) {\n\t\t\tif (options.title !== undefined) currentNotification.title = options.title\n\t\t\tif (options.message !== undefined) currentNotification.message = options.message\n\t\t\tif (options.type !== undefined) currentNotification.type = options.type\n\t\t}\n\t}\n\n\t/**\n\t * Show an info notification\n\t */\n\tpublic info(message?: string, options: Partial<Omit<NotificationOptions, 'message' | 'type'>> = {}): string {\n\t\treturn this.notify({\n\t\t\tmessage: message ?? '',\n\t\t\ttype: 'info',\n\t\t\tduration: message ? (options.duration ?? NotificationService.TYPE_DURATIONS.info) : 1,\n\t\t\t...options,\n\t\t})\n\t}\n\n\t/**\n\t * Show a success notification\n\t */\n\tpublic success(message?: string, options: Partial<Omit<NotificationOptions, 'message' | 'type'>> = {}): string {\n\t\treturn this.notify({\n\t\t\tmessage: message ?? '',\n\t\t\ttype: 'success',\n\t\t\tduration: message ? (options.duration ?? NotificationService.TYPE_DURATIONS.success) : 1,\n\t\t\t...options,\n\t\t})\n\t}\n\n\t/**\n\t * Show a warning notification\n\t */\n\tpublic warning(message?: string, options: Partial<Omit<NotificationOptions, 'message' | 'type'>> = {}): string {\n\t\treturn this.notify({\n\t\t\tmessage: message ?? '',\n\t\t\ttype: 'warning',\n\t\t\tduration: message ? (options.duration ?? NotificationService.TYPE_DURATIONS.warning) : 1,\n\t\t\t...options,\n\t\t})\n\t}\n\n\t/**\n\t * Show an error notification\n\t */\n\tpublic error(message?: string, options: Partial<Omit<NotificationOptions, 'message' | 'type'>> = {}): string {\n\t\treturn this.notify({\n\t\t\tmessage: message ?? '',\n\t\t\ttype: 'error',\n\t\t\tduration: message ? (options.duration ?? NotificationService.TYPE_DURATIONS.error) : 1,\n\t\t\t...options,\n\t\t})\n\t}\n\n\t/**\n\t * Show a notification with a custom duration\n\t */\n\tpublic customDuration(\n\t\tmessage: string,\n\t\tduration: number,\n\t\toptions: Partial<Omit<NotificationOptions, 'message' | 'duration'>> = {},\n\t): string {\n\t\treturn this.notify({\n\t\t\tmessage,\n\t\t\tduration,\n\t\t\t...options,\n\t\t})\n\t}\n\n\t/**\n\t * Show a persistent notification (won't auto-dismiss)\n\t */\n\tpublic persistent(message: string, options: Partial<Omit<NotificationOptions, 'message' | 'duration'>> = {}): string {\n\t\treturn this.notify({\n\t\t\tmessage,\n\t\t\tduration: 0, // Zero duration means no auto-close\n\t\t\t...options,\n\t\t})\n\t}\n}\n\n/**\n * Global notification (toast) utility. Fire-and-forget API for success,\n * error, info, and warning toasts, plus a low-level `show` for custom\n * notifications.\n *\n * @service\n * @summary Toast notifications — success, error, info, warning.\n * @method show(options: NotificationOptions) - Low-level; show any NotificationOptions.\n * @method success(message, options?) - Green success toast.\n * @method error(message, options?) - Red error toast.\n * @method info(message, options?) - Blue informational toast.\n * @method warning(message, options?) - Amber warning toast.\n */\nexport const $notify = {\n\t/**\n\t * Show a notification\n\t */\n\tshow: (options: NotificationOptions): string => {\n\t\treturn NotificationService.getInstance().notify(options)\n\t},\n\n\t/**\n\t * Show an info notification\n\t */\n\tinfo: (message?: string, options: Partial<Omit<NotificationOptions, 'message' | 'type'>> = {}): string => {\n\t\treturn NotificationService.getInstance().info(message, options)\n\t},\n\n\t/**\n\t * Show a success notification\n\t */\n\tsuccess: (message?: string, options: Partial<Omit<NotificationOptions, 'message' | 'type'>> = {}): string => {\n\t\treturn NotificationService.getInstance().success(message, options)\n\t},\n\n\t/**\n\t * Show a warning notification\n\t */\n\twarning: (message?: string, options: Partial<Omit<NotificationOptions, 'message' | 'type'>> = {}): string => {\n\t\treturn NotificationService.getInstance().warning(message, options)\n\t},\n\n\t/**\n\t * Show an error notification\n\t */\n\terror: (message?: string, options: Partial<Omit<NotificationOptions, 'message' | 'type'>> = {}): string => {\n\t\treturn NotificationService.getInstance().error(message, options)\n\t},\n\n\t/**\n\t * Show a notification with a custom duration\n\t * @param message The notification message\n\t * @param duration Duration in milliseconds before auto-dismissing (0 for no auto-dismiss)\n\t * @param options Additional notification options\n\t */\n\tcustomDuration: (\n\t\tmessage: string,\n\t\tduration: number,\n\t\toptions: Partial<Omit<NotificationOptions, 'message' | 'duration'>> = {},\n\t): string => {\n\t\treturn NotificationService.getInstance().customDuration(message, duration, options)\n\t},\n\n\t/**\n\t * Show a persistent notification that won't auto-dismiss\n\t */\n\tpersistent: (message: string, options: Partial<Omit<NotificationOptions, 'message' | 'duration'>> = {}): string => {\n\t\treturn NotificationService.getInstance().persistent(message, options)\n\t},\n\n\t/**\n\t * Dismiss a notification\n\t * @param id Optional notification ID. If not provided, dismisses the most recent notification (queue-like behavior)\n\t */\n\tdismiss: (id?: string): void => {\n\t\treturn NotificationService.getInstance().dismiss(id)\n\t},\n\n\t/**\n\t * Update a notification's content\n\t */\n\tupdate: (id: string, options: Partial<NotificationOptions>): void => {\n\t\treturn NotificationService.getInstance().update(id, options)\n\t},\n}\n","import { Observable, tap, finalize, catchError } from 'rxjs'\r\nimport { $notify, NotificationOptions } from './notification-service'\r\n\r\nexport interface NotifyOptions {\r\n\t/**\r\n\t * Message to show while the operation is in progress\r\n\t */\r\n\tloadingMessage?: string\r\n\t/**\r\n\t * Message to show when the operation completes successfully\r\n\t */\r\n\tsuccessMessage?: string\r\n\t/**\r\n\t * Message to show when the operation fails (can be a function to format error)\r\n\t */\r\n\terrorMessage?: string | ((error: any) => string)\r\n\t/**\r\n\t * Type of notification for loading state\r\n\t */\r\n\tloadingType?: NotificationOptions['type']\r\n\t/**\r\n\t * Type of notification for success state\r\n\t */\r\n\tsuccessType?: NotificationOptions['type']\r\n\t/**\r\n\t * Type of notification for error state\r\n\t */\r\n\terrorType?: NotificationOptions['type']\r\n\t/**\r\n\t * Whether to auto-dismiss the loading notification on complete/error\r\n\t */\r\n\tautoDismissLoading?: boolean\r\n\t/**\r\n\t * Duration for success notification (ms). Use 0 for persistent\r\n\t */\r\n\tsuccessDuration?: number\r\n\t/**\r\n\t * Duration for error notification (ms). Use 0 for persistent\r\n\t */\r\n\terrorDuration?: number\r\n}\r\n\r\n/**\r\n * Wraps an Observable with notification lifecycle management.\r\n * Shows a loading notification with progress indicator, then auto-dismisses and shows success/error notification.\r\n * \r\n * @example\r\n * ```typescript\r\n * // Basic usage with progress indicator\r\n * someApiCall().pipe(\r\n *   notify({\r\n *     loadingMessage: 'Loading data...',\r\n *     successMessage: 'Data loaded successfully!',\r\n *     errorMessage: 'Failed to load data'\r\n *   })\r\n * ).subscribe()\r\n * \r\n * // With custom durations\r\n * saveData().pipe(\r\n *   notify({\r\n *     loadingMessage: 'Saving...',\r\n *     successMessage: 'Saved!',\r\n *     successDuration: 5000, // Success stays for 5 seconds\r\n *     errorMessage: (err) => `Save failed: ${err.message}`,\r\n *     errorDuration: 0 // Error is persistent until dismissed\r\n *   })\r\n * ).subscribe()\r\n * \r\n * // Full configuration example\r\n * uploadFile().pipe(\r\n *   notify({\r\n *     loadingMessage: 'Uploading file...',\r\n *     loadingType: 'info',\r\n *     successMessage: 'Upload complete!',\r\n *     successType: 'success',\r\n *     successDuration: 3000,\r\n *     errorMessage: (err) => `Upload failed: ${err.message}`,\r\n *     errorType: 'error',\r\n *     errorDuration: 10000,\r\n *     autoDismissLoading: true\r\n *   })\r\n * ).subscribe()\r\n * ```\r\n */\r\nexport function notify<T>(options: NotifyOptions) {\r\n\treturn (source: Observable<T>): Observable<T> => {\r\n\t\tlet loadingNotificationId: string | undefined\r\n\r\n\t\t// Show loading notification if message provided\r\n\t\tif (options.loadingMessage) {\r\n\t\t\tloadingNotificationId = $notify.show({\r\n\t\t\t\tmessage: options.loadingMessage,\r\n\t\t\t\ttype: options.loadingType || 'info',\r\n\t\t\t\tduration: 0, // Persistent until dismissed\r\n\t\t\t\tshowProgress: true, // Show indeterminate progress by default\r\n\t\t\t})\r\n\t\t}\r\n\r\n\t\treturn source.pipe(\r\n\t\t\ttap((value) => {\r\n\t\t\t\t// Check if the emitted value contains progress information\r\n\t\t\t\t// Common patterns: { progress: number }, { loaded: number, total: number }, etc.\r\n\t\t\t\tif (loadingNotificationId && typeof value === 'object' && value !== null) {\r\n\t\t\t\t\tlet progress: number | undefined\r\n\t\t\t\t\t\r\n\t\t\t\t\t// Check for different progress patterns\r\n\t\t\t\t\tif ('progress' in value && typeof (value as any).progress === 'number') {\r\n\t\t\t\t\t\tprogress = (value as any).progress\r\n\t\t\t\t\t} else if ('loaded' in value && 'total' in value) {\r\n\t\t\t\t\t\tconst loaded = (value as any).loaded\r\n\t\t\t\t\t\tconst total = (value as any).total\r\n\t\t\t\t\t\tif (typeof loaded === 'number' && typeof total === 'number' && total > 0) {\r\n\t\t\t\t\t\t\tprogress = (loaded / total) * 100\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t}\r\n\t\t\t\t\t\r\n\t\t\t\t\t// Update notification with progress if available\r\n\t\t\t\t\tif (progress !== undefined) {\r\n\t\t\t\t\t\t// We need to update the progress of the notification\r\n\t\t\t\t\t\t// For now, we'll update the message to show progress percentage\r\n\t\t\t\t\t\t$notify.update?.(loadingNotificationId, {\r\n\t\t\t\t\t\t\tmessage: `${options.loadingMessage} (${Math.round(progress)}%)`,\r\n\t\t\t\t\t\t})\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t\t\r\n\t\t\t\t// Check if this is the final success emission (not a progress update)\r\n\t\t\t\t// Typically file uploads emit progress events then a final result\r\n\t\t\t\tconst isProgressUpdate = typeof value === 'object' && value !== null && \r\n\t\t\t\t\t('progress' in value || ('loaded' in value && 'total' in value))\r\n\t\t\t\t\r\n\t\t\t\tif (!isProgressUpdate) {\r\n\t\t\t\t\t// On successful final emission, dismiss loading and show success\r\n\t\t\t\t\tif (loadingNotificationId && options.autoDismissLoading !== false) {\r\n\t\t\t\t\t\t$notify.dismiss(loadingNotificationId)\r\n\t\t\t\t\t\tloadingNotificationId = undefined\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tif (options.successMessage) {\r\n\t\t\t\t\t\t$notify.show({\r\n\t\t\t\t\t\t\tmessage: options.successMessage,\r\n\t\t\t\t\t\t\ttype: options.successType || 'success',\r\n\t\t\t\t\t\t\tduration: options.successDuration ?? 2000,\r\n\t\t\t\t\t\t})\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t}),\r\n\t\t\tcatchError((error) => {\r\n\t\t\t\t// On error, dismiss loading and show error\r\n\t\t\t\tif (loadingNotificationId && options.autoDismissLoading !== false) {\r\n\t\t\t\t\t$notify.dismiss(loadingNotificationId)\r\n\t\t\t\t\tloadingNotificationId = undefined\r\n\t\t\t\t}\r\n\r\n\t\t\t\tif (options.errorMessage) {\r\n\t\t\t\t\tconst message = typeof options.errorMessage === 'function' \r\n\t\t\t\t\t\t? options.errorMessage(error)\r\n\t\t\t\t\t\t: options.errorMessage\r\n\t\t\t\t\t\r\n\t\t\t\t\t$notify.show({\r\n\t\t\t\t\t\tmessage,\r\n\t\t\t\t\t\ttype: options.errorType || 'error',\r\n\t\t\t\t\t\tduration: options.errorDuration ?? 3000,\r\n\t\t\t\t\t})\r\n\t\t\t\t}\r\n\r\n\t\t\t\t// Re-throw the error to maintain the error flow\r\n\t\t\t\tthrow error\r\n\t\t\t}),\r\n\t\t\tfinalize(() => {\r\n\t\t\t\t// Clean up any remaining loading notification\r\n\t\t\t\tif (loadingNotificationId && options.autoDismissLoading !== false) {\r\n\t\t\t\t\t$notify.dismiss(loadingNotificationId)\r\n\t\t\t\t}\r\n\t\t\t})\r\n\t\t)\r\n\t}\r\n}\r\n\r\n/**\r\n * Simplified version for API calls that just need loading and auto-dismiss.\r\n * Perfect for fire-and-forget operations where you want to show progress.\r\n * \r\n * @example\r\n * ```typescript\r\n * downloadData().pipe(\r\n *   notifyProgress('Downloading...')\r\n * ).subscribe()\r\n * \r\n * // With custom messages\r\n * saveDocument().pipe(\r\n *   notifyProgress('Saving document...', 'Document saved!', 'Save failed')\r\n * ).subscribe()\r\n * ```\r\n */\r\nexport function notifyProgress<T>(\r\n\tloadingMessage: string,\r\n\tsuccessMessage?: string,\r\n\terrorMessage?: string\r\n) {\r\n\treturn notify<T>({\r\n\t\tloadingMessage,\r\n\t\tsuccessMessage: successMessage || undefined,\r\n\t\terrorMessage: errorMessage || undefined,\r\n\t\tautoDismissLoading: true,\r\n\t})\r\n}"],"mappings":"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"}
+{"version":3,"file":"notification-BqyMYtP7.js","names":[],"sources":["../src/notification/notification.scss?inline","../src/notification/notification.ts","../src/notification/notification-service.ts","../src/notification/notify.ts"],"sourcesContent":[":host {\n\tdisplay: block;\n}\n\n.notification {\n\tposition: relative;\n\tdisplay: flex;\n\talign-items: flex-start;\n\tgap: 10px;\n\tpadding: 12px;\n\tpadding-right: 32px;\n\tbackground: var(--schmancy-sys-color-surface-container);\n\tborder-radius: var(--schmancy-sys-shape-corner-extraLarge, 16px);\n\tcolor: var(--schmancy-sys-color-surface-on);\n\tmax-width: 320px;\n\toverflow: hidden;\n\n\t/* Type-colored luminous glow */\n\t--notification-glow-color: var(--schmancy-sys-color-primary-default);\n\tbox-shadow: 0 4px 24px -6px color-mix(in srgb, var(--notification-glow-color) 18%, transparent);\n\n\ttransition:\n\t\tbox-shadow 300ms ease,\n\t\ttransform 300ms cubic-bezier(0.34, 1.56, 0.64, 1);\n\n\t&.info { --notification-glow-color: var(--schmancy-sys-color-primary-default); }\n\t&.success { --notification-glow-color: var(--schmancy-sys-color-success-default); }\n\t&.warning { --notification-glow-color: var(--schmancy-sys-color-warning-default); }\n\t&.error { --notification-glow-color: var(--schmancy-sys-color-error-default); }\n\n\t&.hovered {\n\t\tbox-shadow: 0 8px 32px -4px color-mix(in srgb, var(--notification-glow-color) 28%, transparent);\n\t\ttransform: translateY(-2px);\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\ttransition: box-shadow 200ms ease;\n\t\t&.hovered { transform: none; }\n\t}\n}\n\n.emoji {\n\tfont-size: 20px;\n\tline-height: 1;\n\tflex-shrink: 0;\n\tmargin-top: 1px;\n}\n\n.content {\n\tflex: 1;\n\tmin-width: 0;\n}\n\n.title {\n\tfont-weight: 500;\n\tfont-size: 13px;\n\tline-height: 1.4;\n\tmargin-bottom: 2px;\n\tletter-spacing: 0.01em;\n\n\t.info & {\n\t\tcolor: var(--schmancy-sys-color-primary-default);\n\t}\n\t.success & {\n\t\tcolor: var(--schmancy-sys-color-success-default);\n\t}\n\t.warning & {\n\t\tcolor: var(--schmancy-sys-color-tertiary-default);\n\t}\n\t.error & {\n\t\tcolor: var(--schmancy-sys-color-error-default);\n\t}\n}\n\n.message {\n\tfont-size: 13px;\n\tline-height: 1.4;\n\topacity: 0.75;\n\tletter-spacing: 0.01em;\n}\n\n.close {\n\tposition: absolute;\n\ttop: 8px;\n\tright: 6px;\n\tbackground: none;\n\tborder: none;\n\tfont-size: 16px;\n\tfont-weight: 300;\n\tcolor: var(--schmancy-sys-color-surface-onVariant);\n\tcursor: pointer;\n\tpadding: 4px 6px;\n\tline-height: 1;\n\topacity: 0.4;\n\tborder-radius: var(--schmancy-sys-shape-corner-full, 50%);\n\ttransition: opacity 200ms ease;\n\n\t&:hover {\n\t\topacity: 0.8;\n\t}\n\n\t&:focus-visible {\n\t\toutline: none;\n\t\topacity: 1;\n\t\tbox-shadow:\n\t\t\t0 0 0 2px var(--schmancy-sys-color-primary-default),\n\t\t\t0 0 8px -2px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 25%, transparent);\n\t}\n}\n\n.progress {\n\tposition: absolute;\n\tbottom: 0;\n\tleft: 0;\n\tright: 0;\n}\n","import { SchmancyElement } from '@mixins/index'\nimport { html, unsafeCSS } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { BehaviorSubject, timer, interval, NEVER } from 'rxjs'\nimport { switchMap, takeUntil, map, tap, distinctUntilChanged } from 'rxjs/operators'\nimport '../progress/progress'\nimport style from './notification.scss?inline'\n\nexport type NotificationType = 'info' | 'success' | 'warning' | 'error'\n\n/**\n * Calculate a point on an arc between two points\n */\nfunction calculateArcPoint(\n\tstart: { x: number; y: number },\n\tend: { x: number; y: number },\n\tarcDirection: 'up' | 'down' = 'up',\n\tintensity: number = 0.3,\n): { x: number; y: number } {\n\tconst midX = (start.x + end.x) / 2\n\tconst midY = (start.y + end.y) / 2\n\tconst distance = Math.sqrt(Math.pow(end.x - start.x, 2) + Math.pow(end.y - start.y, 2))\n\tconst arcHeight = Math.min(distance * intensity, 150)\n\treturn {\n\t\tx: midX,\n\t\ty: arcDirection === 'up' ? midY - arcHeight : midY + arcHeight,\n\t}\n}\n\n/**\n * @fires close - When notification is closed\n */\n@customElement('sch-notification')\nexport default class SchmancyNotification extends SchmancyElement {\n\tstatic styles = [unsafeCSS(style)];\n\n\t@property({ type: String }) title = ''\n\t@property({ type: String }) message = ''\n\t@property({ type: String }) type: NotificationType = 'info'\n\t@property({ type: Boolean }) closable = true\n\t@property({ type: Number }) duration = 5000 // 0 means no auto-close\n\t@property({ type: String }) id = `notification-${Date.now()}-${Math.floor(Math.random() * 10000)}`\n\t@property({ type: Boolean }) playSound = true\n\t@property({ type: Boolean }) showProgress = false // Show indeterminate progress bar\n\t@property({ type: Object }) startPosition: { x: number; y: number } = { x: 0, y: 0 }\n\n\t@state() private _visible = true\n\t@state() private _progress = 100\n\t@state() private _hovered = false\n\t@state() private _closing = false\n\n\tprivate paused$ = new BehaviorSubject<boolean>(false)\n\tprivate startTime = 0\n\tprivate pausedAt = 0\n\tprivate elapsedBeforePause = 0\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\n\t\t// Set fixed positioning for blackbird animation\n\t\tthis.style.position = 'fixed'\n\t\tthis.style.top = '16px'\n\t\tthis.style.right = '16px'\n\t\tthis.style.zIndex = '10001'\n\t\tthis.style.opacity = '0'\n\n\t\t// Animate in after first render\n\t\tthis.updateComplete.then(() => {\n\t\t\tthis.animateIn()\n\t\t\treturn\n\t\t})\n\n\t\tif (this.duration > 0) {\n\t\t\tthis.setupAutoClose()\n\t\t\tthis.setupProgressUpdates()\n\t\t}\n\n\t\tif (this.playSound) {\n\t\t\tthis._playSound()\n\t\t}\n\t}\n\n\tprivate async animateIn() {\n\t\t// Get the notification element's final position\n\t\tconst rect = this.getBoundingClientRect()\n\t\tconst targetX = rect.left + rect.width / 2\n\t\tconst targetY = rect.top + rect.height / 2\n\n\t\t// Calculate arc point for upward arc\n\t\tconst arcPoint = calculateArcPoint(this.startPosition, { x: targetX, y: targetY }, 'up', 0.3)\n\n\t\t// Animate from click position to final position with arc\n\t\tawait this.animate(\n\t\t\t[\n\t\t\t\t{\n\t\t\t\t\ttransform: `translate(${this.startPosition.x - targetX}px, ${this.startPosition.y - targetY}px) scale(0.1)`,\n\t\t\t\t\topacity: 0,\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\ttransform: `translate(${arcPoint.x - targetX}px, ${arcPoint.y - targetY}px) scale(0.6)`,\n\t\t\t\t\topacity: 0.9,\n\t\t\t\t\toffset: 0.5,\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\ttransform: 'translate(0, 0) scale(1)',\n\t\t\t\t\topacity: 1,\n\t\t\t\t},\n\t\t\t],\n\t\t\t{\n\t\t\t\tduration: 400,\n\t\t\t\teasing: 'cubic-bezier(0.34, 1.2, 0.64, 1)',\n\t\t\t\tfill: 'forwards',\n\t\t\t},\n\t\t).finished\n\t}\n\n\tprivate setupAutoClose() {\n\t\tif (this.duration <= 0) return\n\n\t\tthis.startTime = Date.now()\n\t\tthis.elapsedBeforePause = 0\n\n\t\tthis.paused$\n\t\t\t.pipe(\n\t\t\t\tswitchMap(paused => {\n\t\t\t\t\tif (paused) {\n\t\t\t\t\t\tthis.pausedAt = Date.now()\n\t\t\t\t\t\tthis.elapsedBeforePause += this.pausedAt - this.startTime\n\t\t\t\t\t\treturn NEVER\n\t\t\t\t\t} else {\n\t\t\t\t\t\tthis.startTime = Date.now()\n\t\t\t\t\t\tconst remaining = this.duration - this.elapsedBeforePause\n\t\t\t\t\t\tif (remaining <= 0) {\n\t\t\t\t\t\t\tthis.close()\n\t\t\t\t\t\t\treturn NEVER\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn timer(remaining)\n\t\t\t\t\t}\n\t\t\t\t}),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe(() => this.close())\n\t}\n\n\tprivate setupProgressUpdates() {\n\t\tif (this.duration <= 0) return\n\n\t\tinterval(16)\n\t\t\t.pipe(\n\t\t\t\tswitchMap(() =>\n\t\t\t\t\tthis.paused$.pipe(\n\t\t\t\t\t\tmap(paused => {\n\t\t\t\t\t\t\tif (paused) return this._progress\n\t\t\t\t\t\t\tconst elapsed = this.elapsedBeforePause + (Date.now() - this.startTime)\n\t\t\t\t\t\t\tconst remaining = Math.max(0, this.duration - elapsed)\n\t\t\t\t\t\t\treturn (remaining / this.duration) * 100\n\t\t\t\t\t\t}),\n\t\t\t\t\t),\n\t\t\t\t),\n\t\t\t\tdistinctUntilChanged(),\n\t\t\t\ttap(progress => {\n\t\t\t\t\tthis._progress = progress\n\t\t\t\t}),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe()\n\t}\n\n\tprivate _playSound() {\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('playsound', {\n\t\t\t\tdetail: { type: this.type },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\t}\n\n\tprivate _handleMouseEnter() {\n\t\tthis._hovered = true\n\t\tthis.paused$.next(true)\n\t}\n\n\tprivate _handleMouseLeave() {\n\t\tthis._hovered = false\n\t\tthis.paused$.next(false)\n\t}\n\n\tpublic async close() {\n\t\tif (this._closing) return\n\t\tthis._closing = true\n\t\tthis._visible = false\n\n\t\t// Animate out before dispatching close event\n\t\tawait this.animate(\n\t\t\t[\n\t\t\t\t{ transform: 'translate(0, 0) scale(1)', opacity: 1 },\n\t\t\t\t{ transform: 'translate(0, -20px) scale(0.8)', opacity: 0 },\n\t\t\t],\n\t\t\t{\n\t\t\t\tduration: 200,\n\t\t\t\teasing: 'cubic-bezier(0.4, 0, 1, 1)',\n\t\t\t\tfill: 'forwards',\n\t\t\t},\n\t\t).finished\n\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('close', {\n\t\t\t\tdetail: { id: this.id },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\t}\n\n\tprivate _getEmoji(): string {\n\t\tswitch (this.type) {\n\t\t\tcase 'success':\n\t\t\t\treturn '\\u2705'\n\t\t\tcase 'warning':\n\t\t\t\treturn '\\u26A0\\uFE0F'\n\t\t\tcase 'error':\n\t\t\t\treturn '\\u274C'\n\t\t\tdefault:\n\t\t\t\treturn '\\u{1F4A1}'\n\t\t}\n\t}\n\n\trender() {\n\t\tif (!this._visible && this._closing) return html``\n\n\t\treturn html`\n\t\t\t<div\n\t\t\t\tclass=\"notification ${this.type} ${this._closing ? 'closing' : ''} ${this._hovered ? 'hovered' : ''}\"\n\t\t\t\trole=\"alert\"\n\t\t\t\t@mouseenter=${this._handleMouseEnter}\n\t\t\t\t@mouseleave=${this._handleMouseLeave}\n\t\t\t>\n\t\t\t\t<span class=\"emoji\">${this._getEmoji()}</span>\n\t\t\t\t<div class=\"content\">\n\t\t\t\t\t${this.title ? html`<div class=\"title\">${this.title}</div>` : ''}\n\t\t\t\t\t<div class=\"message\">${this.message}</div>\n\t\t\t\t</div>\n\t\t\t\t${this.closable\n\t\t\t\t\t? html`\n\t\t\t\t\t\t\t<button class=\"close\" aria-label=\"Close notification\" @click=${this.close}>x</button>\n\t\t\t\t\t\t`\n\t\t\t\t\t: ''}\n\t\t\t\t${this.showProgress || this.duration > 0\n\t\t\t\t\t? html`<schmancy-progress\n\t\t\t\t\t\tclass=\"progress\"\n\t\t\t\t\t\tsize=\"xs\"\n\t\t\t\t\t\t.value=${this._progress}\n\t\t\t\t\t\t?indeterminate=${this.showProgress && this.duration === 0}\n\t\t\t\t\t></schmancy-progress>`\n\t\t\t\t\t: ''}\n\t\t\t</div>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sch-notification': SchmancyNotification\n\t}\n}\n","import { $sounds, type Feeling } from '../audio'\nimport SchmancyNotification, { NotificationType } from './notification'\n\nexport interface NotificationOptions {\n\tid?: string\n\ttitle?: string\n\tmessage: string\n\ttype?: NotificationType\n\tduration?: number\n\tclosable?: boolean\n\tplaySound?: boolean\n\tshowProgress?: boolean\n}\n\nconst typeToFeeling: Record<NotificationType, Feeling> = {\n\tinfo: 'curious',\n\tsuccess: 'content',\n\twarning: 'anxious',\n\terror: 'disappointed',\n}\n\n// Track last mouse position\nlet lastClickPosition = { x: window.innerWidth - 100, y: 50 }\n\n// Global mousedown listener to track click position\nif (typeof window !== 'undefined') {\n\twindow.addEventListener(\n\t\t'mousedown',\n\t\t(e: MouseEvent) => {\n\t\t\tlastClickPosition = { x: e.clientX, y: e.clientY }\n\t\t},\n\t\t{ capture: true, passive: true },\n\t)\n}\n\n// Track current notification element\nlet currentNotification: SchmancyNotification | null = null\n\n/**\n * Notification service for centralized notification management.\n * Provides a simple API for showing notifications.\n */\nexport class NotificationService {\n\tprivate static instance: NotificationService\n\tprivate notificationStack: string[] = []\n\tprivate audioVolume = 0.1\n\n\t// Default notification options\n\tprivate static DEFAULT_OPTIONS: Partial<NotificationOptions> = {\n\t\tduration: 1000, // 1 seconds - long enough to be readable\n\t\tclosable: true,\n\t\tplaySound: true,\n\t}\n\n\t// Type-specific default durations (in milliseconds)\n\tprivate static TYPE_DURATIONS: Record<NotificationType, number> = {\n\t\tsuccess: 1500, // 1.5 seconds - quick confirmation\n\t\tinfo: 2000, // 2 seconds - informational\n\t\twarning: 2500, // 2.5 seconds - needs attention\n\t\terror: 2500, // 2.5 seconds - important\n\t}\n\n\t// Private constructor for singleton pattern\n\tprivate constructor() {\n\t\t$sounds.setVolume(this.audioVolume)\n\t}\n\n\t/**\n\t * Get the singleton instance\n\t */\n\tpublic static getInstance(): NotificationService {\n\t\tif (!NotificationService.instance) {\n\t\t\tNotificationService.instance = new NotificationService()\n\t\t}\n\t\treturn NotificationService.instance\n\t}\n\n\t/**\n\t * Show a notification\n\t * @returns The ID of the created notification\n\t */\n\tpublic notify(options: NotificationOptions): string {\n\t\t// Apply default options\n\t\tconst completeOptions = {\n\t\t\t...NotificationService.DEFAULT_OPTIONS,\n\t\t\t...options,\n\t\t\t// Override with duraton from options if provided, otherwise use default\n\t\t\tduration: options.duration ?? NotificationService.DEFAULT_OPTIONS.duration,\n\t\t}\n\n\t\tconst id = completeOptions.id || `notification-${Date.now()}-${Math.floor(Math.random() * 10000)}`\n\n\t\t// Add to stack for tracking\n\t\tthis.notificationStack.push(id)\n\n\t\t// Remove existing notification if any (only 1 at a time)\n\t\tif (currentNotification) {\n\t\t\tcurrentNotification.remove()\n\t\t\tcurrentNotification = null\n\t\t}\n\n\t\t// Create the notification element directly\n\t\tconst notification = document.createElement('sch-notification') as SchmancyNotification\n\t\tnotification.id = id\n\t\tnotification.title = completeOptions.title || ''\n\t\tnotification.message = completeOptions.message\n\t\tnotification.type = completeOptions.type || 'info'\n\t\tnotification.duration = completeOptions.duration ?? 1000\n\t\tnotification.closable = completeOptions.closable !== false\n\t\tnotification.playSound = false // We handle sound here\n\t\tnotification.showProgress = completeOptions.showProgress || false\n\t\tnotification.startPosition = { ...lastClickPosition }\n\n\t\t// Play sound if enabled\n\t\tif (completeOptions.playSound !== false) {\n\t\t\t$sounds.play(typeToFeeling[notification.type])\n\t\t}\n\n\t\t// Listen for close event\n\t\tnotification.addEventListener('close', () => {\n\t\t\tconst index = this.notificationStack.indexOf(id)\n\t\t\tif (index > -1) {\n\t\t\t\tthis.notificationStack.splice(index, 1)\n\t\t\t}\n\t\t\tnotification.remove()\n\t\t\tif (currentNotification === notification) {\n\t\t\t\tcurrentNotification = null\n\t\t\t}\n\t\t})\n\n\t\t// Append to body\n\t\tdocument.body.appendChild(notification)\n\t\tcurrentNotification = notification\n\n\t\treturn id\n\t}\n\n\t/**\n\t * Dismiss a notification\n\t * @param id Optional notification ID. If not provided, dismisses the most recent notification\n\t */\n\tpublic dismiss(id?: string): void {\n\t\tlet targetId: string | undefined\n\n\t\tif (id) {\n\t\t\t// Remove specific notification from stack\n\t\t\tconst index = this.notificationStack.indexOf(id)\n\t\t\tif (index > -1) {\n\t\t\t\tthis.notificationStack.splice(index, 1)\n\t\t\t\ttargetId = id\n\t\t\t}\n\t\t} else {\n\t\t\t// Remove most recent notification (last in stack)\n\t\t\ttargetId = this.notificationStack.pop()\n\t\t}\n\n\t\tif (targetId && currentNotification && currentNotification.id === targetId) {\n\t\t\tcurrentNotification.close()\n\t\t}\n\t}\n\n\t/**\n\t * Update a notification's content\n\t */\n\tpublic update(id: string, options: Partial<NotificationOptions>): void {\n\t\tif (currentNotification && currentNotification.id === id) {\n\t\t\tif (options.title !== undefined) currentNotification.title = options.title\n\t\t\tif (options.message !== undefined) currentNotification.message = options.message\n\t\t\tif (options.type !== undefined) currentNotification.type = options.type\n\t\t}\n\t}\n\n\t/**\n\t * Show an info notification\n\t */\n\tpublic info(message?: string, options: Partial<Omit<NotificationOptions, 'message' | 'type'>> = {}): string {\n\t\treturn this.notify({\n\t\t\tmessage: message ?? '',\n\t\t\ttype: 'info',\n\t\t\tduration: message ? (options.duration ?? NotificationService.TYPE_DURATIONS.info) : 1,\n\t\t\t...options,\n\t\t})\n\t}\n\n\t/**\n\t * Show a success notification\n\t */\n\tpublic success(message?: string, options: Partial<Omit<NotificationOptions, 'message' | 'type'>> = {}): string {\n\t\treturn this.notify({\n\t\t\tmessage: message ?? '',\n\t\t\ttype: 'success',\n\t\t\tduration: message ? (options.duration ?? NotificationService.TYPE_DURATIONS.success) : 1,\n\t\t\t...options,\n\t\t})\n\t}\n\n\t/**\n\t * Show a warning notification\n\t */\n\tpublic warning(message?: string, options: Partial<Omit<NotificationOptions, 'message' | 'type'>> = {}): string {\n\t\treturn this.notify({\n\t\t\tmessage: message ?? '',\n\t\t\ttype: 'warning',\n\t\t\tduration: message ? (options.duration ?? NotificationService.TYPE_DURATIONS.warning) : 1,\n\t\t\t...options,\n\t\t})\n\t}\n\n\t/**\n\t * Show an error notification\n\t */\n\tpublic error(message?: string, options: Partial<Omit<NotificationOptions, 'message' | 'type'>> = {}): string {\n\t\treturn this.notify({\n\t\t\tmessage: message ?? '',\n\t\t\ttype: 'error',\n\t\t\tduration: message ? (options.duration ?? NotificationService.TYPE_DURATIONS.error) : 1,\n\t\t\t...options,\n\t\t})\n\t}\n\n\t/**\n\t * Show a notification with a custom duration\n\t */\n\tpublic customDuration(\n\t\tmessage: string,\n\t\tduration: number,\n\t\toptions: Partial<Omit<NotificationOptions, 'message' | 'duration'>> = {},\n\t): string {\n\t\treturn this.notify({\n\t\t\tmessage,\n\t\t\tduration,\n\t\t\t...options,\n\t\t})\n\t}\n\n\t/**\n\t * Show a persistent notification (won't auto-dismiss)\n\t */\n\tpublic persistent(message: string, options: Partial<Omit<NotificationOptions, 'message' | 'duration'>> = {}): string {\n\t\treturn this.notify({\n\t\t\tmessage,\n\t\t\tduration: 0, // Zero duration means no auto-close\n\t\t\t...options,\n\t\t})\n\t}\n}\n\n/**\n * Global notification (toast) utility. Fire-and-forget API for success,\n * error, info, and warning toasts, plus a low-level `show` for custom\n * notifications.\n *\n * @service\n * @summary Toast notifications — success, error, info, warning.\n * @method show(options: NotificationOptions) - Low-level; show any NotificationOptions.\n * @method success(message, options?) - Green success toast.\n * @method error(message, options?) - Red error toast.\n * @method info(message, options?) - Blue informational toast.\n * @method warning(message, options?) - Amber warning toast.\n */\nexport const $notify = {\n\t/**\n\t * Show a notification\n\t */\n\tshow: (options: NotificationOptions): string => {\n\t\treturn NotificationService.getInstance().notify(options)\n\t},\n\n\t/**\n\t * Show an info notification\n\t */\n\tinfo: (message?: string, options: Partial<Omit<NotificationOptions, 'message' | 'type'>> = {}): string => {\n\t\treturn NotificationService.getInstance().info(message, options)\n\t},\n\n\t/**\n\t * Show a success notification\n\t */\n\tsuccess: (message?: string, options: Partial<Omit<NotificationOptions, 'message' | 'type'>> = {}): string => {\n\t\treturn NotificationService.getInstance().success(message, options)\n\t},\n\n\t/**\n\t * Show a warning notification\n\t */\n\twarning: (message?: string, options: Partial<Omit<NotificationOptions, 'message' | 'type'>> = {}): string => {\n\t\treturn NotificationService.getInstance().warning(message, options)\n\t},\n\n\t/**\n\t * Show an error notification\n\t */\n\terror: (message?: string, options: Partial<Omit<NotificationOptions, 'message' | 'type'>> = {}): string => {\n\t\treturn NotificationService.getInstance().error(message, options)\n\t},\n\n\t/**\n\t * Show a notification with a custom duration\n\t * @param message The notification message\n\t * @param duration Duration in milliseconds before auto-dismissing (0 for no auto-dismiss)\n\t * @param options Additional notification options\n\t */\n\tcustomDuration: (\n\t\tmessage: string,\n\t\tduration: number,\n\t\toptions: Partial<Omit<NotificationOptions, 'message' | 'duration'>> = {},\n\t): string => {\n\t\treturn NotificationService.getInstance().customDuration(message, duration, options)\n\t},\n\n\t/**\n\t * Show a persistent notification that won't auto-dismiss\n\t */\n\tpersistent: (message: string, options: Partial<Omit<NotificationOptions, 'message' | 'duration'>> = {}): string => {\n\t\treturn NotificationService.getInstance().persistent(message, options)\n\t},\n\n\t/**\n\t * Dismiss a notification\n\t * @param id Optional notification ID. If not provided, dismisses the most recent notification (queue-like behavior)\n\t */\n\tdismiss: (id?: string): void => {\n\t\treturn NotificationService.getInstance().dismiss(id)\n\t},\n\n\t/**\n\t * Update a notification's content\n\t */\n\tupdate: (id: string, options: Partial<NotificationOptions>): void => {\n\t\treturn NotificationService.getInstance().update(id, options)\n\t},\n}\n","import { Observable, tap, finalize, catchError } from 'rxjs'\r\nimport { $notify, NotificationOptions } from './notification-service'\r\n\r\nexport interface NotifyOptions {\r\n\t/**\r\n\t * Message to show while the operation is in progress\r\n\t */\r\n\tloadingMessage?: string\r\n\t/**\r\n\t * Message to show when the operation completes successfully\r\n\t */\r\n\tsuccessMessage?: string\r\n\t/**\r\n\t * Message to show when the operation fails (can be a function to format error)\r\n\t */\r\n\terrorMessage?: string | ((error: any) => string)\r\n\t/**\r\n\t * Type of notification for loading state\r\n\t */\r\n\tloadingType?: NotificationOptions['type']\r\n\t/**\r\n\t * Type of notification for success state\r\n\t */\r\n\tsuccessType?: NotificationOptions['type']\r\n\t/**\r\n\t * Type of notification for error state\r\n\t */\r\n\terrorType?: NotificationOptions['type']\r\n\t/**\r\n\t * Whether to auto-dismiss the loading notification on complete/error\r\n\t */\r\n\tautoDismissLoading?: boolean\r\n\t/**\r\n\t * Duration for success notification (ms). Use 0 for persistent\r\n\t */\r\n\tsuccessDuration?: number\r\n\t/**\r\n\t * Duration for error notification (ms). Use 0 for persistent\r\n\t */\r\n\terrorDuration?: number\r\n}\r\n\r\n/**\r\n * Wraps an Observable with notification lifecycle management.\r\n * Shows a loading notification with progress indicator, then auto-dismisses and shows success/error notification.\r\n * \r\n * @example\r\n * ```typescript\r\n * // Basic usage with progress indicator\r\n * someApiCall().pipe(\r\n *   notify({\r\n *     loadingMessage: 'Loading data...',\r\n *     successMessage: 'Data loaded successfully!',\r\n *     errorMessage: 'Failed to load data'\r\n *   })\r\n * ).subscribe()\r\n * \r\n * // With custom durations\r\n * saveData().pipe(\r\n *   notify({\r\n *     loadingMessage: 'Saving...',\r\n *     successMessage: 'Saved!',\r\n *     successDuration: 5000, // Success stays for 5 seconds\r\n *     errorMessage: (err) => `Save failed: ${err.message}`,\r\n *     errorDuration: 0 // Error is persistent until dismissed\r\n *   })\r\n * ).subscribe()\r\n * \r\n * // Full configuration example\r\n * uploadFile().pipe(\r\n *   notify({\r\n *     loadingMessage: 'Uploading file...',\r\n *     loadingType: 'info',\r\n *     successMessage: 'Upload complete!',\r\n *     successType: 'success',\r\n *     successDuration: 3000,\r\n *     errorMessage: (err) => `Upload failed: ${err.message}`,\r\n *     errorType: 'error',\r\n *     errorDuration: 10000,\r\n *     autoDismissLoading: true\r\n *   })\r\n * ).subscribe()\r\n * ```\r\n */\r\nexport function notify<T>(options: NotifyOptions) {\r\n\treturn (source: Observable<T>): Observable<T> => {\r\n\t\tlet loadingNotificationId: string | undefined\r\n\r\n\t\t// Show loading notification if message provided\r\n\t\tif (options.loadingMessage) {\r\n\t\t\tloadingNotificationId = $notify.show({\r\n\t\t\t\tmessage: options.loadingMessage,\r\n\t\t\t\ttype: options.loadingType || 'info',\r\n\t\t\t\tduration: 0, // Persistent until dismissed\r\n\t\t\t\tshowProgress: true, // Show indeterminate progress by default\r\n\t\t\t})\r\n\t\t}\r\n\r\n\t\treturn source.pipe(\r\n\t\t\ttap((value) => {\r\n\t\t\t\t// Check if the emitted value contains progress information\r\n\t\t\t\t// Common patterns: { progress: number }, { loaded: number, total: number }, etc.\r\n\t\t\t\tif (loadingNotificationId && typeof value === 'object' && value !== null) {\r\n\t\t\t\t\tlet progress: number | undefined\r\n\t\t\t\t\t\r\n\t\t\t\t\t// Check for different progress patterns\r\n\t\t\t\t\tif ('progress' in value && typeof (value as any).progress === 'number') {\r\n\t\t\t\t\t\tprogress = (value as any).progress\r\n\t\t\t\t\t} else if ('loaded' in value && 'total' in value) {\r\n\t\t\t\t\t\tconst loaded = (value as any).loaded\r\n\t\t\t\t\t\tconst total = (value as any).total\r\n\t\t\t\t\t\tif (typeof loaded === 'number' && typeof total === 'number' && total > 0) {\r\n\t\t\t\t\t\t\tprogress = (loaded / total) * 100\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t}\r\n\t\t\t\t\t\r\n\t\t\t\t\t// Update notification with progress if available\r\n\t\t\t\t\tif (progress !== undefined) {\r\n\t\t\t\t\t\t// We need to update the progress of the notification\r\n\t\t\t\t\t\t// For now, we'll update the message to show progress percentage\r\n\t\t\t\t\t\t$notify.update?.(loadingNotificationId, {\r\n\t\t\t\t\t\t\tmessage: `${options.loadingMessage} (${Math.round(progress)}%)`,\r\n\t\t\t\t\t\t})\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t\t\r\n\t\t\t\t// Check if this is the final success emission (not a progress update)\r\n\t\t\t\t// Typically file uploads emit progress events then a final result\r\n\t\t\t\tconst isProgressUpdate = typeof value === 'object' && value !== null && \r\n\t\t\t\t\t('progress' in value || ('loaded' in value && 'total' in value))\r\n\t\t\t\t\r\n\t\t\t\tif (!isProgressUpdate) {\r\n\t\t\t\t\t// On successful final emission, dismiss loading and show success\r\n\t\t\t\t\tif (loadingNotificationId && options.autoDismissLoading !== false) {\r\n\t\t\t\t\t\t$notify.dismiss(loadingNotificationId)\r\n\t\t\t\t\t\tloadingNotificationId = undefined\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tif (options.successMessage) {\r\n\t\t\t\t\t\t$notify.show({\r\n\t\t\t\t\t\t\tmessage: options.successMessage,\r\n\t\t\t\t\t\t\ttype: options.successType || 'success',\r\n\t\t\t\t\t\t\tduration: options.successDuration ?? 2000,\r\n\t\t\t\t\t\t})\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t}),\r\n\t\t\tcatchError((error) => {\r\n\t\t\t\t// On error, dismiss loading and show error\r\n\t\t\t\tif (loadingNotificationId && options.autoDismissLoading !== false) {\r\n\t\t\t\t\t$notify.dismiss(loadingNotificationId)\r\n\t\t\t\t\tloadingNotificationId = undefined\r\n\t\t\t\t}\r\n\r\n\t\t\t\tif (options.errorMessage) {\r\n\t\t\t\t\tconst message = typeof options.errorMessage === 'function' \r\n\t\t\t\t\t\t? options.errorMessage(error)\r\n\t\t\t\t\t\t: options.errorMessage\r\n\t\t\t\t\t\r\n\t\t\t\t\t$notify.show({\r\n\t\t\t\t\t\tmessage,\r\n\t\t\t\t\t\ttype: options.errorType || 'error',\r\n\t\t\t\t\t\tduration: options.errorDuration ?? 3000,\r\n\t\t\t\t\t})\r\n\t\t\t\t}\r\n\r\n\t\t\t\t// Re-throw the error to maintain the error flow\r\n\t\t\t\tthrow error\r\n\t\t\t}),\r\n\t\t\tfinalize(() => {\r\n\t\t\t\t// Clean up any remaining loading notification\r\n\t\t\t\tif (loadingNotificationId && options.autoDismissLoading !== false) {\r\n\t\t\t\t\t$notify.dismiss(loadingNotificationId)\r\n\t\t\t\t}\r\n\t\t\t})\r\n\t\t)\r\n\t}\r\n}\r\n\r\n/**\r\n * Simplified version for API calls that just need loading and auto-dismiss.\r\n * Perfect for fire-and-forget operations where you want to show progress.\r\n * \r\n * @example\r\n * ```typescript\r\n * downloadData().pipe(\r\n *   notifyProgress('Downloading...')\r\n * ).subscribe()\r\n * \r\n * // With custom messages\r\n * saveDocument().pipe(\r\n *   notifyProgress('Saving document...', 'Document saved!', 'Save failed')\r\n * ).subscribe()\r\n * ```\r\n */\r\nexport function notifyProgress<T>(\r\n\tloadingMessage: string,\r\n\tsuccessMessage?: string,\r\n\terrorMessage?: string\r\n) {\r\n\treturn notify<T>({\r\n\t\tloadingMessage,\r\n\t\tsuccessMessage: successMessage || undefined,\r\n\t\terrorMessage: errorMessage || undefined,\r\n\t\tautoDismissLoading: true,\r\n\t})\r\n}"],"mappings":"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"}

package/dist/{notification-B3wVUC8l.cjs → notification-D5eOdsMT.cjs}

@@ -1,4 +1,4 @@
-require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-BPUR4Kc4.cjs`),t=require(`./active-host-jH3iloCR.cjs`),n=require(`./audio-Cvmemu84.cjs`);require(`./progress-CcfLfHOE.cjs`);let r=require(`rxjs`),i=require(`rxjs/operators`),a=require(`lit/decorators.js`),o=require(`lit`);var s=class extends e.c{constructor(...e){super(...e),this.title=``,this.message=``,this.type=`info`,this.closable=!0,this.duration=5e3,this.id=`notification-${Date.now()}-${Math.floor(1e4*Math.random())}`,this.playSound=!0,this.showProgress=!1,this.startPosition={x:0,y:0},this._visible=!0,this._progress=100,this._hovered=!1,this._closing=!1,this.paused$=new r.BehaviorSubject(!1),this.startTime=0,this.pausedAt=0,this.elapsedBeforePause=0}static{this.styles=[(0,o.unsafeCSS)(`:host{display:block}.notification{background:var(--schmancy-sys-color-surface-container);border-radius:var(--schmancy-sys-shape-corner-extraLarge,16px);color:var(--schmancy-sys-color-surface-on);--notification-glow-color:var(--schmancy-sys-color-primary-default);max-width:320px;box-shadow:0 4px 24px -6px color-mix(in srgb, var(--notification-glow-color) 18%, transparent);align-items:flex-start;gap:10px;padding:12px 32px 12px 12px;transition:box-shadow .3s,transform .3s cubic-bezier(.34,1.56,.64,1);display:flex;position:relative;overflow:hidden}.notification.info{--notification-glow-color:var(--schmancy-sys-color-primary-default)}.notification.success{--notification-glow-color:var(--schmancy-sys-color-success-default)}.notification.warning{--notification-glow-color:var(--schmancy-sys-color-warning-default)}.notification.error{--notification-glow-color:var(--schmancy-sys-color-error-default)}.notification.hovered{box-shadow:0 8px 32px -4px color-mix(in srgb, var(--notification-glow-color) 28%, transparent);transform:translateY(-2px)}@media (prefers-reduced-motion:reduce){.notification{transition:box-shadow .2s}.notification.hovered{transform:none}}.emoji{flex-shrink:0;margin-top:1px;font-size:20px;line-height:1}.content{flex:1;min-width:0}.title{letter-spacing:.01em;margin-bottom:2px;font-size:13px;font-weight:500;line-height:1.4}.info .title{color:var(--schmancy-sys-color-primary-default)}.success .title{color:var(--schmancy-sys-color-success-default)}.warning .title{color:var(--schmancy-sys-color-tertiary-default)}.error .title{color:var(--schmancy-sys-color-error-default)}.message{opacity:.75;letter-spacing:.01em;font-size:13px;line-height:1.4}.close{color:var(--schmancy-sys-color-surface-onVariant);cursor:pointer;opacity:.4;border-radius:var(--schmancy-sys-shape-corner-full,50%);background:0 0;border:none;padding:4px 6px;font-size:16px;font-weight:300;line-height:1;transition:opacity .2s;position:absolute;top:8px;right:6px}.close:hover{opacity:.8}.close:focus-visible{opacity:1;box-shadow:0 0 0 2px var(--schmancy-sys-color-primary-default), 0 0 8px -2px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 25%, transparent);outline:none}.progress{position:absolute;bottom:0;left:0;right:0}`)]}connectedCallback(){super.connectedCallback(),this.style.position=`fixed`,this.style.top=`16px`,this.style.right=`16px`,this.style.zIndex=`10001`,this.style.opacity=`0`,this.updateComplete.then(()=>{this.animateIn()}),this.duration>0&&(this.setupAutoClose(),this.setupProgressUpdates()),this.playSound&&this._playSound()}async animateIn(){let e=this.getBoundingClientRect(),t=e.left+e.width/2,n=e.top+e.height/2,r=function(e,t,n=`up`,r=.3){let i=(e.x+t.x)/2,a=(e.y+t.y)/2,o=Math.sqrt((t.x-e.x)**2+(t.y-e.y)**2),s=Math.min(o*r,150);return{x:i,y:n===`up`?a-s:a+s}}(this.startPosition,{x:t,y:n},`up`,.3);await this.animate([{transform:`translate(${this.startPosition.x-t}px, ${this.startPosition.y-n}px) scale(0.1)`,opacity:0},{transform:`translate(${r.x-t}px, ${r.y-n}px) scale(0.6)`,opacity:.9,offset:.5},{transform:`translate(0, 0) scale(1)`,opacity:1}],{duration:400,easing:`cubic-bezier(0.34, 1.2, 0.64, 1)`,fill:`forwards`}).finished}setupAutoClose(){this.duration<=0||(this.startTime=Date.now(),this.elapsedBeforePause=0,this.paused$.pipe((0,i.switchMap)(e=>{if(e)return this.pausedAt=Date.now(),this.elapsedBeforePause+=this.pausedAt-this.startTime,r.NEVER;{this.startTime=Date.now();let e=this.duration-this.elapsedBeforePause;return e<=0?(this.close(),r.NEVER):(0,r.timer)(e)}}),(0,i.takeUntil)(this.disconnecting)).subscribe(()=>this.close()))}setupProgressUpdates(){this.duration<=0||(0,r.interval)(16).pipe((0,i.switchMap)(()=>this.paused$.pipe((0,i.map)(e=>{if(e)return this._progress;let t=this.elapsedBeforePause+(Date.now()-this.startTime);return Math.max(0,this.duration-t)/this.duration*100}))),(0,i.distinctUntilChanged)(),(0,i.tap)(e=>{this._progress=e}),(0,i.takeUntil)(this.disconnecting)).subscribe()}_playSound(){this.dispatchEvent(new CustomEvent(`playsound`,{detail:{type:this.type},bubbles:!0,composed:!0}))}_handleMouseEnter(){this._hovered=!0,this.paused$.next(!0)}_handleMouseLeave(){this._hovered=!1,this.paused$.next(!1)}async close(){this._closing||(this._closing=!0,this._visible=!1,await this.animate([{transform:`translate(0, 0) scale(1)`,opacity:1},{transform:`translate(0, -20px) scale(0.8)`,opacity:0}],{duration:200,easing:`cubic-bezier(0.4, 0, 1, 1)`,fill:`forwards`}).finished,this.dispatchEvent(new CustomEvent(`close`,{detail:{id:this.id},bubbles:!0,composed:!0})))}_getEmoji(){switch(this.type){case`success`:return`✅`;case`warning`:return`⚠️`;case`error`:return`❌`;default:return`💡`}}render(){return!this._visible&&this._closing?o.html``:o.html`
+require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-DSy-enUd.cjs`),t=require(`./active-host-jH3iloCR.cjs`),n=require(`./audio-Cvmemu84.cjs`);require(`./progress-CY-UbvOB.cjs`);let r=require(`rxjs`),i=require(`rxjs/operators`),a=require(`lit/decorators.js`),o=require(`lit`);var s=class extends e.c{constructor(...e){super(...e),this.title=``,this.message=``,this.type=`info`,this.closable=!0,this.duration=5e3,this.id=`notification-${Date.now()}-${Math.floor(1e4*Math.random())}`,this.playSound=!0,this.showProgress=!1,this.startPosition={x:0,y:0},this._visible=!0,this._progress=100,this._hovered=!1,this._closing=!1,this.paused$=new r.BehaviorSubject(!1),this.startTime=0,this.pausedAt=0,this.elapsedBeforePause=0}static{this.styles=[(0,o.unsafeCSS)(`:host{display:block}.notification{background:var(--schmancy-sys-color-surface-container);border-radius:var(--schmancy-sys-shape-corner-extraLarge,16px);color:var(--schmancy-sys-color-surface-on);--notification-glow-color:var(--schmancy-sys-color-primary-default);max-width:320px;box-shadow:0 4px 24px -6px color-mix(in srgb, var(--notification-glow-color) 18%, transparent);align-items:flex-start;gap:10px;padding:12px 32px 12px 12px;transition:box-shadow .3s,transform .3s cubic-bezier(.34,1.56,.64,1);display:flex;position:relative;overflow:hidden}.notification.info{--notification-glow-color:var(--schmancy-sys-color-primary-default)}.notification.success{--notification-glow-color:var(--schmancy-sys-color-success-default)}.notification.warning{--notification-glow-color:var(--schmancy-sys-color-warning-default)}.notification.error{--notification-glow-color:var(--schmancy-sys-color-error-default)}.notification.hovered{box-shadow:0 8px 32px -4px color-mix(in srgb, var(--notification-glow-color) 28%, transparent);transform:translateY(-2px)}@media (prefers-reduced-motion:reduce){.notification{transition:box-shadow .2s}.notification.hovered{transform:none}}.emoji{flex-shrink:0;margin-top:1px;font-size:20px;line-height:1}.content{flex:1;min-width:0}.title{letter-spacing:.01em;margin-bottom:2px;font-size:13px;font-weight:500;line-height:1.4}.info .title{color:var(--schmancy-sys-color-primary-default)}.success .title{color:var(--schmancy-sys-color-success-default)}.warning .title{color:var(--schmancy-sys-color-tertiary-default)}.error .title{color:var(--schmancy-sys-color-error-default)}.message{opacity:.75;letter-spacing:.01em;font-size:13px;line-height:1.4}.close{color:var(--schmancy-sys-color-surface-onVariant);cursor:pointer;opacity:.4;border-radius:var(--schmancy-sys-shape-corner-full,50%);background:0 0;border:none;padding:4px 6px;font-size:16px;font-weight:300;line-height:1;transition:opacity .2s;position:absolute;top:8px;right:6px}.close:hover{opacity:.8}.close:focus-visible{opacity:1;box-shadow:0 0 0 2px var(--schmancy-sys-color-primary-default), 0 0 8px -2px color-mix(in srgb, var(--schmancy-sys-color-primary-default) 25%, transparent);outline:none}.progress{position:absolute;bottom:0;left:0;right:0}`)]}connectedCallback(){super.connectedCallback(),this.style.position=`fixed`,this.style.top=`16px`,this.style.right=`16px`,this.style.zIndex=`10001`,this.style.opacity=`0`,this.updateComplete.then(()=>{this.animateIn()}),this.duration>0&&(this.setupAutoClose(),this.setupProgressUpdates()),this.playSound&&this._playSound()}async animateIn(){let e=this.getBoundingClientRect(),t=e.left+e.width/2,n=e.top+e.height/2,r=function(e,t,n=`up`,r=.3){let i=(e.x+t.x)/2,a=(e.y+t.y)/2,o=Math.sqrt((t.x-e.x)**2+(t.y-e.y)**2),s=Math.min(o*r,150);return{x:i,y:n===`up`?a-s:a+s}}(this.startPosition,{x:t,y:n},`up`,.3);await this.animate([{transform:`translate(${this.startPosition.x-t}px, ${this.startPosition.y-n}px) scale(0.1)`,opacity:0},{transform:`translate(${r.x-t}px, ${r.y-n}px) scale(0.6)`,opacity:.9,offset:.5},{transform:`translate(0, 0) scale(1)`,opacity:1}],{duration:400,easing:`cubic-bezier(0.34, 1.2, 0.64, 1)`,fill:`forwards`}).finished}setupAutoClose(){this.duration<=0||(this.startTime=Date.now(),this.elapsedBeforePause=0,this.paused$.pipe((0,i.switchMap)(e=>{if(e)return this.pausedAt=Date.now(),this.elapsedBeforePause+=this.pausedAt-this.startTime,r.NEVER;{this.startTime=Date.now();let e=this.duration-this.elapsedBeforePause;return e<=0?(this.close(),r.NEVER):(0,r.timer)(e)}}),(0,i.takeUntil)(this.disconnecting)).subscribe(()=>this.close()))}setupProgressUpdates(){this.duration<=0||(0,r.interval)(16).pipe((0,i.switchMap)(()=>this.paused$.pipe((0,i.map)(e=>{if(e)return this._progress;let t=this.elapsedBeforePause+(Date.now()-this.startTime);return Math.max(0,this.duration-t)/this.duration*100}))),(0,i.distinctUntilChanged)(),(0,i.tap)(e=>{this._progress=e}),(0,i.takeUntil)(this.disconnecting)).subscribe()}_playSound(){this.dispatchEvent(new CustomEvent(`playsound`,{detail:{type:this.type},bubbles:!0,composed:!0}))}_handleMouseEnter(){this._hovered=!0,this.paused$.next(!0)}_handleMouseLeave(){this._hovered=!1,this.paused$.next(!1)}async close(){this._closing||(this._closing=!0,this._visible=!1,await this.animate([{transform:`translate(0, 0) scale(1)`,opacity:1},{transform:`translate(0, -20px) scale(0.8)`,opacity:0}],{duration:200,easing:`cubic-bezier(0.4, 0, 1, 1)`,fill:`forwards`}).finished,this.dispatchEvent(new CustomEvent(`close`,{detail:{id:this.id},bubbles:!0,composed:!0})))}_getEmoji(){switch(this.type){case`success`:return`✅`;case`warning`:return`⚠️`;case`error`:return`❌`;default:return`💡`}}render(){return!this._visible&&this._closing?o.html``:o.html`
 			<div
 				class="notification ${this.type} ${this._closing?`closing`:``} ${this._hovered?`hovered`:``}"
 				role="alert"