@myunisoft/design-system 1.3.1 → 1.3.2

package/dist/assets/I18n/locales/en.d.ts

@@ -35,6 +35,22 @@ declare const _default: {
         addColumn: string;
         restoreInitial: string;
     };
+    documentComposer: {
+        createSection: string;
+        deleteSection: {
+            title: string;
+            content: string;
+            cancel: string;
+            confirm: string;
+        };
+        unsavedChanges: {
+            title: string;
+            content: string;
+            saveAndQuit: string;
+            cancel: string;
+            quitWithoutSaving: string;
+        };
+    };
     dashboard: {
         ba: {
             linkTo: string;

package/dist/assets/I18n/locales/fr.d.ts

@@ -35,6 +35,22 @@ declare const _default: {
         addColumn: string;
         restoreInitial: string;
     };
+    documentComposer: {
+        createSection: string;
+        deleteSection: {
+            title: string;
+            content: string;
+            cancel: string;
+            confirm: string;
+        };
+        unsavedChanges: {
+            title: string;
+            content: string;
+            saveAndQuit: string;
+            cancel: string;
+            quitWithoutSaving: string;
+        };
+    };
     dashboard: {
         ba: {
             linkTo: string;

package/dist/components/AnchoredPopper/index.d.ts

@@ -0,0 +1,14 @@
+import type { ReactNode, RefObject } from 'react';
+import { PopperPlacementType } from '@mui/material';
+type AnchoredPopperProps = {
+    open: boolean;
+    anchorRef: RefObject<HTMLElement | null>;
+    onClose: () => void;
+    placement?: PopperPlacementType;
+    children: ReactNode;
+    minWidth?: number | string;
+    zIndex?: number;
+    elevation?: number;
+};
+declare const AnchoredPopper: ({ open, anchorRef, onClose, placement, children, minWidth, zIndex, elevation }: AnchoredPopperProps) => import("react/jsx-runtime").JSX.Element;
+export default AnchoredPopper;

package/dist/components/DataGrid/components/toolbar/buttons/AddButton.d.ts

@@ -0,0 +1,6 @@
+type AddButtonProps = {
+    onClick: () => void;
+    disabled?: boolean;
+};
+declare const AddButton: ({ onClick, disabled }: AddButtonProps) => import("react/jsx-runtime").JSX.Element;
+export default AddButton;

package/dist/components/DataGrid/components/toolbar/buttons/ExportButton.d.ts

@@ -0,0 +1,9 @@
+import { GridExportFormat } from '@mui/x-data-grid-pro';
+type ExportButtonProps = {
+    exportAction?: {
+        onExport: (format: GridExportFormat) => void;
+        exportFormats: GridExportFormat[];
+    };
+};
+declare const ExportButton: ({ exportAction }: ExportButtonProps) => import("react/jsx-runtime").JSX.Element;
+export default ExportButton;

package/dist/components/DataGrid/types/index.d.ts

@@ -0,0 +1,428 @@
+import type { ReactNode, RefObject, ComponentType, Dispatch, SetStateAction } from 'react';
+import type { ButtonProps } from '@mui/material';
+import type { DataGridProProps, GridApiPro, GridColDef as MuiGridColDef, GridRowSelectionModel, GridValidRowModel } from '@mui/x-data-grid-pro';
+/**
+ * Extended GridColDef with custom export-related properties
+ */
+export type GridColDef<R extends GridValidRowModel = any, V = any, F = V> = MuiGridColDef<R, V, F> & {
+    /**
+     * Custom formatter function for export operations
+     * @param params - Object containing the value and row data
+     * @returns Formatted value for export
+     */
+    exportFormatter?: (params: {
+        value: V;
+        row: R;
+    }) => any;
+    /**
+     * If true, this column will be excluded from export operations
+     */
+    ignoreExport?: boolean;
+};
+/**
+ * Props for the DataGridDS component
+ * Extends MUI DataGridProProps with custom row context menu functionality
+ */
+export interface DataGridDSProps extends DataGridProProps {
+    /**
+     * Configuration for row context menu (right-click menu)
+     */
+    rowContextMenu?: RowContextMenuConfig;
+}
+/**
+ * Configuration for row context menu
+ */
+export interface RowContextMenuConfig {
+    /**
+     * Array of actions available in the context menu
+     */
+    actions: RowMenuAction[];
+    /**
+     * Optional function to determine if the menu can be opened
+     * @param selectedRows - Currently selected rows
+     * @returns true if menu can be opened, false otherwise
+     */
+    canOpen?: (selectedRows: GridValidRowModel[]) => boolean;
+}
+/**
+ * Action definition for row context menu
+ */
+export type RowMenuAction = {
+    /**
+     * Unique identifier for the action
+     */
+    key: string;
+    /**
+     * Display label for the action
+     */
+    label: string;
+    /**
+     * Callback function executed when action is clicked
+     * @param selectedRows - Array of selected row models
+     */
+    onClick: (selectedRows: GridValidRowModel[]) => void;
+    /**
+     * Whether the action is disabled
+     * Can be a boolean or a function that determines disabled state based on selected rows
+     */
+    disabled?: boolean | ((selectedRows: GridValidRowModel[]) => boolean);
+};
+/**
+ * Props for RowMenu component
+ */
+export interface RowMenuProps {
+    /**
+     * Whether the menu is currently open
+     */
+    isOpen: boolean;
+    /**
+     * Callback to close the menu
+     */
+    onClose: () => void;
+    /**
+     * X coordinate for menu positioning
+     */
+    mouseX: number;
+    /**
+     * Y coordinate for menu positioning
+     */
+    mouseY: number;
+    /**
+     * Array of actions to display in the menu
+     */
+    rowMenuActions: RowMenuAction[];
+    /**
+     * Currently selected rows
+     */
+    selectedRows: GridValidRowModel[];
+}
+/**
+ * State for row menu hook
+ */
+export interface RowMenuState {
+    /**
+     * Whether the menu is open
+     */
+    isOpen: boolean;
+    /**
+     * Mouse X coordinate
+     */
+    mouseX: number;
+    /**
+     * Mouse Y coordinate
+     */
+    mouseY: number;
+}
+/**
+ * Return type for useRowMenu hook
+ */
+export interface UseRowMenuReturn {
+    /**
+     * Current menu state
+     */
+    rowMenuState: RowMenuState;
+    /**
+     * Function to open the menu at specified coordinates
+     */
+    openRowMenu: (mouseX: number, mouseY: number) => void;
+    /**
+     * Function to close the menu
+     */
+    closeRowMenu: () => void;
+}
+/**
+ * Base configuration for toolbar buttons
+ */
+interface BaseButtonConfig {
+    /**
+     * Unique identifier for the button
+     */
+    key: ButtonKey;
+    /**
+     * Button color theme
+     */
+    color?: ButtonProps['color'];
+    /**
+     * Whether the button is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Whether the button is in loading state
+     */
+    isLoading?: boolean;
+}
+/**
+ * Configuration for text-based toolbar button
+ */
+export interface TextButtonConfig extends BaseButtonConfig {
+    type: 'text';
+    /**
+     * Button text label
+     */
+    text: string;
+    /**
+     * Click handler
+     */
+    onClick: ButtonProps['onClick'];
+}
+/**
+ * Configuration for icon-based toolbar button
+ */
+export interface IconButtonConfig extends BaseButtonConfig {
+    type: 'icon';
+    /**
+     * Icon element to display
+     */
+    icon: ReactNode;
+    /**
+     * Click handler
+     */
+    onClick: ButtonProps['onClick'];
+}
+/**
+ * Union type for all button configurations
+ */
+export type ButtonConfig = TextButtonConfig | IconButtonConfig;
+/**
+ * Type for button keys
+ */
+export type ButtonKey = string | number;
+/**
+ * Props for ArrayButtons component
+ */
+export interface ArrayButtonsProps {
+    /**
+     * Array of button configurations to render
+     */
+    buttons: ButtonConfig[];
+}
+/**
+ * Custom text button configuration with enhanced onClick signature
+ */
+export interface CustomTextButtonConfig extends Omit<TextButtonConfig, 'onClick'> {
+    /**
+     * Enhanced onClick handler that receives selected row information
+     * @param selectedRowIds - Array of selected row IDs
+     * @param selectedRows - Array of selected row models
+     */
+    onClick: (selectedRowIds: GridRowSelectionModel, selectedRows: GridValidRowModel[]) => void | Promise<void>;
+}
+/**
+ * Custom icon button configuration with enhanced onClick signature
+ */
+export interface CustomIconButtonConfig extends Omit<IconButtonConfig, 'onClick'> {
+    /**
+     * Enhanced onClick handler that receives selected row information
+     * @param selectedRowIds - Array of selected row IDs
+     * @param selectedRows - Array of selected row models
+     */
+    onClick: (selectedRowIds: GridRowSelectionModel, selectedRows: GridValidRowModel[]) => void | Promise<void>;
+}
+/**
+ * Union type for custom toolbar button configurations
+ */
+export type CustomToolbarButtonConfig = CustomTextButtonConfig | CustomIconButtonConfig;
+/**
+ * Configuration for delete action in toolbar
+ */
+export interface DeleteAction {
+    /**
+     * Handler function for delete operation
+     * @param selectedRowIds - Array of selected row IDs to delete
+     * @returns Promise or boolean indicating success
+     */
+    onDelete: (selectedRowIds: GridRowSelectionModel) => boolean | Promise<boolean>;
+    /**
+     * Whether the delete action is disabled
+     */
+    disabled?: boolean;
+}
+/**
+ * Configuration for bulk edit action in toolbar
+ */
+export interface BulkEditAction {
+    /**
+     * Handler function for bulk edit save operation
+     * @param selectedRowIds - Array of selected row IDs
+     * @param newRows - Array of modified row models
+     * @returns Promise or boolean indicating success
+     */
+    onBulkEditSave: (selectedRowIds: GridRowSelectionModel, newRows: GridValidRowModel[]) => boolean | Promise<boolean>;
+    /**
+     * Whether the bulk edit action is disabled
+     */
+    disabled?: boolean;
+}
+/**
+ * Configuration for add action in toolbar
+ */
+export interface AddAction {
+    /**
+     * Handler function for add operation
+     */
+    onClick: () => void;
+    /**
+     * Whether the add action is disabled
+     */
+    disabled?: boolean;
+}
+/**
+ * Configuration for content component to be displayed in AnchoredPopper
+ * Note: This type matches the contentComponentConfig from AnchoredPopper
+ * for use within DataGrid components
+ */
+export type ContentComponentConfig = {
+    /**
+     * Name identifier for the component (useful for debugging/analytics)
+     */
+    name: string;
+    /**
+     * React component to render
+     */
+    component: ComponentType<any>;
+    /**
+     * Props to pass to the component
+     */
+    props: Record<string, any>;
+};
+/**
+ * Action definition for actions menu (toolbar menu)
+ */
+export type MenuAction = {
+    /**
+     * Unique identifier for the action
+     */
+    key: string;
+    /**
+     * Display label for the action
+     */
+    label: string;
+    /**
+     * Optional icon to display before the label
+     */
+    icon?: ReactNode;
+    /**
+     * Optional color for the menu item text
+     */
+    color?: string;
+    /**
+     * Whether the action is disabled
+     * Can be a boolean or a function that determines disabled state based on selected rows
+     */
+    disabled?: boolean | ((selectedRows: GridValidRowModel[]) => boolean);
+    /**
+     * Optional click handler for simple actions
+     * @param selectedRows - Array of selected row models
+     */
+    onClick?: (selectedRows: GridValidRowModel[]) => void;
+    /**
+     * Optional configuration for displaying a popper with custom content
+     * When provided, clicking the action will open an AnchoredPopper with the specified component
+     */
+    contentConfig?: ContentComponentConfig | null;
+};
+/**
+ * Props for ActionsMenu component
+ */
+export interface ActionsMenuProps {
+    /**
+     * Whether the menu is currently open
+     */
+    isOpen: boolean;
+    /**
+     * Anchor element for the menu
+     */
+    anchorEl: HTMLElement | null;
+    /**
+     * Array of menu actions to display
+     */
+    menuActions: MenuAction[];
+    /**
+     * Currently selected rows
+     */
+    selectedRows: GridValidRowModel[];
+    /**
+     * Callback to close the menu
+     */
+    onClose: () => void;
+    /**
+     * Reference to the element that should anchor the popper
+     */
+    popperAnchorRef: RefObject<HTMLElement | null>;
+}
+/**
+ * Type for EditContext value
+ */
+export interface EditContextType {
+    /**
+     * Whether bulk editing mode is active
+     */
+    isBulkEditing: boolean;
+    /**
+     * Whether an edit save operation is in progress
+     */
+    isEditSaving: boolean;
+    /**
+     * Function to set bulk editing state
+     */
+    setIsBulkEditing: Dispatch<SetStateAction<boolean>>;
+    /**
+     * Function to set edit saving state
+     */
+    setIsEditSaving: Dispatch<SetStateAction<boolean>>;
+}
+/**
+ * Props for EditProvider component
+ */
+export interface EditProviderProps {
+    /**
+     * Child components
+     */
+    children: ReactNode;
+}
+/**
+ * Function type for exporting grid data to Excel
+ */
+export type ExportGridApiToExcelFn = (apiRef: RefObject<GridApiPro>, fileName: string, sheetName?: string) => Promise<void>;
+/**
+ * Function type for attaching Excel export functionality to grid API
+ */
+export type AttachExcelExportToApiFn = (apiRef: RefObject<GridApiPro>, fileName?: string) => void;
+/**
+ * Function type for getting selected rows from grid API
+ */
+export type GetSelectedRowsFn = (apiRef: RefObject<GridApiPro>) => GridValidRowModel[];
+/**
+ * Augmentation for MUI DataGridPro ToolbarPropsOverrides
+ * Adds custom toolbar props to the DataGridPro component
+ */
+declare module '@mui/x-data-grid-pro' {
+    interface ToolbarPropsOverrides {
+        /**
+         * Whether to show the selected row count
+         * @default true
+         */
+        showSelectedCount?: boolean;
+        /**
+         * Array of custom button configurations
+         */
+        customButtons?: CustomToolbarButtonConfig[];
+        /**
+         * Configuration for delete action
+         */
+        deleteAction?: DeleteAction;
+        /**
+         * Configuration for bulk edit action
+         */
+        bulkEditAction?: BulkEditAction;
+        /**
+         * Array of menu actions for the actions menu
+         */
+        menuActions?: MenuAction[];
+        /**
+         * Configuration for add action
+         */
+        addAction?: AddAction;
+    }
+}
+export {};

package/dist/components/DocumentComposer/Treeview/CustomTreeItem.d.ts

@@ -1,6 +1,6 @@
 import type { RichTreeViewProApiRef, TreeItemProps } from '@mui/x-tree-view-pro';
 import type { TreeviewProps } from './types';
-type TreeItemCallbacks<T extends Record<string, unknown>> = Pick<TreeviewProps<T>, 'isSectionItem' | 'isVisibleItem' | 'getIconItem' | 'hasItemMenu' | 'getMenuItems' | 'isSectionDraggable' | 'onItemVisibilityChange' | 'isTemporaryItem' | 'onTemporarySectionValidation' | 'onTemporarySectionCancel' | 'onItemLabelChange' | 'hiddenSectionTooltip' | 'visibleIconTooltip' | 'hiddenIconTooltip'> & {
+type TreeItemCallbacks<T extends Record<string, unknown>> = Pick<TreeviewProps<T>, 'isSectionItem' | 'isVisibleItem' | 'getIconItem' | 'hasItemMenu' | 'getMenuItems' | 'isSectionDraggable' | 'onItemVisibilityChange' | 'temporaryItem' | 'isTemporaryItem' | 'onTemporarySectionValidation' | 'onTemporarySectionCancel' | 'onItemLabelChange' | 'hiddenSectionTooltip' | 'visibleIconTooltip' | 'hiddenIconTooltip'> & {
     apiRef: RichTreeViewProApiRef;
     onEditingChange?: (itemId: string | null) => void;
 };

package/dist/components/DocumentComposer/Treeview/slots/LabelInputSlot.d.ts

@@ -3,7 +3,7 @@ import type { RichTreeViewProApiRef } from '@mui/x-tree-view-pro';
 export declare const LabelInputSlot: import("react").ForwardRefExoticComponent<InputHTMLAttributes<HTMLInputElement> & {
     ownerState?: unknown;
     itemId?: string;
-    isTemporary?: boolean;
+    isEditing?: boolean;
     onTemporarySectionValidation?: (label: string) => void;
     onTemporarySectionCancel?: () => void;
     onItemLabelChange?: (itemId: string, newLabel: string) => void;

package/dist/components/DocumentComposer/Treeview/types.d.ts

@@ -40,7 +40,7 @@ export type TreeviewProps<T> = {
     onTemporarySectionCancel: () => void;
     defaultExpandedItems: string[];
     checkboxSelection?: boolean;
-    multiSelect?: boolean;
+    onItemSelect?: (itemId: string | null) => void;
 } & CustomTreeviewItemProps<T>;
 export type TreeviewItemProps<T> = {
     itemId: string;

package/dist/components/DocumentComposer/components/SectionEditorPanel.d.ts

@@ -0,0 +1,7 @@
+import type { SectionContent } from '../types';
+type SectionEditorPanelProps = {
+    content: SectionContent;
+    onChange: (content: SectionContent) => void;
+};
+export declare const SectionEditorPanel: ({ content, onChange }: SectionEditorPanelProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/DocumentComposer/components/index.d.ts

@@ -0,0 +1 @@
+export { SectionEditorPanel } from './SectionEditorPanel';

package/dist/components/DocumentComposer/hooks/useDeleteConfirmation.d.ts

@@ -0,0 +1,12 @@
+type UseDeleteConfirmationParams = {
+    onSectionDelete?: (sectionId: string) => void;
+    /** When true, delete immediately without showing confirmation */
+    skipConfirmation?: boolean;
+};
+export declare const useDeleteConfirmation: ({ onSectionDelete, skipConfirmation }: UseDeleteConfirmationParams) => {
+    deleteItemId: string | null;
+    requestDelete: (sectionId: string) => void;
+    confirmDelete: () => void;
+    cancelDelete: () => void;
+};
+export {};

package/dist/components/DocumentComposer/hooks/useDragVisualFeedback.d.ts

@@ -3,7 +3,7 @@ import type { DocumentSection } from '../types';
 type UseDragVisualFeedbackParams = {
     containerRef: RefObject<HTMLDivElement | null>;
     getSectionById: (sectionId: string) => DocumentSection | null;
-    isValidDropTarget?: (draggedSection: DocumentSection, targetSection: DocumentSection | null) => boolean;
+    isValidDropTarget?: (draggedSection: DocumentSection, targetSection: DocumentSection | null, newIndex: number, isNesting: boolean) => boolean;
 };
 /**
  * Provides visual feedback during drag-and-drop by graying out invalid drop targets.

package/dist/components/DocumentComposer/hooks/useTemporarySection.d.ts

@@ -2,6 +2,8 @@ import type { RichTreeViewProApiRef } from '@mui/x-tree-view-pro';
 import type { DocumentSection } from '../types';
 export type TemporarySection = Pick<DocumentSection, 'id' | 'parentId'> & {
     parentVisible: boolean;
+    /** When undefined = editing mode (input), when defined = optimistic mode (waiting for server) */
+    title?: string;
 };
 type UseTemporarySectionParams = {
     apiRef: RichTreeViewProApiRef;
@@ -12,14 +14,17 @@ type UseTemporarySectionParams = {
 /**
  * Flow:
  * 1. User triggers `create(parentId)` from context menu
- * 2. A temporary section appears in the tree in edit mode
+ * 2. A temporary section appears in the tree in edit mode (title = undefined)
  * 3. User types a title and presses Enter → `validate()` is called
+ *    - The section transitions to optimistic mode (title = defined)
+ *    - Server creation is called in background
  * 4. User presses Escape or leaves empty → `cancel()` is called
+ * 5. Server responds → temporary section is cleared, real section replaces it
  */
 export declare const useTemporarySection: ({ apiRef, getSectionById, onSectionCreate, scrollToBottom }: UseTemporarySectionParams) => {
     temporarySection: TemporarySection | null;
     create: (parentId?: string | null) => void;
-    validate: (title: string) => Promise<void>;
+    validate: (title: string) => void;
     cancel: () => void;
     isTemporary: (sectionId: string) => boolean;
 };

package/dist/components/DocumentComposer/hooks/useUnsavedChangesGuard.d.ts

@@ -0,0 +1,19 @@
+type UseUnsavedChangesGuardParams = {
+    isDirty: boolean;
+    selectedSectionId?: string | null;
+    onSectionSelect?: (sectionId: string | null) => void;
+    onSave?: () => Promise<void>;
+    onDirtyReset?: () => void;
+    /** When true, navigate immediately without showing confirmation (discards changes) */
+    skipConfirmation?: boolean;
+};
+export declare const useUnsavedChangesGuard: ({ isDirty, selectedSectionId, onSectionSelect, onSave, onDirtyReset, skipConfirmation }: UseUnsavedChangesGuardParams) => {
+    pendingSectionId: string | null;
+    isModalOpen: boolean;
+    isSaving: boolean;
+    guardedSelect: (sectionId: string | null) => void;
+    saveAndQuit: () => Promise<void>;
+    quitWithoutSaving: () => void;
+    cancelNavigation: () => void;
+};
+export {};

package/dist/components/DocumentComposer/index.d.ts

@@ -2,5 +2,5 @@ import type { DocumentComposerCallbacks, DocumentComposerCustomProps, DocumentSe
 type DocumentComposerProps = {
     sections?: DocumentSection[];
 } & DocumentComposerCallbacks & DocumentComposerCustomProps;
-declare const DocumentComposer: ({ sections, onSectionOrderChange, onSectionTitleChange, onSectionDelete, onSectionVisibilityChange, onSectionCreate, noSectionsPlaceholder, isLoading, getSectionTitleChangePermission, getSectionDeletePermission, getSectionOrderChangePermission, getSectionCreatePermission, getSectionVisibilityChangePermission, hiddenSectionTooltip, visibleIconTooltip, hiddenIconTooltip, isValidDropTarget }: DocumentComposerProps) => import("react/jsx-runtime").JSX.Element;
+declare const DocumentComposer: ({ sections, isLoadingSections, onSectionOrderChange, onSectionTitleChange, onSectionDelete, onSectionVisibilityChange, onSectionCreate, onSectionSelect, onSectionContentSave, noSectionsPlaceholder, getSectionTitleChangePermission, getSectionDeletePermission, getSectionOrderChangePermission, getSectionCreatePermission, getSectionVisibilityChangePermission, hiddenSectionTooltip, visibleIconTooltip, hiddenIconTooltip, renderSectionIcon, isValidDropTarget, sectionContent, isLoadingSectionContent, selectedSectionId, renderDeleteConfirmation, renderUnsavedChangesConfirmation }: DocumentComposerProps) => import("react/jsx-runtime").JSX.Element;
 export default DocumentComposer;

package/dist/components/DocumentComposer/types/index.d.ts

@@ -0,0 +1,2 @@
+export * from './props';
+export * from './section';