@epam/ai-dial-ui-kit 0.16.0-dev.45 → 0.16.0-dev.47

package/dist/components/MarkdownEditor/MarkdownEditor.js

@@ -1,39 +0,0 @@
-import { jsxs as c, jsx as r } from "react/jsx-runtime";
-import p from "@uiw/react-md-editor";
-import { EditorThemes as f } from "../../types/editor.js";
-import { mergeClasses as x } from "../../utils/merge-classes.js";
-const u = ({
-  value: e,
-  onChange: t,
-  height: i = 300,
-  preview: a = "edit",
-  theme: s = f.dark,
-  className: d,
-  placeholder: o,
-  showDragbar: m = !0
-}) => {
-  const l = o !== void 0 && !e;
-  return /* @__PURE__ */ c(
-    "div",
-    {
-      "data-color-mode": s,
-      className: x("relative", d),
-      children: [
-        /* @__PURE__ */ r(
-          p,
-          {
-            value: e,
-            onChange: (n) => t?.(n || ""),
-            height: i,
-            preview: a,
-            visibleDragbar: m
-          }
-        ),
-        l && /* @__PURE__ */ r("div", { className: "pointer-events-none absolute left-0 top-8 px-2 dial-small-text text-secondary opacity-40", children: o })
-      ]
-    }
-  );
-};
-export {
-  u as DialMarkdownEditor
-};

package/dist/components/MarkdownEditor/MarkdownEditorContainer.js

@@ -1,82 +0,0 @@
-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 { 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 B = ({
-  value: s,
-  onChangeValue: l,
-  label: t,
-  headerContent: d,
-  switcherLabel: a,
-  height: c = 300,
-  theme: m = v.dark,
-  onValidateJSON: f,
-  preview: C = "edit",
-  showDragbar: N = !0
-}) => {
-  const w = J(), [n, D] = u(!1), [p, E] = u(null);
-  S(() => {
-    n && typeof window < "u" && import("../JsonEditor/JsonEditor.js").then((o) => {
-      E(() => o.DialJsonEditor);
-    });
-  }, [n]);
-  const h = x(
-    (o) => {
-      l?.(o);
-    },
-    [l]
-  ), g = x(
-    (o) => {
-      f?.(o);
-    },
-    [f]
-  ), 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: [
-    (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,
-        i && /* @__PURE__ */ e("label", { className: "flex items-center gap-2 cursor-pointer", children: /* @__PURE__ */ e(
-          b,
-          {
-            isOn: n,
-            label: a,
-            switchId: w,
-            onChange: (o) => D(o)
-          }
-        ) })
-      ] })
-    ] }),
-    i && n ? /* @__PURE__ */ e(
-      "div",
-      {
-        className: "border border-primary rounded",
-        style: { height: `${c}px` },
-        children: p && /* @__PURE__ */ e(
-          p,
-          {
-            value: s,
-            onChange: h,
-            onValidateJSON: g,
-            currentTheme: m
-          }
-        )
-      }
-    ) : /* @__PURE__ */ e(
-      y,
-      {
-        value: s,
-        onChange: h,
-        height: c,
-        preview: C,
-        showDragbar: N,
-        theme: m
-      }
-    )
-  ] }) }) });
-};
-export {
-  B as DialMarkdownEditorContainer
-};

package/dist/components/MarkdownEditor/lazy.js

@@ -1,4 +0,0 @@
-const o = () => import("./MarkdownEditor.js");
-export {
-  o as LazyDialMarkdownEditor
-};

package/dist/components/Notification/Notification.js

@@ -1,67 +0,0 @@
-import { jsxs as e, jsx as i } from "react/jsx-runtime";
-import { IconX as N } from "@tabler/icons-react";
-import { useMemo as h } from "react";
-import { DialIcon as I } from "../Icon/Icon.js";
-import { DIAL_ICON_SIZE as v } from "../../constants/icon.js";
-import { NotificationVariant as u } from "../../types/notification.js";
-import { mergeClasses as r } from "../../utils/merge-classes.js";
-import { DialGhostIconButton as C } from "../IconButton/IconButtonWrappers.js";
-import { variantIcons as D, notificationVariantClassNameMap as g, alertBaseClassName as z } from "./constants.js";
-const A = ({
-  variant: a = u.Info,
-  title: l,
-  message: o,
-  className: m,
-  iconSize: s = 24,
-  iconStroke: t = 2,
-  closable: c = !1,
-  onClose: n,
-  children: f,
-  textClassName: d = "flex-col",
-  ...p
-}) => {
-  const x = h(() => D({ size: s, stroke: t })[a], [a, s, t]);
-  return /* @__PURE__ */ e(
-    "div",
-    {
-      ...p,
-      role: "alert",
-      className: r(
-        z,
-        g[a],
-        m
-      ),
-      children: [
-        /* @__PURE__ */ e("div", { className: "flex items-start gap-3 flex-1 min-w-0", children: [
-          /* @__PURE__ */ i(I, { icon: x }),
-          l ? /* @__PURE__ */ e(
-            "div",
-            {
-              className: r(
-                "flex flex-col gap-1 text-primary",
-                d
-              ),
-              children: [
-                /* @__PURE__ */ i("div", { className: "dial-small-semi-text", children: l }),
-                /* @__PURE__ */ i("div", { className: "dial-small-text", children: o })
-              ]
-            }
-          ) : /* @__PURE__ */ i("div", { className: "dial-small-text text-primary", children: o })
-        ] }),
-        f,
-        c && /* @__PURE__ */ i("div", { className: "relative size-[40px]", children: /* @__PURE__ */ i(
-          C,
-          {
-            className: "absolute top-0 right-0 size-auto",
-            "aria-label": "Close notification",
-            icon: /* @__PURE__ */ i(N, { size: v.SM }),
-            onClick: n
-          }
-        ) })
-      ]
-    }
-  );
-};
-export {
-  A as DialNotification
-};

package/dist/components/Notification/constants.js

@@ -1,24 +0,0 @@
-import { jsx as r } from "react/jsx-runtime";
-import { Spinner as n } from "../Spinner/Spinner.js";
-import { NotificationVariant as i } from "../../types/notification.js";
-import { IconCheck as o, IconCircleCheckFilled as s, IconAlertTriangleFilled as t, IconAlertCircleFilled as a, IconInfoCircleFilled as c } from "@tabler/icons-react";
-const b = (e) => ({
-  info: /* @__PURE__ */ r(c, { size: e.size }),
-  error: /* @__PURE__ */ r(a, { size: e.size }),
-  warning: /* @__PURE__ */ r(t, { size: e.size }),
-  success: /* @__PURE__ */ r(s, { size: e.size }),
-  loading: /* @__PURE__ */ r(n, { size: e.size }),
-  general: /* @__PURE__ */ r(o, { size: e.size, stroke: e.stroke })
-}), m = {
-  [i.Info]: "bg-info border-info text-info",
-  [i.Success]: "bg-success border-success text-success",
-  [i.Warning]: "bg-warning border-warning text-warning",
-  [i.Error]: "bg-error border-error text-error",
-  [i.Loading]: "bg-info border-info text-info",
-  [i.General]: "bg-sunken border-secondary text-primary"
-}, z = "items-center justify-between relative gap-3 p-3 border border-solid dial-small-text-150 rounded shadow flex";
-export {
-  z as alertBaseClassName,
-  m as notificationVariantClassNameMap,
-  b as variantIcons
-};

package/dist/components/NumberInput/NumberInput.js

@@ -1,41 +0,0 @@
-import { jsx as f } from "react/jsx-runtime";
-import { DialInput as m } from "../Input/Input.js";
-import { handleKeyDown as h } from "../Input/utils.js";
-const y = /^0+\.(\d+)?$/, I = /^0+/, x = ({
-  integer: r,
-  onChange: o,
-  min: s,
-  max: a,
-  onKeyDown: i,
-  onPaste: d,
-  ...g
-}) => {
-  const c = (e) => !e || e === "-" ? e : String(e)?.match(y) ? String(e)?.replace(I, "0") : Number(e);
-  return /* @__PURE__ */ f(
-    m,
-    {
-      type: "number",
-      min: s,
-      max: a,
-      onChange: (e) => o?.(c(e)),
-      onKeyDown: r ? (e) => {
-        if ([".", "-", "+", "e", "E"].includes(e.key)) {
-          e.preventDefault();
-          return;
-        }
-        h(e, "number", s, a);
-      } : i,
-      onPaste: r ? (e) => {
-        const l = e.clipboardData.getData("text"), n = l.replace(/\D/g, "");
-        if (n !== l && (e.preventDefault(), n)) {
-          const t = e.currentTarget, D = t.selectionStart ?? 0, p = t.selectionEnd ?? 0, u = t.value.slice(0, D) + n + t.value.slice(p);
-          o?.(c(u));
-        }
-      } : d,
-      ...g
-    }
-  );
-};
-export {
-  x as DialNumberInput
-};

package/dist/components/Pagination/Pagination.js

@@ -1,80 +0,0 @@
-import { jsxs as f, jsx as i } from "react/jsx-runtime";
-import { IconCaretLeftFilled as u, IconCaretRightFilled as x } from "@tabler/icons-react";
-import { DialIconButton as o } from "../IconButton/IconButton.js";
-import { mergeClasses as n } from "../../utils/merge-classes.js";
-import { DIAL_ICON_SIZE as c } from "../../constants/icon.js";
-import { ElementSize as m } from "../../types/size.js";
-import { getPageRange as y, PageDisplayType as r, getPageDisplayType as b } from "./utils.js";
-const C = ({
-  page: e,
-  totalPages: t,
-  onPageChange: l,
-  className: p
-}) => {
-  const d = y(t);
-  return /* @__PURE__ */ f(
-    "nav",
-    {
-      "aria-label": "Pagination",
-      className: n("flex items-center gap-2", p),
-      children: [
-        /* @__PURE__ */ i(
-          o,
-          {
-            icon: /* @__PURE__ */ i(
-              u,
-              {
-                size: c.SM,
-                className: "text-secondary"
-              }
-            ),
-            size: m.Small,
-            className: "!p-0 items-center flex justify-center",
-            disabled: e <= 1,
-            onClick: () => l(e - 1),
-            "aria-label": "Previous page"
-          }
-        ),
-        /* @__PURE__ */ i("div", { className: "flex flex-row items-center gap-2", children: d.map((a) => {
-          const s = b(a, e, t);
-          return /* @__PURE__ */ i(
-            "button",
-            {
-              type: "button",
-              onClick: () => l(a),
-              "aria-label": `Page ${a}`,
-              "aria-current": a === e ? "page" : void 0,
-              className: n(
-                "dial-pagination-dot rounded-full focus-visible:outline outline-offset-0 transition-all duration-300 ease-in-out",
-                s === r.Active && "h-[8px] w-[32px]",
-                s === r.Adjacent && "size-[8px]",
-                s === r.Far && "size-[4px]"
-              )
-            },
-            a
-          );
-        }) }),
-        /* @__PURE__ */ i(
-          o,
-          {
-            icon: /* @__PURE__ */ i(
-              x,
-              {
-                size: c.SM,
-                className: "text-secondary"
-              }
-            ),
-            size: m.Small,
-            className: "!p-0 items-center flex justify-center",
-            disabled: e >= t,
-            onClick: () => l(e + 1),
-            "aria-label": "Next page"
-          }
-        )
-      ]
-    }
-  );
-};
-export {
-  C as DialPagination
-};

package/dist/components/Pagination/utils.js

@@ -1,10 +0,0 @@
-const a = 7, A = 2, c = (r) => r <= 0 ? [] : Array.from({ length: r }, (t, n) => n + 1);
-var e = /* @__PURE__ */ ((r) => (r.Active = "active", r.Adjacent = "adjacent", r.Far = "far", r))(e || {});
-const f = (r, t, n) => r === t ? "active" : n < 7 || Math.abs(r - t) <= 2 ? "adjacent" : "far";
-export {
-  A as ADJACENT_WINDOW,
-  a as MANY_PAGES_THRESHOLD,
-  e as PageDisplayType,
-  f as getPageDisplayType,
-  c as getPageRange
-};

package/dist/components/PasswordInput/Icons/HideIcon.js

@@ -1,16 +0,0 @@
-import { jsx as o } from "react/jsx-runtime";
-import { IconEyeOff as t } from "@tabler/icons-react";
-import { BASE_ICON_PROPS as e } from "../../../constants/icon.js";
-const f = ({ onClick: r }) => /* @__PURE__ */ o(
-  t,
-  {
-    ...e,
-    className: "text-primary",
-    onClick: r,
-    role: "button",
-    "aria-label": "hide"
-  }
-);
-export {
-  f as DialHideIcon
-};

package/dist/components/PasswordInput/Icons/ShowIcon.js

@@ -1,16 +0,0 @@
-import { jsx as r } from "react/jsx-runtime";
-import { IconEye as t } from "@tabler/icons-react";
-import { BASE_ICON_PROPS as m } from "../../../constants/icon.js";
-const l = ({ onClick: o }) => /* @__PURE__ */ r(
-  t,
-  {
-    ...m,
-    className: "text-primary",
-    onClick: o,
-    role: "button",
-    "aria-label": "show"
-  }
-);
-export {
-  l as DialShowIcon
-};

package/dist/components/PasswordInput/PasswordInput.js

@@ -1,21 +0,0 @@
-import { jsx as o } from "react/jsx-runtime";
-import { useState as i, useCallback as n } from "react";
-import { DialHideIcon as s } from "./Icons/HideIcon.js";
-import { DialShowIcon as m } from "./Icons/ShowIcon.js";
-import { DialInput as u } from "../Input/Input.js";
-const h = ({ ...t }) => {
-  const [e, l] = i(!1), a = n((r) => {
-    l(r);
-  }, []);
-  return /* @__PURE__ */ o(
-    u,
-    {
-      type: e ? "text" : "password",
-      ...t,
-      iconAfter: t.disabled ? null : e ? /* @__PURE__ */ o(s, { onClick: () => a(!1) }) : /* @__PURE__ */ o(m, { onClick: () => a(!0) })
-    }
-  );
-};
-export {
-  h as DialPasswordInput
-};

package/dist/components/Popup/Popup.js

@@ -1,110 +0,0 @@
-import { jsx as e, jsxs as u } from "react/jsx-runtime";
-import { useFloating as M, useRole as S, useDismiss as R, useInteractions as j, FloatingPortal as B, FloatingOverlay as L, FloatingFocusManager as T } from "@floating-ui/react";
-import i from "classnames";
-import { useRef as _ } from "react";
-import { DialCloseButton as A } from "../CloseButton/CloseButton.js";
-import { DialTooltip as E } from "../Tooltip/Tooltip.js";
-import { PopupSize as G } from "../../types/popup.js";
-import { popupHeaderClassName as H, popupDividerClassName as c, popupSizeClassMap as O, overlayBaseClassName as Z } from "./constants.js";
-import { mergeClasses as k } from "../../utils/merge-classes.js";
-import { DIAL_ICON_SIZE as q } from "../../constants/icon.js";
-const oe = ({
-  open: s = !1,
-  header: r,
-  portalId: f,
-  className: g,
-  overlayClassName: h,
-  titleClassName: N,
-  headerClassName: v,
-  dividers: x = !0,
-  dividerFooter: C = !0,
-  children: F,
-  footer: l,
-  onClose: t,
-  size: y = G.Md,
-  hideClose: D = !1,
-  closeOnOutsideClick: I = !0,
-  preventKeyboardOnOpen: n = !1
-}) => {
-  const p = _(null), { refs: m, context: a } = M({
-    open: s,
-    onOpenChange: (o) => {
-      o || t?.(null);
-    }
-  }), b = S(a, { role: "dialog" }), P = R(a, { outsidePress: I }), { getFloatingProps: w } = j([b, P]);
-  if (!s) return null;
-  const d = typeof r == "string" ? "dial-popup-heading" : void 0, z = (o) => o ? typeof o == "string" ? /* @__PURE__ */ e(
-    "h3",
-    {
-      id: d,
-      className: i(
-        "flex-1 min-w-0 mr-3 truncate dial-h3-text text-primary",
-        N
-      ),
-      children: /* @__PURE__ */ e(E, { tooltip: o, children: o })
-    }
-  ) : o : /* @__PURE__ */ e("span", {});
-  return /* @__PURE__ */ e(B, { id: f, children: /* @__PURE__ */ e(
-    L,
-    {
-      className: i(Z, h),
-      children: /* @__PURE__ */ e(
-        T,
-        {
-          context: a,
-          initialFocus: n ? p : m.floating,
-          children: /* @__PURE__ */ u(
-            "div",
-            {
-              ref: m.setFloating,
-              ...w(),
-              role: "dialog",
-              "aria-modal": "true",
-              "aria-labelledby": d,
-              className: i(
-                "dial-popup",
-                O[y],
-                x && c,
-                g
-              ),
-              children: [
-                n && /* @__PURE__ */ e(
-                  "div",
-                  {
-                    ref: p,
-                    tabIndex: -1,
-                    "aria-hidden": !0,
-                    className: "absolute size-px -m-px overflow-hidden opacity-0 pointer-events-none"
-                  }
-                ),
-                /* @__PURE__ */ u(
-                  "div",
-                  {
-                    className: k(H, v),
-                    children: [
-                      z(r),
-                      !D && /* @__PURE__ */ e(
-                        A,
-                        {
-                          size: q.SM,
-                          ariaLabel: "Close dialog",
-                          onClose: (o) => t?.(o)
-                        }
-                      )
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ e("div", { className: "grow overflow-auto", "aria-label": "popup-description", children: F }),
-                C && !l && /* @__PURE__ */ e("div", { className: c }),
-                l
-              ]
-            }
-          )
-        }
-      )
-    }
-  ) });
-};
-export {
-  oe as DialPopup
-};

package/dist/components/Popup/constants.js

@@ -1,12 +0,0 @@
-import { PopupSize as p } from "../../types/popup.js";
-const o = "z-popup flex items-center justify-center bg-blackout md:p-4", s = "divide-tertiary divide-y", i = "flex flex-row justify-between py-4 px-6 items-center", t = {
-  [p.Sm]: "dial-sm-popup",
-  [p.Md]: "dial-md-popup",
-  [p.Lg]: "dial-lg-popup"
-};
-export {
-  o as overlayBaseClassName,
-  s as popupDividerClassName,
-  i as popupHeaderClassName,
-  t as popupSizeClassMap
-};

package/dist/components/RadioButton/RadioButton.js

@@ -1,103 +0,0 @@
-import { jsxs as m, jsx as t } from "react/jsx-runtime";
-import a from "classnames";
-const F = ({
-  name: d,
-  value: i,
-  label: s,
-  description: l,
-  checked: o = !1,
-  inputId: c,
-  className: f,
-  labelClassName: N,
-  disabled: e,
-  onChange: u,
-  descriptionClassName: y,
-  containerClassName: h,
-  caption: r,
-  oneLineCaption: n = !1
-}) => {
-  const x = `${c}-desc`, p = a(
-    "dial-small-text cursor-pointer py-[1px]",
-    e ? "text-secondary" : "text-primary",
-    N,
-    e && "cursor-not-allowed"
-  ), w = a(
-    "cursor-pointer dial-input-radio",
-    !!s && "mr-2",
-    f,
-    e && "!cursor-not-allowed"
-  ), g = a(
-    "flex flex-col",
-    !!l && "mb-2",
-    e && "cursor-not-allowed",
-    h
-  ), C = a(
-    "dial-tiny-text mt-2 ml-[26px] text-secondary",
-    y,
-    e && "cursor-not-allowed"
-  ), v = (j) => {
-    e || j.target.checked && u?.(i);
-  };
-  return /* @__PURE__ */ m("div", { className: g, children: [
-    /* @__PURE__ */ m(
-      "div",
-      {
-        className: a(
-          "flex flex-row",
-          (!r || n) && "items-center"
-        ),
-        children: [
-          /* @__PURE__ */ t(
-            "input",
-            {
-              type: "radio",
-              id: c,
-              name: d,
-              value: i,
-              checked: o,
-              disabled: e,
-              "aria-describedby": o && l ? x : void 0,
-              className: w,
-              onChange: v
-            }
-          ),
-          (s || r) && /* @__PURE__ */ m(
-            "div",
-            {
-              className: a(
-                "flex",
-                n ? "flex-1 flex-row items-center gap-2" : "flex-col gap-1"
-              ),
-              children: [
-                s && /* @__PURE__ */ t(
-                  "label",
-                  {
-                    className: p,
-                    htmlFor: c,
-                    "aria-describedby": r ? "caption" : "",
-                    children: s
-                  }
-                ),
-                r && /* @__PURE__ */ t(
-                  "span",
-                  {
-                    id: "caption",
-                    className: a(
-                      "dial-tiny-text text-secondary",
-                      n && "ml-auto"
-                    ),
-                    children: r
-                  }
-                )
-              ]
-            }
-          )
-        ]
-      }
-    ),
-    o && l && /* @__PURE__ */ t("div", { id: x, className: C, children: l })
-  ] });
-};
-export {
-  F as DialRadioButton
-};