@epam/ai-dial-ui-kit 0.9.0-rc.2 → 0.9.0-rc.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (77) hide show
  1. package/README.md +9 -2
  2. package/dist/.cursor/hooks/post-write-verify.d.ts +1 -0
  3. package/dist/components-manifest.json +4652 -0
  4. package/dist/dial-ui-kit.cjs.js +28 -28
  5. package/dist/dial-ui-kit.es.js +13526 -13314
  6. package/dist/index.css +2 -2
  7. package/dist/mcp-server.cjs +357 -0
  8. package/dist/src/components/Alert/Alert.d.ts +1 -0
  9. package/dist/src/components/Alert/constants.d.ts +1 -1
  10. package/dist/src/components/AutocompleteInput/AutocompleteInputValue.d.ts +2 -0
  11. package/dist/src/components/Breadcrumb/Breadcrumb.d.ts +1 -0
  12. package/dist/src/components/Breadcrumb/BreadcrumbItem.d.ts +1 -1
  13. package/dist/src/components/Breadcrumb/constants.d.ts +1 -1
  14. package/dist/src/components/Button/Button.d.ts +1 -0
  15. package/dist/src/components/ButtonDropdown/ButtonDropdown.d.ts +1 -0
  16. package/dist/src/components/CaptionText/CaptionText.d.ts +1 -0
  17. package/dist/src/components/Checkbox/Checkbox.d.ts +1 -0
  18. package/dist/src/components/CloseButton/CloseButton.d.ts +1 -0
  19. package/dist/src/components/CollapsibleSidebar/CollapsibleSidebar.d.ts +2 -0
  20. package/dist/src/components/ConfirmationPopup/ConfirmationPopup.d.ts +1 -0
  21. package/dist/src/components/DraggableItem/DraggableItem.d.ts +1 -0
  22. package/dist/src/components/Dropdown/Dropdown.d.ts +2 -0
  23. package/dist/src/components/EllipsisTooltip/EllipsisTooltip.d.ts +2 -0
  24. package/dist/src/components/FileIcon/FileIcon.d.ts +1 -0
  25. package/dist/src/components/FileManager/FileManager.d.ts +17 -13
  26. package/dist/src/components/FileManager/FileManagerContext.d.ts +4 -0
  27. package/dist/src/components/FileManager/FileManagerTooltip.d.ts +11 -0
  28. package/dist/src/components/FileManager/components/DestinationFolderPopup/DestinationFolderPopup.d.ts +1 -0
  29. package/dist/src/components/FileManager/hooks/use-file-download.d.ts +2 -1
  30. package/dist/src/components/FileManager/hooks/use-file-manager-columns.d.ts +1 -0
  31. package/dist/src/components/FileManager/hooks/use-grid-context-menu.d.ts +3 -1
  32. package/dist/src/components/FileManager/utils.d.ts +3 -0
  33. package/dist/src/components/FileManager/utils.spec.d.ts +1 -0
  34. package/dist/src/components/FileName/FileName.d.ts +2 -0
  35. package/dist/src/components/FolderName/FolderName.d.ts +2 -0
  36. package/dist/src/components/FormItem/FormItem.d.ts +1 -0
  37. package/dist/src/components/FormPopup/FormPopup.d.ts +1 -0
  38. package/dist/src/components/Grid/Grid.d.ts +1 -0
  39. package/dist/src/components/Icon/Icon.d.ts +1 -0
  40. package/dist/src/components/IconButton/IconButton.d.ts +1 -0
  41. package/dist/src/components/Input/Input.d.ts +1 -0
  42. package/dist/src/components/InputPopup/InputPopup.d.ts +6 -0
  43. package/dist/src/components/Label/Label.d.ts +1 -0
  44. package/dist/src/components/LabelledText/LabelledText.d.ts +1 -0
  45. package/dist/src/components/LoadFileArea/EmptyFileArea.d.ts +3 -0
  46. package/dist/src/components/LoadFileArea/LoadFileArea.d.ts +2 -0
  47. package/dist/src/components/LoadFileArea/LoadFileAreaField.d.ts +2 -0
  48. package/dist/src/components/Loader/Loader.d.ts +1 -0
  49. package/dist/src/components/NoDataContent/NoDataContent.d.ts +1 -0
  50. package/dist/src/components/NumberInput/NumberInput.d.ts +1 -0
  51. package/dist/src/components/PasswordInput/PasswordInput.d.ts +1 -0
  52. package/dist/src/components/Popup/Popup.d.ts +1 -0
  53. package/dist/src/components/RadioButton/RadioButton.d.ts +1 -0
  54. package/dist/src/components/RadioGroup/RadioGroup.d.ts +1 -0
  55. package/dist/src/components/RadioGroupPopupField/RadioGroupPopupField.d.ts +1 -0
  56. package/dist/src/components/RemoveButton/RemoveButton.d.ts +1 -0
  57. package/dist/src/components/ResizableContainer/ConditionalResizableContainer.d.ts +1 -0
  58. package/dist/src/components/ResizableContainer/ResizableContainer.d.ts +2 -0
  59. package/dist/src/components/Search/Search.d.ts +2 -0
  60. package/dist/src/components/Select/Select.d.ts +1 -0
  61. package/dist/src/components/Select/constants.d.ts +2 -2
  62. package/dist/src/components/SelectField/SelectField.d.ts +1 -0
  63. package/dist/src/components/SharedEntityIndicator/SharedEntityIndicator.d.ts +1 -0
  64. package/dist/src/components/Skeleton/Skeleton.d.ts +1 -0
  65. package/dist/src/components/Steps/Steps.d.ts +1 -0
  66. package/dist/src/components/Switch/Switch.d.ts +1 -0
  67. package/dist/src/components/Tabs/Tabs.d.ts +2 -0
  68. package/dist/src/components/Tag/Tag.d.ts +2 -0
  69. package/dist/src/components/TagInput/TagInput.d.ts +2 -0
  70. package/dist/src/components/Textarea/Textarea.d.ts +1 -0
  71. package/dist/src/components/Tooltip/Tooltip.d.ts +1 -0
  72. package/dist/src/index.d.ts +1 -1
  73. package/dist/src/mcp/generate-manifest.d.ts +1 -0
  74. package/dist/src/mcp/server.d.ts +1 -0
  75. package/dist/src/mcp/types.d.ts +54 -0
  76. package/dist/src/types/file-manager.d.ts +4 -2
  77. package/package.json +23 -4
@@ -10,6 +10,7 @@ export interface DialCheckboxProps extends Omit<LabelHTMLAttributes<HTMLLabelEle
10
10
  }
11
11
  /**
12
12
  * A Checkbox component with styling options
13
+ * aliases: ToggleCheckbox|MultiSelectOption
13
14
  *
14
15
  * @example
15
16
  * ```tsx
@@ -8,6 +8,7 @@ export interface DialCloseButtonProps {
8
8
  }
9
9
  /**
10
10
  * A Close button component with a customizable icon and accessible label.
11
+ * aliases: DismissButton|ExitButton
11
12
  *
12
13
  * @example
13
14
  * ```tsx
@@ -13,6 +13,8 @@ export interface DialCollapsibleSidebarProps {
13
13
  }
14
14
  /**
15
15
  * A collapsible horizontal bar component that allows toggling between an expanded and collapsed state.
16
+ * aliases: ToggleSidebar|CollapsiblePanel
17
+ *
16
18
  * It supports customizable width, title, icons, additional buttons, and flexible styling options.
17
19
  *
18
20
  * @example
@@ -16,6 +16,7 @@ export interface DialConfirmationPopupProps extends DialPopupProps {
16
16
  }
17
17
  /**
18
18
  * A confirmation dialog built with DialPopup and DialButton.
19
+ * aliases: ConfirmDialog|WarningDialog
19
20
  *
20
21
  * Provides an accessible modal with a title, optional description or custom content,
21
22
  * and a footer with Cancel / Confirm actions.
@@ -9,6 +9,7 @@ export interface DialDraggableItemProps {
9
9
  }
10
10
  /**
11
11
  * A lightweight wrapper that makes its children sortable via drag-and-drop.
12
+ * aliases: SortableItem|DragHandle
12
13
  *
13
14
  * Renders a row with a grab handle (left) and the provided content (right).
14
15
  * Integrates with `react-dnd` using a simple "column" drag type and delegates
@@ -35,6 +35,8 @@ export interface DialDropdownProps {
35
35
  /**
36
36
  *
37
37
  * Renders the given trigger (`children`) and a floating contextual menu overlay.
38
+ * aliases: ContextMenu|PopupMenu
39
+ *
38
40
  * Supports click/hover/contextMenu triggers, controlled/uncontrolled open, and an optional
39
41
  * close button inside the overlay. Placement is taken directly from Floating UI; when
40
42
  * `placement` is **undefined** (default), automatic placement is handled by `autoPlacement`.
@@ -10,6 +10,8 @@ export interface DialEllipsisTooltipProps extends DialTooltipContainerOptions {
10
10
  }
11
11
  /**
12
12
  * Single-line text with CSS ellipsis that shows a tooltip **only when actually truncated**.
13
+ * aliases: TruncatedText|TruncationTooltip
14
+ *
13
15
  * If the text fits, tooltip content is empty and the popup stays hidden.
14
16
  *
15
17
  * Important: width must be finite for truncation.
@@ -10,6 +10,7 @@ export interface DialFileIconProps {
10
10
  }
11
11
  /**
12
12
  * Renders a file-type icon based on a file extension.
13
+ * aliases: ExtensionIcon|TypeIcon
13
14
  *
14
15
  * Uses DialIcon to provide consistent icon wrapper styling.
15
16
  *
@@ -1,23 +1,23 @@
1
- import { FC, ReactNode, Ref, RefObject } from 'react';
2
1
  import { ColDef, GridApi } from 'ag-grid-community';
3
- import { DialFile, DialRootFolder } from '../../models/file';
4
- import { DialFoldersTreeProps } from './components/FoldersTree/FoldersTree';
5
- import { DialFileManagerNavigationPanelProps } from './components/FileManagerNavigationPanel/FileManagerNavigationPanel';
2
+ import { FC, ReactNode, Ref, RefObject } from 'react';
3
+ import { ConflictResolutionPopupProps } from './components/ConflictResolutionPopup/ConflictResolutionPopup';
4
+ import { FileUploadValidationMessages, FileUploadValidationResult } from './hooks/use-file-upload';
5
+ import { RenameValidationMessages } from './hooks/use-item-renaming';
6
6
  import { DialGridProps } from '../Grid/Grid';
7
- import { DialFileManagerToolbarProps } from './components/FileManagerToolbar/DialFileManagerToolbar';
8
- import { DialFileManagerBulkActionsToolbarProps } from './components/FileManagerBulkActionsToolbar/FileManagerBulkActionsToolbar';
9
7
  import { DropdownItem } from '../../models/dropdown';
10
- import { DialCopiedItem, DialDeletedItem, DialUploadFileItem, DialFileManagerActionsRef, DialFileAcceptType } from '../../models/file-manager';
8
+ import { DialFile, DialRootFolder } from '../../models/file';
9
+ import { DialCopiedItem, DialDeletedItem, DialFileAcceptType, DialFileManagerActionsRef, DialUploadFileItem } from '../../models/file-manager';
10
+ import { GridSelectionMode } from '../../models/selection-mode.ts';
11
+ import { DialFileManagerActions, FileManagerColumnKey } from '../../types/file-manager';
11
12
  import { FileManagerGridRow } from './FileManagerContext';
12
13
  import { DestinationFolderPopupProps } from './components/DestinationFolderPopup/DestinationFolderPopup';
13
- import { FileUploadValidationResult, FileUploadValidationMessages } from './hooks/use-file-upload';
14
- import { DialFileManagerActions, FileManagerColumnKey } from '../../types/file-manager';
15
- import { ConflictResolutionPopupProps } from './components/ConflictResolutionPopup/ConflictResolutionPopup';
16
- import { RenameValidationMessages } from './hooks/use-item-renaming';
17
- import { GridSelectionMode } from '../../models/selection-mode.ts';
14
+ import { DialFileManagerBulkActionsToolbarProps } from './components/FileManagerBulkActionsToolbar/FileManagerBulkActionsToolbar';
15
+ import { DialFileManagerNavigationPanelProps } from './components/FileManagerNavigationPanel/FileManagerNavigationPanel';
16
+ import { DialFileManagerToolbarProps } from './components/FileManagerToolbar/DialFileManagerToolbar';
17
+ import { DialFoldersTreeProps } from './components/FoldersTree/FoldersTree';
18
18
  type GridRow = FileManagerGridRow;
19
19
  export type DialFileManagerConflictResolutionPopupOptions = Omit<ConflictResolutionPopupProps, 'open' | 'onClose' | 'onReplace' | 'onDuplicate' | 'conflictingFiles'>;
20
- export type DialFileManagerDestinationFolderPopupOptions = Pick<DestinationFolderPopupProps, 'setDestinationFolderPath' | 'destinationFolderPath' | 'addFolderLabel' | 'copyLabel' | 'moveLabel' | 'hiddenFilesSwitcherLabel' | 'header' | 'onCreateFolder' | 'onCreateFolderValidate' | 'folderCreationValidationMessages' | 'disabledPathTooltip'> & {
20
+ export type DialFileManagerDestinationFolderPopupOptions = Pick<DestinationFolderPopupProps, 'setDestinationFolderPath' | 'destinationFolderPath' | 'addFolderLabel' | 'copyLabel' | 'moveLabel' | 'hiddenFilesSwitcherLabel' | 'header' | 'onCreateFolder' | 'onCreateFolderValidate' | 'folderCreationValidationMessages' | 'disabledPathTooltip' | 'emptyStateTitle' | 'emptyStateDescription'> & {
21
21
  getCopyHeader?: (itemsCount: number, itemName?: string) => string;
22
22
  getMoveHeader?: (itemsCount: number, itemName?: string) => string;
23
23
  };
@@ -186,6 +186,7 @@ export interface DialFileManagerProps {
186
186
  onFolderPopupPathChange?: (newPath?: string) => void;
187
187
  onManagePermissions?: (path?: string) => void;
188
188
  onPreview?: (path?: string) => void;
189
+ onOpenInNewTab?: (file: DialFile) => void;
189
190
  previewExtensions?: string[];
190
191
  isRenameFileAvailable?: boolean;
191
192
  isDuplicateFolderAvailable?: boolean;
@@ -193,10 +194,13 @@ export interface DialFileManagerProps {
193
194
  customCreateNewItemAction?: (currentPath?: string, currentFolder?: DialFile) => void;
194
195
  customDuplicateAction?: (items?: DialFile[]) => void;
195
196
  customDeleteItemsAction?: (items: DialFile[], parentFolderPath: string) => void;
197
+ customDownloadItemsAction?: (items?: DialFile[]) => void;
196
198
  nonClickableTableColumns?: FileManagerColumnKey[];
199
+ hideSearchPathItemName?: boolean;
197
200
  }
198
201
  /**
199
202
  * File Manager layout with a collapsible folders tree, breadcrumb/search header, and a data grid.
203
+ * aliases: FileExplorer|FileBrowser
200
204
  *
201
205
  * Features:
202
206
  * - Global `path` drives both the breadcrumb trail and the visible folder in the grid.
@@ -14,6 +14,7 @@ export interface FileManagerGridRow {
14
14
  size?: number;
15
15
  author?: string;
16
16
  path: string;
17
+ parentPath?: string | null;
17
18
  nodeType: DialFileNodeType;
18
19
  extension?: string;
19
20
  isTemporary?: boolean;
@@ -153,6 +154,7 @@ export interface FileManagerContextValue {
153
154
  onFolderPopupPathChange?: (newPath?: string) => void;
154
155
  onManagePermissions?: (path?: string) => void;
155
156
  onPreview?: (path?: string) => void;
157
+ onOpenInNewTab?: (file: DialFile) => void;
156
158
  previewExtensions?: string[];
157
159
  isRenameFileAvailable?: boolean;
158
160
  isDuplicateFolderAvailable?: boolean;
@@ -160,9 +162,11 @@ export interface FileManagerContextValue {
160
162
  customCreateNewItemAction?: (currentPath?: string, currentFolder?: DialFile) => void;
161
163
  customDuplicateAction?: (items?: DialFile[]) => void;
162
164
  customDeleteItemsAction?: (items: DialFile[], parentFolderPath: string) => void;
165
+ customDownloadItemsAction?: (items?: DialFile[]) => void;
163
166
  nonClickableTableColumns?: FileManagerColumnKey[];
164
167
  getDisabledTooltip?: (row: FileManagerGridRow) => string | undefined;
165
168
  fileTooLargeTooltip?: string;
166
169
  unsupportedFileTypeTooltip?: string;
170
+ hideSearchPathItemName?: boolean;
167
171
  }
168
172
  export declare const FileManagerContext: import('react').Context<FileManagerContextValue | undefined>;
@@ -0,0 +1,11 @@
1
+ import { FileManagerGridRow } from './FileManagerContext';
2
+ interface FileManagerTooltipProps {
3
+ disabledGridRowIds: Set<string>;
4
+ gridRows: FileManagerGridRow[];
5
+ getDisabledTooltip?: (row: FileManagerGridRow) => string | undefined;
6
+ getRowDisabledTooltip: (row: FileManagerGridRow, allowedFileTypes?: string[], maxSelectableFileSize?: number) => string | undefined;
7
+ allowedFileTypes?: string[];
8
+ maxSelectableFileSize?: number;
9
+ }
10
+ export declare const FileManagerTooltip: ({ disabledGridRowIds, gridRows, getDisabledTooltip, getRowDisabledTooltip, allowedFileTypes, maxSelectableFileSize, }: FileManagerTooltipProps) => import("react/jsx-runtime").JSX.Element;
11
+ export {};
@@ -21,6 +21,7 @@ export interface DestinationFolderPopupProps extends DialFileManagerProps {
21
21
  }
22
22
  /**
23
23
  * DestinationFolderPopup
24
+ * aliases: FolderSelector|PathChooser
24
25
  *
25
26
  * A popup dialog for selecting a destination folder when copying or moving files.
26
27
  * Displays a File Manager interface with a footer containing action buttons and
@@ -1,8 +1,9 @@
1
1
  import { DialFile } from '../../../models/file';
2
2
  export interface UseFileDownloadOptions {
3
3
  onDownloadFiles?: (items: DialFile[]) => void;
4
+ customDownloadItemsAction?: (items: DialFile[]) => void;
4
5
  onDownloadSuccess?: () => void;
5
6
  }
6
- export declare const useFileDownload: ({ onDownloadFiles, onDownloadSuccess, }: UseFileDownloadOptions) => {
7
+ export declare const useFileDownload: ({ onDownloadFiles, customDownloadItemsAction, onDownloadSuccess, }: UseFileDownloadOptions) => {
7
8
  handleDownloadFiles: (items: DialFile[]) => void;
8
9
  };
@@ -21,6 +21,7 @@ export interface FileManagerGridContext {
21
21
  onRenameSave: (value: string) => void;
22
22
  onRenameCancel: () => void;
23
23
  getDisplayName: (item: DialFile) => string;
24
+ hideSearchPathItemName?: boolean;
24
25
  }
25
26
  export interface UseFileManagerColumnsArgs {
26
27
  userColumnDefs?: (ColDef<GridRow> | ((dateLocale: Intl.LocalesArgument, dateOptions: Intl.DateTimeFormatOptions | undefined, isCompactView: boolean) => ColDef<GridRow, unknown>))[];
@@ -17,6 +17,7 @@ export interface UseGridContextMenuProps {
17
17
  [DialFileManagerActions.Info]?: string;
18
18
  [DialFileManagerActions.Unshare]?: string;
19
19
  [DialFileManagerActions.RemoveAccess]?: string;
20
+ [DialFileManagerActions.OpenInNewTab]?: string;
20
21
  };
21
22
  onDuplicate: (file: DialFile) => void;
22
23
  onCopy: (file: DialFile) => void;
@@ -33,9 +34,10 @@ export interface UseGridContextMenuProps {
33
34
  onAddChild?: (file: DialFile) => void;
34
35
  onManagePermissions?: (path?: string) => void;
35
36
  onPreview?: (path?: string) => void;
37
+ onOpenInNewTab?: (file: DialFile) => void;
36
38
  previewExtensions?: string[];
37
39
  isRenameFileAvailable?: boolean;
38
40
  isDuplicateFolderAvailable?: boolean;
39
41
  forbiddenSymbolsRegExp?: RegExp;
40
42
  }
41
- 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[];
43
+ export declare const useGridContextMenu: ({ actionLabels, onDuplicate, onCopy, onMove, onDownload, onRename, onDelete, onInfo, onUnshare, onRemoveAccess, sharedWithMeIds, sharedByMePaths, onAddSibling, onAddChild, onManagePermissions, onPreview, onOpenInNewTab, previewExtensions, isRenameFileAvailable, isDuplicateFolderAvailable, forbiddenSymbolsRegExp, }: UseGridContextMenuProps) => (file: DialFile) => DropdownItem[];
@@ -1,6 +1,7 @@
1
1
  import { DialFile } from '../../models/file';
2
2
  import { DialFileAcceptType } from '../../models/file-manager';
3
3
  import { ReactNode } from 'react';
4
+ import { FileManagerGridRow } from './FileManagerContext';
4
5
  export declare const findNodeByPath: (nodes: DialFile[] | undefined, path: string) => DialFile | undefined;
5
6
  export declare const findFolderForPath: (root: DialFile[] | undefined, path?: string) => DialFile | undefined;
6
7
  export declare const normalizeToLowerCase: (input?: string) => string;
@@ -40,8 +41,10 @@ export declare const formatBytes: (bytes?: number) => string;
40
41
  */
41
42
  export declare const formatDate: (date?: string, locale?: Intl.LocalesArgument, options?: Intl.DateTimeFormatOptions) => string;
42
43
  export declare function isFileAccepted(allowedFileTypes: DialFileAcceptType[] | undefined, contentType: string, fileName?: string): boolean;
44
+ export declare const formatAllowedFileTypesForTooltip: (allowedFileTypes: DialFileAcceptType[] | undefined) => string;
43
45
  export declare const cleanForbiddenSymbolsRegExp: (forbiddenSymbolsRegExp?: RegExp) => RegExp | undefined;
44
46
  export declare function getForbiddenSymbolsTooltip(item: {
45
47
  name: string;
46
48
  isFolder: boolean;
47
49
  }, forbiddenSymbolsRegExp?: RegExp, forbiddenSymbolsTooltip?: ReactNode): ReactNode | undefined;
50
+ export declare const getRowTooltip: (file: FileManagerGridRow, allowedFileTypes?: string[], maxSelectableFileSize?: number, unsupportedFileTypeTooltip?: string, fileTooLargeTooltip?: string) => string | undefined;
@@ -0,0 +1 @@
1
+ export {};
@@ -14,6 +14,8 @@ export interface DialFileNameProps {
14
14
  }
15
15
  /**
16
16
  * Component to display a file name with a file icon and shared indicator.
17
+ * aliases: FileDisplay|NameDisplay
18
+ *
17
19
  * Handles long names with ellipsis and tooltip.
18
20
  *
19
21
  * If `details` is provided (e.g., file size, date), the component switches to
@@ -13,6 +13,8 @@ export interface DialFolderNameProps {
13
13
  }
14
14
  /**
15
15
  * Component to display a folder name with a folder icon and shared indicator.
16
+ * aliases: FolderDisplay|DirectoryName
17
+ *
16
18
  * Handles long names with ellipsis and tooltip.
17
19
  *
18
20
  * @example
@@ -13,6 +13,7 @@ export interface DialFormItemProps extends DialFormItemBaseProps {
13
13
  }
14
14
  /**
15
15
  * A layout wrapper for form controls with label, helper text and error message.
16
+ * aliases: FieldWrapper|FormControl
16
17
  *
17
18
  * Uses `DialLabel` for the label and `DialErrorText` for consistent error styling.
18
19
  * Wires accessibility with:
@@ -12,6 +12,7 @@ export interface DialFormPopupProps extends DialPopupProps {
12
12
  }
13
13
  /**
14
14
  * A form-oriented popup dialog.
15
+ * aliases: FormDialog|FormModal
15
16
  *
16
17
  * Provides an accessible popup with a title, custom body,
17
18
  * and a footer with "Cancel" and "Submit" actions.
@@ -29,6 +29,7 @@ export interface DialGridProps<T extends object = Record<string, unknown>> {
29
29
  }
30
30
  /**
31
31
  * DialGrid — A feature-rich data grid wrapper built on ag-Grid with dark theme support.
32
+ * aliases: DataTable|TableGrid
32
33
  *
33
34
  * Provides a pre-configured grid with:
34
35
  * - Dark theme styling with CSS variable integration
@@ -5,6 +5,7 @@ export interface DialIconProps {
5
5
  }
6
6
  /**
7
7
  * A wrapper component for rendering icons with consistent styling
8
+ * aliases: IconRenderer|SVGWrapper
8
9
  *
9
10
  * @example
10
11
  * ```tsx
@@ -12,6 +12,7 @@ export interface DialIconButtonProps extends DetailedHTMLProps<ButtonHTMLAttribu
12
12
  }
13
13
  /**
14
14
  * A Icon Button component with flexible icon and text positioning
15
+ * aliases: IconicButton|SymbolButton
15
16
  *
16
17
  * @example
17
18
  * ```tsx
@@ -18,6 +18,7 @@ export interface DialInputProps extends Omit<InputHTMLAttributes<HTMLInputElemen
18
18
  }
19
19
  /**
20
20
  * A flexible input component with icon support and various styling options
21
+ * aliases: TextField|FormInput
21
22
  *
22
23
  * @example
23
24
  * ```tsx
@@ -12,9 +12,13 @@ export interface DialInputPopupProps {
12
12
  errorText?: string;
13
13
  invalid?: boolean;
14
14
  emptyValueText?: string;
15
+ editable?: boolean;
16
+ onValueChange?: (value: string) => void;
15
17
  }
16
18
  /**
17
19
  * An input field that opens a popup when clicked, displaying a selected value or a list of values.
20
+ * aliases: PopupInput|ReadonlyInput
21
+ *
18
22
  * It supports read-only mode, error states, and disabled state, with customizable styling.
19
23
  * The modal content is rendered using a portal for seamless integration.
20
24
  *
@@ -47,5 +51,7 @@ export interface DialInputPopupProps {
47
51
  * @param [errorText] - An optional error message displayed below the input when an error state is present.
48
52
  * @param [invalid] - Whether the input is in an invalid state, affecting styling. Applied automatically if errorText is provided.
49
53
  * @param [emptyValueText] - The text displayed when no value is selected and placeholder is not provided.
54
+ * @param [editable=false] - When true, the input area becomes an editable text field; only the icon opens the popup.
55
+ * @param [onValueChange] - Callback fired when the user types in the editable input.
50
56
  */
51
57
  export declare const DialInputPopup: FC<DialInputPopupProps>;
@@ -7,6 +7,7 @@ export interface DialLabelProps extends NativeLabelProps {
7
7
  }
8
8
  /**
9
9
  * A label component
10
+ * aliases: FormLabel|RequiredIndicator
10
11
  *
11
12
  * @example
12
13
  * ```tsx
@@ -9,6 +9,7 @@ export interface DialLabelledTextProps {
9
9
  }
10
10
  /**
11
11
  * A label component for form fields with optional tooltip, content, and custom elements.
12
+ * aliases: LabelValue|DisplayText
12
13
  *
13
14
  * @example
14
15
  * ```tsx
@@ -6,12 +6,15 @@ export interface DialEmptyFileAreaProps {
6
6
  acceptTypes: string;
7
7
  maxFilesCount?: number;
8
8
  maxFileSize?: number;
9
+ maxMultiFilesSize?: number;
9
10
  multiple?: boolean;
10
11
  fileFormatError?: string;
11
12
  fileCountError?: string;
12
13
  fileSizeError?: string;
14
+ multiFilesSizeError?: string;
13
15
  getIsFileFormatError?: (fileItems: File[] | DataTransferItem[]) => boolean;
14
16
  getIsFileSizeError?: (fileItems: File[] | DataTransferItem[]) => boolean;
17
+ getIsMultiFilesSizeError?: (fileItems: File[] | DataTransferItem[]) => boolean;
15
18
  onChange: (files: File[]) => void;
16
19
  }
17
20
  /**
@@ -10,6 +10,8 @@ export interface DialLoadFileAreaProps extends DialEmptyFileAreaProps {
10
10
  }
11
11
  /**
12
12
  * A drag-and-drop file upload area component that allows users to upload files
13
+ * aliases: FileDropZone|DragDropUpload
14
+ *
13
15
  * either by dragging them into the area or by selecting them through the file picker.
14
16
  * Displays helpful text, button prompts, and validation errors for file format or count limits.
15
17
  *
@@ -9,6 +9,8 @@ export interface DialLoadFileAreaFieldProps extends DialLoadFileAreaProps {
9
9
  }
10
10
  /**
11
11
  * A composite file upload field that combines a label, file list management,
12
+ * aliases: UploadField|FileListField
13
+ *
12
14
  * and a drag-and-drop upload area. Allows users to add, remove, and validate files
13
15
  * with customizable restrictions on file types and count.
14
16
  *
@@ -8,6 +8,7 @@ export interface DialLoaderProps {
8
8
  }
9
9
  /**
10
10
  * A simple loading spinner component.
11
+ * aliases: LoadingSpinner|ProgressSpinner
11
12
  *
12
13
  * Renders a spinning SVG with optional full-width container.
13
14
  *
@@ -9,6 +9,7 @@ export interface DialNoDataContentProps {
9
9
  }
10
10
  /**
11
11
  * A component for displaying a message and icon when there is no data to show.
12
+ * aliases: EmptyState|NoResults
12
13
  *
13
14
  * @example
14
15
  * ```tsx
@@ -5,6 +5,7 @@ export interface DialNumberInputProps extends Omit<DialInputProps, 'onChange'> {
5
5
  }
6
6
  /**
7
7
  * A number input field component
8
+ * aliases: NumericField|NumberField
8
9
  *
9
10
  * @example
10
11
  * ```tsx
@@ -2,6 +2,7 @@ import { FC } from 'react';
2
2
  import { DialInputProps } from '../Input/Input';
3
3
  /**
4
4
  * A password input component with show/hide functionality and customizable props.
5
+ * aliases: SecureInput|ToggleablePassword
5
6
  *
6
7
  * @example
7
8
  * ```tsx
@@ -20,6 +20,7 @@ export interface DialPopupProps {
20
20
  }
21
21
  /**
22
22
  * An accessible modal dialog component using Floating UI.
23
+ * aliases: Modal|Dialog
23
24
  *
24
25
  * Renders in a portal with a scrim overlay, focus management, header with a title,
25
26
  * content area, optional footer and a close control.
@@ -15,6 +15,7 @@ export interface DialRadioButtonProps {
15
15
  }
16
16
  /**
17
17
  * A stylized, accessible radio input with optional description.
18
+ * aliases: ChoiceOption|RadioInput
18
19
  *
19
20
  * Renders a native `<input type="radio" />` paired with a label. When `checked`
20
21
  * and `description` are provided, a supporting text block appears under the control.
@@ -22,6 +22,7 @@ export interface DialRadioGroupProps {
22
22
  }
23
23
  /**
24
24
  * Groups multiple `DialRadio` options and renders custom content for the active option.
25
+ * aliases: SelectionGroup|OptionGroup
25
26
  *
26
27
  * Uses `DialField` as the field label and a container with `role="radiogroup"`.
27
28
  * Content provided in `radioButtons[].content` is shown under the currently active radio.
@@ -17,6 +17,7 @@ export interface RadioGroupPopupFieldProps extends Pick<DialLabelProps, 'label'
17
17
  }
18
18
  /**
19
19
  * A composite field that opens a popup with a radio group selector.
20
+ * aliases: PopupRadio|ChoicePopup
20
21
  *
21
22
  * Renders a labeled readout using `DialInputPopup`; when opened, a `DialPopup`
22
23
  * displays a `DialRadioGroup` allowing the user to pick from a list of options.
@@ -5,6 +5,7 @@ export interface DialRemoveButtonProps extends Omit<DialButtonProps, 'iconBefore
5
5
  }
6
6
  /**
7
7
  * A specialized button component for removal or delete actions.
8
+ * aliases: DeleteButton|TrashButton
8
9
  *
9
10
  * Renders a `DialErrorButton` with a predefined trash icon (`IconTrashX`) as the leading icon.
10
11
  * Additional props are passed directly to the underlying `DialErrorButton`.
@@ -5,6 +5,7 @@ export interface DialConditionalResizableContainerProps extends DialResizableCon
5
5
  }
6
6
  /**
7
7
  * DialConditionalResizableContainer — A conditional wrapper around `DialResizableContainer`.
8
+ * aliases: OptionalResize|ConditionalPanel
8
9
  *
9
10
  * This component renders its children inside a resizable container only when `enabled` is true.
10
11
  * When `enabled` is false, children are rendered directly without any resizable behavior.
@@ -14,6 +14,8 @@ export interface DialResizableContainerProps {
14
14
  }
15
15
  /**
16
16
  * DialResizableContainer — A reusable resizable container
17
+ * aliases: ResizePanel|SizableContainer
18
+ *
17
19
  * supporting both **controlled** and **uncontrolled** width modes.
18
20
  *
19
21
  * Controlled Mode
@@ -7,6 +7,8 @@ export interface DialSearchProps extends Omit<DialInputProps, 'type' | 'size' |
7
7
  }
8
8
  /**
9
9
  * A search input component with a customizable placeholder, icons, flexible props, and the ability
10
+ * aliases: SearchField|QueryInput
11
+ *
10
12
  * to clear the input value via a clear button. Supports multiple sizes for flexible layouts.
11
13
  *
12
14
  * @example
@@ -37,6 +37,7 @@ export interface DialSelectProps {
37
37
  }
38
38
  /**
39
39
  * A versatile select supporting single and multiple selections.
40
+ * aliases: OptionPicker|ChoiceSelector
40
41
  *
41
42
  * Single mode mirrors the legacy visual:
42
43
  * - Trigger shows the selected option's leading icon + label.
@@ -1,6 +1,6 @@
1
- export declare const selectTriggerBaseClassName = "dial-input flex w-full items-center justify-between gap-2 dial-small cursor-pointer";
1
+ export declare const selectTriggerBaseClassName = "dial-input flex w-full items-center justify-between gap-2 dial-small-text cursor-pointer";
2
2
  export declare const selectOverlayBaseClassName = "w-full rounded flex flex-col";
3
- export declare const selectOptionBaseClassName = "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";
3
+ export declare const selectOptionBaseClassName = "flex w-full items-center justify-between gap-2 px-3 h-[34px] dial-small-text text-primary truncate hover:bg-accent-primary-alpha focus:bg-accent-primary-alpha focus:outline-none";
4
4
  export declare const selectOptionSelectedClassName = "bg-accent-primary-alpha";
5
5
  export declare const selectOptionSingleSelectedClassName = "bg-accent-primary-alpha border-l border-accent-primary border-1";
6
6
  export declare const selectOptionDisabledClassName = "opacity-75";
@@ -8,6 +8,7 @@ export interface DialSelectFieldProps extends Omit<DialSelectProps, 'className'
8
8
  }
9
9
  /**
10
10
  * A Select field wrapper that composes `DialFormItem` and `DialSelect`.
11
+ * aliases: SelectInput|ComboField
11
12
  *
12
13
  * Provides unified label, description, error rendering and a readonly view that shows
13
14
  * the selected option labels (comma-separated in single mode, list in multiple).
@@ -9,6 +9,7 @@ export interface DialSharedEntityIndicatorProps {
9
9
  }
10
10
  /**
11
11
  * A compact icon-only indicator to denote a "shared" entity.
12
+ * aliases: SharedIcon|AccessIndicator
12
13
  *
13
14
  * Renders a small arrow-up-right icon with token-based colors.
14
15
  *
@@ -21,6 +21,7 @@ export interface DialSkeletonProps extends HTMLAttributes<HTMLDivElement> {
21
21
  }
22
22
  /**
23
23
  * DialSkeleton
24
+ * aliases: PlaceholderUI|ShimmerLoader
24
25
  *
25
26
  * A placeholder component to show while content is loading.
26
27
  * Provides various skeleton shapes and configurations.
@@ -7,6 +7,7 @@ export interface DialStepsProps {
7
7
  }
8
8
  /**
9
9
  * Props for the DialSteps component, which renders a multi-step navigation UI.
10
+ * aliases: StepWizard|ProgressSteps
10
11
  *
11
12
  * @example
12
13
  * ```tsx
@@ -9,6 +9,7 @@ export interface DialSwitchProps {
9
9
  }
10
10
  /**
11
11
  * A Switch component with various styling options
12
+ * aliases: ToggleSwitch|BinaryToggle
12
13
  *
13
14
  * @example
14
15
  * ```tsx
@@ -14,6 +14,8 @@ export interface DialTabsProps {
14
14
  }
15
15
  /**
16
16
  * A responsive and overflow-aware tabs component that automatically adapts its layout
17
+ * aliases: TabNavigation|TabBar
18
+ *
17
19
  * between a scrollable tab bar and a dropdown menu on smaller screens.
18
20
  *
19
21
  * When there are too many tabs to fit in a single line, it introduces a dropdown button
@@ -10,6 +10,8 @@ export interface DialTagProps {
10
10
  }
11
11
  /**
12
12
  * A small tag component used to display labeled items such as categories, filters, or selections.
13
+ * aliases: Badge|Chip
14
+ *
13
15
  * Optionally supports removal via a close button and multiple colors variants defined by {@link TagVariant}.
14
16
  *
15
17
  * @example
@@ -13,6 +13,8 @@ export interface DialTagInputProps extends DialLabelProps {
13
13
  }
14
14
  /**
15
15
  * A tag input field that allows users to add multiple tags using the Enter or comma key.
16
+ * aliases: MultiTag|TagField
17
+ *
16
18
  * Supports removing tags, displaying field labels, optional indicators, validation states,
17
19
  * and dynamic layout adjustment when tags wrap to multiple lines.
18
20
  *
@@ -11,6 +11,7 @@ export interface DialTextareaProps extends DetailedHTMLProps<Omit<TextareaHTMLAt
11
11
  }
12
12
  /**
13
13
  * A flexible textarea component with validation support and consistent styling
14
+ * aliases: MultilineInput|TextBox
14
15
  *
15
16
  * @example
16
17
  * ```tsx