@pagehub/sdk 0.1.0

package/dist/chunks/DesignSystemPalette-BfIADDMo.js

@@ -0,0 +1,425 @@
+import { jsxs as b, jsx as s } from "react/jsx-runtime";
+import { ROOT_NODE as D } from "@craftjs/utils";
+import { useEditor as B } from "@craftjs/core";
+import { useState as C, useEffect as R, useMemo as K, useRef as M } from "react";
+import { createPortal as W } from "react-dom";
+import { j as F, co as E, u as U, t as V, r as O, B as _, p as H, P as q, d as $, bC as G, m as w, cp as J, cq as Q, cr as X, cs as Y, bB as Z, ct as ee, cu as te, cv as ae } from "./index-lNS44FHV.js";
+import { u as ne } from "./index.module-C7TzJyO2.js";
+const se = [
+  "50",
+  "100",
+  "200",
+  "300",
+  "400",
+  "500",
+  "600",
+  "700",
+  "800",
+  "900",
+  "950"
+], oe = [
+  "slate",
+  "gray",
+  "zinc",
+  "neutral",
+  "stone",
+  "red",
+  "orange",
+  "amber",
+  "yellow",
+  "lime",
+  "green",
+  "emerald",
+  "teal",
+  "cyan",
+  "sky",
+  "blue",
+  "indigo",
+  "violet",
+  "purple",
+  "fuchsia",
+  "pink",
+  "rose"
+].map((a) => ({ name: a, shades: se })), re = [
+  { name: "White", value: "white", hex: "#ffffff" },
+  { name: "Black", value: "black", hex: "#000000" },
+  { name: "Transparent", value: "transparent", hex: "transparent" }
+];
+function fe() {
+  const [a, u] = U(V), [c, e] = C(""), [o, l] = C(""), [d, i] = C([]), [f, p] = C([]), { query: m, actions: x } = B(), { open: k, isSupported: j } = ne();
+  R(() => {
+    var t;
+    if (!(!a.enabled || !m))
+      try {
+        const n = m.node(D).get(), v = O(((t = n == null ? void 0 : n.data) == null ? void 0 : t.props) || {}).palette;
+        p(v);
+      } catch (n) {
+        _.error("Failed to load palette:", n);
+      }
+  }, [a.enabled, m]), R(() => {
+    if (a.enabled) {
+      const t = H.get("recent-colors");
+      if (t)
+        try {
+          i(JSON.parse(t));
+        } catch {
+          i([]);
+        }
+    }
+  }, [a.enabled]), R(() => {
+    var t;
+    if (a.enabled && a.value && (l(a.value), a.value.includes("#"))) {
+      const n = ((t = a.value.match(/#[0-9A-Fa-f]{6}/)) == null ? void 0 : t[0]) || "";
+      e(n);
+    }
+  }, [a.enabled, a.value]);
+  const S = () => {
+    u({ ...a, enabled: !1 });
+  }, z = (t) => {
+    const n = [t, ...d.filter((v) => v !== t)].slice(0, 12);
+    i(n), H.set("recent-colors", n);
+  }, N = (t, n) => {
+    a.changed && (a.changed({ type: t, value: n }), l(n), z(n));
+  };
+  return {
+    dialog: a,
+    hexInput: c,
+    setHexInput: e,
+    selectedColor: o,
+    recentColors: d,
+    setRecentColors: i,
+    palette: f,
+    isEyeDropperSupported: j,
+    handleClose: S,
+    handleColorSelect: N,
+    handleColorDoubleClick: (t, n) => {
+      N(t, n), S();
+    },
+    handleHexSubmit: () => {
+      c && /^#[0-9A-Fa-f]{6}$/.test(c) && N("hex", c);
+    },
+    handleEyeDropper: async () => {
+      try {
+        const t = await k();
+        t != null && t.sRGBHex && (e(t.sRGBHex), N("hex", t.sRGBHex));
+      } catch {
+      }
+    },
+    handleSaveToPalette: () => {
+      var T;
+      if (!c || !m || !x) return;
+      const t = prompt("Enter a name for this color:");
+      if (!t) return;
+      const n = m.node(D).get(), v = O(((T = n == null ? void 0 : n.data) == null ? void 0 : T.props) || {}).palette, P = { name: t, color: c };
+      x.setProp(D, (y) => {
+        y.theme || (y.theme = {}), y.theme.palette = [...v, P];
+      }), p([...v, P]);
+    },
+    handleRemoveFromPalette: (t) => {
+      var T;
+      if (!m || !x) return;
+      const n = m.node(D).get(), P = O(((T = n == null ? void 0 : n.data) == null ? void 0 : T.props) || {}).palette.filter((y) => y.name !== t);
+      x.setProp(D, (y) => {
+        y.theme || (y.theme = {}), y.theme.palette = P;
+      }), p(P);
+    }
+  };
+}
+function le(a, u) {
+  const { base: c } = F(`${a}-${u}`), e = c.split("-");
+  if (e.length < 2) {
+    const i = c.toLowerCase(), f = E[i];
+    return f && typeof f == "string" ? f : "#cccccc";
+  }
+  const o = e.pop(), l = e.join("-").toLowerCase(), d = E[l];
+  return d ? typeof d == "string" ? d : typeof d == "object" && d[o] ? d[o] : "#cccccc" : "#cccccc";
+}
+function xe({
+  selectedColor: a,
+  onSelect: u,
+  onDoubleClick: c
+}) {
+  return /* @__PURE__ */ b("div", { children: [
+    /* @__PURE__ */ s("span", { className: "text-base-content mb-1.5 block text-xs font-medium", children: "Special" }),
+    /* @__PURE__ */ s("div", { className: "grid grid-cols-12 gap-1", children: re.map((e) => /* @__PURE__ */ b(
+      "button",
+      {
+        onClick: () => u("class", e.value),
+        onDoubleClick: () => c("class", e.value),
+        className: "group relative aspect-square w-full rounded-lg border-2 transition-all hover:scale-110",
+        style: {
+          backgroundColor: e.hex,
+          borderColor: a === e.value ? "var(--primary)" : "var(--base-300)"
+        },
+        "data-tooltip-id": q,
+        "data-tooltip-content": e.name,
+        "data-tooltip-place": "top",
+        "data-tooltip-offset": 10,
+        children: [
+          e.value === "transparent" && /* @__PURE__ */ s(
+            "div",
+            {
+              className: "absolute inset-0 rounded-lg",
+              style: {
+                background: "linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%, #ccc), linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%, #ccc)",
+                backgroundSize: "8px 8px",
+                backgroundPosition: "0 0, 4px 4px"
+              }
+            }
+          ),
+          a === e.value && /* @__PURE__ */ s($, { className: "text-base-content absolute inset-0 m-auto size-5 drop-shadow-lg" })
+        ]
+      },
+      e.value
+    )) })
+  ] });
+}
+function ge({
+  recentColors: a,
+  selectedColor: u,
+  onClear: c,
+  onSelect: e,
+  onDoubleClick: o
+}) {
+  return /* @__PURE__ */ b("div", { children: [
+    /* @__PURE__ */ b("div", { className: "mb-1.5 flex items-center justify-between", children: [
+      /* @__PURE__ */ s("span", { className: "text-base-content text-xs font-medium", children: "Recent" }),
+      /* @__PURE__ */ s("button", { onClick: c, className: "text-neutral-content hover:text-base-content text-xs", children: /* @__PURE__ */ s(G, { className: "size-3" }) })
+    ] }),
+    /* @__PURE__ */ s("div", { className: "grid grid-cols-12 gap-1", children: a.map((l, d) => /* @__PURE__ */ s(
+      "button",
+      {
+        onClick: () => e("hex", l),
+        onDoubleClick: () => o("hex", l),
+        className: "group relative aspect-square w-full rounded-lg border-2 transition-all hover:scale-110",
+        style: {
+          backgroundColor: l,
+          borderColor: u === l ? "var(--primary)" : "var(--base-300)"
+        },
+        children: u === l && /* @__PURE__ */ s($, { className: "absolute inset-0 m-auto size-4 text-white drop-shadow-lg" })
+      },
+      d
+    )) })
+  ] });
+}
+function ve({
+  selectedColor: a,
+  onSelect: u,
+  onDoubleClick: c
+}) {
+  return /* @__PURE__ */ b("div", { children: [
+    /* @__PURE__ */ s("span", { className: "text-base-content mb-1.5 block text-xs font-medium", children: "Tailwind Colors" }),
+    /* @__PURE__ */ s("div", { className: "space-y-3", children: oe.map((e) => /* @__PURE__ */ b("div", { children: [
+      /* @__PURE__ */ s("div", { className: "text-neutral-content mb-1 text-xs capitalize", children: e.name }),
+      /* @__PURE__ */ s("div", { className: "grid grid-cols-12 gap-1", children: e.shades.map((o) => {
+        const l = `${e.name}-${o}`, d = le(e.name, o), i = a === l;
+        return /* @__PURE__ */ s(
+          "button",
+          {
+            onClick: () => u("class", l),
+            onDoubleClick: () => c("class", l),
+            className: "group relative aspect-square w-full rounded-lg border transition-all hover:scale-110",
+            style: {
+              backgroundColor: d,
+              borderColor: i ? "var(--primary)" : "var(--base-300)",
+              borderWidth: i ? "2px" : "1px"
+            },
+            "data-tooltip-id": q,
+            "data-tooltip-content": `${e.name.charAt(0).toUpperCase() + e.name.slice(1)} ${o}`,
+            "data-tooltip-place": "top",
+            "data-tooltip-offset": 10,
+            children: i && /* @__PURE__ */ s($, { className: "absolute inset-0 m-auto size-4 text-white drop-shadow-lg" })
+          },
+          o
+        );
+      }) })
+    ] }, e.name)) })
+  ] });
+}
+function I(a, u) {
+  var i;
+  let c = a.replace(/^(bg-|text-|border-|from-|to-|via-|ring-)/, "");
+  const { base: e, opacity: o } = F(c);
+  if (e.includes("#")) {
+    const f = ((i = e.match(/#[0-9A-Fa-f]{3,8}/i)) == null ? void 0 : i[0]) || e;
+    return o != null && o < 1 - 1e-6 ? w(f, o) : f;
+  }
+  if (e === "white")
+    return o != null && o < 1 - 1e-6 ? w("#ffffff", o) : "#ffffff";
+  if (e === "black")
+    return o != null && o < 1 - 1e-6 ? w("#000000", o) : "#000000";
+  if (e === "transparent")
+    return o != null && o < 1 - 1e-6 ? w("transparent", o) : "transparent";
+  if (/^[a-z]+$/i.test(e)) {
+    const f = e.toLowerCase(), p = E[f];
+    if (p && typeof p == "object" && Object.prototype.hasOwnProperty.call(p, "500")) {
+      let m = p[500];
+      return o != null && o < 1 - 1e-6 && (m = w(m, o)), m;
+    }
+  }
+  let d = J(`text-${e}`, "text", u).backgroundColor;
+  return o != null && o < 1 - 1e-6 && (d = w(d, o)), d;
+}
+function ye({ selectedColor: a, onSelect: u, anchorEl: c }) {
+  const { query: e, actions: o } = B(), [l, d] = C("light"), [i, f] = C([]), [p, m] = C(""), [x, k] = C(null), j = l === "dark" ? "darkPalette" : "palette", S = () => {
+    var r;
+    try {
+      const h = e.node(D).get(), g = O(((r = h == null ? void 0 : h.data) == null ? void 0 : r.props) || {}), t = l === "dark" ? g.darkPalette : g.palette;
+      f(t || []);
+    } catch (h) {
+      _.error("DesignSystemPalette: failed to load palette", h);
+    }
+  };
+  R(() => {
+    S();
+  }, [e, l]);
+  const z = K(() => {
+    const r = p.trim().toLowerCase();
+    return r ? i.filter((h) => h.name.toLowerCase().includes(r)) : i;
+  }, [i, p]), N = (r) => {
+    const g = (c ?? r.closest('[role="dialog"]') ?? r).getBoundingClientRect(), t = 256, n = 8, v = g.right + n;
+    return { left: v + t > window.innerWidth - 8 ? Math.max(8, g.left - t - n) : v, top: Math.max(8, g.top) };
+  }, A = (r) => {
+    k({ mode: "create", pos: N(r.currentTarget) });
+  }, L = (r, h) => {
+    r.stopPropagation(), k({ mode: "edit", pos: N(r.currentTarget), existing: h });
+  };
+  return /* @__PURE__ */ b("div", { children: [
+    /* @__PURE__ */ b("div", { className: "mb-1.5 flex items-center justify-between gap-2", children: [
+      /* @__PURE__ */ s("span", { className: "text-base-content text-xs font-medium", children: "Design System" }),
+      /* @__PURE__ */ b("div", { className: "border-base-300 bg-base-200 flex items-center rounded-md border p-0.5", children: [
+        /* @__PURE__ */ s(
+          "button",
+          {
+            type: "button",
+            onClick: () => d("light"),
+            "aria-pressed": l === "light",
+            "aria-label": "Light palette",
+            className: `flex size-5 items-center justify-center rounded transition-colors ${l === "light" ? "bg-base-100 text-base-content" : "text-neutral-content hover:text-base-content"}`,
+            children: /* @__PURE__ */ s(Q, { className: "size-3.5", "aria-hidden": !0 })
+          }
+        ),
+        /* @__PURE__ */ s(
+          "button",
+          {
+            type: "button",
+            onClick: () => d("dark"),
+            "aria-pressed": l === "dark",
+            "aria-label": "Dark palette",
+            className: `flex size-5 items-center justify-center rounded transition-colors ${l === "dark" ? "bg-base-100 text-base-content" : "text-neutral-content hover:text-base-content"}`,
+            children: /* @__PURE__ */ s(X, { className: "size-3.5", "aria-hidden": !0 })
+          }
+        )
+      ] })
+    ] }),
+    i.length > 4 && /* @__PURE__ */ b("div", { className: "border-base-300 bg-base-200 mb-1.5 flex items-center gap-1.5 rounded-md border px-2 py-1.5", children: [
+      /* @__PURE__ */ s(Y, { className: "text-neutral-content size-3.5 shrink-0", "aria-hidden": !0 }),
+      /* @__PURE__ */ s(
+        "input",
+        {
+          type: "text",
+          value: p,
+          onChange: (r) => m(r.target.value),
+          placeholder: "Search...",
+          className: "text-base-content placeholder:text-neutral-content min-w-0 flex-1 bg-transparent text-xs outline-none"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ s("div", { className: "flex flex-col", children: z.length === 0 ? /* @__PURE__ */ s("div", { className: "text-neutral-content px-2 py-3 text-center text-xs italic", children: i.length === 0 ? "No tokens yet" : `No matches for "${p}"` }) : z.map((r) => {
+      const h = I(r.color || "", i), g = `palette:${r.name}`, t = a === g || a.includes(r.name);
+      return /* @__PURE__ */ b(
+        "div",
+        {
+          role: "button",
+          tabIndex: 0,
+          onClick: () => u(g),
+          onKeyDown: (n) => {
+            (n.key === "Enter" || n.key === " ") && (n.preventDefault(), u(g));
+          },
+          className: `group flex cursor-pointer items-center gap-2 rounded-md px-2 py-1.5 transition-colors ${t ? "bg-base-200" : "hover:bg-base-200/60"}`,
+          children: [
+            /* @__PURE__ */ s(
+              "span",
+              {
+                className: "border-base-300 size-4 shrink-0 rounded-full border",
+                style: { backgroundColor: h },
+                "aria-hidden": !0
+              }
+            ),
+            /* @__PURE__ */ s(
+              "span",
+              {
+                className: `min-w-0 flex-1 truncate text-xs ${t ? "font-medium" : ""} text-base-content`,
+                children: r.name
+              }
+            ),
+            t && /* @__PURE__ */ s($, { className: "text-base-content size-3.5 shrink-0", "aria-hidden": !0 }),
+            /* @__PURE__ */ b(
+              "button",
+              {
+                type: "button",
+                onClick: (n) => L(n, r),
+                className: "bg-base-300 text-base-content hover:bg-base-content hover:text-base-100 hidden shrink-0 items-center justify-center rounded px-1.5 py-0.5 text-[10px] font-medium transition-colors group-hover:flex",
+                "aria-label": `Edit ${r.name}`,
+                children: [
+                  /* @__PURE__ */ s(Z, { className: "mr-0.5 size-3", "aria-hidden": !0 }),
+                  "Edit"
+                ]
+              }
+            )
+          ]
+        },
+        r.name
+      );
+    }) }),
+    /* @__PURE__ */ b(
+      "button",
+      {
+        type: "button",
+        onClick: A,
+        className: "border-base-300 text-neutral-content hover:border-base-content hover:text-base-content mt-1.5 flex h-8 w-full items-center justify-center gap-1.5 rounded-md border border-dashed text-xs transition-colors",
+        children: [
+          /* @__PURE__ */ s(ee, { className: "size-3.5" }),
+          "New Token"
+        ]
+      }
+    ),
+    x && /* @__PURE__ */ s(ce, { left: x.pos.left, top: x.pos.top, children: /* @__PURE__ */ s(
+      te,
+      {
+        paletteKey: j,
+        ...x.mode === "edit" ? {
+          existing: {
+            originalName: x.existing.name,
+            color: I(x.existing.color || "", i)
+          }
+        } : {},
+        onCreated: (r) => {
+          k(null), S(), u(`palette:${r}`);
+        },
+        onDeleted: () => {
+          k(null), S();
+        },
+        onClose: () => k(null)
+      }
+    ) })
+  ] });
+}
+function ce({
+  left: a,
+  top: u,
+  children: c
+}) {
+  const e = M(null);
+  return ae(e), W(
+    /* @__PURE__ */ s("div", { ref: e, className: "pagehub-sdk-root fixed", style: { left: a, top: u, zIndex: 1200 }, children: c }),
+    document.body
+  );
+}
+export {
+  ye as D,
+  ge as R,
+  xe as S,
+  ve as T,
+  fe as u
+};

package/dist/chunks/EditorEmptyLeafHintView-CLhj72YC.js

@@ -0,0 +1,78 @@
+import { jsx as e, jsxs as t, Fragment as f } from "react/jsx-runtime";
+import { R as g, U as N, V as y, W as w, X as T } from "./index-lNS44FHV.js";
+const n = {
+  zIndex: N,
+  maxWidth: 220,
+  borderRadius: 8,
+  border: "1px solid rgba(0,0,0,0.12)",
+  background: "#fff",
+  color: "#1f2937",
+  padding: "4px 8px",
+  fontSize: 12,
+  fontWeight: 400,
+  lineHeight: 1.4,
+  boxShadow: "0 4px 12px rgba(0,0,0,0.12)",
+  whiteSpace: "nowrap",
+  textTransform: "none",
+  letterSpacing: "normal"
+};
+function j({
+  selected: a,
+  icon: l,
+  selectedIcon: i,
+  idleLabel: p,
+  selectedLabel: d,
+  showActionIcons: m,
+  typeLabel: s,
+  className: h,
+  onClick: r
+}) {
+  const x = a && i ? i : l, b = a ? d : p, u = a ? "border-base-300/70 bg-base-200/45 text-neutral-content/80" : "border-base-300/45 bg-base-200/35 text-neutral-content/55", o = a && m ? /* @__PURE__ */ t("div", { className: "flex flex-col items-center gap-0.5 leading-none", children: [
+    /* @__PURE__ */ t(
+      "div",
+      {
+        className: "flex items-center gap-2",
+        "aria-label": "Drop, double-click, or right-click to insert",
+        children: [
+          /* @__PURE__ */ t("span", { className: "tooltip tooltip-top", children: [
+            /* @__PURE__ */ e("span", { className: "tooltip-content", style: n, children: "Drag from the sidebar" }),
+            /* @__PURE__ */ e(y, { className: "size-3 opacity-70", "aria-hidden": !0 })
+          ] }),
+          /* @__PURE__ */ e("span", { className: "text-neutral-content/30 text-[7px]", children: "·" }),
+          /* @__PURE__ */ t("span", { className: "tooltip tooltip-top", children: [
+            /* @__PURE__ */ e("span", { className: "tooltip-content", style: n, children: "Double-click to add" }),
+            /* @__PURE__ */ e(w, { className: "size-3 opacity-70", "aria-hidden": !0 })
+          ] }),
+          /* @__PURE__ */ e("span", { className: "text-neutral-content/30 text-[7px]", children: "·" }),
+          /* @__PURE__ */ t("span", { className: "tooltip tooltip-top", children: [
+            /* @__PURE__ */ e("span", { className: "tooltip-content", style: n, children: "Right-click to add" }),
+            /* @__PURE__ */ e(T, { className: "size-3 opacity-70", "aria-hidden": !0 })
+          ] })
+        ]
+      }
+    ),
+    s && /* @__PURE__ */ e("span", { className: "truncate text-[8px] tracking-wide opacity-70", children: s })
+  ] }) : /* @__PURE__ */ t(f, { children: [
+    /* @__PURE__ */ e(
+      "span",
+      {
+        className: `flex size-3.5 shrink-0 items-center justify-center ${a ? "opacity-75" : "opacity-60"} [&>svg]:size-3.5`,
+        "aria-hidden": !0,
+        children: x
+      }
+    ),
+    /* @__PURE__ */ e("span", { className: "truncate whitespace-nowrap", children: b })
+  ] }), c = `flex min-h-8 items-center justify-center gap-1.5 border border-dashed px-2 py-1 text-[10px] font-medium uppercase ${u}`;
+  return /* @__PURE__ */ e("div", { className: g("flex w-full flex-1 items-center justify-center", h), children: r ? /* @__PURE__ */ e(
+    "button",
+    {
+      type: "button",
+      onClick: r,
+      className: `${c} cursor-pointer transition-opacity hover:opacity-100`,
+      children: o
+    }
+  ) : /* @__PURE__ */ e("div", { className: c, children: o }) });
+}
+export {
+  j as EditorEmptyLeafHintView
+};

package/dist/chunks/EditorEmptyLeafHintView-aDyijk_Q.js

@@ -0,0 +1,78 @@
+import { jsx as e, jsxs as t, Fragment as f } from "react/jsx-runtime";
+import { t as g, ak as N, al as y, am as w, an as T } from "./overlayZIndex-Ce-Yb9P5.js";
+const n = {
+  zIndex: N,
+  maxWidth: 220,
+  borderRadius: 8,
+  border: "1px solid rgba(0,0,0,0.12)",
+  background: "#fff",
+  color: "#1f2937",
+  padding: "4px 8px",
+  fontSize: 12,
+  fontWeight: 400,
+  lineHeight: 1.4,
+  boxShadow: "0 4px 12px rgba(0,0,0,0.12)",
+  whiteSpace: "nowrap",
+  textTransform: "none",
+  letterSpacing: "normal"
+};
+function j({
+  selected: a,
+  icon: l,
+  selectedIcon: i,
+  idleLabel: p,
+  selectedLabel: d,
+  showActionIcons: m,
+  typeLabel: s,
+  className: h,
+  onClick: r
+}) {
+  const x = a && i ? i : l, b = a ? d : p, u = a ? "border-base-300/70 bg-base-200/45 text-neutral-content/80" : "border-base-300/45 bg-base-200/35 text-neutral-content/55", o = a && m ? /* @__PURE__ */ t("div", { className: "flex flex-col items-center gap-0.5 leading-none", children: [
+    /* @__PURE__ */ t(
+      "div",
+      {
+        className: "flex items-center gap-2",
+        "aria-label": "Drop, double-click, or right-click to insert",
+        children: [
+          /* @__PURE__ */ t("span", { className: "tooltip tooltip-top", children: [
+            /* @__PURE__ */ e("span", { className: "tooltip-content", style: n, children: "Drag from the sidebar" }),
+            /* @__PURE__ */ e(y, { className: "size-3 opacity-70", "aria-hidden": !0 })
+          ] }),
+          /* @__PURE__ */ e("span", { className: "text-neutral-content/30 text-[7px]", children: "·" }),
+          /* @__PURE__ */ t("span", { className: "tooltip tooltip-top", children: [
+            /* @__PURE__ */ e("span", { className: "tooltip-content", style: n, children: "Double-click to add" }),
+            /* @__PURE__ */ e(w, { className: "size-3 opacity-70", "aria-hidden": !0 })
+          ] }),
+          /* @__PURE__ */ e("span", { className: "text-neutral-content/30 text-[7px]", children: "·" }),
+          /* @__PURE__ */ t("span", { className: "tooltip tooltip-top", children: [
+            /* @__PURE__ */ e("span", { className: "tooltip-content", style: n, children: "Right-click to add" }),
+            /* @__PURE__ */ e(T, { className: "size-3 opacity-70", "aria-hidden": !0 })
+          ] })
+        ]
+      }
+    ),
+    s && /* @__PURE__ */ e("span", { className: "truncate text-[8px] tracking-wide opacity-70", children: s })
+  ] }) : /* @__PURE__ */ t(f, { children: [
+    /* @__PURE__ */ e(
+      "span",
+      {
+        className: `flex size-3.5 shrink-0 items-center justify-center ${a ? "opacity-75" : "opacity-60"} [&>svg]:size-3.5`,
+        "aria-hidden": !0,
+        children: x
+      }
+    ),
+    /* @__PURE__ */ e("span", { className: "truncate whitespace-nowrap", children: b })
+  ] }), c = `flex min-h-8 items-center justify-center gap-1.5 border border-dashed px-2 py-1 text-[10px] font-medium uppercase ${u}`;
+  return /* @__PURE__ */ e("div", { className: g("flex w-full flex-1 items-center justify-center", h), children: r ? /* @__PURE__ */ e(
+    "button",
+    {
+      type: "button",
+      onClick: r,
+      className: `${c} cursor-pointer transition-opacity hover:opacity-100`,
+      children: o
+    }
+  ) : /* @__PURE__ */ e("div", { className: c, children: o }) });
+}
+export {
+  j as EditorEmptyLeafHintView
+};

package/dist/chunks/EffectRowInputPopover-CpHA1i8S.js

@@ -0,0 +1,53 @@
+import { jsxs as w, Fragment as L, jsx as n } from "react/jsx-runtime";
+import { useNode as T } from "@craftjs/core";
+import { useState as $, Suspense as D } from "react";
+import { dF as F, cg as K, u as V, dh as z, D as H, di as W, dj as l, dk as _, c1 as B } from "./index-lNS44FHV.js";
+import { u as G } from "./usePopoverAutoOpen-BJbJARN-.js";
+const J = 360;
+function se({ def: o }) {
+  const e = F(o.id), [a, i] = $(!1), { triggerRef: g, initialPos: v, setInitialPos: y, computePosition: b } = K(J), [r, N] = V(z), h = H(W), {
+    actions: { setProp: I },
+    id: t,
+    className: S,
+    componentProps: E,
+    craftName: R
+  } = T((s) => {
+    var m, u, f, P, A;
+    return {
+      id: s.id,
+      className: typeof ((u = (m = s.data) == null ? void 0 : m.props) == null ? void 0 : u.className) == "string" ? s.data.props.className : "",
+      componentProps: ((f = s.data) == null ? void 0 : f.props) || {},
+      craftName: ((P = s.data) == null ? void 0 : P.name) || ((A = s.data) == null ? void 0 : A.displayName) || ""
+    };
+  }), c = { className: S, props: E, craftName: R }, p = e ? e.isActive(c) : !1, C = r.has(l(t, o.id)), q = h.get(_(t, o.id)) || 0, d = () => {
+    y(b()), i(!0);
+  };
+  if (G({ nodeId: t, defId: o.id, onOpen: d }), !e || !(p || C || q > 0)) return null;
+  const x = e.Icon, O = () => {
+    if (a && i(!1), e.clear(I), r.has(l(t, o.id))) {
+      const s = new Set(r);
+      s.delete(l(t, o.id)), N(s);
+    }
+  }, j = e.EditorPanel, k = e.summary(c) || "Add...";
+  return /* @__PURE__ */ w(L, { children: [
+    /* @__PURE__ */ n(
+      B,
+      {
+        mode: "popover",
+        ref: g,
+        label: e.label,
+        open: a,
+        onTriggerClick: () => a ? i(!1) : d(),
+        onClear: O,
+        triggerAriaLabel: p ? `Edit ${e.label}` : `Add ${e.label}`,
+        clearAriaLabel: `Remove ${e.label}`,
+        leading: /* @__PURE__ */ n(x, { className: "size-3.5", "aria-hidden": !0 }),
+        summary: k
+      }
+    ),
+    a && /* @__PURE__ */ n(D, { fallback: null, children: /* @__PURE__ */ n(j, { onClose: () => i(!1), initialPosition: v }) })
+  ] });
+}
+export {
+  se as default
+};