@openmfp/ngx 0.12.13 → 0.13.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openmfp/ngx",
-  "version": "0.12.13",
+  "version": "0.13.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/openmfp/webcomponents.git"

package/types/openmfp-ngx.d.ts

@@ -3,8 +3,8 @@ import { OnInit, OnDestroy, Type } from '@angular/core';
 import { FormGroup, FormControl } from '@angular/forms';
 import * as _openmfp_ngx from '@openmfp/ngx';
 import { Input } from '@fundamental-ngx/ui5-webcomponents/input';
-import { Breakpoint, GridStackOptions } from 'gridstack';
 import { SafeHtml } from '@angular/platform-browser';
+import { GridStackOptions } from 'gridstack';
 import { nodesCB } from 'gridstack/dist/angular';
 
 /** Subset of fields of a generic resource that the table/form components rely on. */
@@ -345,6 +345,40 @@ declare class DeclarativeTableCard<T extends GenericResource> {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<DeclarativeTableCard<any>, "mfp-declarative-table-card", never, { "resources": { "alias": "resources"; "required": true; "isSignal": true; }; "config": { "alias": "config"; "required": true; "isSignal": true; }; "createFormState": { "alias": "createFormState"; "required": false; "isSignal": true; }; "editFormState": { "alias": "editFormState"; "required": false; "isSignal": true; }; }, { "actionButtonClick": "actionButtonClick"; "tableRowClicked": "tableRowClicked"; "loadMoreResources": "loadMoreResources"; "paginationLimitChanged": "paginationLimitChanged"; "searchChanged": "searchChanged"; "createFieldChange": "createFieldChange"; "editFieldChange": "editFieldChange"; "createSubmit": "createSubmit"; "editSubmit": "editSubmit"; "deleteSubmit": "deleteSubmit"; }, never, never, true, never>;
 }
 
+type DashboardLanguage = 'en' | 'de';
+declare const DASHBOARD_I18N_KEYS: {
+    readonly UNSAVED_CHANGES: "unsavedChanges";
+    readonly EDIT_CARDS: "editCards";
+    readonly EDIT_VIEW: "editView";
+    readonly ACTIONS: "actions";
+    readonly SAVE: "save";
+    readonly CANCEL: "cancel";
+    readonly DISCARD: "discard";
+    readonly DISCARD_CHANGES: "discardChanges";
+    readonly DISCARD_CONFIRM_BODY: "discardConfirmBody";
+    readonly UNSAVED_NAV_BODY: "unsavedNavBody";
+    readonly NO_CARDS_AVAILABLE: "noCardsAvailable";
+    readonly REMOVE_SECTION: "removeSection";
+    readonly REMOVE_CARD: "removeCard";
+    readonly RESIZABLE: "resizable";
+};
+type DashboardI18nKey = (typeof DASHBOARD_I18N_KEYS)[keyof typeof DASHBOARD_I18N_KEYS];
+
+/**
+ * Holds the dashboard's current language and resolves translation keys for
+ * the dashboard chrome (toolbar buttons, dialogs, a11y labels). Provided at
+ * the `Dashboard` component level so every nested dashboard component shares
+ * the same language signal — child components inject the same instance and
+ * react to language changes automatically because `getTranslation` reads the
+ * signal on every call.
+ */
+declare class DashboardI18nService {
+    readonly language: _angular_core.WritableSignal<DashboardLanguage>;
+    getTranslation(key: DashboardI18nKey): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DashboardI18nService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<DashboardI18nService>;
+}
+
 declare const CARD_TYPES: {
     readonly WC: "wc";
     readonly ANGULAR: "angular";
@@ -426,22 +460,13 @@ interface DashboardConfig {
     editButtonFirst?: boolean;
 }
 
-/**
- * Layout strategy applied at each breakpoint when Gridstack changes column
- * count. See ColumnOptions in gridstack/dist/types.d.ts:27 for the full set.
- */
-type LayoutStrategy = 'compact' | 'list' | 'none';
-/** Single source of truth for grid + section breakpoints (TypeScript half). */
-declare const DASHBOARD_BREAKPOINTS: ReadonlyArray<Readonly<Required<Pick<Breakpoint, 'w' | 'c'>> & {
-    layout: LayoutStrategy;
-}>>;
-
 declare class Dashboard implements OnInit, OnDestroy {
     static registerAngularComponents(componentTypes: Type<unknown>[]): void;
     config: _angular_core.InputSignal<DashboardConfig>;
     sections: _angular_core.ModelSignal<SectionConfig[]>;
     cards: _angular_core.ModelSignal<CardConfig[]>;
     availableCards: _angular_core.InputSignal<CardConfig[]>;
+    language: _angular_core.InputSignal<DashboardLanguage>;
     readonly saved: _angular_core.OutputEmitterRef<{
         sections: SectionConfig[];
         cards: CardConfig[];
@@ -473,6 +498,23 @@ declare class Dashboard implements OnInit, OnDestroy {
     private readonly hostEl;
     private readonly injector;
     private readonly sanitizer;
+    protected readonly i18n: DashboardI18nService;
+    protected readonly i18nKeys: {
+        readonly UNSAVED_CHANGES: "unsavedChanges";
+        readonly EDIT_CARDS: "editCards";
+        readonly EDIT_VIEW: "editView";
+        readonly ACTIONS: "actions";
+        readonly SAVE: "save";
+        readonly CANCEL: "cancel";
+        readonly DISCARD: "discard";
+        readonly DISCARD_CHANGES: "discardChanges";
+        readonly DISCARD_CONFIRM_BODY: "discardConfirmBody";
+        readonly UNSAVED_NAV_BODY: "unsavedNavBody";
+        readonly NO_CARDS_AVAILABLE: "noCardsAvailable";
+        readonly REMOVE_SECTION: "removeSection";
+        readonly REMOVE_CARD: "removeCard";
+        readonly RESIZABLE: "resizable";
+    };
     protected safeTitle: _angular_core.Signal<SafeHtml>;
     protected safeDescription: _angular_core.Signal<SafeHtml | null>;
     protected gridOptions: _angular_core.Signal<GridStackOptions>;
@@ -572,98 +614,7 @@ declare class Dashboard implements OnInit, OnDestroy {
     onGridChange(event: nodesCB): void;
     private saveCardsPosition;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<Dashboard, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<Dashboard, "mfp-dashboard", never, { "config": { "alias": "config"; "required": true; "isSignal": true; }; "sections": { "alias": "sections"; "required": false; "isSignal": true; }; "cards": { "alias": "cards"; "required": false; "isSignal": true; }; "availableCards": { "alias": "availableCards"; "required": false; "isSignal": true; }; }, { "sections": "sectionsChange"; "cards": "cardsChange"; "saved": "saved"; "actionButtonClick": "actionButtonClick"; "unsavedChangesChange": "unsavedChangesChange"; }, never, ["[slot=dashboard-subheader]"], true, never>;
-}
-
-declare class EditCardsDialog {
-    private readonly host;
-    availableCards: _angular_core.InputSignal<CardConfig[]>;
-    addedCardsIds: _angular_core.InputSignal<Set<string>>;
-    open: _angular_core.InputSignal<boolean>;
-    readonly confirm: _angular_core.OutputEmitterRef<{
-        added: CardConfig[];
-        removed: string[];
-    }>;
-    readonly cancelled: _angular_core.OutputEmitterRef<void>;
-    selectedIds: _angular_core.WritableSignal<Set<string>>;
-    constructor();
-    toggle(id: string): void;
-    /**
-     * Tab moves focus across the switches directly, skipping the wrapping
-     * ui5-li-custom rows. Past the last switch Tab goes to the first footer
-     * button; before the first switch Shift+Tab goes to the last footer button.
-     * The dialog's native focus trap takes care of cycling from the buttons
-     * back into the list.
-     */
-    onSwitchKeydown(event: KeyboardEvent, _id: string): void;
-    confirmSave(): void;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EditCardsDialog, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EditCardsDialog, "mfp-edit-cards-dialog", never, { "availableCards": { "alias": "availableCards"; "required": false; "isSignal": true; }; "addedCardsIds": { "alias": "addedCardsIds"; "required": false; "isSignal": true; }; "open": { "alias": "open"; "required": false; "isSignal": true; }; }, { "confirm": "confirm"; "cancelled": "cancelled"; }, never, never, true, never>;
-}
-
-/**
- * Confirmation popup shown when the user tries to abandon edit mode while
- * there are unsaved dashboard changes. Emits `confirm` when the user accepts
- * the discard, `cancelled` when they back out.
- */
-declare class DiscardChangesDialog {
-    open: _angular_core.InputSignal<boolean>;
-    readonly confirm: _angular_core.OutputEmitterRef<void>;
-    readonly cancelled: _angular_core.OutputEmitterRef<void>;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DiscardChangesDialog, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DiscardChangesDialog, "mfp-discard-changes-dialog", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; }, { "confirm": "confirm"; "cancelled": "cancelled"; }, never, never, true, never>;
-}
-
-/**
- * Confirmation popup shown when the user attempts to navigate away from the
- * dashboard while there are unsaved edit-mode changes. The host (the
- * dashboard, an Angular CanDeactivate guard, a Luigi navigation listener,
- * etc.) is responsible for routing its intercepted navigation through this
- * dialog and acting on the emitted decision:
- *  - `save`      → persist changes, then proceed with navigation
- *  - `discard`   → revert changes, then proceed with navigation
- *  - `cancelled` → abort navigation, stay on the page
- */
-declare class UnsavedChangesDialog {
-    open: _angular_core.InputSignal<boolean>;
-    readonly save: _angular_core.OutputEmitterRef<void>;
-    readonly discard: _angular_core.OutputEmitterRef<void>;
-    readonly cancelled: _angular_core.OutputEmitterRef<void>;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<UnsavedChangesDialog, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<UnsavedChangesDialog, "mfp-unsaved-changes-dialog", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; }, { "save": "save"; "discard": "discard"; "cancelled": "cancelled"; }, never, never, true, never>;
-}
-
-declare class DashboardCard {
-    card: _angular_core.InputSignal<CardConfig>;
-    editMode: _angular_core.InputSignal<boolean>;
-    readonly removeCard: _angular_core.OutputEmitterRef<void>;
-    protected readonly gridColumn: _angular_core.Signal<string>;
-    protected readonly gridRow: _angular_core.Signal<string>;
-    private host;
-    private renderer;
-    constructor();
-    private createGridTrack;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DashboardCard, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DashboardCard, "mfp-dashboard-card", never, { "card": { "alias": "card"; "required": true; "isSignal": true; }; "editMode": { "alias": "editMode"; "required": false; "isSignal": true; }; }, { "removeCard": "removeCard"; }, never, ["*"], true, never>;
-}
-
-declare class DashboardSection {
-    section: _angular_core.InputSignal<SectionConfig>;
-    cards: _angular_core.InputSignal<CardConfig[]>;
-    /**
-     * Optional override for the section's inner grid column count. Leave unset
-     * (the default) to inherit the responsive defaults from CSS — the section
-     * grid then mirrors the dashboard breakpoints (4/8/12/14 columns) via the
-     * `mfp-dashboard` container query in dashboard-section.component.scss.
-     * Pass an explicit number only when a section needs a fixed column count
-     * regardless of width.
-     */
-    columns: _angular_core.InputSignal<number | undefined>;
-    editMode: _angular_core.InputSignal<boolean>;
-    readonly removeSection: _angular_core.OutputEmitterRef<void>;
-    readonly removeCard: _angular_core.OutputEmitterRef<string>;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DashboardSection, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DashboardSection, "mfp-dashboard-section", never, { "section": { "alias": "section"; "required": true; "isSignal": true; }; "cards": { "alias": "cards"; "required": false; "isSignal": true; }; "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "editMode": { "alias": "editMode"; "required": false; "isSignal": true; }; }, { "removeSection": "removeSection"; "removeCard": "removeCard"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<Dashboard, "mfp-dashboard", never, { "config": { "alias": "config"; "required": true; "isSignal": true; }; "sections": { "alias": "sections"; "required": false; "isSignal": true; }; "cards": { "alias": "cards"; "required": false; "isSignal": true; }; "availableCards": { "alias": "availableCards"; "required": false; "isSignal": true; }; "language": { "alias": "language"; "required": false; "isSignal": true; }; }, { "sections": "sectionsChange"; "cards": "cardsChange"; "saved": "saved"; "actionButtonClick": "actionButtonClick"; "unsavedChangesChange": "unsavedChangesChange"; }, never, ["[slot=dashboard-subheader]"], true, never>;
 }
 
 declare class ResourceField<T extends GenericResource, F extends FieldDefinition> {
@@ -1305,5 +1256,5 @@ declare class WhatsNew {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<WhatsNew, "mfp-whats-new", never, {}, {}, never, never, true, never>;
 }
 
-export { BooleanValue, CARD_TYPES, DASHBOARD_BREAKPOINTS, Dashboard, DashboardCard, DashboardSection, DeclarativeForm, DeclarativeTable, DeclarativeTableCard, DiscardChangesDialog, EditCardsDialog, Favorites, LinkValue, ResourceField, SecretValue, ServiceStatusCard, TagListValue, UnsavedChangesDialog, VisitedServiceCard, WhatsNew };
+export { BooleanValue, CARD_TYPES, Dashboard, DeclarativeForm, DeclarativeTable, DeclarativeTableCard, Favorites, LinkValue, ResourceField, SecretValue, ServiceStatusCard, TagListValue, VisitedServiceCard, WhatsNew };
 export type { ButtonSettings, CardConfig, CardsType, CssRule, CssRuleCondition, DashboardButtonsSettings, DashboardConfig, DeleteResourceConfirmationConfig, FieldDefinition, FormFieldChangeEvent, FormFieldDefinition, FormFieldErrors, GenericResource, IconDesignType, ModalSettings, PropertyField, ResourceFieldButtonClickEvent, ResourceFormConfig, SectionConfig, ServiceStatusItem, ServiceStatusValue, TableCardButtonSettings, TableCardConfig, TableCardFormState, TableConfig, TableFieldDefinition, TransformType, UiSettings };