@epam/ai-dial-ui-kit 0.16.0-dev.5 → 0.16.0-dev.51

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
-};

package/dist/components/RadioGroup/RadioGroup.js

@@ -1,92 +0,0 @@
-import { jsx as s, jsxs as g } from "react/jsx-runtime";
-import { DialFormItem as j } from "../FormItem/FormItem.js";
-import { DialRadioButton as v } from "../RadioButton/RadioButton.js";
-import { mergeClasses as a } from "../../utils/merge-classes.js";
-import { selectedContentClassName as $, orientationClassMap as k, optionsWrapperBaseClassName as F } from "./constants.js";
-const y = ({
-  fieldTitle: n,
-  radioClassName: p,
-  containerClassName: o,
-  selectedItemClassName: t,
-  selectedLabelClassName: d,
-  radioGroupClassName: N,
-  inputContainerClassName: h,
-  selectedInputContainerClassName: C,
-  groupLabelClassName: i,
-  formItemChildrenClassName: f,
-  labelClassName: r,
-  disabled: c,
-  elementId: m,
-  radioButtons: x,
-  activeRadioButton: l,
-  orientation: b,
-  labelDescription: u,
-  onChange: D
-}) => /* @__PURE__ */ s(
-  j,
-  {
-    id: m,
-    label: n,
-    labelClassName: i || r,
-    description: u,
-    className: o,
-    childrenClassName: f,
-    children: /* @__PURE__ */ s(
-      "div",
-      {
-        role: "radiogroup",
-        "aria-label": n,
-        "aria-disabled": c || void 0,
-        className: a(
-          F,
-          k[b],
-          N
-        ),
-        children: x.map((e) => /* @__PURE__ */ g(
-          "div",
-          {
-            className: a(
-              "flex flex-col",
-              h,
-              e.id === l && C
-            ),
-            children: [
-              /* @__PURE__ */ s(
-                v,
-                {
-                  name: m,
-                  value: e.id,
-                  inputId: `${m}-${e.id}`,
-                  disabled: c,
-                  className: p,
-                  labelClassName: a(
-                    r,
-                    e.id === l && d
-                  ),
-                  label: e.name,
-                  caption: e.caption,
-                  checked: e.id === l,
-                  onChange: () => D(e.id)
-                }
-              ),
-              e.id === l && e.content ? /* @__PURE__ */ s(
-                "div",
-                {
-                  className: a(
-                    $,
-                    t
-                  ),
-                  children: e.content
-                }
-              ) : null
-            ]
-          },
-          e.id
-        ))
-      }
-    )
-  }
-);
-export {
-  y as DialRadioGroup
-};

package/dist/components/RadioGroup/constants.js

@@ -1,10 +0,0 @@
-import { RadioGroupOrientation as o } from "../../types/radio-group.js";
-const t = "flex", a = "pb-1 mt-2", s = {
-  [o.Column]: "flex-col gap-y-2",
-  [o.Row]: "flex-row gap-x-4"
-};
-export {
-  t as optionsWrapperBaseClassName,
-  s as orientationClassMap,
-  a as selectedContentClassName
-};

package/dist/components/RadioGroupPopupField/RadioGroupPopupField.js

@@ -1,101 +0,0 @@
-import { jsxs as u, jsx as e } from "react/jsx-runtime";
-import B from "classnames";
-import { useState as S, useCallback as l } from "react";
-import { DialNeutralButton as w, DialPrimaryButton as z } from "../Button/ButtonWrappers.js";
-import { DialLabel as A } from "../Label/Label.js";
-import { DialInputPopup as F } from "../InputPopup/InputPopup.js";
-import { DialPopup as L } from "../Popup/Popup.js";
-import { DialRadioGroup as M } from "../RadioGroup/RadioGroup.js";
-import { PopupSize as q } from "../../types/popup.js";
-import { RadioGroupOrientation as E } from "../../types/radio-group.js";
-const _ = ({
-  label: c,
-  htmlFor: f,
-  disabled: a,
-  selectedValue: d,
-  radioButtons: i,
-  customInputValue: x,
-  valueClassName: C,
-  inputClassName: D,
-  emptyValueText: N,
-  placeholder: P,
-  onClose: p,
-  header: h,
-  portalId: y,
-  onApply: t,
-  onCancel: n,
-  cancelButtonTitle: O = "Cancel",
-  applyButtonTitle: b = "Apply",
-  isValid: v,
-  selectedRadioValue: R,
-  onChangeRadioField: g,
-  id: j,
-  size: k = q.Md
-}) => {
-  const [r, m] = S(!1), G = l(() => {
-    a || m(!0);
-  }, [a]), o = l(() => {
-    m(!1), p?.();
-  }, [p]), s = l(() => {
-    n?.(), o();
-  }, [n, o]), I = l(() => {
-    t(), o();
-  }, [t, o]);
-  return /* @__PURE__ */ u("div", { className: "flex flex-col gap-1", children: [
-    /* @__PURE__ */ e(A, { label: c, htmlFor: f }),
-    /* @__PURE__ */ e(
-      F,
-      {
-        disabled: a,
-        open: r,
-        selectedValue: x ?? i.find((V) => V.id === d)?.name,
-        valueClassName: C,
-        inputClassName: B(D, "py-2", "px-3"),
-        emptyValueText: N,
-        placeholder: P,
-        onOpen: G,
-        children: /* @__PURE__ */ e(
-          L,
-          {
-            open: r,
-            onClose: s,
-            header: h,
-            portalId: y,
-            size: k,
-            footer: /* @__PURE__ */ u("div", { className: "flex flex-row items-center justify-end gap-2 px-6 py-4", children: [
-              /* @__PURE__ */ e(
-                w,
-                {
-                  label: O,
-                  onClick: s
-                }
-              ),
-              /* @__PURE__ */ e(
-                z,
-                {
-                  label: b,
-                  onClick: I,
-                  disabled: !v
-                }
-              )
-            ] }),
-            children: /* @__PURE__ */ e("div", { className: "px-6 py-4", children: /* @__PURE__ */ e(
-              M,
-              {
-                radioButtons: i,
-                labelClassName: "dial-small-text",
-                activeRadioButton: R,
-                onChange: g,
-                elementId: j,
-                orientation: E.Column
-              }
-            ) })
-          }
-        )
-      }
-    )
-  ] });
-};
-export {
-  _ as DialRadioGroupPopupField
-};

package/dist/components/ResizableContainer/ConditionalResizableContainer.js

@@ -1,6 +0,0 @@
-import { jsx as t } from "react/jsx-runtime";
-import { DialResizableContainer as e } from "./ResizableContainer.js";
-const l = ({ enabled: i = !0, children: r, ...o }) => i ? /* @__PURE__ */ t(e, { ...o, children: r }) : r;
-export {
-  l as DialConditionalResizableContainer
-};

package/dist/components/ResizableContainer/ResizableContainer.js

@@ -1,79 +0,0 @@
-import { jsx as s } from "react/jsx-runtime";
-import { ResizableContainerSide as R } from "../../types/resizable-container.js";
-import { Resizable as H } from "../../node_modules/re-resizable/lib/index.js";
-import { useState as v, useRef as L, useCallback as b, useMemo as _ } from "react";
-import { ResizeHandle as j } from "./components/ResizeHandle.js";
-const E = ({
-  children: C,
-  minWidth: n,
-  maxWidth: l,
-  width: a,
-  defaultWidth: S,
-  onResizeStop: d,
-  onResize: f,
-  side: o = R.Right,
-  resizeHandlerClassName: c,
-  resizeHandler: h
-}) => {
-  const [u, g] = v(!1), [x, y] = v(S), t = a !== void 0, r = t ? a : x, z = L(null), p = b(() => {
-    g(!0);
-  }, []), m = b(() => {
-    g(!1);
-    const e = z.current?.resizable?.getBoundingClientRect(), i = e ? Math.round(e.width) : n;
-    t || y(i), d?.(i);
-  }, [d, t, n]), I = _(() => {
-    const e = o === R.Left, i = /* @__PURE__ */ s(
-      j,
-      {
-        side: o,
-        isResizing: u,
-        customHandler: h,
-        handlerClassName: c
-      }
-    );
-    return {
-      size: t ? { width: r, height: "100%" } : void 0,
-      defaultSize: t ? void 0 : { width: r, height: "100%" },
-      minWidth: n,
-      maxWidth: l,
-      enable: {
-        left: e,
-        right: !e
-      },
-      handleClasses: {
-        right: "group",
-        left: "group"
-      },
-      handleStyles: {
-        right: { right: "-8px", zIndex: 10 },
-        left: { left: 0, zIndex: 10 }
-      },
-      handleComponent: {
-        left: e ? i : void 0,
-        right: e ? void 0 : i
-      },
-      onResizeStart: p,
-      onResize: (k, B, w) => {
-        const M = Math.round(w.offsetWidth);
-        f?.(M);
-      },
-      onResizeStop: m
-    };
-  }, [
-    o,
-    t,
-    r,
-    n,
-    l,
-    h,
-    c,
-    u,
-    p,
-    m,
-    f
-  ]);
-  return /* @__PURE__ */ s(H, { ref: z, ...I, children: /* @__PURE__ */ s("div", { className: "group flex size-full flex-col bg-layer-3 divide-y divide-tertiary transition-all", children: C }) });
-};
-export {
-  E as DialResizableContainer
-};

package/dist/components/ResizableContainer/components/ResizeHandle.js

@@ -1,20 +0,0 @@
-import { jsx as r } from "react/jsx-runtime";
-import { mergeClasses as a } from "../../../utils/merge-classes.js";
-import "react";
-import { ResizeIcon as n } from "./ResizeIcon.js";
-const u = ({
-  side: s,
-  isResizing: o,
-  customHandler: e,
-  handlerClassName: t
-}) => {
-  const i = a(
-    "invisible h-full w-0.5 group-hover:visible bg-accent-primary text-accent-primary cursor-col-resize transition-opacity",
-    o && "visible",
-    t
-  ), c = /* @__PURE__ */ r(n, { side: s, className: i });
-  return e ? /* @__PURE__ */ r("div", { className: i, children: e }) : c;
-};
-export {
-  u as ResizeHandle
-};

package/dist/components/ResizableContainer/components/ResizeIcon.js

@@ -1,11 +0,0 @@
-import { jsx as e } from "react/jsx-runtime";
-import { ResizableContainerSide as t } from "../../../types/resizable-container.js";
-import { IconChevronLeft as i, IconChevronRight as s } from "@tabler/icons-react";
-import c from "classnames";
-const p = ({ side: r, className: n }) => {
-  const o = r === t.Left;
-  return /* @__PURE__ */ e("div", { className: n, children: /* @__PURE__ */ e(o ? i : s, { className: c("h-full", o && "-ml-6") }) });
-};
-export {
-  p as ResizeIcon
-};