@epam/ai-dial-ui-kit 0.8.0-rc.9 → 0.8.1

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

@@ -1,3 +1,4 @@
+import { ReactNode } from 'react';
 import { ColDef } from 'ag-grid-community';
 import { DialFile } from '../../../models/file';
 import { FileManagerRenameTriggerView, FileManagerColumnKey } from '../../../types/file-manager';
@@ -10,6 +11,9 @@ export interface FileManagerGridContext {
     renameTriggerView: FileManagerRenameTriggerView;
     sharedByMePaths?: Set<string>;
     selectedPaths?: Set<string>;
+    disabledRowIds?: Set<string>;
+    forbiddenSymbolsRegExp?: RegExp;
+    forbiddenSymbolsTooltip?: ReactNode;
     cancelFolderCreation: () => void;
     saveFolderCreation: (name: string) => Promise<void>;
     validateFolderName: (name: string) => string | null;

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

@@ -43,5 +43,6 @@ export declare const useFileUpload: ({ onUploadFiles, onValidateUpload, maxFileS
     closeUploadConflictResolution: () => void;
     handleUploadConflictReplace: () => void;
     handleUploadConflictDuplicate: () => void;
+    handleUploadConflictCancel: () => void;
     handleUploadConflictDecideForEach: (decisions: FileConflictDecision[]) => void;
 };

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

@@ -16,6 +16,7 @@ export interface UseGridContextMenuProps {
         [DialFileManagerActions.Move]?: string;
         [DialFileManagerActions.Info]?: string;
         [DialFileManagerActions.Unshare]?: string;
+        [DialFileManagerActions.RemoveAccess]?: string;
     };
     onDuplicate: (file: DialFile) => void;
     onCopy: (file: DialFile) => void;
@@ -25,12 +26,16 @@ export interface UseGridContextMenuProps {
     onDelete: (file: DialFile, parentFolderPath: string) => void;
     onInfo: (file: DialFile) => void;
     onUnshare: (file: DialFile) => void;
+    onRemoveAccess?: (file: DialFile) => void;
     sharedWithMeIds?: string[];
+    sharedByMePaths?: Set<string>;
     onAddSibling?: (file: DialFile) => void;
     onAddChild?: (file: DialFile) => void;
     onManagePermissions?: (path?: string) => void;
     onPreview?: (path?: string) => void;
     previewExtensions?: string[];
     isRenameFileAvailable?: boolean;
+    isDuplicateFolderAvailable?: boolean;
+    forbiddenSymbolsRegExp?: RegExp;
 }
-export declare const useGridContextMenu: ({ actionLabels, onDuplicate, onCopy, onMove, onDownload, onRename, onDelete, onInfo, onUnshare, sharedWithMeIds, onAddSibling, onAddChild, onManagePermissions, onPreview, previewExtensions, isRenameFileAvailable, }: UseGridContextMenuProps) => (file: DialFile) => DropdownItem[];
+export declare const useGridContextMenu: ({ actionLabels, onDuplicate, onCopy, onMove, onDownload, onRename, onDelete, onInfo, onUnshare, onRemoveAccess, sharedWithMeIds, sharedByMePaths, onAddSibling, onAddChild, onManagePermissions, onPreview, previewExtensions, isRenameFileAvailable, isDuplicateFolderAvailable, forbiddenSymbolsRegExp, }: UseGridContextMenuProps) => (file: DialFile) => DropdownItem[];

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

@@ -3,6 +3,7 @@ import { DialCopiedItem } from '../../../models/file-manager';
 export interface RenameValidationMessages {
     emptyName?: string;
     duplicateName?: string;
+    hiddenItemWarning?: string;
 }
 export declare const useItemRenaming: ({ items, onRenameValidate, validationMessages, onMoveToFiles, }: {
     items?: DialFile[];

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

@@ -6,11 +6,13 @@ export interface UseNewActionsProps {
         uploadFiles?: NewAction;
         newFolder?: NewAction;
         uploadArchive?: NewAction;
+        newItem?: NewAction;
     };
     currentFolder?: DialFile;
     onUploadFiles?: () => void;
     onCreateFolder?: () => void;
     onUploadArchive?: () => void;
+    onCreateNewItem: () => void;
     isNewButtonDisabled?: boolean;
 }
 export interface UseNewActionsResult {
@@ -18,4 +20,4 @@ export interface UseNewActionsResult {
     isNewButtonVisible: boolean;
     isNewButtonDisabled: boolean;
 }
-export declare const useNewActions: ({ newActions, currentFolder, onUploadFiles, onCreateFolder, onUploadArchive, isNewButtonDisabled: isNewButtonDisabledExternal, }: UseNewActionsProps) => UseNewActionsResult;
+export declare const useNewActions: ({ newActions, currentFolder, onUploadFiles, onCreateFolder, onUploadArchive, onCreateNewItem, isNewButtonDisabled: isNewButtonDisabledExternal, }: UseNewActionsProps) => UseNewActionsResult;

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

@@ -1,5 +1,6 @@
 import { DialFile } from '../../models/file';
 import { DialFileAcceptType } from '../../models/file-manager';
+import { ReactNode } from 'react';
 export declare const findNodeByPath: (nodes: DialFile[] | undefined, path: string) => DialFile | undefined;
 export declare const findFolderForPath: (root: DialFile[] | undefined, path?: string) => DialFile | undefined;
 export declare const normalizeToLowerCase: (input?: string) => string;
@@ -39,3 +40,8 @@ export declare const formatBytes: (bytes?: number) => string;
  */
 export declare const formatDate: (date?: string, locale?: Intl.LocalesArgument, options?: Intl.DateTimeFormatOptions) => string;
 export declare function isFileAccepted(allowedFileTypes: DialFileAcceptType[] | undefined, contentType: string, fileName?: string): boolean;
+export declare const cleanForbiddenSymbolsRegExp: (forbiddenSymbolsRegExp?: RegExp) => RegExp | undefined;
+export declare function getForbiddenSymbolsTooltip(item: {
+    name: string;
+    isFolder: boolean;
+}, forbiddenSymbolsRegExp?: RegExp, forbiddenSymbolsTooltip?: ReactNode): ReactNode | undefined;

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

@@ -1,11 +1,16 @@
 import { FC, ReactNode } from 'react';
 export interface DialFileNameProps {
     name: string;
+    fileExtension?: string;
     className?: string;
     shared?: boolean;
     iconSize?: number;
     details?: ReactNode;
     sharedIndicatorClassName?: string;
+    sharedIndicatorTooltip?: ReactNode;
+    hideTooltip?: boolean;
+    isInvalidName?: boolean;
+    tooltipContent?: ReactNode;
 }
 /**
  * Component to display a file name with a file icon and shared indicator.
@@ -32,5 +37,10 @@ export interface DialFileNameProps {
  * @param iconSize - Icon size in px. Default: BASE_ICON_SIZE.
  * @param details - Optional metadata block displayed under the file name (e.g., size, modified date).
  * @param sharedIndicatorClassName - Additional CSS classes for the shared indicator.
+ * @param sharedIndicatorTooltip - Custom tooltip content for the shared indicator; defaults to "Shared"
+ * @param isInvalidName - If true, applies disabled styling to indicate the file name has invalid characters.
+ * @param tooltipContent - Custom tooltip content to show when the name is truncated; defaults to showing the full name.
+
+
  */
 export declare const DialFileName: FC<DialFileNameProps>;

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

@@ -1,4 +1,4 @@
-import { FC } from 'react';
+import { FC, ReactNode } from 'react';
 export interface DialFolderNameProps {
     name: string;
     shared?: boolean;
@@ -6,6 +6,10 @@ export interface DialFolderNameProps {
     iconSize?: number;
     className?: string;
     sharedIndicatorClassName?: string;
+    sharedIndicatorTooltip?: ReactNode;
+    hideTooltip?: boolean;
+    isInvalidName?: boolean;
+    tooltipContent?: ReactNode;
 }
 /**
  * Component to display a folder name with a folder icon and shared indicator.
@@ -22,5 +26,9 @@ export interface DialFolderNameProps {
  * @param loading - If true, shows loading state. Default: false.
  * @param iconSize - Icon size in px. Default: BASE_ICON_SIZE.
  * @param sharedIndicatorClassName - Additional CSS classes for the shared indicator
+ * @param sharedIndicatorTooltip - Custom tooltip content for the shared indicator; defaults to "Shared"
+ * @param isInvalidName - If true, applies disabled styling to indicate the file name has invalid characters.
+ * @param hideTooltip - If true, disables the tooltip even if the name is truncated.
+ * @param tooltipContent - Custom tooltip content to show when the name is truncated; defaults to showing the full name.
  */
 export declare const DialFolderName: FC<DialFolderNameProps>;

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

@@ -25,6 +25,7 @@ export interface DialGridProps<T extends object = Record<string, unknown>> {
     wrapperBorder?: boolean;
     withoutHeaderBorders?: boolean;
     selectionMode?: GridSelectionMode;
+    allowDisabledContextMenu?: boolean;
 }
 /**
  * DialGrid — A feature-rich data grid wrapper built on ag-Grid with dark theme support.
@@ -114,5 +115,6 @@ export interface DialGridProps<T extends object = Record<string, unknown>> {
  * @param [wrapperBorder=true] - Whether to apply a border around the grid container
  * @param [withoutHeaderBorders=false] - Whether to hide the header row borders
  * @param [selectionMode] - Could be GridSelectionMode.MULTIPLE or GridSelectionMode.SINGLE to enable selection column
+ * @param [allowDisabledContextMenu] - Enables context menu actions even if row itself is disabled for selection
  */
-export declare const DialGrid: <T extends object>({ columnDefs, rowData, additionalGridOptions, getContextMenuItems, className, ariaLabel, wrapCustomCellRenderers, disabledRowIds, selectedRowIds, selectionOnHover, onSelectionChange, onGridApiChange, getRowId, alternateOddRowColors, filterPlaceholder, emptyStateIcon, emptyStateTitle, emptyStateDescription, loading, wrapperBorder, withoutHeaderBorders, selectionMode, }: DialGridProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const DialGrid: <T extends object>({ columnDefs, rowData, additionalGridOptions, getContextMenuItems, className, ariaLabel, wrapCustomCellRenderers, disabledRowIds, selectedRowIds, selectionOnHover, onSelectionChange, onGridApiChange, getRowId, alternateOddRowColors, filterPlaceholder, emptyStateIcon, emptyStateTitle, emptyStateDescription, loading, wrapperBorder, withoutHeaderBorders, allowDisabledContextMenu, selectionMode, }: DialGridProps<T>) => import("react/jsx-runtime").JSX.Element;

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

@@ -7,6 +7,7 @@ export interface DialDateCellRendererProps extends Partial<ICellRendererParams<R
     options?: Intl.DateTimeFormatOptions;
     emptyPlaceholder?: string;
     className?: string;
+    hideTooltip?: boolean;
 }
 /**
  * Minimal date cell renderer (ag-Grid compatible).

package/dist/src/components/Input/Button/constants.d.ts

@@ -1 +1 @@
-export declare const inputButtonClassName = "bg-layer-4 px-3 enabled:text-secondary enabled:hover:text-accent-primary enabled:active:bg-controls-accent-primary-alpha-active enabled:hover:bg-accent-primary-alpha enabled:active:text-accent-primary";
+export declare const inputButtonClassName = "bg-layer-4 flex items-center justify-center enabled:text-secondary enabled:hover:text-accent-primary enabled:active:bg-controls-accent-primary-alpha-active enabled:hover:bg-accent-primary-alpha enabled:active:text-accent-primary";

package/dist/src/components/LoadFileArea/EmptyFileArea.d.ts

@@ -6,12 +6,15 @@ export interface DialEmptyFileAreaProps {
     acceptTypes: string;
     maxFilesCount?: number;
     maxFileSize?: number;
+    maxMultiFilesSize?: number;
     multiple?: boolean;
     fileFormatError?: string;
     fileCountError?: string;
     fileSizeError?: string;
+    multiFilesSizeError?: string;
     getIsFileFormatError?: (fileItems: File[] | DataTransferItem[]) => boolean;
     getIsFileSizeError?: (fileItems: File[] | DataTransferItem[]) => boolean;
+    getIsMultiFilesSizeError?: (fileItems: File[] | DataTransferItem[]) => boolean;
     onChange: (files: File[]) => void;
 }
 /**

package/dist/src/components/LoadFileArea/LoadFileAreaField.d.ts

@@ -1,10 +1,11 @@
-import { FC } from 'react';
+import { FC, ReactNode } from 'react';
 import { DialLoadFileAreaProps } from './LoadFileArea';
 export interface DialLoadFileAreaFieldProps extends DialLoadFileAreaProps {
     fieldTitle: string;
     elementId: string;
     deleteAllButtonLabel?: string;
     addButtonLabel?: string;
+    additionalActionButtons?: ReactNode;
 }
 /**
  * A composite file upload field that combines a label, file list management,
@@ -46,6 +47,7 @@ export interface DialLoadFileAreaFieldProps extends DialLoadFileAreaProps {
  * @param {string} [props.acceptTypes] - Comma-separated list of allowed MIME types or file extensions.
  * @param {string} [props.deleteAllButtonLabel] - Label for the "Delete All" button shown when files exist.
  * @param {string} [props.addButtonLabel] - Label for the "Add" button used to select additional files.
+ * @param {ReactNode} [props.additionalActionButtons] - Optional custom buttons/content rendered next to default action buttons.
  * @param {object} [props.props] - Additional props passed to the underlying `DialLoadFileArea`.
  *
  * @returns {JSX.Element} A file upload field with label, action buttons, and a drag-and-drop area.

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

@@ -9,12 +9,14 @@ export interface DialPopupProps {
     titleClassName?: string;
     headerClassName?: string;
     dividers?: boolean;
+    dividerFooter?: boolean;
     children?: ReactNode;
     footer?: ReactNode;
     onClose?: (e?: MouseEvent<HTMLButtonElement> | null) => void;
     size?: PopupSize;
     hideClose?: boolean;
     closeOnOutsideClick?: boolean;
+    preventKeyboardOnOpen?: boolean;
 }
 /**
  * An accessible modal dialog component using Floating UI.
@@ -48,11 +50,13 @@ export interface DialPopupProps {
  * @param [titleClassName] - Additional CSS classes applied to the title element
  * @param [headerClassName] - Additional CSS classes applied to the popup header container
  * @param [dividers=true] - Whether to render separators between sections
+ * @param [dividerFooter=true] - Whether to render a divider above the footer when `dividers` is true
  * @param [children] - Body content
  * @param [footer] - Footer area for actions
  * @param [onClose] - Callback fired when the popup requests to close
  * @param [size=PopupSize.Md] - Sets the max-width of the popup
  * @param [hideClose=false] Whether the close button is hidden in the header (default: false)
  * @param [closeOnOutsideClick=true] - Whether the popup closes when clicking outside (default: true)
+ * @param [preventKeyboardOnOpen=false] - When true, initial focus goes to a non-input guard to avoid opening the virtual keyboard on mobile
  */
 export declare const DialPopup: FC<DialPopupProps>;

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

@@ -5,6 +5,7 @@ export interface DialSharedEntityIndicatorProps {
     stroke?: number;
     className?: string;
     containerClassName?: string;
+    sharedIndicatorTooltip?: ReactNode;
 }
 /**
  * A compact icon-only indicator to denote a "shared" entity.
@@ -22,6 +23,7 @@ export interface DialSharedEntityIndicatorProps {
  * @param [className] - Additional Tailwind classes applied to the icon
  * @param [containerClassName] - Additional Tailwind classes appended to the container
  * @param [stroke=1.5] - Stroke width for the icon
+ * @param [sharedIndicatorTooltip] - Custom tooltip content, defaults to "Shared"
  *
  */
 export declare const DialSharedEntityIndicator: FC<DialSharedEntityIndicatorProps>;

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

@@ -8,6 +8,7 @@ export interface DialTagInputProps extends DialLabelProps {
     errorText?: string;
     invalid?: boolean;
     disabled?: boolean;
+    collapseTagOverflow?: boolean;
     onChange?: (tags: string[]) => void;
 }
 /**
@@ -36,6 +37,7 @@ export interface DialTagInputProps extends DialLabelProps {
  * @param [optional=false] - Whether the field is optional (renders an “optional” indicator).
  * @param [invalid=false] - Whether the field should be styled as invalid.
  * @param [disabled=false] - Whether the input and remove buttons are disabled.
+ * @param [collapseTagOverflow=false] - When true, keeps tags on one line and shows `+N` for overflow.
  * @param [onChange] - Callback fired whenever the tag list changes (tag added or removed).
  */
 export declare const DialTagInput: FC<DialTagInputProps>;

package/dist/src/constants/icon.d.ts

@@ -1,3 +1,8 @@
+export declare enum DIAL_ICON_SIZE {
+    LG = 24,
+    MD = 20,
+    SM = 16
+}
 export declare const BASE_ICON_SIZE = 18;
 export declare const BASE_ICON_PROPS: {
     size: number;

package/dist/src/constants/validation.d.ts

@@ -0,0 +1,4 @@
+export declare const NOT_ALLOWED_SYMBOLS = ":;,=/{}%&\\\"";
+export declare const NOT_ALLOWED_SPACES = "(\r\n|\n|\r|\t)|[\0-\u001F]";
+export declare const NOT_ALLOWED_SYMBOLS_REGEXP: RegExp;
+export declare const NOT_ALLOWED_SPACES_REGEXP: RegExp;

package/dist/src/index.d.ts

@@ -56,6 +56,7 @@ export { DialLoadFileAreaField } from './components/LoadFileArea/LoadFileAreaFie
 export { DialDropdown } from './components/Dropdown/Dropdown';
 export { DialButtonDropdown } from './components/ButtonDropdown/ButtonDropdown';
 export { DialFileManager } from './components/FileManager/FileManager';
+export type { GridOptions, ToolbarOptions, BulkActionsToolbarOptions, } from './components/FileManager/FileManager';
 export { DialDestinationFolderPopup } from './components/FileManager/components/DestinationFolderPopup/DestinationFolderPopup';
 export { AlertVariant } from './types/alert';
 export { ButtonVariant, ButtonAppearance } from './types/button';
@@ -92,3 +93,5 @@ export { GridSelectionMode } from './models/selection-mode';
 export { mergeClasses } from './utils/merge-classes';
 export { wrapInRootFolder } from './utils/flat-to-hierarchy-convertor.ts';
 export { NAME_COLUMN, SIZE_COLUMN, UPDATED_AT_COLUMN, } from './constants/file-grid-columns';
+export type { DIAL_ICON_SIZE } from './constants/icon.ts';
+export { NOT_ALLOWED_SYMBOLS, NOT_ALLOWED_SPACES, NOT_ALLOWED_SYMBOLS_REGEXP, NOT_ALLOWED_SPACES_REGEXP, } from './constants/validation.ts';

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

@@ -14,6 +14,7 @@ export declare enum DialFileManagerActions {
     Rename = "rename",
     Info = "info",
     Unshare = "unshare",
+    RemoveAccess = "removeAccess",
     ManagePermissions = "managePermissions",
     Preview = "preview"
 }
@@ -42,5 +43,6 @@ export declare enum FileManagerColumnKey {
     Author = "author",
     Owner = "owner",
     Path = "path",
-    Actions = "__actions"
+    Actions = "__actions",
+    Version = "version"
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epam/ai-dial-ui-kit",
-  "version": "0.8.0-rc.9",
+  "version": "0.8.1",
   "type": "module",
   "license": "Apache-2.0",
   "description": "A modern UI kit for building AI DIAL interfaces with React",
@@ -37,6 +37,7 @@
     "lint": "eslint . --ext ts,tsx --fix --report-unused-disable-directives --max-warnings 0",
     "format": "prettier --check .",
     "format-fix": "prettier --write .",
+    "typecheck": "tsc --noEmit",
     "preview": "vite preview",
     "storybook": "concurrently \"npm run storybook:css\" \"storybook dev -p 6006\"",
     "storybook:css": "tailwindcss -w -i ./src/styles/tailwind-entry.scss -o ./src/index.css",
@@ -81,10 +82,10 @@
     "@eslint/compat": "^1.3.1",
     "@eslint/eslintrc": "^3.3.1",
     "@eslint/js": "^9.31.0",
-    "@storybook/addon-a11y": "^10.1.6",
-    "@storybook/addon-docs": "^10.1.6",
-    "@storybook/addon-vitest": "^10.1.6",
-    "@storybook/react-vite": "^10.1.6",
+    "@storybook/addon-a11y": "^10.2.17",
+    "@storybook/addon-docs": "^10.2.17",
+    "@storybook/addon-vitest": "^10.2.17",
+    "@storybook/react-vite": "^10.2.17",
     "@testing-library/dom": "^10.4.0",
     "@testing-library/react": "^16.3.0",
     "@types/jsdom": "^21.1.7",
@@ -103,7 +104,7 @@
     "eslint-plugin-react": "7.37.5",
     "eslint-plugin-react-hooks": "^5.2.0",
     "eslint-plugin-react-refresh": "^0.4.20",
-    "eslint-plugin-storybook": "^10.1.6",
+    "eslint-plugin-storybook": "^10.2.17",
     "eslint-plugin-tailwindcss": "^3.18.2",
     "globals": "^16.3.0",
     "husky": "^9.1.7",
@@ -114,8 +115,8 @@
     "prettier": "3.6.2",
     "sass": "^1.89.2",
     "sass-embedded": "^1.89.2",
-    "storybook": "^10.1.6",
-    "storybook-addon-pseudo-states": "^10.1.6",
+    "storybook": "^10.2.17",
+    "storybook-addon-pseudo-states": "^10.2.17",
     "tailwindcss": "^3.4.17",
     "typescript": "~5.9.3",
     "typescript-eslint": "^8.48.0",