@epam/ai-dial-ui-kit 0.10.0-dev.8 → 0.10.0

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

@@ -30,8 +30,6 @@ export interface UseGridContextMenuProps {
     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;
     onOpenInNewTab?: (file: DialFile) => void;
@@ -39,5 +37,7 @@ export interface UseGridContextMenuProps {
     isRenameFileAvailable?: boolean;
     isDuplicateFolderAvailable?: boolean;
     forbiddenSymbolsRegExp?: RegExp;
+    onGridCreateSiblingFolder: (files: DialFile[]) => void;
+    onGridCreateChildFolder: (files: DialFile[]) => void;
 }
-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[];
+export declare const useGridContextMenu: ({ actionLabels, onDuplicate, onCopy, onMove, onDownload, onRename, onDelete, onInfo, onUnshare, onRemoveAccess, sharedWithMeIds, sharedByMePaths, onManagePermissions, onPreview, onOpenInNewTab, previewExtensions, isRenameFileAvailable, isDuplicateFolderAvailable, forbiddenSymbolsRegExp, onGridCreateSiblingFolder, onGridCreateChildFolder, }: UseGridContextMenuProps) => (file: DialFile) => DropdownItem[];

package/dist/src/components/FileManager/hooks/use-trigger-view-create-folder.d.ts

@@ -0,0 +1,26 @@
+import { DialFile } from '../../../models/file';
+import { FileManagerCreateFolderTriggerView } from '../../../types/file-manager';
+interface UseTriggerViewCreateFolderOptions {
+    onGridAddSibling?: (files: DialFile[]) => void;
+    onGridAddChild?: (files: DialFile[]) => void;
+    onTreeAddSibling?: (files: DialFile[]) => void;
+    onTreeAddChild?: (files: DialFile[]) => void;
+}
+/**
+ * Manages which view ("tree" or "grid") triggered a folder creation action.
+ *
+ * Useful when both TreeView and GridView can initiate folder creation,
+ * and the parent needs to know which source triggered it
+ * to apply view-specific logic or UI updates.
+ *
+ * Returns the last folder creation trigger source and four handlers
+ * (`onGridCreateSiblingFolder`, `onTreeCreateSiblingFolder`, `onGridCreateChildFolder`, `onTreeCreateChildFolder`) that wrap the provided `onGridAddSibling`, `onTreeAddSibling`, `onGridAddChild` and `onTreeAddChild` callbacks.
+ */
+export declare const useTriggerViewCreateFolder: ({ onGridAddSibling, onGridAddChild, onTreeAddSibling, onTreeAddChild, }: UseTriggerViewCreateFolderOptions) => {
+    createFolderTriggerView: FileManagerCreateFolderTriggerView;
+    onGridCreateSiblingFolder: (files: DialFile[]) => void;
+    onTreeCreateSiblingFolder: (files: DialFile[]) => void;
+    onGridCreateChildFolder: (files: DialFile[]) => void;
+    onTreeCreateChildFolder: (files: DialFile[]) => void;
+};
+export {};

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

@@ -48,4 +48,10 @@ export declare function getForbiddenSymbolsTooltip(item: {
     name: string;
     isFolder: boolean;
 }, forbiddenSymbolsRegExp?: RegExp, forbiddenSymbolsTooltip?: ReactNode): ReactNode | undefined;
-export declare const getRowTooltip: (file: FileManagerGridRow, allowedFileTypes?: string[], maxSelectableFileSize?: number, unsupportedFileTypeTooltip?: string, fileTooLargeTooltip?: string) => string | undefined;
+export declare const splitPathAndName: (fullPath: string) => {
+    parent: string;
+    name: 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 getNextFolderName: (existingFolders: DialFile[]) => string;

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

@@ -1,3 +1,3 @@
 import { FormItemOrientation } from '../../types/form-item';
-export declare const containerBaseClassName = "w-full flex gap-2";
+export declare const containerBaseClassName = "w-full flex gap-1";
 export declare const orientationClassMap: Record<FormItemOrientation, string>;

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

@@ -1,6 +1,6 @@
-import { EditorThemes } from '../../types/editor';
 import { PreviewType } from '@uiw/react-md-editor';
-import { FC } from 'react';
+import { FC, ReactNode } from 'react';
+import { EditorThemes } from '../../types/editor';
 export interface DialMarkdownEditorProps {
     value?: string;
     onChange?: (value: string) => void;
@@ -8,6 +8,7 @@ export interface DialMarkdownEditorProps {
     preview?: PreviewType;
     theme?: EditorThemes;
     className?: string;
+    placeholder?: ReactNode;
 }
 /**
  * A Markdown editor component built on top of @uiw/react-md-editor.
@@ -27,6 +28,7 @@ export interface DialMarkdownEditorProps {
  * @param [onChange] - Callback fired when the editor content changes
  * @param [height=300] - Height of the editor in pixels
  * @param [preview='edit'] - Preview mode ('edit', 'live', 'preview')
+ * @param [placeholder] - Content to display when the editor is empty
  * @param [theme='dark'] - Theme for the editor ('light' or 'dark')
  * @param [className] - Additional CSS classes for the container
  */

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

@@ -0,0 +1,8 @@
+import { FC } from 'react';
+export interface DialPaginationProps {
+    page: number;
+    totalPages: number;
+    onPageChange: (page: number) => void;
+    className?: string;
+}
+export declare const DialPagination: FC<DialPaginationProps>;

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

@@ -0,0 +1,5 @@
+export declare const MANY_PAGES_THRESHOLD = 7;
+export declare const ADJACENT_WINDOW = 2;
+export declare const getPageRange: (totalPages: number) => number[];
+export type PageDisplayType = 'active' | 'adjacent' | 'far';
+export declare const getPageDisplayType: (p: number, currentPage: number, totalPages: number) => PageDisplayType;

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

@@ -0,0 +1,13 @@
+import { FC } from 'react';
+export declare enum DialProgressBarSize {
+    Small = "sm",
+    Medium = "md"
+}
+export interface DialProgressBarProps {
+    value: number;
+    max?: number;
+    size?: DialProgressBarSize;
+    className?: string;
+    ariaLabel?: string;
+}
+export declare const DialProgressBar: FC<DialProgressBarProps>;

package/dist/src/components/SchemaRenderer/components/SchemaObjectEditor.d.ts

@@ -1,5 +1,5 @@
-import { FC } from 'react';
 import { JsonSchemaDef } from '../types';
+import { FC } from 'react';
 export interface SchemaObjectEditorProps {
     schema: JsonSchemaDef;
     value: unknown;

package/dist/src/components/SchemaRenderer/types.d.ts

@@ -26,6 +26,7 @@ export interface JsonSchemaDef {
     type?: string | string[];
     title?: string;
     description?: string;
+    isHidden?: boolean;
     isProtected?: boolean;
     enumDisplay?: SchemaDisplayMode;
     enumOrientation?: SchemaOrientation;
@@ -112,6 +113,7 @@ export interface SchemaFieldContentProps {
     path: string[];
     level: number;
     required?: boolean;
+    suppressInlineError?: boolean;
 }
 export interface SchemaFieldProps extends SchemaFieldContentProps {
     label?: string;

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

@@ -0,0 +1,8 @@
+import { FC } from 'react';
+import { SelectOption } from '../../models/select';
+export interface SelectSubMenuItemProps {
+    opt: SelectOption;
+    selectedValues: string[];
+    onSelect: (value: string) => void;
+}
+export declare const SelectSubMenuItem: FC<SelectSubMenuItemProps>;

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

@@ -5,4 +5,5 @@ export declare const selectOptionSelectedClassName = "bg-accent-primary-alpha";
 export declare const selectOptionSingleSelectedClassName = "bg-accent-primary-alpha border-l border-accent-primary border-1";
 export declare const selectOptionDisabledClassName = "opacity-75";
 export declare const dropdownMenuMaxHeight = 352;
+export declare const selectSubMenuGap = 4;
 export declare const selectChevronIcon: import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,8 @@
+import { FC } from 'react';
+export interface DialSpinnerProps {
+    size?: number;
+    className?: string;
+    fullWidth?: boolean;
+    ariaLabel?: string;
+}
+export declare const DialSpinner: FC<DialSpinnerProps>;

package/dist/src/hooks/use-editable-item.d.ts

@@ -2,10 +2,14 @@ import { RefObject } from 'react';
 export interface UseEditableItemOptions {
     value: string;
     isEditing: boolean;
+    isCreating?: boolean;
+    isLoading?: boolean;
     onValidate?: (value: string) => string | null;
     onSave?: (value: string) => void;
     onCancel?: () => void;
     restoreOnCancel?: boolean;
+    onCreateFolderSave?: (value: string) => void;
+    onCreateFolderCancel?: () => void;
 }
 interface UseEditableItemResult {
     inputRef: RefObject<HTMLInputElement | null>;
@@ -61,5 +65,5 @@ interface UseEditableItemResult {
  * );
  * ```
  */
-export declare function useEditableItem({ value: initialValue, isEditing, restoreOnCancel, onValidate, onSave, onCancel, }: UseEditableItemOptions): UseEditableItemResult;
+export declare function useEditableItem({ value: initialValue, isEditing, isCreating, isLoading, restoreOnCancel, onValidate, onSave, onCancel, onCreateFolderSave, onCreateFolderCancel, }: UseEditableItemOptions): UseEditableItemResult;
 export {};

package/dist/src/index.d.ts

@@ -3,6 +3,12 @@ export { DialLabel } from './components/Label/Label';
 export { DialIcon } from './components/Icon/Icon';
 export { DialAlert } from './components/Alert/Alert';
 export { DialLoader } from './components/Loader/Loader';
+export { DialSpinner } from './components/Spinner/Spinner';
+export type { DialSpinnerProps } from './components/Spinner/Spinner';
+export { DialProgressBar, DialProgressBarSize, } from './components/ProgressBar/ProgressBar';
+export type { DialProgressBarProps } from './components/ProgressBar/ProgressBar';
+export { DialPagination } from './components/Pagination/Pagination';
+export type { DialPaginationProps } from './components/Pagination/Pagination';
 export { DialCheckbox } from './components/Checkbox/Checkbox';
 export { DialSteps } from './components/Steps/Steps';
 export { DialRadioButton } from './components/RadioButton/RadioButton';
@@ -29,10 +35,13 @@ export { DialBreadcrumbItem } from './components/Breadcrumb/BreadcrumbItem';
 export { DialButton } from './components/Button/Button';
 export { DialIconButton } from './components/IconButton/IconButton';
 export type { DialIconButtonProps } from './components/IconButton/IconButton';
-export { DialErrorButton, DialNeutralButton, DialPrimaryButton, DialGhostButton, DialLinkButton, } from './components/Button/ButtonWrappers';
+export { DialErrorButton, DialNeutralButton, DialPrimaryButton, DialGhostButton, DialLinkButton, DialRoundedButton, } from './components/Button/ButtonWrappers';
+export type { DialRoundedButtonProps } from './components/Button/ButtonWrappers';
 export { DialErrorIconButton, DialGhostIconButton, DialNeutralIconButton, DialPrimaryIconButton, DialSecondaryIconButton, DialSuccessIconButton, DialTertiaryIconButton, } from './components/IconButton/IconButtonWrappers';
 export { DialCloseButton } from './components/CloseButton/CloseButton';
 export { DialRemoveButton } from './components/RemoveButton/RemoveButton';
+export { DialFabButton } from './components/FabButton/FabButton';
+export type { DialFabButtonProps } from './components/FabButton/FabButton';
 export { DialTextarea } from './components/Textarea/Textarea';
 export { DialTooltip } from './components/Tooltip/Tooltip';
 export { DialSwitch } from './components/Switch/Switch';
@@ -55,6 +64,8 @@ export { DialLoadFileArea } from './components/LoadFileArea/LoadFileArea';
 export { DialLoadFileAreaField } from './components/LoadFileArea/LoadFileAreaField';
 export { DialDropdown } from './components/Dropdown/Dropdown';
 export { DialButtonDropdown } from './components/ButtonDropdown/ButtonDropdown';
+export { DialDropdownIcon } from './components/DropdownIcon/DropdownIcon';
+export type { DialDropdownIconProps } from './components/DropdownIcon/DropdownIcon';
 export { DialFileManager } from './components/FileManager/FileManager';
 export type { FileManagerGridRow } from './components/FileManager/FileManagerContext';
 export type { GridOptions, ToolbarOptions, BulkActionsToolbarOptions, } from './components/FileManager/FileManager';
@@ -100,3 +111,5 @@ export { NOT_ALLOWED_SYMBOLS, NOT_ALLOWED_SPACES, NOT_ALLOWED_SYMBOLS_REGEXP, NO
 export { DialSchemaRenderer } from './components/SchemaRenderer/SchemaRenderer';
 export { SchemaRendererVariant, SchemaDisplayMode, SchemaOrientation, JsonSchemaType, } from './components/SchemaRenderer/types';
 export type { DialSchemaRendererProps, JsonSchema, JsonSchemaDef, ValidationError, } from './components/SchemaRenderer/types';
+export declare const LazyDialJsonEditor: () => Promise<typeof import("./components/JsonEditor/JsonEditor")>;
+export declare const LazyDialMarkdownEditor: () => Promise<typeof import("./components/MarkdownEditor/MarkdownEditor")>;

package/dist/src/mcp/types.d.ts

@@ -5,6 +5,12 @@ export interface PropEntry {
     defaultValue?: string;
     description?: string;
 }
+export interface LazyComponentEntry {
+    loaderExportName: string;
+    packageImport: string;
+    ssr: false;
+    nextDynamicExample: string;
+}
 export interface ComponentEntry {
     name: string;
     category: string;
@@ -12,6 +18,7 @@ export interface ComponentEntry {
     props: PropEntry[];
     examples: string[];
     sourceFile: string;
+    lazy?: LazyComponentEntry;
 }
 export interface TypeMember {
     name: string;

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

@@ -12,4 +12,5 @@ export interface DropdownItem {
         key: string;
         domEvent: MouseEvent;
     }) => void;
+    children?: DropdownItem[];
 }

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

@@ -5,4 +5,5 @@ export interface SelectOption {
     description?: string;
     disabled?: boolean;
     icon?: ReactNode;
+    children?: SelectOption[];
 }

package/dist/src/types/alert.d.ts

@@ -2,5 +2,6 @@ export declare enum AlertVariant {
     Info = "info",
     Success = "success",
     Warning = "warning",
-    Error = "error"
+    Error = "error",
+    Loading = "loading"
 }

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

@@ -38,6 +38,15 @@ export declare enum FileManagerRenameTriggerView {
     Tree = "tree",
     Grid = "grid"
 }
+export declare enum FileManagerCreateFolderTriggerView {
+    Tree = "tree",
+    Grid = "grid"
+}
+export declare enum FileManagerCreateFolderType {
+    Folder = "folder",
+    Child = "child",
+    Sibling = "sibling"
+}
 export declare enum FileManagerColumnKey {
     Name = "name",
     UpdatedAt = "updatedAt",

package/dist/src/utils/mobile.d.ts

@@ -2,10 +2,10 @@ import { ScreenType } from '../types/screen';
 /**
  * Checks if the current viewport width is within the "medium" (tablet) screen range.
  *
- * Specifically, it returns `true` if the window width is less than 1024 pixels.
+ * Specifically, it returns `true` if the window width is less than 1280 pixels.
  * Safely handles server-side rendering by verifying that `window` is defined.
  *
- * @returns {boolean} `true` if the viewport width is less than 1024px, otherwise `false`.
+ * @returns {boolean} `true` if the viewport width is less than 1279px, otherwise `false`.
  *
  * @example
  * if (isMediumScreen()) {

package/dist/src/utils/sub-menu-floating.d.ts

@@ -0,0 +1,51 @@
+import { ReactNode } from 'react';
+/**
+ * Shared floating state for right-side submenus.
+ * Handles open state, Floating UI positioning and hover/dismiss/role interactions.
+ */
+export declare function useSubMenuFloating(gap: number, ariaRole?: 'menu' | 'listbox', disabled?: boolean): {
+    isOpen: boolean;
+    refs: {
+        reference: import('react').MutableRefObject<import('@floating-ui/react-dom').ReferenceType | null>;
+        floating: React.MutableRefObject<HTMLElement | null>;
+        setReference: (node: import('@floating-ui/react-dom').ReferenceType | null) => void;
+        setFloating: (node: HTMLElement | null) => void;
+    } & import('@floating-ui/react').ExtendedRefs<import('@floating-ui/react').ReferenceType>;
+    floatingStyles: import('react').CSSProperties;
+    context: {
+        placement: import('@floating-ui/utils').Placement;
+        strategy: import('@floating-ui/utils').Strategy;
+        x: number;
+        y: number;
+        middlewareData: import('@floating-ui/core').MiddlewareData;
+        isPositioned: boolean;
+        update: () => void;
+        floatingStyles: React.CSSProperties;
+        open: boolean;
+        onOpenChange: (open: boolean, event?: Event, reason?: import('@floating-ui/react').OpenChangeReason) => void;
+        events: import('@floating-ui/react').FloatingEvents;
+        dataRef: React.MutableRefObject<import('@floating-ui/react').ContextData>;
+        nodeId: string | undefined;
+        floatingId: string | undefined;
+        refs: import('@floating-ui/react').ExtendedRefs<import('@floating-ui/react').ReferenceType>;
+        elements: import('@floating-ui/react').ExtendedElements<import('@floating-ui/react').ReferenceType>;
+    };
+    getReferenceProps: (userProps?: React.HTMLProps<Element>) => Record<string, unknown>;
+    getFloatingProps: (userProps?: React.HTMLProps<HTMLElement>) => Record<string, unknown>;
+};
+interface SubMenuPanelProps {
+    refs: ReturnType<typeof useSubMenuFloating>['refs'];
+    floatingStyles: ReturnType<typeof useSubMenuFloating>['floatingStyles'];
+    context: ReturnType<typeof useSubMenuFloating>['context'];
+    getFloatingProps: ReturnType<typeof useSubMenuFloating>['getFloatingProps'];
+    role: 'menu' | 'listbox';
+    /** Extra classes appended to the default floating container classes. */
+    className?: string;
+    children: ReactNode;
+}
+/**
+ * Shared floating panel wrapper (FloatingPortal → FloatingFocusManager → container div).
+ * Used by DropdownSubMenuItem and SelectSubMenuItem.
+ */
+export declare const SubMenuPanel: ({ refs, floatingStyles, context, getFloatingProps, role, className, children, }: SubMenuPanelProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epam/ai-dial-ui-kit",
-  "version": "0.10.0-dev.8",
+  "version": "0.10.0",
   "type": "module",
   "license": "Apache-2.0",
   "description": "A modern UI kit for building AI DIAL interfaces with React",
@@ -21,7 +21,7 @@
     }
   },
   "bin": {
-    "ai-dial-ui-kit-mcp": "./dist/mcp-server.cjs"
+    "ai-dial-ui-kit-mcp": "dist/mcp-server.cjs"
   },
   "files": [
     "dist"
@@ -52,8 +52,8 @@
     "build-storybook": "concurrently \"npm run build-storybook:css\" \"storybook build\"",
     "build-storybook:css": "tailwindcss -m -i ./src/styles/tailwind-entry.scss -o ./src/index.css",
     "prepare": "husky",
-    "publish": "node tools/publish-lib.mjs",
-    "publish:dry": "node tools/publish-lib.mjs --output-style=static --dry",
+    "publish": "npm publish --access public",
+    "publish:dry": "npm publish --access public --dry-run",
     "test": "vitest --coverage",
     "storybook-docs": "storybook dev --docs",
     "build-storybook-docs": "storybook build --docs"
@@ -143,4 +143,4 @@
     "vite-plugin-svgr": "^4.5.0",
     "vitest": "^3.2.4"
   }
-}
+}