@epam/ai-dial-ui-kit 0.15.0-dev.20 → 0.15.0-dev.21

package/dist/CHANGELOG.md

@@ -31,6 +31,8 @@ Versions match the git tags on the `development` branch.
 
 - **`TransferQueue` (2.0)** — the floating "Importing 5 files" panel for an upload, download, import or export, moved into the kit from `@epam/ai-dial-conversation-panel`'s `ImportExportQueue` so the file manager can use it for uploads too. It is generic: `items` are `{ id, name, status, percent?, message? }` with `TransferQueueItemStatus` (`InProgress`, `Success`, `Warning`, `Failed`, `Canceled`), not the conversation-transfer job the chat library used. Each row draws the 2.0 `FileIcon` for its name, a truncating name, and a trailing status: a named spinner with a cancel control on hover or focus (only when `onCancelItem` is passed; the spinner never takes the pointer, so the control stays clickable in the same cell), a named check, a warning or error icon whose `message` is both its tooltip and its focusable accessible name — a tooltip alone renders nothing on touch — or "Canceled". The header has the caller's `title` verbatim, a failed-item count badge, and collapse (`aria-expanded`/`aria-controls`) and close controls. Collapsed while work runs, the rows give way to one aggregate `ProgressBar` whose `aria-valuetext` counts settled items rather than a percentage. Closing with work in progress or a failure unread asks for confirmation first; once every item succeeds the queue calls `onClose` by itself after `autoCloseDelay` (8000 ms by default, `0` disables), and a warned or canceled row keeps it open. The root is a polite `role="status"` region carrying `dial-kit-transfer-queue` (`DIAL_KIT_CLASS.transferQueue`); positioning is the host's. Every string has an English default in `DEFAULT_TRANSFER_QUEUE_LABELS` and takes an override through `labels`.
 
+- **`Accordion` (2.0) — `caretPosition`** — the header always drew its caret after the title, pushed to the far edge, and a caller whose design puts it beside the title had no way to ask for that. `caretPosition` takes `AccordionCaretPosition.Start` (before the title, with a gap) or `AccordionCaretPosition.End` (the default, today's placement). A non-collapsible panel still draws no caret. Additive; nothing renders differently without it. Requested in [ai-dial-chat](https://github.com/epam/ai-dial-chat) while moving its hand-rolled disclosures onto `Accordion`.
+
 ### Fixed
 
 - **`Select` and `Dropdown` (2.0) — rows are 2px apart, and every option list and submenu has the same vertical inset** — rows were stacked edge to edge, so a selected row's tint and a hovered neighbour's merged into one block; every option list, menu and kit-rendered submenu now stacks its rows with `gap-0.5` (the shared `overlayListClassName`). Separately, the `Dropdown` menu wraps its rows in `py-1` inside the panel's `p-1`, but the `Select` option list and the submenus of both components rendered their rows straight into the panel, so the first and last rows (and the focus ring of a keyboard-focused one) sat flush against its top and bottom edge. The `Select` option list now carries the same `py-1`, and a submenu panel of kit-rendered rows takes `py-2` — the same 8px in total. A `Dropdown` submenu drawn through `renderSubMenu` keeps the plain panel, as a `renderOverlay` body does at the top level.

package/dist/JsonEditor-BDe6elKO.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),a=require("./lazy-BEsZqouS.cjs"),c=require("@monaco-editor/react");function g(e){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const t=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(o,r,t.get?t:{enumerable:!0,get:()=>e[r]})}}return o.default=e,Object.freeze(o)}const f=g(c),b={[a.EditorThemes.dark]:{base:"vs-dark",inherit:!1,rules:[{token:"string.key.json",foreground:"#37BABC"},{token:"string.value.json",foreground:"#5C8DEA"},{token:"number",foreground:"#D97C27"},{token:"keyword.json",foreground:"#F4CE46"},{token:"delimiter",foreground:"#EEF1F7"},{token:"delimiter.bracket.json",foreground:"#A972FF"},{token:"delimiter.parenthesis",foreground:"#A972FF"}],colors:{"editor.foreground":"#F76464","editor.background":"#161B2D","editorCursor.foreground":"#EEF1F7","editor.selectionBackground":"#5C8DEA2B","editorLineNumber.foreground":"#242C42","scrollbarSlider.background":"#242C42","scrollbarSlider.hoverBackground":"#242C42","scrollbarSlider.activeBackground":"#242C42"}},[a.EditorThemes.light]:{base:"vs",inherit:!1,rules:[{token:"string.key.json",foreground:"#009D9F"},{token:"string.value.json",foreground:"#2764D9"},{token:"number",foreground:"#B25500"},{token:"keyword.json",foreground:"#3F3D25"},{token:"delimiter",foreground:"#161B2D"},{token:"delimiter.bracket.json",foreground:"#7E39EC"},{token:"delimiter.parenthesis",foreground:"#7E39EC"}],colors:{"editor.foreground":"#AE2F2F","editor.background":"#EEF1F7","editorCursor.foreground":"#161B2D","editor.selectionBackground":"#5C8DEA2B","editorLineNumber.foreground":"#242C42","scrollbarSlider.background":"#242C42","scrollbarSlider.hoverBackground":"#242C42","scrollbarSlider.activeBackground":"#242C42"}}},k=({value:e,onChange:o,onValidateJSON:r,options:t,currentTheme:n,themesConfig:s=b})=>{function d(i){i?.editor?.defineTheme(n,s[n]),i.languages.json.jsonDefaults.setDiagnosticsOptions({validate:!0,enableSchemaRequest:!1,schemas:[{uri:"http://custom-schema/object-required.json",fileMatch:["*"],schema:{type:"object",description:"Top-level value must be an object",additionalProperties:!0}}]})}const{Editor:l}=f;return u.jsx(l,{beforeMount:d,height:"100%",defaultLanguage:"json",value:e,onChange:o,theme:n,onValidate:r,options:{minimap:{enabled:!1},formatOnType:!0,formatOnPaste:!0,selectOnLineNumbers:!1,automaticLayout:!0,scrollBeyondLastLine:!1,wordWrap:"on",smoothScrolling:!0,overviewRulerLanes:0,scrollbar:{horizontal:"hidden",verticalScrollbarSize:4,verticalSliderSize:4},...t??{}}})};exports.DialJsonEditor=k;

package/dist/{MarkdownEditor-NYMcKLJy.cjs → MarkdownEditor-C7BONfsl.cjs}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),j=require("react"),O=require("@uiw/react-md-editor"),_=require("./lazy-Cy9WobJf.cjs"),k=require("./merge-classes-BEJXjzkx.cjs"),o=require("@tabler/icons-react"),p=require("./icon-DhjrDQ8I.cjs"),f=require("./icon-CrGVkVpG.cjs");function E(n){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const r in n)if(r!=="default"){const c=Object.getOwnPropertyDescriptor(n,r);Object.defineProperty(i,r,c.get?c:{enumerable:!0,get:()=>n[r]})}}return i.default=n,Object.freeze(i)}const b=E(O),L=f.DIAL_ICON_SIZE.SM,t={size:L,stroke:p.DIAL_KIT_ICON_STROKE},s=(n,i)=>({...n,icon:i}),M=()=>{const{bold:n,code:i,divider:r,group:c,heading1:a,heading2:d,heading3:u,italic:l,link:m,orderedListCommand:I,quote:x,strikethrough:g,table:h,unorderedListCommand:C}=b;return[s(n,e.jsx(o.IconBold,{...t})),s(l,e.jsx(o.IconItalic,{...t})),s(g,e.jsx(o.IconStrikethrough,{...t})),r,c([a,d,u],{name:"heading",groupName:"heading",icon:e.jsx(o.IconTextSize,{...t}),buttonProps:{"aria-label":"Text style",title:"Text style"}}),r,s(C,e.jsx(o.IconList,{...t})),s(I,e.jsx(o.IconListNumbers,{...t})),r,s(x,e.jsx(o.IconQuote,{...t})),s(m,e.jsx(o.IconLink,{...t})),s(i,e.jsx(o.IconCode,{...t})),r,s(h,e.jsx(o.IconTable,{...t}))]},S=()=>{const{codeEdit:n,codeLive:i,codePreview:r,divider:c,fullscreen:a}=b;return[s(n,e.jsx(o.IconPencil,{...t})),s(i,e.jsx(o.IconLayoutColumns,{...t})),s(r,e.jsx(o.IconEye,{...t})),c,s(a,e.jsx(o.IconMaximize,{...t}))]},T=({value:n,onChange:i,height:r=300,theme:c=_.EditorThemes.light,className:a,placeholder:d,defaultPreview:u="edit",id:l,ariaLabel:m})=>{const I=j.useMemo(()=>M(),[]),x=j.useMemo(()=>S(),[]);return e.jsx("div",{"data-color-mode":c,className:k.mergeClasses("dial-kit-markdown-editor",a),children:e.jsx(O,{value:n,onChange:g=>i?.(g||""),height:r,preview:u,commands:I,extraCommands:x,textareaProps:{placeholder:d,id:l,"aria-label":m}})})};exports.MarkdownEditor=T;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),j=require("react"),O=require("@uiw/react-md-editor"),_=require("./lazy-BEsZqouS.cjs"),k=require("./merge-classes-BEJXjzkx.cjs"),o=require("@tabler/icons-react"),p=require("./icon-DhjrDQ8I.cjs"),f=require("./icon-CrGVkVpG.cjs");function E(n){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const r in n)if(r!=="default"){const c=Object.getOwnPropertyDescriptor(n,r);Object.defineProperty(i,r,c.get?c:{enumerable:!0,get:()=>n[r]})}}return i.default=n,Object.freeze(i)}const b=E(O),L=f.DIAL_ICON_SIZE.SM,t={size:L,stroke:p.DIAL_KIT_ICON_STROKE},s=(n,i)=>({...n,icon:i}),M=()=>{const{bold:n,code:i,divider:r,group:c,heading1:a,heading2:d,heading3:u,italic:l,link:m,orderedListCommand:I,quote:x,strikethrough:g,table:h,unorderedListCommand:C}=b;return[s(n,e.jsx(o.IconBold,{...t})),s(l,e.jsx(o.IconItalic,{...t})),s(g,e.jsx(o.IconStrikethrough,{...t})),r,c([a,d,u],{name:"heading",groupName:"heading",icon:e.jsx(o.IconTextSize,{...t}),buttonProps:{"aria-label":"Text style",title:"Text style"}}),r,s(C,e.jsx(o.IconList,{...t})),s(I,e.jsx(o.IconListNumbers,{...t})),r,s(x,e.jsx(o.IconQuote,{...t})),s(m,e.jsx(o.IconLink,{...t})),s(i,e.jsx(o.IconCode,{...t})),r,s(h,e.jsx(o.IconTable,{...t}))]},S=()=>{const{codeEdit:n,codeLive:i,codePreview:r,divider:c,fullscreen:a}=b;return[s(n,e.jsx(o.IconPencil,{...t})),s(i,e.jsx(o.IconLayoutColumns,{...t})),s(r,e.jsx(o.IconEye,{...t})),c,s(a,e.jsx(o.IconMaximize,{...t}))]},T=({value:n,onChange:i,height:r=300,theme:c=_.EditorThemes.light,className:a,placeholder:d,defaultPreview:u="edit",id:l,ariaLabel:m})=>{const I=j.useMemo(()=>M(),[]),x=j.useMemo(()=>S(),[]);return e.jsx("div",{"data-color-mode":c,className:k.mergeClasses("dial-kit-markdown-editor",a),children:e.jsx(O,{value:n,onChange:g=>i?.(g||""),height:r,preview:u,commands:I,extraCommands:x,textareaProps:{placeholder:d,id:l,"aria-label":m}})})};exports.MarkdownEditor=T;

package/dist/{MarkdownEditor-CPzMv3lE.cjs → MarkdownEditor-FVzYMdkC.cjs}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("@uiw/react-md-editor"),m=require("./lazy-Cy9WobJf.cjs"),u=require("./merge-classes-BEJXjzkx.cjs"),x=({value:t,onChange:s,height:o=300,preview:i="edit",theme:a=m.EditorThemes.dark,className:n,placeholder:r})=>{const d=r!==void 0&&!t;return e.jsxs("div",{"data-color-mode":a,className:u.mergeClasses("relative",n),children:[e.jsx(c,{value:t,onChange:l=>s?.(l||""),height:o,preview:i}),d&&e.jsx("div",{className:"pointer-events-none absolute left-0 top-8 px-2 dial-small-text text-secondary opacity-40",children:r})]})};exports.DialMarkdownEditor=x;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("@uiw/react-md-editor"),m=require("./lazy-BEsZqouS.cjs"),u=require("./merge-classes-BEJXjzkx.cjs"),x=({value:t,onChange:s,height:o=300,preview:i="edit",theme:a=m.EditorThemes.dark,className:n,placeholder:r})=>{const d=r!==void 0&&!t;return e.jsxs("div",{"data-color-mode":a,className:u.mergeClasses("relative",n),children:[e.jsx(c,{value:t,onChange:l=>s?.(l||""),height:o,preview:i}),d&&e.jsx("div",{className:"pointer-events-none absolute left-0 top-8 px-2 dial-small-text text-secondary opacity-40",children:r})]})};exports.DialMarkdownEditor=x;

package/dist/MarkdownEditorContainer-BA94ffC4.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("react"),m=require("./Switch-CfxMs3AZ.cjs"),E=require("./lazy-BEsZqouS.cjs"),N=require("./MarkdownEditor-FVzYMdkC.cjs"),b=({value:r,onChangeValue:l,label:i,headerContent:a,switcherLabel:d,height:c=300,theme:u=E.EditorThemes.dark,onValidateJSON:x,preview:j="edit"})=>{const w=n.useId(),[t,C]=n.useState(!1),[f,p]=n.useState(null);n.useEffect(()=>{t&&typeof window<"u"&&Promise.resolve().then(()=>require("./JsonEditor-BDe6elKO.cjs")).then(s=>{p(()=>s.DialJsonEditor)})},[t]);const h=n.useCallback(s=>{l?.(s)},[l]),S=n.useCallback(s=>{x?.(s)},[x]),o=!!d;return e.jsx("div",{className:"size-full flex flex-col",children:e.jsx("div",{className:"flex flex-col gap-8",children:e.jsxs("div",{children:[(i||a||o)&&e.jsxs("div",{className:"flex justify-between items-center mb-2",children:[i&&e.jsx(m.DialLabel,{label:i}),e.jsxs("div",{className:"flex items-center gap-2 flex-1 justify-end",children:[a,o&&e.jsx("label",{className:"flex items-center gap-2 cursor-pointer",children:e.jsx(m.DialSwitch,{isOn:t,label:d,switchId:w,onChange:s=>C(s)})})]})]}),o&&t?e.jsx("div",{className:"border border-primary rounded",style:{height:`${c}px`},children:f&&e.jsx(f,{value:r,onChange:h,onValidateJSON:S,currentTheme:u})}):e.jsx(N.DialMarkdownEditor,{value:r,onChange:h,height:c,preview:j,theme:u})]})})})};exports.DialMarkdownEditorContainer=b;

package/dist/components/MarkdownEditor/MarkdownEditorContainer.js

@@ -1,28 +1,26 @@
 import { jsx as e, jsxs as r } from "react/jsx-runtime";
 import { useId as g, useState as x, useEffect as J, useCallback as u } from "react";
-import "../../constants/editor.js";
-import { EditorThemes as S } from "../../types/editor.js";
-import "@monaco-editor/react";
-import { DialSwitch as b } from "../Switch/Switch.js";
+import { DialSwitch as S } from "../Switch/Switch.js";
+import { EditorThemes as b } from "../../types/editor.js";
 import { DialMarkdownEditor as v } from "./MarkdownEditor.js";
 import { DialLabel as y } from "../Label/Label.js";
-const $ = ({
+const z = ({
   value: s,
   onChangeValue: l,
-  label: t,
+  label: i,
   headerContent: d,
   switcherLabel: a,
   height: c = 300,
-  theme: m = S.dark,
+  theme: m = b.dark,
   onValidateJSON: f,
   preview: C = "edit"
 }) => {
-  const N = g(), [i, w] = x(!1), [p, D] = x(null);
+  const N = g(), [n, w] = x(!1), [p, D] = x(null);
   J(() => {
-    i && typeof window < "u" && import("../JsonEditor/JsonEditor.js").then((o) => {
+    n && typeof window < "u" && import("../JsonEditor/JsonEditor.js").then((o) => {
       D(() => o.DialJsonEditor);
     });
-  }, [i]);
+  }, [n]);
   const h = u(
     (o) => {
       l?.(o);
@@ -33,16 +31,16 @@ const $ = ({
       f?.(o);
     },
     [f]
-  ), n = !!a;
+  ), t = !!a;
   return /* @__PURE__ */ e("div", { className: "size-full flex flex-col", children: /* @__PURE__ */ e("div", { className: "flex flex-col gap-8", children: /* @__PURE__ */ r("div", { children: [
-    (t || d || n) && /* @__PURE__ */ r("div", { className: "flex justify-between items-center mb-2", children: [
-      t && /* @__PURE__ */ e(y, { label: t }),
+    (i || d || t) && /* @__PURE__ */ r("div", { className: "flex justify-between items-center mb-2", children: [
+      i && /* @__PURE__ */ e(y, { label: i }),
       /* @__PURE__ */ r("div", { className: "flex items-center gap-2 flex-1 justify-end", children: [
         d,
-        n && /* @__PURE__ */ e("label", { className: "flex items-center gap-2 cursor-pointer", children: /* @__PURE__ */ e(
-          b,
+        t && /* @__PURE__ */ e("label", { className: "flex items-center gap-2 cursor-pointer", children: /* @__PURE__ */ e(
+          S,
           {
-            isOn: i,
+            isOn: n,
             label: a,
             switchId: N,
             onChange: (o) => w(o)
@@ -50,7 +48,7 @@ const $ = ({
         ) })
       ] })
     ] }),
-    n && i ? /* @__PURE__ */ e(
+    t && n ? /* @__PURE__ */ e(
       "div",
       {
         className: "border border-primary rounded",
@@ -78,5 +76,5 @@ const $ = ({
   ] }) }) });
 };
 export {
-  $ as DialMarkdownEditorContainer
+  z as DialMarkdownEditorContainer
 };

package/dist/components/New/Accordion/Accordion.js

@@ -1,99 +1,103 @@
-import { jsxs as a, Fragment as A, jsx as e } from "react/jsx-runtime";
-import { IconChevronRight as S } from "@tabler/icons-react";
-import { useState as C, useId as E } from "react";
-import { DIAL_KIT_ICON_STROKE as j } from "../constants/icon.js";
-import { DIAL_ICON_SIZE as L } from "../../../constants/icon.js";
-import { resolveAccessibleName as T } from "../../../utils/accessible-name.js";
+import { jsx as t, jsxs as s, Fragment as j } from "react/jsx-runtime";
+import { IconChevronRight as T } from "@tabler/icons-react";
+import { useState as k, useId as D } from "react";
+import { DIAL_KIT_ICON_STROKE as K } from "../constants/icon.js";
+import { DIAL_ICON_SIZE as O } from "../../../constants/icon.js";
+import { resolveAccessibleName as R } from "../../../utils/accessible-name.js";
 import { mergeClasses as r } from "../../../utils/merge-classes.js";
-import { DIAL_KIT_CLASS as k } from "../../../constants/public-class-names.js";
-const Z = ({
-  title: p,
-  description: s,
-  children: h,
-  expanded: c,
-  defaultExpanded: y = !1,
-  disabled: n,
-  nonCollapsible: o,
-  ariaLabel: I,
-  onToggle: v,
-  className: g,
-  headerClassName: l,
-  contentClassName: N
+import { DIAL_KIT_CLASS as $ } from "../../../constants/public-class-names.js";
+import { AccordionCaretPosition as I } from "../../../types/accordion.js";
+const J = ({
+  title: v,
+  description: c,
+  children: g,
+  expanded: l,
+  defaultExpanded: N = !1,
+  disabled: o,
+  nonCollapsible: n,
+  ariaLabel: b,
+  onToggle: A,
+  caretPosition: C = I.End,
+  className: S,
+  headerClassName: d,
+  contentClassName: _
 }) => {
-  const d = c !== void 0, [b, w] = C(y), t = o ? !0 : d ? c : b, m = E(), i = `accordion-header-${m}`, x = `accordion-content-${m}`, _ = () => {
-    if (n) return;
-    const u = !t;
-    d || w(u), v?.(u);
-  }, f = /* @__PURE__ */ a(A, { children: [
-    /* @__PURE__ */ a("span", { className: "flex min-w-0 flex-col", children: [
-      /* @__PURE__ */ e("span", { className: "truncate dial-body-text text-primary", children: p }),
-      s ? /* @__PURE__ */ e("span", { className: "truncate dial-tiny-text text-secondary", children: s }) : null
+  const m = l !== void 0, [w, E] = k(N), e = n ? !0 : m ? l : w, f = D(), a = `accordion-header-${f}`, u = `accordion-content-${f}`, L = () => {
+    if (o) return;
+    const y = !e;
+    m || E(y), A?.(y);
+  }, i = C === I.Start, x = n ? null : /* @__PURE__ */ t(
+    T,
+    {
+      size: O.SM,
+      stroke: K,
+      "aria-hidden": "true",
+      className: r(
+        "shrink-0 text-secondary transition-transform motion-reduce:transition-none",
+        e && "rotate-90"
+      )
+    }
+  ), p = /* @__PURE__ */ s(j, { children: [
+    i && x,
+    /* @__PURE__ */ s("span", { className: "flex min-w-0 flex-col", children: [
+      /* @__PURE__ */ t("span", { className: "truncate dial-body-text text-primary", children: v }),
+      c ? /* @__PURE__ */ t("span", { className: "truncate dial-tiny-text text-secondary", children: c }) : null
     ] }),
-    !o && // Caret at the leading edge; it turns a quarter turn to point down when open.
-    /* @__PURE__ */ e(
-      S,
-      {
-        size: L.SM,
-        stroke: j,
-        "aria-hidden": "true",
-        className: r(
-          "shrink-0 text-secondary transition-transform motion-reduce:transition-none",
-          t && "rotate-90"
-        )
-      }
-    )
-  ] });
-  return /* @__PURE__ */ a(
+    !i && x
+  ] }), h = i ? "justify-start gap-2" : "justify-between";
+  return /* @__PURE__ */ s(
     "div",
     {
       className: r(
         "flex flex-col gap-3 py-3 overflow-hidden bg-transparent ",
-        g,
-        k.accordion
+        S,
+        $.accordion
       ),
       children: [
-        o ? /* @__PURE__ */ e(
+        n ? /* @__PURE__ */ t(
           "div",
           {
-            id: i,
+            id: a,
             className: r(
-              "flex w-full px-4 rounded-xl items-center justify-between dial-tiny-text",
-              l
+              "flex w-full px-4 rounded-xl items-center dial-tiny-text",
+              h,
+              d
             ),
-            children: f
+            children: p
           }
-        ) : /* @__PURE__ */ e(
+        ) : /* @__PURE__ */ t(
           "button",
           {
-            id: i,
+            id: a,
             type: "button",
-            "aria-expanded": t,
-            "aria-controls": t ? x : void 0,
-            "aria-label": T(I),
-            disabled: n,
-            onClick: _,
+            "aria-expanded": e,
+            "aria-controls": e ? u : void 0,
+            "aria-label": R(b),
+            disabled: o,
+            onClick: L,
             className: r(
-              "flex w-full px-4 rounded-xl items-center justify-between dial-tiny-text",
-              n ? "cursor-not-allowed opacity-75" : (
+              "flex w-full px-4 rounded-xl items-center dial-tiny-text",
+              h,
+              o ? "cursor-not-allowed opacity-75" : (
                 // Applied only to a header that can actually be operated.
                 "cursor-pointer hover:bg-control-accent-alpha-hover focus-visible:outline focus-visible:outline-focus"
               ),
-              l
+              d
             ),
-            children: f
+            children: p
           }
         ),
-        t && /* @__PURE__ */ e(
+        e && /* @__PURE__ */ t(
           "div",
           {
-            id: x,
+            id: u,
             role: "region",
-            "aria-labelledby": i,
+            "aria-labelledby": a,
             className: r(
               "px-4 dial-small-text text-primary",
-              N
+              _
             ),
-            children: h
+            children: g
           }
         )
       ]
@@ -101,5 +105,5 @@ const Z = ({
   );
 };
 export {
-  Z as Accordion
+  J as Accordion
 };

package/dist/components-manifest.json

@@ -1,6 +1,6 @@
 {
-  "version": "0.15.0-dev.20",
-  "generatedAt": "2026-09-25T19:21:54.761Z",
+  "version": "0.15.0-dev.21",
+  "generatedAt": "2026-09-27T13:45:56.317Z",
   "kit": {
     "name": "@epam/ai-dial-ui-kit",
     "description": "A modern UI kit for building AI DIAL interfaces with React",
@@ -2333,6 +2333,13 @@
           "required": false,
           "description": "Fired when the header is clicked. Receives the next expanded state."
         },
+        {
+          "name": "caretPosition",
+          "type": "AccordionCaretPosition",
+          "required": false,
+          "defaultValue": "AccordionCaretPosition.End",
+          "description": "Where the header draws its caret: before or after the title."
+        },
         {
           "name": "className",
           "type": "string",
@@ -10931,6 +10938,24 @@
       ],
       "sourceFile": "components/New/Textarea/Textarea.tsx"
     },
+    {
+      "name": "AccordionCaretPosition",
+      "kind": "enum",
+      "members": [
+        {
+          "name": "Start",
+          "value": "'start'",
+          "comment": "Before the title, at the header's leading edge."
+        },
+        {
+          "name": "End",
+          "value": "'end'",
+          "comment": "After the title, at the header's trailing edge."
+        }
+      ],
+      "sourceFile": "types/accordion.ts",
+      "description": "Where an `Accordion` header draws its caret."
+    },
     {
       "name": "RadioGroupItem",
       "kind": "interface",