@mhmo91/schmancy 0.10.26 → 0.10.27

package/dist/navigation-rail.js

@@ -1,11 +1,11 @@
-import { c as e } from "./mixins-CKbQ6BJo.js";
+import { c as e } from "./mixins-8dT5j6CS.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";
-import { customElement as l, property as u, queryAssignedElements as d, state as f } from "lit/decorators.js";
-import { html as p } from "lit";
-import { when as m } from "lit/directives/when.js";
-var h = class extends e {
+import { BehaviorSubject as n, Observable as r, fromEvent as i, merge as a, takeUntil as o } from "rxjs";
+import { delay as s, distinctUntilChanged as c, tap as l } from "rxjs/operators";
+import { customElement as u, property as d, queryAssignedElements as f, state as p } from "lit/decorators.js";
+import { html as m } from "lit";
+import { when as h } from "lit/directives/when.js";
+var g = class extends e {
 	constructor(...e) {
 		super(...e), this.hovering$ = new n(!1), this.pressing$ = new n(!1), this.active$ = new n(!1), this.icon = "", this.label = "", this.value = "", this.badge = "", this.badgeVariant = "error", this.showLabel = !1, this.disabled = !1, this.nested = !1, this.group = !1, this.showRipple = !1;
 	}
@@ -22,11 +22,11 @@ var h = class extends e {
 		this.active = e;
 	}
 	connectedCallback() {
-		super.connectedCallback(), i(r(this, "mouseenter").pipe(c(() => this.hovering$.next(!0))), r(this, "mouseleave").pipe(c(() => this.hovering$.next(!1)))).pipe(a(this.disconnecting)).subscribe(), i(r(this, "mousedown").pipe(c(() => this.pressing$.next(!0))), r(this, "mouseup").pipe(c(() => this.pressing$.next(!1))), r(this, "mouseleave").pipe(c(() => this.pressing$.next(!1)))).pipe(a(this.disconnecting)).subscribe(), this.pressing$.pipe(c((e) => {
+		super.connectedCallback(), a(i(this, "mouseenter").pipe(l(() => this.hovering$.next(!0))), i(this, "mouseleave").pipe(l(() => this.hovering$.next(!1)))).pipe(o(this.disconnecting)).subscribe(), a(i(this, "mousedown").pipe(l(() => this.pressing$.next(!0))), i(this, "mouseup").pipe(l(() => this.pressing$.next(!1))), i(this, "mouseleave").pipe(l(() => this.pressing$.next(!1)))).pipe(o(this.disconnecting)).subscribe(), this.pressing$.pipe(l((e) => {
 			e && !this.disabled && (this.showRipple = !0);
-		}), o(600), c(() => this.showRipple = !1), a(this.disconnecting)).subscribe(), this.active$.pipe(s(), c((e) => {
+		}), s(600), l(() => this.showRipple = !1), o(this.disconnecting)).subscribe(), this.active$.pipe(c(), l((e) => {
 			this.requestUpdate(), this.setAttribute("aria-selected", String(e)), this.setAttribute("tabindex", e ? "0" : "-1");
-		}), a(this.disconnecting)).subscribe(), this.setAttribute("role", "listitem"), this.hasAttribute("tabindex") || this.setAttribute("tabindex", this.active ? "0" : "-1");
+		}), o(this.disconnecting)).subscribe(), this.setAttribute("role", "listitem"), this.hasAttribute("tabindex") || this.setAttribute("tabindex", this.active ? "0" : "-1");
 	}
 	updated(e) {
 		super.updated(e), e.has("disabled") && this.setAttribute("aria-disabled", String(this.disabled)), e.has("label") && this.setAttribute("aria-label", this.label);
@@ -102,7 +102,7 @@ var h = class extends e {
 			"before:transition-all before:duration-300": !0,
 			"before:w-[200%] before:h-[200%] before:opacity-12": this.showRipple
 		});
-		return p`
+		return m`
 			<div
 				class=${n}
 				part="container"
@@ -114,22 +114,22 @@ 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`
+					${h(e, () => m`<slot class="relative" name="icon"></slot>`, () => h(this.icon, () => m`
 									<schmancy-icon class=${a} part="icon-text">
 										${this.active ? `${this.icon}-fill` : this.icon}
 									</schmancy-icon>
 								`))}
 				</div>
 
-				${m(this.label, () => p`<span class=${o} part="label">${this.label}</span>`)}
-				${m(this.badge, () => p`
-						${m(t, () => p`<slot name="badge"></slot>`, () => p`
+				${h(this.label, () => m`<span class=${o} part="label">${this.label}</span>`)}
+				${h(this.badge, () => m`
+						${h(t, () => m`<slot name="badge"></slot>`, () => m`
 								<span class=${s} part="badge" aria-label="${this.badge} notifications"> ${this.badge} </span>
 							`)}
 					`)}
 
 				<!-- Tooltip shown via title attribute -->
-				${m(this.hasAttribute("title"), () => p`
+				${h(this.hasAttribute("title"), () => m`
 						<div
 							class="
 							absolute left-[calc(100%+8px)] top-1/2 -translate-y-1/2
@@ -149,28 +149,28 @@ var h = class extends e {
 		`;
 	}
 };
-t([u({ type: String })], h.prototype, "icon", void 0), t([u({ type: String })], h.prototype, "label", void 0), t([u({ type: String })], h.prototype, "value", void 0), t([u({
+t([d({ type: String })], g.prototype, "icon", void 0), t([d({ type: String })], g.prototype, "label", void 0), t([d({ type: String })], g.prototype, "value", void 0), t([d({
 	type: Boolean,
 	reflect: !0
-})], h.prototype, "active", null), t([u({
+})], g.prototype, "active", null), t([d({
 	type: Boolean,
 	reflect: !0
-})], h.prototype, "selected", null), t([u({ type: String })], h.prototype, "badge", void 0), t([u({ type: String })], h.prototype, "badgeVariant", void 0), t([u({
+})], g.prototype, "selected", null), t([d({ type: String })], g.prototype, "badge", void 0), t([d({ type: String })], g.prototype, "badgeVariant", void 0), t([d({
 	type: Boolean,
 	attribute: "show-label"
-})], h.prototype, "showLabel", void 0), t([u({
+})], g.prototype, "showLabel", void 0), t([d({
 	type: Boolean,
 	reflect: !0
-})], h.prototype, "disabled", void 0), t([u({
+})], g.prototype, "disabled", void 0), t([d({
 	type: Boolean,
 	reflect: !0
-})], h.prototype, "nested", void 0), t([u({
+})], g.prototype, "nested", void 0), t([d({
 	type: Boolean,
 	reflect: !0
-})], h.prototype, "group", void 0), t([f()], h.prototype, "showRipple", void 0), h = t([l("schmancy-navigation-rail-item")], h);
-var g = class extends e {
+})], g.prototype, "group", void 0), t([p()], g.prototype, "showRipple", void 0), g = t([u("schmancy-navigation-rail-item")], g);
+var _ = /^(grid($|-)|flex($|-)|gap-|col-|row-|justify-|items-|content-|place-|auto-|grid-cols-|grid-rows-)/, v = class extends e {
 	constructor(...e) {
-		super(...e), this.activeIndex$ = new n(-1), this._activeValue = "", this.labelVisibility = "all", this.alignment = "top", this.showTooltips = !0, this.keyboardNavigation = !0, this.expanded = !1, this.focusedIndex = -1, this.hasHeaderContent = !1, this.isFullscreen = !1;
+		super(...e), this.activeIndex$ = new n(-1), this._activeValue = "", this.labelVisibility = "all", this.alignment = "top", this.showTooltips = !0, this.keyboardNavigation = !0, this.expanded = !1, this.focusedIndex = -1, this.hasHeaderContent = !1, this.isFullscreen = !1, this._hostLayoutClasses = "";
 	}
 	get activeIndex() {
 		return this.activeIndex$.value;
@@ -188,10 +188,20 @@ var g = class extends e {
 		return this.allElements.filter((e) => e.tagName === "SCHMANCY-NAVIGATION-RAIL-ITEM");
 	}
 	connectedCallback() {
-		super.connectedCallback(), this.keyboardNavigation && this.addEventListener("keydown", this.handleKeyDown), this.activeIndex$.pipe(s(), c((e) => this.updateActiveStates(e)), a(this.disconnecting)).subscribe(), r(window, "fullscreen").pipe(c((e) => {
+		super.connectedCallback(), this.keyboardNavigation && this.addEventListener("keydown", this.handleKeyDown), this.activeIndex$.pipe(c(), l((e) => this.updateActiveStates(e)), o(this.disconnecting)).subscribe(), i(window, "fullscreen").pipe(l((e) => {
 			let t = e;
 			this.isFullscreen = t.detail;
-		}), a(this.disconnecting)).subscribe(), this.setupNavigateListener(), this.updateLabelVisibility(), this.setAttribute("role", "navigation"), this.setAttribute("aria-label", "Main navigation");
+		}), o(this.disconnecting)).subscribe(), new r((e) => {
+			let t = () => Array.from(this.classList).filter((e) => _.test(e)).join(" ");
+			e.next(t());
+			let n = new MutationObserver(() => e.next(t()));
+			return n.observe(this, {
+				attributes: !0,
+				attributeFilter: ["class"]
+			}), () => n.disconnect();
+		}).pipe(c(), l((e) => {
+			this._hostLayoutClasses = e;
+		}), o(this.disconnecting)).subscribe(), this.setupNavigateListener(), this.updateLabelVisibility(), this.setAttribute("role", "navigation"), this.setAttribute("aria-label", "Main navigation");
 	}
 	updated(e) {
 		super.updated(e), e.has("labelVisibility") && this.updateLabelVisibility(), e.has("activeValue") && this.updateActiveByValue(this.activeValue), e.has("expanded") && this.updateLabelVisibility();
@@ -292,13 +302,15 @@ var g = class extends e {
 			"flex flex-col items-center gap-1": !0,
 			hidden: !this.hasHeaderContent
 		}), r = this.classMap({
-			"flex-1 flex flex-col gap-3": !0,
-			"min-h-0": !0,
+			"flex-1": !0,
+			"min-h-0": !0
+		}), i = this._hostLayoutClasses.length > 0 ? this._hostLayoutClasses : this.classMap({
+			"flex flex-col gap-3": !0,
 			"justify-start": this.alignment === "top",
 			"justify-center": this.alignment === "center",
 			"justify-end": this.alignment === "bottom"
-		}), i = this.classMap({ "flex flex-col items-center gap-1 mt-auto pt-2": !0 });
-		return p`
+		}), a = this.classMap({ "flex flex-col items-center gap-1 mt-auto pt-2": !0 });
+		return m`
 			<div
 				class=${e}
 			>
@@ -311,11 +323,13 @@ var g = class extends e {
 
 					<nav class=${r} part="nav" role="list">
 						<schmancy-scroll hide direction="vertical">
-							<slot @slotchange=${this.handleSlotChange}></slot>
+							<div class=${i} part="items">
+								<slot @slotchange=${this.handleSlotChange}></slot>
+							</div>
 						</schmancy-scroll>
 					</nav>
 
-					<div class=${i} part="footer">
+					<div class=${a} part="footer">
 						<slot name="footer"></slot>
 					</div>
 				</div>
@@ -343,15 +357,15 @@ var g = class extends e {
 		});
 	}
 };
-t([u({ type: Number })], g.prototype, "activeIndex", null), t([u({ type: String })], g.prototype, "activeValue", null), t([u({
+t([d({ type: Number })], v.prototype, "activeIndex", null), t([d({ type: String })], v.prototype, "activeValue", null), t([d({
 	type: String,
 	attribute: "label-visibility",
 	reflect: !0
-})], g.prototype, "labelVisibility", void 0), t([u({
+})], v.prototype, "labelVisibility", void 0), t([d({
 	type: String,
 	reflect: !0
-})], g.prototype, "alignment", void 0), t([u({ type: Boolean })], g.prototype, "showTooltips", void 0), t([u({ type: Boolean })], g.prototype, "keyboardNavigation", void 0), t([u({
+})], v.prototype, "alignment", void 0), t([d({ type: Boolean })], v.prototype, "showTooltips", void 0), t([d({ type: Boolean })], v.prototype, "keyboardNavigation", void 0), t([d({
 	type: Boolean,
 	reflect: !0
-})], g.prototype, "expanded", void 0), t([f()], g.prototype, "focusedIndex", void 0), t([f()], g.prototype, "hasHeaderContent", void 0), t([f()], g.prototype, "isFullscreen", void 0), t([d({ flatten: !0 })], g.prototype, "allElements", void 0), g = t([l("schmancy-navigation-rail")], g);
-export { g as SchmancyNavigationRail, h as SchmancyNavigationRailItem };
+})], v.prototype, "expanded", void 0), t([p()], v.prototype, "focusedIndex", void 0), t([p()], v.prototype, "hasHeaderContent", void 0), t([p()], v.prototype, "isFullscreen", void 0), t([p()], v.prototype, "_hostLayoutClasses", void 0), t([f({ flatten: !0 })], v.prototype, "allElements", void 0), v = t([u("schmancy-navigation-rail")], v);
+export { v as SchmancyNavigationRail, g as SchmancyNavigationRailItem };

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 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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"}
+{"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'\nimport { html, PropertyValues } from 'lit'\nimport { customElement, property, queryAssignedElements, state } from 'lit/decorators.js'\nimport { BehaviorSubject, fromEvent, Observable, takeUntil } from 'rxjs'\nimport { distinctUntilChanged, tap } from 'rxjs/operators'\nimport { SchmancyNavigationRailItem } from './navigation-rail-item'\n\n/**\n * Regex matching Tailwind utility prefixes that control items-container layout.\n * Classes matching this are forwarded from the host's `class` attribute to the\n * inner `<nav>` element so authors can write e.g. `class=\"grid gap-2\"` on the\n * host and have the items container adopt that layout.\n * Classes NOT matching (bg-*, text-*, shadow-*, etc.) stay on the host only.\n */\nconst LAYOUT_CLASS_RE =\n\t/^(grid($|-)|flex($|-)|gap-|col-|row-|justify-|items-|content-|place-|auto-|grid-cols-|grid-rows-)/\n\nexport type NavigateEvent = CustomEvent<string>\n\nexport type NavigationRailMenuClickEvent = CustomEvent<void>\n\nexport type NavigationRailFabClickEvent = CustomEvent<void>\n\n\nexport type LabelVisibility = 'all' | 'selected' | 'none'\n\n/**\n * Material Design 3 Navigation Rail Component\n * @see https://m3.material.io/components/navigation-rail/overview\n *\n * `<schmancy-navigation-rail>` component\n *\n * A Material Design 3 vertical navigation component positioned on the left side of an application.\n * Navigation rails provide access to between 3-7 primary destinations with a compact footprint.\n * Automatically hides in fullscreen mode when triggered via schmancyTheme.next({ fullscreen: true }).\n *\n * ## Layout composition\n * Place layout utilities directly on the host element. They are forwarded to the\n * items container `<div part=\"items\">` (the direct flat-tree parent of slotted items,\n * placed inside `<schmancy-scroll>`). When no layout utilities are present on the host,\n * the items container defaults to `flex flex-col gap-3` plus the `justify-*` class\n * driven by the `alignment` property.\n *\n *   <schmancy-navigation-rail class=\"grid gap-2\">…</schmancy-navigation-rail>\n *   → items container <div>: `grid gap-2`\n *\n *   <schmancy-navigation-rail>…</schmancy-navigation-rail>\n *   → items container <div>: `flex flex-col gap-3 justify-start`\n *\n * @element schmancy-navigation-rail\n * @slot fab - Slot for a floating action button at the top\n * @slot menu - Slot for a menu icon or button below the FAB\n * @slot header - Custom header content slot\n * @slot footer - Custom footer content slot\n * @slot - Default slot for navigation rail items\n *\n * @fires navigate - When a navigation item is selected\n * @fires menu-click - When the menu button is clicked\n * @fires fab-click - When the FAB is clicked\n *\n * @csspart rail - The main rail container\n * @csspart header - The header section\n * @csspart nav - The navigation scroll region (contains items)\n * @csspart items - The direct layout container for slotted items (inside schmancy-scroll)\n * @csspart footer - The footer section\n *\n * @example\n * <schmancy-navigation-rail activeIndex=\"0\">\n *   <schmancy-button slot=\"fab\" variant=\"filled\" aria-label=\"Compose\">\n *     <schmancy-icon>add</schmancy-icon>\n *   </schmancy-button>\n *   <schmancy-button slot=\"menu\" variant=\"text\" aria-label=\"Menu\">\n *     <schmancy-icon>menu</schmancy-icon>\n *   </schmancy-button>\n *   <schmancy-navigation-rail-item icon=\"home\" label=\"Home\"></schmancy-navigation-rail-item>\n *   <schmancy-navigation-rail-item icon=\"search\" label=\"Search\"></schmancy-navigation-rail-item>\n *   <schmancy-navigation-rail-item icon=\"favorite\" label=\"Favorites\" badge=\"3\"></schmancy-navigation-rail-item>\n *   <schmancy-navigation-rail-item icon=\"settings\" label=\"Settings\"></schmancy-navigation-rail-item>\n * </schmancy-navigation-rail>\n */\n@customElement('schmancy-navigation-rail')\nexport class SchmancyNavigationRail extends SchmancyElement {\n\t// Observable state\n\tprivate activeIndex$ = new BehaviorSubject<number>(-1)\n\n\t// Properties\n\t/**\n\t * The currently active item index\n\t * @default -1\n\t */\n\t@property({ type: Number })\n\tget activeIndex() {\n\t\treturn this.activeIndex$.value\n\t}\n\tset activeIndex(value: number) {\n\t\tthis.activeIndex$.next(value)\n\t}\n\n\t/**\n\t * The currently active item value (for programmatic selection)\n\t */\n\t@property({ type: String })\n\tget activeValue() {\n\t\treturn this._activeValue\n\t}\n\tset activeValue(value: string) {\n\t\tthis._activeValue = value\n\t\tthis.updateActiveByValue(value)\n\t}\n\tprivate _activeValue = ''\n\n\t/**\n\t * When to show labels for navigation items\n\t * 'all' - Always show labels for all items\n\t * 'selected' - Only show label for selected item\n\t * 'none' - Never show labels\n\t * @default 'all'\n\t */\n\t@property({ type: String, attribute: 'label-visibility', reflect: true })\n\tlabelVisibility: LabelVisibility = 'all'\n\n\t/**\n\t * Alignment of navigation items\n\t * @default 'top'\n\t */\n\t@property({ type: String, reflect: true })\n\talignment: 'top' | 'center' | 'bottom' = 'top'\n\n\t/**\n\t * Show tooltips when labels are hidden\n\t * @default true\n\t */\n\t@property({ type: Boolean })\n\tshowTooltips = true\n\n\t/**\n\t * Enable keyboard navigation\n\t * @default true\n\t */\n\t@property({ type: Boolean })\n\tkeyboardNavigation = true\n\n\t/**\n\t * Whether the navigation rail is expanded\n\t * @default false\n\t */\n\t@property({ type: Boolean, reflect: true })\n\texpanded = false\n\n\n\t// State\n\t@state()\n\tprivate focusedIndex = -1\n\n\t@state()\n\tprivate hasHeaderContent = false\n\n\t@state()\n\tprivate isFullscreen = false\n\n\t/**\n\t * Layout-related classes extracted from the host's `class` attribute.\n\t * Forwarded verbatim to the inner `<nav>` element.\n\t * When empty, the nav falls back to the M3 default: `flex flex-col gap-3`.\n\t */\n\t@state()\n\tprivate _hostLayoutClasses = ''\n\n\t// Queries\n\n\t@queryAssignedElements({ flatten: true })\n\tprivate allElements!: Element[]\n\n\tprivate get navigationItems(): SchmancyNavigationRailItem[] {\n\t\treturn this.allElements.filter(el => el.tagName === 'SCHMANCY-NAVIGATION-RAIL-ITEM') as SchmancyNavigationRailItem[]\n\t}\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\n\t\t// Set up keyboard navigation if enabled\n\t\tif (this.keyboardNavigation) {\n\t\t\tthis.addEventListener('keydown', this.handleKeyDown)\n\t\t}\n\n\t\t// Subscribe to active index changes with distinct values only\n\t\tthis.activeIndex$\n\t\t\t.pipe(\n\t\t\t\tdistinctUntilChanged(),\n\t\t\t\ttap(index => this.updateActiveStates(index)),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe()\n\n\t\t// Listen to fullscreen events\n\t\tfromEvent(window, 'fullscreen').pipe(\n\t\t\ttap((event: Event) => {\n\t\t\t\tconst customEvent = event as CustomEvent\n\t\t\t\tthis.isFullscreen = customEvent.detail\n\t\t\t}),\n\t\t\ttakeUntil(this.disconnecting)\n\t\t).subscribe()\n\n\t\t// Watch the host's `class` attribute for layout utilities and forward them\n\t\t// to the inner <nav>. The Observable wraps MutationObserver so teardown is\n\t\t// handled by the existing takeUntil(this.disconnecting) pattern.\n\t\tnew Observable<string>(subscriber => {\n\t\t\tconst extract = () =>\n\t\t\t\tArray.from(this.classList)\n\t\t\t\t\t.filter(c => LAYOUT_CLASS_RE.test(c))\n\t\t\t\t\t.join(' ')\n\n\t\t\tsubscriber.next(extract())\n\n\t\t\tconst mo = new MutationObserver(() => subscriber.next(extract()))\n\t\t\tmo.observe(this, { attributes: true, attributeFilter: ['class'] })\n\t\t\treturn () => mo.disconnect()\n\t\t}).pipe(\n\t\t\tdistinctUntilChanged(),\n\t\t\ttap(layoutClasses => { this._hostLayoutClasses = layoutClasses }),\n\t\t\ttakeUntil(this.disconnecting),\n\t\t).subscribe()\n\n\t\t// Listen for navigate events from child items\n\t\tthis.setupNavigateListener()\n\n\t\t// Set up label visibility\n\t\tthis.updateLabelVisibility()\n\n\t\t// Update ARIA attributes\n\t\tthis.setAttribute('role', 'navigation')\n\t\tthis.setAttribute('aria-label', 'Main navigation')\n\t}\n\n\tupdated(changedProperties: PropertyValues) {\n\t\tsuper.updated(changedProperties)\n\n\t\tif (changedProperties.has('labelVisibility')) {\n\t\t\tthis.updateLabelVisibility()\n\t\t}\n\n\t\tif (changedProperties.has('activeValue')) {\n\t\t\tthis.updateActiveByValue(this.activeValue)\n\t\t}\n\n\t\tif (changedProperties.has('expanded')) {\n\t\t\tthis.updateLabelVisibility()\n\t\t}\n\t}\n\n\tprivate updateActiveStates(index: number) {\n\t\tthis.navigationItems.forEach((item, i) => {\n\t\t\tconst isActive = i === index\n\t\t\titem.active = isActive\n\t\t\titem.setAttribute('aria-selected', String(isActive))\n\t\t\titem.setAttribute('tabindex', isActive ? '0' : '-1')\n\n\t\t\t// Update activeValue when index changes\n\t\t\tif (isActive) {\n\t\t\t\tthis._activeValue = item.value || item.label || ''\n\t\t\t}\n\t\t})\n\t}\n\n\tprivate updateActiveByValue(value: string) {\n\t\tconst index = this.navigationItems.findIndex(item => item.getAttribute('value') === value || item.label === value)\n\t\tif (index >= 0) {\n\t\t\tthis.activeIndex = index\n\t\t}\n\t}\n\n\tprivate updateLabelVisibility() {\n\t\tthis.navigationItems.forEach((item, i) => {\n\t\t\tlet shouldShowLabel = false\n\n\t\t\t// M3 Spec: In expanded state, always show all labels\n\t\t\tif (this.expanded) {\n\t\t\t\tshouldShowLabel = true\n\t\t\t} else {\n\t\t\t\t// In collapsed state, respect labelVisibility setting\n\t\t\t\tshouldShowLabel =\n\t\t\t\t\tthis.labelVisibility === 'all' || (this.labelVisibility === 'selected' && i === this.activeIndex)\n\t\t\t}\n\n\t\t\titem.showLabel = shouldShowLabel\n\n\t\t\t// Add tooltips when labels are hidden (only in collapsed state)\n\t\t\tif (this.showTooltips && !shouldShowLabel && !this.expanded && item.label) {\n\t\t\t\titem.setAttribute('title', item.label)\n\t\t\t} else {\n\t\t\t\titem.removeAttribute('title')\n\t\t\t}\n\t\t})\n\t}\n\n\t// Note: Hover-based label showing removed for M3 compliance\n\t// Labels are now controlled via labelVisibility property and expanded state\n\n\t/**\n\t * Programmatically expand the navigation rail\n\t */\n\texpand() {\n\t\tthis.expanded = true\n\t}\n\n\t/**\n\t * Programmatically collapse the navigation rail\n\t */\n\tcollapse() {\n\t\tthis.expanded = false\n\t}\n\n\t/**\n\t * Add a boat item to the navigation rail\n\t * @param config Configuration for the boat item\n\t * @returns The created or existing navigation rail item element\n\t */\n\tpublic addBoatItem(config: { id: string; title: string; icon?: string }) {\n\t\t// Check if item already exists\n\t\tconst existingItem = this.querySelector(`[value=\"${config.id}\"]`) as HTMLElement\n\t\tif (existingItem) {\n\t\t\t// Item already exists, just return it\n\t\t\treturn existingItem\n\t\t}\n\n\t\t// Create new item\n\t\tconst item = document.createElement('schmancy-navigation-rail-item')\n\t\titem.setAttribute('value', config.id)\n\t\titem.innerHTML = `\n\t\t\t<schmancy-icon slot=\"icon\">${config.icon || 'widgets'}</schmancy-icon>\n\t\t\t${config.title}\n\t\t`\n\t\t// Add to the rail before any footer content\n\t\tconst footer = this.querySelector('[slot=\"footer\"]')\n\t\tif (footer) {\n\t\t\tthis.insertBefore(item, footer)\n\t\t} else {\n\t\t\tthis.appendChild(item)\n\t\t}\n\t\treturn item\n\t}\n\n\t/**\n\t * Toggle the navigation rail between expanded and collapsed states\n\t */\n\ttoggle() {\n\t\tthis.expanded = !this.expanded\n\t}\n\n\n\tprivate handleKeyDown(event: KeyboardEvent) {\n\t\tconst items = this.navigationItems\n\t\tif (items.length === 0) return\n\n\t\tlet newIndex = this.focusedIndex >= 0 ? this.focusedIndex : this.activeIndex\n\n\t\tswitch (event.key) {\n\t\t\tcase 'ArrowDown':\n\t\t\t\tevent.preventDefault()\n\t\t\t\tnewIndex = (newIndex + 1) % items.length\n\t\t\t\tbreak\n\t\t\tcase 'ArrowUp':\n\t\t\t\tevent.preventDefault()\n\t\t\t\tnewIndex = newIndex <= 0 ? items.length - 1 : newIndex - 1\n\t\t\t\tbreak\n\t\t\tcase 'Home':\n\t\t\t\tevent.preventDefault()\n\t\t\t\tnewIndex = 0\n\t\t\t\tbreak\n\t\t\tcase 'End':\n\t\t\t\tevent.preventDefault()\n\t\t\t\tnewIndex = items.length - 1\n\t\t\t\tbreak\n\t\t\tcase 'Enter':\n\t\t\tcase ' ':\n\t\t\t\tevent.preventDefault()\n\t\t\t\tif (newIndex >= 0) {\n\t\t\t\t\titems[newIndex].click()\n\t\t\t\t}\n\t\t\t\treturn\n\t\t\tdefault:\n\t\t\t\treturn\n\t\t}\n\n\t\tthis.focusedIndex = newIndex\n\t\titems[newIndex].focus()\n\t}\n\n\tprivate handleFabClick(event: Event) {\n\t\tevent.stopPropagation()\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('fab-click', {\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\t}\n\n\tprivate handleMenuClick(event: Event) {\n\t\tevent.stopPropagation()\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('menu-click', {\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}),\n\t\t)\n\t}\n\n\tprotected render() {\n\t\t// Host-level classes for the navigation rail (width, visibility, z-index).\n\t\t// Layout utilities the author placed on the host are NOT included here —\n\t\t// they are forwarded to the inner <nav> via _hostLayoutClasses instead.\n\t\tconst hostClasses = this.classMap({\n\t\t\t// Layout & Structure - Fixed width to prevent layout shift\n\t\t\t'flex flex-col': true,\n\t\t\t'h-full': true,\n\t\t\t'box-border relative overflow-visible': true,\n\t\t\t'z-10 hover:z-[100]': true, // Base z-index, elevated on hover for overlay\n\n\t\t\t// Width - collapses to 0 when fullscreen\n\t\t\t'w-20': !this.isFullscreen, // w-20 = 80px fixed width (M3 spec: 80dp)\n\t\t\t'w-0': this.isFullscreen, // Collapse width to 0 in fullscreen\n\n\t\t\t// Visibility and transition\n\t\t\t'transition-all duration-300 ease-emphasized': true,\n\t\t\t'opacity-100': !this.isFullscreen,\n\t\t\t'opacity-0 pointer-events-none': this.isFullscreen,\n\t\t\t'overflow-hidden': this.isFullscreen, // Hide overflow when collapsed\n\t\t})\n\n\t\t// Rail container - programmatically controlled width\n\t\tconst railClasses = this.classMap({\n\t\t\t// Layout & Structure\n\t\t\t'flex flex-col h-full': true,\n\t\t\t'box-border relative': true,\n\n\t\t\t// M3 Colors & Theme\n\t\t\t'bg-container-lowest text-surface-on': true,\n\n\t\t\t// M3 Motion - smooth transitions for width and shadow\n\t\t\t'transition-all duration-300 ease-emphasized': true,\n\n\t\t\t// Collapsed state (default) - M3 standard 80px width\n\t\t\t'w-20': !this.expanded, // w-20 = 80px (M3 spec: 80dp)\n\t\t\t'px-3': !this.expanded, // px-3 = 12px (M3 spec: 12px to center 56px items)\n\n\t\t\t// Expanded state - M3 expanded width with shadow\n\t\t\t'w-60': this.expanded, // w-60 = 240px expanded width\n\t\t\t'px-4': this.expanded, // Larger padding when expanded\n\t\t\t'shadow-lg': this.expanded, // M3 elevation 3 shadow when expanded\n\t\t})\n\n\t\t// Header section classes - hidden when no content\n\t\tconst headerClasses = this.classMap({\n\t\t\t'flex flex-col items-center gap-1': true,\n\t\t\t'hidden': !this.hasHeaderContent,\n\t\t})\n\n\t\t// Navigation container <nav> — holds a single <schmancy-scroll> child, so only\n\t\t// vertical fill classes belong here. Layout of the items themselves lives on the\n\t\t// inner <div part=\"items\"> so that the items' flat-tree parent is that div, not nav.\n\t\tconst navClasses = this.classMap({\n\t\t\t'flex-1': true,\n\t\t\t'min-h-0': true, // Allow flex shrinking and proper scroll container height calculation\n\t\t})\n\n\t\t// Items container <div> — the direct flat-tree parent of slotted navigation items\n\t\t// after re-slotting through <schmancy-scroll>. Layout utilities forwarded from the\n\t\t// host land here so that `grid gap-2` (or any other layout) actually shapes items.\n\t\t// When the host carries no layout classes, default to M3 flex-column + alignment.\n\t\tconst hasHostLayout = this._hostLayoutClasses.length > 0\n\t\tconst itemsContainerClasses = hasHostLayout\n\t\t\t? this._hostLayoutClasses\n\t\t\t: this.classMap({\n\t\t\t\t\t'flex flex-col gap-3': true,\n\t\t\t\t\t'justify-start': this.alignment === 'top',\n\t\t\t\t\t'justify-center': this.alignment === 'center',\n\t\t\t\t\t'justify-end': this.alignment === 'bottom',\n\t\t\t\t})\n\n\t\t// Footer section classes\n\t\tconst footerClasses = this.classMap({\n\t\t\t'flex flex-col items-center gap-1 mt-auto pt-2': true,\n\t\t})\n\n\t\treturn html`\n\t\t\t<div\n\t\t\t\tclass=${hostClasses}\n\t\t\t>\n\t\t\t\t<div class=${railClasses} part=\"rail\">\n\t\t\t\t\t<div class=${headerClasses} part=\"header\">\n\t\t\t\t\t\t<slot name=\"fab\" @click=${this.handleFabClick} @slotchange=${this.handleHeaderSlotChange}></slot>\n\t\t\t\t\t\t<slot name=\"menu\" @click=${this.handleMenuClick} @slotchange=${this.handleHeaderSlotChange}></slot>\n\t\t\t\t\t\t<slot name=\"header\" @slotchange=${this.handleHeaderSlotChange}></slot>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<nav class=${navClasses} part=\"nav\" role=\"list\">\n\t\t\t\t\t\t<schmancy-scroll hide direction=\"vertical\">\n\t\t\t\t\t\t\t<div class=${itemsContainerClasses} part=\"items\">\n\t\t\t\t\t\t\t\t<slot @slotchange=${this.handleSlotChange}></slot>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</schmancy-scroll>\n\t\t\t\t\t</nav>\n\n\t\t\t\t\t<div class=${footerClasses} part=\"footer\">\n\t\t\t\t\t\t<slot name=\"footer\"></slot>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t`\n\t}\n\n\tprivate setupNavigateListener() {\n\t\t// Listen for navigate events from child items\n\t\tthis.addEventListener('navigate', (e: Event) => {\n\t\t\tif (e instanceof CustomEvent) {\n\t\t\t\tconst value = e.detail\n\t\t\t\t// Find the item that dispatched the event and update active state\n\t\t\t\tconst itemIndex = this.navigationItems.findIndex(item => item.value === value || item.label === value)\n\t\t\t\tif (itemIndex >= 0) {\n\t\t\t\t\tthis.activeIndex = itemIndex\n\t\t\t\t\tthis._activeValue = value\n\t\t\t\t}\n\t\t\t}\n\t\t})\n\t}\n\n\tprivate handleHeaderSlotChange() {\n\t\t// Check if any header slot has content\n\t\tconst headerDiv = this.shadowRoot?.querySelector('[part=\"header\"]')\n\t\tif (headerDiv) {\n\t\t\tconst allSlots = headerDiv.querySelectorAll('slot')\n\t\t\tthis.hasHeaderContent = Array.from(allSlots).some(s =>\n\t\t\t\ts.assignedNodes({ flatten: true }).length > 0\n\t\t\t)\n\t\t}\n\t}\n\n\tprivate handleSlotChange() {\n\t\t// Update items when slot content changes\n\t\tthis.updateLabelVisibility()\n\t\tthis.updateActiveStates(this.activeIndex)\n\n\t\t// Set ARIA attributes on items\n\t\tthis.navigationItems.forEach((item, index) => {\n\t\t\titem.setAttribute('role', 'listitem')\n\t\t\tif (!item.hasAttribute('tabindex')) {\n\t\t\t\titem.setAttribute('tabindex', index === this.activeIndex ? '0' : '-1')\n\t\t\t}\n\t\t})\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-navigation-rail': SchmancyNavigationRail\n\t}\n}\n"],"mappings":"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"}