@forgeroute/ui 0.4.4 → 0.4.5

package/types/forgeroute-ui.d.ts

@@ -940,6 +940,13 @@ export interface SelectOption<V extends string | number = string> {
    * `aria-describedby`) and sets it as the option's `title` tooltip where the browser shows one. Options without it are unchanged.
    */
   description?: string;
+  /**
+   * Optional short tag shown after the label, e.g. `{ label: 'Pro plan', badge: 'Partner: Acme' }` is listed as "Pro plan — Partner: Acme".
+   * A native `<option>` can only hold text (no elements, no colours), so the badge is a TEXT suffix joined by " —" (space, em dash,
+   * space); screen readers read it as part of the option. The selected value, search-by-typing and the description are unaffected.
+   * Options without it are unchanged.
+   */
+  badge?: string;
 }
 export declare class SelectComponent implements ControlValueAccessor, Validator, UiFieldValidity {
   readonly label: import("@angular/core").InputSignal<string>;
@@ -1808,6 +1815,10 @@ export declare class SidePanelComponent implements OnDestroy {
   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). */
+  readonly cancelTestId: import("@angular/core").InputSignal<string>;
+  /** `data-testid` of the primary footer button; none when empty (default). */
+  readonly primaryTestId: import("@angular/core").InputSignal<string>;
   readonly closed: import("@angular/core").OutputEmitterRef<void>;
   readonly primaryClick: import("@angular/core").OutputEmitterRef<void>;
   protected readonly titleId: string;
@@ -1875,10 +1886,20 @@ export declare class SidePanelComponent implements OnDestroy {
       "required": false;
       "isSignal": true;
     };
+    "cancelTestId": {
+      "alias": "cancelTestId";
+      "required": false;
+      "isSignal": true;
+    };
+    "primaryTestId": {
+      "alias": "primaryTestId";
+      "required": false;
+      "isSignal": true;
+    };
   }, {
     "closed": "closed";
     "primaryClick": "primaryClick";
-  }, never, ["*"], true, never>;
+  }, never, ["*", "[panel-footer-extra]"], true, never>;
 }
 export declare class ModalComponent implements OnInit, OnDestroy {
   readonly open: import("@angular/core").InputSignal<boolean>;
@@ -1886,6 +1907,15 @@ export declare class ModalComponent implements OnInit, OnDestroy {
   readonly description: import("@angular/core").InputSignal<string>;
   readonly maxWidth: import("@angular/core").InputSignal<string>;
   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. */
+  readonly hideClose: import("@angular/core").InputSignal<boolean>;
+  /**
+   * `false` = the user cannot dismiss the dialog: the X button is hidden and Escape / a backdrop click do not emit `close`
+   * (e.g. while a save is running; the host closes it itself). Default `true` = today's behaviour.
+   */
+  readonly closable: import("@angular/core").InputSignal<boolean>;
   readonly close: import("@angular/core").OutputEmitterRef<void>;
   protected readonly titleId: string;
   private readonly el;
@@ -1929,9 +1959,24 @@ export declare class ModalComponent implements OnInit, OnDestroy {
       "required": false;
       "isSignal": true;
     };
+    "dialogTestId": {
+      "alias": "dialogTestId";
+      "required": false;
+      "isSignal": true;
+    };
+    "hideClose": {
+      "alias": "hideClose";
+      "required": false;
+      "isSignal": true;
+    };
+    "closable": {
+      "alias": "closable";
+      "required": false;
+      "isSignal": true;
+    };
   }, {
     "close": "close";
-  }, never, ["*", "[modal-footer-left]", "[modal-footer-right]"], true, never>;
+  }, never, ["*", "[modal-footer-left]", "[modal-footer-center]", "[modal-footer-right]"], true, never>;
 }
 export type ToastType = 'success' | 'error' | 'info';
 export declare class ToastService implements OnDestroy {
@@ -2418,6 +2463,8 @@ export interface CheckboxOption {
   /** Helper text under the option. */
   description?: string;
   disabled?: boolean;
+  /** `data-testid` of this option's native checkbox (e.g. for end-to-end tests); none when omitted. */
+  testId?: string;
 }
 export declare class CheckboxComponent implements ControlValueAccessor, Validator, UiFieldValidity {
   readonly label: import("@angular/core").InputSignal<string>;
@@ -2434,6 +2481,26 @@ export declare class CheckboxComponent implements ControlValueAccessor, Validato
   readonly options: import("@angular/core").InputSignal<CheckboxOption[]>;
   /** Group heading (the fieldset's legend). */
   readonly legend: import("@angular/core").InputSignal<string>;
+  /**
+   * `ui-checkbox-group` is the same component under a group-friendly tag: `<ui-checkbox-group legend="Interests" [options]="opts" [(ngModel)]="picked" />`
+   * (value = array of ticked option values). On the `<ui-checkbox-group>` tag the legend falls back to `label` when `legend` is empty (`<ui-checkbox [options]>` ignores `label` as before).
+   */
+  protected readonly _legend: import("@angular/core").Signal<string>;
+  /** Group mode: lay the options out in a column (default) or in a wrapping row. */
+  readonly orientation: import("@angular/core").InputSignal<"vertical" | "horizontal">;
+  /**
+   * Group mode: the ticked option values as a two-way model (`[(values)]`), an alternative to ngModel / forms. Unset (default) = the
+   * group is driven by ngModel / FormControl only. Values that are not an option are dropped and the order follows `options`.
+   */
+  readonly values: import("@angular/core").ModelSignal<string[] | undefined>;
+  /** Single mode: small helper text under the label, linked to the native checkbox with `aria-describedby`. None when empty (default). */
+  readonly description: import("@angular/core").InputSignal<string>;
+  /** Set when the host projects a `[checkbox-trailing]` element (see `CheckboxTrailingDirective`). */
+  private readonly _trailingContent;
+  protected readonly _trailing: import("@angular/core").Signal<boolean>;
+  private readonly _host;
+  /** `aria-describedby` of the single checkbox: its description, then the error / hint; none when neither exists (as before). */
+  protected readonly _singleDescribedBy: import("@angular/core").Signal<string | null>;
   /** Indent this checkbox (or the whole group) under its parent option, aligned with the parent's label. */
   readonly indent: import("@angular/core").InputSignal<boolean>;
   protected readonly groupMode: import("@angular/core").Signal<boolean>;
@@ -2460,6 +2527,14 @@ export declare class CheckboxComponent implements ControlValueAccessor, Validato
   protected readonly _activeError: import("@angular/core").Signal<string>;
   private _onValidatorChange;
   constructor();
+  /**
+   * Puts the box back to a state chosen by the host after it refused a change (e.g. a confirm was declined). Writes the model, the
+   * native input(s) and the form control, which re-setting the same bound value cannot do (the one-way binding sees no change
+   * while the DOM and the internal state already moved). Single mode: `reset(false)` / `reset(true)`; group mode: `reset(['a'])`.
+   */
+  reset(value?: boolean | string[]): void;
+  /** Sets every native checkbox of this component to the state the component holds (the DOM may have moved ahead of it). */
+  private _syncNative;
   /** Re-run the form control's validation when a rule input (`required`, `requiredMessage`, `label`) changes. */
   ngOnChanges(): void;
   validate(control: AbstractControl): ValidationErrors | null;
@@ -2481,7 +2556,7 @@ export declare class CheckboxComponent implements ControlValueAccessor, Validato
   /** Group mode: ticks / unticks one option; the form gets the full list of ticked values. */
   onToggleOption(value: string, event: Event): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<CheckboxComponent, never>;
-  static ɵcmp: i0.ɵɵComponentDeclaration<CheckboxComponent, "ui-checkbox", never, {
+  static ɵcmp: i0.ɵɵComponentDeclaration<CheckboxComponent, "ui-checkbox, ui-checkbox-group", never, {
     "label": {
       "alias": "label";
       "required": false;
@@ -2512,6 +2587,21 @@ export declare class CheckboxComponent implements ControlValueAccessor, Validato
       "required": false;
       "isSignal": true;
     };
+    "orientation": {
+      "alias": "orientation";
+      "required": false;
+      "isSignal": true;
+    };
+    "values": {
+      "alias": "values";
+      "required": false;
+      "isSignal": true;
+    };
+    "description": {
+      "alias": "description";
+      "required": false;
+      "isSignal": true;
+    };
     "indent": {
       "alias": "indent";
       "required": false;
@@ -2549,8 +2639,23 @@ export declare class CheckboxComponent implements ControlValueAccessor, Validato
     };
   }, {
     "checked": "checkedChange";
+    "values": "valuesChange";
     "invalidChange": "invalidChange";
-  }, never, ["*"], true, never>;
+  }, ["_trailingContent"], ["*", "[checkbox-trailing]"], true, never>;
+}
+/**
+ * Marks content that a single `ui-checkbox` shows at the END of its row, outside the clickable label (a badge, a price, a link):
+ *
+ *   <ui-checkbox label="Priority handling" description="Ships first" [(ngModel)]="priority">
+ *     <span checkbox-trailing>$5.00</span>
+ *   </ui-checkbox>
+ *
+ * Import this directive in the host component (it is how the checkbox knows a trailing slot is in use); without it the checkbox
+ * renders exactly as before. Clicking the trailing content does not toggle the box.
+ */
+export declare class CheckboxTrailingDirective {
+  static ɵfac: i0.ɵɵFactoryDeclaration<CheckboxTrailingDirective, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<CheckboxTrailingDirective, "[checkbox-trailing]", never, {}, {}, never, never, true, never>;
 }
 /**
  * On/off switch for settings: a label and optional hint on the left, the switch on the right
@@ -2946,15 +3051,20 @@ export declare class RadioGroupComponent implements ControlValueAccessor, Valida
   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 orientation: import("@angular/core").InputSignal<"horizontal" | "vertical">;
+  readonly orientation: import("@angular/core").InputSignal<"vertical" | "horizontal">;
   /** Native `name` shared by the radios; a unique one is generated when omitted. */
   readonly name: import("@angular/core").InputSignal<string>;
+  /** `<ng-template uiRadioOptionContent="value">` children: content shown under that option while it is selected. */
+  private readonly _optionContent;
+  protected readonly _nestedContent: import("@angular/core").Signal<Map<string, TemplateRef<unknown>>>;
   protected readonly _disabledInput: import("@angular/core").InputSignal<boolean>;
   private readonly _cvaDisabled;
   protected readonly disabled: import("@angular/core").Signal<boolean>;
   private readonly _generatedName;
   protected get _name(): string;
   protected readonly _descId: string;
+  /** Id of the content block under the selected option; that radio points at it with aria-controls. */
+  protected readonly _nestedId: string;
   protected readonly _value: import("@angular/core").WritableSignal<string>;
   private readonly _reveal;
   private readonly _issue;
@@ -3030,7 +3140,7 @@ export declare class RadioGroupComponent implements ControlValueAccessor, Valida
     };
   }, {
     "invalidChange": "invalidChange";
-  }, never, never, true, never>;
+  }, ["_optionContent"], never, true, never>;
 }
 /** One phone number the host found for sale. */
 export interface PhoneNumberOption {
@@ -3222,11 +3332,17 @@ export declare class PhoneNumberPickerComponent {
   }, never, never, true, never>;
 }
 export declare class ButtonComponent {
-  readonly variant: import("@angular/core").InputSignal<"primary" | "secondary" | "danger" | "warning" | "link" | "ghost" | "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'`. */
+  /**
+   * `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<"primary" | "secondary" | "danger" | "warning" | "link" | "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' }`). */
   readonly queryParams: import("@angular/core").InputSignal<Record<string, unknown> | null>;
+  /** Fragment (hash) of the `routerLink`, without the `#` (e.g. `'billing'` -> `/settings#billing`). */
+  readonly fragment: import("@angular/core").InputSignal<string | null>;
   /**
    * Renders a plain `<a href>` instead of a button: for `mailto:`, `tel:`, `sms:`, `https://…` and relative URLs (use with
    * `variant="link"` for an inline text link). The browser handles the click, so middle-click, copy-link and open-in-new-tab work and
@@ -3272,6 +3388,11 @@ export declare class ButtonComponent {
       "required": false;
       "isSignal": true;
     };
+    "fragment": {
+      "alias": "fragment";
+      "required": false;
+      "isSignal": true;
+    };
     "href": {
       "alias": "href";
       "required": false;
@@ -3761,6 +3882,12 @@ export declare class TextInputComponent implements ControlValueAccessor, Validat
   /** Accessible name for a field with no visible label (e.g. an inline cell or title input). */
   readonly ariaLabel: import("@angular/core").InputSignal<string>;
   readonly placeholder: import("@angular/core").InputSignal<string>;
+  /**
+   * An optional leading mark shown inside the field, left of the text (e.g. `prefix="$"` for a dollar amount). Hidden unless set; it is
+   * decoration only (not part of the value, not read by screen readers), so say the unit in the label too when it matters ("Amount (USD)").
+   * Meant for a short mark of 1-3 characters.
+   */
+  readonly prefix: import("@angular/core").InputSignal<string>;
   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>;
@@ -3793,17 +3920,31 @@ export declare class TextInputComponent implements ControlValueAccessor, Validat
    * (otherwise a dev-mode warning is logged once and string behaviour is used).
    */
   readonly valueType: import("@angular/core").InputSignal<"string" | "number">;
+  /**
+   * Optional text filter/mask applied to every typed or pasted value: `(raw) => cleaned`, e.g. `v => v.replace(/\D/g, '').slice(0, 9)`.
+   * The result is what the box shows and what the model gets (the caret moves to the end when the text was changed). Unset (default)
+   * = the typed text is used as is. Not applied to values the host writes (`writeValue`), and for `type="tel"` / `phoneFormat` the
+   * phone formatting runs first and the formatter then sees its result.
+   */
+  readonly formatter: import("@angular/core").InputSignal<((raw: string) => string) | undefined>;
   /** 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 focused: import("@angular/core").OutputEmitterRef<void>;
   readonly blurred: import("@angular/core").OutputEmitterRef<void>;
   /** Emits whenever the field becomes invalid / valid. */
   readonly invalidChange: import("@angular/core").OutputEmitterRef<boolean>;
-  protected readonly _disabledInput: import("@angular/core").InputSignal<boolean>;
+  /**
+   * The `[disabled]` input. Public on purpose: a `protected` input makes `[disabled]="x"` in a host template fail strict template
+   * type-checking (TS2445: Angular checks the field the alias points at). The field is disabled when this OR the form control
+   * (`setDisabledState`, e.g. `FormControl.disable()`) says so.
+   */
+  readonly _disabledInput: import("@angular/core").InputSignal<boolean>;
   private readonly _cvaDisabled;
   protected readonly disabled: import("@angular/core").Signal<boolean>;
   protected readonly _value: import("@angular/core").WritableSignal<string>;
   private readonly _reveal;
+  /** Left padding that makes room for the prefix (its width in `ch` plus the field's own 12px and a 6px gap); none without a prefix. */
+  protected readonly _prefixPadding: import("@angular/core").Signal<string | null>;
   /** True when the control value is a number: `valueType="number"` on a `type="number"` field. */
   private readonly _numeric;
   /** The native `step` attribute: only for `type="number"` and only for a finite number above 0; otherwise none (the browser's step of 1). */
@@ -3857,6 +3998,11 @@ export declare class TextInputComponent implements ControlValueAccessor, Validat
       "required": false;
       "isSignal": true;
     };
+    "prefix": {
+      "alias": "prefix";
+      "required": false;
+      "isSignal": true;
+    };
     "type": {
       "alias": "type";
       "required": false;
@@ -3927,6 +4073,11 @@ export declare class TextInputComponent implements ControlValueAccessor, Validat
       "required": false;
       "isSignal": true;
     };
+    "formatter": {
+      "alias": "formatter";
+      "required": false;
+      "isSignal": true;
+    };
     "showErrors": {
       "alias": "showErrors";
       "required": false;
@@ -4162,6 +4313,13 @@ export declare class FileInputComponent implements ControlValueAccessor, Validat
   readonly showField: import("@angular/core").InputSignal<boolean>;
   /** Reveal the built-in "required" message now (e.g. after a failed Save click). */
   readonly showErrors: import("@angular/core").InputSignal<boolean>;
+  /**
+   * Also report every refused file (wrong type, too big, too small, empty) with a `ToastService` error toast that names the file and
+   * the reason, e.g. `"scan.exe" was not added. Only PDF files are allowed.` Meant for the picker-only mode (`[showField]="false"`),
+   * where no field is visible to show the message; it works with a visible field too. Several refused files make ONE toast listing each.
+   * Default `false`: nothing is toasted (the field message and `(fileRejected)` are unchanged). Needs a `ui-toast` outlet like any toast.
+   */
+  readonly toastOnReject: import("@angular/core").InputSignal<boolean>;
   /** Show a Remove button next to the chosen file. */
   readonly clearable: import("@angular/core").InputSignal<boolean>;
   readonly removeLabel: import("@angular/core").InputSignal<string>;
@@ -4207,6 +4365,7 @@ export declare class FileInputComponent implements ControlValueAccessor, Validat
   private readonly fileEl;
   protected readonly _dragging: import("@angular/core").WritableSignal<boolean>;
   /** Message of the last refused file ('' when the last pick was fine); shown in every mode. */
+  private readonly _toast;
   private readonly _rejection;
   private readonly _reveal;
   private readonly _issue;
@@ -4304,6 +4463,11 @@ export declare class FileInputComponent implements ControlValueAccessor, Validat
       "required": false;
       "isSignal": true;
     };
+    "toastOnReject": {
+      "alias": "toastOnReject";
+      "required": false;
+      "isSignal": true;
+    };
     "clearable": {
       "alias": "clearable";
       "required": false;
@@ -4400,7 +4564,8 @@ export declare class DateInputComponent implements ControlValueAccessor, Validat
   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>;
-  protected readonly _disabledInput: import("@angular/core").InputSignal<boolean>;
+  /** The `[disabled]` input. Public so `[disabled]="x"` in a host template type-checks (a protected alias target fails with TS2445); disabled when this OR the form control says so. */
+  readonly _disabledInput: import("@angular/core").InputSignal<boolean>;
   private readonly _cvaDisabled;
   protected readonly disabled: import("@angular/core").Signal<boolean>;
   protected readonly _value: import("@angular/core").WritableSignal<string>;
@@ -5183,6 +5348,24 @@ export declare class FormRowComponent {
     };
   }, {}, never, ["*"], true, never>;
 }
+/**
+ * Lets a direct child of `ui-form-row` span several columns: `<ui-text-input uiColSpan="2" .../>` (2 or 3 columns) or
+ * `uiColSpan="all"` (every column). It only adds the class `ui-span-2` / `ui-span-3` / `ui-span-all`, which `ui-form-row` styles, so a
+ * plain `class="ui-span-2"` on the child works too without importing this directive. On a phone (<= 480px) the row is one column and the
+ * child simply takes the full width. Keep a numeric span within the row's `cols` (use `all` for the whole row).
+ */
+export declare class FormColSpanDirective {
+  readonly uiColSpan: import("@angular/core").InputSignal<"" | "2" | "3" | 2 | 3 | "all">;
+  protected readonly _class: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<FormColSpanDirective, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<FormColSpanDirective, "[uiColSpan]", never, {
+    "uiColSpan": {
+      "alias": "uiColSpan";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
 /**
  * Fixed-layout list item with an optional leading radio/checkbox, a title + badge,
  * and a secondary detail row rendered from a string array. All layout is handled
@@ -5733,6 +5916,16 @@ export interface PanelInfoItem {
   }>;
   /** Router link for the value. */
   link?: string;
+  /**
+   * A real `<a href>` for the value (the visible `value` is the link text). Only `mailto:`, `tel:`, `http:` and `https:` are
+   * allowed; any other scheme (`javascript:`, `data:` ...) renders the value as plain text. `http(s)` links open in a new tab with
+   * `rel="noopener noreferrer"`. Wins over `email` / `phone` / `link`.
+   */
+  href?: string;
+  /** Shortcut: the value becomes a `mailto:` link to this address (the value defaults to the address). */
+  email?: string;
+  /** Shortcut: the value becomes a `tel:` link to this number (digits and a leading + are kept; the value defaults to the number as written). */
+  phone?: string;
   /** Show the value with an "open" icon instead of blue link styling. */
   linkIcon?: boolean;
   /** Renders a small edit (pencil) icon button after the value. */
@@ -5766,6 +5959,14 @@ export declare class PanelInfoListComponent {
   readonly sections: import("@angular/core").InputSignal<PanelInfoSection[]>;
   readonly showEmptyState: import("@angular/core").InputSignal<boolean>;
   readonly displaySections: import("@angular/core").Signal<PanelInfoSection[]>;
+  /**
+   * The safe href of an item, or null: `href` first, else `mailto:`/`tel:` built from `email`/`phone`. Only mailto, tel, http and https
+   * are allowed (the scheme is checked after removing control characters and spaces, like browsers do).
+   */
+  hrefOf(item: PanelInfoItem): string | null;
+  isWeb(href: string): boolean;
+  /** Link text: the value, else the email / phone as written. */
+  textOf(item: PanelInfoItem): string;
   visibleItems(section: PanelInfoSection): PanelInfoItem[];
   static ɵfac: i0.ɵɵFactoryDeclaration<PanelInfoListComponent, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<PanelInfoListComponent, "ui-panel-info-list", never, {
@@ -6098,9 +6299,9 @@ export declare class AppShellComponent implements OnInit, OnDestroy {
     "logoutClick": "logoutClick";
   }, never, ["[shell-brand]", "[shell-header-end]", "[shell-banners]", "*"], true, never>;
 }
-export type AlertVariant = 'info' | 'success' | 'warning' | 'danger';
+export type AlertVariant = 'info' | 'success' | 'warning' | 'danger' | 'neutral';
 /**
- * Inline status message (info / success / warning / danger) with an optional title,
+ * Inline status message (info / success / warning / danger / neutral gray) with an optional title,
  * optional dismiss button, and projected body content (text, links, a retry ui-button…).
  * `quiet` drops the live-region role (no announcement) and `compact` tightens it for list rows — both off by default.
  *
@@ -6155,19 +6356,10 @@ export declare class AlertComponent {
     "dismissed": "dismissed";
   }, never, ["*"], true, never>;
 }
-/**
- * Small muted helper text shown under a form or panel section.
- *
- *   <ui-hint>This does not affect the scheduled send date.</ui-hint>
- */
-export declare class HintComponent {
-  static ɵfac: i0.ɵɵFactoryDeclaration<HintComponent, never>;
-  static ɵcmp: i0.ɵɵComponentDeclaration<HintComponent, "ui-hint", never, {}, {}, never, ["*"], true, never>;
-}
 /** The SVG path (24×24 stroke icon) for an icon key, or undefined when the key is unknown. */
 export declare function iconPath(name: string): string | undefined;
 /** Keys with an icon of their own (the data-table action keys are accepted too — see `builtInActionIcon`). */
-export type IconName = 'add' | 'close' | 'check' | 'upload' | 'image' | 'chevron-up' | 'chevron-down' | 'arrow-left' | 'bell' | 'print' | 'view' | 'edit' | 'delete' | 'download' | 'duplicate' | 'archive' | 'restore' | 'share' | 'email' | 'message' | 'call';
+export type IconName = 'add' | 'close' | 'check' | 'upload' | 'image' | 'chevron-up' | 'chevron-down' | 'arrow-left' | 'bell' | 'print' | 'lock' | 'arrow-up' | 'arrow-down' | 'arrow-right' | 'document' | 'grip' | 'card' | 'bank' | 'view' | 'edit' | 'delete' | 'download' | 'duplicate' | 'archive' | 'restore' | 'share' | 'email' | 'message' | 'call';
 /**
  * A clickable icon. The host passes a key (`name="delete"`) and the library draws that icon; clicking it emits
  * `iconClick`, and the host does the actual work (delete the row, open a panel, …).
@@ -6251,6 +6443,71 @@ export declare class IconComponent {
     "iconClick": "iconClick";
   }, never, never, true, never>;
 }
+export type TimelineTone = 'default' | 'success' | 'warning' | 'danger';
+export interface TimelineItem {
+  /** Stable id used for `track`; the index is used when absent. */
+  id?: string;
+  title: string;
+  description?: string;
+  /** Pre-formatted time text shown to the reader, e.g. "Oct 20, 2026, 3:15 PM". */
+  time?: string;
+  /** ISO date / date-time for the `datetime` attribute of the `<time>` element (machine-readable). */
+  dateTime?: string;
+  badge?: {
+    label: string;
+    variant: BadgeVariant;
+  };
+  /** Icon drawn inside the dot (static, decorative). Unknown names draw nothing. */
+  icon?: IconName | (string & {});
+  /** Colour of the dot / icon. Default `default`. */
+  tone?: TimelineTone;
+}
+/**
+ * Vertical activity feed: an ordered list of events joined by a line, each with a dot (or icon), title, optional badge,
+ * description and time.
+ *
+ *   <ui-timeline ariaLabel="Case activity" emptyMessage="No activity yet." [items]="[
+ *     { id: 'a', title: 'Case opened', time: 'Oct 20, 3:15 PM', dateTime: '2026-10-20T15:15:00Z', badge: { label: 'Open', variant: 'green' } },
+ *     { id: 'b', title: 'Letter sent', description: 'Mailed to the owner.', tone: 'success', icon: 'email' },
+ *   ]" />
+ *
+ * Semantics: `<ol>` / `<li>`; the line and dots are decorative (aria-hidden). `time` is the visible text; `dateTime` goes into
+ * `<time datetime>`. With no items, `emptyMessage` (if set) is shown as a hint, otherwise nothing is rendered.
+ */
+export declare class TimelineComponent {
+  readonly items: import("@angular/core").InputSignal<TimelineItem[]>;
+  /** Accessible name of the list (e.g. "Case activity"). */
+  readonly ariaLabel: import("@angular/core").InputSignal<string>;
+  /** Shown (as a hint) when there are no items. Empty = render nothing. */
+  readonly emptyMessage: import("@angular/core").InputSignal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<TimelineComponent, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<TimelineComponent, "ui-timeline", never, {
+    "items": {
+      "alias": "items";
+      "required": false;
+      "isSignal": true;
+    };
+    "ariaLabel": {
+      "alias": "ariaLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "emptyMessage": {
+      "alias": "emptyMessage";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
+/**
+ * Small muted helper text shown under a form or panel section.
+ *
+ *   <ui-hint>This does not affect the scheduled send date.</ui-hint>
+ */
+export declare class HintComponent {
+  static ɵfac: i0.ɵɵFactoryDeclaration<HintComponent, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HintComponent, "ui-hint", never, {}, {}, never, ["*"], true, never>;
+}
 export type ImagePreviewShape = 'circle' | 'rounded';
 export type ImagePreviewSize = 'sm' | 'md' | 'lg';
 export type ImagePreviewPlaceholder = 'person' | 'image';
@@ -6741,6 +6998,8 @@ export declare class RadioComponent {
   readonly invalid: import("@angular/core").InputSignal<boolean>;
   /** Id(s) of the element(s) describing the group (hint / error). */
   readonly describedBy: import("@angular/core").InputSignal<string>;
+  /** Id of an element this radio reveals while selected (`aria-controls`); no attribute when empty. */
+  readonly controls: import("@angular/core").InputSignal<string>;
   /** Public so a host template can bind `[disabled]` (a protected input fails strict template type-checking). */
   readonly _disabledInput: import("@angular/core").InputSignal<boolean>;
   protected readonly disabled: import("@angular/core").InputSignal<boolean>;
@@ -6795,6 +7054,11 @@ export declare class RadioComponent {
       "required": false;
       "isSignal": true;
     };
+    "controls": {
+      "alias": "controls";
+      "required": false;
+      "isSignal": true;
+    };
     "_disabledInput": {
       "alias": "disabled";
       "required": false;
@@ -6804,6 +7068,32 @@ export declare class RadioComponent {
     "selected": "selected";
   }, never, ["*"], true, never>;
 }
+/**
+ * Content shown directly under ONE option of a `ui-radio-group`, only while that option is selected (e.g. an address form under
+ * "Ship to an alternate address"). Put an `<ng-template>` inside the group and name the option's value:
+ *
+ *   <ui-radio-group label="Delivery" [options]="opts" [(ngModel)]="method">
+ *     <ng-template uiRadioOptionContent="SHIP">
+ *       <ui-text-input label="Street" ... />
+ *     </ng-template>
+ *   </ui-radio-group>
+ *
+ * Groups without such a template render exactly as before. The content is indented under the option's label; in a horizontal group it
+ * takes a full row below the options. It lives inside the group's fieldset, so moving focus into it does not count as leaving the group.
+ */
+export declare class RadioOptionContentDirective {
+  /** The `value` of the option this content belongs to. */
+  readonly value: import("@angular/core").InputSignal<string>;
+  readonly template: TemplateRef<unknown>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<RadioOptionContentDirective, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<RadioOptionContentDirective, "ng-template[uiRadioOptionContent]", never, {
+    "value": {
+      "alias": "uiRadioOptionContent";
+      "required": true;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
 /** One row of a `ui-radio-matrix`: `value` is the key in the model, `label` the row header. */
 export interface RadioMatrixRow {
   value: string;
@@ -6931,6 +7221,283 @@ export declare class RadioMatrixComponent implements ControlValueAccessor, Valid
     "invalidChange": "invalidChange";
   }, never, never, true, never>;
 }
+/**
+ * A pad to draw a signature (or initials) on: a ControlValueAccessor whose value is a PNG data URL (`null` = empty).
+ *
+ *   <ui-signature-pad label="Your signature" [(ngModel)]="signature" />
+ *   <ui-signature-pad ariaLabel="Initials" [outputWidth]="200" [outputHeight]="60" (signatureChange)="onSigned($event)" />
+ *
+ * Drawing works with a mouse, a finger or a pen (pointer events; the pad blocks touch scrolling while you draw) and with the keyboard:
+ * focus the pad, move the cursor with the arrow keys (Shift = bigger steps), hold Space to draw, Escape hides the cursor (it does not
+ * leave the dialog the pad may sit in until the cursor is hidden). When a stroke ends the drawing is cropped to its content (4px margin),
+ * scaled to fit `outputWidth` x `outputHeight` (left-aligned, vertically centered) and emitted, so every signature has the same visual
+ * weight. Clear empties the pad. `disabled` (input or form control) blocks drawing.
+ *
+ * The pad is shown at the container's width and keeps the bitmap's aspect ratio (`width` : `height`), so ink is never stretched and the saved PNG
+ * looks like what was drawn. Changing `width` / `height` after drawing repaints the current signature (scaled to fit) instead of losing it.
+ * Screen readers get the keyboard instructions as a description of the pad and a polite "Signature captured" / "Signature cleared" announcement.
+ *
+ * Public methods: `clear()`, `isEmpty()` and `toDataUrl()` (the current normalized signature, or `null` when empty).
+ */
+export declare class SignaturePadComponent implements ControlValueAccessor {
+  readonly label: import("@angular/core").InputSignal<string>;
+  /** Accessible name when there is no visible label. A default describing the keyboard controls is used when neither is set. */
+  readonly ariaLabel: import("@angular/core").InputSignal<string>;
+  readonly hint: import("@angular/core").InputSignal<string>;
+  readonly error: import("@angular/core").InputSignal<string>;
+  /** Bitmap size of the drawing surface in pixels. The pad is displayed at the container's width with this same aspect ratio, so strokes keep their proportions. */
+  readonly width: import("@angular/core").InputSignal<number>;
+  readonly height: import("@angular/core").InputSignal<number>;
+  /** Size of the emitted PNG: the drawing is cropped to its content and scaled to fit this box. */
+  readonly outputWidth: import("@angular/core").InputSignal<number>;
+  readonly outputHeight: import("@angular/core").InputSignal<number>;
+  readonly penColor: import("@angular/core").InputSignal<string>;
+  readonly penWidth: import("@angular/core").InputSignal<number>;
+  /** Show the built-in Clear button under the pad. */
+  readonly showClear: import("@angular/core").InputSignal<boolean>;
+  readonly clearLabel: import("@angular/core").InputSignal<string>;
+  readonly _disabledInput: import("@angular/core").InputSignal<boolean>;
+  /** Emits the normalized PNG data URL when a stroke ends, and `null` when the pad is cleared. */
+  readonly signatureChange: import("@angular/core").OutputEmitterRef<string | null>;
+  private readonly _canvas;
+  private readonly _cvaDisabled;
+  protected readonly disabled: import("@angular/core").Signal<boolean>;
+  protected readonly _empty: import("@angular/core").WritableSignal<boolean>;
+  protected readonly _cursorVisible: import("@angular/core").WritableSignal<boolean>;
+  protected readonly _cursorX: import("@angular/core").WritableSignal<number>;
+  protected readonly _cursorY: import("@angular/core").WritableSignal<number>;
+  protected readonly _keyboardDrawing: import("@angular/core").WritableSignal<boolean>;
+  protected readonly _announcement: import("@angular/core").WritableSignal<string>;
+  protected readonly _keyboardHelp = "Use the arrow keys to move the cursor, hold Space to draw, press Escape to hide the cursor.";
+  private readonly _injector;
+  private readonly _id;
+  protected readonly _labelId: string;
+  protected readonly _descId: string;
+  protected readonly _helpId: string;
+  /** The `ariaLabel`; with neither it nor a visible `label`, a default name (the canvas always has one). The keyboard instructions are a separate description. */
+  protected readonly _accessibleName: import("@angular/core").Signal<string | null>;
+  /** The error / hint (when shown) plus the always-present keyboard instructions, so they are announced whatever names the canvas. */
+  protected readonly _describedBy: import("@angular/core").Signal<string>;
+  private _ctx;
+  private _pointerId;
+  private _dirty;
+  /** A value was written before the canvas existed: the setup effect paints it. */
+  private _pendingImage;
+  private _value;
+  /** A written / repainted image is still decoding: the bitmap does not hold the signature yet, `_value` does. */
+  private _loading;
+  /** `width`x`height` the bitmap was last set up for; a change wipes the canvas, so the signature is repainted from `_value`. */
+  private _sizeKey;
+  private _onChange;
+  private _onTouched;
+  constructor();
+  isEmpty(): boolean;
+  /** The current signature as a normalized PNG data URL, or `null` when nothing is drawn. */
+  toDataUrl(): string | null;
+  /** Empties the pad and tells the form (value `null`). */
+  clear(): void;
+  writeValue(value: string | null): void;
+  /** Draws a written value scaled to fit, left-aligned and vertically centered (ignored when the value was replaced while it loaded). */
+  private _paint;
+  /**
+   * Assigning the canvas `width` / `height` wipes the bitmap while `_value` and `_empty` still describe a signature: once the new size is
+   * rendered, paint the current signature (the last committed / written PNG, scaled to fit) again so state and bitmap agree.
+   */
+  private _repaintAfterResize;
+  registerOnChange(fn: (value: string | null) => void): void;
+  registerOnTouched(fn: () => void): void;
+  setDisabledState(disabled: boolean): void;
+  protected onPointerDown(event: PointerEvent): void;
+  protected onPointerMove(event: PointerEvent): void;
+  protected onPointerEnd(event: PointerEvent): void;
+  protected onKeyDown(event: KeyboardEvent): void;
+  protected onKeyUp(event: KeyboardEvent): void;
+  protected onBlur(): void;
+  private _stopKeyboardStroke;
+  /** A stroke ended: normalize the drawing, publish it to the form and the output. */
+  private _commit;
+  private _setUpContext;
+  /** The drawing context, created on first use (a form can write its value before the setup effect has run). */
+  private _contextOf;
+  /**
+   * Pen settings go on the context at the start of every stroke as well as in the setup effect: assigning the canvas `width` / `height`
+   * (the `[width]` / `[height]` bindings, which run after the effect on the first render and on every size change) resets the context state.
+   */
+  private _applyPen;
+  private _clearBitmap;
+  /** Display coordinates -> bitmap coordinates (the pad is scaled by CSS). */
+  private _pointOf;
+  /** Crop the drawing to its content (4px margin) and scale it into `outputWidth` x `outputHeight`, left-aligned and vertically centered. */
+  private _normalize;
+  static ɵfac: i0.ɵɵFactoryDeclaration<SignaturePadComponent, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<SignaturePadComponent, "ui-signature-pad", never, {
+    "label": {
+      "alias": "label";
+      "required": false;
+      "isSignal": true;
+    };
+    "ariaLabel": {
+      "alias": "ariaLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "hint": {
+      "alias": "hint";
+      "required": false;
+      "isSignal": true;
+    };
+    "error": {
+      "alias": "error";
+      "required": false;
+      "isSignal": true;
+    };
+    "width": {
+      "alias": "width";
+      "required": false;
+      "isSignal": true;
+    };
+    "height": {
+      "alias": "height";
+      "required": false;
+      "isSignal": true;
+    };
+    "outputWidth": {
+      "alias": "outputWidth";
+      "required": false;
+      "isSignal": true;
+    };
+    "outputHeight": {
+      "alias": "outputHeight";
+      "required": false;
+      "isSignal": true;
+    };
+    "penColor": {
+      "alias": "penColor";
+      "required": false;
+      "isSignal": true;
+    };
+    "penWidth": {
+      "alias": "penWidth";
+      "required": false;
+      "isSignal": true;
+    };
+    "showClear": {
+      "alias": "showClear";
+      "required": false;
+      "isSignal": true;
+    };
+    "clearLabel": {
+      "alias": "clearLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "_disabledInput": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "signatureChange": "signatureChange";
+  }, never, never, true, never>;
+}
+/**
+ * A "sign here" spot placed over a rendered PDF page, at the coordinates the document gives (pixels from the page's top-left corner).
+ * Put it inside a `position: relative` element that holds the page, one per field:
+ *
+ *   <div style="position: relative; width: 612px; height: 792px">
+ *     <canvas ...></canvas>
+ *     <ui-pdf-hotspot [x]="f.x" [y]="f.y" [width]="f.width" [height]="f.height"
+ *                     [state]="ready ? 'ready' : 'blocked'" label="Sign Here" blockedLabel="Add signature above"
+ *                     ariaLabel="Click to sign here" [image]="f.signatureImage" (activate)="apply(f)" />
+ *   </div>
+ *
+ * `state="ready"` is a clickable button (`label`), `"blocked"` the same button disabled (`blockedLabel`, e.g. "create your signature first"),
+ * and `"signed"` shows the applied `image` (a signature data URL) contained inside the box instead (signed without an image is a disabled button showing `label`). The box size comes from the document
+ * so the text is scaled to it (height x 0.25, clamped to 7-11px); on touch devices the tap area is extended to at least 44px tall.
+ */
+export declare class PdfHotspotComponent {
+  /** Position and size in pixels, from the page's top-left corner. */
+  readonly x: import("@angular/core").InputSignal<number>;
+  readonly y: import("@angular/core").InputSignal<number>;
+  readonly width: import("@angular/core").InputSignal<number>;
+  readonly height: import("@angular/core").InputSignal<number>;
+  /** `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<"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"). */
+  readonly blockedLabel: import("@angular/core").InputSignal<string>;
+  /** Accessible name of the button (its text is used when empty). */
+  readonly ariaLabel: import("@angular/core").InputSignal<string>;
+  /** The applied signature (data URL), shown when `state` is `signed`. */
+  readonly image: import("@angular/core").InputSignal<string | null>;
+  readonly imageAlt: import("@angular/core").InputSignal<string>;
+  /** The ready button was clicked. */
+  readonly activate: import("@angular/core").OutputEmitterRef<void>;
+  protected readonly fontSize: import("@angular/core").Signal<number>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<PdfHotspotComponent, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<PdfHotspotComponent, "ui-pdf-hotspot", never, {
+    "x": {
+      "alias": "x";
+      "required": false;
+      "isSignal": true;
+    };
+    "y": {
+      "alias": "y";
+      "required": false;
+      "isSignal": true;
+    };
+    "width": {
+      "alias": "width";
+      "required": false;
+      "isSignal": true;
+    };
+    "height": {
+      "alias": "height";
+      "required": false;
+      "isSignal": true;
+    };
+    "state": {
+      "alias": "state";
+      "required": false;
+      "isSignal": true;
+    };
+    "tone": {
+      "alias": "tone";
+      "required": false;
+      "isSignal": true;
+    };
+    "label": {
+      "alias": "label";
+      "required": false;
+      "isSignal": true;
+    };
+    "blockedLabel": {
+      "alias": "blockedLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "ariaLabel": {
+      "alias": "ariaLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "image": {
+      "alias": "image";
+      "required": false;
+      "isSignal": true;
+    };
+    "imageAlt": {
+      "alias": "imageAlt";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "activate": "activate";
+  }, never, never, true, never>;
+}
 /**
  * Card for detail pages: an optional header and a body, both filled by the page that uses it.
  *
@@ -6948,7 +7515,7 @@ export declare class RadioMatrixComponent implements ControlValueAccessor, Valid
  *  - `collapsible` (default true): a chevron toggle and a clickable header; `[(expanded)]` is two-way.
  *    Without a header, or with `collapsible` false, the body is always open.
  *
- * The title is always shown in capitals; the subtitle keeps the case you give it. The body is the default content slot. A collapsed body is removed from the tab order and from assistive tech.
+ * The title is shown in capitals unless `[uppercaseTitle]="false"` (then it shows as written, e.g. "Case IDs"); the casing is CSS only, so the accessible name and heading text are always the text you gave; the subtitle keeps the case you give it. The body is the default content slot. A collapsed body is removed from the tab order and from assistive tech.
  *
  *   <ui-detail-card title="COMMUNICATIONS" subtitle="All calls, texts, and emails"> ...body... </ui-detail-card>
  *   <ui-detail-card title="CONTACT INFO" [showEdit]="true" (editClick)="openEdit()"> ... </ui-detail-card>
@@ -6963,6 +7530,8 @@ export declare class RadioMatrixComponent implements ControlValueAccessor, Valid
 export declare class DetailCardComponent {
   /** Bold uppercase title. Empty = no title text. */
   readonly title: import("@angular/core").InputSignal<string>;
+  /** 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>;
   /** Optional id for the title text; the card is then labelled by it. Without it the title is the card's aria-label. */
@@ -6999,6 +7568,11 @@ export declare class DetailCardComponent {
       "required": false;
       "isSignal": true;
     };
+    "uppercaseTitle": {
+      "alias": "uppercaseTitle";
+      "required": false;
+      "isSignal": true;
+    };
     "headingLevel": {
       "alias": "headingLevel";
       "required": false;