@lifecorner/angular-ui-kit 3.15.0 → 3.16.0

package/types/lifecorner-angular-ui-kit-money.d.ts

@@ -0,0 +1,150 @@
+import * as i0 from "@angular/core";
+/**
+ * How the sign of an amount shows, as `Intl.NumberFormat`'s `signDisplay`:
+ * - `auto`: negative amounts only (−42,17 €)
+ * - `always`: plus and minus, also on zero (+0,00 €)
+ * - `exceptZero`: plus and minus, no sign on zero
+ * - `never`: no sign
+ */
+type MoneySignDisplay = 'auto' | 'always' | 'exceptZero' | 'never';
+/** Options of {@link formatMoney}. */
+interface MoneyFormatOptions {
+  /** BCP 47 locale. An invalid one falls back to `en-US`. @default 'en-US' */
+  locale?: string;
+  /** As `Intl.NumberFormat`'s `signDisplay`. @default 'auto' */
+  signDisplay?: MoneySignDisplay;
+  /** Spoken word for the minus sign. @default 'minus' */
+  minusLabel?: string;
+  /** Spoken word for the plus sign. @default 'plus' */
+  plusLabel?: string;
+}
+/** A formatted amount: the visible text and the words a screen reader speaks. */
+interface MoneyText {
+  /** Visible text, e.g. „−42,17 €“ (U+2212 minus, U+00A0 from `Intl`). */
+  text: string;
+  /** Spoken text, e.g. „minus 42,17 Euro“. */
+  spoken: string;
+}
+/** The ISO 4217 minor-unit exponent of `currency` (2 unless listed). */
+declare function moneyMinorUnits(currency: string): number;
+/** Text direction of an amount formatted for `locale`. */
+declare function moneyDirection(locale: string): 'ltr' | 'rtl';
+/**
+ * Formats an amount of money given in integer minor units (cents, yen, fils)
+ * exactly, never through a float: the decimal string goes into `Intl`.
+ * Returns `null` for an amount that is not a safe integer or a currency that
+ * is not a three-letter code. This is the formatter of `lc-money`, for table
+ * `formatter`s and texts.
+ *
+ * @example
+ * ```ts
+ * formatMoney(-4217, 'EUR', { locale: 'de-DE' });
+ * // { text: '−42,17 €', spoken: 'minus 42,17 Euro' }
+ * ```
+ */
+export declare function formatMoney(amountMinor: number, currency: string, options?: MoneyFormatOptions): MoneyText | null;
+/**
+ * Displays an amount of money (3.16, BA-4): locale, currency, sign, tabular
+ * figures and a spoken text. Display only, no input parsing or conversion.
+ *
+ * - `amountMinor` is an integer in the currency's minor units (cents, yen,
+ *   fils), formatted exactly through a decimal string, never a float. Minor
+ *   units follow ISO 4217: 2, except 0 (BIF CLP DJF GNF ISK JPY KMF KRW PYG
+ *   RWF UGX UYI VND VUV XAF XOF XPF), 3 (BHD IQD JOD KWD LYD OMR TND) and 4
+ *   (CLF UYW).
+ * - The visible amount („−42,17 €“, U+2212 minus, a no-break space from
+ *   `Intl`) is `aria-hidden`; a visually hidden span holds the words
+ *   („minus 42,17 Euro“), so a screen reader reads the amount once.
+ * - Tabular figures, no wrapping inside the amount; the amount is a `dir`
+ *   isolate (`ltr`, or `rtl` for an RTL locale), safe inside RTL text.
+ * - Font and colour come from the context; colour never carries the sign.
+ * - `locale` empty: the app's `LOCALE_ID` (Angular's default `en-US`), the
+ *   same on the server and in the browser.
+ * - For table `formatter`s and texts use {@link formatMoney}.
+ *
+ * Separate a `lc-money` from adjacent text with a space in your template, so
+ * the spoken text does not run into the words around it.
+ *
+ * @example
+ * ```html
+ * <lc-money [amountMinor]="-4217" currency="EUR" locale="de-DE" />
+ * ```
+ */
+export declare class MoneyComponent {
+  private readonly appLocale;
+  /**
+   * Amount in minor units of `currency` (cents, yen, fils): a safe integer
+   * (±9,007,199,254,740,991), formatted exactly. Anything else renders
+   * nothing (a dev warning).
+   */
+  readonly amountMinor: import("@angular/core").InputSignal<number>;
+  /**
+   * ISO 4217 currency code (`EUR`, `USD`, `JPY`, `KWD`). It sets the minor
+   * units and the symbol. Not a three-letter code: renders nothing (a dev
+   * warning).
+   */
+  readonly currency: import("@angular/core").InputSignal<string>;
+  /**
+   * BCP 47 locale of the amount (`de-DE`, `en-GB`). Empty: the app's
+   * `LOCALE_ID` (Angular's default `en-US`). An invalid locale falls back to
+   * `en-US`.
+   * @default ''
+   */
+  readonly locale: import("@angular/core").InputSignal<string>;
+  /**
+   * Which signs show, as `Intl.NumberFormat`: `auto` (negative only),
+   * `always`, `exceptZero`, `never`. The spoken text says the sign whenever
+   * it shows.
+   * @default 'auto'
+   */
+  readonly signDisplay: import("@angular/core").InputSignal<MoneySignDisplay>;
+  /**
+   * Spoken word for the minus sign („minus 42,17 Euro“; the same in German).
+   * @default 'minus'
+   */
+  readonly minusLabel: import("@angular/core").InputSignal<string>;
+  /**
+   * Spoken word for the plus sign („plus 42,17 Euro“; the same in German).
+   * @default 'plus'
+   */
+  readonly plusLabel: import("@angular/core").InputSignal<string>;
+  /** The locale in use: the `locale` input or the app's `LOCALE_ID`. */
+  protected readonly effectiveLocale: import("@angular/core").Signal<string>;
+  protected readonly formatted: import("@angular/core").Signal<import("@lifecorner/angular-ui-kit/money").MoneyText | null>;
+  protected readonly dir: import("@angular/core").Signal<"ltr" | "rtl">;
+  constructor();
+  static ɵfac: i0.ɵɵFactoryDeclaration<MoneyComponent, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<MoneyComponent, "lc-money", never, {
+    "amountMinor": {
+      "alias": "amountMinor";
+      "required": true;
+      "isSignal": true;
+    };
+    "currency": {
+      "alias": "currency";
+      "required": true;
+      "isSignal": true;
+    };
+    "locale": {
+      "alias": "locale";
+      "required": false;
+      "isSignal": true;
+    };
+    "signDisplay": {
+      "alias": "signDisplay";
+      "required": false;
+      "isSignal": true;
+    };
+    "minusLabel": {
+      "alias": "minusLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "plusLabel": {
+      "alias": "plusLabel";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
+export type { MoneyFormatOptions, MoneySignDisplay, MoneyText };

package/types/lifecorner-angular-ui-kit-next-step-card.d.ts

@@ -15,6 +15,15 @@ export type NextStepCardVariant = 'default' | 'soft';
  * - `stacked`: always in their own row, one per line at equal width, 8 px apart
  */
 export type NextStepCardActionsLayout = 'inline' | 'stacked';
+/**
+ * Weight of the two built-in actions.
+ * - `default`: a filled primary and a ghost secondary with a chevron, the
+ *   primary last
+ * - `equal`: two answers of the same weight (a question such as „Teilen?“):
+ *   both `outline` in the primary tone at `actionSize`, the primary first,
+ *   no chevron
+ */
+export type NextStepCardActionsStyle = 'default' | 'equal';
 /** Element that renders the title (semantics only, the look stays the same). */
 export type NextStepCardTitleTag = 'div' | 'h2' | 'h3';
 /** Size of the built-in action buttons (`sm` 32 px, `md` 42 px, `lg` 48.5 px). */
@@ -44,6 +53,8 @@ export type NextStepCardActionSize = 'sm' | 'md' | 'lg';
  *   `fullWidth` button gets its own row at every width.
  * - `variant="soft"`: the tinted card of the "Weite" look; `actionsLayout`
  *   `stacked` for several equal-width actions; `titleTag` for a heading
+ * - `actionsStyle="equal"` (3.16, BA-5): a question with two answers of the
+ *   same weight, both outline buttons in the primary tone, primary first
  *
  * The host is a size container (`container-type: inline-size`) and takes the
  * full inline size of its parent.
@@ -106,6 +117,16 @@ export declare class NextStepCardComponent implements AfterViewChecked {
    * @default 'sm'
    */
   actionSize: import("@angular/core").InputSignal<NextStepCardActionSize>;
+  /**
+   * Weight of the built-in actions. `default`: filled primary, ghost secondary
+   * with a chevron, primary last. `equal`: two answers of the same weight, both
+   * `outline` in the primary tone at `actionSize`, primary first, no chevron
+   * (`primaryClick`, `secondaryClick`, `primaryLoading`, `primaryDisabled` and
+   * `announce` work as before). Use `actionSize="lg"` (48.5 px, the 44 px
+   * target; a dev warning otherwise). No effect on `[slot='actions']`.
+   * @default 'default'
+   */
+  actionsStyle: import("@angular/core").InputSignal<NextStepCardActionsStyle>;
   /** Message below the title. For markup, use the default slot instead. */
   message: import("@angular/core").InputSignal<string | undefined>;
   /** Label of the primary action. Omit to render no primary button. */
@@ -200,6 +221,11 @@ export declare class NextStepCardComponent implements AfterViewChecked {
       "required": false;
       "isSignal": true;
     };
+    "actionsStyle": {
+      "alias": "actionsStyle";
+      "required": false;
+      "isSignal": true;
+    };
     "message": {
       "alias": "message";
       "required": false;

package/types/lifecorner-angular-ui-kit-switch.d.ts

@@ -8,6 +8,10 @@ import * as i0 from "@angular/core";
  * - Size options (sm, md, lg)
  * - Loading state with spinner
  * - Configurable label positioning (left/right)
+ * - Help text below the label, linked by `aria-describedby` (`helpText`, 3.16)
+ * - Rows with a label or help text are at least 44 px high
+ *   (`--lc-switch-min-height`, default `var(--size-min-touch-height)`; `0`
+ *   restores the 3.15 rows of 21/24/28 px)
  * - Keyboard toggle support
  * - Disabled and required states
  * - ControlValueAccessor integration for reactive forms
@@ -54,12 +58,22 @@ export declare class SwitchComponent implements ControlValueAccessor {
    * ARIA label for accessibility (overrides the visible label as accessible name)
    */
   readonly ariaLabel: import("@angular/core").InputSignal<string | undefined>;
+  /**
+   * Description below the label, linked to the switch by `aria-describedby`
+   * (read after the name and state). Wraps; 14 px secondary text. A tap on it
+   * toggles the switch like the label. Empty renders no element and no
+   * `aria-describedby` (3.15).
+   * @default ''
+   */
+  readonly helpText: import("@angular/core").InputSignal<string>;
   /**
    * Emitted when checked state changes
    */
   readonly checkedChange: import("@angular/core").OutputEmitterRef<boolean>;
   /** Per-instance id so the visible `<label for>` points at this switch. */
   readonly switchId: string;
+  /** id of the rendered help text (only while `helpText` is set). */
+  readonly helpTextId: import("@angular/core").Signal<string | null>;
   /**
    * Effective checked state: follows the `checked` input, overridden by
    * form writes (`writeValue`) and user toggles.
@@ -135,6 +149,11 @@ export declare class SwitchComponent implements ControlValueAccessor {
       "required": false;
       "isSignal": true;
     };
+    "helpText": {
+      "alias": "helpText";
+      "required": false;
+      "isSignal": true;
+    };
   }, {
     "checkedChange": "checkedChange";
   }, never, never, true, never>;

package/types/lifecorner-angular-ui-kit-table.d.ts

@@ -162,6 +162,9 @@ interface DisplayRow {
  * - Composed cells (e.g. avatar + badge + actions)
  * - Hierarchical "tree" rows (grouped / expandable) via `idKey` + `parentKey`
  * - Responsive horizontal scrolling
+ * - `clickable` rows: tab stops, Enter/Space emit `rowClick` (3.16)
+ * - `caption` as the table's `<caption>`, visible or for screen readers only
+ *   (`showCaption`, 3.16)
  * - Empty state text for no data
  * - Accessible with proper table semantics
  *
@@ -198,6 +201,29 @@ export declare class TableComponent {
   size: import("@angular/core").InputSignal<TableSize>;
   /** Whether rows should highlight on hover */
   hoverable: import("@angular/core").InputSignal<boolean>;
+  /**
+   * Rows are interactive (3.16, BA-3): each data row is a tab stop, Enter and
+   * Space emit `rowClick` (Space does not scroll the page), pointer and hover
+   * as `hoverable`. Clicks and keys on controls inside a row (buttons, links,
+   * inputs, switches) stay theirs and emit no `rowClick`. Set it whenever you
+   * handle `rowClick`. Tree mode keeps its roving tab stop. A focused row is
+   * read by its cells, not as "clickable": let the row open something that
+   * announces itself (a dialog, a page).
+   * @default false
+   */
+  clickable: import("@angular/core").InputSignal<boolean>;
+  /**
+   * Title of the table, rendered as its `<caption>` (3.16, BA-3), so it also
+   * names the table for screen readers. Empty renders no caption.
+   * @default ''
+   */
+  caption: import("@angular/core").InputSignal<string>;
+  /**
+   * Show the caption above the table (16 px semibold, 12 px above the table);
+   * `false` keeps it for screen readers only.
+   * @default true
+   */
+  showCaption: import("@angular/core").InputSignal<boolean>;
   /** Whether table should be responsive (horizontal scroll on mobile) */
   responsive: import("@angular/core").InputSignal<boolean>;
   /** Text shown when data is empty */
@@ -398,7 +424,7 @@ export declare class TableComponent {
   protected treeCellLabel(row: Record<string, unknown>): string;
   getCellTemplate(columnKey: string): TableCellDirective | undefined;
   hasCustomTemplate(columnKey: string): boolean;
-  onRowClick(row: Record<string, unknown>): void;
+  onRowClick(row: Record<string, unknown>, event?: Event): void;
   /** Whether the trailing actions column should be rendered */
   protected readonly hasActions: import("@angular/core").Signal<boolean>;
   protected isActionHidden(action: TableAction, row: Record<string, unknown>, rowIndex: number): boolean;
@@ -469,6 +495,21 @@ export declare class TableComponent {
       "required": false;
       "isSignal": true;
     };
+    "clickable": {
+      "alias": "clickable";
+      "required": false;
+      "isSignal": true;
+    };
+    "caption": {
+      "alias": "caption";
+      "required": false;
+      "isSignal": true;
+    };
+    "showCaption": {
+      "alias": "showCaption";
+      "required": false;
+      "isSignal": true;
+    };
     "responsive": {
       "alias": "responsive";
       "required": false;

package/types/lifecorner-angular-ui-kit.d.ts

@@ -58,6 +58,7 @@ export * from "@lifecorner/angular-ui-kit/toggle-group";
 export * from "@lifecorner/angular-ui-kit/list";
 export * from "@lifecorner/angular-ui-kit/chip";
 export * from "@lifecorner/angular-ui-kit/table";
+export * from "@lifecorner/angular-ui-kit/money";
 export * from "@lifecorner/angular-ui-kit/field-group";
 export * from "@lifecorner/angular-ui-kit/stepper";
 export * from "@lifecorner/angular-ui-kit/filter-bar";