@forgeroute/ui 0.4.60 → 0.4.62

package/package.json

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

package/types/forgeroute-ui.d.ts

@@ -2260,7 +2260,7 @@ export declare class ModalComponent implements OnInit, OnDestroy {
   readonly title: import("@angular/core").InputSignal<string>;
   readonly description: import("@angular/core").InputSignal<string>;
   readonly maxWidth: import("@angular/core").InputSignal<string>;
-  readonly bodyOverflow: import("@angular/core").InputSignal<"hidden" | "visible" | "auto">;
+  readonly bodyOverflow: import("@angular/core").InputSignal<"hidden" | "auto" | "visible">;
   /** `data-testid` of the dialog element itself (the host `<ui-modal>` is always in the page, the dialog only while open). None when empty. */
   readonly dialogTestId: import("@angular/core").InputSignal<string>;
   /** Hides the header X button (e.g. while a request is running). Escape and a backdrop click still close unless `closable` is false. */
@@ -2936,7 +2936,7 @@ export declare class CheckboxComponent implements ControlValueAccessor, Validato
    * clicking it still toggles the box - e.g. a product name that is both the heading of its card and the label of its checkbox.
    * Default null: plain label text, exactly as before. Single mode only.
    */
-  readonly headingLevel: import("@angular/core").InputSignal<2 | 1 | 6 | 3 | 4 | 5 | null>;
+  readonly headingLevel: import("@angular/core").InputSignal<1 | 2 | 3 | 4 | 5 | 6 | null>;
   readonly indeterminate: import("@angular/core").InputSignal<boolean>;
   readonly checked: import("@angular/core").ModelSignal<boolean>;
   /**
@@ -3847,7 +3847,7 @@ export declare class PhoneNumberPickerComponent {
   protected readonly modeCtl: FormControl<string>;
   protected readonly zipCtl: FormControl<string>;
   protected readonly areaCtl: FormControl<string>;
-  protected readonly step: import("@angular/core").WritableSignal<2 | 1 | 3>;
+  protected readonly step: import("@angular/core").WritableSignal<1 | 2 | 3>;
   protected readonly mode: import("@angular/core").WritableSignal<PhoneNumberSearchMode>;
   private readonly _zip;
   private readonly _area;
@@ -3984,7 +3984,7 @@ export declare class ButtonComponent {
    */
   readonly href: import("@angular/core").InputSignal<string | null>;
   /** Where to open the `href` (`_blank` = a new tab). */
-  readonly target: import("@angular/core").InputSignal<"_blank" | "_self" | "_parent" | "_top" | null>;
+  readonly target: import("@angular/core").InputSignal<"_self" | "_blank" | "_parent" | "_top" | null>;
   /** `rel` of the `href` link. A `_blank` target always gets `noopener noreferrer` added. */
   readonly rel: import("@angular/core").InputSignal<string | null>;
   /** The href when it is allowed (http, https, mailto, tel, sms or a relative URL), else null. */
@@ -4009,7 +4009,7 @@ export declare class ButtonComponent {
   readonly color: import("@angular/core").InputSignal<string | undefined>;
   readonly active: import("@angular/core").InputSignal<boolean>;
   readonly size: import("@angular/core").InputSignal<"sm" | "md" | "lg" | "xs">;
-  readonly type: import("@angular/core").InputSignal<"reset" | "submit" | "button">;
+  readonly type: import("@angular/core").InputSignal<"button" | "reset" | "submit">;
   readonly disabled: import("@angular/core").InputSignal<boolean>;
   readonly loading: import("@angular/core").InputSignal<boolean>;
   readonly fullWidth: import("@angular/core").InputSignal<boolean>;
@@ -4948,7 +4948,7 @@ export declare class TextInputComponent implements ControlValueAccessor, Validat
   readonly passwordRequirements: import("@angular/core").InputSignal<boolean>;
   /** Rules for `passwordRequirements`; default = the library's five rules (8+ characters, upper, lower, digit, special). */
   readonly passwordRules: import("@angular/core").InputSignal<readonly PasswordRule[] | undefined>;
-  readonly type: import("@angular/core").InputSignal<"number" | "tel" | "text" | "email" | "password" | "url">;
+  readonly type: import("@angular/core").InputSignal<"number" | "text" | "email" | "tel" | "password" | "url">;
   readonly maxlength: import("@angular/core").InputSignal<number | undefined>;
   readonly required: import("@angular/core").InputSignal<boolean>;
   readonly autocomplete: import("@angular/core").InputSignal<string>;
@@ -4957,7 +4957,7 @@ export declare class TextInputComponent implements ControlValueAccessor, Validat
    * `search`, `text`, `none`). Empty (default) = the browser's default for the field, except `type="tel"`, which keeps `tel`.
    * It only picks the keyboard; it does not restrict what can be typed or pasted.
    */
-  readonly inputmode: import("@angular/core").InputSignal<"" | "tel" | "search" | "text" | "none" | "email" | "url" | "decimal" | "numeric">;
+  readonly inputmode: import("@angular/core").InputSignal<"" | "search" | "text" | "numeric" | "none" | "email" | "tel" | "url" | "decimal">;
   readonly readonly: import("@angular/core").InputSignal<boolean>;
   readonly hint: import("@angular/core").InputSignal<string>;
   /** Id(s) of an external element that also describes this control (e.g. one shared error text for a group of fields). Space separated; MERGED after the control's own hint / error id in `aria-describedby`, never replacing it. Empty = unchanged. */
@@ -5023,7 +5023,7 @@ export declare class TextInputComponent implements ControlValueAccessor, Validat
   protected readonly _stepAttr: import("@angular/core").Signal<string | null>;
   protected readonly _revealable: import("@angular/core").Signal<boolean>;
   protected readonly _shown: import("@angular/core").WritableSignal<boolean>;
-  protected readonly _inputType: import("@angular/core").Signal<"number" | "tel" | "text" | "email" | "password" | "url">;
+  protected readonly _inputType: import("@angular/core").Signal<"number" | "text" | "email" | "tel" | "password" | "url">;
   protected readonly _eyePath: string;
   protected readonly _eyeOffPath: string;
   protected readonly _showRequirements: import("@angular/core").Signal<boolean>;
@@ -6728,7 +6728,7 @@ export declare class FormSectionComponent {
   }, {}, never, ["*"], true, never>;
 }
 export declare class FormRowComponent {
-  readonly cols: import("@angular/core").InputSignal<2 | 1 | 3 | 4>;
+  readonly cols: import("@angular/core").InputSignal<1 | 2 | 3 | 4>;
   static ɵfac: i0.ɵɵFactoryDeclaration<FormRowComponent, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<FormRowComponent, "ui-form-row", never, {
     "cols": {
@@ -6745,7 +6745,7 @@ export declare class FormRowComponent {
  * 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 | "2" | "3" | 3 | "all">;
+  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, {
@@ -9045,10 +9045,10 @@ export declare function resolvePreset(key: DatePreset, today: Date): DateRange;
  * `textColor highlight` | `align` | `bulletList numberedList indent outdent` | `clearFormat`.
  * `align` is the three alignment buttons (left, center, right) as one option.
  */
-export type RichTextOption = 'bold' | 'italic' | 'underline' | 'strikethrough' | 'heading' | 'fontSize' | 'fontFamily' | 'textColor' | 'highlight' | 'align' | 'bulletList' | 'numberedList' | 'indent' | 'outdent' | 'clearFormat';
+export type RichTextOption = 'bold' | 'italic' | 'underline' | 'strikethrough' | 'link' | 'heading' | 'fontSize' | 'fontFamily' | 'textColor' | 'highlight' | 'align' | 'bulletList' | 'numberedList' | 'indent' | 'outdent' | 'clearFormat';
 /** All option keys, in toolbar order. */
 export declare const RICH_TEXT_OPTIONS: readonly RichTextOption[];
-type MenuId = 'heading' | 'size' | 'font';
+type MenuId = 'heading' | 'size' | 'font' | 'link';
 export declare class RichTextEditorComponent implements ControlValueAccessor {
   readonly label: import("@angular/core").InputSignal<string>;
   /** Accessible name for an editor with no visible label. */
@@ -9099,6 +9099,10 @@ export declare class RichTextEditorComponent implements ControlValueAccessor {
   protected readonly activeFont: import("@angular/core").WritableSignal<string>;
   protected readonly active: import("@angular/core").WritableSignal<Record<string, boolean>>;
   protected readonly empty: import("@angular/core").WritableSignal<boolean>;
+  protected readonly linkUrl: import("@angular/core").WritableSignal<string>;
+  protected readonly linkError: import("@angular/core").WritableSignal<string>;
+  protected readonly hasLink: import("@angular/core").WritableSignal<boolean>;
+  protected readonly _linkId: string;
   private readonly hidden;
   /** Group id → at least one of its controls is shown. */
   private readonly groupVisible;
@@ -9134,6 +9138,12 @@ export declare class RichTextEditorComponent implements ControlValueAccessor {
   protected selectHeading(tag: string, label: string): void;
   protected selectSize(value: string, label: string): void;
   protected selectFont(value: string, label: string): void;
+  /** The `<a>` the saved (or current) selection sits in, if any. */
+  private _anchorAtSelection;
+  protected toggleLink(): void;
+  protected closeLink(): void;
+  protected applyLink(): void;
+  protected removeLink(): void;
   protected exec(command: string): void;
   protected execWithArg(command: string, value: string): void;
   static ɵfac: i0.ɵɵFactoryDeclaration<RichTextEditorComponent, never>;
@@ -9800,7 +9810,7 @@ export declare class DetailCardComponent {
   /** true (default) = the title is displayed in capitals (CSS only); false = shown as written. The text, aria-label and heading name are never changed. */
   readonly uppercaseTitle: import("@angular/core").InputSignal<boolean>;
   /** 1-6 makes the title a real heading for screen readers (role=heading, aria-level); null keeps it plain text. */
-  readonly headingLevel: import("@angular/core").InputSignal<2 | 1 | 6 | 3 | 4 | 5 | null>;
+  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>;
   /** Accessible name of the card when the header gives none (no header, or no title). A visible title wins; blank = no name. */
@@ -12243,7 +12253,7 @@ export declare class SetupWizardComponent {
   protected customHintId(): string;
   protected readonly importBlocked: import("@angular/core").Signal<boolean>;
   /** The step's own two parts (`splitLayout`) show as two tabs, one card at a time; this is the open one (it starts on the app's part on every visit). */
-  protected readonly splitTab: import("@angular/core").WritableSignal<"extra" | "main">;
+  protected readonly splitTab: import("@angular/core").WritableSignal<"main" | "extra">;
   protected readonly splitTabs: import("@angular/core").Signal<{
     key: string;
     label: string;
@@ -13204,6 +13214,8 @@ export interface ConversationMessage {
   id: string;
   direction: ConversationMessageDirection;
   body?: string | null;
+  /** Formatted text (bold, links, lists) of a message written in the rich composer: shown instead of `body`, after the library's allow-list sanitiser. Keep `body` as its plain text. */
+  bodyHtml?: string | null;
   /** ISO instant. Drives the time under the bubble and the date separators. */
   sentAt: string;
   /** Outbound only: `sent` (✓), `delivered` (✓✓), `failed`, `scheduled`. Other values show nothing. */
@@ -13226,7 +13238,10 @@ export interface ConversationAttachment {
 }
 /** What `(send)` reports. */
 export interface ConversationSendEvent {
+  /** The message as plain text (trimmed): the text of the formatted message. */
   text: string;
+  /** Only with `[richText]="true"`: the formatted message as sanitised HTML (bold, italic, underline, links, lists). */
+  html?: string;
 }
 /** A message with the date separator that goes above it ('' when it shares the day of the previous message). */
 export interface ConversationMessageRow {
@@ -13255,6 +13270,24 @@ export declare function groupMessagesByDay(messages: readonly ConversationMessag
 export declare function conversationMessageStatusLabel(status: string | null | undefined): string;
 /** The mark shown beside an outbound message: ticks for sent / delivered, the word for the rest. */
 export declare function conversationMessageStatusMark(status: string | null | undefined): string;
+/**
+ * The plain text of formatted composer HTML, the way it reads: paragraphs, list items and line breaks become line breaks, everything else
+ * is its text. Runs on an inert document, so nothing in `html` is executed. Trimmed; '' for nothing.
+ */
+export declare function conversationHtmlToText(html: string | null | undefined): string;
+/** A message's formatted text. Its own (unencapsulated) component so the styles reach the markup that `innerHTML` creates. */
+export declare class ConversationRichBodyComponent {
+  readonly html: import("@angular/core").InputSignal<string>;
+  protected readonly safe: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<ConversationRichBodyComponent, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<ConversationRichBodyComponent, "ui-conversation-rich-body", never, {
+    "html": {
+      "alias": "html";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
 /**
  * The text-message inbox: a conversation list (search, filter tabs, pagination) on the left, the open thread (header, messages with date
  * separators and media, composer) in the middle and an optional contact panel on the right. On a phone the list and the thread take turns.
@@ -13281,7 +13314,7 @@ export declare function conversationMessageStatusMark(status: string | null | un
  * Test ids: conversations, conv-search, conv-filters, new-message-btn, conv-loading, conv-error, conv-retry, conv-empty, conv-item, conv-unread,
  * conv-arrow, conv-delete-btn, thread-empty, thread-error, thread-retry, load-earlier, msg-sender, msg-action, back-to-list, thread-name, thread-phone, use-template-btn, context-toggle, status-btn, thread-delete-btn,
  * messages, messages-loading, messages-empty, message, msg-status, attach-btn, attach-input, attachment-preview, attachment-remove,
- * compose-input, send-btn, compose-opted-out, compose-loading-contact, context-panel, context-close.
+ * msg-rich-body, compose-input, send-btn, compose-opted-out, compose-loading-contact, context-panel, context-close.
  */
 export declare class ConversationsComponent {
   readonly conversations: import("@angular/core").InputSignal<readonly ConversationItem[]>;
@@ -13322,6 +13355,8 @@ export declare class ConversationsComponent {
   readonly allowDelete: import("@angular/core").InputSignal<boolean>;
   /** The arrow at the end of each conversation row, drawn inside the row so its highlight covers it. Default false (hidden); `true` where the arrow helps (rows that open a thread on a phone). */
   readonly showRowArrow: import("@angular/core").InputSignal<boolean>;
+  /** Rows open their conversation on click / Enter (pointer cursor, hover tint, focusable) and the thread has a Back button. `false` for a host with one conversation that is always open: nothing to click, no Back. */
+  readonly selectable: import("@angular/core").InputSignal<boolean>;
   readonly newLabel: import("@angular/core").InputSignal<string>;
   readonly newTooltip: import("@angular/core").InputSignal<string>;
   readonly deleteRowLabel: import("@angular/core").InputSignal<string>;
@@ -13376,8 +13411,15 @@ export declare class ConversationsComponent {
   readonly composerStatus: import("@angular/core").InputSignal<string>;
   /** An error on the message box. */
   readonly composerError: import("@angular/core").InputSignal<string>;
-  /** Longest message the box accepts (1600 = the SMS provider's limit for one send). */
+  /** Longest message (in plain text) Send accepts; longer disables Send, the host words the reason in `composerError` (1600 = the SMS provider's limit for one send). */
   readonly maxLength: import("@angular/core").InputSignal<number>;
+  /**
+   * Opt-in formatted composer (`ui-rich-text-editor`: bold, italic, underline, link, lists). Default false = the plain textarea, Enter sends and
+   * Shift+Enter is a new line. In rich mode `[(draft)]` still holds the PLAIN text (so a host's length and merge-field checks and a template
+   * insert work on text), Enter starts a new paragraph / list item and the message is sent with the Send button or Ctrl/Cmd+Enter;
+   * `(send)` carries `text` (plain) and `html` (sanitised). Messages with `bodyHtml` show formatted in either mode.
+   */
+  readonly richText: import("@angular/core").InputSignal<boolean>;
   readonly attachment: import("@angular/core").InputSignal<ConversationAttachment | null>;
   readonly uploading: import("@angular/core").InputSignal<boolean>;
   readonly attachEnabled: import("@angular/core").InputSignal<boolean>;
@@ -13441,6 +13483,9 @@ export declare class ConversationsComponent {
   protected readonly contextVisible: import("@angular/core").Signal<boolean>;
   /** Something to send (text or a file), the composer is open and no request is running. */
   readonly canSend: import("@angular/core").Signal<boolean>;
+  /** The composer's formatted content. `draft` is always its plain text, so a host that reads or sets `[(draft)]` never sees markup. */
+  protected readonly editorHtml: import("@angular/core").WritableSignal<string>;
+  protected readonly richHide: RichTextOption[];
   constructor();
   protected relativeTime(iso: string | null | undefined): string;
   protected preview(text: string | null | undefined): string;
@@ -13454,6 +13499,7 @@ export declare class ConversationsComponent {
   protected closeContext(restoreFocus?: boolean): void;
   protected openFilePicker(): void;
   protected onComposeKeydown(event: KeyboardEvent): void;
+  protected onEditorChange(html: string): void;
   protected sendMessage(): void;
   private clock;
   private singleColumn;
@@ -13600,6 +13646,11 @@ export declare class ConversationsComponent {
       "required": false;
       "isSignal": true;
     };
+    "selectable": {
+      "alias": "selectable";
+      "required": false;
+      "isSignal": true;
+    };
     "newLabel": {
       "alias": "newLabel";
       "required": false;
@@ -13805,6 +13856,11 @@ export declare class ConversationsComponent {
       "required": false;
       "isSignal": true;
     };
+    "richText": {
+      "alias": "richText";
+      "required": false;
+      "isSignal": true;
+    };
     "attachment": {
       "alias": "attachment";
       "required": false;