@forgeroute/ui 0.4.32 → 0.4.34

package/package.json

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

package/types/forgeroute-ui.d.ts

@@ -2571,6 +2571,8 @@ export declare class SkeletonComponent {
 /**
  * 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.
+ * Only one tooltip is open at a time anywhere on the page: opening one closes the previous (e.g. a tooltip on a container and on a control inside
+ * it never both show; the innermost one the pointer entered last wins).
  * The bubble is rendered on `document.body` (position: fixed) so table/panel overflow never clips it.
  */
 export declare class TooltipDirective {
@@ -3941,10 +3943,36 @@ export declare class ButtonComponent {
     };
   }, {}, never, ["*"], true, never>;
 }
+/** A small icon button shown inside a toggle badge, after the label (e.g. Configure, Analytics). */
+export interface ToggleBadgeAction {
+  /** Emitted by `(action)` when the button is clicked. */
+  id: string;
+  /** Accessible name of the button (also used as the tooltip when `tooltip` is empty). */
+  label: string;
+  /** SVG path data (`d`) of a 24x24 stroked icon. Several shapes can be joined in one string (`M..M..`). */
+  icon: string;
+  /** Text of the hover / focus tooltip. */
+  tooltip?: string;
+  disabled?: boolean;
+}
+/**
+ * Pill that toggles on / off. Optional `actions` put small icon buttons INSIDE the pill, after the label and a divider, each with its own
+ * tooltip; the label button and the icon buttons are separate buttons (never nested). Clicking an icon button emits `(action)` with its id and
+ * never `(toggle)`. Content projected into the component (an icon) goes before the label, as before.
+ */
 export declare class ToggleBadgeComponent {
   readonly label: import("@angular/core").InputSignal<string>;
   readonly active: import("@angular/core").InputSignal<boolean>;
+  /** Icon buttons shown inside the pill after the label. Empty (default) = a plain pill, exactly as before. */
+  readonly actions: import("@angular/core").InputSignal<ToggleBadgeAction[]>;
+  /**
+   * Hover / focus tooltip of the LABEL button only. Use this instead of `uiTooltip` on `<ui-toggle-badge>` when the badge has `actions`:
+   * a tooltip on the host would also open while the pointer is over an icon button and stack on top of that icon's own tooltip.
+   */
+  readonly tooltip: import("@angular/core").InputSignal<string>;
   readonly toggle: import("@angular/core").OutputEmitterRef<void>;
+  /** An icon button was clicked: its `id`. Never emits `toggle`. */
+  readonly action: import("@angular/core").OutputEmitterRef<string>;
   static ɵfac: i0.ɵɵFactoryDeclaration<ToggleBadgeComponent, never>;
   static ɵcmp: i0.ɵɵComponentDeclaration<ToggleBadgeComponent, "ui-toggle-badge", never, {
     "label": {
@@ -3957,8 +3985,19 @@ export declare class ToggleBadgeComponent {
       "required": false;
       "isSignal": true;
     };
+    "actions": {
+      "alias": "actions";
+      "required": false;
+      "isSignal": true;
+    };
+    "tooltip": {
+      "alias": "tooltip";
+      "required": false;
+      "isSignal": true;
+    };
   }, {
     "toggle": "toggle";
+    "action": "action";
   }, never, ["*"], true, never>;
 }
 export interface PillTab {
@@ -7436,7 +7475,7 @@ export declare class AlertComponent {
 /** 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' | 'lock' | 'shield' | 'arrow-up' | 'arrow-down' | 'arrow-right' | 'document' | 'grip' | 'card' | 'bank' | 'view' | 'view-off' | 'edit' | 'delete' | 'download' | 'duplicate' | 'archive' | 'restore' | 'share' | 'email' | 'message' | 'call' | 'refund' | 'chevron-right' | 'link' | 'save' | 'chart' | 'clipboard';
+export type IconName = 'add' | 'close' | 'check' | 'upload' | 'image' | 'chevron-up' | 'chevron-down' | 'arrow-left' | 'bell' | 'print' | 'lock' | 'shield' | 'arrow-up' | 'arrow-down' | 'arrow-right' | 'document' | 'grip' | 'card' | 'bank' | 'view' | 'view-off' | 'edit' | 'delete' | 'download' | 'duplicate' | 'archive' | 'restore' | 'share' | 'email' | 'message' | 'call' | 'refund' | 'chevron-right' | 'link' | 'save' | 'chart' | 'clipboard' | 'unlink' | 'send' | 'refresh';
 /**
  * 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, …).
@@ -11115,8 +11154,12 @@ export interface SetupIntegration {
   title: string;
   /** Shown while the integration is not connected. */
   description: string;
-  /** Library `ui-list-item` icon name (default 'link'). */
+  /** Library icon name drawn in the tile when there is no `letter` (default 'link'). */
   icon?: string;
+  /** One letter shown in the coloured tile (like the source cards of an import step); takes the place of `icon`. */
+  letter?: string;
+  /** Background of the tile (any CSS colour; default slate). */
+  color?: string;
   /** GET answering `{ connected: boolean, ... }` (relative to the API base URL of `FORGEROUTE_CONFIG`). */
   statusEndpoint: string;
   /** When one status endpoint answers several providers (`{ gmail: {...}, outlook: {...} }`), the property that belongs to this one. */
@@ -11179,7 +11222,7 @@ export interface SetupStep {
   cardTitle?: string;
   /** The paragraph under the heading. */
   description?: string;
-  /** `custom` shows the app's own `<ng-template uiSetupStep="key">`; `import` and `integrations` are built in. */
+  /** `custom` shows the app's own `<ng-template uiSetupStep="key">`; `import` and `integrations` are built in (an app template with the step's key is shown above the built-in content). */
   kind: 'custom' | 'import' | 'integrations';
   /** Shows "Skip for now" (default true). The first step of a wizard usually sets this to false. */
   skippable?: boolean;
@@ -11208,6 +11251,8 @@ export interface SetupWizardApi {
   saveAndContinue(): Promise<void>;
   /** True while a save is running. */
   readonly busy: () => boolean;
+  /** Marks steps as done (check mark, counted in the progress) without the user visiting them; unknown keys are ignored. For example a live sync that already brought in the data of later steps. */
+  markCompleted(...keys: string[]): void;
 }
 /**
  * The integrations every app can offer in a setup step. The endpoints follow the convention the apps' backends already use (`GET <x>/status`,
@@ -11224,6 +11269,8 @@ export declare function setupIntegrations(...keys: (keyof typeof SETUP_INTEGRATI
  *     <ng-template uiSetupStep="profile"> …the app's own form… </ng-template>
  *   </ui-setup-wizard>
  *
+ * An `import` or `integrations` step with a template of its key shows it ABOVE the built-in content (for example a "connect your CRM" panel above the source cards).
+ *
  * A step with `ownActions: true` draws its own continue button: `<ng-template uiSetupStep="profile" let-wizard>` … `(click)="wizard.saveAndContinue()"`.
  */
 export declare class SetupWizardStepDirective {
@@ -11346,6 +11393,8 @@ export declare class SetupWizardComponent {
   private advanceFrom;
   protected back(): void;
   protected skip(): void;
+  /** Marks the given steps done (ignoring keys that are not steps of this wizard). */
+  private markStepsCompleted;
   private markCompleted;
   /** "Save & Continue" of a custom or integrations step: runs the step's hook, then moves on. */
   saveAndContinue(): Promise<void>;
@@ -11395,12 +11444,6 @@ export interface EmailTemplateAssignmentOption {
   name: string;
   description: string;
 }
-/** The channels a template is assigned to for one trigger. */
-export interface EmailTemplateAssignmentChannels {
-  key: string;
-  email: boolean;
-  text: boolean;
-}
 /** A template as the editor shows it. `id` is null/absent for a template that is not stored yet (new, or a copy of another). */
 export interface EmailTemplateValue {
   id?: string | null;
@@ -11416,8 +11459,8 @@ export interface EmailTemplateValue {
   body: string;
   videoId?: string | null;
   videoTitle?: string | null;
-  /** The channels per trigger; a trigger that is missing is not assigned. */
-  assignments?: EmailTemplateAssignmentChannels[];
+  /** The keys of the triggers (`EmailTemplateAssignmentOption.key`) this template is assigned to. */
+  assignments?: string[];
 }
 /** What `(save)` emits. Dates are the raw `YYYY-MM-DD` values (null while "all year" is on); the host maps them to its API. */
 export interface EmailTemplateSavePayload {
@@ -11429,8 +11472,8 @@ export interface EmailTemplateSavePayload {
   activeFrom: string | null;
   activeTo: string | null;
   videoId: string | null;
-  /** Only the triggers with at least one channel on. */
-  assignments: EmailTemplateAssignmentChannels[];
+  /** The keys of the triggers this template is assigned to. */
+  assignments: string[];
 }
 export interface EmailTemplateBlock {
   key: string;
@@ -11479,8 +11522,7 @@ interface EmailBlock {
   spacing?: string;
 }
 interface AssignmentView extends EmailTemplateAssignmentOption {
-  email: boolean;
-  text: boolean;
+  assigned: boolean;
 }
 type EditorTab = 'edit' | 'preview' | 'mobile';
 type RightTab = 'blocks' | 'variables' | 'video';
@@ -11499,7 +11541,6 @@ type RightTab = 'blocks' | 'variables' | 'video';
 export declare class EmailTemplateEditorComponent {
   private readonly host;
   private readonly injector;
-  private readonly toast;
   /** The template to edit. `null` = a blank new template. An object without `id` is a new template that starts from those values (e.g. a copy). */
   readonly template: import("@angular/core").InputSignal<EmailTemplateValue | null>;
   readonly categories: import("@angular/core").InputSignal<SelectOption<string>[]>;
@@ -11508,9 +11549,10 @@ export declare class EmailTemplateEditorComponent {
   /** The assignment shown first (e.g. the trigger the user came from). */
   readonly featuredAssignmentKey: import("@angular/core").InputSignal<string | null>;
   readonly assignmentsDescription: import("@angular/core").InputSignal<string>;
-  readonly textEnabled: import("@angular/core").InputSignal<boolean>;
   readonly variableGroups: import("@angular/core").InputSignal<EmailTemplateVariableGroup[]>;
   readonly blockGroups: import("@angular/core").InputSignal<EmailTemplateBlockGroup[]>;
+  /** Page heading shown at the start of the actions row (e.g. "Create Your Template"). Empty (default) = no heading; the buttons stay right aligned. */
+  readonly heading: import("@angular/core").InputSignal<string>;
   readonly namePlaceholder: import("@angular/core").InputSignal<string>;
   readonly subjectPlaceholder: import("@angular/core").InputSignal<string>;
   readonly systemNote: import("@angular/core").InputSignal<string>;
@@ -11555,8 +11597,8 @@ export declare class EmailTemplateEditorComponent {
   readonly activeTo: import("@angular/core").WritableSignal<string>;
   readonly videoId: import("@angular/core").WritableSignal<string | null>;
   readonly videoTitle: import("@angular/core").WritableSignal<string | null>;
-  /** The channels the template has per trigger; the rows shown are `assignmentOptions` with these applied. */
-  private readonly assignmentChannels;
+  /** The triggers this template is assigned to (an email template is only ever assigned for email); the rows shown are `assignmentOptions` with this applied. */
+  private readonly assignedKeys;
   private readonly assignmentState;
   readonly blocks: import("@angular/core").WritableSignal<EmailBlock[]>;
   readonly selectedBlockId: import("@angular/core").WritableSignal<string | null>;
@@ -11594,10 +11636,6 @@ export declare class EmailTemplateEditorComponent {
   readonly imageAlt: import("@angular/core").WritableSignal<string>;
   readonly showTestSendDialog: import("@angular/core").WritableSignal<boolean>;
   readonly testSendEmail: import("@angular/core").WritableSignal<string>;
-  readonly showAssignmentConfig: import("@angular/core").WritableSignal<boolean>;
-  readonly configTarget: import("@angular/core").WritableSignal<AssignmentView | null>;
-  readonly configEmail: import("@angular/core").WritableSignal<boolean>;
-  readonly configText: import("@angular/core").WritableSignal<boolean>;
   readonly activeEditorTab: import("@angular/core").WritableSignal<EditorTab>;
   readonly activeRightTab: import("@angular/core").WritableSignal<RightTab>;
   readonly blockSearch: import("@angular/core").WritableSignal<string>;
@@ -11726,8 +11764,8 @@ export declare class EmailTemplateEditorComponent {
   insertVideo(video: EmailTemplateVideo): void;
   formatDuration(seconds: number | null | undefined): string;
   categoryLabel(cat: string | null | undefined): string;
-  openAssignmentConfig(item: AssignmentView): void;
-  saveAssignmentConfig(): void;
+  /** Click / Enter / Space on a row: assign this template to that automation, or take it off again. */
+  toggleAssignment(item: AssignmentView): void;
   isOpen(id: string): boolean;
   toggleGroup(id: string): void;
   insertBlock(block: EmailTemplateBlock): void;
@@ -11765,11 +11803,6 @@ export declare class EmailTemplateEditorComponent {
       "required": false;
       "isSignal": true;
     };
-    "textEnabled": {
-      "alias": "textEnabled";
-      "required": false;
-      "isSignal": true;
-    };
     "variableGroups": {
       "alias": "variableGroups";
       "required": false;
@@ -11780,6 +11813,11 @@ export declare class EmailTemplateEditorComponent {
       "required": false;
       "isSignal": true;
     };
+    "heading": {
+      "alias": "heading";
+      "required": false;
+      "isSignal": true;
+    };
     "namePlaceholder": {
       "alias": "namePlaceholder";
       "required": false;