@lilydesignsystem/angular-headless 0.6.0 → 0.7.1

package/types/lilydesignsystem-angular-headless.d.ts

@@ -1,4 +1,5 @@
 import * as i0 from "@angular/core";
+import { OnInit } from "@angular/core";
 /**
  * AccordionCheckbox — a checkbox option that reveals an accordion panel when checked
  *
@@ -3370,7 +3371,13 @@ export declare class ColorInput {
  */
 export declare class ColorPicker {
   readonly label: import("@angular/core").InputSignal<string>;
+  /** Horizontal position, 0-100 (saturation). Two-way bindable. */
+  readonly x: import("@angular/core").ModelSignal<number>;
+  /** Vertical position, 0-100 (brightness). Two-way bindable. */
+  readonly y: import("@angular/core").ModelSignal<number>;
+  readonly disabled: import("@angular/core").InputSignal<boolean>;
   readonly className: import("@angular/core").InputSignal<string>;
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<ColorPicker, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<ColorPicker, "lily-color-picker", never, {
     "label": {
@@ -3378,12 +3385,30 @@ export declare class ColorPicker {
       "required": false;
       "isSignal": true;
     };
+    "x": {
+      "alias": "x";
+      "required": false;
+      "isSignal": true;
+    };
+    "y": {
+      "alias": "y";
+      "required": false;
+      "isSignal": true;
+    };
+    "disabled": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+  }, {
+    "x": "xChange";
+    "y": "yChange";
+  }, never, ["*"], true, never>;
 }
 /**
  * ColorPickerButton — a button showing a color swatch in a color picker
@@ -3750,17 +3775,6 @@ export declare class ContentsListItem {
     };
   }, {}, never, ["*"], true, never>;
 }
-/**
- * Which section is current: the last whose top has passed the activation line
- * (`tops` are each section's top relative to the scroller; `offset` is the line).
- * At the bottom of the scroll range the last section wins (a short last section
- * never reaches the line); before the first section, the first.
- */
-declare function activeSectionIndex(tops: number[], offset: number, atBottom: boolean): number;
-/** The in-page `<a href="#id">` links inside `nav`. */
-declare function contentsLinks(nav: Element): HTMLAnchorElement[];
-declare function contentsLinkId(link: Element): string;
-declare function contentsTarget(link: Element, doc: Document): HTMLElement | null;
 export type ScrollspyOptions = {
   /** Activation line, px below the top of `root`. */
   offset?: number;
@@ -3771,12 +3785,6 @@ export type ScrollspyOptions = {
   /** Called once per change, with the section id. */
   onChange?: (id: string) => void;
 };
-/**
- * Mark the link of the section in view with `aria-current` and `data-active`
- * (and its enclosing `<li>`s with `data-descendant-active`). Returns a function
- * that stops listening.
- */
-declare function startScrollspy(nav: HTMLElement, options?: ScrollspyOptions): () => void;
 /**
  * ContentsNav — a navigation landmark for a table of contents.
  *
@@ -3850,7 +3858,13 @@ export declare class ContentsNav {
  */
 export declare class ContextMenu {
   readonly label: import("@angular/core").InputSignal<string>;
+  /** Whether the menu is visible. Two-way bindable; Escape sets it to false. */
+  readonly open: import("@angular/core").ModelSignal<boolean>;
   readonly className: import("@angular/core").InputSignal<string>;
+  private readonly menu;
+  constructor();
+  /** Roving focus over the `role="menuitem"` descendants (WAI-ARIA APG menu pattern). */
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<ContextMenu, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<ContextMenu, "lily-context-menu", never, {
     "label": {
@@ -3858,12 +3872,19 @@ export declare class ContextMenu {
       "required": false;
       "isSignal": true;
     };
+    "open": {
+      "alias": "open";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+  }, {
+    "open": "openChange";
+  }, never, ["*"], true, never>;
 }
 /**
  * ContextMenuItem — one item in a context menu
@@ -3913,6 +3934,124 @@ export declare class ContextualHelp {
     };
   }, {}, never, ["*"], true, never>;
 }
+/**
+ * ConvertDiv — a group that converts a value from one unit into another, such as dollars into euros or miles into kilometres
+ *
+ * A headless part of ConvertDiv: a plain <div> with the base class and projected content; role="group" named by the required `label` input.
+ */
+export declare class ConvertDiv {
+  readonly className: import("@angular/core").InputSignal<string>;
+  readonly label: import("@angular/core").InputSignal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<ConvertDiv, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<ConvertDiv, "lily-convert-div", never, {
+    "className": {
+      "alias": "className";
+      "required": false;
+      "isSignal": true;
+    };
+    "label": {
+      "alias": "label";
+      "required": true;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}
+/**
+ * ConvertFromDiv — the source side of a conversion, holding the value and unit to convert from
+ *
+ * A headless part of ConvertDiv: a plain <div> with the base class and projected content.
+ */
+export declare class ConvertFromDiv {
+  readonly className: import("@angular/core").InputSignal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<ConvertFromDiv, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<ConvertFromDiv, "lily-convert-from-div", never, {
+    "className": {
+      "alias": "className";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}
+/**
+ * ConvertFromUnitDiv — the unit to convert from, such as a select box of currencies or lengths
+ *
+ * A headless part of ConvertDiv: a plain <div> with the base class and projected content.
+ */
+export declare class ConvertFromUnitDiv {
+  readonly className: import("@angular/core").InputSignal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<ConvertFromUnitDiv, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<ConvertFromUnitDiv, "lily-convert-from-unit-div", never, {
+    "className": {
+      "alias": "className";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}
+/**
+ * ConvertFromValueDiv — the value to convert from, such as a text input holding the number of dollars
+ *
+ * A headless part of ConvertDiv: a plain <div> with the base class and projected content.
+ */
+export declare class ConvertFromValueDiv {
+  readonly className: import("@angular/core").InputSignal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<ConvertFromValueDiv, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<ConvertFromValueDiv, "lily-convert-from-value-div", never, {
+    "className": {
+      "alias": "className";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}
+/**
+ * ConvertIntoDiv — the target side of a conversion, holding the value and unit to convert into
+ *
+ * A headless part of ConvertDiv: a plain <div> with the base class and projected content.
+ */
+export declare class ConvertIntoDiv {
+  readonly className: import("@angular/core").InputSignal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<ConvertIntoDiv, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<ConvertIntoDiv, "lily-convert-into-div", never, {
+    "className": {
+      "alias": "className";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}
+/**
+ * ConvertIntoUnitDiv — the unit to convert into, such as a select box of currencies or lengths
+ *
+ * A headless part of ConvertDiv: a plain <div> with the base class and projected content.
+ */
+export declare class ConvertIntoUnitDiv {
+  readonly className: import("@angular/core").InputSignal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<ConvertIntoUnitDiv, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<ConvertIntoUnitDiv, "lily-convert-into-unit-div", never, {
+    "className": {
+      "alias": "className";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}
+/**
+ * ConvertIntoValueDiv — the converted value, such as a text input showing the number of euros
+ *
+ * A headless part of ConvertDiv: a plain <div> with the base class and projected content.
+ */
+export declare class ConvertIntoValueDiv {
+  readonly className: import("@angular/core").InputSignal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<ConvertIntoValueDiv, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<ConvertIntoValueDiv, "lily-convert-into-value-div", never, {
+    "className": {
+      "alias": "className";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}
 /**
  * CurrencyInput — a locale-aware currency input with automatic formatting, symbols, separators
  *
@@ -4742,7 +4881,15 @@ export declare class DeutschlandKrankenversichertennummerView {
  */
 export declare class Dial {
   readonly label: import("@angular/core").InputSignal<string>;
+  /** Current value. Two-way bindable. */
+  readonly value: import("@angular/core").ModelSignal<number>;
+  readonly min: import("@angular/core").InputSignal<number>;
+  readonly max: import("@angular/core").InputSignal<number>;
+  readonly step: import("@angular/core").InputSignal<number>;
+  readonly disabled: import("@angular/core").InputSignal<boolean>;
   readonly className: import("@angular/core").InputSignal<string>;
+  private clamp;
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<Dial, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<Dial, "lily-dial", never, {
     "label": {
@@ -4750,12 +4897,39 @@ export declare class Dial {
       "required": false;
       "isSignal": true;
     };
+    "value": {
+      "alias": "value";
+      "required": false;
+      "isSignal": true;
+    };
+    "min": {
+      "alias": "min";
+      "required": false;
+      "isSignal": true;
+    };
+    "max": {
+      "alias": "max";
+      "required": false;
+      "isSignal": true;
+    };
+    "step": {
+      "alias": "step";
+      "required": false;
+      "isSignal": true;
+    };
+    "disabled": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+  }, {
+    "value": "valueChange";
+  }, never, ["*"], true, never>;
 }
 /**
  * DialGroup — a group of dial components
@@ -4790,8 +4964,12 @@ export declare class DialGroup {
  */
 export declare class Dialog {
   readonly label: import("@angular/core").InputSignal<string>;
-  readonly open: import("@angular/core").InputSignal<boolean>;
+  /** Whether the dialog is visible. Two-way bindable; Escape sets it to false. */
+  readonly open: import("@angular/core").ModelSignal<boolean>;
+  /** Whether the dialog is modal (`aria-modal`). */
+  readonly modal: import("@angular/core").InputSignal<boolean>;
   readonly className: import("@angular/core").InputSignal<string>;
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<Dialog, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<Dialog, "lily-dialog", never, {
     "label": {
@@ -4804,12 +4982,19 @@ export declare class Dialog {
       "required": false;
       "isSignal": true;
     };
+    "modal": {
+      "alias": "modal";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+  }, {
+    "open": "openChange";
+  }, never, ["*"], true, never>;
 }
 /**
  * Diff — a side-by-side comparison of two items
@@ -5073,7 +5258,12 @@ export declare class Draft {
  */
 export declare class Drawer {
   readonly label: import("@angular/core").InputSignal<string>;
+  /** Whether the panel is shown. Two-way bindable; Escape sets it to false. */
+  readonly open: import("@angular/core").ModelSignal<boolean>;
+  /** Edge the panel attaches to; exposed as `data-side`. */
+  readonly side: import("@angular/core").InputSignal<"left" | "right" | "top" | "bottom">;
   readonly className: import("@angular/core").InputSignal<string>;
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<Drawer, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<Drawer, "lily-drawer", never, {
     "label": {
@@ -5081,12 +5271,24 @@ export declare class Drawer {
       "required": false;
       "isSignal": true;
     };
+    "open": {
+      "alias": "open";
+      "required": false;
+      "isSignal": true;
+    };
+    "side": {
+      "alias": "side";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+  }, {
+    "open": "openChange";
+  }, never, ["*"], true, never>;
 }
 /**
  * DropdownMenu — a menu that opens below a trigger button
@@ -5097,7 +5299,13 @@ export declare class Drawer {
  */
 export declare class DropdownMenu {
   readonly label: import("@angular/core").InputSignal<string>;
+  /** Whether the menu is open. Two-way bindable; Escape sets it to false. */
+  readonly open: import("@angular/core").ModelSignal<boolean>;
   readonly className: import("@angular/core").InputSignal<string>;
+  private readonly menu;
+  constructor();
+  /** Roving focus over the `role="menuitem"` descendants (WAI-ARIA APG menu pattern). */
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<DropdownMenu, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<DropdownMenu, "lily-dropdown-menu", never, {
     "label": {
@@ -5105,12 +5313,19 @@ export declare class DropdownMenu {
       "required": false;
       "isSignal": true;
     };
+    "open": {
+      "alias": "open";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+  }, {
+    "open": "openChange";
+  }, never, ["*"], true, never>;
 }
 /**
  * Editable — an inline-editable text element that toggles between view and edit modes
@@ -5121,7 +5336,16 @@ export declare class DropdownMenu {
  */
 export declare class Editable {
   readonly label: import("@angular/core").InputSignal<string>;
+  /** The committed value. Two-way bindable. */
+  readonly value: import("@angular/core").ModelSignal<string>;
+  /** Whether the text field is showing. Two-way bindable. */
+  readonly editing: import("@angular/core").ModelSignal<boolean>;
+  readonly disabled: import("@angular/core").InputSignal<boolean>;
   readonly className: import("@angular/core").InputSignal<string>;
+  protected readonly draft: import("@angular/core").WritableSignal<string>;
+  protected startEditing(): void;
+  protected onDisplayKeydown(event: KeyboardEvent): void;
+  protected onInputKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<Editable, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<Editable, "lily-editable", never, {
     "label": {
@@ -5129,12 +5353,30 @@ export declare class Editable {
       "required": false;
       "isSignal": true;
     };
+    "value": {
+      "alias": "value";
+      "required": false;
+      "isSignal": true;
+    };
+    "editing": {
+      "alias": "editing";
+      "required": false;
+      "isSignal": true;
+    };
+    "disabled": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+  }, {
+    "value": "valueChange";
+    "editing": "editingChange";
+  }, never, never, true, never>;
 }
 /**
  * EditableForm — a form wrapper for inline editing of content
@@ -5145,7 +5387,15 @@ export declare class Editable {
  */
 export declare class EditableForm {
   readonly label: import("@angular/core").InputSignal<string>;
+  /** Whether the form is showing. Two-way bindable; submit and Escape set it to false. */
+  readonly editing: import("@angular/core").ModelSignal<boolean>;
   readonly className: import("@angular/core").InputSignal<string>;
+  /** Emitted after the form is submitted (the native submit is prevented). */
+  readonly submitted: import("@angular/core").OutputEmitterRef<SubmitEvent>;
+  /** Emitted when Escape cancels editing. */
+  readonly cancelled: import("@angular/core").OutputEmitterRef<void>;
+  protected onSubmit(event: Event): void;
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<EditableForm, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<EditableForm, "lily-editable-form", never, {
     "label": {
@@ -5153,12 +5403,21 @@ export declare class EditableForm {
       "required": false;
       "isSignal": true;
     };
+    "editing": {
+      "alias": "editing";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+  }, {
+    "editing": "editingChange";
+    "submitted": "submitted";
+    "cancelled": "cancelled";
+  }, never, ["*"], true, never>;
 }
 /**
  * EestiIsikukoodInput — an input for entering Estonia's Isikukood (IK)
@@ -7417,6 +7676,60 @@ export declare class HeatmapChart {
     };
   }, {}, never, ["*", "[dataTable]"], true, never>;
 }
+/**
+ * HeatmapChartWithYearOfDays — a headless wrapper for a grid chart where cell colour encodes the value.
+ *
+ * Mirrors the Svelte canonical: the consumer supplies the inline <svg> as
+ * projected content; nothing is drawn here. The graphic is a role="img"
+ * wrapper named by `label` (`describedBy` is its aria-describedby). An
+ * element projected with the `dataTable` attribute (`<table dataTable>`)
+ * is rendered in `.heatmap-chart-with-year-of-days-data-table`, a SIBLING of the image wrapper:
+ * role="img" makes descendants presentational, so a table inside it would
+ * be invisible to assistive technology.
+ * Keyboard: none on the graphic; the table follows native table behaviour.
+ * Deviations from Svelte: no rest-props spread (Angular cannot spread onto
+ * an inner element); the data-table wrapper is always rendered (Angular
+ * cannot detect projected content), empty when nothing is projected.
+ */
+export declare class HeatmapChartWithYearOfDays {
+  /** Accessible name for the chart. */
+  readonly label: import("@angular/core").InputSignal<string>;
+  /** The calendar year shown (data-year). */
+  readonly year: import("@angular/core").InputSignal<number>;
+  /** First weekday row: 0 = Sunday … 6 = Saturday (data-week-start). No default: it is locale-dependent. */
+  readonly weekStart: import("@angular/core").InputSignal<number>;
+  /** Id of a description (aria-describedby on the image wrapper). */
+  readonly describedBy: import("@angular/core").InputSignal<string>;
+  readonly className: import("@angular/core").InputSignal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HeatmapChartWithYearOfDays, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HeatmapChartWithYearOfDays, "lily-heatmap-chart-with-year-of-days", never, {
+    "label": {
+      "alias": "label";
+      "required": true;
+      "isSignal": true;
+    };
+    "year": {
+      "alias": "year";
+      "required": true;
+      "isSignal": true;
+    };
+    "weekStart": {
+      "alias": "weekStart";
+      "required": true;
+      "isSignal": true;
+    };
+    "describedBy": {
+      "alias": "describedBy";
+      "required": false;
+      "isSignal": true;
+    };
+    "className": {
+      "alias": "className";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*", "[dataTable]"], true, never>;
+}
 /**
  * Hero — a large box or image with a title and description
  *
@@ -7547,7 +7860,10 @@ export declare class Hint {
  */
 export declare class HorizontalScroller {
   readonly label: import("@angular/core").InputSignal<string>;
+  /** Pixels scrolled by ArrowLeft / ArrowRight. */
+  readonly step: import("@angular/core").InputSignal<number>;
   readonly className: import("@angular/core").InputSignal<string>;
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<HorizontalScroller, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<HorizontalScroller, "lily-horizontal-scroller", never, {
     "label": {
@@ -7555,6 +7871,11 @@ export declare class HorizontalScroller {
       "required": false;
       "isSignal": true;
     };
+    "step": {
+      "alias": "step";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
@@ -10104,6 +10425,8 @@ export declare class MentionsInput {
 export declare class Menu {
   readonly label: import("@angular/core").InputSignal<string>;
   readonly className: import("@angular/core").InputSignal<string>;
+  /** Roving focus over the `role="menuitem"` descendants (WAI-ARIA APG menu pattern). */
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<Menu, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<Menu, "lily-menu", never, {
     "label": {
@@ -10128,6 +10451,8 @@ export declare class Menu {
 export declare class MenuBar {
   readonly label: import("@angular/core").InputSignal<string>;
   readonly className: import("@angular/core").InputSignal<string>;
+  /** Roving focus left/right over the `role="menuitem"` descendants. */
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<MenuBar, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<MenuBar, "lily-menu-bar", never, {
     "label": {
@@ -10340,6 +10665,85 @@ export declare class MexicoClaveUnicaDeRegistroDePoblacionView {
     };
   }, {}, never, never, true, never>;
 }
+/**
+ * Middle truncation: shorten a string to fit a width by cutting out the middle, keeping the start and the end ("report-fi…q3.pdf").
+ * Pure and framework-neutral: the caller supplies `measure`, so the module reads no DOM and is tested without a browser.
+ *
+ * Works on grapheme clusters (Intl.Segmenter, falling back to code points), so it never splits a surrogate pair, a combining
+ * sequence or an emoji. The width search is binary, so it measures O(log n) candidate strings.
+ *
+ * Strategies:
+ *   "even"      the start and the end share what fits, the end taking the extra cluster when the count is odd.
+ *   "fixed-end" exactly `end` clusters are kept at the end; the start takes all the remaining room.
+ *   "min-end"   an even split, but at least `end` clusters are kept at the end (a file extension, a domain suffix).
+ */
+export type TruncationStrategy = "even" | "fixed-end" | "min-end";
+export interface TruncateMiddleOptions {
+  /** The ellipsis string. Required: the module has no default text (internationalisation). */
+  ellipsis: string;
+  /** The width available to the whole result, in the unit `measure` returns. */
+  maxWidth: number;
+  /** Width of a string in the same unit as `maxWidth`. */
+  measure: (text: string) => number;
+  strategy?: TruncationStrategy;
+  /** Clusters kept at the end for "fixed-end" and "min-end". Ignored by "even". */
+  end?: number;
+}
+/**
+ * MiddleTruncation — a string shortened in the middle to fit its width, keeping the start and the end.
+ *
+ * Mirrors the Svelte canonical: the width is measured in the browser (canvas text metrics in the element's own font)
+ * and re-measured when the container resizes; until then, and on the server, the full text is shown. The shortened string
+ * is aria-hidden and the whole text sits in `.middle-truncation-full`, which the consumer visually hides, so assistive
+ * technology, find-in-page and copy get the real text.
+ *
+ * Inputs: `text` (required), `ellipsis` (required, no default), `strategy` ("even" | "fixed-end" | "min-end"), `end`, `className`.
+ * Keyboard: none.
+ * Deviation from Svelte: no rest-props spread (Angular cannot spread onto an inner element).
+ */
+export declare class MiddleTruncation {
+  readonly className: import("@angular/core").InputSignal<string>;
+  /** The full text. */
+  readonly text: import("@angular/core").InputSignal<string>;
+  /** The cut marker; no default. */
+  readonly ellipsis: import("@angular/core").InputSignal<string>;
+  /** How the room is shared between start and end. */
+  readonly strategy: import("@angular/core").InputSignal<TruncationStrategy>;
+  /** Characters kept at the end for "fixed-end" and "min-end". */
+  readonly end: import("@angular/core").InputSignal<number | undefined>;
+  private readonly root;
+  protected readonly shown: import("@angular/core").WritableSignal<string | null>;
+  private context;
+  constructor();
+  static ɵfac: i0.ɵɵFactoryDeclaration<MiddleTruncation, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<MiddleTruncation, "lily-middle-truncation", never, {
+    "className": {
+      "alias": "className";
+      "required": false;
+      "isSignal": true;
+    };
+    "text": {
+      "alias": "text";
+      "required": true;
+      "isSignal": true;
+    };
+    "ellipsis": {
+      "alias": "ellipsis";
+      "required": true;
+      "isSignal": true;
+    };
+    "strategy": {
+      "alias": "strategy";
+      "required": false;
+      "isSignal": true;
+    };
+    "end": {
+      "alias": "end";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
 /**
  * MisrAlRaqmAlQawmiInput — an input for entering Egypt's الرقم القومي (National Number)
  *
@@ -12136,9 +12540,25 @@ export declare class PilipinasPhilhealthIdentificationNumberView {
  * kebab-case class hook `pin-input-div` and the consumer-provided `className`.
  * Ships zero CSS; the consumer styles via the class hook.
  */
-export declare class PinInputDiv {
+export declare class PinInputDiv implements OnInit {
   readonly label: import("@angular/core").InputSignal<string>;
+  readonly length: import("@angular/core").InputSignal<number>;
+  /** Accessible name of one box, e.g. `(n, total) => ...`. Falls back to `label`. */
+  readonly digitLabel: import("@angular/core").InputSignal<((position: number, length: number) => string) | undefined>;
+  /** The digits entered so far, as one string. Two-way bindable. */
+  readonly value: import("@angular/core").ModelSignal<string>;
+  readonly disabled: import("@angular/core").InputSignal<boolean>;
   readonly className: import("@angular/core").InputSignal<string>;
+  protected readonly digits: import("@angular/core").WritableSignal<string[]>;
+  protected readonly indexes: import("@angular/core").Signal<number[]>;
+  private readonly inputs;
+  private initialDigits;
+  private readonly host;
+  constructor();
+  ngOnInit(): void;
+  protected digitName(index: number): string | null;
+  protected onInput(index: number, event: Event): void;
+  protected onKeydown(index: number, event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<PinInputDiv, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<PinInputDiv, "lily-pin-input-div", never, {
     "label": {
@@ -12146,12 +12566,34 @@ export declare class PinInputDiv {
       "required": false;
       "isSignal": true;
     };
+    "length": {
+      "alias": "length";
+      "required": false;
+      "isSignal": true;
+    };
+    "digitLabel": {
+      "alias": "digitLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "value": {
+      "alias": "value";
+      "required": false;
+      "isSignal": true;
+    };
+    "disabled": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+  }, {
+    "value": "valueChange";
+  }, never, never, true, never>;
 }
 /**
  * Place — a place component that contains other place-related information
@@ -14334,7 +14776,12 @@ export declare class SharePage {
  */
 export declare class Sheet {
   readonly label: import("@angular/core").InputSignal<string>;
+  /** Whether the panel is shown. Two-way bindable; Escape sets it to false. */
+  readonly open: import("@angular/core").ModelSignal<boolean>;
+  /** Edge the panel attaches to; exposed as `data-side`. */
+  readonly side: import("@angular/core").InputSignal<"left" | "right" | "top" | "bottom">;
   readonly className: import("@angular/core").InputSignal<string>;
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<Sheet, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<Sheet, "lily-sheet", never, {
     "label": {
@@ -14342,12 +14789,24 @@ export declare class Sheet {
       "required": false;
       "isSignal": true;
     };
+    "open": {
+      "alias": "open";
+      "required": false;
+      "isSignal": true;
+    };
+    "side": {
+      "alias": "side";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+  }, {
+    "open": "openChange";
+  }, never, ["*"], true, never>;
 }
 /**
  * ShowMore — a content region clamped to a shorter height with a button that reveals the rest
@@ -14587,7 +15046,10 @@ export declare class SkipLink {
  */
 export declare class SlideOutDrawer {
   readonly label: import("@angular/core").InputSignal<string>;
+  /** Whether the panel is shown. Two-way bindable; Escape sets it to false. */
+  readonly open: import("@angular/core").ModelSignal<boolean>;
   readonly className: import("@angular/core").InputSignal<string>;
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<SlideOutDrawer, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<SlideOutDrawer, "lily-slide-out-drawer", never, {
     "label": {
@@ -14595,12 +15057,19 @@ export declare class SlideOutDrawer {
       "required": false;
       "isSignal": true;
     };
+    "open": {
+      "alias": "open";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+  }, {
+    "open": "openChange";
+  }, never, ["*"], true, never>;
 }
 /**
  * Slider — a draggable control for selecting a value along a track
@@ -15666,10 +16135,16 @@ export declare class SverigePersonnummerView {
  * Ships zero CSS; the consumer styles via the class hook.
  */
 export declare class SwitchButton {
-  /** Optional aria-label override. */
   readonly label: import("@angular/core").InputSignal<string>;
-  /** Extra CSS classes appended to the base class. */
+  /** Whether the control is on. Two-way bindable. */
+  readonly checked: import("@angular/core").ModelSignal<boolean>;
+  readonly disabled: import("@angular/core").InputSignal<boolean>;
   readonly className: import("@angular/core").InputSignal<string>;
+  /**
+   * Space and Enter activate a native <button> through `click`, so no key handler is
+   * needed (and none can double-toggle).
+   */
+  protected toggle(): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<SwitchButton, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<SwitchButton, "lily-switch-button", never, {
     "label": {
@@ -15677,12 +16152,24 @@ export declare class SwitchButton {
       "required": false;
       "isSignal": true;
     };
+    "checked": {
+      "alias": "checked";
+      "required": false;
+      "isSignal": true;
+    };
+    "disabled": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+  }, {
+    "checked": "checkedChange";
+  }, never, ["*"], true, never>;
 }
 /**
  * TabBar — a group of tabs for switching between content panels
@@ -15694,6 +16181,8 @@ export declare class SwitchButton {
 export declare class TabBar {
   readonly label: import("@angular/core").InputSignal<string>;
   readonly className: import("@angular/core").InputSignal<string>;
+  /** Roving focus over the `role="tab"` descendants (left/right, wrapping; Home/End). */
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<TabBar, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<TabBar, "lily-tab-bar", never, {
     "label": {
@@ -15718,6 +16207,10 @@ export declare class TabBar {
 export declare class TabBarButton {
   /** Optional aria-label override. */
   readonly label: import("@angular/core").InputSignal<string>;
+  /** Whether this tab is the selected one (roving tabindex: only it is tabbable). */
+  readonly selected: import("@angular/core").InputSignal<boolean>;
+  /** Id of the tab panel this tab controls. */
+  readonly controls: import("@angular/core").InputSignal<string>;
   /** Extra CSS classes appended to the base class. */
   readonly className: import("@angular/core").InputSignal<string>;
   static ɵfac: i0.ɵɵFactoryDeclaration<TabBarButton, never>;
@@ -15727,6 +16220,16 @@ export declare class TabBarButton {
       "required": false;
       "isSignal": true;
     };
+    "selected": {
+      "alias": "selected";
+      "required": false;
+      "isSignal": true;
+    };
+    "controls": {
+      "alias": "controls";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
@@ -16040,6 +16543,8 @@ export declare class TagInput {
 export declare class TaskBar {
   readonly label: import("@angular/core").InputSignal<string>;
   readonly className: import("@angular/core").InputSignal<string>;
+  /** Roving focus over buttons and tabindex descendants (left/right, wrapping; Home/End). */
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<TaskBar, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<TaskBar, "lily-task-bar", never, {
     "label": {
@@ -16542,6 +17047,12 @@ export declare class Tile {
 export declare class TileMap {
   readonly label: import("@angular/core").InputSignal<string>;
   readonly className: import("@angular/core").InputSignal<string>;
+  /**
+   * Arrow keys move focus between `[data-tile]` descendants (left/right by order, up/down to the
+   * nearest tile in the row above or below); Enter / Space fire a bubbling `tile-activate` event
+   * on the focused tile; Escape blurs it.
+   */
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<TileMap, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<TileMap, "lily-tile-map", never, {
     "label": {
@@ -16813,10 +17324,16 @@ export declare class Toast {
  * Ships zero CSS; the consumer styles via the class hook.
  */
 export declare class ToggleButton {
-  /** Optional aria-label override. */
   readonly label: import("@angular/core").InputSignal<string>;
-  /** Extra CSS classes appended to the base class. */
+  /** Whether the control is on. Two-way bindable. */
+  readonly pressed: import("@angular/core").ModelSignal<boolean>;
+  readonly disabled: import("@angular/core").InputSignal<boolean>;
   readonly className: import("@angular/core").InputSignal<string>;
+  /**
+   * Space and Enter activate a native <button> through `click`, so no key handler is
+   * needed (and none can double-toggle).
+   */
+  protected toggle(): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<ToggleButton, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<ToggleButton, "lily-toggle-button", never, {
     "label": {
@@ -16824,12 +17341,24 @@ export declare class ToggleButton {
       "required": false;
       "isSignal": true;
     };
+    "pressed": {
+      "alias": "pressed";
+      "required": false;
+      "isSignal": true;
+    };
+    "disabled": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+  }, {
+    "pressed": "pressedChange";
+  }, never, ["*"], true, never>;
 }
 /**
  * ToggleGroup — a group of toggle buttons for selecting options
@@ -16865,6 +17394,8 @@ export declare class ToggleGroup {
 export declare class ToolBar {
   readonly label: import("@angular/core").InputSignal<string>;
   readonly className: import("@angular/core").InputSignal<string>;
+  /** Roving focus over buttons and tabindex descendants (left/right, wrapping; Home/End). */
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<ToolBar, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<ToolBar, "lily-tool-bar", never, {
     "label": {
@@ -17085,7 +17616,10 @@ export declare class Tooltip {
  */
 export declare class Tour {
   readonly label: import("@angular/core").InputSignal<string>;
+  /** Whether the tour is showing. Two-way bindable; Escape sets it to false. */
+  readonly active: import("@angular/core").ModelSignal<boolean>;
   readonly className: import("@angular/core").InputSignal<string>;
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<Tour, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<Tour, "lily-tour", never, {
     "label": {
@@ -17093,12 +17627,19 @@ export declare class Tour {
       "required": false;
       "isSignal": true;
     };
+    "active": {
+      "alias": "active";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+  }, {
+    "active": "activeChange";
+  }, never, ["*"], true, never>;
 }
 /**
  * TourList — an ordered list of tour guide steps
@@ -17109,7 +17650,10 @@ export declare class Tour {
  */
 export declare class TourList {
   readonly label: import("@angular/core").InputSignal<string>;
+  /** Whether the tour is showing. Two-way bindable; Escape sets it to false. */
+  readonly active: import("@angular/core").ModelSignal<boolean>;
   readonly className: import("@angular/core").InputSignal<string>;
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<TourList, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<TourList, "lily-tour-list", never, {
     "label": {
@@ -17117,12 +17661,19 @@ export declare class TourList {
       "required": false;
       "isSignal": true;
     };
+    "active": {
+      "alias": "active";
+      "required": false;
+      "isSignal": true;
+    };
     "className": {
       "alias": "className";
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+  }, {
+    "active": "activeChange";
+  }, never, ["*"], true, never>;
 }
 /**
  * TourListItem — one step in a tour guide list
@@ -17211,6 +17762,8 @@ export declare class TreeLink {
 export declare class TreeList {
   readonly label: import("@angular/core").InputSignal<string>;
   readonly className: import("@angular/core").InputSignal<string>;
+  /** Focus moves over the `role="treeitem"` descendants (up/down, wrapping; Home/End). */
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<TreeList, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<TreeList, "lily-tree-list", never, {
     "label": {
@@ -17239,6 +17792,9 @@ export declare class TreeList {
  */
 export declare class TreeListItem {
   readonly className: import("@angular/core").InputSignal<string>;
+  /** Expanded state, two-way bindable. Leave undefined for a leaf (no aria-expanded). */
+  readonly expanded: import("@angular/core").ModelSignal<boolean | undefined>;
+  protected onKeydown(event: KeyboardEvent): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<TreeListItem, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<TreeListItem, "li[lily-tree-list-item]", never, {
     "className": {
@@ -17246,7 +17802,14 @@ export declare class TreeListItem {
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, ["*"], true, never>;
+    "expanded": {
+      "alias": "expanded";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "expanded": "expandedChange";
+  }, never, ["*"], true, never>;
 }
 /**
  * TreeMenu — a hierarchical tree menu with expandable branches
@@ -18061,6 +18624,110 @@ export declare class WeekInput {
     "value": "valueChange";
   }, never, never, true, never>;
 }
+/**
+ * Keyboard model for a wheel picker: a single-select listbox where the selection follows the cursor (APG listbox, "selection
+ * follows focus"), so moving the cursor IS choosing. Pure and framework-neutral, tested without a browser.
+ *
+ * Disabled options are skipped by every move. Arrows wrap only when `loop` is set; Home, End, PageUp and PageDown never wrap.
+ */
+export interface WheelOption {
+  value: string;
+  label: string;
+  disabled?: boolean;
+}
+export type WheelMoveKey = "ArrowUp" | "ArrowDown" | "Home" | "End" | "PageUp" | "PageDown";
+export interface WheelMoveOptions {
+  /** Arrow keys wrap from the last enabled option to the first and back. Default false. */
+  loop?: boolean;
+  /** Enabled options PageUp / PageDown move by. Default 5. */
+  pageSize?: number;
+}
+export interface WheelTypeahead {
+  prefix: string;
+  at: number;
+}
+/**
+ * WheelPicker — a vertical single-select listbox where the selection follows the cursor.
+ *
+ * Mirrors the Svelte canonical: moving with the arrow keys, typing, or clicking an option chooses it. The component owns
+ * the roles and the keys; the wheel LOOK (scroll snapping, fading) is the consumer's CSS. `value` is a two-way `model`
+ * (`[(value)]`); the listbox is `.wheel-picker-list` (`role="listbox"`, vertical, `aria-activedescendant`), each option
+ * `.wheel-picker-option` (`role="option"`, `aria-selected`, `aria-disabled`). Keyboard (APG listbox, selection follows
+ * focus): ArrowDown / ArrowUp, Home / End, PageDown / PageUp, type-ahead over the labels; disabled options are skipped.
+ *
+ * Inputs: `label` (required), `options` (required), `value` (model), `loop`, `pageSize`, `disabled`, `name`, `className`.
+ * Deviation from Svelte: no rest-props spread (Angular cannot spread onto an inner element).
+ */
+export declare class WheelPicker {
+  readonly className: import("@angular/core").InputSignal<string>;
+  /** Accessible name. */
+  readonly label: import("@angular/core").InputSignal<string>;
+  /** The choices. */
+  readonly options: import("@angular/core").InputSignal<WheelOption[]>;
+  /** The selected option's value; two-way. */
+  readonly value: import("@angular/core").ModelSignal<string>;
+  /** Arrow keys wrap at the ends. */
+  readonly loop: import("@angular/core").InputSignal<boolean>;
+  /** Enabled options PageUp / PageDown move by. */
+  readonly pageSize: import("@angular/core").InputSignal<number>;
+  /** Ignores keys and clicks. */
+  readonly disabled: import("@angular/core").InputSignal<boolean>;
+  /** Form field name for a hidden input. */
+  readonly name: import("@angular/core").InputSignal<string | undefined>;
+  protected readonly uid: string;
+  private readonly list;
+  private typeahead;
+  protected selectedIndex(): number;
+  constructor();
+  private select;
+  protected onKeydown(event: KeyboardEvent): void;
+  protected onClick(event: MouseEvent): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<WheelPicker, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<WheelPicker, "lily-wheel-picker", never, {
+    "className": {
+      "alias": "className";
+      "required": false;
+      "isSignal": true;
+    };
+    "label": {
+      "alias": "label";
+      "required": true;
+      "isSignal": true;
+    };
+    "options": {
+      "alias": "options";
+      "required": true;
+      "isSignal": true;
+    };
+    "value": {
+      "alias": "value";
+      "required": false;
+      "isSignal": true;
+    };
+    "loop": {
+      "alias": "loop";
+      "required": false;
+      "isSignal": true;
+    };
+    "pageSize": {
+      "alias": "pageSize";
+      "required": false;
+      "isSignal": true;
+    };
+    "disabled": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
+    "name": {
+      "alias": "name";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "value": "valueChange";
+  }, never, never, true, never>;
+}
 /**
  * YisraelTeudatZehutInput — an input for entering Israel's Teudat Zehut (תעודת זהות)
  *