@forgeroute/ui 0.4.35 → 0.4.37

package/package.json

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

package/types/forgeroute-ui.d.ts

@@ -4348,6 +4348,94 @@ export declare class ImportSourceGridComponent {
     "sourceSelect": "sourceSelect";
   }, never, never, true, never>;
 }
+/**
+ * One option the user can pick or connect: a coloured tile (a letter, or a library icon), a title, a short description and a small action button.
+ * The same card is used for the source cards of an import step, the provider cards of the setup wizard (calendar, email, tools) and a CRM
+ * live-sync option, so they all look and behave alike. Anything inside the tag is shown under the row (an expanding form, a result).
+ *
+ *   <ui-option-card title="Gmail" letter="G" color="#ea4335" description="Connect your Google account" actionLabel="Connect" (action)="connect()" />
+ *   <ui-option-card title="Follow Up Boss" letter="F" actionLabel="Sync live" (action)="open()"> <form>…</form> </ui-option-card>
+ *
+ * Inputs: `title` (required), `description`, `letter` (one character in the tile) or `icon` (a library icon name, used when there is no letter),
+ * `color` (tile background, default slate), `actionLabel` (no label = no button), `actionVariant` (default secondary), `actionAriaLabel`,
+ * `actionTestId`, `actionLoading`, `disabled`. Output: `action`.
+ */
+export declare class OptionCardComponent {
+  readonly title: import("@angular/core").InputSignal<string>;
+  readonly description: import("@angular/core").InputSignal<string>;
+  readonly letter: import("@angular/core").InputSignal<string>;
+  readonly icon: import("@angular/core").InputSignal<string>;
+  readonly color: import("@angular/core").InputSignal<string>;
+  readonly actionLabel: import("@angular/core").InputSignal<string>;
+  readonly actionVariant: import("@angular/core").InputSignal<"primary" | "secondary">;
+  readonly actionAriaLabel: import("@angular/core").InputSignal<string>;
+  readonly actionTestId: import("@angular/core").InputSignal<string>;
+  readonly actionLoading: import("@angular/core").InputSignal<boolean>;
+  readonly disabled: import("@angular/core").InputSignal<boolean>;
+  /** The action button was pressed. */
+  readonly action: import("@angular/core").OutputEmitterRef<void>;
+  protected iconD(): string | null;
+  static ɵfac: i0.ɵɵFactoryDeclaration<OptionCardComponent, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<OptionCardComponent, "ui-option-card", never, {
+    "title": {
+      "alias": "title";
+      "required": true;
+      "isSignal": true;
+    };
+    "description": {
+      "alias": "description";
+      "required": false;
+      "isSignal": true;
+    };
+    "letter": {
+      "alias": "letter";
+      "required": false;
+      "isSignal": true;
+    };
+    "icon": {
+      "alias": "icon";
+      "required": false;
+      "isSignal": true;
+    };
+    "color": {
+      "alias": "color";
+      "required": false;
+      "isSignal": true;
+    };
+    "actionLabel": {
+      "alias": "actionLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "actionVariant": {
+      "alias": "actionVariant";
+      "required": false;
+      "isSignal": true;
+    };
+    "actionAriaLabel": {
+      "alias": "actionAriaLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "actionTestId": {
+      "alias": "actionTestId";
+      "required": false;
+      "isSignal": true;
+    };
+    "actionLoading": {
+      "alias": "actionLoading";
+      "required": false;
+      "isSignal": true;
+    };
+    "disabled": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "action": "action";
+  }, never, ["*"], true, never>;
+}
 export interface ActiveConfirm {
   title: string;
   message: string;
@@ -11169,6 +11257,11 @@ export interface SetupIntegration {
   /** The "Connected — …" detail built from the status payload (default: just "Connected"). */
   connectedDetail?: (status: Record<string, unknown>) => string;
   connect: SetupIntegrationConnect;
+  /**
+   * Runs when the user presses Connect, before anything else (before the redirect to the provider, or before the area-code box opens): save what the
+   * step collected so the redirect does not lose it. Resolve to go on; throw / error to stop (the message is shown in the step's alert).
+   */
+  beforeConnect?: () => Observable<unknown> | Promise<unknown> | void;
 }
 /** Texts of the built-in controls; every one has an English default and every one can be replaced by the app. */
 export interface SetupWizardTexts {
@@ -11186,6 +11279,12 @@ export interface SetupWizardTexts {
   selectSource: string;
   connected: string;
   importMore: string;
+  /** Shown (and described by the disabled Continue) on an import step with `requireImport` until data came in. */
+  importRequired: string;
+  /** An import where some rows were refused: the warning's title and text (rows that failed must be fixed and imported again before Continue) and the button that returns to the sources. */
+  importErrorsTitle: (errors: number) => string;
+  importErrorsText: (imported: number, errors: number) => string;
+  importAgain: string;
   whatGetsImported: string;
   doneTitle: string;
   doneDescription: string;
@@ -11234,6 +11333,18 @@ export interface SetupStep {
   canContinue?: () => boolean;
   /** `custom`: text of the continue button (default "Save & Continue"). */
   saveLabel?: string;
+  /**
+   * Import / integrations steps with app content (`<ng-template uiSetupStep>`): show two tabs below the intro, one card at a time. The first tab holds the app's
+   * content in a card titled `extraTitle`, the second the step's own card. Tab labels: `extraTab` / `mainTab` (default `extraTitle` / `cardTitle`).
+   */
+  splitLayout?: boolean;
+  extraTitle?: string;
+  extraTab?: string;
+  mainTab?: string;
+  /** Status line under the app content of a `splitLayout` step (e.g. "Not connected yet"); read on every render, so it can follow signals. */
+  extraFooter?: () => string;
+  /** Import steps: Continue stays disabled until the data came in (CSV import done with no refused rows, or the app called `markCompleted(key)` after a live sync). Skip stays available. */
+  requireImport?: boolean;
   /**
    * `custom`: the step draws its own continue button (for example in the footer of a `ui-detail-card`), so the wizard does not show its own. The step's
    * template receives the wizard as `let-wizard` and calls `wizard.saveAndContinue()` (runs `save`, then moves on) and reads `wizard.busy()`.
@@ -11343,6 +11454,18 @@ export declare class SetupWizardComponent {
   private readonly http;
   private readonly apiBase;
   private readonly destroyRef;
+  /** Phone layout: the step's Back / Skip / Continue buttons fill the width and stack (primary on top). */
+  protected readonly narrow: import("@angular/core").WritableSignal<boolean>;
+  /** A step with `splitLayout`: the app's own content gets its own card, side by side with the step card on a wide screen. */
+  /** An import step with `requireImport` keeps Continue off until something came in (a CSV import or `markCompleted`, e.g. a live sync). */
+  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<"main" | "extra">;
+  protected readonly splitTabs: import("@angular/core").Signal<{
+    key: string;
+    label: string;
+  }[]>;
+  protected readonly split: import("@angular/core").Signal<boolean>;
   /** The steps in walking order. A `done` summary step is appended automatically. */
   readonly steps: import("@angular/core").InputSignal<SetupStep[]>;
   /** Replaces any of the built-in texts. */
@@ -11355,12 +11478,15 @@ export declare class SetupWizardComponent {
   readonly stepChange: import("@angular/core").OutputEmitterRef<string>;
   protected readonly stepTemplates: import("@angular/core").Signal<readonly SetupWizardStepDirective[]>;
   protected readonly headerTemplates: import("@angular/core").Signal<readonly SetupWizardStepHeaderDirective[]>;
+  private readonly injector;
+  private readonly stepTitle;
   protected readonly importers: import("@angular/core").Signal<readonly ImportExportComponent[]>;
   protected readonly t: import("@angular/core").Signal<SetupWizardTexts>;
   protected readonly currentKey: import("@angular/core").WritableSignal<string>;
   private readonly completed;
   private readonly skipped;
   private readonly imports;
+  private readonly importErrors;
   private readonly statuses;
   readonly busy: import("@angular/core").WritableSignal<boolean>;
   /** What a custom step's template receives (`let-wizard`). */
@@ -11408,6 +11534,7 @@ export declare class SetupWizardComponent {
   protected openImport(key: string): void;
   protected onImported(key: string): void;
   protected importResult(key: string): number | null;
+  protected importErrorCount(key: string): number;
   protected clearImport(key: string): void;
   protected importTitle(key: string): string;
   protected continueFromImport(): void;
@@ -11416,6 +11543,7 @@ export declare class SetupWizardComponent {
   protected isConnected(i: SetupIntegration): boolean;
   protected detailFor(i: SetupIntegration): string;
   protected connect(i: SetupIntegration): void;
+  private startConnect;
   /** SVG path of a library icon (the buttons' leading / trailing glyph). */
   protected iconD(name: string): string;
   protected areaCodeLabelFor(i: SetupIntegration): string;
@@ -11492,6 +11620,8 @@ export interface EmailTemplateVariable {
   key: string;
   label: string;
   example: string;
+  /** Optional one-line explanation of what the variable is filled with; shown under the example. */
+  description?: string;
 }
 export interface EmailTemplateVariableGroup {
   name: string;