@janbox/storefront-builder 2.0.2 → 2.0.3

package/dist/color-picker-popover-XeaVfYS8.js

@@ -1,225 +0,0 @@
-import { isString as b } from "lodash-es";
-import { useCallback as v, useMemo as P, useSyncExternalStore as z, Fragment as M } from "react";
-import { t as g, q as F, s as R, r as V, l as j, W as T, e as U, z as q } from "./dialog-header-Bh3Dkw2q.js";
-import { useEditor as B } from "@craftjs/core";
-import { jsxs as c, jsx as r } from "@emotion/react/jsx-runtime";
-import { parseColor as k, paletteVars as D, groupedColors as G } from "@janbox/storefront-ui/theme";
-import { flatten as O } from "flat";
-import "@janbox/storefront-ui/hooks";
-import "@janbox/storefront-ui/utils";
-import "@emotion/react";
-import "@floating-ui/react";
-import "react-use";
-import "overlayscrollbars-react";
-import "@tanstack/react-virtual";
-import "react-dropzone";
-import "react-datepicker/dist/react-datepicker.css";
-import "react-datepicker";
-const N = (e) => e.info ?? {}, I = (e) => e.data?.custom ?? {}, de = (e) => {
-  const t = I(e);
-  if (b(t.displayName))
-    return t.displayName;
-  const o = N(e);
-  return b(o.displayName) ? o.displayName : o.displayName?.(e.data.props) ?? e.data.displayName;
-}, le = (e) => e.data.displayName, ce = (e) => e.related ?? {}, he = (e) => I(e).selectable ?? N(e).selectable ?? !0, pe = (e, t) => {
-  try {
-    e.craft && (e.craft = {
-      ...e.craft,
-      related: {
-        ...e.craft?.related,
-        ...t
-      }
-    });
-  } catch (o) {
-    console.error(`Error setting related for ${e.craft?.displayName}`, o);
-  }
-}, ue = (e, t = "xs") => t === "xs" ? e : { [t]: e }, me = (e, t) => {
-  const { resolved: o, ...n } = t;
-  return e.craft = {
-    displayName: o,
-    ...n,
-    related: n.related ?? {}
-  }, e;
-}, fe = (e = () => ({})) => {
-  const t = B(e), { query: o, actions: n } = t, h = v(
-    (s, a, d) => {
-      const l = o.node(s).get(), i = a ?? l.data.parent, m = i ? o.node(i).get() : null;
-      if (!m)
-        throw new Error("Parent node not found");
-      const p = {
-        data: {
-          ...l.data,
-          nodes: [],
-          linkedNodes: {}
-        }
-      }, w = o.parseFreshNode(p).toNode();
-      return n.add(w, m.id, d ?? m.data.nodes.length), l.data.nodes.forEach((E, W) => {
-        h(E, w.id, W);
-      }), o.node(w.id).get();
-    },
-    [n, o]
-  ), u = v(
-    (s) => {
-      const a = s.parentId ?? o.node(s.nodeId).get().data.parent;
-      if (!a)
-        throw new Error("Parent node not found");
-      let d;
-      if ("sourceIndex" in s) {
-        const { sourceIndex: l, destinationIndex: i } = s;
-        d = i > l ? i + 1 : i;
-      } else
-        d = s.moveIndex;
-      n.move(s.nodeId, a, d);
-    },
-    [n, o]
-  );
-  return P(() => ({
-    ...t,
-    actions: {
-      ...t.actions,
-      move: u,
-      duplicate: h
-    }
-  }), [h, t, u]);
-}, $ = () => {
-  let e;
-  const t = /* @__PURE__ */ new Set();
-  return { getSnapshot: () => {
-    if (!e)
-      throw new Error("useEditor must be initialized with initialState before use.");
-    return e;
-  }, subscribe: (s) => (t.add(s), () => t.delete(s)), initialize: (s) => {
-    e = s, t.forEach((a) => a());
-  }, setState: (s) => {
-    if (!e)
-      throw new Error("useEditor must be initialized before setState.");
-    e = { ...e, ...s }, t.forEach((a) => a());
-  } };
-}, f = $();
-let C = !1;
-const S = (e) => (e && !C && (C = !0, f.initialize(e)), {
-  ...z(f.subscribe, f.getSnapshot),
-  setState: f.setState
-}), x = ({ color: e, size: t = 24 }) => {
-  const o = S(), n = k(e, o.theme.palette);
-  return /* @__PURE__ */ c(
-    "div",
-    {
-      title: e,
-      css: { borderRadius: 9999, overflow: "hidden", borderWidth: 1, borderStyle: "solid", borderColor: g.palette.white["3s"] },
-      style: { backgroundColor: n?.toString(), width: t, height: t },
-      children: [
-        !n && /* @__PURE__ */ c("svg", { css: { width: "100%", height: "100%", color: g.palette.white["5s"] }, viewBox: "0 0 32 32", xmlns: "http://www.w3.org/2000/svg", children: [
-          /* @__PURE__ */ r("defs", { children: /* @__PURE__ */ r("pattern", { id: "diagonal-stripes", patternUnits: "userSpaceOnUse", width: "8", height: "8", children: /* @__PURE__ */ r("path", { d: "M-2,2 l4,-4 M0,8 l8,-8 M6,10 l4,-4", stroke: "currentColor", strokeWidth: "1.5" }) }) }),
-          /* @__PURE__ */ r("rect", { width: "32", height: "32", fill: "url(#diagonal-stripes)" })
-        ] }),
-        n?.alpha() === 0 && /* @__PURE__ */ c("svg", { css: { width: "100%", height: "100%" }, xmlns: "http://www.w3.org/2000/svg", children: [
-          /* @__PURE__ */ r("defs", { children: /* @__PURE__ */ c("pattern", { id: "checkerboard", patternUnits: "userSpaceOnUse", width: "8", height: "8", children: [
-            /* @__PURE__ */ r("rect", { width: "8", height: "8", fill: "white" }),
-            /* @__PURE__ */ r("rect", { width: "4", height: "4", fill: "lightgray" }),
-            /* @__PURE__ */ r("rect", { x: "4", y: "4", width: "4", height: "4", fill: "lightgray" })
-          ] }) }),
-          /* @__PURE__ */ r("rect", { width: "100%", height: "100%", fill: "url(#checkerboard)" })
-        ] })
-      ]
-    }
-  );
-}, A = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M11.999 8C11.861 8 11.749 8.112 11.75 8.25C11.75 8.388 11.862 8.5 12 8.5C12.138 8.5 12.25 8.388 12.25 8.25C12.25 8.112 12.138 8 11.999 8" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M12 21V21C7.029 21 3 16.971 3 12V12C3 7.029 7.029 3 12 3V3C16.971 3 21 7.029 21 12V12C21 16.971 16.971 21 12 21Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M12 12V17" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>
-`, y = O(D), ge = ({
-  color: e,
-  onChange: t,
-  children: o,
-  placement: n = "right-start",
-  ...h
-}) => {
-  const u = (i) => {
-    t?.(y[i.currentTarget.value]);
-  }, s = S(), a = k(e, s.theme.palette)?.hex(), d = (i) => {
-    i.target.select();
-  }, l = (i) => {
-    t?.(i.target.value);
-  };
-  return /* @__PURE__ */ c(F, { placement: n, ...h, children: [
-    /* @__PURE__ */ r(R, { children: o ?? /* @__PURE__ */ r(
-      "button",
-      {
-        css: {
-          padding: 2,
-          borderRadius: 9999,
-          borderWidth: 1,
-          borderStyle: "solid",
-          borderColor: g.palette.white["1s"],
-          ":hover": {
-            borderColor: g.palette.white["3s"]
-          }
-        },
-        children: /* @__PURE__ */ r(x, { color: e })
-      }
-    ) }),
-    /* @__PURE__ */ r(V, { children: /* @__PURE__ */ c("div", { css: { display: "flex", flexDirection: "column", gap: 12 }, children: [
-      /* @__PURE__ */ r("div", { css: { display: "flex", alignItems: "center", gap: 8 }, children: /* @__PURE__ */ r("div", { css: { flex: 1 }, children: /* @__PURE__ */ r(
-        j,
-        {
-          fullWidth: !0,
-          suffix: /* @__PURE__ */ r(
-            T,
-            {
-              css: [
-                e === a && {
-                  display: "none"
-                }
-              ],
-              size: 16,
-              source: A
-            }
-          ),
-          onChange: l,
-          onFocus: d,
-          value: a,
-          size: "32"
-        }
-      ) }) }),
-      /* @__PURE__ */ r(U, { css: { minWidth: 288 }, color: a, onChange: t }),
-      /* @__PURE__ */ r(
-        "div",
-        {
-          style: {
-            gridTemplateColumns: "max-content 1fr"
-          },
-          css: { display: "grid", alignItems: "center", columnGap: 16, rowGap: 8 },
-          children: G.map((i, m) => /* @__PURE__ */ c(M, { children: [
-            /* @__PURE__ */ r(
-              "p",
-              {
-                css: {
-                  ...q.xs
-                },
-                children: i.name
-              }
-            ),
-            /* @__PURE__ */ r("div", { css: { display: "inline-flex", alignItems: "center", gap: 8 }, children: i.colors.map((p) => /* @__PURE__ */ r("div", { css: { display: "inline-flex" }, children: /* @__PURE__ */ r("button", { title: p, onClick: u, type: "button", value: p, children: /* @__PURE__ */ r(x, { color: y[p] }) }) }, p)) })
-          ] }, m))
-        }
-      )
-    ] }) })
-  ] });
-};
-export {
-  ge as C,
-  A as I,
-  de as a,
-  N as b,
-  ce as c,
-  me as d,
-  le as e,
-  S as f,
-  I as g,
-  he as i,
-  pe as r,
-  ue as t,
-  fe as u
-};