@msbci/form-editor 1.0.2 → 1.2.0

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ComponentType } from 'react';
-import { IFormDefinition, IFormPage, IFormRoster, IFormVariable, IFormType, IDataSourceConnector, IConditionRule } from '@msbci/form-core';
+import { ReactNode, ComponentType } from 'react';
+import { IFormDefinition, IFormPage, IFormRoster, IFormVariable, IFormType, IDataSourceConnector, IConditionRule, IRosterVariableRef } from '@msbci/form-core';
 export { IDataSourceConnector, IFormDefinition, IFormPage, IFormRoster, IFormVariable, IMosobiThemeBase } from '@msbci/form-core';
 import * as zustand from 'zustand';
 
@@ -56,7 +56,7 @@ interface EditorState {
 /** Editor actions */
 interface EditorActions {
     setForm: (form: IFormDefinition) => void;
-    updateFormMeta: (updates: Partial<Pick<IFormDefinition, 'name' | 'code' | 'description' | 'formTypeId' | 'version'>>) => void;
+    updateFormMeta: (updates: Partial<Pick<IFormDefinition, 'name' | 'code' | 'description' | 'formTypeId' | 'version' | 'langConfig'>>) => void;
     addPage: (page: IFormPage) => void;
     updatePage: (pageCode: string, updates: Partial<IFormPage>) => void;
     removePage: (pageCode: string) => void;
@@ -86,6 +86,278 @@ interface EditorActions {
 }
 type EditorStore = EditorState & EditorActions;
 
+/**
+ * IEditorLabels — full label dictionary for the FormEditor UI.
+ *
+ * Pattern A (zero external dependency): consumers pass a `labels` prop to
+ * FormEditor and the values flow through React context to every sub-component.
+ * French is the absolute default; English ships out of the box; any other
+ * language can be added by providing a (deep-)partial override.
+ *
+ * Functions in this interface format strings with runtime arguments (counts,
+ * names, indices). They are *replaced wholesale* by deepMerge, not merged.
+ */
+type DeepPartial<T> = T extends (...args: never[]) => unknown ? T : T extends object ? {
+    [K in keyof T]?: DeepPartial<T[K]>;
+} : T;
+interface IEditorLabels {
+    toolbar: {
+        formNamePlaceholder: string;
+        unsaved: string;
+        addPage: string;
+        types: string;
+        manageFormTypesTitle: string;
+        undo: string;
+        redo: string;
+        save: string;
+        saving: string;
+        export: string;
+        import: string;
+        viewEditor: string;
+        viewPreview: string;
+        viewJson: string;
+    };
+    toolbox: {
+        searchPlaceholder: string;
+        addPageFirst: string;
+        groupText: string;
+        groupSelection: string;
+        groupDateTime: string;
+        groupMedia: string;
+        groupAdvanced: string;
+        /**
+         * Shared variable-type labels. Re-used by both Toolbox(Simple) and
+         * VariableProperties (single source of truth).
+         */
+        types: {
+            text: string;
+            textarea: string;
+            number: string;
+            email: string;
+            select: string;
+            multiselect: string;
+            radio: string;
+            checkbox: string;
+            date: string;
+            datetime: string;
+            time: string;
+            file: string;
+            image: string;
+            gps: string;
+            rating: string;
+            calculated: string;
+            hidden: string;
+            label: string;
+        };
+    };
+    canvas: {
+        /** CanvasSimple — no page in form. */
+        emptyStateNoPage: string;
+        /** Canvas (dnd) — no page in form. */
+        emptyStateNoPageDnd: string;
+        /** Empty page — invites to add a field. */
+        emptyStatePage: string;
+        /** Fallback when page.name is blank. */
+        unnamedPage: string;
+        /** Badge on repeatable pages. */
+        repeatable: string;
+        /** "X fields · Y rosters" — count helper for the page header. */
+        fieldsRostersCount: (fields: number, rosters: number) => string;
+        /** "X fields" — count helper for the Canvas (dnd) page header. */
+        fieldsCount: (fields: number) => string;
+        /** "X vars" — count helper for the roster header. */
+        rosterVarsCount: (vars: number) => string;
+        /** Button: add a roster to the current page. */
+        addRoster: string;
+        /** Button: add a variable inside a roster. */
+        addFieldToRoster: string;
+        /** Prefix shown before the pilot variable code on a roster header. */
+        pilotPrefix: string;
+        /** Default name when auto-creating a roster. */
+        newRosterName: string;
+        /** Default name when auto-creating a roster variable. */
+        newFieldName: string;
+        /** Default name when auto-creating a toolbox-spawned variable.
+         *  Receives the type label (e.g. "Texte court") and returns the full name. */
+        newVariableName: (typeLabel: string) => string;
+        /** Tooltip on the "has conditions" indicator. */
+        hasConditionsTitle: string;
+        /** Tooltip on the "data source connected" indicator. */
+        dataSourceConnectedTitle: string;
+    };
+    properties: {
+        /** Header of the right-hand properties panel. */
+        title: string;
+        name: string;
+        code: string;
+        description: string;
+        placeholder: string;
+        version: string;
+        formType: string;
+        noType: string;
+        formSummary: (pages: number, variables: number) => string;
+        pageSummary: (variables: number, rosters: number) => string;
+        rosterSummary: (variables: number, options: number) => string;
+        repeatablePage: string;
+        minInstances: string;
+        maxInstances: string;
+        controlVariableCode: string;
+        instanceLabel: string;
+        rosterType: string;
+        pilotVariableCode: string;
+        rosterTypes: {
+            check: string;
+            list: string;
+            collection: string;
+            collection_extend: string;
+        };
+        type: string;
+        ratingStyle: string;
+        ratingStyles: {
+            star: string;
+            number: string;
+            color: string;
+        };
+        layout: string;
+        startNewRow: string;
+        columnSpan: string;
+        columnSpanAuto: string;
+        columnSpanHalf: string;
+        columnSpanThird: string;
+        columnSpanFull: string;
+        required: string;
+        readonly: string;
+        hidden: string;
+        expression: string;
+        langConfigSection: string;
+        langConfigAvailable: string;
+        langConfigDefault: string;
+        langConfigStrategy: string;
+        langConfigStrategies: {
+            prop: string;
+            browser: string;
+            selector: string;
+            auto: string;
+        };
+        langConfigSelectorPosition: string;
+        langConfigPositions: {
+            top: string;
+            bottom: string;
+        };
+        langConfigConfirmRemove: (lang: string) => string;
+        langConfigConfirmYes: string;
+        langConfigConfirmNo: string;
+    };
+    optionsEditor: {
+        optionsCount: (count: number) => string;
+        noOptions: string;
+        optionLabelPlaceholder: string;
+        optionValuePlaceholder: string;
+        addOption: string;
+        optionLabelAria: (index: number) => string;
+        optionValueAria: (index: number) => string;
+        removeOptionAria: (index: number) => string;
+    };
+    conditionBuilder: {
+        conditionsCount: (count: number) => string;
+        addCondition: string;
+        rulesCount: (rules: number) => string;
+        addRule: string;
+        action: string;
+        match: string;
+        all: string;
+        any: string;
+        actions: {
+            show: string;
+            hide: string;
+            validate: string;
+            require: string;
+            readonly: string;
+            setValue: string;
+        };
+        operators: {
+            equals: string;
+            not_equals: string;
+            greater_than: string;
+            less_than: string;
+            greater_than_or_equal: string;
+            less_than_or_equal: string;
+            contains: string;
+            not_contains: string;
+            is_empty: string;
+            is_not_empty: string;
+            starts_with: string;
+            ends_with: string;
+            in: string;
+            not_in: string;
+            between: string;
+            regex: string;
+        };
+        variablePlaceholder: string;
+        valuePlaceholder: string;
+        errorMessage: string;
+        errorMessagePlaceholder: string;
+        targetVariableCode: string;
+        targetVariablePlaceholder: string;
+        valueToSet: string;
+        valueToSetPlaceholder: string;
+    };
+    dataSource: {
+        title: string;
+        connector: string;
+        none: string;
+        connectedTo: string;
+        dependencies: (count: number) => string;
+        selectVariable: string;
+        dependencyKeyPlaceholder: string;
+        addDependency: string;
+    };
+    formTypesDialog: {
+        dialogAriaLabel: string;
+        title: string;
+        closeAriaLabel: string;
+        noTypes: string;
+        confirmDelete: string;
+        deleteConfirm: string;
+        deleteCancel: string;
+        removeTypeAria: (name: string) => string;
+        newTypeNamePlaceholder: string;
+        newTypeCodePlaceholder: string;
+        addButton: string;
+    };
+    formEditor: {
+        previewMissing: string;
+    };
+}
+
+/**
+ * French labels for FormEditor — absolute default.
+ *
+ * Any consumer that does not pass a `labels` prop will see this content.
+ */
+
+declare const frLabels: IEditorLabels;
+
+/**
+ * English labels for FormEditor — opt-in via `labels` prop.
+ */
+
+declare const enLabels: IEditorLabels;
+
+interface EditorLabelsProviderProps {
+    labels: IEditorLabels;
+    children: ReactNode;
+}
+declare function EditorLabelsProvider({ labels, children, }: EditorLabelsProviderProps): react_jsx_runtime.JSX.Element;
+/** Read the resolved labels. Defaults to French if no provider is mounted. */
+declare function useLabels(): IEditorLabels;
+/**
+ * Recursively merges `override` into `base`. Functions, arrays and primitives
+ * are replaced wholesale. Plain objects are merged key-by-key so a partial
+ * override never erases sibling keys.
+ */
+declare function mergeLabels(base: IEditorLabels, override?: DeepPartial<IEditorLabels>): IEditorLabels;
+
 interface FormEditorProps {
     theme?: Record<string, unknown>;
     dataSources?: Record<string, IDataSourceConnector>;
@@ -94,6 +366,12 @@ interface FormEditorProps {
     formId?: string;
     onChange?: (form: IFormDefinition) => void;
     onSave?: () => void;
+    /**
+     * Localised labels for every visible string in the editor.
+     * Deep-merged with the French defaults — pass only the keys you want to
+     * override. Use {@link import('../i18n').enLabels} for English out of the box.
+     */
+    labels?: DeepPartial<IEditorLabels>;
     PreviewComponent?: ComponentType<{
         formSchema: IFormDefinition;
         theme?: Record<string, unknown>;
@@ -107,7 +385,7 @@ interface FormEditorProps {
     /** Wrapper around the entire editor (e.g. DndContext) */
     Wrapper?: ComponentType<any>;
 }
-declare function FormEditor({ theme, dataSources, adapter, initialForm, formId, onChange, onSave, PreviewComponent, ToolboxComponent, CanvasComponent, Wrapper, }: FormEditorProps): react_jsx_runtime.JSX.Element;
+declare function FormEditor({ theme, dataSources, adapter, initialForm, formId, onChange, onSave, labels, PreviewComponent, ToolboxComponent, CanvasComponent, Wrapper, }: FormEditorProps): react_jsx_runtime.JSX.Element;
 
 declare const useEditorStore: zustand.UseBoundStore<zustand.StoreApi<EditorStore>>;
 
@@ -138,6 +416,14 @@ interface PropertiesPanelProps {
 }
 declare function PropertiesPanel({ availableConnectors }: PropertiesPanelProps): react_jsx_runtime.JSX.Element;
 
+interface RosterConditionContext {
+    /** Variables that belong to the same roster row (scope-restricted). */
+    variables: IRosterVariableRef[];
+    /** Code of the variable whose conditions are being edited. */
+    currentVariableCode: string;
+    /** Order of the variable whose conditions are being edited. */
+    currentVariableOrder: number;
+}
 interface ConditionBuilderProps {
     conditions: IConditionRule[];
     onChange: (conditions: IConditionRule[]) => void;
@@ -146,8 +432,13 @@ interface ConditionBuilderProps {
         code: string;
         name: string;
     }>;
+    /**
+     * When set, conditions are validated against the roster scope using
+     * RosterConditionEngine. Scope errors are displayed under each rule.
+     */
+    rosterContext?: RosterConditionContext;
 }
-declare function ConditionBuilder({ conditions, onChange, availableVariables }: ConditionBuilderProps): react_jsx_runtime.JSX.Element;
+declare function ConditionBuilder({ conditions, onChange, availableVariables, rosterContext, }: ConditionBuilderProps): react_jsx_runtime.JSX.Element;
 
 interface DataSourceSelectorProps {
     /** Currently selected connector ID */
@@ -168,4 +459,4 @@ interface DataSourceSelectorProps {
 }
 declare function DataSourceSelector({ dataSourceId, dependencies, availableConnectors, availableVariables, onConnectorChange, onDependenciesChange, }: DataSourceSelectorProps): react_jsx_runtime.JSX.Element;
 
-export { CanvasSimple as Canvas, ConditionBuilder, type ConditionBuilderProps, DataSourceSelector, type DataSourceSelectorProps, type EditorActions, type EditorSelection, type EditorState, type EditorStore, EditorToolbar, type EditorView, FormEditor, type FormEditorProps, type HistoryEntry, type IEditorAdapter, PropertiesPanel, ToolboxSimple as Toolbox, useEditorStore };
+export { CanvasSimple as Canvas, ConditionBuilder, type ConditionBuilderProps, DataSourceSelector, type DataSourceSelectorProps, type DeepPartial, type EditorActions, EditorLabelsProvider, type EditorSelection, type EditorState, type EditorStore, EditorToolbar, type EditorView, FormEditor, type FormEditorProps, type HistoryEntry, type IEditorAdapter, type IEditorLabels, PropertiesPanel, ToolboxSimple as Toolbox, frLabels as defaultLabels, enLabels, frLabels, mergeLabels, useEditorStore, useLabels };