@aceshooting/lyra-ui 4.1.0 → 5.0.0

package/dist/components/layout/app-rail/app-rail.class.js

@@ -0,0 +1,600 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html, nothing, svg } from 'lit';
+import { property, query, state } from 'lit/decorators.js';
+import { LyraElement } from '../../../internal/lyra-element.js';
+import { activateOverlay } from '../../../internal/overlay-manager.js';
+import { lockScroll } from '../../../internal/scroll-lock.js';
+import { nextId } from '../../../internal/a11y.js';
+import { closeIcon } from '../../../internal/icons.js';
+import { tag } from '../../../internal/prefix.js';
+import { isRtl } from '../../../internal/rtl.js';
+import { finiteRange } from '../../../internal/numbers.js';
+import { styles } from './app-rail.styles.js';
+import './app-rail-item.class.js';
+// icons.ts has no hamburger/menu glyph and this component must not modify
+// that shared module -- inlined here instead, matching its 24x24
+// viewBox/stroke-width/currentColor convention so it reads as part of the
+// same icon set.
+function menuIcon() {
+    return svg `
+    <svg
+      width="1em"
+      height="1em"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      stroke-width="1.75"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+      aria-hidden="true"
+      focusable="false"
+    >
+      <line x1="4" y1="7" x2="20" y2="7"></line>
+      <line x1="4" y1="12" x2="20" y2="12"></line>
+      <line x1="4" y1="17" x2="20" y2="17"></line>
+    </svg>
+  `;
+}
+/**
+ * Pure breakpoint-to-mode resolver, kept separate from the `matchMedia`
+ * wiring below so it's directly unit-testable without resizing a real
+ * browser window. `mobileMatches` wins over everything else when true (the
+ * viewport is narrower than both breakpoints at once); otherwise
+ * `preferredMode` (when set) wins over `iconOnlyMatches` — a manual
+ * preference for the full/icon-only axis specifically, while the mobile
+ * breakpoint continues to be tracked automatically regardless.
+ */
+export function computeAppRailMode(iconOnlyMatches, mobileMatches, preferredMode) {
+    if (mobileMatches)
+        return 'mobile';
+    if (preferredMode)
+        return preferredMode;
+    if (iconOnlyMatches)
+        return 'icon-only';
+    return 'full';
+}
+/**
+ * `<lr-app-rail>` — a responsive navigation rail that adapts across three
+ * presentations as the *viewport* narrows (not this element's own inline
+ * size — see the `mode` accessor doc for why): `'full'` (nav items show
+ * icon + label, inline), `'icon-only'` (a narrower inline rail, icons only),
+ * and `'mobile'` (hidden behind a toggle button; opening it shows a
+ * focus-trapped floating overlay over the page).
+ *
+ * Breakpoints are viewport-width `matchMedia()` queries against
+ * `icon-only-breakpoint`/`mobile-breakpoint`, not a `ResizeObserver` on this
+ * element — a nav rail's presentation should track the actual device/window
+ * width the way a native OS shell's navigation does, not however much
+ * horizontal space a particular layout happens to give it.
+ *
+ * The `'mobile'` state participates in the library's shared overlay stack,
+ * which supplies focus trapping, Escape/backdrop dismissal, inerting, and
+ * focus restoration without nesting a `<lr-dialog>` in this component's
+ * shadow template. `[part="base"]` (the inline
+ * `'full'`/`'icon-only'` presentation) and `[part="panel"]` (the mobile
+ * overlay) are the *same* element promoted in place across modes (mirrors
+ * `<lr-widget>`'s fullscreen mode) — never both at once, and never two
+ * separate copies of the slotted content, which slot projection can't
+ * produce anyway (a light-DOM node is only ever assigned to one `<slot>`).
+ * It's a plain `<div>` with an explicit `role="navigation"` rather than a
+ * literal `<nav>` tag: a `<nav>`'s implicit role can't be overridden to
+ * `role="dialog"` while the overlay is modal without an `aria-allowed-role`
+ * violation (verified against axe), whereas an explicit `role="navigation"`
+ * on a generic element can be swapped for `role="dialog"` freely.
+ *
+ * @customElement lr-app-rail
+ * @slot - Nav items. Use `<lr-app-rail-item>` for the explicit icon/label
+ *   contract that automatically hides labels in `'icon-only'` mode. Generic
+ *   links and buttons remain supported, but their compact presentation is the
+ *   consumer's responsibility. While the mobile overlay is open, clicking
+ *   anywhere inside this slot closes it.
+ * @slot header - Logo/brand content, shown above the nav items in every mode.
+ * @slot footer - A trailing user/settings trigger, shown below the nav items.
+ * @event lr-mode-change - The effective mode changed, whether from a
+ *   breakpoint crossing or an explicit `mode` assignment. Not fired for a
+ *   redundant reassignment to the mode already in effect.
+ *   `detail: AppRailModeChangeDetail`.
+ * @event lr-toggle - The mobile overlay opened or closed — via the
+ *   built-in toggle button, Escape, a backdrop click, a nav-item click while
+ *   open, or a breakpoint/forced mode change leaving `'mobile'` while open.
+ *   Not fired when a consumer sets `open` directly (mirrors `<lr-dialog>`'s
+ *   `open`/`close()` split). `detail: AppRailToggleDetail`.
+ * @event lr-rail-resize - The `resizable` rail's width changed via drag or keyboard stepping.
+ *   Not fired when a consumer sets `railWidthPx` directly. `detail: AppRailResizeDetail`.
+ * @csspart base - The rail root while inline (`'full'`/`'icon-only'` modes).
+ * @csspart header - The wrapper around the `header` slot.
+ * @csspart nav - The wrapper around the default (nav items) slot.
+ * @csspart footer - The wrapper around the `footer` slot.
+ * @csspart toggle - The mobile hamburger/close toggle button. Hidden via
+ *   CSS outside `'mobile'` mode, or entirely via `hideToggle`.
+ * @csspart backdrop - The mobile overlay's scrim. Only rendered while open.
+ * @csspart panel - The mobile overlay's floating panel — see the class doc
+ *   for why it's the same element as `base`, never both at once.
+ * @csspart resizer - The `resizable` opt-in's drag handle -- its interactive hit target, sized to
+ *   the shared minimum tappable size (`--lr-icon-button-size`), independent of the slimmer
+ *   visible line rendered by its `resizer-track` child. Only rendered while `resizable` and `mode`
+ *   is `'full'`.
+ * @csspart resizer-track - The resizer's slim visible drag line, centered inside `[part="resizer"]`'s
+ *   larger hit target (mirrors `<lr-swatch-picker>`'s `[part="swatch"]`/`[part="swatch-fill"]`
+ *   split). Colors on hover/focus the same way the whole handle previously did.
+ *
+ * @example
+ * Use the item contract so the visible label collapses while its accessible
+ * name remains available:
+ * ```html
+ * <lr-app-rail>
+ *   <lr-app-rail-item href="/inbox" aria-label="Inbox">
+ *     <svg slot="icon" aria-hidden="true">...</svg>Inbox
+ *   </lr-app-rail-item>
+ * </lr-app-rail>
+ * ```
+ */
+export class LyraAppRail extends LyraElement {
+    constructor() {
+        super(...arguments);
+        /** Below this viewport width, the rail switches from `'full'` to
+         *  `'icon-only'`. Any valid CSS length, used directly in a `max-width`
+         *  media query. */
+        this.iconOnlyBreakpoint = '960px';
+        /** Below this viewport width, the rail switches from `'icon-only'` to
+         *  `'mobile'`. Should be smaller than `iconOnlyBreakpoint` to produce all
+         *  three states as the viewport narrows. */
+        this.mobileBreakpoint = '600px';
+        /** Whether the mobile floating overlay is shown. Only meaningful while
+         *  `mode` is `'mobile'` — the value is preserved (not reset) while another
+         *  mode is active, but no overlay chrome renders until `mode` is
+         *  `'mobile'` again. Set this directly, or use the built-in toggle button
+         *  — there is no separate `show()`/`hide()` pair. */
+        this.open = false;
+        /** Accessible name for the rail's navigation landmark, and for its dialog
+         *  role while the mobile overlay is open. A host-level `aria-label`
+         *  attribute takes precedence over this when both are set -- see
+         *  `accessibleLabel`. */
+        this.label = 'Navigation';
+        /** Accessible name overriding `label` (and its localized default) for the nav landmark / dialog
+         *  role, mirroring `<lr-date-input>`'s `accessibleLabel` pattern. Reads the host's own
+         *  `aria-label` attribute -- unset (the default, `null`) reproduces today's exact
+         *  `label`/localized-default output. */
+        this.accessibleLabel = null;
+        /** Suppresses the built-in mobile `[part='toggle']` hamburger/close button entirely -- for a
+         *  consumer that already owns an external mobile-menu toggle wired to this rail's own `open`
+         *  property. `false` (the default) reproduces today's exact output; note `open` still has no
+         *  built-in external trigger of its own once this is set, since `lr-toggle` only fires from the
+         *  toggle button being removed. */
+        this.hideToggle = false;
+        /** Opts a continuously draggable width in for the `'full'` state — exposes a `[part="resizer"]`
+         *  handle (pointer-drag and `ArrowLeft`/`ArrowRight` keyboard stepping, RTL-aware) clamped to
+         *  `[minRailWidthPx, maxRailWidthPx]`. No built-in persistence — a consumer that wants the
+         *  chosen width to survive a reload should listen for `lr-rail-resize` and persist `widthPx`
+         *  itself. `false` (the default) renders no resizer and leaves the fixed-width
+         *  `--lr-app-rail-width` CSS token exactly as before this property existed. */
+        this.resizable = false;
+        /** Minimum `railWidthPx` a drag/keyboard resize can reach. */
+        this.minRailWidthPx = 190;
+        /** Maximum `railWidthPx` a drag/keyboard resize can reach. */
+        this.maxRailWidthPx = 440;
+        /** `true` for the duration of an active pointer-driven resize drag (not a keyboard step) --
+         *  reflected so a consumer (or this component's own styles) can suppress `[part='base']`'s
+         *  `transition: inline-size` during the drag, which otherwise visibly "chases" the pointer
+         *  instead of tracking it 1:1. Read-only in practice (this component owns the transitions), but
+         *  a plain reactive property like every other reflected boolean here. */
+        this.dragging = false;
+        this.hasHeaderSlot = false;
+        this.hasFooterSlot = false;
+        this._mode = 'full';
+        // Whether matchMedia changes are currently ignored because a consumer
+        // forced a specific mode -- see the `mode` accessor doc.
+        this.forced = false;
+        this.iconOnlyMatches = false;
+        this.mobileMatches = false;
+        // Derived from mode === 'mobile' && open -- tracked as its own field
+        // (rather than recomputed inline everywhere) so willUpdate can detect the
+        // specific false->true/true->false transition regardless of which of the
+        // two source properties changed.
+        this.overlayActive = false;
+        this.justOpened = false;
+        this.navId = nextId('app-rail-nav');
+        this.resizeStartX = 0;
+        this.resizeStartWidth = 0;
+        // Split into two single-query listeners (rather than one shared handler
+        // reading both live MediaQueryLists) specifically so a test can invoke
+        // either directly with a fabricated { matches } event -- exercising the
+        // full breakpoint-response wiring without needing to actually resize the
+        // browser window a test runs in.
+        this.onIconOnlyChange = (e) => {
+            this.iconOnlyMatches = e.matches;
+            if (!this.forced)
+                this.applyComputedMode();
+        };
+        this.onMobileChange = (e) => {
+            this.mobileMatches = e.matches;
+            if (!this.forced)
+                this.applyComputedMode();
+        };
+        this.onToggleClick = (e) => {
+            if (!this.open)
+                this.explicitTrigger = e.currentTarget;
+            this.setOpen(!this.open);
+        };
+        this.onBackdropClick = () => {
+            this.overlayHandle?.dismissBackdrop();
+        };
+        // See the default-slot @slot doc -- any click inside the nav items while
+        // the overlay is open closes it, without trying to distinguish a real
+        // navigation trigger from incidental slotted content.
+        this.onNavItemClick = () => {
+            if (this.overlayActive)
+                this.setOpen(false);
+        };
+        this.onHeaderSlotChange = (e) => {
+            this.hasHeaderSlot = e.target.assignedElements({ flatten: true }).length > 0;
+        };
+        this.onFooterSlotChange = (e) => {
+            this.hasFooterSlot = e.target.assignedElements({ flatten: true }).length > 0;
+        };
+        this.onNavSlotChange = () => {
+            this.syncSlottedItems();
+        };
+        this.onResizerPointerDown = (e) => {
+            this.resizePointerId = e.pointerId;
+            this.resizeStartX = e.clientX;
+            this.resizeStartWidth = this.effectiveRailWidthPx;
+            e.target.setPointerCapture(e.pointerId);
+            window.addEventListener('pointermove', this.onResizerPointerMove);
+            window.addEventListener('pointerup', this.onResizerPointerUp);
+            window.addEventListener('pointercancel', this.onResizerPointerUp);
+            window.addEventListener('lostpointercapture', this.onResizerPointerUp);
+            this.dragging = true;
+        };
+        this.onResizerPointerMove = (e) => {
+            if (e.pointerId !== this.resizePointerId)
+                return;
+            let delta = e.clientX - this.resizeStartX;
+            if (isRtl(this))
+                delta = -delta;
+            const next = Math.min(this.safeMaxRailWidthPx, Math.max(this.safeMinRailWidthPx, this.resizeStartWidth + delta));
+            this.railWidthPx = next;
+            this.emit('lr-rail-resize', { widthPx: next });
+        };
+        this.onResizerPointerUp = (e) => {
+            if (e.pointerId !== this.resizePointerId)
+                return;
+            this.resizePointerId = undefined;
+            this.dragging = false;
+            window.removeEventListener('pointermove', this.onResizerPointerMove);
+            window.removeEventListener('pointerup', this.onResizerPointerUp);
+            window.removeEventListener('pointercancel', this.onResizerPointerUp);
+            window.removeEventListener('lostpointercapture', this.onResizerPointerUp);
+        };
+        this.onResizerKeyDown = (e) => {
+            const rtl = isRtl(this);
+            const forwardKey = rtl ? 'ArrowLeft' : 'ArrowRight';
+            const backwardKey = rtl ? 'ArrowRight' : 'ArrowLeft';
+            const step = 8;
+            if (e.key === forwardKey) {
+                e.preventDefault();
+                const next = Math.min(this.safeMaxRailWidthPx, this.effectiveRailWidthPx + step);
+                this.railWidthPx = next;
+                this.emit('lr-rail-resize', { widthPx: next });
+            }
+            else if (e.key === backwardKey) {
+                e.preventDefault();
+                const next = Math.max(this.safeMinRailWidthPx, this.effectiveRailWidthPx - step);
+                this.railWidthPx = next;
+                this.emit('lr-rail-resize', { widthPx: next });
+            }
+        };
+    }
+    static { this.styles = [LyraElement.styles, styles]; }
+    // `mode` needs a custom accessor (force/auto semantics below) rather than
+    // the usual @property()-generated one -- registered here, alongside the
+    // decorator-declared properties below, the same way lr-model-select's
+    // form-associated `value` accessor is. `reflect: true` still applies:
+    // LitElement's update loop reflects any `reflect`-flagged property to its
+    // attribute generically by reading `this[name]` after render, regardless
+    // of whether that property has a custom or auto-generated accessor.
+    static { this.properties = {
+        mode: { reflect: true, noAccessor: true },
+    }; }
+    syncSlottedItems() {
+        const slot = this.shadowRoot?.querySelector('[part="nav"] > slot');
+        for (const item of slot?.assignedElements({ flatten: true }) ?? []) {
+            if (item.localName === tag('app-rail-item')) {
+                item.toggleAttribute('icon-only', this._mode === 'icon-only');
+            }
+        }
+    }
+    /**
+     * The rail's current effective presentation. Always one of the three real
+     * modes — never `'auto'` — reflecting either the live breakpoint match or,
+     * once forced, whatever was last assigned.
+     *
+     * Assigning `'full'`/`'icon-only'`/`'mobile'` forces that mode and stops
+     * this element from responding to `icon-only-breakpoint`/
+     * `mobile-breakpoint` matches. Assigning the sentinel `'auto'` releases
+     * the force and immediately re-syncs to the current viewport width,
+     * resuming automatic tracking. `'auto'` is a write-only instruction, not a
+     * value this getter ever returns — there is no way to observe "currently
+     * forced" from the property itself.
+     */
+    get mode() {
+        return this._mode;
+    }
+    set mode(next) {
+        if (next === 'auto') {
+            if (!this.forced)
+                return;
+            this.forced = false;
+            this.applyComputedMode();
+            return;
+        }
+        if (next !== 'full' && next !== 'icon-only' && next !== 'mobile')
+            return;
+        this.forced = true;
+        this.setEffectiveMode(next);
+    }
+    /** `minRailWidthPx` normalized to a finite, non-negative px floor -- an invalid attribute value
+     *  would otherwise poison every `Math.min(maxRailWidthPx, Math.max(minRailWidthPx, ...))` clamp
+     *  below (both the drag and keyboard-step handlers) and the resizer's own `aria-valuemin`. */
+    get safeMinRailWidthPx() {
+        return finiteRange(this.minRailWidthPx, 190, 0);
+    }
+    /** `maxRailWidthPx` normalized the same way, then cross-referenced against the already-sanitized
+     *  minimum so an inverted/invalid pair (e.g. `maxRailWidthPx` left below a since-raised
+     *  `minRailWidthPx`) can never produce a negative-width clamp range. */
+    get safeMaxRailWidthPx() {
+        return Math.max(this.safeMinRailWidthPx, finiteRange(this.maxRailWidthPx, 440, 0));
+    }
+    /** The rail's current effective width in px, whether or not `railWidthPx` has ever been
+     *  explicitly set — falls back to the live measured width of `[part=base]` so the resizer's
+     *  `aria-valuenow` and the first drag/keyboard step's start-width reflect the real rendered
+     *  width even before a consumer ever sets `railWidthPx`. A set `railWidthPx` is clamped into
+     *  `[safeMinRailWidthPx, safeMaxRailWidthPx]` here -- a NaN/negative/out-of-bounds direct
+     *  assignment would otherwise reach `updated()`'s inline-size write and this resizer's own
+     *  `aria-valuenow` exactly as given. */
+    get effectiveRailWidthPx() {
+        if (this.railWidthPx != null) {
+            return finiteRange(this.railWidthPx, this.safeMinRailWidthPx, this.safeMinRailWidthPx, this.safeMaxRailWidthPx);
+        }
+        return this.baseEl?.getBoundingClientRect().width ?? 240;
+    }
+    willUpdate(changed) {
+        if (!this.hasUpdated) {
+            this.hasHeaderSlot = Array.from(this.children).some((el) => el.getAttribute('slot') === 'header');
+            this.hasFooterSlot = Array.from(this.children).some((el) => el.getAttribute('slot') === 'footer');
+        }
+        if (this.hasUpdated && (changed.has('iconOnlyBreakpoint') || changed.has('mobileBreakpoint'))) {
+            this.teardownMediaQueries();
+            this.setupMediaQueries();
+        }
+        if (this.hasUpdated && changed.has('preferredMode') && !this.forced) {
+            this.applyComputedMode();
+        }
+        if (changed.has('open') || changed.has('mode')) {
+            const next = this._mode === 'mobile' && this.open;
+            if (next !== this.overlayActive) {
+                this.overlayActive = next;
+                if (next) {
+                    this.justOpened = true;
+                    this.activateMobileOverlay();
+                }
+                else {
+                    this.deactivateMobileOverlay();
+                }
+            }
+        }
+    }
+    // Runs after render (not willUpdate) so [part="panel"] and its slotted
+    // content have already landed in the DOM before the focus call below can
+    // rely on them -- mirrors lr-dialog's/lr-widget's identical ordering
+    // rationale.
+    updated(changed) {
+        this.syncSlottedItems();
+        if (this.justOpened) {
+            this.justOpened = false;
+            this.overlayHandle?.focusInitial();
+        }
+        if ((changed.has('railWidthPx') || changed.has('resizable') || changed.has('mode') || !this.hasUpdated) &&
+            this.baseEl) {
+            if (this.resizable && this.railWidthPx != null && this._mode === 'full') {
+                this.baseEl.style.setProperty('inline-size', `${this.effectiveRailWidthPx}px`);
+            }
+            else {
+                this.baseEl.style.removeProperty('inline-size');
+            }
+        }
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.setupMediaQueries();
+        // A reconnect (e.g. a drag-and-drop reparent keeping this same element
+        // instance) fires disconnectedCallback then connectedCallback
+        // synchronously with no update in between, so willUpdate never reruns to
+        // notice the overlay is still active -- restore its shared registration
+        // and scroll lock.
+        if (this.hasUpdated && this._mode === 'mobile' && this.open) {
+            if (this.overlayHandle?.isActive()) {
+                this.overlayHandle.resume();
+            }
+            else {
+                this.activateMobileOverlay();
+            }
+            if (!this.releaseScrollLock)
+                this.releaseScrollLock = lockScroll(this.ownerDocument);
+            queueMicrotask(() => this.overlayHandle?.focusInitial());
+        }
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.teardownMediaQueries();
+        this.releaseScrollLock?.();
+        this.releaseScrollLock = undefined;
+        this.overlayHandle?.suspend();
+        this.dragging = false;
+        this.resizePointerId = undefined;
+        window.removeEventListener('pointermove', this.onResizerPointerMove);
+        window.removeEventListener('pointerup', this.onResizerPointerUp);
+        window.removeEventListener('pointercancel', this.onResizerPointerUp);
+        window.removeEventListener('lostpointercapture', this.onResizerPointerUp);
+    }
+    activateMobileOverlay() {
+        this.releaseScrollLock ??= lockScroll(this.ownerDocument);
+        this.overlayHandle = activateOverlay({
+            host: this,
+            panel: () => this.shadowRoot?.querySelector('[part="panel"]') ?? null,
+            onEscape: () => this.setOpen(false),
+            onBackdrop: () => this.setOpen(false),
+            restoreFocusTo: this.explicitTrigger,
+        });
+        this.explicitTrigger = undefined;
+    }
+    deactivateMobileOverlay() {
+        this.releaseScrollLock?.();
+        this.releaseScrollLock = undefined;
+        this.overlayHandle?.deactivate();
+        this.overlayHandle = undefined;
+    }
+    setupMediaQueries() {
+        const view = this.ownerDocument.defaultView;
+        if (!view?.matchMedia)
+            return;
+        this.mqIconOnly = view.matchMedia(`(max-width: ${this.iconOnlyBreakpoint})`);
+        this.mqMobile = view.matchMedia(`(max-width: ${this.mobileBreakpoint})`);
+        this.mqIconOnly.addEventListener('change', this.onIconOnlyChange);
+        this.mqMobile.addEventListener('change', this.onMobileChange);
+        this.iconOnlyMatches = this.mqIconOnly.matches;
+        this.mobileMatches = this.mqMobile.matches;
+        if (!this.forced)
+            this.applyComputedMode();
+    }
+    teardownMediaQueries() {
+        this.mqIconOnly?.removeEventListener('change', this.onIconOnlyChange);
+        this.mqMobile?.removeEventListener('change', this.onMobileChange);
+        this.mqIconOnly = undefined;
+        this.mqMobile = undefined;
+    }
+    applyComputedMode() {
+        this.setEffectiveMode(computeAppRailMode(this.iconOnlyMatches, this.mobileMatches, this.preferredMode));
+    }
+    setEffectiveMode(next) {
+        if (this._mode === next)
+            return;
+        const old = this._mode;
+        this._mode = next;
+        this.requestUpdate('mode', old);
+        this.emit('lr-mode-change', { mode: next });
+        // 'open' is only meaningful in 'mobile' mode -- leaving it while open
+        // closes the overlay as a side effect (through setOpen, so it still
+        // emits lr-toggle and releases the scroll lock/focus trap normally)
+        // rather than leaving a now-invisible overlay primed to reappear the
+        // next time mode returns to 'mobile'.
+        if (next !== 'mobile' && this.open)
+            this.setOpen(false);
+    }
+    setOpen(next) {
+        if (this.open === next)
+            return;
+        this.open = next;
+        this.emit('lr-toggle', { open: next });
+    }
+    render() {
+        const mobile = this._mode === 'mobile';
+        return html `
+      <button
+        part="toggle"
+        type="button"
+        aria-expanded=${this.open ? 'true' : 'false'}
+        aria-controls=${this.navId}
+        aria-label=${this.open ? this.localize('closeNavigation') : this.localize('openNavigation')}
+        @click=${this.onToggleClick}
+      >
+        ${this.open ? closeIcon() : menuIcon()}
+      </button>
+      ${mobile && this.open ? html `<div part="backdrop" @click=${this.onBackdropClick}></div>` : nothing}
+      <div
+        id=${this.navId}
+        part=${mobile ? 'panel' : 'base'}
+        aria-label=${this.accessibleLabel ?? this.localize('navigation', this.label === 'Navigation' ? undefined : this.label)}
+        role=${this.overlayActive ? 'dialog' : 'navigation'}
+        aria-modal=${this.overlayActive ? 'true' : nothing}
+        tabindex=${this.overlayActive ? '-1' : nothing}
+        ?inert=${mobile && !this.open}
+      >
+        <div part="header" ?hidden=${!this.hasHeaderSlot}>
+          <slot name="header" @slotchange=${this.onHeaderSlotChange}></slot>
+        </div>
+        <div part="nav">
+          <slot @slotchange=${this.onNavSlotChange} @click=${this.onNavItemClick}></slot>
+        </div>
+        <div part="footer" ?hidden=${!this.hasFooterSlot}>
+          <slot name="footer" @slotchange=${this.onFooterSlotChange}></slot>
+        </div>
+      </div>
+      ${this.resizable && this._mode === 'full'
+            ? html `<div
+            part="resizer"
+            role="separator"
+            aria-orientation="vertical"
+            aria-label=${this.localize('resizeNavigation')}
+            aria-valuenow=${Math.round(this.effectiveRailWidthPx)}
+            aria-valuemin=${this.safeMinRailWidthPx}
+            aria-valuemax=${this.safeMaxRailWidthPx}
+            tabindex="0"
+            @pointerdown=${this.onResizerPointerDown}
+            @keydown=${this.onResizerKeyDown}
+          ><span part="resizer-track"></span></div>`
+            : nothing}
+    `;
+    }
+}
+__decorate([
+    property({ attribute: 'icon-only-breakpoint' })
+], LyraAppRail.prototype, "iconOnlyBreakpoint", void 0);
+__decorate([
+    property({ attribute: 'mobile-breakpoint' })
+], LyraAppRail.prototype, "mobileBreakpoint", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], LyraAppRail.prototype, "open", void 0);
+__decorate([
+    property()
+], LyraAppRail.prototype, "label", void 0);
+__decorate([
+    property({ attribute: 'aria-label' })
+], LyraAppRail.prototype, "accessibleLabel", void 0);
+__decorate([
+    property({ attribute: 'preferred-mode' })
+], LyraAppRail.prototype, "preferredMode", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: 'hide-toggle' })
+], LyraAppRail.prototype, "hideToggle", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], LyraAppRail.prototype, "resizable", void 0);
+__decorate([
+    property({ type: Number, attribute: 'rail-width-px' })
+], LyraAppRail.prototype, "railWidthPx", void 0);
+__decorate([
+    property({ type: Number, attribute: 'min-rail-width-px' })
+], LyraAppRail.prototype, "minRailWidthPx", void 0);
+__decorate([
+    property({ type: Number, attribute: 'max-rail-width-px' })
+], LyraAppRail.prototype, "maxRailWidthPx", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], LyraAppRail.prototype, "dragging", void 0);
+__decorate([
+    state()
+], LyraAppRail.prototype, "hasHeaderSlot", void 0);
+__decorate([
+    state()
+], LyraAppRail.prototype, "hasFooterSlot", void 0);
+__decorate([
+    query('[part="base"]')
+], LyraAppRail.prototype, "baseEl", void 0);
+//# sourceMappingURL=app-rail.class.js.map

package/dist/components/layout/app-rail/app-rail.class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-rail.class.js","sourceRoot":"","sources":["../../../../src/components/layout/app-rail/app-rail.class.ts"],"names":[],"mappings":"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"}

package/dist/components/layout/app-rail/app-rail.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-rail.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/app-rail/app-rail.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AAGpC,OAAO,oBAAoB,CAAC"}

package/dist/components/layout/app-rail/app-rail.js

@@ -0,0 +1,6 @@
+export * from './app-rail.class.js';
+import { LyraAppRail } from './app-rail.class.js';
+import { defineElement } from '../../../internal/prefix.js';
+import "./app-rail-item.js";
+defineElement('app-rail', LyraAppRail);
+//# sourceMappingURL=app-rail.js.map

package/dist/components/layout/app-rail/app-rail.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-rail.js","sourceRoot":"","sources":["../../../../src/components/layout/app-rail/app-rail.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AACpC,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,oBAAoB,CAAC;AAC5B,aAAa,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC"}

package/dist/components/layout/app-rail/app-rail.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-rail.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/app-rail/app-rail.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBA4KlB,CAAC"}

package/dist/components/layout/app-rail/app-rail.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-rail.styles.js","sourceRoot":"","sources":["../../../../src/components/layout/app-rail/app-rail.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4KxB,CAAC"}