@solostylist/ui-kit 1.0.165 → 1.0.166

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

@@ -0,0 +1,480 @@
+import { j as e } from "../jsx-runtime-OVHDjVDe.js";
+import I, { useEffect as oe, useState as W, useMemo as D, useCallback as k } from "react";
+import { c as L } from "../createSvgIcon-DxwgGAVe.js";
+import { C as se } from "../Close-BRlEKA2Q.js";
+import { D as te } from "../Download-UsLvGg3y.js";
+import { TextField as G, Typography as ne, Box as n, Slider as le, alpha as z, Divider as ae, Tooltip as B, IconButton as P, Dialog as ce, DialogTitle as ie, DialogContent as de } from "@mui/material";
+import { createPortal as xe } from "react-dom";
+const he = L(/* @__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"), me = L(/* @__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"), fe = L(/* @__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"), ue = L(/* @__PURE__ */ e.jsx("path", {
+  d: "M8 5v14l11-7z"
+}), "PlayArrow"), ye = I.memo(({ input: o, value: c, onChange: m, onFocus: t, onBlur: f, disabled: x }) => /* @__PURE__ */ e.jsx(
+  G,
+  {
+    value: c,
+    onChange: (h) => m(h.target.value),
+    onFocus: t,
+    onBlur: f,
+    placeholder: o.placeholder || o.label,
+    disabled: x,
+    multiline: !0,
+    minRows: o.minRows ?? 2,
+    maxRows: o.maxRows ?? 5,
+    fullWidth: !0
+  }
+)), J = I.memo((o) => /* @__PURE__ */ e.jsx(
+  ne,
+  {
+    variant: "caption",
+    sx: {
+      color: "text.secondary",
+      whiteSpace: "nowrap",
+      overflow: "hidden",
+      textOverflow: "ellipsis",
+      width: "100% !important",
+      textAlign: "center"
+    },
+    children: o.label
+  }
+)), je = I.memo(({ input: o, value: c, onChange: m, isExpanded: t, onFocus: f, onBlur: x, disabled: h }) => /* @__PURE__ */ e.jsxs(
+  n,
+  {
+    sx: {
+      width: t ? 120 : 60,
+      transition: "width 0.3s ease",
+      display: "flex",
+      flexDirection: "column"
+    },
+    children: [
+      /* @__PURE__ */ e.jsx(J, { label: o.label }),
+      /* @__PURE__ */ e.jsx(
+        G,
+        {
+          type: "number",
+          value: c ?? o.defaultValue ?? 0,
+          onChange: (g) => m(Number(g.target.value)),
+          onFocus: f,
+          onBlur: x,
+          disabled: h,
+          size: "small",
+          slotProps: {
+            htmlInput: {
+              min: o.min,
+              max: o.max,
+              step: o.step
+            }
+          },
+          sx: {
+            "& input": {
+              textAlign: "center"
+            }
+          }
+        }
+      )
+    ]
+  }
+)), ge = I.memo(({ input: o, value: c, onChange: m, isExpanded: t, onFocus: f, onBlur: x, disabled: h }) => /* @__PURE__ */ e.jsxs(
+  n,
+  {
+    sx: {
+      width: t ? 160 : 60,
+      transition: "width 0.3s ease",
+      display: "flex",
+      flexDirection: "column"
+    },
+    children: [
+      /* @__PURE__ */ e.jsx(J, { label: o.label }),
+      /* @__PURE__ */ e.jsxs(n, { sx: { display: "flex", alignItems: "center", height: 36 }, children: [
+        t && /* @__PURE__ */ e.jsx(
+          le,
+          {
+            value: c ?? o.defaultValue ?? o.min ?? 0,
+            onChange: (g, v) => m(v),
+            onMouseDown: f,
+            onMouseUp: x,
+            disabled: h,
+            min: o.min ?? 0,
+            max: o.max ?? 100,
+            step: o.step ?? 1,
+            size: "small",
+            sx: { flex: 1 }
+          }
+        ),
+        /* @__PURE__ */ e.jsx(
+          n,
+          {
+            sx: {
+              minWidth: 60,
+              textAlign: "center",
+              fontWeight: 500,
+              fontSize: "0.875rem",
+              width: t ? "auto" : "100%"
+            },
+            children: c ?? o.defaultValue ?? o.min ?? 0
+          }
+        )
+      ] })
+    ]
+  }
+)), pe = I.memo(({ input: o, value: c, onChange: m, disabled: t }) => {
+  const f = I.useRef(null), [x, h] = I.useState([]), [g, v] = I.useState(null), w = o.multiple ?? !1, b = o.maxImages ?? 5;
+  oe(() => {
+    let d = [];
+    return h(((l) => {
+      if (!l) return [];
+      const p = Array.isArray(l) ? l : [l], a = [];
+      return p.forEach((C) => {
+        if (C instanceof File) {
+          const S = URL.createObjectURL(C);
+          a.push(S), d.push(S);
+        } else typeof C == "string" && a.push(C);
+      }), a;
+    })(c)), () => {
+      d.forEach((l) => URL.revokeObjectURL(l));
+    };
+  }, [c]);
+  const u = (d) => {
+    const i = d.target.files;
+    if (!(!i || i.length === 0)) {
+      if (w) {
+        const l = Array.isArray(c) ? c : c ? [c] : [], p = Array.from(i).slice(0, b - l.length), a = [...l, ...p];
+        m(a);
+      } else
+        m(i[0]);
+      d.target.value = "";
+    }
+  }, O = (d, i) => {
+    if (d.stopPropagation(), w && Array.isArray(c)) {
+      const l = c.filter((p, a) => a !== i);
+      m(l.length > 0 ? l : null);
+    } else
+      m(null);
+  }, T = () => {
+    var d;
+    t || w && x.length >= b || (d = f.current) == null || d.click();
+  }, E = w && x.length < b;
+  return /* @__PURE__ */ e.jsxs(n, { sx: { display: "flex", alignItems: "center", gap: 0.75 }, children: [
+    /* @__PURE__ */ e.jsx(
+      "input",
+      {
+        ref: f,
+        type: "file",
+        accept: "image/*",
+        multiple: w,
+        onChange: u,
+        disabled: t,
+        style: { display: "none" }
+      }
+    ),
+    x.map((d, i) => /* @__PURE__ */ e.jsxs(
+      n,
+      {
+        onMouseEnter: () => v(i),
+        onMouseLeave: () => v(null),
+        sx: {
+          width: 50,
+          height: 50,
+          border: 1,
+          borderColor: t ? "action.disabled" : "primary.main",
+          borderRadius: 1,
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          cursor: t ? "not-allowed" : "default",
+          position: "relative",
+          overflow: "hidden",
+          transition: "all 0.2s",
+          "&:hover": t ? {} : {
+            borderColor: "primary.dark"
+          }
+        },
+        children: [
+          /* @__PURE__ */ e.jsx(
+            n,
+            {
+              component: "img",
+              src: d,
+              alt: `Preview ${i + 1}`,
+              sx: {
+                width: "100%",
+                height: "100%",
+                objectFit: "cover"
+              }
+            }
+          ),
+          !t && g === i && /* @__PURE__ */ e.jsx(
+            n,
+            {
+              onClick: (l) => O(l, i),
+              sx: {
+                position: "absolute",
+                top: 0,
+                left: 0,
+                right: 0,
+                bottom: 0,
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "center",
+                bgcolor: z("#000", 0.5),
+                cursor: "pointer",
+                transition: "background-color 0.2s",
+                "&:hover": {
+                  bgcolor: z("#000", 0.65)
+                }
+              },
+              children: /* @__PURE__ */ e.jsx(
+                se,
+                {
+                  sx: {
+                    fontSize: 16,
+                    color: "white"
+                  }
+                }
+              )
+            }
+          )
+        ]
+      },
+      i
+    )),
+    (x.length === 0 || E) && /* @__PURE__ */ e.jsx(
+      n,
+      {
+        onClick: T,
+        sx: {
+          width: 50,
+          height: 50,
+          border: 1,
+          borderColor: t ? "action.disabled" : "divider",
+          borderRadius: 1,
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          cursor: t ? "not-allowed" : "pointer",
+          bgcolor: z("#000", 0.02),
+          transition: "all 0.2s",
+          "&:hover": t ? {} : {
+            borderColor: "primary.main",
+            bgcolor: z("#000", 0.04)
+          }
+        },
+        children: /* @__PURE__ */ e.jsx(
+          he,
+          {
+            sx: {
+              fontSize: 20,
+              color: t ? "action.disabled" : "text.secondary"
+            }
+          }
+        )
+      }
+    )
+  ] });
+}), H = (o) => {
+  switch (o.input.type) {
+    case "textarea":
+      return /* @__PURE__ */ e.jsx(ye, { ...o });
+    case "number":
+      return /* @__PURE__ */ e.jsx(je, { ...o });
+    case "slider":
+      return /* @__PURE__ */ e.jsx(ge, { ...o });
+    case "image":
+      return /* @__PURE__ */ e.jsx(pe, { input: o.input, value: o.value, onChange: o.onChange, disabled: o.disabled });
+    default:
+      return null;
+  }
+}, Re = ({
+  inputs: o = [],
+  onProcess: c,
+  onReset: m,
+  onDownload: t,
+  processing: f = !1,
+  uploading: x = !1,
+  inputValues: h = {},
+  onInputChange: g,
+  customActionButtons: v,
+  hideProcessButton: w = !1,
+  processButtonDisabled: b = !1,
+  getInputDisabled: u,
+  processTooltip: O = "Process",
+  downloadTooltip: T = "Download",
+  resetTooltip: E = "Reset",
+  infoTooltip: d = "Information",
+  infoTitle: i = "Tool Information",
+  infoContent: l,
+  position: p = "bottom",
+  relative: a = !1
+}) => {
+  const [C, S] = W(!1), [K, _] = W(!1), [Q, q] = W(!1), A = C || K, N = D(() => o.length === 0 ? !0 : o.every((r) => {
+    if (!r.required) return !0;
+    const s = h[r.key];
+    return r.type === "textarea" ? s && typeof s == "string" && s.trim() !== "" : r.type === "number" || r.type === "slider" ? s != null : !0;
+  }), [o, h]), { imageInputs: U, textareaInputs: X, paramInputs: V } = D(() => o.reduce(
+    (r, s) => (s.type === "image" ? r.imageInputs.push(s) : s.type === "textarea" ? r.textareaInputs.push(s) : r.paramInputs.push(s), r),
+    {
+      imageInputs: [],
+      textareaInputs: [],
+      paramInputs: []
+    }
+  ), [o]), Y = k(() => S(!0), []), Z = k(() => S(!1), []), R = k(() => _(!0), []), F = k(() => {
+    setTimeout(() => _(!1), 200);
+  }, []), M = k(
+    (r, s, j) => {
+      g == null || g(r, s, j);
+    },
+    [g]
+  ), ee = k(() => q(!0), []), re = k(() => q(!1), []), $ = /* @__PURE__ */ e.jsxs(
+    n,
+    {
+      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
+      },
+      children: [
+        /* @__PURE__ */ e.jsxs(
+          n,
+          {
+            onMouseEnter: Y,
+            onMouseLeave: Z,
+            sx: {
+              display: "flex",
+              flexDirection: "column",
+              gap: 2,
+              p: 2,
+              borderRadius: 2,
+              border: 1,
+              borderColor: "divider"
+            },
+            children: [
+              X.length > 0 && /* @__PURE__ */ e.jsx(n, { sx: { display: "flex", flexDirection: "column", gap: 2 }, children: X.map((r) => {
+                const s = h[r.key], j = (u == null ? void 0 : u(r.key)) ?? !1;
+                return r.renderInput ? /* @__PURE__ */ e.jsx(n, { children: r.renderInput({
+                  value: s,
+                  onChange: (y) => M(r.key, y),
+                  isExpanded: A,
+                  onFocus: R,
+                  onBlur: F,
+                  disabled: j
+                }) }, r.key) : /* @__PURE__ */ e.jsx(
+                  H,
+                  {
+                    input: r,
+                    value: s,
+                    onChange: (y) => M(r.key, y),
+                    isExpanded: A,
+                    onFocus: R,
+                    onBlur: F,
+                    disabled: j
+                  },
+                  r.key
+                );
+              }) }),
+              /* @__PURE__ */ e.jsxs(n, { sx: { display: "flex", alignItems: "center", gap: 0.5 }, children: [
+                /* @__PURE__ */ e.jsx(
+                  n,
+                  {
+                    sx: {
+                      display: "flex",
+                      alignItems: "center",
+                      gap: 2,
+                      flex: 1
+                    },
+                    children: (U.length > 0 || V.length > 0) && /* @__PURE__ */ e.jsxs(n, { sx: { display: "flex", alignItems: "flex-end", gap: 1.5 }, children: [
+                      U.map((r) => {
+                        const s = h[r.key], j = (u == null ? void 0 : u(r.key)) ?? !1;
+                        return r.renderInput ? /* @__PURE__ */ e.jsx(n, { children: r.renderInput({
+                          value: s,
+                          onChange: (y) => M(r.key, y),
+                          isExpanded: A,
+                          onFocus: R,
+                          onBlur: F,
+                          disabled: j
+                        }) }, r.key) : /* @__PURE__ */ e.jsx(
+                          H,
+                          {
+                            input: r,
+                            value: s,
+                            onChange: (y) => M(r.key, y),
+                            isExpanded: A,
+                            onFocus: R,
+                            onBlur: F,
+                            disabled: j
+                          },
+                          r.key
+                        );
+                      }),
+                      V.map((r) => {
+                        const s = h[r.key], j = (u == null ? void 0 : u(r.key)) ?? !1;
+                        return r.renderInput ? /* @__PURE__ */ e.jsx(n, { children: r.renderInput({
+                          value: s,
+                          onChange: (y) => M(r.key, y),
+                          isExpanded: A,
+                          onFocus: R,
+                          onBlur: F,
+                          disabled: j
+                        }) }, r.key) : /* @__PURE__ */ e.jsx(
+                          H,
+                          {
+                            input: r,
+                            value: s,
+                            onChange: (y) => M(r.key, y),
+                            isExpanded: A,
+                            onFocus: R,
+                            onBlur: F,
+                            disabled: j
+                          },
+                          r.key
+                        );
+                      })
+                    ] })
+                  }
+                ),
+                (U.length > 0 || V.length > 0) && /* @__PURE__ */ e.jsx(ae, { orientation: "vertical", flexItem: !0, sx: { mx: 0.5, flexShrink: 0 } }),
+                /* @__PURE__ */ e.jsxs(n, { sx: { display: "flex", alignItems: "center", gap: 0.75, ml: "auto" }, children: [
+                  v,
+                  l && /* @__PURE__ */ e.jsx(B, { title: d, children: /* @__PURE__ */ e.jsx(P, { onClick: ee, children: /* @__PURE__ */ e.jsx(fe, {}) }) }),
+                  /* @__PURE__ */ e.jsx(B, { title: T, children: /* @__PURE__ */ e.jsx(P, { onClick: t, children: /* @__PURE__ */ e.jsx(te, {}) }) }),
+                  /* @__PURE__ */ e.jsx(B, { title: E, children: /* @__PURE__ */ e.jsx(P, { onClick: m, children: /* @__PURE__ */ e.jsx(me, {}) }) }),
+                  !w && /* @__PURE__ */ e.jsx(B, { title: O, children: /* @__PURE__ */ e.jsx("span", { children: /* @__PURE__ */ e.jsx(
+                    P,
+                    {
+                      onClick: c,
+                      disabled: b || !N || x || f,
+                      size: "large",
+                      children: /* @__PURE__ */ e.jsx(
+                        ue,
+                        {
+                          color: b || !N || x || f ? "disabled" : "primary"
+                        }
+                      )
+                    }
+                  ) }) })
+                ] })
+              ] })
+            ]
+          }
+        ),
+        l && /* @__PURE__ */ e.jsxs(ce, { open: Q, onClose: re, maxWidth: "sm", fullWidth: !0, children: [
+          /* @__PURE__ */ e.jsx(ie, { children: i }),
+          /* @__PURE__ */ e.jsx(de, { children: l })
+        ] })
+      ]
+    }
+  );
+  return !a && typeof window < "u" ? xe($, document.body) : $;
+};
+export {
+  Re as default
+};

package/dist/s-avatar/package.json

@@ -1,5 +1,5 @@
-{
-  "main": "./index.js",
-  "types": "./index.d.ts",
-  "sideEffects": false
-}
+{
+  "main": "./index.js",
+  "types": "./index.d.ts",
+  "sideEffects": false
+}

package/dist/s-blur-text/package.json

@@ -1,5 +1,5 @@
-{
-  "main": "./index.js",
-  "types": "./index.d.ts",
-  "sideEffects": false
-}
+{
+  "main": "./index.js",
+  "types": "./index.d.ts",
+  "sideEffects": false
+}

package/dist/s-breadcrumbs/package.json

@@ -1,5 +1,5 @@
-{
-  "main": "./index.js",
-  "types": "./index.d.ts",
-  "sideEffects": false
-}
+{
+  "main": "./index.js",
+  "types": "./index.d.ts",
+  "sideEffects": false
+}

package/dist/s-button/package.json

@@ -1,5 +1,5 @@
-{
-  "main": "./index.js",
-  "types": "./index.d.ts",
-  "sideEffects": false
-}
+{
+  "main": "./index.js",
+  "types": "./index.d.ts",
+  "sideEffects": false
+}

package/dist/s-carousel/package.json

@@ -1,5 +1,5 @@
-{
-  "main": "./index.js",
-  "types": "./index.d.ts",
-  "sideEffects": false
+{
+  "main": "./index.js",
+  "types": "./index.d.ts",
+  "sideEffects": false
 }

package/dist/s-category-card/package.json

@@ -1,5 +1,5 @@
-{
-  "main": "./index.js",
-  "types": "./index.d.ts",
-  "sideEffects": false
+{
+  "main": "./index.js",
+  "types": "./index.d.ts",
+  "sideEffects": false
 }

package/dist/s-chat-input/package.json

@@ -1,5 +1,5 @@
-{
-  "main": "./index.js",
-  "types": "./index.d.ts",
-  "sideEffects": false
-}
+{
+  "main": "./index.js",
+  "types": "./index.d.ts",
+  "sideEffects": false
+}