@epam/ai-dial-ui-kit 0.8.2 → 0.9.0-dev.66

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

@@ -1,6 +1,6 @@
-export declare const selectTriggerBaseClassName = "dial-input flex w-full items-center justify-between gap-2 dial-small cursor-pointer";
+export declare const selectTriggerBaseClassName = "dial-input flex w-full items-center justify-between gap-2 dial-small-text cursor-pointer";
 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 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";
 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";

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

@@ -8,6 +8,7 @@ export interface DialSelectFieldProps extends Omit<DialSelectProps, 'className'
 }
 /**
  * A Select field wrapper that composes `DialFormItem` and `DialSelect`.
+ * aliases: SelectInput|ComboField
  *
  * Provides unified label, description, error rendering and a readonly view that shows
  * the selected option labels (comma-separated in single mode, list in multiple).

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

@@ -9,6 +9,7 @@ export interface DialSharedEntityIndicatorProps {
 }
 /**
  * A compact icon-only indicator to denote a "shared" entity.
+ * aliases: SharedIcon|AccessIndicator
  *
  * Renders a small arrow-up-right icon with token-based colors.
  *

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

@@ -21,6 +21,7 @@ export interface DialSkeletonProps extends HTMLAttributes<HTMLDivElement> {
 }
 /**
  * DialSkeleton
+ * aliases: PlaceholderUI|ShimmerLoader
  *
  * A placeholder component to show while content is loading.
  * Provides various skeleton shapes and configurations.

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

@@ -7,6 +7,7 @@ export interface DialStepsProps {
 }
 /**
  * Props for the DialSteps component, which renders a multi-step navigation UI.
+ * aliases: StepWizard|ProgressSteps
  *
  * @example
  * ```tsx

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

@@ -9,6 +9,7 @@ export interface DialSwitchProps {
 }
 /**
  * A Switch component with various styling options
+ * aliases: ToggleSwitch|BinaryToggle
  *
  * @example
  * ```tsx

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

@@ -14,6 +14,8 @@ export interface DialTabsProps {
 }
 /**
  * A responsive and overflow-aware tabs component that automatically adapts its layout
+ * aliases: TabNavigation|TabBar
+ *
  * between a scrollable tab bar and a dropdown menu on smaller screens.
  *
  * When there are too many tabs to fit in a single line, it introduces a dropdown button

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

@@ -10,6 +10,8 @@ export interface DialTagProps {
 }
 /**
  * A small tag component used to display labeled items such as categories, filters, or selections.
+ * aliases: Badge|Chip
+ *
  * Optionally supports removal via a close button and multiple colors variants defined by {@link TagVariant}.
  *
  * @example

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

@@ -1,7 +1,7 @@
 import { FC } from 'react';
 import { DialLabelProps } from '../Label/Label';
 export interface DialTagInputProps extends DialLabelProps {
-    elementId: string;
+    elementId?: string;
     initialTags?: string[];
     placeholder?: string;
     captionDescription?: string;
@@ -9,10 +9,15 @@ export interface DialTagInputProps extends DialLabelProps {
     invalid?: boolean;
     disabled?: boolean;
     collapseTagOverflow?: boolean;
+    readOnly?: boolean;
+    containerClassName?: string;
+    tagClassName?: string;
     onChange?: (tags: string[]) => void;
 }
 /**
  * A tag input field that allows users to add multiple tags using the Enter or comma key.
+ * aliases: MultiTag|TagField
+ *
  * Supports removing tags, displaying field labels, optional indicators, validation states,
  * and dynamic layout adjustment when tags wrap to multiple lines.
  *
@@ -38,6 +43,9 @@ export interface DialTagInputProps extends DialLabelProps {
  * @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 [readOnly=false] - When true, hides the text input (no new tags can be added). The outer wrapper and label/caption are also omitted so the component can be embedded inside an existing container.
+ * @param [containerClassName] - Additional CSS classes applied to the tag container (the flex row wrapping all tags).
+ * @param [tagClassName] - Additional CSS classes applied to each individual tag.
  * @param [onChange] - Callback fired whenever the tag list changes (tag added or removed).
  */
 export declare const DialTagInput: FC<DialTagInputProps>;

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

@@ -11,6 +11,7 @@ export interface DialTextareaProps extends DetailedHTMLProps<Omit<TextareaHTMLAt
 }
 /**
  * A flexible textarea component with validation support and consistent styling
+ * aliases: MultilineInput|TextBox
  *
  * @example
  * ```tsx

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

@@ -9,6 +9,7 @@ export interface DialTooltipProps extends DialTooltipContainerOptions {
 }
 /**
  * A Tooltip component that displays information on hover
+ * aliases: HoverPopover|InfoPopover
  *
  * @example
  * ```tsx

package/dist/src/constants/storybook/input.d.ts

@@ -1,4 +1,6 @@
 import { ArgTypes } from '@storybook/react';
 import { DialInputProps } from '../../components/Input/Input';
 export declare const inputBaseArgTypes: Partial<ArgTypes<DialInputProps>>;
-export declare const numberInputBaseArgTypes: Partial<ArgTypes<DialInputProps>>;
+export declare const numberInputBaseArgTypes: Partial<ArgTypes<DialInputProps>> & {
+    integer?: ArgTypes[string];
+};

package/dist/src/index.d.ts

@@ -93,5 +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 { DIAL_ICON_SIZE, BASE_ICON_PROPS, BASE_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/mcp/generate-manifest.d.ts

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,54 @@
+export interface PropEntry {
+    name: string;
+    type: string;
+    required: boolean;
+    defaultValue?: string;
+    description?: string;
+}
+export interface ComponentEntry {
+    name: string;
+    category: string;
+    description: string;
+    props: PropEntry[];
+    examples: string[];
+    sourceFile: string;
+}
+export interface TypeMember {
+    name: string;
+    value: string;
+    comment?: string;
+}
+export interface TypeEntry {
+    name: string;
+    kind: 'enum' | 'interface' | 'type';
+    description?: string;
+    members?: TypeMember[];
+    typeBody?: string;
+    sourceFile: string;
+}
+export interface ExportEntry {
+    name: string;
+    description?: string;
+    signature?: string;
+    sourceFile: string;
+}
+export interface KitInfo {
+    name: string;
+    description: string;
+    installation: string;
+    cssImport: string;
+    peerDependencies: Record<string, string>;
+    setupNotes: string;
+}
+export interface Manifest {
+    version: string;
+    generatedAt: string;
+    kit: KitInfo;
+    styles: string;
+    theming: string;
+    components: ComponentEntry[];
+    types: TypeEntry[];
+    hooks: ExportEntry[];
+    utils: ExportEntry[];
+    constants: ExportEntry[];
+}

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

@@ -1,7 +1,8 @@
 export declare enum DialFileManagerTabs {
     MyFiles = "my_files",
     Shared = "shared",
-    Organization = "organization"
+    Organization = "organization",
+    Review = "review"
 }
 export declare enum DialFileManagerActions {
     AddSibling = "addSibling",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epam/ai-dial-ui-kit",
-  "version": "0.8.2",
+  "version": "0.9.0-dev.66",
   "type": "module",
   "license": "Apache-2.0",
   "description": "A modern UI kit for building AI DIAL interfaces with React",
@@ -20,6 +20,9 @@
       "default": "./dist/index.css"
     }
   },
+  "bin": {
+    "ai-dial-ui-kit-mcp": "./dist/mcp-server.cjs"
+  },
   "files": [
     "dist"
   ],
@@ -32,12 +35,17 @@
   ],
   "scripts": {
     "dev": "vite",
-    "build": "vite build && npm run build:css",
+    "build": "vite build && npm run build:css && npm run build:manifest && npm run build:mcp",
     "build:css": "tailwindcss -m -i ./src/styles/tailwind-entry.scss -o ./dist/index.css",
+    "build:manifest": "tsx src/mcp/generate-manifest.ts",
+    "build:mcp": "node tools/build-mcp.mjs",
     "lint": "eslint . --ext ts,tsx --fix --report-unused-disable-directives --max-warnings 0",
+    "lint:check": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "typecheck": "tsc --noEmit",
+    "test:run": "vitest run",
+    "verify:agent-hook": "npm run typecheck && npm run lint:check && npm run test:run",
     "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",
@@ -56,12 +64,13 @@
     ]
   },
   "overrides": {
-    "esbuild": "0.25.9",
-    "lodash": "4.18.0"
+    "esbuild": "^0.25.9",
+    "lodash": "4.18.1"
   },
   "dependencies": {
     "ag-grid-community": "^34.3.0",
     "ag-grid-react": "^34.3.0",
+    "mime-types": "^3.0.2",
     "re-resizable": "^6.11.2",
     "react-dnd": "^16.0.1",
     "react-dnd-html5-backend": "^16.0.1",
@@ -69,6 +78,7 @@
   },
   "peerDependencies": {
     "@floating-ui/react": "^0.27.16",
+    "@modelcontextprotocol/sdk": "^1.12.0",
     "@monaco-editor/react": "^4.7.0",
     "@tabler/icons-react": "^3.36.1",
     "@uiw/react-markdown-preview": "^5.1.5",
@@ -78,11 +88,17 @@
     "react": "^19.1.0",
     "react-dom": "^19.1.0"
   },
+  "peerDependenciesMeta": {
+    "@modelcontextprotocol/sdk": {
+      "optional": true
+    }
+  },
   "devDependencies": {
     "@chromatic-com/storybook": "^4.1.3",
     "@eslint/compat": "^1.3.1",
     "@eslint/eslintrc": "^3.3.1",
     "@eslint/js": "^9.31.0",
+    "@modelcontextprotocol/sdk": "^1.29.0",
     "@storybook/addon-a11y": "^10.2.17",
     "@storybook/addon-docs": "^10.2.17",
     "@storybook/addon-vitest": "^10.2.17",
@@ -90,6 +106,8 @@
     "@testing-library/dom": "^10.4.0",
     "@testing-library/react": "^16.3.0",
     "@types/jsdom": "^21.1.7",
+    "@types/mime-types": "^3.0.1",
+    "@types/node": "^22.15.30",
     "@types/react": "^19.1.8",
     "@types/react-dom": "^19.1.6",
     "@vitejs/plugin-react": "^4.6.0",
@@ -97,6 +115,7 @@
     "@vitest/coverage-v8": "^3.2.4",
     "autoprefixer": "^10.4.21",
     "concurrently": "^9.2.0",
+    "esbuild": "^0.25.9",
     "eslint": "^9.30.1",
     "eslint-config-prettier": "^10.1.8",
     "eslint-plugin-import": "2.32.0",
@@ -119,6 +138,7 @@
     "storybook": "^10.2.17",
     "storybook-addon-pseudo-states": "^10.2.17",
     "tailwindcss": "^3.4.17",
+    "tsx": "^4.20.5",
     "typescript": "~5.9.3",
     "typescript-eslint": "^8.48.0",
     "vite": "^7.1.5",