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

package/dist/utils/avatar.js

@@ -0,0 +1,22 @@
+const o = [
+  { background: "bg-green-1", foreground: "text-green-2" },
+  { background: "bg-violet-2", foreground: "text-violet-1" },
+  { background: "bg-brown", foreground: "text-brown-2" },
+  { background: "bg-red", foreground: "text-red" },
+  { background: "bg-green-2", foreground: "text-green-3" },
+  { background: "bg-blue", foreground: "text-accent" },
+  { background: "bg-violet-1", foreground: "text-violet-2" }
+], c = (t) => {
+  let e = 0;
+  for (let r = 0; r < t.length; r++)
+    e += t.charCodeAt(r);
+  return o[e % o.length];
+}, n = (t) => t.match(new RegExp("\\p{L}", "u"))?.[0] ?? "", l = (t) => {
+  const e = t.trim().split(/\s+/).filter(Boolean);
+  return e.length === 0 ? "?" : e.length >= 2 ? (n(e[0]) + n(e[1])).toUpperCase() || "?" : e[0].replace(/[^\p{L}]/gu, "").slice(0, 2).toUpperCase() || "?";
+};
+export {
+  o as AVATAR_PALETTE,
+  l as extractInitials,
+  c as pickAvatarColor
+};

package/dist/{components/SchemaRenderer/utils.js → utils/json-schema.js}

@@ -1,63 +1,64 @@
-import { JsonSchemaType as d } from "./types.js";
-function b(r, n) {
+import { JsonSchemaType as f } from "../types/json-schema.js";
+function $(r, n) {
   const i = { ...r, ...n };
   return (r.properties || n.properties) && (i.properties = { ...r.properties, ...n.properties }), (r.required || n.required) && (i.required = Array.from(
     /* @__PURE__ */ new Set([...r.required ?? [], ...n.required ?? []])
   )), i;
 }
-function u(r, n, i = 0) {
+function p(r, n, i = 0) {
   if (i > 10) return r;
   let t = r;
   if (t.$ref) {
     const e = t.$ref.replace(/^#\//, "").split("/");
     let o = n;
-    for (const l of e)
-      o = o?.[l];
+    for (const u of e)
+      o = o?.[u];
     if (!o || typeof o != "object") return r;
-    const { $ref: f, ...y } = t, p = o;
-    t = { ...p.$ref ? u(p, n, i + 1) : p, ...y };
+    const { $ref: s, ...y } = t, d = o;
+    t = { ...d.$ref ? p(d, n, i + 1) : d, ...y };
   }
   if (t.allOf && t.allOf.length > 0) {
     const { allOf: e, ...o } = t;
-    let f = {};
+    let s = {};
     for (const y of e)
-      f = b(f, u(y, n, i + 1));
-    t = b(f, o);
+      s = $(s, p(y, n, i + 1));
+    t = $(s, o);
   }
   return t;
 }
-function P(r) {
+function T(r) {
   return r.map((n, i) => ({ entry: n, index: i })).sort((n, i) => {
     const t = n.entry[1]["dial:meta"]?.["dial:propertyOrder"] ?? 1 / 0, e = i.entry[1]["dial:meta"]?.["dial:propertyOrder"] ?? 1 / 0;
     return t !== e ? t - e : n.index - i.index;
   }).map(({ entry: n }) => n);
 }
-function A(r) {
+function j(r) {
   return r == null || r === "";
 }
 function O(r) {
-  return r.type === d.Object || r.properties != null && r.oneOf == null && r.anyOf == null && r.type == null;
+  return r.type === f.Object || r.properties != null && r.oneOf == null && r.anyOf == null && r.type == null;
 }
-function I(r) {
+function N(r) {
   return r.replace(/_/g, " ").replace(/([a-z])([A-Z])/g, "$1 $2").replace(/\b\w/g, (n) => n.toUpperCase());
 }
+const I = (r) => `"${r}" is required`;
 function q(r, n) {
-  return r.type === d.Null ? "null" : r.$ref ? u(r, n).title ?? r.$ref.split("/").pop() ?? "Option" : r.title ? r.title : r.type ? Array.isArray(r.type) ? r.type.join(" | ") : r.type : r.discriminator ? Object.keys(r.discriminator.mapping).join(" | ") : r.const != null ? String(r.const) : r.oneOf ? "One of options" : "Option";
+  return r.type === f.Null ? "null" : r.$ref ? p(r, n).title ?? r.$ref.split("/").pop() ?? "Option" : r.title ? r.title : r.type ? Array.isArray(r.type) ? r.type.join(" | ") : r.type : r.discriminator ? Object.keys(r.discriminator.mapping).join(" | ") : r.const != null ? String(r.const) : r.oneOf ? "One of options" : "Option";
 }
-function j(r, n, i = 0) {
+function A(r, n, i = 0) {
   if (i > 15) return;
-  const t = u(r, n);
+  const t = p(r, n);
   if ("default" in t)
     return t.default;
   if (t.discriminator && t.oneOf) {
     const e = Object.keys(t.discriminator.mapping)[0];
     if (e) {
-      const o = u(
+      const o = p(
         { $ref: t.discriminator.mapping[e] },
         n
       );
       return {
-        ...j(o, n, i + 1) ?? {},
+        ...A(o, n, i + 1) ?? {},
         [t.discriminator.propertyName]: e
       };
     }
@@ -66,9 +67,9 @@ function j(r, n, i = 0) {
     if (t.properties) {
       const e = {};
       let o = !1;
-      for (const [f, y] of Object.entries(t.properties)) {
-        const p = j(y, n, i + 1);
-        p !== void 0 && (e[f] = p, o = !0);
+      for (const [s, y] of Object.entries(t.properties)) {
+        const d = A(y, n, i + 1);
+        d !== void 0 && (e[s] = d, o = !0);
       }
       return o ? e : void 0;
     }
@@ -76,26 +77,26 @@ function j(r, n, i = 0) {
       return {};
   }
 }
-function $(r, n, i, t = "", e = 0) {
+function b(r, n, i, t = "", e = 0) {
   if (e > 15) return [];
-  const o = [], f = u(n, i);
-  if (f.anyOf) {
-    const s = f.anyOf.filter(
-      (l) => l.type !== d.Null
+  const o = [], s = p(n, i);
+  if (s.anyOf) {
+    const l = s.anyOf.filter(
+      (u) => u.type !== f.Null
     );
-    return r != null && s.length === 1 ? $(
+    return r != null && l.length === 1 ? b(
       r,
-      s[0],
+      l[0],
       i,
       t,
       e + 1
     ) : o;
   }
-  if (f.oneOf && f.discriminator) {
-    const s = f.discriminator.propertyName, l = r?.[s];
-    if (l && f.discriminator.mapping[l]) {
-      const a = { $ref: f.discriminator.mapping[l] }, c = u(a, i);
-      return $(
+  if (s.oneOf && s.discriminator) {
+    const l = s.discriminator.propertyName, u = r?.[l];
+    if (u && s.discriminator.mapping[u]) {
+      const a = { $ref: s.discriminator.mapping[u] }, c = p(a, i);
+      return b(
         r,
         c,
         i,
@@ -105,41 +106,41 @@ function $(r, n, i, t = "", e = 0) {
     }
     return o;
   }
-  if (f.type === d.Array || !f.type && Array.isArray(r)) {
-    if (Array.isArray(r) && f.items)
-      for (let s = 0; s < r.length; s++) {
-        const l = $(
-          r[s],
-          f.items,
+  if (s.type === f.Array || !s.type && Array.isArray(r)) {
+    if (Array.isArray(r) && s.items)
+      for (let l = 0; l < r.length; l++) {
+        const u = b(
+          r[l],
+          s.items,
           i,
-          `${t}[${s}]`,
+          `${t}[${l}]`,
           e + 1
         );
-        o.push(...l);
+        o.push(...u);
       }
     return o;
   }
-  if (!O(f)) return o;
-  const y = f.required ?? [], p = r;
-  for (const s of y) {
-    const l = f.properties?.[s];
-    if (l && u(l, i).isHidden)
+  if (!O(s)) return o;
+  const y = s.required ?? [], d = r;
+  for (const l of y) {
+    const u = s.properties?.[l];
+    if (u && p(u, i).isHidden)
       continue;
-    const a = t ? `${t}.${s}` : s, c = p?.[s];
-    if (A(c)) {
-      const g = l?.title ?? I(s);
-      o.push({ path: a, message: `${g} is required` });
+    const a = t ? `${t}.${l}` : l, c = d?.[l];
+    if (j(c)) {
+      const g = u?.title ?? N(l);
+      o.push({ path: a, message: I(g) });
     }
   }
-  if (p && f.properties)
-    for (const [s, l] of Object.entries(f.properties)) {
-      if (u(l, i).isHidden)
+  if (d && s.properties)
+    for (const [l, u] of Object.entries(s.properties)) {
+      if (p(u, i).isHidden)
         continue;
-      const a = t ? `${t}.${s}` : s, c = p[s];
+      const a = t ? `${t}.${l}` : l, c = d[l];
       if (c != null) {
-        const g = $(
+        const g = b(
           c,
-          l,
+          u,
           i,
           a,
           e + 1
@@ -147,12 +148,12 @@ function $(r, n, i, t = "", e = 0) {
         o.push(...g);
       }
     }
-  if (p && f.additionalProperties != null && f.additionalProperties !== !1 && typeof f.additionalProperties == "object") {
-    const s = f.additionalProperties;
-    for (const [l, a] of Object.entries(p)) {
-      const c = t ? `${t}.${l}` : l, g = $(
+  if (d && s.additionalProperties != null && s.additionalProperties !== !1 && typeof s.additionalProperties == "object") {
+    const l = s.additionalProperties;
+    for (const [u, a] of Object.entries(d)) {
+      const c = t ? `${t}.${u}` : u, g = b(
         a,
-        s,
+        l,
         i,
         c,
         e + 1
@@ -162,61 +163,61 @@ function $(r, n, i, t = "", e = 0) {
   }
   return o;
 }
-function v(r, n, i) {
-  const t = u(n, i);
+function E(r, n, i) {
+  const t = p(n, i);
   if (Array.isArray(r))
     return `${r.length} item${r.length !== 1 ? "s" : ""}`;
   if (O(t) && t.properties) {
     const e = Object.entries(t.properties).filter(
-      ([, p]) => !u(p, i).isHidden
-    ), o = e.length, f = r;
-    return `${e.filter(([p]) => {
-      const s = f?.[p];
-      return s != null && s !== "";
+      ([, d]) => !p(d, i).isHidden
+    ), o = e.length, s = r;
+    return `${e.filter(([d]) => {
+      const l = s?.[d];
+      return l != null && l !== "";
     }).length}/${o} fields`;
   }
   return "";
 }
-function N(r, n, i) {
+function R(r, n, i) {
   if (r == null) {
-    const t = n.findIndex((e) => e.type === d.Null);
+    const t = n.findIndex((e) => e.type === f.Null);
     return t >= 0 ? t : 0;
   }
   if (Array.isArray(r)) {
-    const t = n.findIndex((e) => u(e, i).type === d.Array);
+    const t = n.findIndex((e) => p(e, i).type === f.Array);
     return t >= 0 ? t : 0;
   }
   if (typeof r == "boolean") {
-    const t = n.findIndex((e) => u(e, i).type === d.Boolean);
+    const t = n.findIndex((e) => p(e, i).type === f.Boolean);
     return t >= 0 ? t : 0;
   }
   if (typeof r == "number") {
     const t = n.findIndex((e) => {
-      const o = u(e, i);
-      return o.type === d.Number || o.type === d.Integer;
+      const o = p(e, i);
+      return o.type === f.Number || o.type === f.Integer;
     });
     return t >= 0 ? t : 0;
   }
   if (typeof r == "string") {
-    const t = n.findIndex((e) => u(e, i).type === d.String);
+    const t = n.findIndex((e) => p(e, i).type === f.String);
     return t >= 0 ? t : 0;
   }
   if (typeof r == "object") {
     const t = r;
     for (let e = 0; e < n.length; e++) {
-      const o = u(n[e], i);
+      const o = p(n[e], i);
       if (o.discriminator && o.discriminator.propertyName in t)
         return e;
     }
     for (let e = 0; e < n.length; e++) {
-      const o = u(n[e], i);
+      const o = p(n[e], i);
       if (O(o) || o.oneOf) return e;
     }
     return 0;
   }
   return 0;
 }
-function V(r, n, i) {
+function B(r, n, i) {
   if (n && typeof r == "object" && r !== null) {
     const t = r[n];
     if (t) return `Item ${i + 1}: ${t}`;
@@ -227,32 +228,58 @@ function V(r, n, i) {
   }
   return `Item ${i + 1}`;
 }
-function k(r) {
+function D(r) {
   switch (Array.isArray(r.type) ? r.type[0] : r.type) {
-    case d.String:
+    case f.String:
       return "";
-    case d.Boolean:
+    case f.Boolean:
       return !1;
-    case d.Array:
+    case f.Array:
       return [];
-    case d.Integer:
-    case d.Number:
+    case f.Integer:
+    case f.Number:
       return;
     default:
       return {};
   }
 }
+const V = [
+  f.String,
+  f.Number,
+  f.Boolean,
+  f.Null,
+  f.Object,
+  f.Array
+];
+function k(r) {
+  return Array.isArray(r) ? f.Array : typeof r == "object" && r !== null ? f.Object : typeof r == "boolean" ? f.Boolean : typeof r == "number" ? f.Number : r === null ? f.Null : f.String;
+}
+const P = {
+  [f.String]: "",
+  [f.Number]: 0,
+  [f.Boolean]: !1,
+  [f.Null]: null,
+  [f.Object]: {},
+  [f.Array]: []
+};
+function _(r) {
+  return P[r];
+}
 export {
-  v as buildSummary,
-  N as detectAnyOfVariant,
-  j as extractDefaults,
-  V as getItemTitle,
+  V as ENTRY_TYPE_OPTIONS,
+  E as buildSummary,
+  R as detectAnyOfVariant,
+  A as extractDefaults,
+  _ as getEntryTypeDefault,
+  B as getItemTitle,
   q as getOptionLabel,
-  k as getSchemaDefault,
-  A as isMissingRequiredValue,
+  D as getSchemaDefault,
+  k as inferEntryType,
+  j as isMissingRequiredValue,
   O as isObjectType,
-  u as resolveRef,
-  P as sortByPropertyOrder,
-  I as toFieldLabel,
-  $ as validateRequired
+  p as resolveRef,
+  T as sortByPropertyOrder,
+  N as toFieldLabel,
+  I as toRequiredMessage,
+  b as validateRequired
 };

package/dist/utils/merge-classes.js

@@ -1,8 +1,15 @@
-import e from "classnames";
-import { twMerge as m } from "../node_modules/tailwind-merge/dist/bundle-mjs.js";
-function t(...r) {
-  return m(e(r));
+import t from "classnames";
+import { extendTailwindMerge as o } from "../node_modules/tailwind-merge/dist/bundle-mjs.js";
+const r = o({
+  extend: {
+    classGroups: {
+      z: [{ z: ["popup", "floating", "interactive-tooltip", "tooltip"] }]
+    }
+  }
+});
+function n(...e) {
+  return r(t(e));
 }
 export {
-  t as mergeClasses
+  n as mergeClasses
 };

package/dist/utils/sub-menu-floating.js

@@ -1,85 +1,130 @@
-import { jsx as u } from "react/jsx-runtime";
-import { useFloatingNodeId as F, useFloating as b, autoUpdate as v, offset as y, flip as S, shift as x, useHover as P, safePolygon as M, useClick as w, useDismiss as C, useRole as I, useInteractions as N, FloatingPortal as O, FloatingFocusManager as k } from "@floating-ui/react";
-import A from "classnames";
-import { useState as R } from "react";
-import { useThemeScope as j } from "../components/New/ThemeScope/ThemeScope.js";
-function U(s, a = "menu", o = !1, c) {
-  const [t, l] = R(!1), n = F(), { refs: r, floatingStyles: i, context: e } = b({
-    nodeId: n,
+import { jsx as m } from "react/jsx-runtime";
+import { useFloatingNodeId as M, useFloating as k, autoUpdate as U, offset as _, flip as H, shift as L, useHover as B, safePolygon as V, useClick as j, useDismiss as q, useRole as z, useInteractions as X, FloatingPortal as Y, FloatingFocusManager as G } from "@floating-ui/react";
+import J from "classnames";
+import { useState as b, useEffect as Q, useCallback as f } from "react";
+import { useThemeScope as W } from "../components/New/ThemeScope/ThemeScope.js";
+const Z = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"], [role="option"]', $ = ["ArrowDown", "ArrowUp", "Home", "End"], A = (t) => Array.from(
+  t.querySelectorAll(Z)
+).filter(
+  (n) => !n.hasAttribute("disabled") && n.getAttribute("aria-disabled") !== "true"
+), P = (t) => t.ownerDocument.defaultView?.getComputedStyle(t).direction === "rtl", v = (t) => P(t) ? "ArrowLeft" : "ArrowRight", ee = (t) => P(t) ? "ArrowRight" : "ArrowLeft", te = (t) => t instanceof HTMLElement && (t.tagName === "INPUT" || t.tagName === "TEXTAREA" || t.isContentEditable), oe = (t, n, o) => {
+  if (t === "Home") return 0;
+  if (t === "End") return o - 1;
+  const s = t === "ArrowDown" ? 1 : -1;
+  return n === -1 ? s === 1 ? 0 : o - 1 : (n + s + o) % o;
+};
+function le(t, n = "menu", o = !1, s) {
+  const [r, i] = b(!1), u = M(), { refs: a, elements: p, floatingStyles: S, context: c } = k({
+    nodeId: u,
     placement: "right-start",
-    open: t,
-    onOpenChange: l,
-    whileElementsMounted: v,
+    open: r,
+    onOpenChange: i,
+    whileElementsMounted: U,
     middleware: [
-      y({ mainAxis: 0, crossAxis: -4 }),
-      S({ padding: s }),
-      x({ padding: s })
+      _({ mainAxis: 0, crossAxis: -4 }),
+      H({ padding: t }),
+      L({ padding: t })
     ]
-  }), m = P(e, {
+  }), O = B(c, {
     enabled: !o,
     move: !1,
     /* Lets the pointer travel into a nested floating element — an
        InteractiveTooltip anchored to this menu's trigger or a child row —
        without closing this menu; requires the `FloatingTree`/`FloatingNode`
        wiring the trigger's own `nodeId` connects to. */
-    handleClose: M(),
+    handleClose: V(),
     delay: { open: 80, close: 80 }
-  }), d = w(e, { enabled: !o }), f = C(e, {
+  }), D = j(c, { enabled: !o }), R = q(c, {
+    ancestorScroll: !0,
     bubbles: { escapeKey: !1, outsidePress: !0 }
-  }), p = I(e, { role: a }), { getReferenceProps: g, getFloatingProps: h } = N([
-    m,
-    d,
-    f,
-    p
-  ]);
-  return {
-    isOpen: t,
-    nodeId: n,
-    refs: r,
-    floatingStyles: i,
-    context: e,
+  }), T = z(c, { role: n }), {
     getReferenceProps: g,
-    getFloatingProps: h
+    getFloatingProps: y
+  } = X([O, D, R, T]), [w, h] = b(!1), d = p.floating;
+  Q(() => {
+    !r || !w || d == null || (A(d)[0]?.focus(), h(!1));
+  }, [r, w, d]);
+  const F = f(
+    (e) => {
+      o || !(e.key === v(e.currentTarget) || e.key === "Enter" || e.key === " ") || (e.preventDefault(), e.stopPropagation(), i(!0), h(!0));
+    },
+    [o]
+  ), E = f(
+    (e) => {
+      if (e.defaultPrevented || te(e.target)) return;
+      if (e.key === ee(e.currentTarget)) {
+        e.preventDefault(), e.stopPropagation(), i(!1), a.domReference.current?.focus();
+        return;
+      }
+      if (!$.includes(e.key)) return;
+      e.preventDefault(), e.stopPropagation();
+      const l = A(e.currentTarget);
+      if (l.length === 0) return;
+      const I = e.currentTarget.ownerDocument.activeElement, K = l.findIndex((C) => C === I);
+      l[oe(e.key, K, l.length)]?.focus();
+    },
+    [a.domReference]
+  ), x = f(
+    (e) => g({
+      ...e,
+      onKeyDown: F
+    }),
+    [g, F]
+  ), N = f(
+    (e) => y({
+      ...e,
+      onKeyDown: E
+    }),
+    [y, E]
+  );
+  return {
+    isOpen: r,
+    nodeId: u,
+    refs: a,
+    floatingStyles: S,
+    context: c,
+    getReferenceProps: x,
+    getFloatingProps: N
   };
 }
-const z = "rounded bg-layer-0 shadow", q = ({
-  refs: s,
-  floatingStyles: a,
+const ne = "rounded bg-layer-0 shadow", ue = ({
+  refs: t,
+  floatingStyles: n,
   context: o,
-  getFloatingProps: c,
-  role: t,
-  surfaceClassName: l,
-  className: n,
-  children: r
+  getFloatingProps: s,
+  role: r,
+  surfaceClassName: i,
+  className: u,
+  children: a
 }) => {
-  const i = j();
-  return /* @__PURE__ */ u(O, { children: /* @__PURE__ */ u(
-    k,
+  const p = W();
+  return /* @__PURE__ */ m(Y, { children: /* @__PURE__ */ m(
+    G,
     {
       context: o,
       modal: !1,
       initialFocus: -1,
       returnFocus: !0,
-      children: /* @__PURE__ */ u(
+      children: /* @__PURE__ */ m(
         "div",
         {
-          ref: s.setFloating,
-          style: a,
-          role: t,
-          className: A(
-            "z-[53] overflow-auto text-primary focus-visible:outline-none",
-            l ?? z,
-            i,
-            n
+          ref: t.setFloating,
+          style: n,
+          role: r,
+          className: J(
+            "z-floating overflow-auto text-primary focus-visible:outline-none",
+            i ?? ne,
+            p,
+            u
           ),
-          ...c(),
-          children: r
+          ...s(),
+          children: a
         }
       )
     }
   ) });
 };
 export {
-  q as SubMenuPanel,
-  U as useSubMenuFloating
+  ue as SubMenuPanel,
+  le as useSubMenuFloating
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epam/ai-dial-ui-kit",
-  "version": "0.15.0-dev.7",
+  "version": "0.15.0",
   "type": "module",
   "license": "Apache-2.0",
   "description": "A modern UI kit for building AI DIAL interfaces with React",
@@ -68,7 +68,6 @@
     "storybook:css": "tailwindcss -w -i ./src/styles/tailwind-entry.scss -o ./src/index.css",
     "build-storybook": "concurrently \"npm run build-storybook:css\" \"storybook build\"",
     "build-storybook:css": "tailwindcss -m -i ./src/styles/tailwind-entry.scss -o ./src/index.css",
-    "prepare": "husky",
     "publish:npm": "npm publish --access public",
     "publish:dry": "npm publish --access public --dry-run",
     "test": "vitest --coverage",
@@ -81,13 +80,10 @@
     ]
   },
   "overrides": {
-    "lodash": "4.18.1",
-    "dompurify": "3.4.12",
-    "shell-quote": "1.10.0",
+    "dompurify": "3.4.16",
     "esbuild": "0.28.1",
-    "undici": "^6.27.0",
-    "brace-expansion": "^5.0.9",
-    "minimatch": "^10.2.5"
+    "shell-quote": "1.11.0",
+    "postcss-selector-parser": "^7.1.6"
   },
   "dependencies": {
     "@floating-ui/react": "^0.27.19",
@@ -157,7 +153,6 @@
     "eslint-plugin-storybook": "^10.4.4",
     "eslint-plugin-tailwindcss": "^3.18.3",
     "globals": "^16.3.0",
-    "husky": "^9.1.7",
     "jsdom": "^26.1.0",
     "lint-staged": "^16.1.2",
     "monaco-editor": "^0.55.1",