@epam/ai-dial-ui-kit 0.5.0-rc.6 → 0.5.0-rc.61

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

@@ -9,16 +9,16 @@ export interface DialRadioGroupProps {
     activeRadioButton: string;
     orientation: RadioGroupOrientation;
     onChange: (radioId: string) => void;
-    radioCssClass?: string;
-    groupLabelCssClass?: string;
-    labelCssClass?: string;
-    containerCssClass?: string;
-    formItemChildrenCssClass?: string;
-    selectedItemCssClass?: string;
-    selectedLabelCssClass?: string;
-    radioGroupCssClass?: string;
-    inputContainerCssClass?: string;
-    selectedInputContainerCssClass?: string;
+    radioClassName?: string;
+    groupLabelClassName?: string;
+    labelClassName?: string;
+    containerClassName?: string;
+    formItemChildrenClassName?: string;
+    selectedItemClassName?: string;
+    selectedLabelClassName?: string;
+    radioGroupClassName?: string;
+    inputContainerClassName?: string;
+    selectedInputContainerClassName?: string;
 }
 /**
  * Groups multiple `DialRadio` options and renders custom content for the active option.
@@ -43,16 +43,16 @@ export interface DialRadioGroupProps {
  *
  * @param [fieldTitle] - Optional label rendered by `DialField`
  * @param elementId - Name for the underlying radio group; also used for input `name`
- * @param [radioCssClass] - Additional classes applied to each radio input
- * @param [inputContainerCssClass] - Additional classes applied to each radio input's container
- * @param [selectedInputContainerCssClass] - Additional classes applied to the selected radio input's container
- * @param [groupLabelCssClass] - Optional classes applied to the group label. If not provided, `labelCssClass` will be used.
- * @param [formItemChildrenCssClass] - Additional classes applied to the DialFormItem's children container
- * @param [labelCssClass] - Additional classes applied to each radio label
- * @param [containerCssClass] - Additional classes applied to the outer container
- * @param [selectedItemCssClass] - Additional classes applied to the selected option's content container
- * @param [selectedLabelCssClass] - Additional classes applied to the selected option's label
- * @param [radioGroupCssClass] - Additional classes applied to the radio group container
+ * @param [radioClassName] - Additional classes applied to each radio input
+ * @param [inputContainerClassName] - Additional classes applied to each radio input's container
+ * @param [selectedInputContainerClassName] - Additional classes applied to the selected radio input's container
+ * @param [groupLabelClassName] - Optional classes applied to the group label. If not provided, `labelClassName` will be used.
+ * @param [formItemChildrenClassName] - Additional classes applied to the DialFormItem's children container
+ * @param [labelClassName] - Additional classes applied to each radio label
+ * @param [containerClassName] - Additional classes applied to the outer container
+ * @param [selectedItemClassName] - Additional classes applied to the selected option's content container
+ * @param [selectedLabelClassName] - Additional classes applied to the selected option's label
+ * @param [radioGroupClassName] - Additional classes applied to the radio group container
  * @param [disabled] - Disables all child radios when set
  * @param radioButtons - Array of options with ids, labels, and optional content
  * @param activeRadioButton - The id of the currently selected radio

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

@@ -1,5 +1,5 @@
 import { RadioGroupOrientation } from '../../types/radio-group';
-export declare const groupBaseClasses = "flex flex-col gap-2";
-export declare const optionsWrapperBaseClasses = "flex";
-export declare const selectedContentClasses = "pb-1 mt-2";
+export declare const groupBaseClassName = "flex flex-col gap-2";
+export declare const optionsWrapperBaseClassName = "flex";
+export declare const selectedContentClassName = "pb-1 mt-2";
 export declare const orientationClassMap: Record<RadioGroupOrientation, string>;

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

@@ -51,8 +51,8 @@ export interface RadioGroupPopupFieldProps extends Pick<DialFieldLabelProps, 'fi
  * @param [selectedValue] - Current value id used to resolve the displayed option name
  * @param radioButtons - Collection of radio options (id/name)
  * @param [customInputValue] - Custom value text to display instead of a radio option name
- * @param [valueCssClasses] - Extra classes applied to the value text in the collapsed field
- * @param [inputCssClasses] - Extra classes applied to the collapsed input container
+ * @param [valueClassName] - Extra classes applied to the value text in the collapsed field
+ * @param [inputClassName] - Extra classes applied to the collapsed input container
  * @param emptyValueText - Placeholder text when no value is selected
  * @param [onClose] - Callback fired when the popup closes
  * @param title - Title text shown in the popup header

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/ResizableContainer/ConditionalResizableContainer.d.ts

@@ -0,0 +1,33 @@
+import { FC } from 'react';
+import { DialResizableContainerProps } from './ResizableContainer';
+export interface DialConditionalResizableContainerProps extends DialResizableContainerProps {
+    enabled?: boolean;
+}
+/**
+ * DialConditionalResizableContainer — A conditional wrapper around `DialResizableContainer`.
+ *
+ * This component renders its children inside a resizable container only when `enabled` is true.
+ * When `enabled` is false, children are rendered directly without any resizable behavior.
+ *
+ * All other props are the same as `DialResizableContainer`. See the documentation for
+ * `DialResizableContainer` for full details on usage, controlled/uncontrolled modes, sides, and callbacks.
+ *
+ * @example
+ * ```tsx
+ * <DialConditionalResizableContainer
+ *   enabled={!isCollapsed}
+ *   defaultWidth={260}
+ *   minWidth={180}
+ *   maxWidth={520}
+ *   onResize={(w) => console.log('Current width:', w)}
+ *   onResizeStop={(w) => setSidebarWidth(w)}
+ * >
+ *   <Sidebar />
+ * </DialConditionalResizableContainer>
+ * ```
+ *
+ * @param enabled - Whether resizing is enabled. When false, children are rendered directly.
+ * @param children - Content to render inside the container.
+ * @see DialResizableContainer
+ */
+export declare const DialConditionalResizableContainer: FC<DialConditionalResizableContainerProps>;

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

@@ -0,0 +1,69 @@
+import { ResizableContainerSide } from '../../types/resizable-container';
+import { FC, ReactNode } from 'react';
+export interface DialResizableContainerProps {
+    children: ReactNode;
+    minWidth: number;
+    maxWidth: number;
+    width?: number;
+    defaultWidth: number;
+    onResizeStop?: (width: number) => void;
+    onResize?: (width: number) => void;
+    side?: ResizableContainerSide;
+    resizeHandlerClassName?: string;
+    resizeHandler?: ReactNode;
+}
+/**
+ * DialResizableContainer — A reusable resizable container
+ * supporting both **controlled** and **uncontrolled** width modes.
+ *
+ * Controlled Mode
+ *
+ * Provide `width` and optionally `onResizeStop`:
+ * ```tsx
+ * <DialResizableContainer
+ *   width={sidebarWidth}
+ *   onResizeStop={(w) => setSidebarWidth(w)}
+ *   minWidth={180}
+ *   maxWidth={520}
+ * >
+ *   <Sidebar />
+ * </DialResizableContainer>
+ * ```
+ *
+ * Uncontrolled Mode
+ *
+ * Omit `width` entirely — the component manages its own width:
+ * ```tsx
+ * <DialResizableContainer
+ *   defaultWidth={260}
+ *   minWidth={180}
+ *   maxWidth={520}
+ * >
+ *   <Sidebar />
+ * </DialResizableContainer>
+ * ```
+ *
+ * Features:
+ * - Resize from left or right
+ * - Fully supports controlled & uncontrolled sizing
+ * - Custom resize handler (icon or any ReactNode)
+ * - Callback when resize stops (optional)
+ * - Smooth hover/drag visibility transitions
+ *
+ * @param [children] - Content placed inside the container.
+ * @param [minWidth] - Minimum allowed width (px).
+ * @param [maxWidth] - Maximum allowed width (px).
+ * @param [width] - Controlled width. If omitted → uncontrolled mode.
+ * @param [defaultWidth] - Initial width in uncontrolled mode.
+ * @param [onResizeStop] - Optional callback fired when resize ends.
+ * @param [onResize] - Optional callback fired continuously during resizing with current width.
+ * @param [side=ResizableContainerSide.Right] - Resize handle side.
+ * @param [resizeHandlerClassName] - Optional additional CSS classes.
+ * @param [resizeHandler] - Optional custom handler element.
+ *
+ * @remarks
+ * - In uncontrolled mode, width is stored internally.
+ * - `onResizeStop` is optional in both modes.
+ * - Controlled mode always uses the value from `width`.
+ */
+export declare const DialResizableContainer: FC<DialResizableContainerProps>;

package/dist/src/components/ResizableContainer/components/ResizeHandle.d.ts

@@ -0,0 +1,10 @@
+import { ResizableContainerSide } from '../../../types/resizable-container';
+import { FC, ReactNode } from 'react';
+interface ResizeHandleProps {
+    side: ResizableContainerSide;
+    isResizing: boolean;
+    customHandler?: ReactNode;
+    handlerClassName?: string;
+}
+export declare const ResizeHandle: FC<ResizeHandleProps>;
+export {};

package/dist/src/components/ResizableContainer/components/ResizeIcon.d.ts

@@ -0,0 +1,8 @@
+import { ResizableContainerSide } from '../../../types/resizable-container';
+import { FC } from 'react';
+interface ResizeIconProps {
+    side: ResizableContainerSide;
+    className: string;
+}
+export declare const ResizeIcon: FC<ResizeIconProps>;
+export {};

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

@@ -7,8 +7,8 @@ export interface DialSearchProps {
     disabled?: boolean;
     readonly?: boolean;
     invalid?: boolean;
-    cssClass?: string;
-    containerCssClass?: string;
+    className?: string;
+    containerClassName?: string;
     onChange?: (value: string) => void;
     size?: SearchSize;
     allowClear?: boolean;
@@ -35,8 +35,8 @@ export interface DialSearchProps {
  * @param [disabled=false] - Whether the input is disabled
  * @param [readonly=false] - Whether the input is read-only (non-editable)
  * @param [invalid=false] - Whether the input should be styled as invalid
- * @param [cssClass] - Additional CSS classes applied to the input element
- * @param [containerCssClass] - Additional CSS classes applied to the container
+ * @param [className] - Additional CSS classes applied to the input element
+ * @param [containerClassName] - Additional CSS classes applied to the container
  * @param [onChange] - Callback fired when the input value changes
  * @param [size=SearchSize.Base] - The size of the search input. Uses the {@link SearchSize} enum.
  * @param [allowClear=true] - Whether to show a clear button when there is a value

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

@@ -1,13 +1,13 @@
 export declare const SIZE_CONFIG: {
     small: {
-        textClass: string;
-        containerClass: string;
+        textClassName: string;
+        containerClassName: string;
         iconSize: number;
         iconStroke: number;
     };
     base: {
-        textClass: string;
-        containerClass: string;
+        textClassName: string;
+        containerClassName: string;
         iconSize: number;
         iconStroke: number;
     };

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;
@@ -18,10 +20,11 @@ export interface DialSelectProps {
     emptyStateDescription?: string;
     emptyStateIcon?: ReactNode;
     disabled?: boolean;
-    cssClass?: string;
+    className?: string;
     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.
@@ -66,7 +71,7 @@ export interface DialSelectProps {
  * @param [emptyStateDescription] - Description text when there are no options.
  * @param [emptyStateIcon] - Icon to display when there are no options.
  * @param [disabled=false] - Disable the control.
- * @param [cssClass] - Additional CSS classes for the trigger.
+ * @param [className] - Additional CSS classes for the trigger.
  * @param [closable=false] - Show a close button in the dropdown header.
  * @param [header] - Custom node/function rendered above the options.
  * @param [footer] - Custom node/function rendered below the options.
@@ -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 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 selectTriggerBaseClassName = "dial-input flex w-full items-center justify-between gap-2 dial-small";
+export declare const selectOverlayBaseClassName = "w-full rounded flex flex-col";
+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";
+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 selectChevronIcon: import("react/jsx-runtime").JSX.Element;

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

@@ -2,9 +2,9 @@ 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'> {
-    selectCssClass?: string;
-    containerCssClass?: string;
+export interface DialSelectFieldProps extends Omit<DialSelectProps, 'className' | 'elementId'>, Omit<DialFieldLabelProps, 'htmlFor'>, Omit<DialFormItemProps, 'label' | 'children' | 'value'> {
+    selectClassName?: string;
+    containerClassName?: string;
 }
 /**
  * A Select field wrapper that composes `DialFormItem` and `DialSelect`.
@@ -26,12 +26,12 @@ export interface DialSelectFieldProps extends Omit<DialSelectProps, 'cssClass'>,
  * />
  *
  * @params - Component properties extending:
- * - {@link DialSelectProps} for select options and props, except for cssClass
+ * - {@link DialSelectProps} for select options and props, except for className
  * - {@link DialFormItemProps} for form item props, except for htmlFor
  * - {@link DialFieldLabelProps} for label props, except for label, children, value
  *
- * @param selectCssClass CSS class for the select element
- * @param containerCssClass CSS class for the form item container
+ * @param selectClassName CSS class for the select element
+ * @param containerClassName CSS class for the form item container
  * @param emptyStateTitle Title to show when there are no options
  * @param restSelectProps All other DialSelect props
  * @param restFormItemProps All other DialFormItem props

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

@@ -2,7 +2,7 @@ import { FC } from 'react';
 export interface DialSharedEntityIndicatorProps {
     label?: string;
     size?: number;
-    cssClass?: string;
+    className?: string;
     stroke?: number;
 }
 /**
@@ -18,7 +18,7 @@ export interface DialSharedEntityIndicatorProps {
  *
  * @param [label="Shared entity"] - Accessible label for assistive tech
  * @param [size=10] - Pixel size for the icon
- * @param [cssClass] - Additional Tailwind classes appended to the container
+ * @param [className] - Additional Tailwind classes appended to the container
  * @param [stroke=2] - Stroke width for the icon
  *
  */

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 [smallScreenContainerClassName] - 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/components/Tag/Tag.d.ts

@@ -2,7 +2,7 @@ import { TagVariant } from '../../types/tag';
 import { FC, MouseEvent, ReactNode } from 'react';
 export interface DialTagProps {
     tag: string;
-    cssClass?: string;
+    className?: string;
     remove?: (event: MouseEvent<HTMLButtonElement>) => void;
     variant?: TagVariant;
     iconBefore?: ReactNode;
@@ -22,7 +22,7 @@ export interface DialTagProps {
  * ```
  *
  * @param tag - The text label displayed inside the tag.
- * @param [cssClass] - Optional additional CSS classes applied to the tag container.
+ * @param [className] - Optional additional CSS classes applied to the tag container.
  * @param [remove] - Optional callback invoked when the remove button is clicked.
  *                   If not provided, the remove button will not be rendered.
  * @param [variant=TagVariant.Default] - Visual style of the tag. Uses the {@link TagVariant} enum.

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

@@ -33,9 +33,9 @@ export interface DialTextAreaFieldProps extends DialInputFieldBaseProps {
  * @param [iconBefore] - Icon or element to display before the input
  * @param [iconAfter] - Icon or element to display after the input
  * @param [textBeforeInput] - Text to display before the input
- * @param [elementCssClass] - Additional CSS classes to apply to the textarea element
- * @param [containerCssClass] - Additional CSS classes to apply to the outer container
- * @param [elementContainerCssClass] - Additional CSS classes to apply to the textarea container
+ * @param [elementClassName] - Additional CSS classes to apply to the textarea element
+ * @param [containerClassName] - Additional CSS classes to apply to the outer container
+ * @param [elementContainerClassName] - Additional CSS classes to apply to the textarea container
  * @param [disableTooltip] - Whether to disable the tooltip that shows the full value on hover
  */
 export declare const DialTextAreaField: FC<DialTextAreaFieldProps>;

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

@@ -3,8 +3,8 @@ export interface DialTextareaProps {
     value?: string | number | null;
     placeholder?: string;
     textareaId: string;
-    cssClass?: string;
-    containerCssClass?: string;
+    className?: string;
+    containerClassName?: string;
     disabled?: boolean;
     invalid?: boolean;
     readonly?: boolean;
@@ -28,8 +28,8 @@ export interface DialTextareaProps {
  * @param [value] - The current value of the textarea
  * @param [onChange] - Callback function called when the textarea value changes
  * @param [placeholder] - Placeholder text displayed when textarea is empty
- * @param [cssClass=""] - Additional CSS classes to apply to the textarea element
- * @param [containerCssClass=""] - Additional CSS classes to apply to the container div
+ * @param [className=""] - Additional CSS classes to apply to the textarea element
+ * @param [containerClassName=""] - Additional CSS classes to apply to the container div
  * @param [disabled=false] - Whether the textarea is disabled
  * @param [readonly=false] - Whether the textarea is read-only (no user input allowed)
  * @param [invalid=false] - Whether the textarea has validation errors (applies error styling)

package/dist/src/index.d.ts

@@ -18,6 +18,8 @@ export { DialFormItem } from './components/FormItem/FormItem';
 export { DialSharedEntityIndicator } from './components/SharedEntityIndicator/SharedEntityIndicator';
 export { DialFileName } from './components/FileName/FileName';
 export { DialFolderName } from './components/FolderName/FolderName';
+export { DialResizableContainer } from './components/ResizableContainer/ResizableContainer';
+export { DialConditionalResizableContainer } from './components/ResizableContainer/ConditionalResizableContainer';
 export { DialDateCellRenderer } from './components/Grid/renderers/DateCellRenderer';
 export { DialTabs } from './components/Tabs/Tabs';
 export { DialBreadcrumb } from './components/Breadcrumb/Breadcrumb';
@@ -62,9 +64,10 @@ 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 { ResizableContainerSide } from './types/resizable-container';
 export { useDialFileManagerTabs } from './components/FileManager/hooks/use-file-manager-tabs';
 export { useEditableItem } from './hooks/use-editable-item';
 export { FileManagerProvider } from './components/FileManager/FileManagerProvider';
@@ -78,4 +81,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/dropdown.d.ts

@@ -7,6 +7,7 @@ export interface DropdownItem {
     disabled?: boolean;
     danger?: boolean;
     type?: DropdownItemType;
+    className?: string;
     onClick?: (info: {
         key: string;
         domEvent: MouseEvent;

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;
 }

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

@@ -9,5 +9,6 @@ export declare enum DropdownTrigger {
 }
 export declare enum DropdownItemType {
     Item = "item",
-    Divider = "divider"
+    Divider = "divider",
+    PlainText = "plainText"
 }

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

@@ -1,4 +1,3 @@
-import { DialFileNodeType } from '../models/file';
 export declare enum DialFileManagerTabs {
     MyFiles = "my_files",
     Shared = "shared",
@@ -12,13 +11,17 @@ export declare enum DialFileManagerActions {
     Download = "download",
     Delete = "delete"
 }
-export interface DialCopiedItem {
-    sourceUrl: string;
-    destinationUrl: string;
-    overwrite?: boolean;
-    nodeType: DialFileNodeType;
+export declare enum DialFileManagerConflictActions {
+    Replace = "replace",
+    Duplicate = "duplicate",
+    Cancel = "cancel"
+}
+export declare enum DialFileManagerConflictStrategies {
+    ReplaceAll = "replaceAll",
+    DuplicateAll = "duplicateAll",
+    DecideForEach = "decideForEach"
 }
-export interface DialDeletedItem {
-    sourceUrl: string;
-    nodeType: DialFileNodeType;
+export declare enum DestinationFolderMode {
+    Copy = "copy",
+    Move = "move"
 }

package/dist/src/types/resizable-container.d.ts

@@ -0,0 +1,4 @@
+export declare enum ResizableContainerSide {
+    Left = "left",
+    Right = "right"
+}