@epam/ai-dial-react-file-manager 0.3.0-dev.2 → 0.3.0-dev.4

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

@@ -1,20 +1,24 @@
 import { FileManagerColumnKey } from '../../types/file-manager.ts';
-export declare const containerBaseClassName = "w-full h-full grid grid-rows-[auto_1fr] gap-5 p-6 overflow-hidden min-w-0 bg-layer-base";
-export declare const toolbarBaseClassName = "w-full text-secondary flex items-center gap-2";
+export declare const containerBaseClassName = "w-full h-full grid grid-rows-[minmax(0,1fr)] overflow-hidden min-w-0";
+export declare const toolbarBaseClassName = "text-secondary flex items-center gap-2";
 export declare const mainGridClassName = "flex min-h-0 min-w-0 h-full gap-4 overflow-hidden";
-export declare const contentGridClassName = "flex flex-col flex-1 min-h-0 min-w-0 h-full gap-4";
-export declare const contentHeaderClassName = "items-center";
-export declare const treeBaseClassName = "h-full rounded bg-layer-raised text-secondary min-w-0";
-export declare const gridBaseClassName = "flex-1 w-full rounded text-secondary overflow-auto min-h-0 min-w-0";
+export declare const contentGridClassName = "flex flex-col flex-1 min-h-0 min-w-0 h-full px-5 gap-5";
+export declare const contentHeaderClassName = "flex w-full shrink-0 items-center justify-between gap-4 h-[64px]";
+export declare const sidebarPanelClassName = "min-h-0 min-w-[360px] h-full bg-layer-raised shadow-sm";
+export declare const sidebarContentClassName = "flex h-full min-h-0 flex-col gap-3";
+export declare const sidebarHeadingClassName = "dial-h1-text text-primary";
+export declare const sidebarHeadingRowClassName = "px-4 h-[64px] flex items-center justify-between gap-2";
+export declare const sidebarTreeContainerClassName = "min-h-0 flex-1 px-3";
+export declare const sidebarTabsAriaLabelDefault = "File storage sections";
+export declare const gridPanelClassName = "flex flex-1 flex-col w-full min-h-0 min-w-0 gap-5";
+export declare const gridBaseClassName = "flex-1 w-full text-secondary overflow-auto min-h-0 min-w-0";
+export declare const bulkActionsToolbarWrapperClassName = "absolute bottom-4 left-4 right-4 z-10";
 export declare const actionsColumnButtonClassName = "opacity-0 pointer-events-none group-hover/grid-row:opacity-100 group-hover/grid-row:pointer-events-auto";
-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";
 export declare const DEFAULT_FOLDER_BASE_NAME = "New folder";
-export declare const FOLDERS_TREE_PANEL_MIN_WIDTH = 280;
-export declare const FOLDERS_TREE_PANEL_MAX_WIDTH = 460;
 export declare const AG_GRID_SELECTION_COLUMN_ID = "ag-Grid-SelectionColumn";
 export declare const COMPACT_VIEW_HEADER_HEIGHT = 44;
 export declare const COMPACT_VIEW_FILE_ROW_HEIGHT = 56;

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

@@ -1,7 +1,7 @@
-import { TabModel } from '@epam/ai-dial-ui-kit';
+import { FilterChipItem } from '@epam/ai-dial-ui-kit';
 import { DialFileManagerTabs } from '../../../types/file-manager';
 export declare const useDialFileManagerTabs: (tabLabels?: Record<DialFileManagerTabs, string>, initialTab?: DialFileManagerTabs) => {
     activeTab: DialFileManagerTabs;
     handleTabChange: (tab: DialFileManagerTabs) => void;
-    tabs: TabModel[] | undefined;
+    tabs: FilterChipItem<DialFileManagerTabs>[] | undefined;
 };

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

@@ -65,6 +65,5 @@ export declare const splitPathAndName: (fullPath: string) => {
 };
 export declare const isFileSelectable: (file: Pick<DialFile, "contentLength" | "contentType" | "name">, allowedFileTypes?: DialFileAcceptType[], maxSelectableFileSize?: number) => boolean;
 export declare const getRowTooltip: (file: FileManagerGridRow, allowedFileTypes?: DialFileAcceptType[], maxSelectableFileSize?: number, unsupportedFileTypeTooltip?: string, fileTooLargeTooltip?: string) => string | undefined;
-export declare const baseColumnComparator: (a: string | number | undefined, b: string | number | undefined, _nodeA?: unknown, _nodeB?: unknown, isInverted?: boolean) => number;
 export declare const getFolderNestingDepth: (folderPath: string) => number;
 export declare const getNextFolderName: (existingFolders: DialFile[]) => string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epam/ai-dial-react-file-manager",
-  "version": "0.3.0-dev.2",
+  "version": "0.3.0-dev.4",
   "type": "module",
   "license": "Apache-2.0",
   "description": "React file manager package for AI DIAL interfaces",
@@ -78,11 +78,10 @@
   },
   "dependencies": {
     "@tabler/icons-react": "^3.41.1",
-    "classnames": "^2.5.1",
     "mime-types": "^3.0.2"
   },
   "peerDependencies": {
-    "@epam/ai-dial-ui-kit": "^0.15.0-dev.0",
+    "@epam/ai-dial-ui-kit": "^0.15.0-dev.11",
     "ag-grid-community": "^35.2.1",
     "ag-grid-react": "^35.2.1",
     "react": "^19.2.5",
@@ -90,7 +89,7 @@
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^5.1.2",
-    "@epam/ai-dial-ui-kit": "^0.15.0-dev.3",
+    "@epam/ai-dial-ui-kit": "^0.15.0-dev.11",
     "@eslint/js": "^9.39.2",
     "@floating-ui/react": "^0.27.19",
     "@storybook/addon-a11y": "^10.3.6",

package/dist/src/components/FileManager/hooks/use-tree-additional-buttons.d.ts

@@ -1,22 +0,0 @@
-import { ReactNode } from 'react';
-interface useTreeAdditionalButtonsOptions {
-    additionalButtons?: ReactNode;
-    expandedPathsLength: number;
-    collapseAll: () => void;
-}
-/**
- * Provides additional action buttons for the tree component, including a
- * built-in "Collapse All" button. The hook memoizes the returned JSX to avoid
- * unnecessary re-renders and applies disabled state automatically based on
- * the number of expanded paths.
- *
- * @param {ReactNode} [additionalButtons] - Optional custom buttons rendered before the Collapse All button.
- * @param {number} expandedPathsLength - Number of currently expanded paths in the tree.
- * @param {() => void} collapseAll - Callback fired when the Collapse All button is clicked.
- *
- * @returns {{ additionalButtons: ReactNode }} - The rendered buttons fragment.
- */
-export declare const useTreeAdditionalButtons: ({ additionalButtons, expandedPathsLength, collapseAll, }: useTreeAdditionalButtonsOptions) => {
-    additionalButtons: import("react/jsx-runtime").JSX.Element;
-};
-export {};