@slotted/angular 0.0.0-stage → 0.1.0-beta.0

package/fesm2022/slotted-angular-action-sheet.mjs

@@ -0,0 +1,749 @@
+import { SlDrawer } from '@slotted/angular/drawer';
+import { injectMessages } from '@slotted/angular/i18n';
+import { actionSheetMessages } from '@slotted/core/i18n';
+import { createControllable } from '@slotted/core/state';
+import * as i0 from '@angular/core';
+import { InjectionToken, inject, Injectable, booleanAttribute, model, input, output, HostAttributeToken, viewChild, signal, computed, effect, untracked, ViewEncapsulation, ChangeDetectionStrategy, Component, ElementRef, Directive, DestroyRef, contentChild } from '@angular/core';
+import { createRovingTabindex } from '@slotted/core/focus';
+import { createTypeahead, isPrintable } from '@slotted/core/typeahead';
+
+const FALLBACK = {
+    back: 'close',
+    closeOnSelect: true,
+    escape: 'close',
+    modal: true,
+    mount: 'active',
+    outsidePress: 'close',
+};
+const ACTION_SHEET_DEFAULTS = new InjectionToken('slotted action sheet defaults', { providedIn: 'root', factory: () => FALLBACK });
+/**
+ * An application decides once how its sheets behave. A sheet that states any of
+ * them itself still wins. The cancel's words come from the language in force
+ * (`provideSlotted`).
+ */
+function provideActionSheetDefaults(defaults) {
+    return {
+        provide: ACTION_SHEET_DEFAULTS,
+        useFactory: () => ({ ...FALLBACK, ...defaults }),
+    };
+}
+function injectActionSheetDefaults() {
+    return inject(ACTION_SHEET_DEFAULTS);
+}
+/** Ids that are unique across every sheet in the application. */
+class SlActionSheetIdFactory {
+    count = 0;
+    next() {
+        this.count += 1;
+        return `slotted-action-sheet-${this.count}`;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetIdFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetIdFactory, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetIdFactory, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
+const optionalBoolean = (given) => given === undefined ? undefined : booleanAttribute(given);
+/**
+ * Where focus enters, from the dialog pattern's first note: the first action
+ * that can run, unless it is destructive, in which case the least destructive
+ * action — the cancel, or the first action that is not `danger`, or the panel.
+ */
+function entryTarget(panel) {
+    const items = [...panel.querySelectorAll("[data-part='list'] [data-part='item']")];
+    const enabled = items.filter((item) => item.dataset['disabled'] === undefined && item.dataset['loading'] === undefined);
+    const first = enabled[0];
+    if (first !== undefined && first.dataset['tone'] !== 'danger')
+        return first;
+    const cancel = panel.querySelector("[data-part='cancel']");
+    if (cancel !== null)
+        return cancel;
+    return enabled.find((item) => item.dataset['tone'] !== 'danger') ?? panel;
+}
+/**
+ * A `scrimFrom` no extent reaches. A sheet that is not modal keeps the page
+ * live, and a scrim over a live page would promise an inertness that is not
+ * there, so `drawer` is asked to leave it undimmed at every height.
+ */
+const NEVER_DIMMED = 2;
+/** The family's measure, handed to `drawer`'s sheet. */
+const MEASURE = 'var(--slotted-action-sheet-inline-size, 32rem)';
+/**
+ * A short list of actions that rises from the bottom edge, and the explicit
+ * way out beneath it.
+ *
+ * The sheet is `<sl-drawer>` — `side="bottom"`, `size="content"` — which owns
+ * the layer, the portal, the scrim, the slide, the width, Escape, the press
+ * outside, the way back, the drag that closes it and the virtual keyboard.
+ * This family owns what is inside and the state, because only it knows that a
+ * close was a choice (`select`) and what was chosen.
+ *
+ * The parts are the consumer's own elements, projected into the drawer's
+ * panel, and dependency injection does not reach from them into this
+ * component's view, where the drawer lives. So the parts talk to the sheet,
+ * and the sheet hands `drawer` what they said — the trigger, whether a title
+ * and a message exist — and reads back the ids the panel is named by.
+ *
+ * `docs/history/designs/2026-09-25-action-sheet-on-drawer-design.md`.
+ */
+class SlActionSheet {
+    open = model(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
+    modal = input(undefined, { ...(ngDevMode ? { debugName: "modal" } : /* istanbul ignore next */ {}), transform: optionalBoolean });
+    mount = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "mount" }] : /* istanbul ignore next */ []));
+    escape = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "escape" }] : /* istanbul ignore next */ []));
+    outsidePress = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "outsidePress" }] : /* istanbul ignore next */ []));
+    back = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "back" }] : /* istanbul ignore next */ []));
+    closeOnSelect = input(undefined, { ...(ngDevMode ? { debugName: "closeOnSelect" } : /* istanbul ignore next */ {}), transform: optionalBoolean });
+    /** Words laid over the catalog of the language in force, key by key: the cancel's (`cancel`). */
+    messages = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "messages" }] : /* istanbul ignore next */ []));
+    container = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "container" }] : /* istanbul ignore next */ []));
+    initialFocus = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "initialFocus" }] : /* istanbul ignore next */ []));
+    finalFocus = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "finalFocus" }] : /* istanbul ignore next */ []));
+    openChangeRequest = output();
+    closed = output();
+    defaults = injectActionSheetDefaults();
+    /** The family's words in the language in force, with this sheet's `messages` laid over them. */
+    t = injectMessages(actionSheetMessages, this.messages);
+    /**
+     * A consumer's own `aria-label` on `<sl-action-sheet>`, read before the host
+     * bindings are written and handed to the panel, which is the element the
+     * role is on.
+     */
+    writtenLabel = inject(new HostAttributeToken('aria-label'), {
+        optional: true,
+    });
+    drawer = viewChild('drawer', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "drawer" }] : /* istanbul ignore next */ []));
+    neverDimmed = NEVER_DIMMED;
+    /** What the parts say exists; the sheet hands it to `drawer`. */
+    hasTitle = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hasTitle" }] : /* istanbul ignore next */ []));
+    hasMessage = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hasMessage" }] : /* istanbul ignore next */ []));
+    triggerNode = signal(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "triggerNode" }] : /* istanbul ignore next */ []));
+    /** The ids `drawer`'s panel is named and described by, once it exists. */
+    titleId = computed(() => this.drawer()?.titleId ?? null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "titleId" }] : /* istanbul ignore next */ []));
+    messageId = computed(() => this.drawer()?.descriptionId ?? null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "messageId" }] : /* istanbul ignore next */ []));
+    panelId = computed(() => this.drawer()?.panelId ?? null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "panelId" }] : /* istanbul ignore next */ []));
+    triggerId = computed(() => this.drawer()?.triggerId ?? null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "triggerId" }] : /* istanbul ignore next */ []));
+    mounted = computed(() => this.drawer()?.mounted() ?? false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "mounted" }] : /* istanbul ignore next */ []));
+    result = undefined;
+    resolvedModal = computed(() => this.modal() ?? this.defaults.modal, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedModal" }] : /* istanbul ignore next */ []));
+    resolvedMount = computed(() => this.mount() ?? this.defaults.mount, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedMount" }] : /* istanbul ignore next */ []));
+    resolvedCloseOnSelect = computed(() => this.closeOnSelect() ?? this.defaults.closeOnSelect, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedCloseOnSelect" }] : /* istanbul ignore next */ []));
+    resolvedEscape = computed(() => this.escape() ?? this.defaults.escape, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedEscape" }] : /* istanbul ignore next */ []));
+    resolvedBack = computed(() => this.back() ?? this.defaults.back, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedBack" }] : /* istanbul ignore next */ []));
+    resolvedOutsidePress = computed(() => this.outsidePress() ?? this.defaults.outsidePress, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedOutsidePress" }] : /* istanbul ignore next */ []));
+    /**
+     * Where focus enters, decided when the sheet has opened and its actions
+     * exist: the consumer's element, or the least destructive action.
+     */
+    entry = computed(() => {
+        const wanted = this.initialFocus();
+        if (wanted === false)
+            return false;
+        return () => {
+            if (wanted !== undefined)
+                return wanted;
+            const panel = this.drawer()?.panel ?? null;
+            return panel === null ? null : entryTarget(panel);
+        };
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "entry" }] : /* istanbul ignore next */ []));
+    constructor() {
+        /* What the parts said, handed to the drawer that renders the panel. */
+        effect(() => {
+            const drawer = this.drawer();
+            if (drawer === undefined)
+                return;
+            const title = this.hasTitle();
+            const message = this.hasMessage();
+            const trigger = this.triggerNode();
+            untracked(() => {
+                drawer.hasTitle.set(title);
+                drawer.hasDescription.set(message);
+                drawer.triggerNode.set(trigger);
+            });
+        });
+        /**
+         * What only this family knows about the panel: its measure, handed to
+         * `drawer`'s sheet token; that it takes focus from script when the pointer
+         * leaves an item; and a label the consumer wrote on the host.
+         */
+        effect(() => {
+            /* `panel` reads the drawer's view query, so this runs again whenever the
+               layer — and the panel with it — is built. */
+            const panel = this.drawer()?.panel ?? null;
+            if (panel === null)
+                return;
+            panel.style.setProperty('--slotted-drawer-sheet-inline-size', MEASURE);
+            panel.tabIndex = -1;
+            if (this.writtenLabel !== null)
+                panel.setAttribute('aria-label', this.writtenLabel);
+        });
+    }
+    /**
+     * `drawer`'s own request — the trigger, Escape, the press outside, the way
+     * back, the drag — asks this family first, and a refusal here refuses it
+     * there, so the consumer's `cancel()` holds whichever family asked.
+     */
+    fromDrawer(request) {
+        if (!this.request(request.value, request.reason, undefined, request.source)) {
+            request.cancel();
+        }
+    }
+    onClosed() {
+        this.closed.emit(this.result);
+        this.result = undefined;
+    }
+    /** Asks to move, and answers whether the move stands. */
+    request(next, reason, result, source) {
+        if (next === this.open())
+            return true;
+        let cancelled = false;
+        const state = createControllable({
+            initial: this.open(),
+            onRequest: (raw) => {
+                this.openChangeRequest.emit({
+                    cancel: () => raw.cancel(),
+                    get cancelled() {
+                        return raw.cancelled;
+                    },
+                    previous: raw.previous,
+                    reason,
+                    result,
+                    source: raw.source,
+                    value: raw.value,
+                });
+                cancelled = raw.cancelled;
+            },
+        });
+        if (!state.request(next, reason, source) || cancelled)
+            return false;
+        if (!next)
+            this.result = result;
+        this.open.set(next);
+        return true;
+    }
+    show() {
+        this.request(true, 'programmatic', undefined, undefined);
+    }
+    close() {
+        this.request(false, 'programmatic', undefined, undefined);
+    }
+    focus() {
+        const panel = this.drawer()?.panel ?? null;
+        const stop = panel?.querySelector("[data-part='item'][tabindex='0']");
+        (stop ?? panel)?.focus();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheet, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.7", type: SlActionSheet, isStandalone: true, selector: "sl-action-sheet", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, modal: { classPropertyName: "modal", publicName: "modal", isSignal: true, isRequired: false, transformFunction: null }, mount: { classPropertyName: "mount", publicName: "mount", isSignal: true, isRequired: false, transformFunction: null }, escape: { classPropertyName: "escape", publicName: "escape", isSignal: true, isRequired: false, transformFunction: null }, outsidePress: { classPropertyName: "outsidePress", publicName: "outsidePress", isSignal: true, isRequired: false, transformFunction: null }, back: { classPropertyName: "back", publicName: "back", isSignal: true, isRequired: false, transformFunction: null }, closeOnSelect: { classPropertyName: "closeOnSelect", publicName: "closeOnSelect", isSignal: true, isRequired: false, transformFunction: null }, messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null }, container: { classPropertyName: "container", publicName: "container", isSignal: true, isRequired: false, transformFunction: null }, initialFocus: { classPropertyName: "initialFocus", publicName: "initialFocus", isSignal: true, isRequired: false, transformFunction: null }, finalFocus: { classPropertyName: "finalFocus", publicName: "finalFocus", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", openChangeRequest: "openChangeRequest", closed: "closed" }, host: { properties: { "style.display": "'contents'" } }, viewQueries: [{ propertyName: "drawer", first: true, predicate: ["drawer"], descendants: true, isSignal: true }], exportAs: ["slActionSheet"], ngImport: i0, template: `
+    <sl-drawer
+      #drawer
+      mode="overlay"
+      side="bottom"
+      size="content"
+      drag="panel"
+      [open]="open()"
+      [modal]="resolvedModal()"
+      [scrimFrom]="resolvedModal() ? 0 : neverDimmed"
+      [mount]="resolvedMount()"
+      [escape]="resolvedEscape()"
+      [outsidePress]="resolvedOutsidePress()"
+      [back]="resolvedBack()"
+      [container]="container()"
+      [initialFocus]="entry()"
+      [finalFocus]="finalFocus()"
+      (openChangeRequest)="fromDrawer($event)"
+      (closed)="onClosed()"
+    >
+      <div data-ui="action-sheet" data-part="root"><ng-content /></div>
+    </sl-drawer>
+  `, isInline: true, styles: ["@layer slotted.components{[data-ui=action-sheet]{--_inset: var(--slotted-control-padding-inline-lg, 16px);--_gap: var(--slotted-control-gap-lg, 8px);--_label-size: var(--slotted-font-size-md, .875rem);--_icon-size: calc(var(--_label-size) * 1.125);--_item-height: var(--slotted-control-height-lg, 38px);--_rule-size: var(--slotted-border-width-thin, 1px);--_rule: var(--slotted-action-sheet-rule-color, var(--slotted-border-subtle, ButtonBorder));--_muted: var(--slotted-text-muted, GrayText);--_highlight: var( --slotted-action-sheet-highlight, var(--slotted-tone-secondary-subtle-hover, ButtonFace) );--_highlight-active: var( --slotted-action-sheet-highlight-active, var(--slotted-tone-secondary-subtle-active, ButtonFace) );--_accent: var(--slotted-text, CanvasText);--_list-inset: var(--slotted-space-2, .25rem);grid-row:1 / -1;justify-self:center;inline-size:min(100%,var(--slotted-action-sheet-inline-size, 32rem));box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;min-block-size:0;padding-inline:max(env(safe-area-inset-left,0px),env(safe-area-inset-right,0px));color:var(--slotted-text, CanvasText);font-family:var(--slotted-control-font-family, var(--slotted-font-family-sans))}@media(pointer:coarse){[data-ui=action-sheet]{--_label-size: var(--slotted-font-size-lg, 1rem)}}[data-ui=action-sheet]>[data-part=header]{border-block-end:var(--_rule-size) solid var(--_rule);display:grid;padding-block:var(--slotted-space-6, 1rem) var(--slotted-space-5, .75rem);padding-inline:var(--_inset);row-gap:var(--slotted-space-1, .125rem)}[data-ui=action-sheet] [data-part=title]{color:var(--slotted-text, CanvasText);font-family:var( --slotted-font-family-heading, var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif) );font-size:var(--slotted-font-size-md, .875rem);font-weight:var(--slotted-font-weight-semibold, 600);line-height:var(--slotted-line-height-md, 1.5);margin:0;overflow-wrap:anywhere}[data-ui=action-sheet] [data-part=message]{color:var(--_muted);font-size:var(--slotted-font-size-sm, .8125rem);line-height:var(--slotted-line-height-sm, 1.45);margin:0;overflow-wrap:anywhere}[data-ui=action-sheet]>[data-part=list]{--_mark: 0px;--_column-gap: 0px;align-content:start;display:grid;grid-auto-rows:max-content;grid-row:2;grid-template-columns:minmax(0,1fr);min-block-size:0;overflow-y:auto;overscroll-behavior:contain;padding-block:var(--slotted-space-2, .25rem);padding-inline:var(--_list-inset)}[data-ui=action-sheet]>[data-part=list]:has([data-part=icon]){--_mark: var(--_icon-size);--_column-gap: var(--_gap)}[data-ui=action-sheet]:not(:has(>[data-part=footer]))>[data-part=list]{padding-block-end:calc(var(--slotted-space-2, .25rem) + env(safe-area-inset-bottom,0px))}[data-ui=action-sheet] [data-part=group]{display:grid;grid-auto-rows:max-content;grid-template-columns:minmax(0,1fr)}[data-ui=action-sheet] [data-part=group-label]{color:var(--_muted);font-size:var(--slotted-font-size-sm, .8125rem);font-weight:var(--slotted-font-weight-semibold, 600);line-height:var(--slotted-line-height-sm, 1.45);padding-block:var(--slotted-space-4, .5rem) var(--slotted-space-2, .25rem);padding-inline:calc(var(--_inset) - var(--_list-inset))}[data-ui=action-sheet] [data-part=separator]{background-color:var(--_rule);block-size:var(--_rule-size);border:0;margin-block:var(--slotted-space-2, .25rem);margin-inline:0}[data-ui=action-sheet] [data-part=item]{align-content:center;appearance:none;background:transparent;border:0;box-sizing:border-box;color:var(--_accent);column-gap:var(--_column-gap);cursor:pointer;display:grid;font:inherit;font-size:var(--_label-size);grid-template-columns:var(--_mark) minmax(0,1fr);line-height:var(--slotted-line-height-md, 1.5);margin:0;min-block-size:var(--_item-height);padding-block:var(--slotted-space-4, .5rem);padding-inline:calc(var(--_inset) - var(--_list-inset));border-radius:var(--slotted-control-radius, 6px);row-gap:var(--slotted-space-1, .125rem);text-align:start;text-decoration:none;-webkit-tap-highlight-color:transparent;transition:background-color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard)),color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard))}[data-ui=action-sheet] [data-part=item]:focus{background-color:var(--_highlight);outline:none}@media(hover:hover){[data-ui=action-sheet] [data-part=item]:hover:not([data-disabled]):not([data-loading]){background-color:var(--_highlight)}}[data-ui=action-sheet] [data-part=item]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:calc(-1 * var(--slotted-focus-ring-width, 2px))}[data-ui=action-sheet] [data-part=item]:active:not([data-disabled]):not([data-loading]){background-color:var(--_highlight-active)}[data-ui=action-sheet] [data-part=item][data-disabled]{color:var(--slotted-disabled-foreground, GrayText);cursor:not-allowed}[data-ui=action-sheet] [data-part=item][data-disabled]:focus{background-color:var(--slotted-disabled-background, ButtonFace)}[data-ui=action-sheet] [data-part=item][data-loading]{cursor:progress}[data-ui=action-sheet] [data-part=icon]{--slotted-icon-size: var(--_icon-size);--slotted-spinner-size: var(--_icon-size);align-items:center;block-size:1lh;display:flex;grid-column:1;grid-row:1;inline-size:var(--_icon-size);justify-content:center}[data-ui=action-sheet] [data-part=icon]>*{flex:none;font-size:var(--_icon-size)}[data-ui=action-sheet] [data-part=label]{grid-column:2;grid-row:1;min-inline-size:0;overflow-wrap:anywhere}[data-ui=action-sheet] [data-part=description]{color:var(--_muted);font-size:var(--slotted-font-size-sm, .8125rem);grid-column:2;grid-row:2;line-height:var(--slotted-line-height-sm, 1.45);min-inline-size:0;overflow-wrap:anywhere}[data-ui=action-sheet] [data-part=item][data-disabled]>[data-part=description]{color:inherit}[data-ui=action-sheet] [data-part=item][data-tone=accent]{--_accent: var(--slotted-tone-accent-text);--_highlight: var(--slotted-tone-accent-surface);--_highlight-active: var(--slotted-tone-accent-subtle-active)}[data-ui=action-sheet] [data-part=item][data-tone=secondary]{--_accent: var(--slotted-tone-secondary-text);--_highlight: var(--slotted-tone-secondary-surface);--_highlight-active: var(--slotted-tone-secondary-subtle-active)}[data-ui=action-sheet] [data-part=item][data-tone=success]{--_accent: var(--slotted-tone-success-text);--_highlight: var(--slotted-tone-success-surface);--_highlight-active: var(--slotted-tone-success-subtle-active)}[data-ui=action-sheet] [data-part=item][data-tone=warning]{--_accent: var(--slotted-tone-warning-text);--_highlight: var(--slotted-tone-warning-surface);--_highlight-active: var(--slotted-tone-warning-subtle-active)}[data-ui=action-sheet] [data-part=item][data-tone=danger]{--_accent: var(--slotted-tone-danger-text);--_highlight: var(--slotted-tone-danger-surface);--_highlight-active: var(--slotted-tone-danger-subtle-active)}[data-ui=action-sheet]>[data-part=footer]{background:var(--slotted-action-sheet-footer-surface, var(--slotted-surface-sunken, Canvas));border-block-start:var(--_rule-size) solid var(--_rule);display:grid;grid-row:3;padding-block:var(--slotted-space-4, .5rem) calc(var(--slotted-space-4, .5rem) + env(safe-area-inset-bottom,0px));padding-inline:var(--_inset)}[data-ui=action-sheet] [data-part=cancel]{appearance:none;background:var(--slotted-control-surface, ButtonFace);border:var(--slotted-control-border-width, 1px) solid var(--slotted-control-border-color, ButtonBorder);border-radius:var(--slotted-control-radius, 6px);box-shadow:var(--slotted-control-shadow);box-sizing:border-box;color:var(--slotted-text, CanvasText);cursor:pointer;font:inherit;font-size:var(--_label-size);font-weight:var(--slotted-font-weight-semibold, 600);inline-size:100%;line-height:var(--slotted-line-height-md, 1.5);margin:0;min-block-size:var(--_item-height);padding-block:var(--slotted-space-2, .25rem);padding-inline:var(--_inset);-webkit-tap-highlight-color:transparent;transition:background-color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard))}@media(hover:hover){[data-ui=action-sheet] [data-part=cancel]:hover:not(:disabled){background:var(--slotted-tone-secondary-subtle-hover, ButtonFace)}}[data-ui=action-sheet] [data-part=cancel]:active:not(:disabled){background:var(--slotted-tone-secondary-subtle-active, ButtonFace);box-shadow:none;translate:0 var(--slotted-border-width-thin, 1px)}[data-ui=action-sheet] [data-part=cancel]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}@media(forced-colors:active){[data-ui=action-sheet] [data-part=item]:focus{background-color:Highlight;color:HighlightText;forced-color-adjust:none}[data-ui=action-sheet] [data-part=item][data-disabled]:focus{background-color:Highlight;color:GrayText}}}\n", "@layer slotted.components{[data-ui=spinner]{--_size: var(--slotted-spinner-size, var(--slotted-control-icon-size-md, 16px));--_ring: calc(var(--_size) * 5 / 6);--_stroke: max(var(--slotted-border-width-medium, 1.5px), calc(var(--_size) / 12));--_radius: calc((var(--_ring) - var(--_stroke)) / 2);--_track: color-mix(in oklab, currentColor 20%, transparent);--_start: calc(var(--_turn) + var(--_tail));--_end: calc(var(--_turn) + var(--_head));--_cap: calc(var(--_stroke) / 2);animation:slotted-spinner-turn var(--slotted-duration-loop-slow) linear infinite,slotted-spinner-head var(--slotted-duration-loop-slow) linear infinite,slotted-spinner-tail var(--slotted-duration-loop-slow) linear infinite;background-image:radial-gradient(circle at calc(50% + var(--_radius) * sin(var(--_end))) calc(50% - var(--_radius) * cos(var(--_end))),currentColor calc(var(--_cap) - .5px),transparent calc(var(--_cap) + .5px)),radial-gradient(circle at calc(50% + var(--_radius) * sin(var(--_start))) calc(50% - var(--_radius) * cos(var(--_start))),currentColor calc(var(--_cap) - .5px),transparent calc(var(--_cap) + .5px)),conic-gradient(from var(--_start),currentColor 0deg,currentColor calc(var(--_head) - var(--_tail)),transparent calc(var(--_head) - var(--_tail))),conic-gradient(var(--_track) 0 100%);background-origin:content-box;background-clip:content-box;block-size:var(--_size);box-sizing:border-box;display:inline-block;flex:none;inline-size:var(--_size);-webkit-mask-image:radial-gradient(circle,transparent calc(var(--_ring) / 2 - var(--_stroke) - .5px),#000 calc(var(--_ring) / 2 - var(--_stroke) + .5px),#000 calc(var(--_ring) / 2 - .5px),transparent calc(var(--_ring) / 2 + .5px));mask-image:radial-gradient(circle,transparent calc(var(--_ring) / 2 - var(--_stroke) - .5px),#000 calc(var(--_ring) / 2 - var(--_stroke) + .5px),#000 calc(var(--_ring) / 2 - .5px),transparent calc(var(--_ring) / 2 + .5px));opacity:1;padding:calc((var(--_size) - var(--_ring)) / 2);scale:1;transition:opacity var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),scale var(--slotted-control-transition-duration) var(--slotted-control-transition-easing);vertical-align:middle}@starting-style{[data-ui=spinner]{opacity:0;scale:.6}}@media(prefers-reduced-motion:reduce){[data-ui=spinner]{--_head: 270deg;animation:none}}@media(forced-colors:active){[data-ui=spinner]{forced-color-adjust:none}}}@property --_turn{inherits: false; initial-value: 0deg; syntax: \"<angle>\";}@property --_head{inherits: false; initial-value: 20deg; syntax: \"<angle>\";}@property --_tail{inherits: false; initial-value: 0deg; syntax: \"<angle>\";}@keyframes slotted-spinner-turn{to{--_turn: 460deg}}@keyframes slotted-spinner-head{0%{--_head: 20deg;animation-timing-function:ease-in-out}50%,to{--_head: 280deg}}@keyframes slotted-spinner-tail{0%,50%{--_tail: 0deg;animation-timing-function:ease-in-out}to{--_tail: 260deg}}\n"], dependencies: [{ kind: "component", type: SlDrawer, selector: "sl-drawer", inputs: ["open", "extent", "mode", "side", "size", "mount", "escape", "outsidePress", "back", "modal", "loading", "messages", "drag", "scrimFrom", "minExtent", "maxExtent", "snapPoints", "container", "initialFocus", "finalFocus"], outputs: ["openChange", "extentChange", "openChangeRequest", "extentChangeRequest", "closed"], exportAs: ["slDrawer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheet, decorators: [{
+            type: Component,
+            args: [{ selector: 'sl-action-sheet', standalone: true, exportAs: 'slActionSheet', imports: [SlDrawer], template: `
+    <sl-drawer
+      #drawer
+      mode="overlay"
+      side="bottom"
+      size="content"
+      drag="panel"
+      [open]="open()"
+      [modal]="resolvedModal()"
+      [scrimFrom]="resolvedModal() ? 0 : neverDimmed"
+      [mount]="resolvedMount()"
+      [escape]="resolvedEscape()"
+      [outsidePress]="resolvedOutsidePress()"
+      [back]="resolvedBack()"
+      [container]="container()"
+      [initialFocus]="entry()"
+      [finalFocus]="finalFocus()"
+      (openChangeRequest)="fromDrawer($event)"
+      (closed)="onClosed()"
+    >
+      <div data-ui="action-sheet" data-part="root"><ng-content /></div>
+    </sl-drawer>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { '[style.display]': "'contents'" }, styles: ["@layer slotted.components{[data-ui=action-sheet]{--_inset: var(--slotted-control-padding-inline-lg, 16px);--_gap: var(--slotted-control-gap-lg, 8px);--_label-size: var(--slotted-font-size-md, .875rem);--_icon-size: calc(var(--_label-size) * 1.125);--_item-height: var(--slotted-control-height-lg, 38px);--_rule-size: var(--slotted-border-width-thin, 1px);--_rule: var(--slotted-action-sheet-rule-color, var(--slotted-border-subtle, ButtonBorder));--_muted: var(--slotted-text-muted, GrayText);--_highlight: var( --slotted-action-sheet-highlight, var(--slotted-tone-secondary-subtle-hover, ButtonFace) );--_highlight-active: var( --slotted-action-sheet-highlight-active, var(--slotted-tone-secondary-subtle-active, ButtonFace) );--_accent: var(--slotted-text, CanvasText);--_list-inset: var(--slotted-space-2, .25rem);grid-row:1 / -1;justify-self:center;inline-size:min(100%,var(--slotted-action-sheet-inline-size, 32rem));box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;min-block-size:0;padding-inline:max(env(safe-area-inset-left,0px),env(safe-area-inset-right,0px));color:var(--slotted-text, CanvasText);font-family:var(--slotted-control-font-family, var(--slotted-font-family-sans))}@media(pointer:coarse){[data-ui=action-sheet]{--_label-size: var(--slotted-font-size-lg, 1rem)}}[data-ui=action-sheet]>[data-part=header]{border-block-end:var(--_rule-size) solid var(--_rule);display:grid;padding-block:var(--slotted-space-6, 1rem) var(--slotted-space-5, .75rem);padding-inline:var(--_inset);row-gap:var(--slotted-space-1, .125rem)}[data-ui=action-sheet] [data-part=title]{color:var(--slotted-text, CanvasText);font-family:var( --slotted-font-family-heading, var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif) );font-size:var(--slotted-font-size-md, .875rem);font-weight:var(--slotted-font-weight-semibold, 600);line-height:var(--slotted-line-height-md, 1.5);margin:0;overflow-wrap:anywhere}[data-ui=action-sheet] [data-part=message]{color:var(--_muted);font-size:var(--slotted-font-size-sm, .8125rem);line-height:var(--slotted-line-height-sm, 1.45);margin:0;overflow-wrap:anywhere}[data-ui=action-sheet]>[data-part=list]{--_mark: 0px;--_column-gap: 0px;align-content:start;display:grid;grid-auto-rows:max-content;grid-row:2;grid-template-columns:minmax(0,1fr);min-block-size:0;overflow-y:auto;overscroll-behavior:contain;padding-block:var(--slotted-space-2, .25rem);padding-inline:var(--_list-inset)}[data-ui=action-sheet]>[data-part=list]:has([data-part=icon]){--_mark: var(--_icon-size);--_column-gap: var(--_gap)}[data-ui=action-sheet]:not(:has(>[data-part=footer]))>[data-part=list]{padding-block-end:calc(var(--slotted-space-2, .25rem) + env(safe-area-inset-bottom,0px))}[data-ui=action-sheet] [data-part=group]{display:grid;grid-auto-rows:max-content;grid-template-columns:minmax(0,1fr)}[data-ui=action-sheet] [data-part=group-label]{color:var(--_muted);font-size:var(--slotted-font-size-sm, .8125rem);font-weight:var(--slotted-font-weight-semibold, 600);line-height:var(--slotted-line-height-sm, 1.45);padding-block:var(--slotted-space-4, .5rem) var(--slotted-space-2, .25rem);padding-inline:calc(var(--_inset) - var(--_list-inset))}[data-ui=action-sheet] [data-part=separator]{background-color:var(--_rule);block-size:var(--_rule-size);border:0;margin-block:var(--slotted-space-2, .25rem);margin-inline:0}[data-ui=action-sheet] [data-part=item]{align-content:center;appearance:none;background:transparent;border:0;box-sizing:border-box;color:var(--_accent);column-gap:var(--_column-gap);cursor:pointer;display:grid;font:inherit;font-size:var(--_label-size);grid-template-columns:var(--_mark) minmax(0,1fr);line-height:var(--slotted-line-height-md, 1.5);margin:0;min-block-size:var(--_item-height);padding-block:var(--slotted-space-4, .5rem);padding-inline:calc(var(--_inset) - var(--_list-inset));border-radius:var(--slotted-control-radius, 6px);row-gap:var(--slotted-space-1, .125rem);text-align:start;text-decoration:none;-webkit-tap-highlight-color:transparent;transition:background-color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard)),color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard))}[data-ui=action-sheet] [data-part=item]:focus{background-color:var(--_highlight);outline:none}@media(hover:hover){[data-ui=action-sheet] [data-part=item]:hover:not([data-disabled]):not([data-loading]){background-color:var(--_highlight)}}[data-ui=action-sheet] [data-part=item]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:calc(-1 * var(--slotted-focus-ring-width, 2px))}[data-ui=action-sheet] [data-part=item]:active:not([data-disabled]):not([data-loading]){background-color:var(--_highlight-active)}[data-ui=action-sheet] [data-part=item][data-disabled]{color:var(--slotted-disabled-foreground, GrayText);cursor:not-allowed}[data-ui=action-sheet] [data-part=item][data-disabled]:focus{background-color:var(--slotted-disabled-background, ButtonFace)}[data-ui=action-sheet] [data-part=item][data-loading]{cursor:progress}[data-ui=action-sheet] [data-part=icon]{--slotted-icon-size: var(--_icon-size);--slotted-spinner-size: var(--_icon-size);align-items:center;block-size:1lh;display:flex;grid-column:1;grid-row:1;inline-size:var(--_icon-size);justify-content:center}[data-ui=action-sheet] [data-part=icon]>*{flex:none;font-size:var(--_icon-size)}[data-ui=action-sheet] [data-part=label]{grid-column:2;grid-row:1;min-inline-size:0;overflow-wrap:anywhere}[data-ui=action-sheet] [data-part=description]{color:var(--_muted);font-size:var(--slotted-font-size-sm, .8125rem);grid-column:2;grid-row:2;line-height:var(--slotted-line-height-sm, 1.45);min-inline-size:0;overflow-wrap:anywhere}[data-ui=action-sheet] [data-part=item][data-disabled]>[data-part=description]{color:inherit}[data-ui=action-sheet] [data-part=item][data-tone=accent]{--_accent: var(--slotted-tone-accent-text);--_highlight: var(--slotted-tone-accent-surface);--_highlight-active: var(--slotted-tone-accent-subtle-active)}[data-ui=action-sheet] [data-part=item][data-tone=secondary]{--_accent: var(--slotted-tone-secondary-text);--_highlight: var(--slotted-tone-secondary-surface);--_highlight-active: var(--slotted-tone-secondary-subtle-active)}[data-ui=action-sheet] [data-part=item][data-tone=success]{--_accent: var(--slotted-tone-success-text);--_highlight: var(--slotted-tone-success-surface);--_highlight-active: var(--slotted-tone-success-subtle-active)}[data-ui=action-sheet] [data-part=item][data-tone=warning]{--_accent: var(--slotted-tone-warning-text);--_highlight: var(--slotted-tone-warning-surface);--_highlight-active: var(--slotted-tone-warning-subtle-active)}[data-ui=action-sheet] [data-part=item][data-tone=danger]{--_accent: var(--slotted-tone-danger-text);--_highlight: var(--slotted-tone-danger-surface);--_highlight-active: var(--slotted-tone-danger-subtle-active)}[data-ui=action-sheet]>[data-part=footer]{background:var(--slotted-action-sheet-footer-surface, var(--slotted-surface-sunken, Canvas));border-block-start:var(--_rule-size) solid var(--_rule);display:grid;grid-row:3;padding-block:var(--slotted-space-4, .5rem) calc(var(--slotted-space-4, .5rem) + env(safe-area-inset-bottom,0px));padding-inline:var(--_inset)}[data-ui=action-sheet] [data-part=cancel]{appearance:none;background:var(--slotted-control-surface, ButtonFace);border:var(--slotted-control-border-width, 1px) solid var(--slotted-control-border-color, ButtonBorder);border-radius:var(--slotted-control-radius, 6px);box-shadow:var(--slotted-control-shadow);box-sizing:border-box;color:var(--slotted-text, CanvasText);cursor:pointer;font:inherit;font-size:var(--_label-size);font-weight:var(--slotted-font-weight-semibold, 600);inline-size:100%;line-height:var(--slotted-line-height-md, 1.5);margin:0;min-block-size:var(--_item-height);padding-block:var(--slotted-space-2, .25rem);padding-inline:var(--_inset);-webkit-tap-highlight-color:transparent;transition:background-color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard))}@media(hover:hover){[data-ui=action-sheet] [data-part=cancel]:hover:not(:disabled){background:var(--slotted-tone-secondary-subtle-hover, ButtonFace)}}[data-ui=action-sheet] [data-part=cancel]:active:not(:disabled){background:var(--slotted-tone-secondary-subtle-active, ButtonFace);box-shadow:none;translate:0 var(--slotted-border-width-thin, 1px)}[data-ui=action-sheet] [data-part=cancel]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}@media(forced-colors:active){[data-ui=action-sheet] [data-part=item]:focus{background-color:Highlight;color:HighlightText;forced-color-adjust:none}[data-ui=action-sheet] [data-part=item][data-disabled]:focus{background-color:Highlight;color:GrayText}}}\n", "@layer slotted.components{[data-ui=spinner]{--_size: var(--slotted-spinner-size, var(--slotted-control-icon-size-md, 16px));--_ring: calc(var(--_size) * 5 / 6);--_stroke: max(var(--slotted-border-width-medium, 1.5px), calc(var(--_size) / 12));--_radius: calc((var(--_ring) - var(--_stroke)) / 2);--_track: color-mix(in oklab, currentColor 20%, transparent);--_start: calc(var(--_turn) + var(--_tail));--_end: calc(var(--_turn) + var(--_head));--_cap: calc(var(--_stroke) / 2);animation:slotted-spinner-turn var(--slotted-duration-loop-slow) linear infinite,slotted-spinner-head var(--slotted-duration-loop-slow) linear infinite,slotted-spinner-tail var(--slotted-duration-loop-slow) linear infinite;background-image:radial-gradient(circle at calc(50% + var(--_radius) * sin(var(--_end))) calc(50% - var(--_radius) * cos(var(--_end))),currentColor calc(var(--_cap) - .5px),transparent calc(var(--_cap) + .5px)),radial-gradient(circle at calc(50% + var(--_radius) * sin(var(--_start))) calc(50% - var(--_radius) * cos(var(--_start))),currentColor calc(var(--_cap) - .5px),transparent calc(var(--_cap) + .5px)),conic-gradient(from var(--_start),currentColor 0deg,currentColor calc(var(--_head) - var(--_tail)),transparent calc(var(--_head) - var(--_tail))),conic-gradient(var(--_track) 0 100%);background-origin:content-box;background-clip:content-box;block-size:var(--_size);box-sizing:border-box;display:inline-block;flex:none;inline-size:var(--_size);-webkit-mask-image:radial-gradient(circle,transparent calc(var(--_ring) / 2 - var(--_stroke) - .5px),#000 calc(var(--_ring) / 2 - var(--_stroke) + .5px),#000 calc(var(--_ring) / 2 - .5px),transparent calc(var(--_ring) / 2 + .5px));mask-image:radial-gradient(circle,transparent calc(var(--_ring) / 2 - var(--_stroke) - .5px),#000 calc(var(--_ring) / 2 - var(--_stroke) + .5px),#000 calc(var(--_ring) / 2 - .5px),transparent calc(var(--_ring) / 2 + .5px));opacity:1;padding:calc((var(--_size) - var(--_ring)) / 2);scale:1;transition:opacity var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),scale var(--slotted-control-transition-duration) var(--slotted-control-transition-easing);vertical-align:middle}@starting-style{[data-ui=spinner]{opacity:0;scale:.6}}@media(prefers-reduced-motion:reduce){[data-ui=spinner]{--_head: 270deg;animation:none}}@media(forced-colors:active){[data-ui=spinner]{forced-color-adjust:none}}}@property --_turn{inherits: false; initial-value: 0deg; syntax: \"<angle>\";}@property --_head{inherits: false; initial-value: 20deg; syntax: \"<angle>\";}@property --_tail{inherits: false; initial-value: 0deg; syntax: \"<angle>\";}@keyframes slotted-spinner-turn{to{--_turn: 460deg}}@keyframes slotted-spinner-head{0%{--_head: 20deg;animation-timing-function:ease-in-out}50%,to{--_head: 280deg}}@keyframes slotted-spinner-tail{0%,50%{--_tail: 0deg;animation-timing-function:ease-in-out}to{--_tail: 260deg}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], modal: [{ type: i0.Input, args: [{ isSignal: true, alias: "modal", required: false }] }], mount: [{ type: i0.Input, args: [{ isSignal: true, alias: "mount", required: false }] }], escape: [{ type: i0.Input, args: [{ isSignal: true, alias: "escape", required: false }] }], outsidePress: [{ type: i0.Input, args: [{ isSignal: true, alias: "outsidePress", required: false }] }], back: [{ type: i0.Input, args: [{ isSignal: true, alias: "back", required: false }] }], closeOnSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnSelect", required: false }] }], messages: [{ type: i0.Input, args: [{ isSignal: true, alias: "messages", required: false }] }], container: [{ type: i0.Input, args: [{ isSignal: true, alias: "container", required: false }] }], initialFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialFocus", required: false }] }], finalFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "finalFocus", required: false }] }], openChangeRequest: [{ type: i0.Output, args: ["openChangeRequest"] }], closed: [{ type: i0.Output, args: ["closed"] }], drawer: [{ type: i0.ViewChild, args: ['drawer', { isSignal: true }] }] } });
+
+const ITEM_SELECTOR = "[data-part='item']";
+/**
+ * A click synthesised by the keyboard reports no detail; a real one reports the
+ * click count. It tells `Enter` and `Space` from a press without a key listener.
+ */
+function activationReason(event) {
+    return event.detail === 0 ? 'keyboard' : 'pointer';
+}
+let nextId = 0;
+const uniqueId = (prefix) => `${prefix}-${(nextId += 1)}`;
+/**
+ * The control that opens the sheet: the consumer's own element, which is what
+ * this ecosystem composes with. It is also the layer's branch, so a press on
+ * it is not read as an outside press.
+ */
+class SlActionSheetTrigger {
+    /** The sheet this control opens, reached with a template reference variable. */
+    sheet = input.required({ ...(ngDevMode ? { debugName: "sheet" } : /* istanbul ignore next */ {}), alias: 'slActionSheetTrigger' });
+    native = inject(ElementRef).nativeElement;
+    controls = computed(() => this.sheet().mounted() ? this.sheet().panelId() : null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "controls" }] : /* istanbul ignore next */ []));
+    ngOnInit() {
+        this.sheet().triggerNode.set(this.native);
+    }
+    ngOnDestroy() {
+        if (this.sheet().triggerNode() === this.native)
+            this.sheet().triggerNode.set(null);
+    }
+    press(event) {
+        /* The consumer's own handler ran first, and `preventDefault()` refuses. */
+        if (event.defaultPrevented)
+            return;
+        const sheet = this.sheet();
+        sheet.request(!sheet.open(), activationReason(event), undefined, event);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.7", type: SlActionSheetTrigger, isStandalone: true, selector: "[slActionSheetTrigger]", inputs: { sheet: { classPropertyName: "sheet", publicName: "slActionSheetTrigger", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "data-part": "trigger", "type": "button", "aria-haspopup": "dialog" }, listeners: { "click": "press($event)" }, properties: { "attr.aria-expanded": "sheet().open()", "attr.aria-controls": "controls()", "attr.data-open": "sheet().open() ? '' : null", "attr.id": "sheet().triggerId()" } }, exportAs: ["slActionSheetTrigger"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetTrigger, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[slActionSheetTrigger]',
+                    standalone: true,
+                    exportAs: 'slActionSheetTrigger',
+                    host: {
+                        'data-part': 'trigger',
+                        type: 'button',
+                        'aria-haspopup': 'dialog',
+                        '[attr.aria-expanded]': 'sheet().open()',
+                        '[attr.aria-controls]': 'controls()',
+                        '[attr.data-open]': "sheet().open() ? '' : null",
+                        '[attr.id]': 'sheet().triggerId()',
+                        '(click)': 'press($event)',
+                    },
+                }]
+        }], propDecorators: { sheet: [{ type: i0.Input, args: [{ isSignal: true, alias: "slActionSheetTrigger", required: true }] }] } });
+class SlActionSheetHeader {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetHeader, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlActionSheetHeader, isStandalone: true, selector: "[slActionSheetHeader]", host: { attributes: { "data-part": "header" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetHeader, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[slActionSheetHeader]',
+                    standalone: true,
+                    host: { 'data-part': 'header' },
+                }]
+        }] });
+/** The name of the dialog and of the list. */
+class SlActionSheetTitle {
+    sheet = inject(SlActionSheet);
+    ngOnInit() {
+        this.sheet.hasTitle.set(true);
+    }
+    ngOnDestroy() {
+        this.sheet.hasTitle.set(false);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlActionSheetTitle, isStandalone: true, selector: "[slActionSheetTitle]", host: { attributes: { "data-part": "title" }, properties: { "attr.id": "sheet.titleId()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetTitle, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[slActionSheetTitle]',
+                    standalone: true,
+                    host: { 'data-part': 'title', '[attr.id]': 'sheet.titleId()' },
+                }]
+        }] });
+/** The dialog's description. */
+class SlActionSheetMessage {
+    sheet = inject(SlActionSheet);
+    ngOnInit() {
+        this.sheet.hasMessage.set(true);
+    }
+    ngOnDestroy() {
+        this.sheet.hasMessage.set(false);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetMessage, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlActionSheetMessage, isStandalone: true, selector: "[slActionSheetMessage]", host: { attributes: { "data-part": "message" }, properties: { "attr.id": "sheet.messageId()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetMessage, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[slActionSheetMessage]',
+                    standalone: true,
+                    host: { 'data-part': 'message', '[attr.id]': 'sheet.messageId()' },
+                }]
+        }] });
+/**
+ * The menu: one tab stop for every action, the arrows, `Home`, `End` and
+ * typeahead. Named by the sheet's title unless the consumer names it.
+ */
+class SlActionSheetList {
+    sheet = inject(SlActionSheet);
+    element = inject(ElementRef).nativeElement;
+    roving = null;
+    typeahead = createTypeahead();
+    labelledBy = computed(() => this.sheet.hasTitle() && !this.element.hasAttribute('aria-label') ? this.sheet.titleId() : null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "labelledBy" }] : /* istanbul ignore next */ []));
+    constructor() {
+        inject(DestroyRef).onDestroy(() => {
+            this.roving?.destroy();
+            this.typeahead.destroy();
+        });
+    }
+    ngOnInit() {
+        this.roving = createRovingTabindex(this.element, {
+            includeAriaDisabled: true,
+            itemSelector: ITEM_SELECTOR,
+            orientation: () => 'vertical',
+        });
+    }
+    /** An item added, removed or disabled moves the stop. */
+    ngAfterContentChecked() {
+        this.roving?.refresh();
+    }
+    items() {
+        return [...this.element.querySelectorAll(ITEM_SELECTOR)];
+    }
+    /** Focus that arrived by the pointer or by entry moves the stop with it. */
+    onFocusIn(event) {
+        const index = this.items().indexOf(event.target);
+        if (index !== -1)
+            this.roving?.setActive(index);
+    }
+    onKeyDown(event) {
+        if (event.defaultPrevented || event.ctrlKey || event.metaKey || event.altKey)
+            return;
+        if (!isPrintable(event.key, this.typeahead.query.length > 0))
+            return;
+        event.preventDefault();
+        const all = this.items();
+        const labels = all.map((item) => item.dataset['textValue'] ??
+            item.querySelector("[data-part='label']")?.textContent?.trim() ??
+            '');
+        const index = this.typeahead.match(event.key, labels, all.indexOf(event.target));
+        all[index]?.focus();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetList, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlActionSheetList, isStandalone: true, selector: "[slActionSheetList]", host: { attributes: { "data-part": "list", "role": "menu", "aria-orientation": "vertical" }, listeners: { "focusin": "onFocusIn($event)", "keydown": "onKeyDown($event)" }, properties: { "attr.aria-labelledby": "labelledBy()" } }, exportAs: ["slActionSheetList"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetList, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[slActionSheetList]',
+                    standalone: true,
+                    exportAs: 'slActionSheetList',
+                    host: {
+                        'data-part': 'list',
+                        role: 'menu',
+                        'aria-orientation': 'vertical',
+                        '[attr.aria-labelledby]': 'labelledBy()',
+                        '(focusin)': 'onFocusIn($event)',
+                        '(keydown)': 'onKeyDown($event)',
+                    },
+                }]
+        }], ctorParameters: () => [] });
+class SlActionSheetGroupLabel {
+    id = uniqueId('slotted-action-sheet-group-label');
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetGroupLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlActionSheetGroupLabel, isStandalone: true, selector: "[slActionSheetGroupLabel]", host: { attributes: { "data-part": "group-label" }, properties: { "id": "id" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetGroupLabel, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[slActionSheetGroupLabel]',
+                    standalone: true,
+                    host: { 'data-part': 'group-label', '[id]': 'id' },
+                }]
+        }] });
+/** A run of related actions, named by the label it holds. */
+class SlActionSheetGroup {
+    label = contentChild(SlActionSheetGroupLabel, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "22.1.7", type: SlActionSheetGroup, isStandalone: true, selector: "[slActionSheetGroup]", host: { attributes: { "data-part": "group", "role": "group" }, properties: { "attr.aria-labelledby": "label()?.id ?? null" } }, queries: [{ propertyName: "label", first: true, predicate: SlActionSheetGroupLabel, descendants: true, isSignal: true }], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetGroup, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[slActionSheetGroup]',
+                    standalone: true,
+                    host: {
+                        'data-part': 'group',
+                        role: 'group',
+                        '[attr.aria-labelledby]': 'label()?.id ?? null',
+                    },
+                }]
+        }], propDecorators: { label: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SlActionSheetGroupLabel), { isSignal: true }] }] } });
+class SlActionSheetSeparator {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetSeparator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlActionSheetSeparator, isStandalone: true, selector: "hr[slActionSheetSeparator]", host: { attributes: { "data-part": "separator", "role": "separator" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetSeparator, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'hr[slActionSheetSeparator]',
+                    standalone: true,
+                    host: { 'data-part': 'separator', role: 'separator' },
+                }]
+        }] });
+/** The item's visual. Hidden from assistive technology: the label names the action. */
+class SlActionSheetItemIcon {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetItemIcon, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlActionSheetItemIcon, isStandalone: true, selector: "[slActionSheetItemIcon]", host: { attributes: { "data-part": "icon", "aria-hidden": "true" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetItemIcon, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[slActionSheetItemIcon]',
+                    standalone: true,
+                    host: { 'data-part': 'icon', 'aria-hidden': 'true' },
+                }]
+        }] });
+/** The item's second line, which describes the action rather than naming it. */
+class SlActionSheetItemDescription {
+    id = uniqueId('slotted-action-sheet-description');
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetItemDescription, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlActionSheetItemDescription, isStandalone: true, selector: "[slActionSheetItemDescription]", host: { attributes: { "data-part": "description" }, properties: { "id": "id" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetItemDescription, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[slActionSheetItemDescription]',
+                    standalone: true,
+                    host: { 'data-part': 'description', '[id]': 'id' },
+                }]
+        }] });
+/**
+ * One action, on the consumer's own `button` or `a`. The role is `menuitem`,
+ * as in `menu`; a disabled or loading item keeps its tab index and takes
+ * `aria-disabled`, because the pattern keeps disabled items in the ring.
+ *
+ * While `loading`, the ring takes the icon box and the projected icon is not
+ * shown, so the label never moves.
+ */
+class SlActionSheetItem {
+    /** What the close carries as its `result` when this item is chosen. */
+    value = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** What typeahead matches on, when the visible label is not the word. */
+    textValue = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "textValue" }] : /* istanbul ignore next */ []));
+    tone = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []));
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** The action is running: the item refuses a second press and the sheet stays open. */
+    loading = input(false, { ...(ngDevMode ? { debugName: "loading" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    closeOnSelect = input(undefined, { ...(ngDevMode ? { debugName: "closeOnSelect" } : /* istanbul ignore next */ {}), transform: (given) => given === undefined ? undefined : booleanAttribute(given) });
+    select = output();
+    sheet = inject(SlActionSheet);
+    element = inject(ElementRef).nativeElement;
+    isLink = this.element.tagName === 'A';
+    description = contentChild(SlActionSheetItemDescription, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []));
+    inert = computed(() => this.disabled() || this.loading(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "inert" }] : /* istanbul ignore next */ []));
+    onClick(event) {
+        if (this.inert()) {
+            event.preventDefault();
+            return;
+        }
+        let prevented = false;
+        this.select.emit({
+            reason: activationReason(event),
+            source: event,
+            value: this.value(),
+            get defaultPrevented() {
+                return prevented;
+            },
+            preventDefault: () => {
+                prevented = true;
+            },
+        });
+        if (prevented)
+            return;
+        if (this.closeOnSelect() ?? this.sheet.resolvedCloseOnSelect()) {
+            this.sheet.request(false, 'select', this.value(), event);
+        }
+    }
+    /**
+     * A mouse or a pen over an item focuses it, so exactly one row is lit
+     * whichever device is driving. A finger does not: focus moving under a touch
+     * that is about to scroll the list would light rows at random.
+     */
+    onPointerMove(event) {
+        if (event.pointerType === 'touch')
+            return;
+        if (this.element.ownerDocument.activeElement !== this.element) {
+            this.element.focus({ preventScroll: true });
+        }
+    }
+    onPointerLeave(event) {
+        if (event.pointerType === 'touch')
+            return;
+        if (this.element.ownerDocument.activeElement !== this.element)
+            return;
+        this.element.closest("[data-part='panel']")?.focus({ preventScroll: true });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SlActionSheetItem, isStandalone: true, selector: "button[slActionSheetItem], a[slActionSheetItem]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, textValue: { classPropertyName: "textValue", publicName: "textValue", isSignal: true, isRequired: false, transformFunction: null }, tone: { classPropertyName: "tone", publicName: "tone", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, closeOnSelect: { classPropertyName: "closeOnSelect", publicName: "closeOnSelect", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { select: "select" }, host: { attributes: { "data-part": "item", "role": "menuitem", "tabindex": "-1" }, listeners: { "click": "onClick($event)", "pointermove": "onPointerMove($event)", "pointerleave": "onPointerLeave($event)" }, properties: { "attr.type": "isLink ? null : \"button\"", "attr.aria-disabled": "inert() ? true : null", "attr.aria-busy": "loading() ? true : null", "attr.aria-describedby": "description()?.id ?? null", "attr.data-disabled": "disabled() ? \"\" : null", "attr.disabled": "null", "attr.data-loading": "loading() ? \"\" : null", "attr.data-text-value": "textValue() ?? null", "attr.data-tone": "tone() ?? null", "attr.data-value": "value() ?? null" } }, queries: [{ propertyName: "description", first: true, predicate: SlActionSheetItemDescription, descendants: true, isSignal: true }], exportAs: ["slActionSheetItem"], ngImport: i0, template: `
+    @if (loading()) {
+      <span data-part="icon" aria-hidden="true"><span data-ui="spinner"></span></span>
+    } @else {
+      <ng-content select="[slActionSheetItemIcon]" />
+    }
+    <span data-part="label"><ng-content /></span>
+    <ng-content select="[slActionSheetItemDescription]" />
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetItem, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'button[slActionSheetItem], a[slActionSheetItem]',
+                    standalone: true,
+                    exportAs: 'slActionSheetItem',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    host: {
+                        'data-part': 'item',
+                        role: 'menuitem',
+                        tabindex: '-1',
+                        '[attr.type]': 'isLink ? null : "button"',
+                        '[attr.aria-disabled]': 'inert() ? true : null',
+                        '[attr.aria-busy]': 'loading() ? true : null',
+                        '[attr.aria-describedby]': 'description()?.id ?? null',
+                        '[attr.data-disabled]': 'disabled() ? "" : null',
+                        /* A static `disabled` on the host would stay as the native attribute and
+                           take the item out of the ring the arrows walk; the pattern keeps it in. */
+                        '[attr.disabled]': 'null',
+                        '[attr.data-loading]': 'loading() ? "" : null',
+                        '[attr.data-text-value]': 'textValue() ?? null',
+                        '[attr.data-tone]': 'tone() ?? null',
+                        '[attr.data-value]': 'value() ?? null',
+                        '(click)': 'onClick($event)',
+                        '(pointermove)': 'onPointerMove($event)',
+                        '(pointerleave)': 'onPointerLeave($event)',
+                    },
+                    template: `
+    @if (loading()) {
+      <span data-part="icon" aria-hidden="true"><span data-ui="spinner"></span></span>
+    } @else {
+      <ng-content select="[slActionSheetItemIcon]" />
+    }
+    <span data-part="label"><ng-content /></span>
+    <ng-content select="[slActionSheetItemDescription]" />
+  `,
+                }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], textValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "textValue", required: false }] }], tone: [{ type: i0.Input, args: [{ isSignal: true, alias: "tone", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], closeOnSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnSelect", required: false }] }], select: [{ type: i0.Output, args: ["select"] }], description: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SlActionSheetItemDescription), { isSignal: true }] }] } });
+/** The band that holds the cancel. */
+class SlActionSheetFooter {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetFooter, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlActionSheetFooter, isStandalone: true, selector: "[slActionSheetFooter]", host: { attributes: { "data-part": "footer" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetFooter, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[slActionSheetFooter]',
+                    standalone: true,
+                    host: { 'data-part': 'footer' },
+                }]
+        }] });
+/**
+ * The explicit way out, on the consumer's own `button`. Never disabled: a sheet
+ * that cannot be left is a trap. Given no words, it shows the catalog's `cancel`.
+ */
+class SlActionSheetCancel {
+    sheet = inject(SlActionSheet);
+    onClick(event) {
+        if (event.defaultPrevented)
+            return;
+        this.sheet.request(false, 'dismiss', undefined, event);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetCancel, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: SlActionSheetCancel, isStandalone: true, selector: "button[slActionSheetCancel]", host: { attributes: { "data-part": "cancel", "type": "button" }, listeners: { "click": "onClick($event)" }, properties: { "disabled": "false" } }, ngImport: i0, template: `<ng-content>{{ sheet.t('cancel') }}</ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlActionSheetCancel, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'button[slActionSheetCancel]',
+                    standalone: true,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    host: {
+                        'data-part': 'cancel',
+                        type: 'button',
+                        '[disabled]': 'false',
+                        '(click)': 'onClick($event)',
+                    },
+                    template: `<ng-content>{{ sheet.t('cancel') }}</ng-content>`,
+                }]
+        }] });
+/** Every part, for a standalone component's `imports`. */
+const SL_ACTION_SHEET = [
+    SlActionSheet,
+    SlActionSheetTrigger,
+    SlActionSheetHeader,
+    SlActionSheetTitle,
+    SlActionSheetMessage,
+    SlActionSheetList,
+    SlActionSheetGroup,
+    SlActionSheetGroupLabel,
+    SlActionSheetSeparator,
+    SlActionSheetItem,
+    SlActionSheetItemIcon,
+    SlActionSheetItemDescription,
+    SlActionSheetFooter,
+    SlActionSheetCancel,
+];
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ACTION_SHEET_DEFAULTS, SL_ACTION_SHEET, SlActionSheet, SlActionSheetCancel, SlActionSheetFooter, SlActionSheetGroup, SlActionSheetGroupLabel, SlActionSheetHeader, SlActionSheetIdFactory, SlActionSheetItem, SlActionSheetItemDescription, SlActionSheetItemIcon, SlActionSheetList, SlActionSheetMessage, SlActionSheetSeparator, SlActionSheetTitle, SlActionSheetTrigger, entryTarget, injectActionSheetDefaults, provideActionSheetDefaults };
+//# sourceMappingURL=slotted-angular-action-sheet.mjs.map