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

package/types/slotted-angular-action-sheet.d.ts

@@ -0,0 +1,294 @@
+import * as _slotted_core_i18n from '@slotted/core/i18n';
+import { PartialMessages, ActionSheetMessages } from '@slotted/core/i18n';
+import * as _angular_core from '@angular/core';
+import { InjectionToken, OnInit, OnDestroy, AfterContentChecked } from '@angular/core';
+import { SlDrawer, DrawerChangeRequest } from '@slotted/angular/drawer';
+
+/**
+ * When the layer exists. `active` builds it on opening and drops it once the
+ * exit is over, `lazy` builds it on the first open and keeps it, `eager` builds
+ * it up front and makes it inert.
+ */
+type ActionSheetMount = 'active' | 'lazy' | 'eager';
+/** Whether a dismissal source closes the sheet. */
+type ActionSheetDismissPolicy = 'close' | 'none';
+/** The five tones `menu` paints an item in; `danger` is the destructive action. */
+type ActionSheetTone = 'accent' | 'secondary' | 'success' | 'warning' | 'danger';
+/** Why the sheet opened or closed. */
+type ActionSheetOpenReason = 'pointer' | 'keyboard' | 'select' | 'dismiss' | 'escape' | 'outsidePress' | 'back' | 'programmatic';
+/**
+ * The request emitted before the sheet moves. `result` is the value of the item
+ * chosen, present when `reason` is `select`.
+ */
+interface ActionSheetChangeRequest {
+    readonly value: boolean;
+    readonly previous: boolean;
+    readonly reason: ActionSheetOpenReason;
+    readonly result?: string | undefined;
+    readonly source?: unknown;
+    readonly cancelled: boolean;
+    cancel(): void;
+}
+/** What `(select)` carries. `preventDefault()` keeps the sheet open. */
+interface ActionSheetSelectEvent {
+    readonly reason: 'pointer' | 'keyboard';
+    readonly source: Event;
+    readonly value: string | undefined;
+    readonly defaultPrevented: boolean;
+    preventDefault(): void;
+}
+interface ActionSheetDefaults {
+    back: ActionSheetDismissPolicy;
+    closeOnSelect: boolean;
+    escape: ActionSheetDismissPolicy;
+    modal: boolean;
+    mount: ActionSheetMount;
+    outsidePress: ActionSheetDismissPolicy;
+}
+declare const ACTION_SHEET_DEFAULTS: InjectionToken<ActionSheetDefaults>;
+/**
+ * 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`).
+ */
+declare function provideActionSheetDefaults(defaults: Partial<ActionSheetDefaults>): {
+    provide: InjectionToken<ActionSheetDefaults>;
+    useFactory: () => ActionSheetDefaults;
+};
+declare function injectActionSheetDefaults(): ActionSheetDefaults;
+/** Ids that are unique across every sheet in the application. */
+declare class SlActionSheetIdFactory {
+    private count;
+    next(): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlActionSheetIdFactory, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<any>;
+}
+
+/**
+ * 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.
+ */
+declare function entryTarget(panel: HTMLElement): HTMLElement;
+/**
+ * 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`.
+ */
+declare class SlActionSheet {
+    readonly open: _angular_core.ModelSignal<boolean>;
+    readonly modal: _angular_core.InputSignalWithTransform<boolean | undefined, string | boolean | undefined>;
+    readonly mount: _angular_core.InputSignal<ActionSheetMount | undefined>;
+    readonly escape: _angular_core.InputSignal<ActionSheetDismissPolicy | undefined>;
+    readonly outsidePress: _angular_core.InputSignal<ActionSheetDismissPolicy | undefined>;
+    readonly back: _angular_core.InputSignal<ActionSheetDismissPolicy | undefined>;
+    readonly closeOnSelect: _angular_core.InputSignalWithTransform<boolean | undefined, string | boolean | undefined>;
+    /** Words laid over the catalog of the language in force, key by key: the cancel's (`cancel`). */
+    readonly messages: _angular_core.InputSignal<PartialMessages<ActionSheetMessages> | undefined>;
+    readonly container: _angular_core.InputSignal<Element | null | undefined>;
+    readonly initialFocus: _angular_core.InputSignal<false | HTMLElement | undefined>;
+    readonly finalFocus: _angular_core.InputSignal<false | HTMLElement | undefined>;
+    readonly openChangeRequest: _angular_core.OutputEmitterRef<ActionSheetChangeRequest>;
+    readonly closed: _angular_core.OutputEmitterRef<string | undefined>;
+    private readonly defaults;
+    /** The family's words in the language in force, with this sheet's `messages` laid over them. */
+    readonly t: _slotted_core_i18n.FamilyTranslator<ActionSheetMessages>;
+    /**
+     * 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.
+     */
+    private readonly writtenLabel;
+    protected readonly drawer: _angular_core.Signal<SlDrawer | undefined>;
+    protected readonly neverDimmed = 2;
+    /** What the parts say exists; the sheet hands it to `drawer`. */
+    readonly hasTitle: _angular_core.WritableSignal<boolean>;
+    readonly hasMessage: _angular_core.WritableSignal<boolean>;
+    readonly triggerNode: _angular_core.WritableSignal<HTMLElement | null>;
+    /** The ids `drawer`'s panel is named and described by, once it exists. */
+    readonly titleId: _angular_core.Signal<string | null>;
+    readonly messageId: _angular_core.Signal<string | null>;
+    readonly panelId: _angular_core.Signal<string | null>;
+    readonly triggerId: _angular_core.Signal<string | null>;
+    readonly mounted: _angular_core.Signal<boolean>;
+    private result;
+    readonly resolvedModal: _angular_core.Signal<boolean>;
+    readonly resolvedMount: _angular_core.Signal<ActionSheetMount>;
+    readonly resolvedCloseOnSelect: _angular_core.Signal<boolean>;
+    protected readonly resolvedEscape: _angular_core.Signal<ActionSheetDismissPolicy>;
+    protected readonly resolvedBack: _angular_core.Signal<ActionSheetDismissPolicy>;
+    protected readonly resolvedOutsidePress: _angular_core.Signal<ActionSheetDismissPolicy>;
+    /**
+     * Where focus enters, decided when the sheet has opened and its actions
+     * exist: the consumer's element, or the least destructive action.
+     */
+    protected readonly entry: _angular_core.Signal<false | (() => HTMLElement | null)>;
+    constructor();
+    /**
+     * `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.
+     */
+    protected fromDrawer(request: DrawerChangeRequest): void;
+    protected onClosed(): void;
+    /** Asks to move, and answers whether the move stands. */
+    request(next: boolean, reason: ActionSheetOpenReason, result: string | undefined, source: unknown): boolean;
+    show(): void;
+    close(): void;
+    focus(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlActionSheet, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SlActionSheet, "sl-action-sheet", ["slActionSheet"], { "open": { "alias": "open"; "required": false; "isSignal": true; }; "modal": { "alias": "modal"; "required": false; "isSignal": true; }; "mount": { "alias": "mount"; "required": false; "isSignal": true; }; "escape": { "alias": "escape"; "required": false; "isSignal": true; }; "outsidePress": { "alias": "outsidePress"; "required": false; "isSignal": true; }; "back": { "alias": "back"; "required": false; "isSignal": true; }; "closeOnSelect": { "alias": "closeOnSelect"; "required": false; "isSignal": true; }; "messages": { "alias": "messages"; "required": false; "isSignal": true; }; "container": { "alias": "container"; "required": false; "isSignal": true; }; "initialFocus": { "alias": "initialFocus"; "required": false; "isSignal": true; }; "finalFocus": { "alias": "finalFocus"; "required": false; "isSignal": true; }; }, { "open": "openChange"; "openChangeRequest": "openChangeRequest"; "closed": "closed"; }, never, ["*"], true, never>;
+}
+
+/**
+ * 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.
+ */
+declare class SlActionSheetTrigger implements OnInit, OnDestroy {
+    /** The sheet this control opens, reached with a template reference variable. */
+    readonly sheet: _angular_core.InputSignal<SlActionSheet>;
+    private readonly native;
+    protected readonly controls: _angular_core.Signal<string | null>;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    protected press(event: Event): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlActionSheetTrigger, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlActionSheetTrigger, "[slActionSheetTrigger]", ["slActionSheetTrigger"], { "sheet": { "alias": "slActionSheetTrigger"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+declare class SlActionSheetHeader {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlActionSheetHeader, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlActionSheetHeader, "[slActionSheetHeader]", never, {}, {}, never, never, true, never>;
+}
+/** The name of the dialog and of the list. */
+declare class SlActionSheetTitle implements OnInit, OnDestroy {
+    protected readonly sheet: SlActionSheet;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlActionSheetTitle, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlActionSheetTitle, "[slActionSheetTitle]", never, {}, {}, never, never, true, never>;
+}
+/** The dialog's description. */
+declare class SlActionSheetMessage implements OnInit, OnDestroy {
+    protected readonly sheet: SlActionSheet;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlActionSheetMessage, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlActionSheetMessage, "[slActionSheetMessage]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * 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.
+ */
+declare class SlActionSheetList implements OnInit, AfterContentChecked {
+    private readonly sheet;
+    private readonly element;
+    private roving;
+    private readonly typeahead;
+    protected readonly labelledBy: _angular_core.Signal<string | null>;
+    constructor();
+    ngOnInit(): void;
+    /** An item added, removed or disabled moves the stop. */
+    ngAfterContentChecked(): void;
+    private items;
+    /** Focus that arrived by the pointer or by entry moves the stop with it. */
+    protected onFocusIn(event: FocusEvent): void;
+    protected onKeyDown(event: KeyboardEvent): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlActionSheetList, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlActionSheetList, "[slActionSheetList]", ["slActionSheetList"], {}, {}, never, never, true, never>;
+}
+declare class SlActionSheetGroupLabel {
+    readonly id: string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlActionSheetGroupLabel, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlActionSheetGroupLabel, "[slActionSheetGroupLabel]", never, {}, {}, never, never, true, never>;
+}
+/** A run of related actions, named by the label it holds. */
+declare class SlActionSheetGroup {
+    protected readonly label: _angular_core.Signal<SlActionSheetGroupLabel | undefined>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlActionSheetGroup, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlActionSheetGroup, "[slActionSheetGroup]", never, {}, {}, ["label"], never, true, never>;
+}
+declare class SlActionSheetSeparator {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlActionSheetSeparator, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlActionSheetSeparator, "hr[slActionSheetSeparator]", never, {}, {}, never, never, true, never>;
+}
+/** The item's visual. Hidden from assistive technology: the label names the action. */
+declare class SlActionSheetItemIcon {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlActionSheetItemIcon, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlActionSheetItemIcon, "[slActionSheetItemIcon]", never, {}, {}, never, never, true, never>;
+}
+/** The item's second line, which describes the action rather than naming it. */
+declare class SlActionSheetItemDescription {
+    readonly id: string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlActionSheetItemDescription, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlActionSheetItemDescription, "[slActionSheetItemDescription]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * 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.
+ */
+declare class SlActionSheetItem {
+    /** What the close carries as its `result` when this item is chosen. */
+    readonly value: _angular_core.InputSignal<string | undefined>;
+    /** What typeahead matches on, when the visible label is not the word. */
+    readonly textValue: _angular_core.InputSignal<string | undefined>;
+    readonly tone: _angular_core.InputSignal<ActionSheetTone | undefined>;
+    readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** The action is running: the item refuses a second press and the sheet stays open. */
+    readonly loading: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    readonly closeOnSelect: _angular_core.InputSignalWithTransform<boolean | undefined, string | boolean | undefined>;
+    readonly select: _angular_core.OutputEmitterRef<ActionSheetSelectEvent>;
+    private readonly sheet;
+    private readonly element;
+    protected readonly isLink: boolean;
+    protected readonly description: _angular_core.Signal<SlActionSheetItemDescription | undefined>;
+    protected readonly inert: _angular_core.Signal<boolean>;
+    protected onClick(event: Event): void;
+    /**
+     * 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.
+     */
+    protected onPointerMove(event: Event): void;
+    protected onPointerLeave(event: Event): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlActionSheetItem, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SlActionSheetItem, "button[slActionSheetItem], a[slActionSheetItem]", ["slActionSheetItem"], { "value": { "alias": "value"; "required": false; "isSignal": true; }; "textValue": { "alias": "textValue"; "required": false; "isSignal": true; }; "tone": { "alias": "tone"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "closeOnSelect": { "alias": "closeOnSelect"; "required": false; "isSignal": true; }; }, { "select": "select"; }, ["description"], ["[slActionSheetItemIcon]", "*", "[slActionSheetItemDescription]"], true, never>;
+}
+/** The band that holds the cancel. */
+declare class SlActionSheetFooter {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlActionSheetFooter, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlActionSheetFooter, "[slActionSheetFooter]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * 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`.
+ */
+declare class SlActionSheetCancel {
+    protected readonly sheet: SlActionSheet;
+    protected onClick(event: Event): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlActionSheetCancel, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SlActionSheetCancel, "button[slActionSheetCancel]", never, {}, {}, never, ["*"], true, never>;
+}
+/** Every part, for a standalone component's `imports`. */
+declare const SL_ACTION_SHEET: readonly [typeof SlActionSheet, typeof SlActionSheetTrigger, typeof SlActionSheetHeader, typeof SlActionSheetTitle, typeof SlActionSheetMessage, typeof SlActionSheetList, typeof SlActionSheetGroup, typeof SlActionSheetGroupLabel, typeof SlActionSheetSeparator, typeof SlActionSheetItem, typeof SlActionSheetItemIcon, typeof SlActionSheetItemDescription, typeof SlActionSheetFooter, typeof SlActionSheetCancel];
+
+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 };
+export type { ActionSheetChangeRequest, ActionSheetDefaults, ActionSheetDismissPolicy, ActionSheetMount, ActionSheetOpenReason, ActionSheetSelectEvent, ActionSheetTone };
+//# sourceMappingURL=slotted-angular-action-sheet.d.ts.map

package/types/slotted-angular-action-sheet.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"slotted-angular-action-sheet.d.ts","sources":["../../action-sheet/src/action-sheet-defaults.ts","../../action-sheet/src/action-sheet.ts","../../action-sheet/src/action-sheet-parts.ts"],"mappings":"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","names":[]}

package/types/slotted-angular-alert.d.ts

@@ -0,0 +1,214 @@
+import * as _slotted_core_i18n from '@slotted/core/i18n';
+import { PartialMessages, AlertMessages } from '@slotted/core/i18n';
+import * as _angular_core from '@angular/core';
+import { InjectionToken } from '@angular/core';
+import { ChangeRequest } from '@slotted/core/state';
+
+/** Which of the five semantic colours the message speaks in. */
+type AlertTone = 'accent' | 'secondary' | 'success' | 'warning' | 'danger';
+/** How that colour is painted. `soft` is the tinted box an alert usually is. */
+type AlertVariant = 'soft' | 'outline' | 'solid';
+/**
+ * The scope the message applies to, which is the guide's three recipes as one
+ * axis: an alert beside the thing it is about, a callout inside a section, a
+ * banner across a page.
+ */
+type AlertReach = 'inline' | 'section' | 'page';
+/**
+ * Whether the message announces itself, and how loudly. `off` is the default,
+ * because the WAI-ARIA APG records that screen readers do not inform users of
+ * alerts already present when the page finishes loading.
+ */
+type AlertLive = 'off' | 'polite' | 'assertive';
+interface AlertDefaults {
+    live: AlertLive;
+    reach: AlertReach;
+    tone: AlertTone;
+    variant: AlertVariant;
+}
+declare const ALERT_DEFAULTS: InjectionToken<AlertDefaults>;
+/**
+ * An application decides once how its messages are painted, at what reach and
+ * how loud, rather than repeating the same inputs on every alert in a settings
+ * page. An alert that states any of them itself still wins: an explicit input is
+ * never overridden by the token. The dismiss control's name comes from the
+ * language in force (`provideSlotted`).
+ */
+declare function provideAlertDefaults(defaults: Partial<AlertDefaults>): {
+    provide: InjectionToken<AlertDefaults>;
+    useFactory: () => AlertDefaults;
+};
+/** What an alert renders as here, before it states anything of its own. */
+declare function injectAlertDefaults(): AlertDefaults;
+
+/**
+ * Why the message closed. `dismiss` is the control at its corner;
+ * `programmatic` is the application asking through `exportAs`. `escape` is
+ * deliberately absent: an alert is not a dismissable layer, and one inside a
+ * dialog would swallow the dialog's Escape.
+ */
+type AlertCloseReason = 'dismiss' | 'programmatic';
+/**
+ * A message about the page, a section, or the thing beside it.
+ *
+ * The directive is written on the consumer's own element, and the element it
+ * belongs on is a `section`: named by its own title through `aria-labelledby`,
+ * a `section` is a `region` landmark a reader can jump to, and unnamed it is a
+ * plain grouping element that costs nothing.
+ *
+ * **The box is not the live region.** MDN's `alert` role reference states that
+ * the role "should only be used for text content, not interactive elements such
+ * as links or buttons", and every alert worth shipping has a dismiss control.
+ * `slAlertContent` is what announces, and it holds the title and the
+ * description alone; the actions and the dismiss control are its siblings.
+ *
+ * **Closing hides rather than removes.** A live region has to be in the
+ * document before its text changes, so an alert that removed itself could not
+ * announce the second time the message arrived — and `data-open` is only a
+ * state a consumer can style if the element is there to carry it.
+ */
+/**
+ * A mark the page supplies instead of the tone's own. It is projected into the
+ * box the family draws, so it keeps the size, the colour and the place on the
+ * message's first line that the tone's own mark would have had.
+ */
+declare class SlAlertIcon {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlAlertIcon, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlAlertIcon, "[slAlertIcon]", ["slAlertIcon"], {}, {}, never, never, true, never>;
+}
+declare class SlAlert {
+    /** Defaults to the provider, then to `accent`. */
+    readonly tone: _angular_core.InputSignal<AlertTone | undefined>;
+    /** Defaults to the provider, then to `soft`. */
+    readonly variant: _angular_core.InputSignal<AlertVariant | undefined>;
+    /** Defaults to the provider, then to `section`. */
+    readonly reach: _angular_core.InputSignal<AlertReach | undefined>;
+    /** Defaults to the provider, then to `off`. */
+    readonly live: _angular_core.InputSignal<AlertLive | undefined>;
+    /** Draws no mark at all, for a callout carrying its own artwork. */
+    readonly hideIcon: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Renders the control that closes the message. React reads the same fact from
+     * whether a handler was passed; Angular cannot see whether an output was
+     * subscribed, so the opt-in is stated — the asymmetry `tag` recorded.
+     */
+    readonly dismissible: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Words laid over the catalog of the language in force, key by key: what that control announces (`dismiss`). */
+    readonly messages: _angular_core.InputSignal<PartialMessages<AlertMessages> | undefined>;
+    /** Present means controlled, for the life of the component. */
+    readonly open: _angular_core.InputSignalWithTransform<boolean | undefined, string | boolean | undefined>;
+    /** The openness an uncontrolled alert starts from, read once. */
+    readonly defaultOpen: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Returns the keyboard to where it came from when the message closes with
+     * focus inside it. Nothing moves when focus was never there.
+     */
+    readonly restoreFocus: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * One output for one transition, carrying the value, the value it replaces,
+     * the reason, the originating event and `cancel()`. There is no `[(open)]`
+     * because a two-way binding has one slot and cannot carry any of those.
+     */
+    readonly openChange: _angular_core.OutputEmitterRef<ChangeRequest<boolean>>;
+    private readonly defaults;
+    /** The family's words in the language in force, with this alert's `messages` laid over them. */
+    readonly t: _slotted_core_i18n.FamilyTranslator<AlertMessages>;
+    private readonly host;
+    /** An explicit tab index the consumer wrote is never replaced by the family's. */
+    protected readonly writtenTabIndex: string | null;
+    /** The identifier the title writes, and the box is named by. */
+    readonly titleId: string;
+    private readonly own;
+    private readonly titlePresent;
+    /**
+     * Where the keyboard came from, and whether it is here now. Both are read at
+     * the moment the message closes, when the element focus was on may already be
+     * gone — so they are remembered as focus crosses the boundary rather than
+     * looked up in the DOM afterwards.
+     */
+    private cameFrom;
+    private holdsFocus;
+    protected readonly resolvedTone: _angular_core.Signal<AlertTone>;
+    protected readonly glyph: _angular_core.Signal<"check" | "minus" | "plus" | "dot" | "x" | "ellipsis" | "copy" | "eye" | "eye-off" | "chevron-right" | "chevron-down" | "chevrons-right" | "panel-open" | "panel-close" | "arrow-left" | "pin" | "pin-off" | "external" | "calendar" | "clock" | "person" | "circle" | "circle-info" | "circle-check" | "triangle-alert" | "circle-alert" | "circle-x" | "circle-question" | "inbox" | "search" | "search-x" | "lock" | "caps-lock" | "arrow-up" | "stop" | "paperclip" | "pipette" | "cloud-off" | "loader-circle" | "maximize" | "minimize" | "upload" | "file" | "trash" | "play" | "pause" | "rotate-ccw" | "file-image" | "file-text" | "file-spreadsheet" | "file-audio" | "file-video" | "file-archive" | "file-type" | "presentation" | "text-wrap" | "bell" | "trending-up" | "image-off" | "funnel" | "grip-vertical" | "grip-horizontal" | "star" | "check-check" | null>;
+    /** A mark the page projected, which draws even where the tone has none. */
+    protected readonly suppliedIcon: _angular_core.Signal<SlAlertIcon | undefined>;
+    protected readonly resolvedVariant: _angular_core.Signal<AlertVariant>;
+    protected readonly resolvedReach: _angular_core.Signal<AlertReach>;
+    readonly resolvedLive: _angular_core.Signal<AlertLive>;
+    readonly isOpen: _angular_core.Signal<boolean>;
+    /**
+     * A `section` with an `aria-labelledby` pointing at nothing has no accessible
+     * name and is not a landmark, so the attribute is written only once a title
+     * has said it exists.
+     */
+    protected readonly labelledBy: _angular_core.Signal<string | null>;
+    constructor();
+    /** Called by `slAlertTitle`, which is the part that names the box. */
+    registerTitle(present: boolean): void;
+    /** Sends the keyboard to the message. The family never does this by itself. */
+    focus(): void;
+    /**
+     * Asks to open or close, carrying `programmatic` as the reason. It is the
+     * reach a template has and React does not: JSX can re-render an input, and an
+     * Angular template can only call a method on the instance `exportAs` gives it.
+     */
+    setOpen(next: boolean): void;
+    protected onDismiss(event: MouseEvent): void;
+    protected onFocusIn(event: FocusEvent): void;
+    protected onFocusOut(event: FocusEvent): void;
+    private request;
+    private restore;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlAlert, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SlAlert, "[slAlert]", ["slAlert"], { "tone": { "alias": "tone"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "reach": { "alias": "reach"; "required": false; "isSignal": true; }; "live": { "alias": "live"; "required": false; "isSignal": true; }; "hideIcon": { "alias": "hideIcon"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; "messages": { "alias": "messages"; "required": false; "isSignal": true; }; "open": { "alias": "open"; "required": false; "isSignal": true; }; "defaultOpen": { "alias": "defaultOpen"; "required": false; "isSignal": true; }; "restoreFocus": { "alias": "restoreFocus"; "required": false; "isSignal": true; }; }, { "openChange": "openChange"; }, ["suppliedIcon"], ["[slAlertIcon]", "*"], true, never>;
+}
+
+/**
+ * The message itself, and the only part that announces.
+ *
+ * It is written explicitly rather than wrapped around the alert's projected
+ * content, because a box that guessed which of its children were text would be
+ * guessing about the one thing a reader hears. Fluent's `MessageBarBody` is the
+ * only surveyed implementation with the same shape, and it is the only one
+ * whose region excludes its own controls.
+ */
+declare class SlAlertContent {
+    private readonly alert;
+    protected readonly role: _angular_core.Signal<string | null>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlAlertContent, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlAlertContent, "[slAlertContent]", ["slAlertContent"], {}, {}, never, never, true, never>;
+}
+/**
+ * The message's name, and the box's.
+ *
+ * The element is the consumer's: a heading puts the alert in the document
+ * outline, which is right for a page banner and wrong for the alert beside a
+ * field group, and only the page knows which. Writing `<h3 slAlertTitle>` is
+ * how a page that wants one says so, and Angular needs no `render` prop to
+ * allow it.
+ */
+declare class SlAlertTitle {
+    protected readonly alert: SlAlert;
+    constructor();
+    ngOnDestroy(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlAlertTitle, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SlAlertTitle, "[slAlertTitle]", ["slAlertTitle"], {}, {}, never, ["*"], true, never>;
+}
+/** The message. Written on the consumer's own `p`, which is what prose is. */
+declare class SlAlertDescription {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlAlertDescription, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlAlertDescription, "[slAlertDescription]", ["slAlertDescription"], {}, {}, never, never, true, never>;
+}
+/**
+ * The controls that act on the message, outside the region that announces: a
+ * reader hearing the message is not read the labels of two buttons in the
+ * middle of it. What goes in is the consumer's own buttons, because `button`
+ * already owns what a button is.
+ */
+declare class SlAlertActions {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlAlertActions, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlAlertActions, "[slAlertActions]", ["slAlertActions"], {}, {}, never, never, true, never>;
+}
+
+export { ALERT_DEFAULTS, SlAlert, SlAlertActions, SlAlertContent, SlAlertDescription, SlAlertIcon, SlAlertTitle, injectAlertDefaults, provideAlertDefaults };
+export type { AlertCloseReason, AlertDefaults, AlertLive, AlertReach, AlertTone, AlertVariant };
+//# sourceMappingURL=slotted-angular-alert.d.ts.map

package/types/slotted-angular-alert.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"slotted-angular-alert.d.ts","sources":["../../alert/src/alert-defaults.ts","../../alert/src/alert.ts","../../alert/src/alert-parts.ts"],"mappings":";;;;;;AAEA;AACM,KAAM,SAAS;AAErB;AACM,KAAM,YAAY;AAExB;;;;AAIG;AACG,KAAM,UAAU;AAEtB;;;;AAIG;AACG,KAAM,SAAS;UAEJ,aAAa;UACtB,SAAS;WACR,UAAU;UACX,SAAS;aACN,YAAY;AACtB;AASD,cAAa,cAAc,EAAA,cAAA,CAAA,aAAA;AAK3B;;;;;;AAMG;AACH,iBAAgB,oBAAoB,WAAW,OAAO,CAAC,aAAa;;sBAGhD,aAAa;AAOhC;AAED;AACA,iBAAgB,mBAAmB,IAAI,aAAa;;ACjBpD;;;;;AAKG;KACS,gBAAgB;AAE5B;;;;;;;;;;;;;;;;;;AAkBG;AACH;;;;AAIG;AACH,cAKa,WAAW;oDAAX,WAAW;sDAAX,WAAW;AAAG;AAE3B,cA0Ca,OAAO;;mBAEL,aAAA,CAAA,WAAA,CAAA,SAAA;;sBAEG,aAAA,CAAA,WAAA,CAAA,YAAA;;oBAEF,aAAA,CAAA,WAAA,CAAA,UAAA;;mBAED,aAAA,CAAA,WAAA,CAAA,SAAA;;uBAEI,aAAA,CAAA,wBAAA;AACjB;;;;AAIG;0BACiB,aAAA,CAAA,wBAAA;;uBAEH,aAAA,CAAA,WAAA,CAAA,eAAA,CAAA,aAAA;;mBAEJ,aAAA,CAAA,wBAAA;;0BAIO,aAAA,CAAA,wBAAA;AACpB;;;AAGG;2BACkB,aAAA,CAAA,wBAAA;AAErB;;;;AAIG;yBACgB,aAAA,CAAA,gBAAA,CAAA,aAAA;AAEnB;;gBAEU,kBAAA,CAAA,gBAAA,CAAA,aAAA;AACV;;AAEA;;;AAOA;AACA;AAEA;;;;;AAKG;;;AAIH,qCAA+B,aAAA,CAAA,MAAA,CAAA,SAAA;AAC/B,8BAAwB,aAAA,CAAA,MAAA;;AAExB,qCAA+B,aAAA,CAAA,MAAA,CAAA,WAAA;AAC/B,wCAAkC,aAAA,CAAA,MAAA,CAAA,YAAA;AAClC,sCAAgC,aAAA,CAAA,MAAA,CAAA,UAAA;2BACX,aAAA,CAAA,MAAA,CAAA,SAAA;qBAEN,aAAA,CAAA,MAAA;AAEf;;;;AAIG;AACH,mCAA6B,aAAA,CAAA,MAAA;;;;;;AAuB7B;;;;AAIG;;AAKH,+BAA2B,UAAU;AAOrC,+BAA2B,UAAU;AAQrC,gCAA4B,UAAU;AAOtC;AAUA;oDA7IW,OAAO;sDAAP,OAAO;AAoJnB;;AC1PD;;;;;;;;AAQG;AACH,cASa,cAAc;AACzB;AAEA,6BAAuB,aAAA,CAAA,MAAA;oDAHZ,cAAc;sDAAd,cAAc;AAI1B;AAED;;;;;;;;AAQG;AACH,cAYa,YAAY;AACvB,8BAAwB,OAAA;;;oDADb,YAAY;sDAAZ,YAAY;AAUxB;AAED;AACA,cAMa,kBAAkB;oDAAlB,kBAAkB;sDAAlB,kBAAkB;AAAG;AAElC;;;;;AAKG;AACH,cAMa,cAAc;oDAAd,cAAc;sDAAd,cAAc;AAAG;;","names":[]}