@pagehub/sdk 0.1.4 → 0.1.6

package/dist/chunks/EffectRowInputPopover-CYhfjFwJ.js

@@ -0,0 +1,323 @@
+import { jsxs as H, Fragment as W, jsx as c } from "react/jsx-runtime";
+import { useNode as X } from "@craftjs/core";
+import { lazy as i, useState as V, Suspense as Y } from "react";
+import { e4 as U, eL as Z, eM as G, eN as J, eO as Q, e3 as ee, eH as te, d as ae, S as se, u as oe, i as y, C as ne } from "./index-C66dAl3Q.js";
+import { u as ie } from "./usePopoverAutoOpen-CxIjt0ez.js";
+import { u as re } from "./usePopoverPosition-83Vti7Aw.js";
+import { P as le, p as ce } from "./popoverOpenRequestAtom-hBS_siXv.js";
+function C(e) {
+  return e.replace(/^(?:[a-zA-Z0-9_-]+:)*/, "");
+}
+function w(e, t) {
+  const a = C(e);
+  return a === t || a.startsWith(t + "-");
+}
+function m(e, t) {
+  return e ? e.split(/\s+/).filter(Boolean).some((s) => t.some((o) => w(s, o))) : !1;
+}
+function d(e, t) {
+  return e ? e.split(/\s+/).filter(Boolean).filter((a) => !t.some((s) => w(a, s))).join(" ").trim() : "";
+}
+function f(e, t) {
+  const a = new Set((e || "").split(/\s+/).filter(Boolean));
+  for (const s of t) a.add(s);
+  return Array.from(a).join(" ");
+}
+function u(e, t) {
+  if (!e) return "";
+  const a = [];
+  for (const s of e.split(/\s+/).filter(Boolean)) {
+    const o = C(s);
+    t.some((l) => o === l || o.startsWith(l + "-")) && a.push(o);
+  }
+  return a.length === 0 ? "" : a.length <= 2 ? a.join(", ") : `${a.slice(0, 2).join(", ")} +${a.length - 2}`;
+}
+const b = ["transition", "duration", "ease", "delay"], g = [
+  "scale",
+  "scale-x",
+  "scale-y",
+  "rotate",
+  "translate",
+  "translate-x",
+  "translate-y",
+  "skew",
+  "skew-x",
+  "skew-y",
+  "origin",
+  "transform",
+  "will-change"
+], h = [
+  "blur",
+  "brightness",
+  "contrast",
+  "grayscale",
+  "hue-rotate",
+  "invert",
+  "saturate",
+  "sepia",
+  "filter"
+], E = [
+  "backdrop-blur",
+  "backdrop-brightness",
+  "backdrop-contrast",
+  "backdrop-grayscale",
+  "backdrop-hue-rotate",
+  "backdrop-invert",
+  "backdrop-opacity",
+  "backdrop-saturate",
+  "backdrop-sepia",
+  "backdrop-filter"
+], me = [
+  "animationDuration",
+  "animationDelay",
+  "animationEasing",
+  "animationTrigger",
+  "animationLoop",
+  "animationStagger",
+  "animationExit"
+];
+function de(e, t) {
+  if (!e) return "Animation";
+  const a = te[e];
+  return a != null && a.label ? a.label : t === "framer" ? `Framer: ${e}` : e;
+}
+const fe = {
+  "horizontal-scroll": "Horizontal Scroll",
+  "scroll-timeline": "Scroll Timeline"
+}, ue = i(() => import("./AnimationEditorPanel-CXNmsTqV.js")), pe = i(() => import("./ScrollEffectEditorPanel-CllGUhui.js")), ye = i(() => import("./TransitionEditorPanel-BSvk58Ow.js")), be = i(() => import("./TransformEditorPanel-BGwyznZ6.js")), ge = i(() => import("./FilterEditorPanel-CRa0IpLr.js")), he = i(() => import("./BackdropEditorPanel-CA2k-6SR.js")), Ee = [
+  {
+    id: "animation",
+    label: "Animation",
+    keywords: [
+      "animation",
+      "animate",
+      "motion",
+      "entrance",
+      "fade",
+      "slide",
+      "scale",
+      "spring",
+      "bounce",
+      "framer",
+      "css",
+      "preset"
+    ],
+    Icon: U,
+    hideKey: "animations",
+    help: "Entrance / scroll / hover motion presets.",
+    isActive: ({ props: e }) => {
+      var t;
+      return !!((t = e == null ? void 0 : e.root) != null && t.animation);
+    },
+    summary: ({ props: e }) => {
+      var s, o;
+      const t = ((s = e == null ? void 0 : e.root) == null ? void 0 : s.animation) || "";
+      if (!t) return "";
+      const a = ((o = e == null ? void 0 : e.root) == null ? void 0 : o.animationEngine) || "css";
+      return de(t, a);
+    },
+    applyDefault: (e) => {
+      e((t) => {
+        t.root || (t.root = {}), t.root.animation || (t.root.animation = "cssFadeUp", t.root.animationEngine = t.root.animationEngine || "css");
+      });
+    },
+    clear: (e) => {
+      e((t) => {
+        if (t.root) {
+          t.root.animation = "";
+          for (const a of me) delete t.root[a];
+        }
+      });
+    },
+    EditorPanel: ue
+  },
+  {
+    id: "scroll-effect",
+    label: "Scroll Effect",
+    keywords: ["scroll", "horizontal", "timeline", "pin", "gsap", "section", "parallax"],
+    Icon: Z,
+    gate: ({ craftName: e }) => e === "Container",
+    help: "Pin a section and animate children as the user scrolls (Container only).",
+    isActive: ({ props: e }) => !!(e != null && e.scrollEffect),
+    summary: ({ props: e }) => {
+      const t = (e == null ? void 0 : e.scrollEffect) || "";
+      return t ? fe[t] || t : "";
+    },
+    applyDefault: (e) => {
+      e((t) => {
+        t.type || (t.type = "section");
+      });
+    },
+    clear: (e) => {
+      e((t) => {
+        t.scrollEffect = "", t.scrollDirection = void 0, t.scrollSpeed = void 0, t.scrollSnap = void 0, t.scrollTimelineRunway = void 0, t.scrollSmoothing = void 0;
+      });
+    },
+    EditorPanel: pe
+  },
+  {
+    id: "transition",
+    label: "Transition",
+    keywords: [
+      "transition",
+      "duration",
+      "ease",
+      "easing",
+      "delay",
+      "timing",
+      "curve",
+      "ms",
+      "speed"
+    ],
+    Icon: G,
+    hideKey: "effectsClass",
+    help: "CSS transitions — property, duration, easing, delay.",
+    isActive: ({ className: e }) => m(e, b),
+    summary: ({ className: e }) => u(e, b),
+    applyDefault: (e) => {
+      e((t) => {
+        t.className = f(t.className || "", ["transition", "duration-300"]);
+      });
+    },
+    clear: (e) => {
+      e((t) => {
+        t.className = d(t.className || "", b);
+      });
+    },
+    EditorPanel: ye
+  },
+  {
+    id: "transform",
+    label: "Transform",
+    keywords: [
+      "transform",
+      "scale",
+      "rotate",
+      "translate",
+      "skew",
+      "origin",
+      "gpu",
+      "3d",
+      "hardware"
+    ],
+    Icon: J,
+    hideKey: "effectsClass",
+    help: "Scale, rotate, translate, skew, origin.",
+    isActive: ({ className: e }) => m(e, g),
+    summary: ({ className: e }) => u(e, g),
+    applyDefault: (e) => {
+      e((t) => {
+        t.className = f(t.className || "", ["scale-100"]);
+      });
+    },
+    clear: (e) => {
+      e((t) => {
+        t.className = d(t.className || "", g);
+      });
+    },
+    EditorPanel: be
+  },
+  {
+    id: "filter",
+    label: "Filter",
+    keywords: [
+      "filter",
+      "blur",
+      "brightness",
+      "contrast",
+      "grayscale",
+      "hue",
+      "invert",
+      "saturate",
+      "sepia"
+    ],
+    Icon: Q,
+    hideKey: "effectsClass",
+    help: "Blur, brightness, contrast, saturation, etc.",
+    isActive: ({ className: e }) => m(e, h),
+    summary: ({ className: e }) => u(e, h),
+    applyDefault: (e) => {
+      e((t) => {
+        t.className = f(t.className || "", ["blur-sm"]);
+      });
+    },
+    clear: (e) => {
+      e((t) => {
+        t.className = d(t.className || "", h);
+      });
+    },
+    EditorPanel: ge
+  },
+  {
+    id: "backdrop",
+    label: "Backdrop Filter",
+    keywords: ["backdrop", "frosted", "glass", "blur", "filter"],
+    Icon: ee,
+    hideKey: "effectsClass",
+    help: "Backdrop filter — frosted glass effects on the layer beneath.",
+    isActive: ({ className: e }) => m(e, E),
+    summary: ({ className: e }) => u(e, E),
+    applyDefault: (e) => {
+      e((t) => {
+        t.className = f(t.className || "", ["backdrop-blur-sm"]);
+      });
+    },
+    clear: (e) => {
+      e((t) => {
+        t.className = d(t.className || "", E);
+      });
+    },
+    EditorPanel: he
+  }
+];
+function Pe(e) {
+  return Ee.find((t) => t.id === e);
+}
+const Ae = 360;
+function Fe({ def: e }) {
+  const t = Pe(e.id), [a, s] = V(!1), { triggerRef: o, initialPos: l, setInitialPos: R, computePosition: F } = re(Ae), [p, D] = ae(se), x = oe(le), {
+    actions: { setProp: B },
+    id: r,
+    className: _,
+    componentProps: L,
+    craftName: O
+  } = X((n) => {
+    var v, S, N, T, I;
+    return {
+      id: n.id,
+      className: typeof ((S = (v = n.data) == null ? void 0 : v.props) == null ? void 0 : S.className) == "string" ? n.data.props.className : "",
+      componentProps: ((N = n.data) == null ? void 0 : N.props) || {},
+      craftName: ((T = n.data) == null ? void 0 : T.name) || ((I = n.data) == null ? void 0 : I.displayName) || ""
+    };
+  }), P = { className: _, props: L, craftName: O }, A = t ? t.isActive(P) : !1, K = p.has(y(r, e.id)), z = x.get(ce(r, e.id)) || 0, k = () => {
+    R(F()), s(!0);
+  };
+  if (ie({ nodeId: r, defId: e.id, onOpen: k }), !t || !(A || K || z > 0)) return null;
+  const j = t.Icon, $ = () => {
+    if (a && s(!1), t.clear(B), p.has(y(r, e.id))) {
+      const n = new Set(p);
+      n.delete(y(r, e.id)), D(n);
+    }
+  }, M = t.EditorPanel, q = t.summary(P) || "Add...";
+  return /* @__PURE__ */ H(W, { children: [
+    /* @__PURE__ */ c(
+      ne,
+      {
+        mode: "popover",
+        ref: o,
+        label: t.label,
+        open: a,
+        onTriggerClick: () => a ? s(!1) : k(),
+        onClear: $,
+        triggerAriaLabel: A ? `Edit ${t.label}` : `Add ${t.label}`,
+        clearAriaLabel: `Remove ${t.label}`,
+        leading: /* @__PURE__ */ c(j, { className: "size-3.5", "aria-hidden": !0 }),
+        summary: q
+      }
+    ),
+    a && /* @__PURE__ */ c(Y, { fallback: null, children: /* @__PURE__ */ c(M, { onClose: () => s(!1), initialPosition: l }) })
+  ] });
+}
+export {
+  Fe as default
+};

package/dist/chunks/EffectsClassInput-Yujuchwy.js

@@ -0,0 +1,315 @@
+import { jsxs as p, Fragment as l, jsx as e } from "react/jsx-runtime";
+import { U as y } from "./index-B-GJd039.js";
+const n = [
+  "tailwind",
+  "calc",
+  "px",
+  "%",
+  "em",
+  "rem",
+  "vw",
+  "vh",
+  "vmin",
+  "vmax"
+];
+function r({
+  propKey: a,
+  label: o,
+  tailwindKey: i,
+  propTag: t,
+  index: s = ""
+}) {
+  return /* @__PURE__ */ e(
+    y,
+    {
+      propKey: a,
+      propType: "class",
+      ...t ? { propTag: t } : {},
+      label: o,
+      tailwindKey: i,
+      index: s,
+      showVarSelector: !0,
+      placeholder: "",
+      allowedTypes: n,
+      inline: !0,
+      inputWidth: "flex-1"
+    }
+  );
+}
+const K = ({ index: a = "" }) => /* @__PURE__ */ p(l, { children: [
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "transitionProperty",
+      label: "Property",
+      tailwindKey: "transitionProperty",
+      propTag: "transition",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "duration",
+      label: "Duration",
+      tailwindKey: "duration",
+      propTag: "duration",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(r, { propKey: "ease", label: "Easing", tailwindKey: "ease", propTag: "ease", index: a }),
+  /* @__PURE__ */ e(r, { propKey: "delay", label: "Delay", tailwindKey: "delay", propTag: "delay", index: a })
+] }), d = ({ index: a = "" }) => /* @__PURE__ */ p(l, { children: [
+  /* @__PURE__ */ e(r, { propKey: "twTransform", label: "GPU mode", tailwindKey: "twTransform", index: a }),
+  /* @__PURE__ */ e(r, { propKey: "scale", label: "Scale", tailwindKey: "scale", propTag: "scale", index: a }),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "scaleX",
+      label: "Scale X",
+      tailwindKey: "scaleX",
+      propTag: "scale-x",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "scaleY",
+      label: "Scale Y",
+      tailwindKey: "scaleY",
+      propTag: "scale-y",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "rotate",
+      label: "Rotate",
+      tailwindKey: "rotate",
+      propTag: "rotate",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "translateX",
+      label: "Translate X",
+      tailwindKey: "translateX",
+      propTag: "translate-x",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "translateY",
+      label: "Translate Y",
+      tailwindKey: "translateY",
+      propTag: "translate-y",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "skewX",
+      label: "Skew X",
+      tailwindKey: "skewX",
+      propTag: "skew-x",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "skewY",
+      label: "Skew Y",
+      tailwindKey: "skewY",
+      propTag: "skew-y",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "transformOrigin",
+      label: "Origin",
+      tailwindKey: "transformOrigin",
+      propTag: "origin",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "willChange",
+      label: "Will-change",
+      tailwindKey: "willChange",
+      propTag: "will-change",
+      index: a
+    }
+  )
+] }), g = ({ index: a = "" }) => /* @__PURE__ */ p(l, { children: [
+  /* @__PURE__ */ e(r, { propKey: "blur", label: "Blur", tailwindKey: "blur", propTag: "blur", index: a }),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "brightness",
+      label: "Brightness",
+      tailwindKey: "brightness",
+      propTag: "brightness",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "contrast",
+      label: "Contrast",
+      tailwindKey: "contrast",
+      propTag: "contrast",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "grayscale",
+      label: "Grayscale",
+      tailwindKey: "grayscale",
+      propTag: "grayscale",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "hueRotate",
+      label: "Hue rotate",
+      tailwindKey: "hueRotate",
+      propTag: "hue-rotate",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "invert",
+      label: "Invert",
+      tailwindKey: "invert",
+      propTag: "invert",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "saturate",
+      label: "Saturate",
+      tailwindKey: "saturate",
+      propTag: "saturate",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(r, { propKey: "sepia", label: "Sepia", tailwindKey: "sepia", propTag: "sepia", index: a })
+] }), w = ({ index: a = "" }) => /* @__PURE__ */ p(l, { children: [
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "backdropBlur",
+      label: "Blur",
+      tailwindKey: "backdropBlur",
+      propTag: "backdrop-blur",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "backdropOpacity",
+      label: "Opacity",
+      tailwindKey: "backdropOpacity",
+      propTag: "backdrop-opacity",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "backdropBrightness",
+      label: "Brightness",
+      tailwindKey: "backdropBrightness",
+      propTag: "backdrop-brightness",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "backdropContrast",
+      label: "Contrast",
+      tailwindKey: "backdropContrast",
+      propTag: "backdrop-contrast",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "backdropGrayscale",
+      label: "Grayscale",
+      tailwindKey: "backdropGrayscale",
+      propTag: "backdrop-grayscale",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "backdropHueRotate",
+      label: "Hue rotate",
+      tailwindKey: "backdropHueRotate",
+      propTag: "backdrop-hue-rotate",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "backdropInvert",
+      label: "Invert",
+      tailwindKey: "backdropInvert",
+      propTag: "backdrop-invert",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "backdropSaturate",
+      label: "Saturate",
+      tailwindKey: "backdropSaturate",
+      propTag: "backdrop-saturate",
+      index: a
+    }
+  ),
+  /* @__PURE__ */ e(
+    r,
+    {
+      propKey: "backdropSepia",
+      label: "Sepia",
+      tailwindKey: "backdropSepia",
+      propTag: "backdrop-sepia",
+      index: a
+    }
+  )
+] });
+export {
+  w as B,
+  g as F,
+  K as T,
+  d as a
+};

package/dist/chunks/Embed.render-BgKpUV8n.js

@@ -0,0 +1,17 @@
+import { cY as c, cZ as i, c_ as p, d2 as t } from "./index-C66dAl3Q.js";
+const g = (a) => {
+  var d;
+  const e = { service: "custom", ...a }, o = c(), s = i(), n = p({
+    id: (s == null ? void 0 : s.id) ?? "",
+    isCanvas: (s == null ? void 0 : s.isCanvas) ?? !1,
+    hasChildNodes: (((d = s == null ? void 0 : s.childIds) == null ? void 0 : d.length) ?? 0) > 0,
+    displayName: (s == null ? void 0 : s.displayName) ?? "Embed",
+    rootProps: (o == null ? void 0 : o.rootProps) ?? {},
+    pageMedia: (o == null ? void 0 : o.pageMedia) ?? null,
+    pageIndex: (o == null ? void 0 : o.pageIndex) ?? {}
+  });
+  return t(e, n);
+};
+export {
+  g as EmbedRender
+};