@epam/ai-dial-ui-kit 0.5.0-rc.4 → 0.5.0-rc.40

package/dist/src/components/FileManager/components/FileManagerToolbar/DialFileManagerToolbar.d.ts

@@ -10,10 +10,10 @@ export interface DialFileManagerToolbarProps {
     hiddenFilesSwitcherLabel?: string;
     showHiddenFilesLabel?: string;
     hideHiddenFilesLabel?: string;
-    isCreateButtonVisible?: boolean;
-    createButtonVariant?: ButtonVariant;
-    createButtonDropdownItems?: DropdownItem[];
-    createButtonLabel?: string;
+    isNewButtonVisible?: boolean;
+    newButtonVariant?: ButtonVariant;
+    newButtonDropdownItems?: DropdownItem[];
+    newButtonLabel?: string;
     onTabChange?: (id: DialFileManagerTabs) => void;
     onToggleHiddenFiles?: (value: boolean) => void;
 }
@@ -24,7 +24,7 @@ export interface DialFileManagerToolbarProps {
  * - Tab navigation for switching between file sections or views
  * - A toggle for showing or hiding hidden files
  * - A refresh button for reloading content
- * - An optional "Create" button or dropdown for creating new files or folders
+ * - An optional "New" button or dropdown for creating new files or folders
  *
  * @example
  * ```tsx
@@ -40,8 +40,8 @@ export interface DialFileManagerToolbarProps {
  *   onTabChange={(id) => console.log('Switched to tab:', id)}
  *   onToggleHiddenFiles={(visible) => console.log('Hidden files visible:', visible)}
  *   onRefresh={() => console.log('Refreshed')}
- *   isCreateButtonVisible
- *   createButtonDropdownItems={[
+ *   isNewButtonVisible
+ *   newButtonDropdownItems={[
  *     { key: 'folder', label: 'New Folder' },
  *     { key: 'file', label: 'Upload File' },
  *   ]}
@@ -56,16 +56,16 @@ export interface DialFileManagerToolbarProps {
  * @param [hideHiddenFilesLabel='Hide hidden'] - Label shown when hidden files are visible.
  * @param [onTabChange] - Callback fired when the user switches between tabs. Receives the selected tab ID.
  * @param [onToggleHiddenFiles] - Callback fired when the hidden files visibility is toggled. Receives the new visibility state.
- * @param [isCreateButtonVisible] - Whether the "Create" button or dropdown should be displayed.
- * @param [createButtonVariant=ButtonVariant.Secondary] - Visual style variant for the create button.
- * @param [createButtonDropdownItems=[]] - Dropdown items available under the create button. If empty, a single create button is shown instead.
- * @param [createButtonLabel='Create'] - Label text for the create button.
+ * @param [isNewButtonVisible] - Whether the "New" button or dropdown should be displayed.
+ * @param [newButtonVariant=ButtonVariant.Secondary] - Visual style variant for the new button.
+ * @param [newButtonDropdownItems=[]] - Dropdown items available under the new button. If empty, a single new button is shown instead.
+ * @param [newButtonLabel='New'] - Label text for the new button.
  *
  * @remarks
  * - Tabs are rendered via `DialTabs`.
  * - The hidden files toggle uses `DialSwitch`.
- * - The refresh and create actions use `DialButton` or dropdown variants for consistency.
+ * - The refresh and new actions use `DialButton` or dropdown variants for consistency.
  * - The toolbar automatically adapts its layout for different screen sizes.
- * - When `createButtonDropdownItems` is provided, the create button becomes a dropdown menu.
+ * - When `newButtonDropdownItems` is provided, the new button becomes a dropdown menu.
  */
 export declare const DialFileManagerToolbar: FC<DialFileManagerToolbarProps>;

package/dist/src/components/FileManager/components/FoldersTree/FoldersTree.d.ts

@@ -17,6 +17,7 @@ export interface DialFoldersTreeProps {
     onRenameValidate?: (value: string, item: DialFile) => string | null;
     getContextMenuItems?: (item: DialFile) => DropdownItem[];
     areHiddenFilesVisible?: boolean;
+    onExpandedPathsChange?: (expandedPaths: Set<string>) => void;
 }
 /**
  * DialFoldersTree — A hierarchical folder tree component with nested expand/collapse support, selection highlighting,

package/dist/src/components/FileManager/components/FoldersTree/hooks/use-expanded-paths.d.ts

@@ -0,0 +1,13 @@
+export interface UseExpandedPathsOptions {
+    expandedPaths?: Set<string>;
+    onExpandedPathsChange?: (expandedPaths: Set<string>) => void;
+}
+export declare const useExpandedPaths: (options?: UseExpandedPathsOptions) => {
+    expandedPaths: Set<string>;
+    setExpandedPaths: (newSet: Set<string>) => void;
+    togglePath: (path: string) => void;
+    collapseAll: () => void;
+    expandPath: (path: string) => void;
+    collapsePath: (path: string) => void;
+    isControlled: boolean;
+};

package/dist/src/components/FileManager/constants.d.ts

@@ -7,3 +7,6 @@ export declare const treeBaseClasses = "w-full h-full rounded bg-layer-3 text-se
 export declare const gridBaseClasses = "flex-1 w-full rounded text-secondary overflow-auto min-h-0 min-w-0";
 export declare const sidebarWidth = 280;
 export declare const sidebarTitleDefault = "Files";
+export declare const BASE_FILE_MANAGER_ICON_SIZE = 20;
+export declare const FILES_DATA_TRANSFER_TYPE = "Files";
+export declare const FOLDER_PLACEHOLDER_FILE_NAME = ".dial_folder";

package/dist/src/components/FileManager/hooks/__tests__/use-file-upload.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/src/components/FileManager/hooks/use-bulk-actions.d.ts

@@ -0,0 +1,22 @@
+import { DialFile } from '../../../models/file';
+import { DialFileManagerActions } from '../../../types/file-manager';
+import { DialActionDropdownItem } from '../components/FileManagerBulkActionsToolbar/FileManagerBulkActionsToolbar';
+export interface UseBulkActionsProps {
+    selectedFiles: Map<string, DialFile>;
+    actionLabels?: {
+        [DialFileManagerActions.Duplicate]?: string;
+        [DialFileManagerActions.Copy]?: string;
+        [DialFileManagerActions.Rename]?: string;
+        [DialFileManagerActions.Download]?: string;
+        [DialFileManagerActions.Delete]?: string;
+        [DialFileManagerActions.Move]?: string;
+    };
+    onDuplicate: (files: DialFile[]) => void;
+    onCopy: (files: DialFile[]) => void;
+    onMove: (files: DialFile[]) => void;
+    onDownload: (files: DialFile[]) => void;
+    onRename: (filePath: string) => void;
+    onDelete: (files: DialFile[], parentFolderPath: string) => void;
+    getCurrentFolderPath: () => string;
+}
+export declare const useBulkActions: ({ selectedFiles, actionLabels, onDuplicate, onCopy, onMove, onDownload, onDelete, getCurrentFolderPath, }: UseBulkActionsProps) => DialActionDropdownItem[];

package/dist/src/components/FileManager/hooks/use-file-clipboard.d.ts

@@ -1,5 +1,5 @@
 import { DialFile } from '../../../models/file';
-import { DialCopiedItem } from '../../../types/file-manager';
+import { DialCopiedItem } from '../../../models/file-manager';
 export interface UseFileClipboardOptions {
     getDestinationFiles: (path: string) => DialFile[];
     getSourceFiles: () => DialFile[];

package/dist/src/components/FileManager/hooks/use-file-delete.d.ts

@@ -1,5 +1,5 @@
 import { DialFile } from '../../../models/file';
-import { DialDeletedItem } from '../../../types/file-manager';
+import { DialDeletedItem } from '../../../models/file-manager';
 export interface UseFileDeleteOptions {
     onDeleteFiles?: (items: DialDeletedItem[], sourceFolder: string) => void;
 }

package/dist/src/components/FileManager/hooks/use-file-upload.d.ts

@@ -0,0 +1,34 @@
+import { DragEvent } from 'react';
+import { DialFile } from '../../../models/file';
+import { DialUploadFileItem } from '../../../models/file-manager';
+export interface FileUploadValidationResult {
+    valid: boolean;
+    message?: string;
+}
+export interface FileUploadValidationMessages {
+    duplicateFiles?: string;
+    oversizedFiles?: string;
+    validationFailed?: string;
+    validationError?: string;
+}
+export interface UseFileUploadOptions {
+    onUploadFiles?: (files: DialUploadFileItem[], destinationFolder: string) => void;
+    onValidateUpload?: (files: DialUploadFileItem[], existingFiles: DialFile[], destinationFolder: string) => FileUploadValidationResult | Promise<FileUploadValidationResult>;
+    maxFileSize?: number;
+    validationMessages?: FileUploadValidationMessages;
+    onUploadArchive?: (file: File, name: string, destinationFolder: string) => void;
+}
+export declare const useFileUpload: ({ onUploadFiles, onValidateUpload, maxFileSize, validationMessages, onUploadArchive, }?: UseFileUploadOptions) => {
+    isDragging: boolean;
+    isDraggingOverWindow: boolean;
+    uploadError: string | undefined;
+    handleDragEnter: (e: DragEvent) => void;
+    handleDragLeave: (e: DragEvent) => void;
+    handleDragOver: (e: DragEvent) => void;
+    handleDrop: (e: DragEvent, destinationFolder: string, existingFiles: DialFile[]) => Promise<void>;
+    clearError: () => void;
+    handleUpload: (files: DialUploadFileItem[], destinationFolder: string, existingFiles: DialFile[]) => Promise<boolean>;
+    openFileDialog: (destinationFolder: string, existingFiles: DialFile[]) => void;
+    openArchiveDialog: (destinationFolder: string, existingFiles: DialFile[]) => void;
+    fileInputRef: import('react').RefObject<HTMLInputElement | null>;
+};

package/dist/src/components/FileManager/hooks/use-folder-creation.d.ts

@@ -0,0 +1,21 @@
+import { DialFile } from '../../../models/file';
+import { DialUploadFileItem } from '../../../models/file-manager';
+export interface FolderCreationValidationMessages {
+    emptyName?: string;
+    duplicateName?: string;
+}
+export interface UseFolderCreationProps {
+    currentFolder?: DialFile;
+    onCreateFolder?: (file: DialUploadFileItem, folderPath: string, fileId: string) => void | Promise<void>;
+    onValidateFolderName?: (name: string, parentFolder: DialFile) => string | null;
+    validationMessages?: FolderCreationValidationMessages;
+}
+export interface UseFolderCreationResult {
+    isCreatingFolder: boolean;
+    newFolderTempId: string | null;
+    startFolderCreation: () => void;
+    cancelFolderCreation: () => void;
+    saveFolderCreation: (name: string) => Promise<void>;
+    validateFolderName: (name: string) => string | null;
+}
+export declare const useFolderCreation: ({ currentFolder, onCreateFolder, onValidateFolderName, validationMessages, }: UseFolderCreationProps) => UseFolderCreationResult;

package/dist/src/components/FileManager/hooks/use-grid-context-menu.d.ts

@@ -0,0 +1,20 @@
+import { DialFile } from '../../../models/file';
+import { DialFileManagerActions } from '../../../types/file-manager';
+import { DropdownItem } from '../../../models/dropdown';
+export interface UseGridContextMenuProps {
+    actionLabels?: {
+        [DialFileManagerActions.Duplicate]?: string;
+        [DialFileManagerActions.Copy]?: string;
+        [DialFileManagerActions.Rename]?: string;
+        [DialFileManagerActions.Download]?: string;
+        [DialFileManagerActions.Delete]?: string;
+        [DialFileManagerActions.Move]?: string;
+    };
+    onDuplicate: (file: DialFile) => void;
+    onCopy: (file: DialFile) => void;
+    onMove: (file: DialFile) => void;
+    onDownload: (file: DialFile) => void;
+    onRename: (filePath: string) => void;
+    onDelete: (file: DialFile, parentFolderPath: string) => void;
+}
+export declare const useGridContextMenu: ({ actionLabels, onDuplicate, onCopy, onMove, onDownload, onRename, onDelete, }: UseGridContextMenuProps) => (file: DialFile) => DropdownItem[];

package/dist/src/components/FileManager/hooks/use-item-renaming.d.ts

@@ -1,5 +1,5 @@
 import { DialFile } from '../../../models/file';
-import { DialCopiedItem } from '../../../types/file-manager';
+import { DialCopiedItem } from '../../../models/file-manager';
 export declare const useItemRenaming: ({ items, onRename, onRenameSave, onRenameCancel, onRenameValidate, onMoveToFiles, }: {
     items?: DialFile[];
     onRename?: (path: string) => void;

package/dist/src/components/FileManager/hooks/use-new-actions.d.ts

@@ -0,0 +1,16 @@
+import { DropdownItem } from '../../../models/dropdown';
+export interface UseNewActionsProps {
+    newActionLabels?: {
+        uploadFiles?: string;
+        newFolder?: string;
+        uploadArchive?: string;
+    };
+    onUploadFiles?: () => void;
+    onCreateFolder?: () => void;
+    onUploadArchive?: () => void;
+}
+export interface UseNewActionsResult {
+    newActions: DropdownItem[];
+    isNewButtonVisible: boolean;
+}
+export declare const useNewActions: ({ newActionLabels, onUploadFiles, onCreateFolder, onUploadArchive, }: UseNewActionsProps) => UseNewActionsResult;

package/dist/src/components/FileName/FileName.d.ts

@@ -3,6 +3,7 @@ export interface DialFileNameProps {
     name: string;
     cssClass?: string;
     shared?: boolean;
+    iconSize?: number;
 }
 /**
  * Component to display a file name with a file icon and shared indicator.
@@ -16,5 +17,6 @@ export interface DialFileNameProps {
  * @param name - Full file name with or without extension
  * @param cssClass - Additional CSS classes for the root container
  * @param shared - Whether the file is shared
+ * @param iconSize - Icon size in px. Default: BASE_ICON_SIZE.
  */
 export declare const DialFileName: FC<DialFileNameProps>;

package/dist/src/components/FolderName/FolderName.d.ts

@@ -4,6 +4,7 @@ export interface DialFolderNameProps {
     cssClass?: string;
     shared?: boolean;
     loading?: boolean;
+    iconSize?: number;
 }
 /**
  * Component to display a folder name with a folder icon and shared indicator.
@@ -16,6 +17,8 @@ export interface DialFolderNameProps {
  *
  * @param name - Folder name
  * @param cssClass - Additional CSS classes for the root container
- * @param shared - Whether the folder is shared
+ * @param shared - If true, shows shared indicator. Default: false.
+ * @param loading - If true, shows loading state. Default: false.
+ * @param iconSize - Icon size in px. Default: BASE_ICON_SIZE.
  */
 export declare const DialFolderName: FC<DialFolderNameProps>;

package/dist/src/components/Grid/Grid.d.ts

@@ -11,13 +11,17 @@ export interface DialGridProps<T extends object = Record<string, unknown>> {
     withSelectionColumn?: boolean;
     wrapCustomCellRenderers?: boolean | ((col: ColDef<T>) => boolean);
     selectedRowIds?: Set<string>;
+    selectedRows?: Map<string, T>;
     onSelectionChange?: (selectedRowIds: Set<string>, selectedRows: T[]) => void;
+    onSelectionChangeWithMap?: (selectedRows: Map<string, T>) => void;
     getRowId?: (row: T) => string;
     alternateOddRowColors?: boolean;
     filterPlaceholder?: string;
     emptyStateIcon?: ReactNode;
     emptyStateTitle?: string;
     emptyStateDescription?: string;
+    loading?: boolean;
+    wrapperBorder?: boolean;
 }
 /**
  * DialGrid — A feature-rich data grid wrapper built on ag-Grid with dark theme support.
@@ -30,6 +34,7 @@ export interface DialGridProps<T extends object = Record<string, unknown>> {
  * - Controlled or uncontrolled selection modes
  * - Automatic column sizing and responsive behavior
  * - Full accessibility support with ARIA attributes
+ * - Loading state with native AG-Grid overlay
  *
  * @example
  * ```tsx
@@ -48,7 +53,13 @@ export interface DialGridProps<T extends object = Record<string, unknown>> {
  * <DialGrid<Product>
  *   columnDefs={columns}
  *   rowData={products}
- *   storageKey="products-grid"
+ * />
+ *
+ * // With loading state
+ * <DialGrid<Product>
+ *   columnDefs={columns}
+ *   rowData={products}
+ *   loading={true}
  * />
  *
  * // With context menu
@@ -93,6 +104,8 @@ export interface DialGridProps<T extends object = Record<string, unknown>> {
  * @param [emptyStateIcon] - Optional icon for empty state
  * @param [emptyStateTitle] - Optional title text displayed when the grid has no rows to show.
  * @param [emptyStateDescription] - Optional description text displayed below the empty state title,
- *   providing additional context or instructions (e.g., “No data found” or “Try adjusting your filters”).
+ *   providing additional context or instructions (e.g., "No data found" or "Try adjusting your filters").
+ * @param [loading=false] - When true, shows AG-Grid's native loading overlay
+ * @param [wrapperBorder=true] - Whether to apply a border around the grid container
  */
-export declare const DialGrid: <T extends object>({ columnDefs, rowData, additionalGridOptions, getContextMenuItems, cssClass, ariaLabel, withSelectionColumn, wrapCustomCellRenderers, selectedRowIds, onSelectionChange, getRowId, alternateOddRowColors, filterPlaceholder, emptyStateIcon, emptyStateTitle, emptyStateDescription, }: DialGridProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const DialGrid: <T extends object>({ columnDefs, rowData, additionalGridOptions, getContextMenuItems, cssClass, ariaLabel, withSelectionColumn, wrapCustomCellRenderers, selectedRowIds, selectedRows, onSelectionChange, onSelectionChangeWithMap, getRowId, alternateOddRowColors, filterPlaceholder, emptyStateIcon, emptyStateTitle, emptyStateDescription, loading, wrapperBorder, }: DialGridProps<T>) => import("react/jsx-runtime").JSX.Element;

package/dist/src/components/Grid/hooks/use-grid-selection.d.ts

@@ -1,12 +1,15 @@
-export interface UseGridSelectionProps<T> {
+export interface UseGridSelectionProps<T extends object> {
     selectedRowIds?: Set<string>;
+    selectedRows?: Map<string, T>;
     onSelectionChange?: (selectedRowIds: Set<string>, selectedRows: T[]) => void;
+    onSelectionChangeWithMap?: (selectedRows: Map<string, T>) => void;
     rowData?: T[];
     getRowId: (row: T) => string;
 }
-export declare const useGridSelection: <T extends object>({ selectedRowIds, onSelectionChange, rowData, getRowId, }: UseGridSelectionProps<T>) => {
+export declare const useGridSelection: <T extends object>({ selectedRowIds, selectedRows, onSelectionChange, onSelectionChangeWithMap, rowData, getRowId, }: UseGridSelectionProps<T>) => {
     currentSelectedIds: Set<string>;
-    handleSelectionToggle: (rowId: string, checked: boolean) => void;
+    currentSelectedRows: Map<string, T>;
+    handleSelectionToggle: (row: T, checked: boolean) => void;
     headerCheckboxState: string;
-    handleHeaderCheckboxChange: () => void;
+    handleHeaderCheckboxChange: (checked?: boolean) => void;
 };

package/dist/src/components/Icon/Icon.d.ts

@@ -2,7 +2,6 @@ import { FC, ReactNode } from 'react';
 export interface DialIconProps {
     icon?: ReactNode;
     className?: string;
-    label?: string;
 }
 /**
  * A wrapper component for rendering icons with consistent styling

package/dist/src/components/Loader/Loader.d.ts

@@ -1,8 +1,8 @@
 import { FC } from 'react';
 export interface DialLoaderProps {
     size?: number;
-    cssClass?: string;
-    iconClass?: string;
+    className?: string;
+    iconClassName?: string;
     fullWidth?: boolean;
     ariaLabel?: string;
 }
@@ -20,12 +20,12 @@ export interface DialLoaderProps {
  * <DialLoader fullWidth={false} />
  *
  * // Custom size and classes
- * <DialLoader size={24} iconClass="text-accent-primary" />
+ * <DialLoader size={24} iconClassName="text-accent-primary" />
  * ```
  *
  * @param [size=18] - Icon size in px
- * @param [cssClass] - Additional classes for the container
- * @param [iconClass] - Additional classes for the SVG icon
+ * @param [className] - Additional classes for the container
+ * @param [iconClassName] - Additional classes for the SVG icon
  * @param [fullWidth=true] - Stretch to full width/height of container
  * @param [ariaLabel='Loading'] - Accessible label for screen readers
  */

package/dist/src/components/Loader/constants.d.ts

@@ -1,2 +1,2 @@
-export declare const loaderBaseClasses = "flex items-center justify-center text-secondary";
-export declare const loaderIconBaseClasses = "shrink-0 grow-0 basis-auto animate-spin-steps";
+export declare const loaderBaseClassName = "flex items-center justify-center text-secondary";
+export declare const loaderIconBaseClassName = "shrink-0 grow-0 basis-auto animate-spin-steps";

package/dist/src/components/NoDataContent/NoDataContent.d.ts

@@ -3,9 +3,9 @@ export interface DialNoDataContentProps {
     icon?: ReactNode;
     title: string;
     description?: string;
-    containerCssClass?: string;
-    titleCssClass?: string;
-    descriptionCssClass?: string;
+    containerClassName?: string;
+    titleClassName?: string;
+    descriptionClassName?: string;
 }
 /**
  * A component for displaying a message and icon when there is no data to show.
@@ -21,5 +21,8 @@ export interface DialNoDataContentProps {
  * @param [icon] - Custom icon to display (defaults to clipboard icon)
  * @param title - The message to display when no data is present
  * @param [description] - The description to display when no data is present
+ * @param [containerClassName] - Additional CSS classes for the container
+ * @param [titleClassName] - Additional CSS classes for the title text
+ * @param [descriptionClassName] - Additional CSS classes for the description text
  */
 export declare const DialNoDataContent: FC<DialNoDataContentProps>;

package/dist/src/components/RemoveButton/RemoveButton.d.ts

@@ -1,9 +1,7 @@
-import { FC, MouseEvent } from 'react';
-export interface DialRemoveButtonProps {
-    iconClass?: string;
-    cssClass?: string;
-    ariaLabel?: string;
-    onClick: (e: MouseEvent) => void;
+import { FC } from 'react';
+import { DialButtonProps } from '../Button/Button';
+export interface DialRemoveButtonProps extends Omit<DialButtonProps, 'iconBefore' | 'iconAfter'> {
+    iconClassName?: string;
 }
 /**
  * A specialized button component for removal or delete actions.
@@ -14,11 +12,11 @@ export interface DialRemoveButtonProps {
  * <DialRemoveButton
  *   label="Delete item"
  *   onClick={handleDelete}
- *   iconClass="text-error"
+ *   iconClassName="text-error"
  * />
  * @component
  * @param {DialRemoveButtonProps} props - The properties for the remove button component.
- * @param {string} [props.iconClass] - Optional CSS class applied to the trash icon for styling or sizing.
+ * @param {string} [props.iconClassName] - Optional CSS class applied to the trash icon for styling or sizing.
  * @returns {JSX.Element} The rendered remove button component.
  */
 export declare const DialRemoveButton: FC<DialRemoveButtonProps>;

package/dist/src/components/Select/Select.d.ts

@@ -1,12 +1,14 @@
-import { FC, ReactNode, MouseEvent } from 'react';
+import { FC, ReactNode, MouseEvent, Ref } from 'react';
 import { SelectOption } from '../../models/select';
 import { SelectSize, SelectVariant } from '../../types/select';
 export interface DialSelectProps {
     options: SelectOption[];
     multiple?: boolean;
+    elementId?: string;
     size?: SelectSize;
     variant?: SelectVariant;
     value?: string | string[];
+    customSelectedValue?: string;
     prefix?: string;
     defaultValue?: string | string[];
     placeholder?: string;
@@ -22,6 +24,7 @@ export interface DialSelectProps {
     closable?: boolean;
     header?: ReactNode | (() => ReactNode);
     footer?: ReactNode | (() => ReactNode);
+    dismissRef?: Ref<unknown>;
     onClose?: (e: MouseEvent<HTMLButtonElement>) => void;
     onChange?: (next: string | string[]) => void;
     inlineSearch?: boolean;
@@ -51,10 +54,12 @@ export interface DialSelectProps {
  * ```
  *
  * @param options - Array of options to select from.
+ * @param [elementId] - The id attribute for the select element.
  * @param [multiple] - Whether multiple selections are allowed.
  * @param [size=SelectSize.Md] - Size of the control.
  * @param [variant=SelectVariant.Primary] - Visual variant.
  * @param [value] - Controlled selected value(s).
+ * @param [customSelectedValue] - Custom string to render as the selected value in single mode.
  * @param [prefix] - Prefix for selected value(s).
  * @param [defaultValue] - Uncontrolled initial selected value(s).
  * @param [placeholder="Select..."] - Placeholder text when no selection is made.
@@ -74,5 +79,6 @@ export interface DialSelectProps {
  * @param [onChange] - Called when the selection changes.
  * @param [inlineSearch=false] - Render a plain input inside trigger (single mode only).
  * @param [onFooterClick] - Called when the footer element is clicked. When provided, automatically closes the dropdown.
+ * @param [dismissRef] - Ref object to expose a `dismiss` method to programmatically close the select.
  */
 export declare const DialSelect: FC<DialSelectProps>;

package/dist/src/components/Select/constants.d.ts

@@ -1,7 +1,8 @@
 export declare const selectTriggerBaseClasses = "dial-input flex w-full items-center justify-between gap-2 dial-small";
-export declare const selectOverlayBaseClasses = "w-full rounded";
+export declare const selectOverlayBaseClasses = "w-full rounded flex flex-col";
 export declare const selectOptionBaseClasses = "flex w-full items-center justify-between gap-2 px-3 h-[34px] dial-small text-primary truncate hover:bg-accent-primary-alpha focus:bg-accent-primary-alpha focus:outline-none";
 export declare const selectOptionSelectedClasses = "bg-accent-primary-alpha";
 export declare const selectOptionSingleSelectedClasses = "bg-accent-primary-alpha border-l border-accent-primary border-1";
 export declare const selectOptionDisabledClasses = "opacity-75";
+export declare const dropdownMenuMaxHeight = 352;
 export declare const selectChevronIcon: import("react/jsx-runtime").JSX.Element;

package/dist/src/components/SelectField/SelectField.d.ts

@@ -2,7 +2,7 @@ import { FC } from 'react';
 import { DialFormItemProps } from '../FormItem/FormItem';
 import { DialSelectProps } from '../Select/Select';
 import { DialFieldLabelProps } from '../Field/Field';
-export interface DialSelectFieldProps extends Omit<DialSelectProps, 'cssClass'>, Omit<DialFieldLabelProps, 'htmlFor'>, Omit<DialFormItemProps, 'label' | 'children' | 'value'> {
+export interface DialSelectFieldProps extends Omit<DialSelectProps, 'cssClass' | 'elementId'>, Omit<DialFieldLabelProps, 'htmlFor'>, Omit<DialFormItemProps, 'label' | 'children' | 'value'> {
     selectCssClass?: string;
     containerCssClass?: string;
 }

package/dist/src/components/Tab/Tab.d.ts

@@ -1,11 +1,11 @@
+import { ButtonHTMLAttributes, FC } from 'react';
 import { TabModel } from '../../models/tab';
-import { FC } from 'react';
-export interface DialTabProps {
+type NativeButtonProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'onClick' | 'children' | 'type' | 'role' | 'disabled'>;
+export interface DialTabProps extends NativeButtonProps {
     tab: TabModel;
     active: boolean;
     invalid?: boolean;
     horizontal?: boolean;
-    cssClass?: string;
     onClick: (id: string) => void;
 }
 /**
@@ -26,7 +26,7 @@ export interface DialTabProps {
  * @param tab - The tab model containing its `id`, `name`, [`disabled`], [`invalid`].
  * @param active - Whether the tab is currently active.
  * @param [horizontal=false] - Whether the tab is displayed in horizontal orientation.
- * @param [cssClass] - Additional CSS classes applied to the tab element.
  * @param onClick - Callback fired when the tab is clicked. Receives the tab’s `id`.
  */
 export declare const DialTab: FC<DialTabProps>;
+export {};

package/dist/src/components/Tabs/Tabs.d.ts

@@ -1,14 +1,14 @@
 import { FC } from 'react';
 import { TabModel } from '../../models/tab';
-import { SmallScreenThreshold, TabOrientation } from '../../types/tab';
+import { ScreenResolution, TabOrientation } from '../../types/tab';
 export interface DialTabsProps {
     tabs: TabModel[];
     activeTab: string;
     onClick: (id: string) => void;
     orientation?: TabOrientation;
-    smallScreenThreshold?: SmallScreenThreshold;
-    smallScreenContainerCssClass?: string;
-    smallScreenDropdownItemCssClass?: string;
+    screenThreshold?: ScreenResolution;
+    smallScreenContainerClassName?: string;
+    smallScreenDropdownItemClassName?: string;
 }
 /**
  * A responsive and overflow-aware tabs component that automatically adapts its layout
@@ -43,17 +43,17 @@ export interface DialTabsProps {
  * @param activeTab - The identifier of the currently active tab.
  * @param onClick - Callback fired when a tab is selected. Receives the tab's `id` as an argument.
  * @param [orientation=TabOrientation.Horizontal] - Layout direction of the tabs. Uses the {@link TabOrientation} enum.
- * @param [smallScreenThreshold=SmallScreenThreshold.Tablet] - Defines the screen size threshold
- *   below which tabs collapse into a dropdown. Uses the {@link SmallScreenThreshold} enum.
+ * @param [screenThreshold=ScreenResolution.Tablet] - Defines the screen size threshold
+ *   below which tabs collapse into a dropdown. Uses the {@link ScreenRelosution} enum.
  *   When set to `Tablet`, both mobile and tablet screens will trigger dropdown mode.
- * @param [smallScreenContainerCssClass] - Optional CSS class applied to the dropdown container
+ * @param [smallScreenContainerClassNames] - Optional CSS class applied to the dropdown container
  *   in small-screen (collapsed) mode.
- * @param [smallScreenDropdownItemCssClass] - Optional CSS class applied to individual dropdown
+ * @param [smallScreenDropdownItemClassName] - Optional CSS class applied to individual dropdown
  *   items in small-screen mode.
  *
  * @remarks
  * - Automatically detects horizontal overflow via `ResizeObserver` and shows a dropdown when needed.
  * - Smoothly scrolls to keep the active tab visible when navigating.
- * - Switches layout responsively based on `smallScreenThreshold`.
+ * - Switches layout responsively based on `screenThreshold`.
  */
 export declare const DialTabs: FC<DialTabsProps>;

package/dist/src/index.d.ts

@@ -62,7 +62,7 @@ export { TabOrientation } from './types/tab';
 export type { DialBreadcrumbPathItem } from './models/breadcrumb';
 export { FormItemOrientation } from './types/form-item';
 export { SelectSize, SelectVariant } from './types/select';
-export { DialFileManagerTabs, DialFileManagerActions, type DialCopiedItem, type DialDeletedItem, } from './types/file-manager';
+export { DialFileManagerTabs, DialFileManagerActions, } from './types/file-manager';
 export { FlexibleActionsDirection } from './types/flexible-actions';
 export { DialItemType } from './types/item';
 export { useDialFileManagerTabs } from './components/FileManager/hooks/use-file-manager-tabs';
@@ -78,4 +78,5 @@ export type { DropdownItem } from './models/dropdown';
 export type { DialModifiedEntity } from './models/base-entity';
 export type { DialFile } from './models/file';
 export { DialFileNodeType, DialFilePermission, DialFileResourceType, } from './models/file';
+export { type DialCopiedItem, type DialDeletedItem, type DialUploadFileItem, } from './models/file-manager';
 export { mergeClasses } from './utils/merge-classes';

package/dist/src/models/breadcrumb.d.ts

@@ -4,6 +4,6 @@ export interface DialBreadcrumbPathItem {
     href?: string;
     onClick?: (e: MouseEvent<HTMLAnchorElement>) => void;
     disabled?: boolean;
-    cssClass?: string;
+    className?: string;
     iconBefore?: ReactNode;
 }

package/dist/src/models/file-manager.d.ts

@@ -0,0 +1,15 @@
+import { DialFileNodeType } from './file';
+export interface DialCopiedItem {
+    sourceUrl: string;
+    destinationUrl: string;
+    overwrite?: boolean;
+    nodeType: DialFileNodeType;
+}
+export interface DialDeletedItem {
+    sourceUrl: string;
+    nodeType: DialFileNodeType;
+}
+export interface DialUploadFileItem {
+    fileContent: File;
+    name: string;
+}

package/dist/src/models/tab.d.ts

@@ -1,6 +1,7 @@
+import { ReactNode } from 'react';
 export interface TabModel {
     id: string;
-    name: string;
+    label: string | ReactNode;
     invalid?: boolean;
     disabled?: boolean;
 }