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

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

@@ -0,0 +1,166 @@
+import * as _angular_core from '@angular/core';
+import { InjectionToken } from '@angular/core';
+
+/** Which of the five semantic colours the badge speaks in. */
+type BadgeTone = 'accent' | 'secondary' | 'success' | 'warning' | 'danger';
+/** How that colour is painted. `soft` is the tinted chip a badge usually is. */
+type BadgeVariant = 'solid' | 'soft' | 'outline';
+type BadgeSize = 'sm' | 'md' | 'lg';
+/** `dot` is the same badge, tone and hidden text, drawn without a value. */
+type BadgeShape = 'pill' | 'square' | 'dot';
+/** Whether a changing badge is announced, and how urgently. */
+type BadgeLive = 'off' | 'polite' | 'assertive';
+type BadgePlacement = 'top-end' | 'top-start' | 'bottom-end' | 'bottom-start';
+/** The shape of the host, which decides how far in from the corner to sit. */
+type BadgeOverlap = 'rectangle' | 'circle';
+/**
+ * The page's own correction of the corner, in CSS pixels.
+ *
+ * `x` runs along the inline axis, from the leading edge towards the trailing
+ * one, so it mirrors with the document: a badge moved two pixels back along it
+ * keeps the same relation to its host in a right-to-left page. `y` runs down
+ * the block axis. Both default to nought.
+ */
+interface BadgeOffset {
+    x?: number | undefined;
+    y?: number | undefined;
+}
+interface BadgeDefaults {
+    /** BCP 47. Absent, the runtime's own default writes the digits. */
+    locale: string | undefined;
+    max: number | false;
+    shape: BadgeShape;
+    size: BadgeSize;
+    tone: BadgeTone;
+    variant: BadgeVariant;
+}
+declare const BADGE_DEFAULTS: InjectionToken<BadgeDefaults>;
+/**
+ * An application decides once how its badges are painted, how large they are
+ * and — the one that matters most — which locale writes their digits, rather
+ * than repeating five inputs on every badge. A badge that states any of them
+ * itself still wins: an explicit input is never overridden by the token.
+ */
+declare function provideBadgeDefaults(defaults: Partial<BadgeDefaults>): {
+    provide: InjectionToken<BadgeDefaults>;
+    useFactory: () => BadgeDefaults;
+};
+/** What a badge renders as here, before it states anything of its own. */
+declare function injectBadgeDefaults(): BadgeDefaults;
+
+/**
+ * A short, non-editable piece of metadata: a count, a status, a label. It is
+ * never a command — it answers no hover and gives no press feedback — and it
+ * carries no role of its own, because what a badge means comes from where it
+ * sits.
+ *
+ * The directive is written on the element the page chose, so a `span` in a
+ * sentence, a `dd` in a description list and an `a` that navigates are all the
+ * same badge.
+ *
+ * `count` is the one place the family does work rather than paint. The ceiling
+ * above which a count becomes `99+`, whether nought is a value or an absence,
+ * and which locale writes the digits are three decisions every consumer would
+ * otherwise take again, and `@slotted/core/count` is where both bindings take
+ * them once.
+ */
+declare class SlBadge {
+    /** Defaults to the provider, then to `secondary`. */
+    readonly tone: _angular_core.InputSignal<BadgeTone | undefined>;
+    /** Defaults to the provider, then to `soft`. */
+    readonly variant: _angular_core.InputSignal<BadgeVariant | undefined>;
+    /** Defaults to the provider, then to `md`. */
+    readonly size: _angular_core.InputSignal<BadgeSize | undefined>;
+    /** `dot` draws no value; the words it cannot say are projected content. */
+    readonly shape: _angular_core.InputSignal<BadgeShape | undefined>;
+    /**
+     * Whether a change to this badge is announced, and how urgently. `off` by
+     * default: a page of twenty badges that all announce is a page no screen
+     * reader user can read.
+     */
+    readonly live: _angular_core.InputSignal<BadgeLive>;
+    /** The number the badge shows, written before any projected content. */
+    readonly count: _angular_core.InputSignal<number | undefined>;
+    /**
+     * The largest count written in full; above it the badge shows the ceiling and
+     * a `+`. `false` removes the ceiling. Defaults to the provider, then to `99`.
+     */
+    readonly max: _angular_core.InputSignal<number | false | undefined>;
+    /** Whether a count of nought is a value worth showing or an absence worth hiding. */
+    readonly showZero: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** BCP 47, for the digits of `count`. Defaults to the provider, then to the runtime. */
+    readonly locale: _angular_core.InputSignal<string | undefined>;
+    private readonly defaults;
+    /** An explicit role the consumer wrote is never replaced by an inferred one. */
+    private readonly writtenRole;
+    protected readonly resolvedTone: _angular_core.Signal<BadgeTone>;
+    protected readonly resolvedVariant: _angular_core.Signal<BadgeVariant>;
+    protected readonly resolvedSize: _angular_core.Signal<BadgeSize>;
+    protected readonly resolvedShape: _angular_core.Signal<BadgeShape>;
+    protected readonly role: _angular_core.Signal<string | null>;
+    private readonly counted;
+    /**
+     * A count that has fallen to nought leaves the corner rather than sitting
+     * there as a blank circle. A badge given no count at all is untouched by the
+     * rule: an empty `dot` is the whole point of that shape.
+     */
+    protected readonly empty: _angular_core.Signal<boolean>;
+    /** A dot draws no value at any size. */
+    protected readonly value: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlBadge, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SlBadge, "[slBadge]", ["slBadge"], { "tone": { "alias": "tone"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "shape": { "alias": "shape"; "required": false; "isSignal": true; }; "live": { "alias": "live"; "required": false; "isSignal": true; }; "count": { "alias": "count"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "showZero": { "alias": "showZero"; "required": false; "isSignal": true; }; "locale": { "alias": "locale"; "required": false; "isSignal": true; }; }, {}, never, ["[slBadgeStart]", "*", "[slBadgeEnd]"], true, never>;
+}
+
+/**
+ * The frame that places a badge on the corner of something else. It is written
+ * on the element the page already has around the host — a `span`, a `div`, the
+ * `li` of a list — rather than wrapping it, which is the one place this binding
+ * is the smaller of the two: React must render a wrapper of its own.
+ *
+ * It does not rewrite the host's semantics. The badge is read after the host in
+ * document order, and an interactive host whose name must carry the count wires
+ * `aria-describedby` to the badge's own id, or names the count in its own
+ * `aria-label`. Both wirings are on the reference page.
+ */
+declare class SlBadgeAnchor {
+    /** Which corner of the host the badge sits on. Mirrors in a right-to-left document. */
+    readonly placement: _angular_core.InputSignal<BadgePlacement | undefined>;
+    /** `circle` moves the badge in from the corner far enough to meet the curve. */
+    readonly overlap: _angular_core.InputSignal<BadgeOverlap | undefined>;
+    /**
+     * Moves the badge off the corner the frame computed, in pixels. `overlap` has
+     * two values and hosts have many: how far a badge sits into one depends on
+     * that host's own curve, shadow and optical weight.
+     */
+    readonly offset: _angular_core.InputSignal<BadgeOffset | undefined>;
+    protected readonly resolvedPlacement: _angular_core.Signal<BadgePlacement>;
+    protected readonly resolvedOverlap: _angular_core.Signal<BadgeOverlap>;
+    /**
+     * An axis the page did not state is `null`, which removes the property rather
+     * than writing nought into it: the sheet's own default is what answers, and a
+     * theme that moves it still wins.
+     */
+    protected readonly offsetX: _angular_core.Signal<string | null>;
+    protected readonly offsetY: _angular_core.Signal<string | null>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlBadgeAnchor, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlBadgeAnchor, "[slBadgeAnchor]", ["slBadgeAnchor"], { "placement": { "alias": "placement"; "required": false; "isSignal": true; }; "overlap": { "alias": "overlap"; "required": false; "isSignal": true; }; "offset": { "alias": "offset"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * A glyph before the words. The artwork is the consumer's, and the part gives
+ * it a box that is sized and centred; the directive is written on the element
+ * the page already has, so nothing is wrapped.
+ */
+declare class SlBadgeStart {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlBadgeStart, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlBadgeStart, "[slBadgeStart]", ["slBadgeStart"], {}, {}, never, never, true, never>;
+}
+/** A glyph after the words. */
+declare class SlBadgeEnd {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlBadgeEnd, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlBadgeEnd, "[slBadgeEnd]", ["slBadgeEnd"], {}, {}, never, never, true, never>;
+}
+
+export { BADGE_DEFAULTS, SlBadge, SlBadgeAnchor, SlBadgeEnd, SlBadgeStart, injectBadgeDefaults, provideBadgeDefaults };
+export type { BadgeDefaults, BadgeLive, BadgeOffset, BadgeOverlap, BadgePlacement, BadgeShape, BadgeSize, BadgeTone, BadgeVariant };
+//# sourceMappingURL=slotted-angular-badge.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"slotted-angular-badge.d.ts","sources":["../../badge/src/badge-defaults.ts","../../badge/src/badge.ts","../../badge/src/badge-anchor.ts","../../badge/src/badge-content.ts"],"mappings":";;;AAEA;AACM,KAAM,SAAS;AAErB;AACM,KAAM,YAAY;AAElB,KAAM,SAAS;AAErB;AACM,KAAM,UAAU;AAEtB;AACM,KAAM,SAAS;AAEf,KAAM,cAAc;AAE1B;KACY,YAAY;AAExB;;;;;;;AAOG;UACc,WAAW;AAC1B;AACA;AACD;UAEgB,aAAa;;AAE5B;AACA;WACO,UAAU;UACX,SAAS;UACT,SAAS;aACN,YAAY;AACtB;AAWD,cAAa,cAAc,EAAA,cAAA,CAAA,aAAA;AAK3B;;;;;AAKG;AACH,iBAAgB,oBAAoB,WAAW,OAAO,CAAC,aAAa;;sBAGhD,aAAa;AAShC;AAED;AACA,iBAAgB,mBAAmB,IAAI,aAAa;;ACnDpD;;;;;;;;;;;;;;;AAeG;AACH,cAmCa,OAAO;;mBAEL,aAAA,CAAA,WAAA,CAAA,SAAA;;sBAEG,aAAA,CAAA,WAAA,CAAA,YAAA;;mBAEH,aAAA,CAAA,WAAA,CAAA,SAAA;;oBAEC,aAAA,CAAA,WAAA,CAAA,UAAA;AACd;;;;AAIG;mBACU,aAAA,CAAA,WAAA,CAAA,SAAA;;oBAEC,aAAA,CAAA,WAAA;AACd;;;AAGG;kBACS,aAAA,CAAA,WAAA;;uBAEK,aAAA,CAAA,wBAAA;;qBAEF,aAAA,CAAA,WAAA;AAEf;;AAEA;AAEA,qCAA+B,aAAA,CAAA,MAAA,CAAA,SAAA;AAC/B,wCAAkC,aAAA,CAAA,MAAA,CAAA,YAAA;AAClC,qCAA+B,aAAA,CAAA,MAAA,CAAA,SAAA;AAC/B,sCAAgC,aAAA,CAAA,MAAA,CAAA,UAAA;AAEhC,6BAAuB,aAAA,CAAA,MAAA;AAEvB;AAWA;;;;AAIG;AACH,8BAAwB,aAAA,CAAA,MAAA;;AAKxB,8BAAwB,aAAA,CAAA,MAAA;oDA3Db,OAAO;sDAAP,OAAO;AA8DnB;;ACzID;;;;;;;;;;AAUG;AACH,cAaa,aAAa;;wBAEN,aAAA,CAAA,WAAA,CAAA,cAAA;;sBAEF,aAAA,CAAA,WAAA,CAAA,YAAA;AAChB;;;;AAIG;qBACY,aAAA,CAAA,WAAA,CAAA,WAAA;AAEf,0CAAoC,aAAA,CAAA,MAAA,CAAA,cAAA;AACpC,wCAAkC,aAAA,CAAA,MAAA,CAAA,YAAA;AAClC;;;;AAIG;AACH,gCAA0B,aAAA,CAAA,MAAA;AAC1B,gCAA0B,aAAA,CAAA,MAAA;oDApBf,aAAa;sDAAb,aAAa;AAqBzB;;AC/CD;;;;AAIG;AACH,cAMa,YAAY;oDAAZ,YAAY;sDAAZ,YAAY;AAAG;AAE5B;AACA,cAMa,UAAU;oDAAV,UAAU;sDAAV,UAAU;AAAG;;","names":[]}

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

@@ -0,0 +1,251 @@
+import * as _slotted_core_i18n from '@slotted/core/i18n';
+import { PartialMessages, BreadcrumbMessages } from '@slotted/core/i18n';
+import * as _angular_core from '@angular/core';
+import { InjectionToken, TemplateRef } from '@angular/core';
+import { ChangeRequest } from '@slotted/core/state';
+
+/**
+ * What a trail does with crumbs its width cannot hold. `collapse` folds the
+ * middle ones into the ellipsis; `wrap` lets the row break onto a second line
+ * and only the count collapses.
+ */
+type BreadcrumbOverflow = 'collapse' | 'wrap';
+/** Why the trail expanded. Only two things can ask: a press and a key. */
+type BreadcrumbExpandReason = 'pointer' | 'keyboard';
+/**
+ * What every trail on the page does before it states anything of its own. The
+ * three collapse numbers are here because how deep a trail may get before it
+ * folds is a decision about the application rather than about one page.
+ */
+interface BreadcrumbDefaults {
+    itemsAfterCollapse?: number;
+    itemsBeforeCollapse?: number;
+    maxItems?: number;
+    overflow?: BreadcrumbOverflow;
+    /** The mark drawn between two crumbs, rendered once per item. */
+    separator?: TemplateRef<unknown>;
+}
+declare const BREADCRUMB_DEFAULT_MAX_ITEMS = 8;
+declare const BREADCRUMB_DEFAULT_ITEMS_BEFORE = 1;
+declare const BREADCRUMB_DEFAULT_ITEMS_AFTER = 2;
+declare const BREADCRUMB_DEFAULT_OVERFLOW: BreadcrumbOverflow;
+declare const BREADCRUMB_DEFAULTS_TOKEN: InjectionToken<BreadcrumbDefaults>;
+/**
+ * An application decides once how deep its trails may get before they fold,
+ * whether they fold for want of width, and what is drawn between two crumbs. A
+ * trail that states any of those itself still wins: an explicit input is never
+ * overridden by the token. Its words come from the language in force
+ * (`provideSlotted`).
+ */
+declare function provideBreadcrumbDefaults(defaults: BreadcrumbDefaults): {
+    provide: InjectionToken<BreadcrumbDefaults>;
+    useValue: BreadcrumbDefaults;
+};
+declare function injectBreadcrumbDefaults(): BreadcrumbDefaults;
+/**
+ * Which crumbs survive a collapse, as indices into the trail. Shared with the
+ * React binding's own copy through the tests that assert the same table, and
+ * deliberately not shared through `@slotted/core`: it is four lines, and a core
+ * module exists for arithmetic two bindings would otherwise get *differently*
+ * wrong, not for arithmetic they would each get right.
+ */
+declare function collapsedRange(count: number, before: number, after: number): {
+    start: number;
+    end: number;
+} | undefined;
+
+/**
+ * The trail of ancestors above the current page.
+ *
+ * **The landmark and the list are the platform's.** `nav` makes the trail
+ * findable and `ol` carries the hierarchy and the set size, which is the whole
+ * of the APG's Breadcrumb pattern: it lists no keyboard interaction and two
+ * attributes, and both are written here rather than reimplemented.
+ *
+ * **The collapse expands in place.** An overlay would need a layer, a
+ * positioner and a dismissal policy; this needs none of them. The hidden
+ * crumbs carry `hidden`, so they leave the accessibility tree with the page,
+ * and the button that hides them names the count.
+ *
+ * **A trail that does not fit folds.** With `overflow="collapse"` the list
+ * measures itself and folds the middle crumbs its width cannot hold into the
+ * same ellipsis, nearest the root first; what folded is read from the layout
+ * and reported in `data-collapsed`, not owned by anyone.
+ *
+ * **It is a component on the consumer's own `nav`.** A directive carries no
+ * `styleUrl`, and the element was never the family's to choose.
+ */
+declare class SlBreadcrumb {
+    /**
+     * Present means controlled, for the life of the component, which is why the
+     * unset value is `undefined` rather than `false`: a family that read `false`
+     * as a consumer's answer would never own its own state.
+     */
+    readonly expandedValue: _angular_core.InputSignalWithTransform<boolean | undefined, string | boolean | undefined>;
+    /** What an uncontrolled trail starts from, read once. */
+    readonly defaultExpanded: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Words laid over the catalog of the language in force, key by key: the
+     * landmark's name (`label`) and the ellipsis. A static `aria-label` still wins.
+     */
+    readonly messages: _angular_core.InputSignal<PartialMessages<BreadcrumbMessages> | undefined>;
+    readonly maxItems: _angular_core.InputSignalWithTransform<number | undefined, string | number | undefined>;
+    readonly itemsBeforeCollapse: _angular_core.InputSignalWithTransform<number | undefined, string | number | undefined>;
+    readonly itemsAfterCollapse: _angular_core.InputSignalWithTransform<number | undefined, string | number | undefined>;
+    readonly separator: _angular_core.InputSignal<TemplateRef<unknown> | undefined>;
+    /** What the trail does with crumbs its width cannot hold. */
+    readonly overflow: _angular_core.InputSignal<BreadcrumbOverflow | undefined>;
+    /** How many crumbs are folded into the ellipsis, written by the list. */
+    readonly collapsedCount: _angular_core.WritableSignal<number>;
+    /**
+     * Emitted before the trail expands, carrying the value it replaces, the
+     * reason and the event it came from. It is not the second half of
+     * `[(expanded)]`: a two-way binding has one slot and can carry none of those.
+     */
+    readonly expandedChange: _angular_core.OutputEmitterRef<ChangeRequest<boolean>>;
+    private readonly own;
+    readonly expanded: _angular_core.Signal<boolean>;
+    private readonly defaults;
+    /** A static `aria-label` the consumer wrote survives the host binding. */
+    private readonly ownLabel;
+    /** The family's words in the language in force, with this trail's `messages` laid over them. */
+    readonly t: _slotted_core_i18n.FamilyTranslator<BreadcrumbMessages>;
+    readonly accessibleLabel: _angular_core.Signal<string>;
+    readonly maxItemsValue: _angular_core.Signal<number>;
+    readonly beforeValue: _angular_core.Signal<number>;
+    readonly afterValue: _angular_core.Signal<number>;
+    readonly separatorValue: _angular_core.Signal<TemplateRef<unknown> | undefined>;
+    readonly overflowValue: _angular_core.Signal<BreadcrumbOverflow>;
+    /**
+     * Where focus goes once the ellipsis stops existing, registered by the list —
+     * the only part that can see which crumb the ellipsis replaced. React reaches
+     * the same crumb through an id it generates; Angular reaches it through the
+     * query it already has, and neither writes anything the other does not.
+     */
+    private focusAfterExpand;
+    registerFocusTarget(focus: (() => void) | undefined): void;
+    private readonly injector;
+    /**
+     * The ellipsis stops existing the moment it is pressed, and focus on a
+     * removed element is lost to the body — so it is given to the first crumb the
+     * expansion revealed. The move waits a microtask because that crumb is still
+     * hidden while this runs.
+     */
+    expand(reason: BreadcrumbExpandReason, source?: Event): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlBreadcrumb, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SlBreadcrumb, "nav[slBreadcrumb]", ["slBreadcrumb"], { "expandedValue": { "alias": "expanded"; "required": false; "isSignal": true; }; "defaultExpanded": { "alias": "defaultExpanded"; "required": false; "isSignal": true; }; "messages": { "alias": "messages"; "required": false; "isSignal": true; }; "maxItems": { "alias": "maxItems"; "required": false; "isSignal": true; }; "itemsBeforeCollapse": { "alias": "itemsBeforeCollapse"; "required": false; "isSignal": true; }; "itemsAfterCollapse": { "alias": "itemsAfterCollapse"; "required": false; "isSignal": true; }; "separator": { "alias": "separator"; "required": false; "isSignal": true; }; "overflow": { "alias": "overflow"; "required": false; "isSignal": true; }; }, { "expandedChange": "expandedChange"; }, never, ["*"], true, never>;
+}
+/**
+ * The ordered list, and the one part that knows how many crumbs there are.
+ *
+ * It queries its items rather than projecting them blindly, because two facts
+ * about a crumb can only be known from the outside: whether it is the last —
+ * the last draws no separator — and whether the count collapse is hiding it.
+ * It also owns the ellipsis, which it places in front of the first crumb that
+ * can fold, and the width collapse.
+ *
+ * That is where the two bindings differ and the DOM does not: React maps its
+ * children, Angular writes the same facts back onto queried items and inserts
+ * the ellipsis's item itself.
+ */
+declare class SlBreadcrumbList {
+    private readonly trail;
+    private readonly items;
+    private readonly host;
+    private readonly injector;
+    private readonly environment;
+    private readonly application;
+    private ellipsis;
+    private collapse;
+    private readonly folded;
+    /**
+     * The range is computed whether or not the trail is expanded, because two
+     * different things read it. The collapse reads it only while folded; the
+     * focus target reads it afterwards, and it has to still be there — the id
+     * used to disappear with the ellipsis, which left focus on a removed button
+     * and therefore on the body.
+     */
+    private readonly range;
+    private readonly counted;
+    /** Whether there is a middle at all: crumbs outside the ones that never fold. */
+    private readonly middle;
+    /**
+     * The width collapse runs only while the count has hidden nothing: a trail
+     * the count already folded shows only the crumbs that never fold. One writer
+     * per `hidden` attribute keeps the two from undoing each other — the item's
+     * host binding writes it for the count, `createCollapse` for the width.
+     */
+    private readonly measuring;
+    readonly hiddenCount: _angular_core.Signal<number>;
+    constructor();
+    /**
+     * Puts the ellipsis's item in front of the first crumb that can fold, or
+     * takes it away, and starts or stops the width measurement.
+     */
+    private place;
+    private ensureEllipsis;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlBreadcrumbList, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlBreadcrumbList, "ol[slBreadcrumbList]", ["slBreadcrumbList"], {}, {}, ["items"], never, true, never>;
+}
+/**
+ * One ancestor, or the current page. It carries the separator after it, so a
+ * consumer writes none and never leaves a trailing one behind.
+ */
+declare class SlBreadcrumbItem {
+    readonly trail: SlBreadcrumb;
+    readonly element: HTMLElement;
+    /** Written by the list, which is the only part that can see the whole trail. */
+    readonly last: _angular_core.WritableSignal<boolean>;
+    readonly collapsed: _angular_core.WritableSignal<boolean>;
+    /** The crumb's own control, whatever the consumer made it. */
+    focus(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlBreadcrumbItem, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SlBreadcrumbItem, "li[slBreadcrumbItem]", ["slBreadcrumbItem"], {}, {}, never, ["*"], true, never>;
+}
+/**
+ * An ancestor that can be reached. The directive sits on the consumer's own
+ * anchor, so the role, `Enter`, the context menu and every modified click are
+ * the platform's — and `routerLink` composes on the same element, because the
+ * element was never the family's to begin with.
+ */
+declare class SlBreadcrumbLink {
+    private readonly element;
+    focus(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlBreadcrumbLink, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlBreadcrumbLink, "a[slBreadcrumbLink]", ["slBreadcrumbLink"], {}, {}, never, never, true, never>;
+}
+/**
+ * The page the reader is on. It is text rather than a link, because a link to
+ * the page you are already on goes nowhere, and it carries `aria-current="page"`
+ * — the value the ARIA specification names for a link within a set of pages.
+ */
+declare class SlBreadcrumbPage {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlBreadcrumbPage, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SlBreadcrumbPage, "[slBreadcrumbPage]", ["slBreadcrumbPage"], {}, {}, never, never, true, never>;
+}
+/**
+ * A crumb that opens a menu of its siblings — the organisation, the project,
+ * the environment. It is a component on the consumer's own `button`, because an
+ * `a` without `href` takes no focus, and it draws the chevron after the label.
+ * The menu composes on the same element:
+ *
+ * ```html
+ * <button slBreadcrumbTrigger current [slMenuTriggerFor]="environments">Production</button>
+ * ```
+ *
+ * `current` keeps `aria-current="page"` on the switcher of the page the reader
+ * is on, which a switcher does not stop being.
+ */
+declare class SlBreadcrumbTrigger {
+    readonly current: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    protected readonly ownType: string | null;
+    protected readonly ownCurrent: string | null;
+    private readonly element;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlBreadcrumbTrigger, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SlBreadcrumbTrigger, "button[slBreadcrumbTrigger]", ["slBreadcrumbTrigger"], { "current": { "alias": "current"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+export { BREADCRUMB_DEFAULTS_TOKEN, BREADCRUMB_DEFAULT_ITEMS_AFTER, BREADCRUMB_DEFAULT_ITEMS_BEFORE, BREADCRUMB_DEFAULT_MAX_ITEMS, BREADCRUMB_DEFAULT_OVERFLOW, SlBreadcrumb, SlBreadcrumbItem, SlBreadcrumbLink, SlBreadcrumbList, SlBreadcrumbPage, SlBreadcrumbTrigger, collapsedRange, injectBreadcrumbDefaults, provideBreadcrumbDefaults };
+export type { BreadcrumbDefaults, BreadcrumbExpandReason, BreadcrumbOverflow };
+//# sourceMappingURL=slotted-angular-breadcrumb.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"slotted-angular-breadcrumb.d.ts","sources":["../../breadcrumb/src/breadcrumb.constants.ts","../../breadcrumb/src/breadcrumb.ts"],"mappings":";;;;;;AAGA;;;;AAIG;KACS,kBAAkB;AAE9B;KACY,sBAAsB;AAElC;;;;AAIG;UACc,kBAAkB;;;;eAItB,kBAAkB;;AAE7B,gBAAY,WAAW;AACxB;AAED,cAAa,4BAA4B;AACzC,cAAa,+BAA+B;AAC5C,cAAa,8BAA8B;AAC3C,cAAa,2BAA2B,EAAE,kBAA+B;AAEzE,cAAa,yBAAyB,EAAA,cAAA,CAAA,kBAAA;AAKtC;;;;;;AAMG;AACH,iBAAgB,yBAAyB,WAAW,kBAAkB;;;AAErE;AAED,iBAAgB,wBAAwB,IAAI,kBAAkB;AAI9D;;;;;;AAMG;AACH,iBAAgB,cAAc;;;AAI7B;;ACZD;;;;;;;;;;;;;;;;;;;;AAoBG;AACH,cAgBa,YAAY;AACvB;;;;AAIG;4BACmB,aAAA,CAAA,wBAAA;;8BAME,aAAA,CAAA,wBAAA;AACxB;;;AAGG;uBACc,aAAA,CAAA,WAAA,CAAA,eAAA,CAAA,kBAAA;uBACA,aAAA,CAAA,wBAAA;kCACW,aAAA,CAAA,wBAAA;iCACD,aAAA,CAAA,wBAAA;wBACT,aAAA,CAAA,WAAA,CAAA,WAAA;;uBAED,aAAA,CAAA,WAAA,CAAA,kBAAA;;6BAGM,aAAA,CAAA,cAAA;AAEvB;;;;AAIG;6BACoB,aAAA,CAAA,gBAAA,CAAA,aAAA;AAEvB;uBACiB,aAAA,CAAA,MAAA;AAEjB;;AAGA;;gBAGU,kBAAA,CAAA,gBAAA,CAAA,kBAAA;8BACc,aAAA,CAAA,MAAA;4BACF,aAAA,CAAA,MAAA;0BAGF,aAAA,CAAA,MAAA;yBAMD,aAAA,CAAA,MAAA;6BAMI,aAAA,CAAA,MAAA,CAAA,WAAA;4BACD,aAAA,CAAA,MAAA,CAAA,kBAAA;AAItB;;;;;AAKG;;;AAOH;AAEA;;;;;AAKG;mBACY,sBAAsB,WAAW,KAAK;oDAtF1C,YAAY;sDAAZ,YAAY;AAsGxB;AAgDD;;;;;;;;;;;;AAYG;AACH,cAMa,gBAAgB;AAC3B;AAIA;AACA;AACA;AACA;AACA;;;AAIA;AAEA;;;;;;AAMG;AACH;AAOA;;AAEA;AAKA;;;;;AAKG;AACH;0BAQoB,aAAA,CAAA,MAAA;;AAkCpB;;;AAGG;AACH;AAgDA;oDAxIW,gBAAgB;sDAAhB,gBAAgB;AAmJ5B;AAED;;;AAGG;AACH,cAqBa,gBAAgB;oBACb,YAAA;AAEd,sBAAkB,WAAW;;mBAGhB,aAAA,CAAA,cAAA;wBACK,aAAA,CAAA,cAAA;;;oDAPP,gBAAgB;sDAAhB,gBAAgB;AAa5B;AAED;;;;;AAKG;AACH,cAMa,gBAAgB;AAC3B;;oDADW,gBAAgB;sDAAhB,gBAAgB;AAM5B;AAED;;;;AAIG;AACH,cASa,gBAAgB;oDAAhB,gBAAgB;sDAAhB,gBAAgB;AAAG;AAEhC;;;;;;;;;;;;AAYG;AACH,cAca,mBAAmB;sBACd,aAAA,CAAA,wBAAA;AAEhB;AACA;AAGA;;oDAPW,mBAAmB;sDAAnB,mBAAmB;AAmB/B;;","names":[]}

package/types/slotted-angular-button-group.d.ts

@@ -0,0 +1,89 @@
+import * as _angular_core from '@angular/core';
+
+type ButtonGroupOrientation = 'horizontal' | 'vertical';
+/**
+ * Across the flow. `auto` is a value rather than an absent one: a joined bar
+ * takes one block size across its flow on either axis, so a consumer who
+ * mixes sizes gets a ragged width rather than a ragged edge, and the four
+ * explicit values are the consumer overruling that.
+ */
+type ButtonGroupAlign = 'auto' | 'start' | 'center' | 'end' | 'stretch';
+/** Along the flow. Asking for it makes the group hold the line it distributes. */
+type ButtonGroupJustify = 'start' | 'center' | 'end' | 'between';
+
+/**
+ * A set of related actions joined into one shape. The group arranges what the
+ * consumer wrote and changes the semantics of nothing inside it: every button
+ * keeps its own role, its own state and its own place in the tab sequence.
+ *
+ * One shape and no other: the buttons share their edges, one border is painted
+ * in each shared column, and only the two ends of the bar are rounded. There
+ * is no input that spaces the buttons apart and none that unjoins them — a
+ * spaced row of buttons is `slInline` or `slStack` holding buttons.
+ *
+ * It is `role="group"` and not `role="toolbar"`, and the difference is a
+ * keyboard model rather than a name. A toolbar is one tab stop with arrow-key
+ * navigation between its controls, which is the `toolbar` family. A consumer
+ * who wrote `role` on the element keeps it, read before the host binding is
+ * written, so the role and the model are never confused by accident.
+ *
+ * There is no `label` input. The element already accepts `aria-label` and
+ * `aria-labelledby`, and a second way to name one thing is a second thing to
+ * get wrong.
+ */
+declare class SlButtonGroup {
+    /** Positions the buttons across the flow. */
+    readonly align: _angular_core.InputSignal<ButtonGroupAlign | undefined>;
+    /** Positions the buttons along the flow, which makes the group hold the line. */
+    readonly justify: _angular_core.InputSignal<ButtonGroupJustify | undefined>;
+    readonly orientation: _angular_core.InputSignal<ButtonGroupOrientation | undefined>;
+    /** The group holds the line and its buttons share it in equal segments. */
+    readonly fullWidth: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    readonly size: _angular_core.InputSignal<"sm" | "md" | "lg" | undefined>;
+    readonly tone: _angular_core.InputSignal<"accent" | "secondary" | "success" | "warning" | "danger" | undefined>;
+    readonly variant: _angular_core.InputSignal<"solid" | "outline" | "ghost" | undefined>;
+    /**
+     * A static attribute the consumer wrote survives the host binding, which is
+     * how `role="toolbar"` stays possible on an element this family would
+     * otherwise call a group.
+     *
+     * `role=""` is the way out: ARIA reads an empty role as "use the element's
+     * implicit one", so a `nav` or a `section` carrying this directive keeps the
+     * semantics it was chosen for instead of being flattened to a group.
+     */
+    private readonly writtenRole;
+    protected readonly role: string | null;
+    /** What the rule between two runs turns with. */
+    readonly flow: _angular_core.Signal<ButtonGroupOrientation>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlButtonGroup, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SlButtonGroup, "[slButtonGroup]", ["slButtonGroup"], { "align": { "alias": "align"; "required": false; "isSignal": true; }; "justify": { "alias": "justify"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "tone": { "alias": "tone"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * A rule between two runs of actions. It takes no room at all: the bar is one
+ * shape, and a rule is not licence to cut it — what the rule marks is painted
+ * in the column the shared edge already occupies, one step stronger than the
+ * seams around it, so the boundary reads without the bar coming apart. A
+ * filled run keeps its seam, which is the darkest step of its own tone and the
+ * strongest line that bar has.
+ *
+ * Its axis is the group's, mirrored: a rule across a row is vertical. It is
+ * derived rather than accepted, because a rule that could disagree with the
+ * group it divides is a rule that eventually does.
+ */
+declare class SlButtonGroupSeparator {
+    private readonly group;
+    /**
+     * Drops the rule out of the accessibility tree. Use it when the boundary is
+     * cosmetic; a boundary that carries meaning is better said by a nested group
+     * with a name of its own.
+     */
+    readonly decorative: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    protected readonly axis: _angular_core.Signal<"horizontal" | "vertical" | null>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SlButtonGroupSeparator, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SlButtonGroupSeparator, "[slButtonGroupSeparator]", ["slButtonGroupSeparator"], { "decorative": { "alias": "decorative"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+export { SlButtonGroup, SlButtonGroupSeparator };
+export type { ButtonGroupAlign, ButtonGroupJustify, ButtonGroupOrientation };
+//# sourceMappingURL=slotted-angular-button-group.d.ts.map

package/types/slotted-angular-button-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"slotted-angular-button-group.d.ts","sources":["../../button-group/src/button-group.types.ts","../../button-group/src/button-group.ts","../../button-group/src/button-group-separator.ts"],"mappings":";;KAAY,sBAAsB;AAElC;;;;;AAKG;AACG,KAAM,gBAAgB;AAE5B;AACM,KAAM,kBAAkB;;AC6C9B;;;;;;;;;;;;;;;;;;;AAmBG;AACH,cAmBa,aAAa;;oBAEV,aAAA,CAAA,WAAA,CAAA,gBAAA;;sBAEE,aAAA,CAAA,WAAA,CAAA,kBAAA;0BACI,aAAA,CAAA,WAAA,CAAA,sBAAA;;wBAEF,aAAA,CAAA,wBAAA;mBAEL,aAAA,CAAA,WAAA;mBACA,aAAA,CAAA,WAAA;sBACG,aAAA,CAAA,WAAA;AAEhB;;;;;;;;AAQG;AACH;AACA;;mBAGa,aAAA,CAAA,MAAA,CAAA,sBAAA;oDA1BF,aAAa;sDAAb,aAAa;AA2BzB;;AC9GD;;;;;;;;;;;AAWG;AACH,cAea,sBAAsB;AACjC;AAEA;;;;AAIG;yBACgB,aAAA,CAAA,wBAAA;AAEnB,6BAAuB,aAAA,CAAA,MAAA;oDAVZ,sBAAsB;sDAAtB,sBAAsB;AAclC;;","names":[]}