@epam/ai-dial-ui-kit 0.16.0-dev.16 → 0.16.0-dev.19

package/dist/JsonEditor-Bxui5wJH.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),a=require("./lazy-_W6FYhKg.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-Cp-KX6-T.cjs → MarkdownEditor-BKtFs714.cjs}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),b=require("react"),O=require("@uiw/react-md-editor"),_=require("./lazy-DMVYJhUR.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 h=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:g,strikethrough:x,table:j,unorderedListCommand:C}=h;return[s(n,e.jsx(o.IconBold,{...t})),s(l,e.jsx(o.IconItalic,{...t})),s(x,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(g,e.jsx(o.IconQuote,{...t})),s(m,e.jsx(o.IconLink,{...t})),s(i,e.jsx(o.IconCode,{...t})),r,s(j,e.jsx(o.IconTable,{...t}))]},S=()=>{const{codeEdit:n,codeLive:i,codePreview:r,divider:c,fullscreen:a}=h;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,showDragbar:I=!0})=>{const g=b.useMemo(()=>M(),[]),x=b.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:j=>i?.(j||""),height:r,preview:u,visibleDragbar:I,commands:g,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"),b=require("react"),O=require("@uiw/react-md-editor"),_=require("./lazy-_W6FYhKg.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 h=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:g,strikethrough:x,table:j,unorderedListCommand:C}=h;return[s(n,e.jsx(o.IconBold,{...t})),s(l,e.jsx(o.IconItalic,{...t})),s(x,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(g,e.jsx(o.IconQuote,{...t})),s(m,e.jsx(o.IconLink,{...t})),s(i,e.jsx(o.IconCode,{...t})),r,s(j,e.jsx(o.IconTable,{...t}))]},S=()=>{const{codeEdit:n,codeLive:i,codePreview:r,divider:c,fullscreen:a}=h;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,showDragbar:I=!0})=>{const g=b.useMemo(()=>M(),[]),x=b.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:j=>i?.(j||""),height:r,preview:u,visibleDragbar:I,commands:g,extraCommands:x,textareaProps:{placeholder:d,id:l,"aria-label":m}})})};exports.MarkdownEditor=T;

package/dist/{MarkdownEditor-Dav_pp0T.cjs → MarkdownEditor-Bapd1ycU.cjs}

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

package/dist/MarkdownEditorContainer-DLPODjar.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-DAaAOaIu.cjs"),N=require("./lazy-_W6FYhKg.cjs"),b=require("./MarkdownEditor-Bapd1ycU.cjs"),g=({value:r,onChangeValue:l,label:i,headerContent:a,switcherLabel:d,height:c=300,theme:u=N.EditorThemes.dark,onValidateJSON:x,preview:j="edit",showDragbar:w=!0})=>{const C=n.useId(),[t,p]=n.useState(!1),[f,S]=n.useState(null);n.useEffect(()=>{t&&typeof window<"u"&&Promise.resolve().then(()=>require("./JsonEditor-Bxui5wJH.cjs")).then(s=>{S(()=>s.DialJsonEditor)})},[t]);const h=n.useCallback(s=>{l?.(s)},[l]),E=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:C,onChange:s=>p(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:E,currentTheme:u})}):e.jsx(b.DialMarkdownEditor,{value:r,onChange:h,height:c,preview:j,showDragbar:w,theme:u})]})})})};exports.DialMarkdownEditorContainer=g;

package/dist/components/MarkdownEditor/MarkdownEditorContainer.js

@@ -1,29 +1,27 @@
 import { jsx as e, jsxs as r } from "react/jsx-runtime";
 import { useId as J, useState as u, useEffect as S, useCallback as x } from "react";
-import "../../constants/editor.js";
-import { EditorThemes as b } from "../../types/editor.js";
-import "@monaco-editor/react";
-import { DialSwitch as v } from "../Switch/Switch.js";
+import { DialSwitch as b } from "../Switch/Switch.js";
+import { EditorThemes as v } from "../../types/editor.js";
 import { DialMarkdownEditor as y } from "./MarkdownEditor.js";
 import { DialLabel as j } from "../Label/Label.js";
-const q = ({
+const B = ({
   value: s,
   onChangeValue: l,
-  label: i,
+  label: t,
   headerContent: d,
   switcherLabel: a,
   height: c = 300,
-  theme: m = b.dark,
+  theme: m = v.dark,
   onValidateJSON: f,
   preview: C = "edit",
   showDragbar: N = !0
 }) => {
-  const w = J(), [t, D] = u(!1), [p, E] = u(null);
+  const w = J(), [n, D] = u(!1), [p, E] = u(null);
   S(() => {
-    t && typeof window < "u" && import("../JsonEditor/JsonEditor.js").then((o) => {
+    n && typeof window < "u" && import("../JsonEditor/JsonEditor.js").then((o) => {
       E(() => o.DialJsonEditor);
     });
-  }, [t]);
+  }, [n]);
   const h = x(
     (o) => {
       l?.(o);
@@ -34,16 +32,16 @@ const q = ({
       f?.(o);
     },
     [f]
-  ), n = !!a;
+  ), i = !!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: [
-    (i || d || n) && /* @__PURE__ */ r("div", { className: "flex justify-between items-center mb-2", children: [
-      i && /* @__PURE__ */ e(j, { label: i }),
+    (t || d || i) && /* @__PURE__ */ r("div", { className: "flex justify-between items-center mb-2", children: [
+      t && /* @__PURE__ */ e(j, { label: t }),
       /* @__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(
-          v,
+        i && /* @__PURE__ */ e("label", { className: "flex items-center gap-2 cursor-pointer", children: /* @__PURE__ */ e(
+          b,
           {
-            isOn: t,
+            isOn: n,
             label: a,
             switchId: w,
             onChange: (o) => D(o)
@@ -51,7 +49,7 @@ const q = ({
         ) })
       ] })
     ] }),
-    n && t ? /* @__PURE__ */ e(
+    i && n ? /* @__PURE__ */ e(
       "div",
       {
         className: "border border-primary rounded",
@@ -80,5 +78,5 @@ const q = ({
   ] }) }) });
 };
 export {
-  q as DialMarkdownEditorContainer
+  B as DialMarkdownEditorContainer
 };

package/dist/components/New/FolderPath/FolderPath.js

@@ -1,111 +1,170 @@
-import { jsx as r, jsxs as l, Fragment as C } from "react/jsx-runtime";
-import { IconFolder as S, IconDots as _, IconChevronRight as L } from "@tabler/icons-react";
-import { DialBreadcrumbItem as x } from "../../Breadcrumb/BreadcrumbItem.js";
-import { breadcrumbListClassName as D, breadcrumbSeparatorClassName as y, breadcrumbItemBaseClassName as A, breadcrumbBaseClassName as B } from "../../Breadcrumb/constants.js";
-import { DialIcon as m } from "../../Icon/Icon.js";
-import { DIAL_KIT_ICON_STROKE as t } from "../constants/icon.js";
-import { Tooltip as E } from "../Tooltip/Tooltip.js";
-import { DIAL_ICON_SIZE as n } from "../../../constants/icon.js";
-import { mergeClasses as i } from "../../../utils/merge-classes.js";
-import { DIAL_KIT_CLASS as F } from "../../../constants/public-class-names.js";
-const T = 3, G = ({
-  segments: e,
-  labelClassName: d = "dial-small-text",
-  leafClassName: h = "dial-small-semi-text",
-  className: p,
-  ariaLabel: N = "Folder path"
+import { jsx as s, jsxs as h } from "react/jsx-runtime";
+import { IconFolder as O, IconDots as G, IconChevronRight as V } from "@tabler/icons-react";
+import { useRef as f, useState as X, useCallback as v, useEffect as N } from "react";
+import { breadcrumbListClassName as Z, breadcrumbBaseClassName as $, breadcrumbCurrentClassName as q, breadcrumbLinkBaseClassName as H, breadcrumbItemBaseClassName as x, breadcrumbSeparatorClassName as J } from "../../Breadcrumb/constants.js";
+import { DialIcon as E } from "../../Icon/Icon.js";
+import { DIAL_KIT_ICON_STROKE as b } from "../constants/icon.js";
+import { Tooltip as Q } from "../Tooltip/Tooltip.js";
+import { DIAL_ICON_SIZE as k } from "../../../constants/icon.js";
+import { mergeClasses as o } from "../../../utils/merge-classes.js";
+import { DIAL_KIT_CLASS as U } from "../../../constants/public-class-names.js";
+import { observeElementSize as Y, scheduleMeasure as y } from "../../../utils/element-size-observer.js";
+const ee = 3, fe = ({
+  segments: t,
+  labelClassName: R = "dial-small-text",
+  leafClassName: W = "dial-small-semi-text",
+  className: F,
+  ariaLabel: M = "Folder path"
 }) => {
-  const I = /* @__PURE__ */ r(
-    m,
+  const p = f(null), L = f(null), I = f(null), [i, P] = X(!1), C = f(!1), S = f(0), c = v((e) => {
+    C.current = e, P(e);
+  }, []), n = v(() => {
+    const e = p.current;
+    if (!e) return;
+    if (C.current) {
+      e.clientWidth >= S.current && c(!1);
+      return;
+    }
+    const r = L.current, a = I.current;
+    if (!r || !a) return;
+    const d = r.scrollWidth - r.clientWidth, B = parseFloat(getComputedStyle(a).minWidth) || 0, K = a.clientWidth <= B + 1;
+    d > 0 && K && (S.current = e.clientWidth + d, c(!0));
+  }, [c]);
+  N(() => {
+    const e = p.current;
+    if (e)
+      return Y(e, n);
+  }, [n]);
+  const A = t.join("\0");
+  N(() => {
+    c(!1), y(n);
+  }, [A, n, c]), N(() => {
+    i || y(n);
+  }, [i, n]);
+  const D = /* @__PURE__ */ s(
+    E,
     {
-      icon: /* @__PURE__ */ r(
-        S,
+      icon: /* @__PURE__ */ s(
+        O,
         {
-          size: n.SM,
-          stroke: t,
+          size: k.SM,
+          stroke: b,
           "aria-hidden": "true"
         }
       ),
       className: "text-secondary"
     }
-  ), c = /* @__PURE__ */ r(
-    m,
+  ), _ = /* @__PURE__ */ s("span", { className: J, children: /* @__PURE__ */ s(
+    E,
     {
-      icon: /* @__PURE__ */ r(
-        L,
+      icon: /* @__PURE__ */ s(
+        V,
         {
           size: 14,
-          stroke: t,
+          stroke: b,
           "aria-hidden": "true",
           className: "rtl:scale-x-[-1]"
         }
       ),
       className: "text-secondary"
     }
-  ), f = i(
-    d,
-    "text-secondary",
-    "!cursor-default"
-  ), o = (a) => {
-    const s = a === e.length - 1;
-    return /* @__PURE__ */ r(
-      x,
+  ) }), j = o(
+    R,
+    "text-secondary cursor-default"
+  ), l = t.length - 1, T = t.length >= 3 ? l - 1 : -1, g = t.length > ee || i, w = t.slice(
+    1,
+    i ? l : l - 1
+  ), u = (e) => {
+    const r = e === l, a = e === T;
+    let d = t[e];
+    return r && (d = /* @__PURE__ */ s("span", { className: W, children: t[e] })), /* @__PURE__ */ h(
+      "li",
       {
-        label: s ? /* @__PURE__ */ r("span", { className: h, children: e[a] }) : e[a],
-        disabled: !0,
-        iconBefore: a === 0 ? I : void 0,
-        isFirst: a === 0 && e.length > 1,
-        isLast: s,
-        separator: c,
-        labelClassName: f
+        className: o(
+          x,
+          r && "min-w-0",
+          // Gives up its width long before the leaf does.
+          a && "shrink-[1000]",
+          !r && !a && "shrink-0"
+        ),
+        children: [
+          /* @__PURE__ */ h(
+            "span",
+            {
+              className: o(
+                H,
+                q,
+                "pointer-events-none opacity-75",
+                // Lets the label's own minimum width hold the folder at one character.
+                a && "min-w-auto"
+              ),
+              "aria-current": r ? "page" : void 0,
+              "aria-disabled": "true",
+              children: [
+                e === 0 && D,
+                /* @__PURE__ */ s(
+                  "span",
+                  {
+                    ref: r && L || a && I || void 0,
+                    className: o(
+                      "truncate",
+                      r && "min-w-0 flex-1",
+                      a && "min-w-[2ch]",
+                      j
+                    ),
+                    children: d
+                  }
+                )
+              ]
+            }
+          ),
+          !r && _
+        ]
       },
-      `item-${a}`
+      `item-${e}`
     );
-  }, u = e.length > T, b = e.slice(1, -2);
-  return /* @__PURE__ */ r(
-    "nav",
+  }, z = () => /* @__PURE__ */ h(
+    "li",
     {
-      "aria-label": N,
-      className: i(
-        B,
-        p,
-        F.folderPath
-      ),
-      children: /* @__PURE__ */ r("ol", { className: D, children: u ? /* @__PURE__ */ l(C, { children: [
-        o(0),
-        /* @__PURE__ */ l(
-          "li",
+      className: o(x, "shrink-0"),
+      children: [
+        /* @__PURE__ */ h(
+          Q,
           {
-            className: i(A, "shrink-0"),
+            tooltip: t.join(" > "),
+            triggerClassName: "inline-flex cursor-default items-center text-secondary",
             children: [
-              /* @__PURE__ */ l(
-                E,
+              /* @__PURE__ */ s(
+                G,
                 {
-                  tooltip: e.join(" > "),
-                  triggerClassName: "inline-flex cursor-default items-center text-secondary",
-                  children: [
-                    /* @__PURE__ */ r(
-                      _,
-                      {
-                        size: n.SM,
-                        stroke: t,
-                        "aria-hidden": "true"
-                      }
-                    ),
-                    /* @__PURE__ */ r("span", { className: "sr-only", children: b.join(", ") })
-                  ]
+                  size: k.SM,
+                  stroke: b,
+                  "aria-hidden": "true"
                 }
               ),
-              /* @__PURE__ */ r("span", { className: y, children: c })
+              /* @__PURE__ */ s("span", { className: "sr-only", children: w.join(", ") })
             ]
           }
         ),
-        o(e.length - 2),
-        o(e.length - 1)
-      ] }) : e.map((a, s) => o(s)) })
+        _
+      ]
+    },
+    "ellipsis"
+  ), m = [];
+  return g ? (m.push(u(0), z()), i || m.push(u(l - 1)), m.push(u(l))) : t.forEach((e, r) => m.push(u(r))), /* @__PURE__ */ s(
+    "nav",
+    {
+      ref: p,
+      "aria-label": M,
+      className: o(
+        $,
+        F,
+        U.folderPath
+      ),
+      children: /* @__PURE__ */ s("ol", { className: Z, children: m })
     }
   );
 };
 export {
-  G as FolderPath
+  fe as FolderPath
 };

package/dist/components/New/Popup/constants.js

@@ -1,5 +1,5 @@
 import { PopupSize as e } from "../../../types/popup.js";
-const o = "z-popup flex items-center justify-center bg-backdrop md:p-4 gap-5 p-6", a = "relative flex w-full max-h-full flex-col rounded-xl bg-layer-raised md:h-auto", t = "flex flex-row items-center justify-between px-6 py-4", s = "flex-1 min-w-0 mr-3 truncate dial-h1-text text-primary", l = "border-b border-tertiary", r = "flex flex-row items-center gap-2 px-6 py-4", m = "border-t border-tertiary", i = "flex shrink-0 flex-row items-center gap-2", x = "ml-auto mobile:flex-1", n = "mobile:flex-1", u = {
+const o = "z-popup flex items-center justify-center bg-backdrop md:p-4 gap-5 p-6", a = "relative flex w-full max-h-full flex-col rounded-xl bg-layer-raised md:h-auto", t = "flex flex-row items-center justify-between px-6 py-4", s = "flex-1 min-w-0 mr-3 truncate dial-h3-text text-primary", l = "border-b border-tertiary", r = "flex flex-row items-center gap-2 px-6 py-4", m = "border-t border-tertiary", i = "flex shrink-0 flex-row items-center gap-2", x = "ml-auto mobile:flex-1", n = "mobile:flex-1", u = {
   [e.Sm]: "max-w-full md:max-w-[400px]",
   [e.Md]: "max-w-full md:max-w-[800px]",
   [e.Lg]: "max-w-full md:max-w-[1200px]"

package/dist/components/New/TransferQueue/TransferQueue.js

@@ -1,118 +1,113 @@
-import { jsxs as b, jsx as t } from "react/jsx-runtime";
-import { useState as h, useId as Q, useCallback as m, useEffect as w } from "react";
-import { ConfirmationPopup as D } from "../ConfirmationPopup/ConfirmationPopup.js";
+import { jsxs as _, jsx as a } from "react/jsx-runtime";
+import { useState as g, useId as b, useCallback as f, useEffect as Q } from "react";
+import { ConfirmationPopup as w } from "../ConfirmationPopup/ConfirmationPopup.js";
 import { ProgressBar as U } from "../../ProgressBar/ProgressBar.js";
-import { DIAL_KIT_CLASS as F } from "../../../constants/public-class-names.js";
-import { ConfirmationPopupVariant as R } from "../../../types/confirmation-popup.js";
-import { ElementSize as N } from "../../../types/size.js";
-import { TransferQueueItemStatus as l } from "../../../types/transfer-queue.js";
-import { mergeClasses as T } from "../../../utils/merge-classes.js";
-import { DEFAULT_TRANSFER_QUEUE_LABELS as O, TRANSFER_QUEUE_AUTO_CLOSE_DELAY_MS as y } from "./constants.js";
-import { TransferQueueHeader as M } from "./TransferQueueHeader.js";
-import { TransferQueueRow as j } from "./TransferQueueRow.js";
-const q = (n) => Math.round(
+import { DIAL_KIT_CLASS as D } from "../../../constants/public-class-names.js";
+import { ConfirmationPopupVariant as F } from "../../../types/confirmation-popup.js";
+import { ElementSize as R } from "../../../types/size.js";
+import { TransferQueueItemStatus as t } from "../../../types/transfer-queue.js";
+import { mergeClasses as C } from "../../../utils/merge-classes.js";
+import { DEFAULT_TRANSFER_QUEUE_LABELS as N, TRANSFER_QUEUE_AUTO_CLOSE_DELAY_MS as O } from "./constants.js";
+import { TransferQueueHeader as y } from "./TransferQueueHeader.js";
+import { TransferQueueRow as M } from "./TransferQueueRow.js";
+const j = (n) => Math.round(
   n.reduce(
-    (e, r) => e + (r.percent ?? (r.status === l.InProgress ? 0 : 100)),
+    (e, o) => e + (o.percent ?? (o.status === t.InProgress ? 0 : 100)),
     0
   ) / n.length
-), z = (n, e, r) => n && e ? r.closeConfirmDescriptionMixed : e ? r.closeConfirmDescriptionFailed : r.closeConfirmDescriptionInProgress, ee = ({
+), q = (n, e) => n ? e.closeConfirmDescriptionMixed : e.closeConfirmDescriptionInProgress, $ = ({
   title: n,
   items: e,
-  onClose: r,
-  onCancelItem: E,
-  labels: S,
-  autoCloseDelay: i = y,
-  className: v,
-  bodyClassName: x
+  onClose: o,
+  onCancelItem: h,
+  labels: T,
+  autoCloseDelay: l = O,
+  className: E,
+  bodyClassName: S
 }) => {
-  const [c, I] = h(!1), [L, f] = h(!1), p = Q(), s = { ...O, ...S }, d = e.filter(
-    (o) => o.status === l.InProgress
-  ).length, a = d > 0, g = e.filter(
-    (o) => o.status === l.Failed
-  ).length, u = g > 0, C = e.length > 0 && e.every((o) => o.status === l.Success), P = m(() => {
-    a || u ? f(!0) : r();
-  }, [a, u, r]), A = m(() => {
-    f(!1), r();
-  }, [r]), _ = m(() => {
-    I((o) => !o);
+  const [i, v] = g(!1), [x, c] = g(!1), m = b(), s = { ...N, ...T }, p = e.filter(
+    (r) => r.status === t.InProgress
+  ).length, u = p > 0, I = e.some(
+    (r) => r.status === t.Failed
+  ), d = e.length > 0 && e.every((r) => r.status === t.Success), L = f(() => {
+    u ? c(!0) : o();
+  }, [u, o]), P = f(() => {
+    c(!1), o();
+  }, [o]), A = f(() => {
+    v((r) => !r);
   }, []);
-  return w(() => {
-    if (!C || i <= 0) return;
-    const o = setTimeout(r, i);
-    return () => clearTimeout(o);
-  }, [C, i, r]), e.length === 0 ? null : /* @__PURE__ */ b(
+  return Q(() => {
+    if (!d || l <= 0) return;
+    const r = setTimeout(o, l);
+    return () => clearTimeout(r);
+  }, [d, l, o]), e.length === 0 ? null : /* @__PURE__ */ _(
     "div",
     {
       role: "status",
       "aria-live": "polite",
-      className: T(
+      className: C(
         "w-[370px] max-w-[calc(100vw-2rem)] rounded-xl bg-layer-raised shadow-md",
-        v,
-        F.transferQueue
+        E,
+        D.transferQueue
       ),
       children: [
-        /* @__PURE__ */ t(
-          M,
+        /* @__PURE__ */ a(
+          y,
           {
             title: n,
-            failedCount: g,
-            isCollapsed: c,
-            itemsId: p,
+            isCollapsed: i,
+            itemsId: m,
             labels: s,
-            onToggleCollapse: _,
-            onClose: P
+            onToggleCollapse: A,
+            onClose: L
           }
         ),
-        c && a && /*
+        i && u && /*
         * Only while collapsed: expanded, every running row already shows its
         * own spinner, so an aggregate bar would restate what is on screen.
         */
-        /* @__PURE__ */ t(
+        /* @__PURE__ */ a(
           U,
           {
-            value: q(e),
-            size: N.Small,
+            value: j(e),
+            size: R.Small,
             "aria-label": s.queueProgressAriaLabel,
             "aria-valuetext": s.queueProgressValueText(
-              e.length - d,
+              e.length - p,
               e.length
             )
           }
         ),
-        !c && /* @__PURE__ */ t(
+        !i && /* @__PURE__ */ a(
           "div",
           {
-            id: p,
-            className: T(
+            id: m,
+            className: C(
               "flex max-h-[40vh] flex-col overflow-y-auto py-1",
-              x
+              S
             ),
-            children: e.map((o) => /* @__PURE__ */ t(
-              j,
+            children: e.map((r) => /* @__PURE__ */ a(
+              M,
               {
-                item: o,
+                item: r,
                 labels: s,
-                onCancel: E
+                onCancel: h
               },
-              o.id
+              r.id
             ))
           }
         ),
-        /* @__PURE__ */ t(
-          D,
+        /* @__PURE__ */ a(
+          w,
           {
-            open: L,
+            open: x,
             header: s.closeConfirmHeader,
-            description: z(
-              a,
-              u,
-              s
-            ),
+            description: q(I, s),
             confirmLabel: s.closeConfirmLabel,
             cancelLabel: s.closeCancelLabel,
-            variant: R.Danger,
-            onConfirm: A,
-            onClose: () => f(!1)
+            variant: F.Danger,
+            onConfirm: P,
+            onClose: () => c(!1)
           }
         )
       ]
@@ -120,5 +115,5 @@ const q = (n) => Math.round(
   );
 };
 export {
-  ee as TransferQueue
+  $ as TransferQueue
 };