@forgeroute/ui 0.4.75 → 0.4.76

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@forgeroute/ui",
-  "version": "0.4.75",
+  "version": "0.4.76",
   "peerDependencies": {
     "@angular/common": ">=22.0.0",
     "@angular/core": ">=22.0.0",

package/types/forgeroute-ui.d.ts

@@ -68,6 +68,23 @@ export interface ToolbarAction {
    * the on / off state. Leave unset for ordinary buttons (no attribute).
    */
   pressed?: boolean;
+  /**
+   * Optional confirmation before the click is reported (library source 2026-11-05, not yet published). Set it ONLY on an action that needs a
+   * confirm dialog (pause / run now / send to all): the table shows its confirm modal first, emits `(tableButtonClick)` only when the user
+   * confirms, and emits nothing on Cancel / Escape / backdrop. An action without `confirm` behaves exactly as before. Not used for the
+   * table's own Import and Export. Same copy fields as a row action's `modal` (`message` may be a function read at click time, for text that
+   * depends on the host's current state); say what happens before -> after and what is NOT affected.
+   */
+  confirm?: ToolbarConfirm;
+}
+/** Confirm dialog copy of a toolbar action (see `ToolbarAction.confirm`). */
+export interface ToolbarConfirm {
+  title: string;
+  message: string | (() => string);
+  confirmLabel?: string;
+  cancelLabel?: string;
+  variant?: 'danger' | 'primary' | 'warning';
+  details?: string[];
 }
 export interface ConfirmConfig {
   title: string;
@@ -179,6 +196,14 @@ export interface ColumnDef {
    * Example: `{ key: 'name', label: 'Name', starFn: (doc) => doc.isAuthForm ? 'Authorization Form' : null }`
    */
   starFn?: (item: any) => string | null | undefined;
+  /**
+   * Footer text for this column, from the table's `totalsEndpoint` response (shown only while the table has rows and the totals loaded).
+   * Return null / undefined / '' for an empty footer cell. `cellType: 'number'` columns are right-aligned like their body cells.
+   * The table's `totalsLabel` goes in the footer cell of the first visible column; when that column has a `footerFn` too, the label is
+   * kept as visually hidden text before the value ("Total: $1,200") so it is still announced once.
+   * Example: `{ key: 'amount', label: 'Amount', cellType: 'number', footerFn: t => t['amount'] == null ? null : '$' + t['amount'] }`
+   */
+  footerFn?: (totals: Record<string, string | number | null>) => string | null | undefined;
   /** Date format string. Default: 'MMM d, y' */
   dateFormat?: string;
   /** Returns the display name for the row. Default: item[col.key] */
@@ -1170,7 +1195,7 @@ export declare class SelectComponent implements ControlValueAccessor, Validator,
   readonly error: import("@angular/core").InputSignal<string>;
   /** Reveal the built-in error messages now (e.g. after a failed Save click), without waiting for blur. */
   readonly showErrors: import("@angular/core").InputSignal<boolean>;
-  readonly size: import("@angular/core").InputSignal<"default" | "sm">;
+  readonly size: import("@angular/core").InputSignal<"sm" | "default">;
   readonly _disabledInput: import("@angular/core").InputSignal<boolean>;
   private readonly _cvaDisabled;
   protected readonly disabled: import("@angular/core").Signal<boolean>;
@@ -1555,6 +1580,16 @@ export declare class DataTableComponent<T extends Record<string, any>> implement
   protected readonly _showHeader: Signal<boolean>;
   /** Optional endpoint that returns Record<string,number> counts per quick-filter value. */
   readonly countsEndpoint: import("@angular/core").InputSignal<string>;
+  /**
+   * Optional footer totals row. Path relative to `baseUrl` (like `endpoint`). When set, the table GETs it with the same query params as the
+   * rows request except paging and sorting (host `params`, lower-cased `search` + `searchFields`, active tab as `filter`, column filters) and
+   * shows a footer built from each column's `footerFn`. The response is `Record<string, string | number | null>`. Totals follow the FILTERED
+   * set, not the page; they are refetched on search / tab / filter / params / refresh() / resetToFirstPage() / import (not on paging or
+   * sorting) and never cached. Hidden while loading, on error, with zero rows, or when the totals request fails (silently).
+   */
+  readonly totalsEndpoint: import("@angular/core").InputSignal<string>;
+  /** Text of the footer's label cell (first visible column) and the phone summary card's accessible name. */
+  readonly totalsLabel: import("@angular/core").InputSignal<string>;
   /**
    * Optional extra query params owned by the host page (e.g. a period picker or a parent-record id),
    * sent with every row, /counts, /filter-counts and export request. When the value changes the table
@@ -1803,6 +1838,23 @@ export declare class DataTableComponent<T extends Record<string, any>> implement
   /** Current active filter/search/sort params — passed to the export so it exports the filtered view. */
   /** Visible searchable column keys (comma-joined) — the table and Export only search what's on screen. */
   protected readonly _searchFields: Signal<string>;
+  /** Latest footer totals response (null = none / failed / not requested). */
+  protected readonly _totals: import("@angular/core").WritableSignal<Record<string, string | number | null> | null>;
+  private _totalsSub?;
+  /** Set by paging and sorting: they reload rows but never change the totals. */
+  private _totalsSkipNext;
+  protected readonly _footerVisible: Signal<boolean>;
+  /** Footer text per visible column key (only columns whose footerFn returns text). */
+  protected readonly _footerCells: Signal<Record<string, string>>;
+  protected readonly _footerPhoneLines: Signal<{
+    key: string;
+    label: string;
+    value: string;
+  }[]>;
+  /** Totals request params: the export params without sorting (the rows request without paging and sorting). */
+  private _totalsParams;
+  /** `keepShown`: a silent (background) refresh keeps the current footer on screen until the new totals arrive. */
+  private _fetchTotals;
   protected readonly _exportParams: Signal<Record<string, string>>;
   /**
    * Toolbar buttons with auto-injected Export (always) and Import (only when
@@ -1868,6 +1920,13 @@ export declare class DataTableComponent<T extends Record<string, any>> implement
   protected rowActionsLabel(item: T): string;
   protected toggleSelectAll(): void;
   protected toggleRow(item: T): void;
+  /**
+   * The table's current query as the parameters it sends with Export: the host `params`, the lower-cased `search` (+ `searchFields`),
+   * the active quick tab as `filter`, `sort` + `direction`, and every active column filter (multi-values comma-joined). A new copy
+   * on every call; reading it changes nothing. A host uses it to act on exactly what the table shows (print the same rows, call a
+   * report endpoint with the same search / filters) without keeping its own copy of that state. Paging is not included.
+   */
+  currentQuery(): Record<string, string>;
   /** Clears the selection — call from the host component after a bulk action completes. */
   clearSelection(): void;
   resetColumns(): void;
@@ -2023,7 +2082,7 @@ export declare class DataTableComponent<T extends Record<string, any>> implement
   protected onRowClick(item: T): void;
   /** Enter / Space on a focused clickable row or card activates it — ignored when focus is on a control inside it. */
   protected onRowKeydown(e: KeyboardEvent, item: T): void;
-  protected onInternalButtonClick(type: string): void;
+  protected onInternalButtonClick(type: string): Promise<void>;
   protected onImported(): void;
   /** Row actions visible for the current permission: everything for 'full'; otherwise only View (`type: 'view'`) and actions marked
    *  `allowReadOnly` (never the built-in delete). The Actions column itself is shown only while some row has a visible action. */
@@ -2169,6 +2228,16 @@ export declare class DataTableComponent<T extends Record<string, any>> implement
       "required": false;
       "isSignal": true;
     };
+    "totalsEndpoint": {
+      "alias": "totalsEndpoint";
+      "required": false;
+      "isSignal": true;
+    };
+    "totalsLabel": {
+      "alias": "totalsLabel";
+      "required": false;
+      "isSignal": true;
+    };
     "params": {
       "alias": "params";
       "required": false;
@@ -2283,7 +2352,7 @@ export declare class SidePanelComponent implements OnDestroy {
   readonly cancelLabel: import("@angular/core").InputSignal<string>;
   /** Right-aligned primary action button label. Empty string = hidden. */
   readonly primaryLabel: import("@angular/core").InputSignal<string>;
-  readonly primaryVariant: import("@angular/core").InputSignal<"warning" | "danger" | "primary">;
+  readonly primaryVariant: import("@angular/core").InputSignal<"primary" | "danger" | "warning">;
   readonly primaryLoading: import("@angular/core").InputSignal<boolean>;
   readonly primaryDisabled: import("@angular/core").InputSignal<boolean>;
   /** `data-testid` of the Cancel button; none when empty (default). */
@@ -2414,7 +2483,7 @@ export declare class ModalComponent implements OnInit, OnDestroy {
    */
   readonly describedBy: import("@angular/core").InputSignal<string | null>;
   readonly maxWidth: import("@angular/core").InputSignal<string>;
-  readonly bodyOverflow: import("@angular/core").InputSignal<"hidden" | "visible" | "auto">;
+  readonly bodyOverflow: import("@angular/core").InputSignal<"hidden" | "auto" | "visible">;
   /** `data-testid` of the dialog element itself (the host `<ui-modal>` is always in the page, the dialog only while open). None when empty. */
   readonly dialogTestId: import("@angular/core").InputSignal<string>;
   /** Hides the header X button (e.g. while a request is running). Escape and a backdrop click still close unless `closable` is false. */
@@ -2545,7 +2614,7 @@ export declare class ModalComponent implements OnInit, OnDestroy {
     "close": "close";
   }, never, ["[modal-header-end]", "*", "[modal-footer-left]", "[modal-footer-center]", "[modal-footer-right]"], true, never>;
 }
-export type ToastType = 'success' | 'error' | 'info';
+export type ToastType = 'success' | 'error' | 'info' | 'warning';
 /** A button on a toast (e.g. "View Contact", "Call Back"). */
 export interface ToastAction {
   /** Identifies the button in `onAction` and in the `(action)` output; also the test id suffix (`toast-action-<id>`). */
@@ -2565,11 +2634,11 @@ export interface ToastActionEvent {
   key?: string;
 }
 /**
- * Per-message options for `show()` / `success()` / `info()` / `error()` / `notify()`. Every field is optional; a call without any of them is a plain
+ * Per-message options for `show()` / `success()` / `info()` / `warning()` / `error()` / `notify()`. Every field is optional; a call without any of them is a plain
  * toast exactly as before.
  */
 export interface ToastOptions {
-  /** Only `notify()` reads this (`show` / `success` / `info` / `error` fix their own type). Default `success`. */
+  /** Only `notify()` reads this (`show` / `success` / `info` / `warning` / `error` fix their own type). Default `success`. */
   type?: ToastType;
   /** How long it stays, in ms. Default: 3000 (4000 for errors). */
   duration?: number;
@@ -2651,6 +2720,12 @@ export declare class ToastService implements OnDestroy {
   success(msg: string, durationOrOptions?: number | ToastOptions): void;
   /** Neutral (blue) toast for a result that is neither a success nor a failure, e.g. "No changes to save.". */
   info(msg: string, durationOrOptions?: number | ToastOptions): void;
+  /**
+   * Amber toast for a result that worked but needs attention, e.g. "Saved, but 2 screenshots could not be attached." Announced politely (not as an
+   * alert: nothing failed). Default 4000ms, a little longer than info because the user has something to read and maybe act on.
+   * (library source 2026-11-04, not yet published)
+   */
+  warning(msg: string, durationOrOptions?: number | ToastOptions): void;
   error(msg: string, durationOrOptions?: number | ToastOptions): void;
   /** A toast whose type comes from `options.type` (default `success`); the same as the named methods otherwise. */
   notify(msg: string, options?: ToastOptions): void;
@@ -2869,6 +2944,86 @@ export declare class ProgressBarComponent {
     };
   }, {}, never, never, true, never>;
 }
+/** Library source 2026-11-05, not yet published. One segment of a `ui-stacked-bar`. */
+export interface StackedBarSegment {
+  /** Name shown in the legend and read out for the segment. */
+  label: string;
+  /** Amount of this segment (negative / NaN count as 0). */
+  value: number;
+  /** Built-in colour (same set as `ui-progress-bar`). Default: a fixed rotation by position. */
+  variant?: ProgressBarVariant;
+  /** Any CSS colour; wins over `variant`. */
+  color?: string;
+}
+/**
+ * A single horizontal bar split into coloured segments by their share of the total (e.g. an aging snapshot: current / 1-30 / 31-60 / 61-90 / 91+).
+ * Pure CSS (no chart library): each segment's width is its rounded share, a value above 0 is never drawn narrower than 2%, segments of 0 are left
+ * out of the bar (but stay in the legend). A total of 0 draws an empty track.
+ *
+ * Accessible without sight: the coloured strip is decorative (`aria-hidden`); the legend is a real list ("<label>: <value> (<share>%)") that is always
+ * in the page, and `showLegend="false"` only hides it visually. The group is named by `ariaLabel`. Each segment also has a hover `title`.
+ * Colours never carry the meaning alone (the legend repeats label, value and share); forced-colors mode draws the segments with a border.
+ *
+ * Inputs: `segments`, `ariaLabel`, `height` (px, default 14), `showLegend` (default true), `formatValue` (default: en-US grouped number; pass e.g. a
+ * currency formatter). Output: none.
+ */
+export declare class StackedBarComponent {
+  readonly segments: import("@angular/core").InputSignal<StackedBarSegment[]>;
+  readonly ariaLabel: import("@angular/core").InputSignal<string>;
+  readonly height: import("@angular/core").InputSignal<number>;
+  readonly showLegend: import("@angular/core").InputSignal<boolean>;
+  readonly formatValue: import("@angular/core").InputSignal<(value: number) => string>;
+  /** Segments with their cleaned value, colour and share (legend order = input order). */
+  protected readonly rows: import("@angular/core").Signal<{
+    percent: number;
+    text: string;
+    title: string;
+    key: string;
+    label: string;
+    color: string;
+    variant: ProgressBarVariant;
+    value: number;
+  }[]>;
+  /** Only the segments that have something to draw. */
+  protected readonly drawn: import("@angular/core").Signal<{
+    percent: number;
+    text: string;
+    title: string;
+    key: string;
+    label: string;
+    color: string;
+    variant: ProgressBarVariant;
+    value: number;
+  }[]>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<StackedBarComponent, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<StackedBarComponent, "ui-stacked-bar", never, {
+    "segments": {
+      "alias": "segments";
+      "required": false;
+      "isSignal": true;
+    };
+    "ariaLabel": {
+      "alias": "ariaLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "height": {
+      "alias": "height";
+      "required": false;
+      "isSignal": true;
+    };
+    "showLegend": {
+      "alias": "showLegend";
+      "required": false;
+      "isSignal": true;
+    };
+    "formatValue": {
+      "alias": "formatValue";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
 export type ProgressRingVariant = 'blue' | 'green' | 'amber' | 'red' | 'slate' | 'sky';
 /**
  * Circular progress ring with the rounded percentage (or a custom `label`) in the middle.
@@ -3242,7 +3397,7 @@ export declare class CheckboxComponent implements ControlValueAccessor, Validato
    * clicking it still toggles the box - e.g. a product name that is both the heading of its card and the label of its checkbox.
    * Default null: plain label text, exactly as before. Single mode only.
    */
-  readonly headingLevel: import("@angular/core").InputSignal<1 | 2 | 3 | 4 | 5 | 6 | null>;
+  readonly headingLevel: import("@angular/core").InputSignal<1 | 2 | 5 | 3 | 6 | 4 | null>;
   readonly indeterminate: import("@angular/core").InputSignal<boolean>;
   readonly checked: import("@angular/core").ModelSignal<boolean>;
   /**
@@ -3647,7 +3802,7 @@ export declare class StepperComponent {
    * its circle, one continuous line behind the circles that fills as steps complete; a complete step shows a check, the current step an
    * accent ring with a dot, an upcoming step an empty circle (no numbers). Circles are 40px (32px with `size="sm"`).
    */
-  readonly labelPosition: import("@angular/core").InputSignal<"below" | "beside">;
+  readonly labelPosition: import("@angular/core").InputSignal<"beside" | "below">;
   /** Viewport width in px below which a horizontal stepper is drawn vertical (labels beside the circles), e.g. `640`. null (default) = never. */
   readonly stackBelow: import("@angular/core").InputSignal<number | null>;
   /** CSS length (e.g. `10.5rem`): horizontal only - the list gets `min-width: calc(<step count> * <value>)`. Empty (default) = no minimum. */
@@ -4281,7 +4436,7 @@ export declare class ButtonComponent {
    * `ghost-start`: a ghost button for list / section toggles - a full-width row with its content aligned to the start, transparent
    * background, hover tint and the normal focus ring. Pair it with `ariaExpanded` / `ariaPressed`; the label may contain a heading element.
    */
-  readonly variant: import("@angular/core").InputSignal<"link" | "icon" | "warning" | "danger" | "primary" | "secondary" | "ghost" | "ghost-start" | "tab" | "icon-danger">;
+  readonly variant: import("@angular/core").InputSignal<"link" | "primary" | "secondary" | "danger" | "warning" | "ghost" | "ghost-start" | "tab" | "icon" | "icon-danger">;
   /** Renders an anchor to this route instead of a button (use with `variant="link"` for an inline text link). `['/settings']` or `'/settings'`. While `disabled` or `loading` it renders a non-clickable `<span role="link" aria-disabled>` with no href (like `href`). */
   readonly routerLink: import("@angular/core").InputSignal<string | readonly unknown[] | null>;
   /** Query params of the `routerLink` (e.g. `{ section: 'deal-defaults' }`). */
@@ -4910,7 +5065,7 @@ export declare class BulkMessagePanelComponent {
   readonly sending: import("@angular/core").InputSignal<boolean>;
   readonly closed: import("@angular/core").OutputEmitterRef<void>;
   readonly send: import("@angular/core").OutputEmitterRef<BulkMessageSendEvent>;
-  readonly channel: import("@angular/core").WritableSignal<"email" | "text">;
+  readonly channel: import("@angular/core").WritableSignal<"text" | "email">;
   private readonly _subject;
   private readonly _body;
   get subject(): string;
@@ -5438,7 +5593,7 @@ export declare class TextInputComponent implements ControlValueAccessor, Validat
   readonly passwordRequirements: import("@angular/core").InputSignal<boolean>;
   /** Rules for `passwordRequirements`; default = the library's five rules (8+ characters, upper, lower, digit, special). */
   readonly passwordRules: import("@angular/core").InputSignal<readonly PasswordRule[] | undefined>;
-  readonly type: import("@angular/core").InputSignal<"number" | "email" | "text" | "tel" | "password" | "url">;
+  readonly type: import("@angular/core").InputSignal<"number" | "text" | "email" | "tel" | "password" | "url">;
   readonly maxlength: import("@angular/core").InputSignal<number | undefined>;
   readonly required: import("@angular/core").InputSignal<boolean>;
   readonly autocomplete: import("@angular/core").InputSignal<string>;
@@ -5447,7 +5602,7 @@ export declare class TextInputComponent implements ControlValueAccessor, Validat
    * `search`, `text`, `none`). Empty (default) = the browser's default for the field, except `type="tel"`, which keeps `tel`.
    * It only picks the keyboard; it does not restrict what can be typed or pasted.
    */
-  readonly inputmode: import("@angular/core").InputSignal<"" | "none" | "email" | "search" | "text" | "numeric" | "tel" | "url" | "decimal">;
+  readonly inputmode: import("@angular/core").InputSignal<"" | "none" | "text" | "search" | "decimal" | "email" | "tel" | "url" | "numeric">;
   readonly readonly: import("@angular/core").InputSignal<boolean>;
   readonly hint: import("@angular/core").InputSignal<string>;
   /** Id(s) of an external element that also describes this control (e.g. one shared error text for a group of fields). Space separated; MERGED after the control's own hint / error id in `aria-describedby`, never replacing it. Empty = unchanged. */
@@ -5519,7 +5674,7 @@ export declare class TextInputComponent implements ControlValueAccessor, Validat
   protected readonly _stepAttr: import("@angular/core").Signal<string | null>;
   protected readonly _revealable: import("@angular/core").Signal<boolean>;
   protected readonly _shown: import("@angular/core").WritableSignal<boolean>;
-  protected readonly _inputType: import("@angular/core").Signal<"number" | "email" | "text" | "tel" | "password" | "url">;
+  protected readonly _inputType: import("@angular/core").Signal<"number" | "text" | "email" | "tel" | "password" | "url">;
   protected readonly _eyePath: string;
   protected readonly _eyeOffPath: string;
   protected readonly _showRequirements: import("@angular/core").Signal<boolean>;
@@ -5544,6 +5699,26 @@ export declare class TextInputComponent implements ControlValueAccessor, Validat
    * view exists, or on a disabled field, it does nothing and never throws.
    */
   focus(options?: FocusOptions): void;
+  /**
+   * Library source 2026-11-05, not yet published. Caret access for hosts (e.g. an "insert variable at the cursor" chip row), so a host never
+   * queries the inner element. Reach it with `viewChild(TextInputComponent)`. All three methods are safe at any time: before the view exists, on a
+   * disabled / read-only field, or for a type that has no selection API (email, number) they do nothing / return null and never throw.
+   *
+   * `getSelection()` -> `{ start, end }` of the selected text (equal when only a caret) or `null` when it cannot be read.
+   */
+  getSelection(): {
+    start: number;
+    end: number;
+  } | null;
+  /** Selects `start`..`end` (a caret when `end` is left out); values are clamped to the text. Does nothing where the selection API is unavailable. */
+  setSelection(start: number, end?: number): void;
+  /**
+   * Inserts `text` at the caret, replacing any selected text, and puts the caret right after it. The change goes through the normal typing path
+   * (formatting, `ngModel` / form control, `valueChange`), exactly as if the user had typed it, and `maxlength` caps it like typing does (the
+   * part that does not fit is not inserted). With no caret known (a type without a selection API) the text is appended. Does nothing on a
+   * disabled or read-only field or for an empty `text`.
+   */
+  insertAtCaret(text: string): void;
   private _onChange;
   private _onTouched;
   private _onValidatorChange;
@@ -5873,6 +6048,27 @@ export declare class TextareaInputComponent implements ControlValueAccessor, Val
    * nothing and never throws.
    */
   focus(options?: FocusOptions): void;
+  /**
+   * Library source 2026-11-05, not yet published. Caret access for hosts (e.g. an "insert variable at the cursor" chip row), so a host never
+   * queries the inner element. Reach it with `viewChild(TextareaInputComponent)`. All three methods are safe at any time: before the view exists, on a
+   * disabled / read-only field they do nothing / return null and never throw.
+   *
+   * `getSelection()` -> `{ start, end }` of the selected text (equal when only a caret) or `null` when it cannot be read.
+   */
+  getSelection(): {
+    start: number;
+    end: number;
+  } | null;
+  /** Selects `start`..`end` (a caret when `end` is left out); values are clamped to the text. Does nothing where the selection API is unavailable. */
+  setSelection(start: number, end?: number): void;
+  /**
+   * Inserts `text` at the caret, replacing any selected text, and puts the caret right after it. The change goes through the normal typing path
+   * (`ngModel` / form control), exactly as if the user had typed it, and `maxlength` caps it like typing does (the
+   * part that does not fit is not inserted). With no caret known the text is appended. Does nothing on a
+   * disabled or read-only field or for an empty `text`.
+   */
+  insertAtCaret(text: string): void;
+  private _textarea;
   private _onChange;
   private _onTouched;
   writeValue(val: string | null): void;
@@ -6393,7 +6589,7 @@ export declare class CopyFieldComponent implements OnDestroy {
   /** Neither the Clipboard API nor the fallback could copy. */
   readonly copyFailed: import("@angular/core").OutputEmitterRef<void>;
   protected readonly _id: string;
-  protected readonly _state: import("@angular/core").WritableSignal<"idle" | "copied" | "failed">;
+  protected readonly _state: import("@angular/core").WritableSignal<"idle" | "failed" | "copied">;
   protected readonly _announcement: import("@angular/core").Signal<string>;
   protected readonly _buttonName: import("@angular/core").Signal<string>;
   protected readonly _describedBy: import("@angular/core").Signal<string | null>;
@@ -7561,16 +7757,28 @@ export declare class FormColSpanDirective {
  */
 /** One secondary line under the title: plain text, or text with a small icon and a tone (`danger` red, `warning` amber). */
 export type ListItemDetail = string | {
-  text: string;
+  text?: string;
+  segments?: ListItemSegment[];
   icon?: string;
   tone?: 'default' | 'warning' | 'danger';
 };
+/**
+ * One piece of a rich detail line (library source 2026-11-04, not yet published): plain text, or text shown in bold and/or as inline code. Rich text
+ * is structured data, never HTML, so nothing is injected. `{ segments: ['Click ', { text: 'Connect', bold: true }, ' and copy ', { text: 'client_id', code: true }] }`
+ * renders `Click <strong>Connect</strong> and copy <code>client_id</code>`. A detail with `segments` ignores `text` for display (when `text` is empty
+ * the segments' plain text is used, e.g. for the visible-line check).
+ */
+export type ListItemSegment = string | {
+  text: string;
+  bold?: boolean;
+  code?: boolean;
+};
 /** Colour of the optional leading icon tile. */
 export type ListItemIconColor = 'slate' | 'amber' | 'red' | 'blue' | 'green' | 'purple' | 'teal' | 'orange';
 export declare class ListItemComponent implements AfterContentChecked {
   private readonly host;
   /** Show a radio button, checkbox, or nothing on the left. */
-  readonly leading: import("@angular/core").InputSignal<"none" | "radio" | "checkbox">;
+  readonly leading: import("@angular/core").InputSignal<"none" | "checkbox" | "radio">;
   /** `name` attribute for the radio/checkbox (groups radios together). */
   readonly inputName: import("@angular/core").InputSignal<string>;
   /** `id` attribute for the radio/checkbox (links the label). */
@@ -7652,6 +7860,11 @@ export declare class ListItemComponent implements AfterContentChecked {
   protected onRowKey(e: Event): void;
   protected readonly visibleDetails: () => {
     text: string;
+    segs: {
+      text: string;
+      bold: boolean;
+      code: boolean;
+    }[] | null;
     d: string | null;
     tone: "default" | "warning" | "danger";
   }[];
@@ -9120,7 +9333,7 @@ export declare class IconComponent {
   readonly ariaLabel: import("@angular/core").InputSignal<string>;
   /** Icon size in px. */
   readonly size: import("@angular/core").InputSignal<number>;
-  readonly variant: import("@angular/core").InputSignal<"default" | "danger">;
+  readonly variant: import("@angular/core").InputSignal<"danger" | "default">;
   readonly disabled: import("@angular/core").InputSignal<boolean>;
   /** The host is running the request this icon started: a spinner replaces the picture and the button is disabled (no click) until it is false again. */
   readonly loading: import("@angular/core").InputSignal<boolean>;
@@ -9232,7 +9445,7 @@ export declare class TimelineComponent {
   /** Any CSS length (e.g. `600px`). When set, the list scrolls inside a keyboard-focusable region of at most this height. Empty = no wrapper. */
   readonly maxHeight: import("@angular/core").InputSignal<string>;
   /** `below` (default): the time is under the title / description. `end`: the time sits right-aligned on the title row. */
-  readonly timePosition: import("@angular/core").InputSignal<"below" | "end">;
+  readonly timePosition: import("@angular/core").InputSignal<"end" | "below">;
   /**
    * Group the items under a heading per calendar day of `dateTime` ("Today", "Yesterday", "Oct 3", "Oct 3, 2025"). Default false = no headings,
    * DOM unchanged. The given order is kept: consecutive items of one day share a heading, the same day appearing again later starts a new group.
@@ -11213,7 +11426,7 @@ export declare class PdfHotspotComponent {
   /** `ready`: clickable; `blocked`: disabled (a prerequisite is missing); `signed`: shows `image`. */
   readonly state: import("@angular/core").InputSignal<"ready" | "blocked" | "signed">;
   /** `warning` gives the ready state an amber look (e.g. for initials), default is blue. */
-  readonly tone: import("@angular/core").InputSignal<"warning" | "primary">;
+  readonly tone: import("@angular/core").InputSignal<"primary" | "warning">;
   /** Text of the ready button (e.g. "Sign Here"). */
   readonly label: import("@angular/core").InputSignal<string>;
   /** Text of the blocked button (e.g. "Add signature above"). */
@@ -11350,7 +11563,7 @@ export declare class DetailCardComponent {
   /** true (default) = the title is displayed in capitals (CSS only); false = shown as written. The text, aria-label and heading name are never changed. */
   readonly uppercaseTitle: import("@angular/core").InputSignal<boolean>;
   /** 1-6 makes the title a real heading for screen readers (role=heading, aria-level); null keeps it plain text. */
-  readonly headingLevel: import("@angular/core").InputSignal<1 | 2 | 3 | 4 | 5 | 6 | null>;
+  readonly headingLevel: import("@angular/core").InputSignal<1 | 2 | 5 | 3 | 6 | 4 | null>;
   /** Optional id for the title text; the card is then labelled by it. Without it the title is the card's aria-label. */
   readonly titleId: import("@angular/core").InputSignal<string>;
   /** Accessible name of the card when the header gives none (no header, or no title). A visible title wins; blank = no name. */
@@ -11364,7 +11577,7 @@ export declare class DetailCardComponent {
   /** Background colour of the footer bar (the `[card-footer]` slot) as any CSS colour. Empty = no colour of its own. */
   readonly footerBackground: import("@angular/core").InputSignal<string>;
   /** Alignment of the `[card-footer]` content: `'start'` (default, unchanged) or `'end'` = a right-aligned action row with an 8px gap. */
-  readonly footerAlign: import("@angular/core").InputSignal<"end" | "start">;
+  readonly footerAlign: import("@angular/core").InputSignal<"start" | "end">;
   /** Text colour as any CSS colour (`#fff`, `var(--on-dark)` …). Empty = the default colours. Colours the title, subtitle, chevron and body text. */
   readonly textColor: import("@angular/core").InputSignal<string>;
   /** false = no header at all (no title, edit button, toggle or divider): the card is only the body, always open. */
@@ -16134,7 +16347,7 @@ export declare class PaymentSidePanelComponent {
   private readonly terminalAvailable;
   /** value -> label of every live method the rendered plugins contribute (the first plugin wins a duplicate value). */
   private readonly liveMethods;
-  protected readonly kind: import("@angular/core").Signal<"none" | "live" | "terminal" | "manual">;
+  protected readonly kind: import("@angular/core").Signal<"none" | "manual" | "live" | "terminal">;
   private kindOf;
   /** The method list as shown: record-only built-ins (a plugin takes over its own values), plugin extras, and only manual ones while a split is being built. */
   readonly methodList: import("@angular/core").Signal<PaymentMethodOption[]>;