@forgeroute/ui 0.3.0 → 0.3.1

package/types/forgeroute-ui.d.ts

@@ -45,7 +45,8 @@ export interface ToolbarAction {
   badge?: number;
   /** Hide this action entirely */
   hidden?: boolean;
-  /** Only shown when the table's `permission` is 'full' (e.g. "Add …", bulk mutations). */
+  /** Documentation of intent: marks a mutating action ("Add …", bulk mutations). It does not change behavior - the table hides
+   *  EVERY page-defined toolbar action for any `permission` other than 'full', with or without this flag. */
   requiresFull?: boolean;
   /**
    * Keep this action when the table is empty and unfiltered. By default only `variant: 'primary'` buttons survive that
@@ -87,9 +88,13 @@ export interface RowAction {
   opens?: 'modal' | 'panel';
   /** Required when opens === 'modal'. Drives the confirm dialog shown by the table. */
   modal?: ConfirmConfig;
-  /** Only shown when the table's `permission` is 'full' (edit, delete, any mutation).
-   *  The built-in `type: 'delete'` action is always treated as requiring full permission. */
+  /** Documentation of intent: marks a mutating action (edit, delete, ...). It does not change behavior - for any `permission`
+   *  other than 'full' the table offers only View and actions marked `allowReadOnly`, with or without this flag.
+   *  The built-in `type: 'delete'` action is never offered to read-only users. */
   requiresFull?: boolean;
+  /** Keep this action for read-only users too (download, preview: reads that change nothing). Without it a read-only table offers only
+   *  View. Never applies to the built-in delete, and the table still drops the Actions column when no row has any visible action. */
+  allowReadOnly?: boolean;
 }
 /** Page-level permission passed to `<ui-data-table [permission]>`. Anything other than 'full' is read-only
  *  (apps use values like 'read-only' / 'hidden'). */
@@ -105,6 +110,9 @@ export interface ColumnDef {
   /** Values a bulk "Change <label>" may set. When omitted the options come from /filter-counts.
    *  Use it when only some values are user-settable or when a valid value may currently have no rows. */
   bulkOptions?: string[];
+  /** Fixed column width (any CSS length, e.g. '140px'). Applied as width, min-width and max-width; cell text longer than
+   *  it is cut with an ellipsis. Omit for an automatic width. Not applied to the Actions column's cell clipping. */
+  width?: string;
   align?: 'left' | 'right' | 'center';
   headerAlign?: 'left' | 'right' | 'center';
   /** How to render cell content. Defaults to 'text'. */
@@ -133,14 +141,24 @@ export interface ColumnDef {
     value: number;
     max: number;
     label?: string;
-    variant?: 'blue' | 'green' | 'amber' | 'red' | 'slate';
+    variant?: 'blue' | 'green' | 'amber' | 'red' | 'slate' | 'lime';
     tooltip?: string;
+    autoColor?: boolean;
+    thresholds?: {
+      at: number;
+      variant: 'blue' | 'green' | 'amber' | 'red' | 'slate' | 'lime';
+    }[];
   } | null;
   /** Key in item holding the tags array. Defaults to col.key.
    *  Expected shape: { name: string; variant?: BadgeVariant }[] */
   tagsKey?: string;
   /** Returns the image URL for the row. A falsy value (null / undefined / '') shows the placeholder icon. */
   imageFn?: (item: any) => string | null | undefined;
+  /** Focal point (percent, 50/50 = centered) of the cropped image, applied as CSS object-position. */
+  imagePositionFn?: (item: any) => {
+    x: number | null | undefined;
+    y: number | null | undefined;
+  } | null | undefined;
   /** Alt text for the row's image. When omitted the image is decorative (`alt=""`). */
   imageAlt?: (item: any) => string;
   /** 'circle' (default) or 'rounded' (3:2 rounded rectangle). */
@@ -231,6 +249,17 @@ export type BulkUpdateOption<T = any> = string | {
    *   { field: 'delete', deletable: (row: Invoice) => row.status === 'DRAFT' }
    */
   deletable?: (row: T) => boolean;
+  /**
+   * Field changes (`{ field, canChange }`): true when the server will accept moving THIS row to `target` (a value the select offers).
+   * For rules the field values alone can't express, e.g. a draft can only be sent when it has a document and a recipient. Keep it
+   * identical to the backend rule. Rows it refuses are skipped like rows `allowedFrom` refuses ("N selected rows can't be changed to X
+   * and will be skipped." / `ctx.skippedBlocked` + `ctx.skippedRows` for host `confirm` copy), are never sent, and a target is offered
+   * only while some selected row can move to it. It runs after `allowedFrom` and only sees rows on the loaded page. Omit it and
+   * nothing changes.
+   *
+   *   { field: 'status', allowedFrom: { SENT: ['DRAFT'] }, canChange: (row, target) => target !== 'SENT' || canSend(row) }
+   */
+  canChange?: (row: T, target: string) => boolean;
 };
 /** What a bulk confirm function receives. For bulk Delete: `targetValue`/`targetLabel` are '', `columnLabel` is 'Delete', skipped counts are 0. */
 export interface BulkConfirmContext<T = any> {
@@ -285,6 +314,8 @@ export interface BulkActionDef {
   confirm?: BulkConfirmFn | Record<string, BulkConfirmFn>;
   /** Bulk Delete only: which rows the server will delete (from `{ field: 'delete', deletable }`). */
   deletable?: (row: any) => boolean;
+  /** Field changes: per-row check that the server will accept the move to a target (from `{ field, canChange }`). */
+  canChange?: (row: any, target: string) => boolean;
   /**
    * The item field this action targets (e.g. 'status', 'type').
    * When set the table shows an inline select populated from the column's option sources.
@@ -767,7 +798,7 @@ export declare function createFieldReveal(showErrors: Signal<boolean>): {
   revealed: Signal<boolean>;
 };
 /** Splits `YYYY-MM-DD` (optionally followed by `Thh:mm[:ss]`) and rejects impossible dates (2026-02-31) and times (25:00). */
-export declare function parseIso(value: string, withTime: boolean): {
+export declare function parseIso(value: string | null | undefined, withTime: boolean): {
   y: number;
   mo: number;
   d: number;
@@ -775,9 +806,9 @@ export declare function parseIso(value: string, withTime: boolean): {
   mi: number;
 } | null;
 /** "Oct 20, 2026" from an ISO date (never shifted by the time zone). */
-export declare function formatIsoDate(value: string): string;
+export declare function formatIsoDate(value: string | null | undefined): string;
 /** "Oct 20, 2026, 3:30 PM" from an ISO local date-time. */
-export declare function formatIsoDateTime(value: string): string;
+export declare function formatIsoDateTime(value: string | null | undefined): string;
 /** Sortable key `YYYYMMDDHHmm` of a parsed ISO value. */
 export declare function isoKey(p: {
   y: number;
@@ -786,6 +817,10 @@ export declare function isoKey(p: {
   h: number;
   mi: number;
 }): number;
+/** Parses `HH:mm` (optionally `HH:mm:ss`) into minutes since midnight; null for anything else (25:00, 9:5, 09:30:99, text, null/undefined). */
+export declare function parseTime(value: string | null | undefined): number | null;
+/** "9:00 AM" / "12:30 PM" from an `HH:mm` value (returned unchanged when it cannot be parsed; '' for null/undefined/non-strings). */
+export declare function formatTime(value: string | null | undefined): string;
 export interface SelectOption {
   value: string;
   label: string;
@@ -1135,6 +1170,8 @@ export declare class DataTableComponent<T extends Record<string, any>> implement
   private _columnBadgeLabel;
   protected readonly _error: import("@angular/core").WritableSignal<string | null>;
   protected readonly _search: import("@angular/core").WritableSignal<string>;
+  /** The search text as sent to the API: lower-cased, so every search is case-insensitive whatever the backend does. The input still shows what the user typed. */
+  protected readonly _searchParam: Signal<string>;
   protected readonly _page: import("@angular/core").WritableSignal<number>;
   protected readonly _sortField: import("@angular/core").WritableSignal<string | null>;
   protected readonly _sortDir: import("@angular/core").WritableSignal<SortDir>;
@@ -1147,6 +1184,8 @@ export declare class DataTableComponent<T extends Record<string, any>> implement
   protected readonly _effectiveSavedViews: Signal<SavedView[]>;
   /** Empty = show all defaultVisible; non-empty = show exactly these keys */
   protected readonly _visibleColumns: import("@angular/core").WritableSignal<string[]>;
+  /** Drops the key of every `cellType: 'actions'` column — Actions is never part of a configured/saved column list. */
+  protected _configurableKeys(keys: string[] | null | undefined): string[];
   protected readonly _ieRef: Signal<ImportExportComponent | undefined>;
   /** Tag overflow tooltip — fixed position to escape table's overflow:auto */
   protected readonly _tagTooltip: import("@angular/core").WritableSignal<{
@@ -1233,12 +1272,19 @@ export declare class DataTableComponent<T extends Record<string, any>> implement
    * through the column's own `nameFn` / `render` so it reads exactly like the cell. '' when there is none.
    */
   protected rowName(item: T): string;
-  /** "Select Acme Electric" — a row's selection checkbox name. */
+  /**
+   * Rows of the loaded page whose name repeats get a position suffix (" (1 of 2)", " (2 of 2)"), so a screen-reader user never hears two rows
+   * announced identically ("Select Jane Cooper" twice). Names that are unique on the page — and rows with no name — are left exactly as they are.
+   */
+  private readonly _rowNameSuffix;
+  /** A row's accessible name: its name, plus the position among rows of the same name when that name repeats on the page. */
+  private rowAccessibleName;
+  /** "Select Acme Electric" — a row's selection checkbox name ("Select Acme Electric (2 of 3)" when the name repeats on the page). */
   protected selectRowLabel(item: T): string;
   /**
    * "Row actions for Acme Electric" — a row's actions-menu trigger name. It still contains the generic "Row actions"
    * text, so lookups by that accessible name (substring) keep finding the button, while a screen-reader user now
-   * hears which row it belongs to.
+   * hears which row it belongs to ("Row actions for Acme Electric (2 of 3)" when the name repeats on the page).
    */
   protected rowActionsLabel(item: T): string;
   protected toggleSelectAll(): void;
@@ -1355,7 +1401,8 @@ export declare class DataTableComponent<T extends Record<string, any>> implement
   protected onRowKeydown(e: KeyboardEvent, item: T): void;
   protected onInternalButtonClick(type: string): void;
   protected onImported(): void;
-  /** Row actions visible for the current permission: everything for 'full', only View (`type: 'view'`) otherwise. */
+  /** 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. */
   protected _rowActions(col: ColumnDef, item: T): RowAction[];
   protected onTableRowAction(type: string, col: ColumnDef, item: T): Promise<void>;
   private isNumericCol;
@@ -1367,6 +1414,8 @@ export declare class DataTableComponent<T extends Record<string, any>> implement
   protected imageUrl(col: ColumnDef, item: T): string | null;
   /** Always a string so the <img> keeps an `alt` attribute ('' = decorative). */
   protected imageAlt(col: ColumnDef, item: T): string;
+  /** CSS object-position from `imagePositionFn` (percent); centered when there is none or it throws. */
+  protected imagePosition(col: ColumnDef, item: T): string;
   protected imageClass(col: ColumnDef, small: boolean): string;
   protected onImageError(url: string): void;
   protected phoneCell(value: any): string;
@@ -1525,6 +1574,27 @@ export declare class DataTableComponent<T extends Record<string, any>> implement
     "rowDeleted": "rowDeleted";
   }, never, never, true, never>;
 }
+/**
+ * Column-filter values travel as ONE comma-joined request parameter (`?section=Roofing,Siding`). A value that itself contains a comma
+ * ("Roofing, Inc.") would be read as two. These helpers keep the wire format backward compatible and make such values unambiguous:
+ *
+ *  - a value is sent AS IS unless joining it would be ambiguous: it contains a comma, a doubled backslash, or ends with a backslash;
+ *  - such a value is escaped: `\` becomes `\\` and `,` becomes `\,`;
+ *  - the reader splits on commas that are not escaped and unescapes `\,` and `\\`; any other backslash is an ordinary character.
+ *
+ * So every value that worked before (no comma, no doubled / trailing backslash) is byte-for-byte unchanged, and a backend that does not know the
+ * escaping keeps working for them. Backends that parse filter values should split with the same rules (`splitFilterList` in the contractor
+ * backend, `decodeFilterValues` here).
+ */
+/** One value as it is written into the comma-joined parameter. */
+export declare function encodeFilterValue(value: string): string;
+/** The comma-joined parameter for a list of filter values (`['Roofing, Inc.', 'Siding']` -> `Roofing\, Inc.,Siding`). */
+export declare function encodeFilterValues(values: readonly string[]): string;
+/**
+ * The values of a comma-joined parameter, the inverse of {@link encodeFilterValues}: split on unescaped commas, unescape `\,` and `\\`,
+ * trim each value and drop the empty ones (the same as the plain split it replaces).
+ */
+export declare function decodeFilterValues(raw: string): string[];
 export declare class SidePanelComponent implements OnDestroy {
   readonly open: import("@angular/core").InputSignal<boolean>;
   readonly title: import("@angular/core").InputSignal<string>;
@@ -1694,7 +1764,14 @@ export declare class ToastComponent {
   static ɵfac: i0.ɵɵFactoryDeclaration<ToastComponent, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<ToastComponent, "ui-toast", never, {}, {}, never, never, true, never>;
 }
-export type ProgressBarVariant = 'blue' | 'green' | 'amber' | 'red' | 'slate';
+export type ProgressBarVariant = 'blue' | 'green' | 'amber' | 'red' | 'slate' | 'lime';
+/** Switch the fill to `variant` once completion reaches `at` percent (0-100). */
+export interface ProgressThreshold {
+  at: number;
+  variant: ProgressBarVariant;
+}
+/** Standard completion colors: red under 25%, amber 25%, blue 50%, lime 75%, green at 100%. */
+export declare const PROGRESS_STEP_THRESHOLDS: ProgressThreshold[];
 /**
  * Horizontal progress bar with an optional trailing label (e.g. "3/5").
  * Pass `value` and `max`; the fill width is clamped to 0–100%.
@@ -1706,12 +1783,22 @@ export declare class ProgressBarComponent {
   readonly max: import("@angular/core").InputSignal<number>;
   /** Text shown to the right of the bar, e.g. "3/5". */
   readonly label: import("@angular/core").InputSignal<string>;
+  /** Fixed color; with `autoColor` it is the color below the first step (use `red`). */
   readonly variant: import("@angular/core").InputSignal<ProgressBarVariant>;
-  /** Native hover tooltip. */
+  /**
+   * Optional automatic color: the fill uses the variant of the highest threshold whose `at` is
+   * <= the exact completion percent (not the rounded one), else `variant`.
+   * e.g. `[{ at: 50, variant: 'amber' }, { at: 100, variant: 'green' }]`. Omit to keep `variant` fixed.
+   */
+  readonly thresholds: import("@angular/core").InputSignal<ProgressThreshold[] | null>;
+  /** Shortcut for the standard steps (`PROGRESS_STEP_THRESHOLDS`): red <25%, amber 25%, blue 50%, lime 75%, green 100%. Explicit `thresholds` win. */
+  readonly autoColor: import("@angular/core").InputSignal<boolean>;
+  /** Hover / focus tooltip (library `uiTooltip`); `\n` starts a new line. */
   readonly tooltip: import("@angular/core").InputSignal<string>;
   readonly ariaLabel: import("@angular/core").InputSignal<string>;
   protected readonly clampedValue: import("@angular/core").Signal<number>;
   protected readonly percent: import("@angular/core").Signal<number>;
+  protected readonly effectiveVariant: import("@angular/core").Signal<ProgressBarVariant>;
   static ɵfac: i0.ɵɵFactoryDeclaration<ProgressBarComponent, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<ProgressBarComponent, "ui-progress-bar", never, {
     "value": {
@@ -1734,6 +1821,16 @@ export declare class ProgressBarComponent {
       "required": false;
       "isSignal": true;
     };
+    "thresholds": {
+      "alias": "thresholds";
+      "required": false;
+      "isSignal": true;
+    };
+    "autoColor": {
+      "alias": "autoColor";
+      "required": false;
+      "isSignal": true;
+    };
     "tooltip": {
       "alias": "tooltip";
       "required": false;
@@ -1775,12 +1872,141 @@ export declare class SkeletonComponent {
     };
   }, {}, never, never, true, never>;
 }
-export declare class CheckboxComponent implements ControlValueAccessor {
+/**
+ * Hover / focus tooltip for any element: `<span uiTooltip="Saved">`.
+ * Empty text shows nothing. Line breaks (`\n`) are kept. Escape or leaving the element closes it.
+ * The bubble is rendered on `document.body` (position: fixed) so table/panel overflow never clips it.
+ */
+export declare class TooltipDirective {
+  /** Tooltip text; empty or null disables the tooltip. */
+  readonly uiTooltip: import("@angular/core").InputSignal<string | null | undefined>;
+  /** Preferred side; flips to the other side when there is no room. */
+  readonly tooltipPosition: import("@angular/core").InputSignal<"top" | "bottom">;
+  private readonly host;
+  private readonly doc;
+  private bubble;
+  private readonly id;
+  constructor();
+  protected show(): void;
+  protected hide(): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<TooltipDirective, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<TooltipDirective, "[uiTooltip]", never, {
+    "uiTooltip": {
+      "alias": "uiTooltip";
+      "required": false;
+      "isSignal": true;
+    };
+    "tooltipPosition": {
+      "alias": "tooltipPosition";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
+export type ImageRepositionShape = 'circle' | 'rounded';
+/**
+ * Drag-to-center photo frame. The image fills the frame (`object-fit: cover`) and the user drags it, or uses the arrow
+ * keys, to choose which part stays visible. The result is a focal point in percent (`x`, `y`, 0-100, 50/50 = centered)
+ * to apply as CSS `object-position` wherever the image is shown (`ui-image-preview` / the data table image cell take it).
+ *
+ *   <ui-image-reposition [src]="url" [(x)]="posX" [(y)]="posY" label="Photo position" />
+ *
+ * Only the axis that overflows the frame can move (a landscape photo moves sideways, a portrait one up and down).
+ * Arrow keys nudge by 2% (Shift: 10%). The frame is a labelled group with a hint for assistive tech.
+ */
+export declare class ImageRepositionComponent {
+  private static nextId;
+  protected readonly hintId: string;
+  private readonly host;
+  /** Image URL (or data URL). Without one the frame is empty and cannot be moved. */
+  readonly src: import("@angular/core").InputSignal<string | null | undefined>;
+  readonly alt: import("@angular/core").InputSignal<string>;
+  readonly shape: import("@angular/core").InputSignal<ImageRepositionShape>;
+  /** Accessible name of the frame. */
+  readonly label: import("@angular/core").InputSignal<string>;
+  /** Focal point, percent from the left (0-100). Two-way: `[(x)]`. */
+  readonly x: import("@angular/core").ModelSignal<number>;
+  /** Focal point, percent from the top (0-100). Two-way: `[(y)]`. */
+  readonly y: import("@angular/core").ModelSignal<number>;
+  protected readonly dragging: import("@angular/core").WritableSignal<boolean>;
+  private natural;
+  private start;
+  protected onLoad(e: Event): void;
+  /** How many px the cover-scaled image overflows the frame on each axis (0 = that axis cannot move). */
+  private overflow;
+  protected onPointerDown(e: PointerEvent): void;
+  protected onPointerMove(e: PointerEvent): void;
+  protected endDrag(e: PointerEvent): void;
+  protected onKeydown(e: KeyboardEvent): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<ImageRepositionComponent, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<ImageRepositionComponent, "ui-image-reposition", never, {
+    "src": {
+      "alias": "src";
+      "required": false;
+      "isSignal": true;
+    };
+    "alt": {
+      "alias": "alt";
+      "required": false;
+      "isSignal": true;
+    };
+    "shape": {
+      "alias": "shape";
+      "required": false;
+      "isSignal": true;
+    };
+    "label": {
+      "alias": "label";
+      "required": false;
+      "isSignal": true;
+    };
+    "x": {
+      "alias": "x";
+      "required": false;
+      "isSignal": true;
+    };
+    "y": {
+      "alias": "y";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "x": "xChange";
+    "y": "yChange";
+  }, never, never, true, never>;
+}
+export declare class CheckboxComponent implements ControlValueAccessor, Validator, UiFieldValidity {
   readonly label: import("@angular/core").InputSignal<string>;
   /** Accessible name for the native checkbox when there is no visible `label` (e.g. a table row's selector). */
   readonly ariaLabel: import("@angular/core").InputSignal<string>;
   readonly indeterminate: import("@angular/core").InputSignal<boolean>;
   readonly checked: import("@angular/core").ModelSignal<boolean>;
+  /** The box must be ticked. */
+  readonly required: import("@angular/core").InputSignal<boolean>;
+  /** Replaces the built-in "<label> is required." message. */
+  readonly requiredMessage: import("@angular/core").InputSignal<string>;
+  readonly hint: import("@angular/core").InputSignal<string>;
+  /** Host-provided error message (wins over the built-in one). */
+  readonly error: import("@angular/core").InputSignal<string>;
+  /** Reveal the built-in error message now (e.g. after a failed Save click), without waiting for a toggle. */
+  readonly showErrors: import("@angular/core").InputSignal<boolean>;
+  protected readonly _descId: string;
+  private readonly _reveal;
+  private readonly _issue;
+  /** True while a required box is unticked or the host passed an `[error]`. */
+  readonly invalid: import("@angular/core").Signal<boolean>;
+  /** Message of the broken built-in rule ('' when valid), shown or not. */
+  readonly errorMessage: import("@angular/core").Signal<string>;
+  /** Emits whenever the field becomes invalid / valid. */
+  readonly invalidChange: import("@angular/core").OutputEmitterRef<boolean>;
+  protected readonly _activeError: import("@angular/core").Signal<string>;
+  private _onValidatorChange;
+  constructor();
+  /** Re-run the form control's validation when a rule input (`required`, `requiredMessage`, `label`) changes. */
+  ngOnChanges(): void;
+  validate(control: AbstractControl): ValidationErrors | null;
+  registerOnValidatorChange(fn: () => void): void;
+  private _check;
   /** Public so a host template can bind `[disabled]` (a protected input fails strict template type-checking, TS2445). */
   readonly _disabledInput: import("@angular/core").InputSignal<boolean>;
   private readonly _cvaDisabled;
@@ -1814,6 +2040,31 @@ export declare class CheckboxComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "required": {
+      "alias": "required";
+      "required": false;
+      "isSignal": true;
+    };
+    "requiredMessage": {
+      "alias": "requiredMessage";
+      "required": false;
+      "isSignal": true;
+    };
+    "hint": {
+      "alias": "hint";
+      "required": false;
+      "isSignal": true;
+    };
+    "error": {
+      "alias": "error";
+      "required": false;
+      "isSignal": true;
+    };
+    "showErrors": {
+      "alias": "showErrors";
+      "required": false;
+      "isSignal": true;
+    };
     "_disabledInput": {
       "alias": "disabled";
       "required": false;
@@ -1821,6 +2072,7 @@ export declare class CheckboxComponent implements ControlValueAccessor {
     };
   }, {
     "checked": "checkedChange";
+    "invalidChange": "invalidChange";
   }, never, ["*"], true, never>;
 }
 export declare class ButtonComponent {
@@ -2919,6 +3171,15 @@ declare class SendEmailComponent implements OnInit {
   docsRemovedNote: string;
   onDocumentsChange(v: DocumentSendValue): void;
   onDocumentsInvalid(bad: boolean): void;
+  /** Server limits (400 "Subject must be 255 characters or fewer." / "Body must be 10000 characters or fewer."). */
+  readonly MAX_SUBJECT = 255;
+  readonly MAX_BODY = 10000;
+  /** Inline error when the message, as it will be sent, is over the server limit ('' when fine). */
+  get bodyLengthError(): string;
+  /** Inline error when the subject, as it will be sent, is over the server limit ('' when fine). */
+  get subjectLengthError(): string;
+  /** The length problem shown under the form in every mode; compose mode shows the message one on the editor instead. */
+  get sendLengthError(): string;
   get canSend(): boolean;
   get minScheduleTime(): string;
   /**
@@ -3826,6 +4087,8 @@ export declare class TextareaInputComponent implements ControlValueAccessor, Val
   private readonly _cvaDisabled;
   protected readonly disabled: import("@angular/core").Signal<boolean>;
   protected readonly _value: import("@angular/core").WritableSignal<string>;
+  /** The hint is shown inline after the label; with no label there is nothing to hang it on, so it renders under the field. */
+  protected readonly _unlabelledHint: import("@angular/core").Signal<boolean>;
   private readonly _reveal;
   private readonly _issue;
   /** True while the value breaks a built-in rule or the host passed an `[error]`. */
@@ -4182,18 +4445,37 @@ export declare class DatetimeInputComponent implements ControlValueAccessor, Val
     "invalidChange": "invalidChange";
   }, never, never, true, never>;
 }
-export declare class TimeInputComponent implements ControlValueAccessor {
+export declare class TimeInputComponent implements ControlValueAccessor, Validator, UiFieldValidity {
   readonly label: import("@angular/core").InputSignal<string>;
+  /** Accessible name when there is no visible `label` (falls back to `label`). */
+  readonly ariaLabel: import("@angular/core").InputSignal<string>;
   readonly required: import("@angular/core").InputSignal<boolean>;
   readonly min: import("@angular/core").InputSignal<string>;
   readonly max: import("@angular/core").InputSignal<string>;
   readonly hint: import("@angular/core").InputSignal<string>;
   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>;
   private readonly _cvaDisabled;
   protected readonly disabled: import("@angular/core").Signal<boolean>;
   protected readonly _value: import("@angular/core").WritableSignal<string>;
   protected readonly _inputId: string;
+  private readonly _reveal;
+  private readonly _issue;
+  /** True while the value breaks a built-in rule or the host passed an `[error]`. */
+  readonly invalid: import("@angular/core").Signal<boolean>;
+  /** Message of the first broken built-in rule ('' when valid), shown or not. */
+  readonly errorMessage: import("@angular/core").Signal<string>;
+  /** Emits whenever the field becomes invalid / valid. */
+  readonly invalidChange: import("@angular/core").OutputEmitterRef<boolean>;
+  protected readonly _activeError: import("@angular/core").Signal<string>;
+  private _onValidatorChange;
+  constructor();
+  /** Re-run the form control's validation when a rule input (required, min, max) changes. */
+  ngOnChanges(): void;
+  validate(control: AbstractControl): ValidationErrors | null;
+  registerOnValidatorChange(fn: () => void): void;
   private _onChange;
   private _onTouched;
   writeValue(val: string): void;
@@ -4202,6 +4484,7 @@ export declare class TimeInputComponent implements ControlValueAccessor {
   setDisabledState(d: boolean): void;
   protected onChange(event: Event): void;
   protected onBlur(): void;
+  private _check;
   static ɵfac: i0.ɵɵFactoryDeclaration<TimeInputComponent, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<TimeInputComponent, "ui-time-input", never, {
     "label": {
@@ -4209,6 +4492,11 @@ export declare class TimeInputComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "ariaLabel": {
+      "alias": "ariaLabel";
+      "required": false;
+      "isSignal": true;
+    };
     "required": {
       "alias": "required";
       "required": false;
@@ -4234,12 +4522,19 @@ export declare class TimeInputComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "showErrors": {
+      "alias": "showErrors";
+      "required": false;
+      "isSignal": true;
+    };
     "_disabledInput": {
       "alias": "disabled";
       "required": false;
       "isSignal": true;
     };
-  }, {}, never, never, true, never>;
+  }, {
+    "invalidChange": "invalidChange";
+  }, never, never, true, never>;
 }
 /**
  * Searchable multi-value dropdown. Selected values render as dismissible chips above the trigger.
@@ -5070,6 +5365,9 @@ export declare class ImagePreviewComponent {
   readonly size: import("@angular/core").InputSignal<ImagePreviewSize>;
   readonly placeholder: import("@angular/core").InputSignal<ImagePreviewPlaceholder>;
   readonly loading: import("@angular/core").InputSignal<"lazy" | "eager">;
+  /** Focal point in percent (0-100, default centered) — which part of a cropped image stays visible (CSS object-position). */
+  readonly positionX: import("@angular/core").InputSignal<number | null | undefined>;
+  readonly positionY: import("@angular/core").InputSignal<number | null | undefined>;
   /**
    * Optional retry trigger: whenever its value changes, a failed image is attempted again (signal inputs cannot see
    * the same `src` being set twice, so a host bumps this, e.g. a counter, to retry the same URL).
@@ -5078,6 +5376,7 @@ export declare class ImagePreviewComponent {
   protected readonly _failed: import("@angular/core").WritableSignal<boolean>;
   /** Trimmed src; blank / whitespace-only is treated as no image. */
   protected readonly _url: import("@angular/core").Signal<string | null>;
+  protected readonly _objectPosition: import("@angular/core").Signal<string>;
   protected readonly _cls: import("@angular/core").Signal<string>;
   constructor();
   /** Clears the failed state so the current `src` is attempted again (call via viewChild). */
@@ -5115,6 +5414,16 @@ export declare class ImagePreviewComponent {
       "required": false;
       "isSignal": true;
     };
+    "positionX": {
+      "alias": "positionX";
+      "required": false;
+      "isSignal": true;
+    };
+    "positionY": {
+      "alias": "positionY";
+      "required": false;
+      "isSignal": true;
+    };
     "retryKey": {
       "alias": "retryKey";
       "required": false;
@@ -5439,4 +5748,331 @@ export declare class RichTextEditorComponent implements ControlValueAccessor {
  * raw status text, "null"). Callers fall back to their own generated wording on `null`.
  */
 export declare function humanReadableMessage(value: unknown): string | null;
+/**
+ * Single native radio button (visual tokens of `ui-checkbox`). Normally rendered by `ui-radio-group`; usable standalone
+ * when the host manages the shared `name` and the `checked` state itself.
+ */
+export declare class RadioComponent {
+  readonly label: import("@angular/core").InputSignal<string>;
+  readonly description: import("@angular/core").InputSignal<string>;
+  /** Accessible name when there is no visible `label`. */
+  readonly ariaLabel: import("@angular/core").InputSignal<string>;
+  readonly value: import("@angular/core").InputSignal<string>;
+  /** Radios with the same `name` form one keyboard (arrow key) group. */
+  readonly name: import("@angular/core").InputSignal<string>;
+  readonly checked: import("@angular/core").InputSignal<boolean>;
+  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>;
+  /** 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>;
+  protected readonly _labelId: string;
+  /** With a description inside the <label>, the accessible name would read "Email We send a message": name the input by the label text only. */
+  protected readonly _labelledBy: import("@angular/core").Signal<string | null>;
+  protected readonly _descriptionId: string;
+  /** Group hint/error id plus the option's own description (kept out of the label so the accessible name is label-only). */
+  protected readonly _describedByIds: import("@angular/core").Signal<string | null>;
+  /** Emits the radio's `value` when the user selects it. */
+  readonly selected: import("@angular/core").OutputEmitterRef<string>;
+  protected onChange(event: Event): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<RadioComponent, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<RadioComponent, "ui-radio", never, {
+    "label": {
+      "alias": "label";
+      "required": false;
+      "isSignal": true;
+    };
+    "description": {
+      "alias": "description";
+      "required": false;
+      "isSignal": true;
+    };
+    "ariaLabel": {
+      "alias": "ariaLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "value": {
+      "alias": "value";
+      "required": false;
+      "isSignal": true;
+    };
+    "name": {
+      "alias": "name";
+      "required": false;
+      "isSignal": true;
+    };
+    "checked": {
+      "alias": "checked";
+      "required": false;
+      "isSignal": true;
+    };
+    "invalid": {
+      "alias": "invalid";
+      "required": false;
+      "isSignal": true;
+    };
+    "describedBy": {
+      "alias": "describedBy";
+      "required": false;
+      "isSignal": true;
+    };
+    "_disabledInput": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "selected": "selected";
+  }, never, ["*"], true, never>;
+}
+export interface RadioOption {
+  value: string;
+  label: string;
+  description?: string;
+  disabled?: boolean;
+}
+/**
+ * Group of native radio buttons inside a `<fieldset>` (+ `<legend>` = `label`), a ControlValueAccessor (string value, `''`
+ * = nothing selected). Arrow keys move and select natively because all radios share one `name`.
+ * Built-in validation: `required` -> "<label> is required."; a non-empty value that is not one of the `options` ->
+ * "Select a valid option." (not checked while `options` is empty). Disabled groups are never invalid.
+ *
+ * Validity API (same on every ui input): Angular `Validator`, signals `invalid` + `errorMessage`, `invalidChange` output,
+ * provides `UiFieldValidity`. Messages show after the group lost focus or while `[showErrors]="true"`; a host `[error]` wins.
+ */
+export declare class RadioGroupComponent implements ControlValueAccessor, Validator, UiFieldValidity {
+  readonly label: import("@angular/core").InputSignal<string>;
+  readonly options: import("@angular/core").InputSignal<RadioOption[]>;
+  readonly required: import("@angular/core").InputSignal<boolean>;
+  readonly hint: import("@angular/core").InputSignal<string>;
+  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<"vertical" | "horizontal">;
+  /** Native `name` shared by the radios; a unique one is generated when omitted. */
+  readonly name: import("@angular/core").InputSignal<string>;
+  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;
+  protected readonly _value: import("@angular/core").WritableSignal<string>;
+  private readonly _reveal;
+  private readonly _issue;
+  /** True while the value breaks a built-in rule or the host passed an `[error]`. */
+  readonly invalid: import("@angular/core").Signal<boolean>;
+  /** Message of the first broken built-in rule ('' when valid), shown or not. */
+  readonly errorMessage: import("@angular/core").Signal<string>;
+  /** Emits whenever the field becomes invalid / valid. */
+  readonly invalidChange: import("@angular/core").OutputEmitterRef<boolean>;
+  protected readonly _activeError: import("@angular/core").Signal<string>;
+  private _onValidatorChange;
+  constructor();
+  /** Re-run the form control's validation when a rule input (required, options) changes. */
+  ngOnChanges(): void;
+  validate(control: AbstractControl): ValidationErrors | null;
+  registerOnValidatorChange(fn: () => void): void;
+  private _onChange;
+  private _onTouched;
+  writeValue(val: string): void;
+  registerOnChange(fn: (v: string) => void): void;
+  registerOnTouched(fn: () => void): void;
+  setDisabledState(d: boolean): void;
+  protected onSelect(value: string): void;
+  /** Touched once focus leaves the whole group (moving between its radios does not count). */
+  protected onFocusOut(event: FocusEvent): void;
+  private _check;
+  static ɵfac: i0.ɵɵFactoryDeclaration<RadioGroupComponent, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<RadioGroupComponent, "ui-radio-group", never, {
+    "label": {
+      "alias": "label";
+      "required": false;
+      "isSignal": true;
+    };
+    "options": {
+      "alias": "options";
+      "required": false;
+      "isSignal": true;
+    };
+    "required": {
+      "alias": "required";
+      "required": false;
+      "isSignal": true;
+    };
+    "hint": {
+      "alias": "hint";
+      "required": false;
+      "isSignal": true;
+    };
+    "error": {
+      "alias": "error";
+      "required": false;
+      "isSignal": true;
+    };
+    "showErrors": {
+      "alias": "showErrors";
+      "required": false;
+      "isSignal": true;
+    };
+    "orientation": {
+      "alias": "orientation";
+      "required": false;
+      "isSignal": true;
+    };
+    "name": {
+      "alias": "name";
+      "required": false;
+      "isSignal": true;
+    };
+    "_disabledInput": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "invalidChange": "invalidChange";
+  }, never, never, true, never>;
+}
+/**
+ * Card for detail pages: an optional header and a body, both filled by the page that uses it.
+ *
+ * Header (all optional - set `[showHeader]="false"` and the card is just the body):
+ *  - `title` / `subtitle`: the bold uppercase title and the grey line under it.
+ *  - `titleId`: an id for the title text, which also names the card for assistive tech (aria-labelledby).
+ *  - `<div card-header-leading>`: something before the title block, such as a logo or an icon.
+ *  - `<ng-container card-header>`: your own header content, shown under the title (or instead of it when no title is set).
+ *  - `<ng-container card-header-action>`: buttons or links on the right side of the header.
+ *  - `showEdit` + `editLabel` + `(editClick)`: the built-in Edit button.
+ *  - `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.
+ *
+ *   <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>
+ *   <ui-detail-card [showHeader]="false"> ...body only... </ui-detail-card>
+ *   <ui-detail-card [collapsible]="false">
+ *     <div card-header>Any markup</div>
+ *     <ui-button card-header-action size="xs" variant="secondary">Add</ui-button>
+ *     ...body...
+ *   </ui-detail-card>
+ */
+export declare class DetailCardComponent {
+  /** Bold uppercase title. Empty = no title text. */
+  readonly title: import("@angular/core").InputSignal<string>;
+  /** 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. */
+  readonly titleId: import("@angular/core").InputSignal<string>;
+  /** Grey line under the title. */
+  readonly subtitle: 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. */
+  readonly showHeader: import("@angular/core").InputSignal<boolean>;
+  /** Chevron toggle + clickable header. false = the body is always open. */
+  readonly collapsible: import("@angular/core").InputSignal<boolean>;
+  /** Two-way: whether the body is open. */
+  readonly expanded: import("@angular/core").ModelSignal<boolean>;
+  /** Show the built-in Edit button in the header. */
+  readonly showEdit: import("@angular/core").InputSignal<boolean>;
+  readonly editLabel: import("@angular/core").InputSignal<string>;
+  readonly editClick: import("@angular/core").OutputEmitterRef<void>;
+  /** The body is open unless the card has a header that is collapsible and was collapsed. */
+  isOpen(): boolean;
+  toggle(): void;
+  /** A click on the header toggles, except on a control inside it (Edit, your own header actions, links, inputs). */
+  onHeaderClick(event: Event): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<DetailCardComponent, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<DetailCardComponent, "ui-detail-card", never, {
+    "title": {
+      "alias": "title";
+      "required": false;
+      "isSignal": true;
+    };
+    "headingLevel": {
+      "alias": "headingLevel";
+      "required": false;
+      "isSignal": true;
+    };
+    "titleId": {
+      "alias": "titleId";
+      "required": false;
+      "isSignal": true;
+    };
+    "subtitle": {
+      "alias": "subtitle";
+      "required": false;
+      "isSignal": true;
+    };
+    "showHeader": {
+      "alias": "showHeader";
+      "required": false;
+      "isSignal": true;
+    };
+    "collapsible": {
+      "alias": "collapsible";
+      "required": false;
+      "isSignal": true;
+    };
+    "expanded": {
+      "alias": "expanded";
+      "required": false;
+      "isSignal": true;
+    };
+    "showEdit": {
+      "alias": "showEdit";
+      "required": false;
+      "isSignal": true;
+    };
+    "editLabel": {
+      "alias": "editLabel";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "expanded": "expandedChange";
+    "editClick": "editClick";
+  }, never, ["[card-header-leading]", "[card-header]", "[card-header-action]", "*"], true, never>;
+}
+export type DividerSpace = 'none' | 'sm' | 'md' | 'lg';
+/**
+ * Horizontal divider line (an `<hr>`) with the app's standard colour and optional space above / below.
+ * It is a real separator for assistive tech by default; set `decorative` when it only adds visual rhythm and the
+ * content around it already reads as separate (the line is then hidden from screen readers).
+ *
+ *   <section class="kpi-grid"> ... </section>
+ *   <ui-divider />                                   // line with 16px below
+ *   <ui-divider spaceAbove="md" spaceBelow="lg" />
+ *   <ui-divider [decorative]="true" />
+ */
+export declare class DividerComponent {
+  /** Space above the line: none (0), sm (8px), md (16px), lg (24px). */
+  readonly spaceAbove: import("@angular/core").InputSignal<DividerSpace>;
+  /** Space below the line: none (0), sm (8px), md (16px), lg (24px). */
+  readonly spaceBelow: import("@angular/core").InputSignal<DividerSpace>;
+  /** true = purely visual: hidden from assistive tech. */
+  readonly decorative: import("@angular/core").InputSignal<boolean>;
+  protected readonly above: import("@angular/core").Signal<number>;
+  protected readonly below: import("@angular/core").Signal<number>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<DividerComponent, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<DividerComponent, "ui-divider", never, {
+    "spaceAbove": {
+      "alias": "spaceAbove";
+      "required": false;
+      "isSignal": true;
+    };
+    "spaceBelow": {
+      "alias": "spaceBelow";
+      "required": false;
+      "isSignal": true;
+    };
+    "decorative": {
+      "alias": "decorative";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
 export type { SendDocumentsPayload, SendEmailPayload, SendTextPayload };