@myunisoft/design-system 1.2.9-rev396.9 → 1.3.0

package/dist/components/Autocomplete/Autocomplete/example-usage.d.ts

@@ -1,5 +1,4 @@
 declare const BasicExample: () => import("react/jsx-runtime").JSX.Element;
 declare const CustomOptionExample: () => import("react/jsx-runtime").JSX.Element;
 declare const ProductExample: () => import("react/jsx-runtime").JSX.Element;
-declare const MaxVisibleOptionsExample: () => import("react/jsx-runtime").JSX.Element;
-export { BasicExample, CustomOptionExample, ProductExample, MaxVisibleOptionsExample };
+export { BasicExample, CustomOptionExample, ProductExample };

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

@@ -0,0 +1,2 @@
+export declare const LeftPanelSkeleton: () => import("react/jsx-runtime").JSX.Element;
+export declare const RightPanelSkeleton: () => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,4 @@
+declare const NoSectionsPlaceholder: ({ noSectionsPlaceholder }: {
+    noSectionsPlaceholder?: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export default NoSectionsPlaceholder;

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

@@ -0,0 +1,9 @@
+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'> & {
+    apiRef: RichTreeViewProApiRef;
+    onEditingChange?: (itemId: string | null) => void;
+};
+type CustomTreeItemProps<T extends Record<string, unknown>> = TreeItemProps & TreeItemCallbacks<T>;
+export declare const CustomTreeItem: <T extends Record<string, unknown>>(props: CustomTreeItemProps<T>) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/DocumentComposer/Treeview/hooks/useTreeItemMenu.d.ts

@@ -0,0 +1,12 @@
+export declare const useTreeItemMenu: () => {
+    containerRef: import("react").RefObject<HTMLLIElement | null>;
+    menuAnchorEl: HTMLElement | null;
+    menuPosition: {
+        top: number;
+        left: number;
+    } | null;
+    handleMenuClick: (event: React.MouseEvent<HTMLElement>) => void;
+    handleMenuClose: () => void;
+    scheduleMenuAction: (action: () => void) => void;
+    onMenuExited: () => void;
+};

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

@@ -0,0 +1,3 @@
+import type { TreeviewProps } from './types';
+declare const Treeview: <T extends Record<string, unknown>>(props: TreeviewProps<T>) => import("react/jsx-runtime").JSX.Element;
+export default Treeview;

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

@@ -0,0 +1,10 @@
+import type { SxProps, Theme } from '@mui/material';
+type IconContainerSlotProps = {
+    ownerState?: unknown;
+    children?: React.ReactNode;
+    sx?: SxProps<Theme>;
+    isDraggable?: boolean;
+    isVisible?: boolean;
+};
+export declare const IconContainerSlot: import("react").MemoExoticComponent<(props: IconContainerSlotProps) => import("react/jsx-runtime").JSX.Element>;
+export {};

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

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

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

@@ -0,0 +1,20 @@
+import type { SxProps, Theme } from '@mui/material';
+type LabelSlotProps = {
+    ownerState?: unknown;
+    editable?: unknown;
+    children?: React.ReactNode;
+    sx?: SxProps<Theme>;
+    customIcon?: React.ReactNode;
+    hasMenu?: boolean;
+    isVisible?: boolean;
+    isTemporary?: boolean;
+    itemId: string;
+    menuAnchorEl?: HTMLElement | null;
+    onMenuClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+    onItemVisibilityChange?: (itemId: string, visible: boolean) => void;
+    hiddenSectionTooltip?: string;
+    visibleIconTooltip?: string;
+    hiddenIconTooltip?: string;
+};
+export declare const LabelSlot: import("react").MemoExoticComponent<(props: LabelSlotProps) => import("react/jsx-runtime").JSX.Element>;
+export {};

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

@@ -0,0 +1,3 @@
+export { IconContainerSlot } from './IconContainerSlot';
+export { LabelInputSlot } from './LabelInputSlot';
+export { LabelSlot } from './LabelSlot';

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

@@ -0,0 +1,50 @@
+import type { RichTreeViewProApiRef } from '@mui/x-tree-view-pro';
+import type { TemporarySection } from '../hooks/useTemporarySection';
+export type ItemPositionParams = {
+    itemId: string;
+    oldPosition: {
+        parentId: string | null;
+        index: number;
+    };
+    newPosition: {
+        parentId: string | null;
+        index: number;
+    };
+};
+export type ScheduleMenuAction = (action: () => void) => void;
+type CustomTreeviewItemProps<T> = {
+    hasItemMenu: (item: T) => boolean;
+    getMenuItems: (item: T, scheduleMenuAction: ScheduleMenuAction) => React.ReactNode[];
+    isSectionItem: (item: T) => boolean;
+    getIconItem: (item: T) => React.ReactNode;
+    isItemEditable: (item: T) => boolean;
+    isVisibleItem: (item: T) => boolean;
+    onItemVisibilityChange: (itemId: string, visible: boolean) => void;
+    hiddenSectionTooltip?: string;
+    visibleIconTooltip?: string;
+    hiddenIconTooltip?: string;
+};
+export type TreeviewProps<T> = {
+    apiRef: RichTreeViewProApiRef;
+    items: readonly T[];
+    getItemId: (item: T) => string;
+    getItemLabel: (item: T) => string;
+    getItemChildren: (item: T) => T[] | undefined;
+    isSectionDraggable: (itemId: string) => boolean;
+    canMoveItemToNewPosition: (params: ItemPositionParams) => boolean;
+    onItemPositionChange: (params: ItemPositionParams) => void;
+    onItemLabelChange: (itemId: string, newLabel: string) => void;
+    temporaryItem: TemporarySection | null;
+    isTemporaryItem: (itemId: string) => boolean;
+    onTemporarySectionValidation: (label: string) => void;
+    onTemporarySectionCancel: () => void;
+    defaultExpandedItems: string[];
+    checkboxSelection?: boolean;
+    multiSelect?: boolean;
+} & CustomTreeviewItemProps<T>;
+export type TreeviewItemProps<T> = {
+    itemId: string;
+    label?: React.ReactNode;
+    children?: React.ReactNode;
+} & CustomTreeviewItemProps<T>;
+export {};

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

@@ -0,0 +1,15 @@
+import { type RefObject } from 'react';
+import type { DocumentSection } from '../types';
+type UseDragVisualFeedbackParams = {
+    containerRef: RefObject<HTMLDivElement | null>;
+    getSectionById: (sectionId: string) => DocumentSection | null;
+    isValidDropTarget?: (draggedSection: DocumentSection, targetSection: DocumentSection | null) => boolean;
+};
+/**
+ * Provides visual feedback during drag-and-drop by graying out invalid drop targets.
+ *
+ * Uses direct DOM manipulation instead of React state to avoid re-rendering
+ * all tree items on every drag event.
+ */
+export declare const useDragVisualFeedback: ({ containerRef, getSectionById, isValidDropTarget }: UseDragVisualFeedbackParams) => void;
+export {};

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

@@ -0,0 +1,5 @@
+import type { DocumentSection } from '../types';
+export declare const useSectionsMap: (sections: DocumentSection[] | undefined) => {
+    sectionsMap: Map<string, DocumentSection>;
+    getSectionById: (sectionId: string) => DocumentSection | null;
+};

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

@@ -0,0 +1,26 @@
+import type { RichTreeViewProApiRef } from '@mui/x-tree-view-pro';
+import type { DocumentSection } from '../types';
+export type TemporarySection = Pick<DocumentSection, 'id' | 'parentId'> & {
+    parentVisible: boolean;
+};
+type UseTemporarySectionParams = {
+    apiRef: RichTreeViewProApiRef;
+    getSectionById: (sectionId: string) => DocumentSection | null;
+    onSectionCreate?: (parentId: string | null, title: string) => string | Promise<string>;
+    scrollToBottom?: () => void;
+};
+/**
+ * Flow:
+ * 1. User triggers `create(parentId)` from context menu
+ * 2. A temporary section appears in the tree in edit mode
+ * 3. User types a title and presses Enter → `validate()` is called
+ * 4. User presses Escape or leaves empty → `cancel()` is called
+ */
+export declare const useTemporarySection: ({ apiRef, getSectionById, onSectionCreate, scrollToBottom }: UseTemporarySectionParams) => {
+    temporarySection: TemporarySection | null;
+    create: (parentId?: string | null) => void;
+    validate: (title: string) => Promise<void>;
+    cancel: () => void;
+    isTemporary: (sectionId: string) => boolean;
+};
+export {};

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

@@ -0,0 +1,6 @@
+import type { DocumentComposerCallbacks, DocumentComposerCustomProps, DocumentSection } from './types';
+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;
+export default DocumentComposer;

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

@@ -0,0 +1,56 @@
+import type { ItemPositionParams } from './Treeview/types';
+export type DocumentSection = {
+    id: string;
+    title: string;
+    visible: boolean;
+    parentId: string | null;
+    sections?: DocumentSection[] | null;
+};
+export type DocumentComposerLabels = {
+    /** Label for the "Create section" button */
+    createSection?: string;
+    /** Label for the "Rename" menu item */
+    rename?: string;
+    /** Label for the "Delete" menu item */
+    delete?: string;
+    /** Label for the "Create subsection" menu item */
+    createSubsection?: string;
+    /** Tooltip for hidden item */
+    hiddenItemTooltip?: string;
+};
+export type DocumentComposerCustomProps = {
+    /** Content displayed when there are no sections */
+    noSectionsPlaceholder?: string | React.ReactNode;
+    /** Show a loading state that prevents rendering the sections */
+    isLoading?: boolean;
+    /** Returns whether section title can be edited (double-click + "Renommer" menu). Defaults to `() => true`. */
+    getSectionTitleChangePermission?: (section: DocumentSection) => boolean;
+    /** Returns whether section can be deleted ("Supprimer" menu). Defaults to `() => true`. */
+    getSectionDeletePermission?: (section: DocumentSection) => boolean;
+    /** Returns whether section can be reordered via drag & drop. Defaults to `() => true`. */
+    getSectionOrderChangePermission?: (section: DocumentSection) => boolean;
+    /** Returns whether a section can be created under this section. Defaults to `() => true`. */
+    getSectionCreatePermission?: (section: DocumentSection) => boolean;
+    /** Returns whether section visibility can be toggled. Defaults to `() => true`. */
+    getSectionVisibilityChangePermission?: (section: DocumentSection) => boolean;
+    /** Tooltip text displayed when hovering a hidden section label (visible: false) */
+    hiddenSectionTooltip?: string;
+    /** Tooltip text displayed when hovering the visibility icon of a visible section */
+    visibleIconTooltip?: string;
+    /** Tooltip text displayed when hovering the visibility icon of a hidden section */
+    hiddenIconTooltip?: string;
+    /**
+     * Determines if `targetSection` is a valid drop location for `draggedSection`.
+     * When provided, invalid targets are visually greyed out during drag.
+     * Defaults to () => true (all targets valid).
+     * @param targetSection - The parent section where the item would be dropped, or `null` if dropping at root level.
+     */
+    isValidDropTarget?: (draggedSection: DocumentSection, targetSection: DocumentSection | null) => boolean;
+};
+export type DocumentComposerCallbacks = {
+    onSectionOrderChange?: (params: ItemPositionParams) => void;
+    onSectionTitleChange?: (sectionId: string, newTitle: string) => void;
+    onSectionDelete?: (sectionId: string) => void;
+    onSectionVisibilityChange?: (sectionId: string, visible: boolean) => void;
+    onSectionCreate?: (parentId: string | null, title: string) => string | Promise<string>;
+};

package/dist/components/DocumentComposer/utils/getSectionMenuItems.d.ts

@@ -0,0 +1,14 @@
+import type { ScheduleMenuAction } from '../Treeview/types';
+import type { DocumentSection } from '../types';
+type MenuItemCallbacks = {
+    onRename: (sectionId: string) => void;
+    onDelete: (sectionId: string) => void;
+    onCreateSubsection: (parentId: string) => void;
+};
+type SectionMenuCapabilities = {
+    canRename: boolean;
+    canDelete: boolean;
+    canCreateSubsection: boolean;
+};
+export declare const getSectionMenuItems: (section: DocumentSection, callbacks: MenuItemCallbacks, scheduleMenuAction: ScheduleMenuAction, capabilities: SectionMenuCapabilities) => React.ReactNode[];
+export {};

package/dist/components/DocumentComposer/utils/sectionHelpers.d.ts

@@ -0,0 +1,10 @@
+import type { DocumentSection } from '../types';
+export declare const getAllExpandableSectionIds: (sections: DocumentSection[]) => string[];
+export declare const getAllSectionsFlat: (sections: DocumentSection[]) => DocumentSection[];
+export declare const isRootSection: (section: DocumentSection) => boolean;
+export declare const hasSectionMenu: (_section: DocumentSection) => boolean;
+export declare const isSectionVisible: (section: DocumentSection) => boolean;
+export declare const getSectionChildren: (section: DocumentSection) => DocumentSection[] | undefined;
+export declare const getSectionId: (section: DocumentSection) => string;
+export declare const getSectionTitle: (section: DocumentSection) => string;
+export declare const getSectionIcon: (section: DocumentSection) => import("react/jsx-runtime").JSX.Element | null;