@solostylist/ui-kit 1.0.202 → 1.0.204

package/dist/s-tool-bar/s-tool-bar.js

@@ -1,478 +1,4 @@
-import { j as e } from "../jsx-runtime-tc70JA_2.js";
-import u, { useEffect as J, useState as K, useMemo as q, useCallback as b } from "react";
-import { c as P } from "../createSvgIcon-BkbeLOhM.js";
-import { C as Q } from "../Close-lHCUMitI.js";
-import { D as Y } from "../Download-BoRQUwCf.js";
-import { TextField as H, Typography as Z, Box as r, Slider as ee, IconButton as w, Checkbox as te, Divider as le, Tooltip as R, Dialog as se, DialogTitle as ne, DialogContent as oe } from "@mui/material";
-import { createPortal as re } from "react-dom";
-import { SSelect as ae } from "../s-select/s-select.js";
-const ce = P(/* @__PURE__ */ e.jsx("path", {
-  d: "M19 7v2.99s-1.99.01-2 0V7h-3s.01-1.99 0-2h3V2h2v3h3v2zm-3 4V8h-3V5H5c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2v-8zM5 19l3-4 2 3 3-4 4 5z"
-}), "AddPhotoAlternate"), ie = P(/* @__PURE__ */ e.jsx("path", {
-  d: "m19 9 1.25-2.75L23 5l-2.75-1.25L19 1l-1.25 2.75L15 5l2.75 1.25zm-7.5.5L9 4 6.5 9.5 1 12l5.5 2.5L9 20l2.5-5.5L17 12zM19 15l-1.25 2.75L15 19l2.75 1.25L19 23l1.25-2.75L23 19l-2.75-1.25z"
-}), "AutoAwesome"), de = P(/* @__PURE__ */ e.jsx("path", {
-  d: "M12 6v3l4-4-4-4v3c-4.42 0-8 3.58-8 8 0 1.57.46 3.03 1.24 4.26L6.7 14.8c-.45-.83-.7-1.79-.7-2.8 0-3.31 2.69-6 6-6m6.76 1.74L17.3 9.2c.44.84.7 1.79.7 2.8 0 3.31-2.69 6-6 6v-3l-4 4 4 4v-3c4.42 0 8-3.58 8-8 0-1.57-.46-3.03-1.24-4.26"
-}), "Autorenew"), xe = P(/* @__PURE__ */ e.jsx("path", {
-  d: "M11 7h2v2h-2zm0 4h2v6h-2zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8"
-}), "InfoOutlined"), he = u.memo(({ input: t, value: s, onChange: i, onFocus: n, onBlur: h, disabled: c }) => /* @__PURE__ */ e.jsx(
-  H,
-  {
-    value: s,
-    onChange: (m) => i(m.target.value),
-    onFocus: n,
-    onBlur: h,
-    placeholder: t.placeholder ?? t.label,
-    disabled: c,
-    multiline: !0,
-    minRows: t.minRows ?? 2,
-    maxRows: t.maxRows ?? 5,
-    fullWidth: !0,
-    ...t.componentProps?.textarea ?? {}
-  }
-)), S = u.memo((t) => /* @__PURE__ */ e.jsx(
-  Z,
-  {
-    variant: "caption",
-    sx: {
-      whiteSpace: "nowrap",
-      overflow: "hidden",
-      textOverflow: "ellipsis",
-      width: "100% !important",
-      textAlign: "center"
-    },
-    children: t.label
-  }
-)), me = u.memo(({ input: t, value: s, onChange: i, onFocus: n, onBlur: h, disabled: c }) => /* @__PURE__ */ e.jsxs(
-  r,
-  {
-    sx: {
-      width: 120,
-      display: "flex",
-      flexDirection: "column"
-    },
-    children: [
-      /* @__PURE__ */ e.jsx(S, { label: t.label }),
-      /* @__PURE__ */ e.jsx(
-        H,
-        {
-          type: "number",
-          value: s ?? t.defaultValue ?? 0,
-          onChange: (m) => i(Number(m.target.value)),
-          onFocus: n,
-          onBlur: h,
-          disabled: c,
-          slotProps: {
-            htmlInput: {
-              min: t.min,
-              max: t.max,
-              step: t.step
-            }
-          },
-          sx: {
-            "& input": {
-              textAlign: "center"
-            }
-          },
-          ...t.componentProps?.number ?? {}
-        }
-      )
-    ]
-  }
-)), fe = u.memo(({ input: t, value: s, onChange: i, onFocus: n, onBlur: h, disabled: c }) => /* @__PURE__ */ e.jsxs(
-  r,
-  {
-    sx: {
-      width: 180,
-      display: "flex",
-      flexDirection: "column"
-    },
-    children: [
-      /* @__PURE__ */ e.jsx(S, { label: t.label }),
-      /* @__PURE__ */ e.jsx(
-        ae,
-        {
-          value: s ?? t.defaultValue ?? "",
-          onChange: (m) => i(m.target.value),
-          onFocus: n,
-          onBlur: h,
-          disabled: c,
-          placeholder: t.placeholder,
-          options: t.options ?? [],
-          optionLabel: t.optionLabel,
-          optionValue: t.optionValue,
-          searchable: t.searchable,
-          searchPlaceholder: t.searchPlaceholder,
-          ...t.componentProps?.select ?? {}
-        }
-      )
-    ]
-  }
-)), ue = u.memo(({ input: t, value: s, onChange: i, onFocus: n, onBlur: h, disabled: c }) => /* @__PURE__ */ e.jsxs(
-  r,
-  {
-    sx: {
-      width: 160,
-      display: "flex",
-      flexDirection: "column"
-    },
-    children: [
-      /* @__PURE__ */ e.jsx(S, { label: t.label }),
-      /* @__PURE__ */ e.jsxs(r, { sx: { display: "flex", alignItems: "center", height: 36 }, children: [
-        /* @__PURE__ */ e.jsx(
-          ee,
-          {
-            value: s ?? t.defaultValue ?? t.min ?? 0,
-            onChange: (m, j) => i(j),
-            onMouseDown: n,
-            onMouseUp: h,
-            disabled: c,
-            min: t.min ?? 0,
-            max: t.max ?? 100,
-            step: t.step ?? 1,
-            sx: { flex: 1 },
-            ...t.componentProps?.slider ?? {}
-          }
-        ),
-        /* @__PURE__ */ e.jsx(
-          r,
-          {
-            sx: {
-              minWidth: 60,
-              textAlign: "center",
-              fontWeight: 500,
-              fontSize: "0.875rem"
-            },
-            children: s ?? t.defaultValue ?? t.min ?? 0
-          }
-        )
-      ] })
-    ]
-  }
-)), pe = u.memo(({ input: t, value: s, onChange: i, disabled: n }) => {
-  const h = u.useRef(null), [c, m] = u.useState([]), [j, C] = u.useState(null), g = t.multiple ?? !1, y = t.maxImages ?? 5;
-  J(() => {
-    const f = [];
-    return m(((o) => {
-      if (!o) return [];
-      const p = Array.isArray(o) ? o : [o], a = [];
-      return p.forEach((I) => {
-        if (I instanceof File) {
-          const A = URL.createObjectURL(I);
-          a.push(A), f.push(A);
-        } else typeof I == "string" && a.push(I);
-      }), a;
-    })(s)), () => {
-      f.forEach((o) => URL.revokeObjectURL(o));
-    };
-  }, [s]);
-  const k = (f) => {
-    const d = f.target.files;
-    if (!(!d || d.length === 0)) {
-      if (g) {
-        const o = Array.isArray(s) ? s : s instanceof File || typeof s == "string" ? [s] : [], p = Array.from(d).slice(0, y - o.length), a = [...o, ...p];
-        i(a);
-      } else
-        i(d[0]);
-      f.target.value = "";
-    }
-  }, v = (f, d) => {
-    if (f.stopPropagation(), g && Array.isArray(s)) {
-      const o = s.filter((p, a) => a !== d);
-      i(o.length > 0 ? o : null);
-    } else
-      i(null);
-  }, D = () => {
-    n || g && c.length >= y || h.current?.click();
-  }, z = g && c.length < y;
-  return /* @__PURE__ */ e.jsxs(r, { sx: { display: "flex", alignItems: "center", gap: 0.75 }, children: [
-    /* @__PURE__ */ e.jsx(
-      "input",
-      {
-        ref: h,
-        type: "file",
-        accept: "image/*",
-        multiple: g,
-        onChange: k,
-        disabled: n,
-        style: { display: "none" },
-        ...t.componentProps?.image ?? {}
-      }
-    ),
-    c.map((f, d) => /* @__PURE__ */ e.jsxs(
-      r,
-      {
-        onMouseEnter: () => C(d),
-        onMouseLeave: () => C(null),
-        sx: {
-          width: 50,
-          height: 50,
-          border: 1,
-          borderColor: n ? "action.disabled" : "divider",
-          borderRadius: 1,
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "center",
-          cursor: n ? "not-allowed" : "default",
-          position: "relative",
-          overflow: "hidden",
-          transition: "all 0.2s"
-        },
-        children: [
-          /* @__PURE__ */ e.jsx(
-            r,
-            {
-              component: "img",
-              src: f,
-              alt: `Preview ${d + 1}`,
-              sx: {
-                width: "100%",
-                height: "100%",
-                objectFit: "cover"
-              }
-            }
-          ),
-          !n && j === d && /* @__PURE__ */ e.jsx(
-            r,
-            {
-              onClick: (o) => v(o, d),
-              sx: {
-                position: "absolute",
-                top: 0,
-                left: 0,
-                right: 0,
-                bottom: 0,
-                display: "flex",
-                alignItems: "center",
-                justifyContent: "center"
-              },
-              children: /* @__PURE__ */ e.jsx(w, { onClick: (o) => v(o, d), children: /* @__PURE__ */ e.jsx(Q, {}) })
-            }
-          )
-        ]
-      },
-      d
-    )),
-    (c.length === 0 || z) && /* @__PURE__ */ e.jsx(
-      r,
-      {
-        onClick: D,
-        sx: {
-          width: 50,
-          height: 50,
-          border: 1,
-          borderColor: n ? "action.disabled" : "divider",
-          borderRadius: 1,
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "center",
-          cursor: n ? "not-allowed" : "pointer",
-          transition: "all 0.2s",
-          "&:hover": {
-            bgcolor: "action.hover"
-          }
-        },
-        children: /* @__PURE__ */ e.jsx(
-          ce,
-          {
-            sx: {
-              fontSize: 20,
-              color: n ? "action.disabled" : "divider"
-            }
-          }
-        )
-      }
-    )
-  ] });
-}), ge = u.memo(({ input: t, value: s, onChange: i, onFocus: n, onBlur: h, disabled: c }) => /* @__PURE__ */ e.jsxs(
-  r,
-  {
-    sx: {
-      display: "flex",
-      flexDirection: "column",
-      alignItems: "center",
-      minWidth: 60
-    },
-    children: [
-      /* @__PURE__ */ e.jsx(S, { label: t.label }),
-      /* @__PURE__ */ e.jsx(
-        te,
-        {
-          checked: s ?? t.defaultValue ?? !1,
-          onChange: (m) => i(m.target.checked),
-          onFocus: n,
-          onBlur: h,
-          disabled: c,
-          ...t.componentProps?.checkbox ?? {}
-        }
-      )
-    ]
-  }
-)), je = (t) => {
-  switch (t.input.type) {
-    case "textarea":
-      return /* @__PURE__ */ e.jsx(he, { ...t });
-    case "number":
-      return /* @__PURE__ */ e.jsx(me, { ...t });
-    case "slider":
-      return /* @__PURE__ */ e.jsx(ue, { ...t });
-    case "select":
-      return /* @__PURE__ */ e.jsx(fe, { ...t });
-    case "image":
-      return /* @__PURE__ */ e.jsx(pe, { input: t.input, value: t.value, onChange: t.onChange, disabled: t.disabled });
-    case "checkbox":
-      return /* @__PURE__ */ e.jsx(ge, { ...t });
-    default:
-      return null;
-  }
-}, ye = ({
-  inputs: t = [],
-  onProcess: s,
-  onReset: i,
-  onDownload: n,
-  processing: h = !1,
-  uploading: c = !1,
-  inputValues: m = {},
-  onInputChange: j,
-  customActionButtons: C,
-  hideProcessButton: g = !1,
-  processButtonDisabled: y = !1,
-  getInputDisabled: k,
-  processTooltip: v = "Process",
-  downloadTooltip: D = "Download",
-  resetTooltip: z = "Reset",
-  infoTooltip: f = "Information",
-  infoTitle: d = "Tool Information",
-  infoContent: o,
-  position: p = "bottom",
-  relative: a = !1,
-  containerSx: I,
-  sx: A
-}) => {
-  const [X, U] = K(!1), W = q(() => t.length === 0 ? !0 : t.every((l) => {
-    if (!l.required) return !0;
-    const x = m[l.key];
-    return l.type === "textarea" ? typeof x == "string" && x.trim() !== "" : l.type === "number" || l.type === "slider" ? x != null : l.type === "select" ? x != null && x !== "" : !0;
-  }), [t, m]), { imageInputs: F, textareaInputs: _, paramInputs: M } = q(() => t.reduce(
-    (l, x) => (x.type === "image" ? l.imageInputs.push(x) : x.type === "textarea" ? l.textareaInputs.push(x) : l.paramInputs.push(x), l),
-    {
-      imageInputs: [],
-      textareaInputs: [],
-      paramInputs: []
-    }
-  ), [t]), V = b(() => {
-  }, []), B = b(() => {
-  }, []), O = b(
-    (l, x, L) => {
-      j?.(l, x, L);
-    },
-    [j]
-  ), $ = b(() => U(!0), []), G = b(() => U(!1), []), T = b(
-    (l) => {
-      const x = m[l.key], L = k?.(l.key) ?? !1;
-      return l.renderInput ? /* @__PURE__ */ e.jsx(r, { children: l.renderInput({
-        value: x,
-        onChange: (E) => O(l.key, E),
-        onFocus: V,
-        onBlur: B,
-        disabled: L
-      }) }, l.key) : /* @__PURE__ */ e.jsx(
-        je,
-        {
-          input: l,
-          value: x,
-          onChange: (E) => O(l.key, E),
-          onFocus: V,
-          onBlur: B,
-          disabled: L
-        },
-        l.key
-      );
-    },
-    [m, k, O, V, B]
-  ), N = /* @__PURE__ */ e.jsxs(
-    r,
-    {
-      sx: {
-        position: a ? "relative" : "fixed",
-        [p]: a ? "auto" : 20,
-        left: a ? "auto" : "50%",
-        transform: a ? "none" : "translateX(-50%)",
-        zIndex: a ? "auto" : 1300,
-        display: a ? "flex" : "block",
-        justifyContent: a ? "center" : "initial",
-        mt: a && p === "top" ? 2 : 0,
-        mb: a && p === "bottom" ? 2 : 0,
-        ...I
-      },
-      children: [
-        /* @__PURE__ */ e.jsxs(
-          r,
-          {
-            sx: {
-              display: "flex",
-              flexDirection: "column",
-              gap: 2,
-              p: 2,
-              borderRadius: 2,
-              border: 1,
-              borderColor: "divider",
-              bgcolor: "background.default",
-              ...A
-            },
-            children: [
-              _.length > 0 && /* @__PURE__ */ e.jsx(r, { sx: { display: "flex", flexDirection: "column", gap: 2 }, children: _.map(T) }),
-              /* @__PURE__ */ e.jsxs(r, { sx: { display: "flex", alignItems: "center", gap: 0.5 }, children: [
-                /* @__PURE__ */ e.jsx(
-                  r,
-                  {
-                    sx: {
-                      display: "flex",
-                      alignItems: "center",
-                      gap: 2,
-                      flex: 1
-                    },
-                    children: (F.length > 0 || M.length > 0) && /* @__PURE__ */ e.jsxs(r, { sx: { display: "flex", alignItems: "flex-end", gap: 1.5 }, children: [
-                      F.map(T),
-                      M.map(T)
-                    ] })
-                  }
-                ),
-                (F.length > 0 || M.length > 0) && /* @__PURE__ */ e.jsx(le, { orientation: "vertical", flexItem: !0, sx: { mx: 0.5, flexShrink: 0 } }),
-                /* @__PURE__ */ e.jsxs(r, { sx: { display: "flex", alignItems: "center", gap: 0.75, ml: "auto" }, children: [
-                  C,
-                  o && /* @__PURE__ */ e.jsx(R, { title: f, children: /* @__PURE__ */ e.jsx(w, { onClick: $, children: /* @__PURE__ */ e.jsx(xe, {}) }) }),
-                  /* @__PURE__ */ e.jsx(R, { title: D, children: /* @__PURE__ */ e.jsx(w, { onClick: n, children: /* @__PURE__ */ e.jsx(Y, {}) }) }),
-                  /* @__PURE__ */ e.jsx(R, { title: z, children: /* @__PURE__ */ e.jsx(w, { onClick: i, children: /* @__PURE__ */ e.jsx(de, {}) }) }),
-                  !g && /* @__PURE__ */ e.jsx(R, { title: v, children: /* @__PURE__ */ e.jsx("span", { children: /* @__PURE__ */ e.jsx(
-                    w,
-                    {
-                      onClick: s,
-                      disabled: y || !W || c || h,
-                      size: "large",
-                      children: /* @__PURE__ */ e.jsx(
-                        ie,
-                        {
-                          color: y || !W || c || h ? "disabled" : "primary"
-                        }
-                      )
-                    }
-                  ) }) })
-                ] })
-              ] })
-            ]
-          }
-        ),
-        o && /* @__PURE__ */ e.jsxs(se, { open: X, onClose: G, maxWidth: "sm", fullWidth: !0, children: [
-          /* @__PURE__ */ e.jsx(ne, { children: d }),
-          /* @__PURE__ */ e.jsx(oe, { children: o })
-        ] })
-      ]
-    }
-  );
-  return !a && typeof window < "u" ? re(N, document.body) : N;
-};
-ye.displayName = "SToolBar";
-export {
-  ye as SToolBar,
-  ye as default
-};
+import "../createTheme-CMuiGmV-.js";
+import "../jsx-runtime-V-UOMaX1.js";
+import { t as e } from "../s-tool-bar-CM-cxOkI.js";
+export { e as SToolBar, e as default };