@cmssy/react 9.10.0 → 10.0.0

package/dist/client.js

@@ -1,14 +1,11 @@
 "use client";
-import { createContext, useState, useRef, useEffect, useMemo, useContext, useCallback, createElement } from 'react';
-import { fields, resolveInitialTarget, buildBlockContext, postToEditor, PROTOCOL_VERSION, parseEditorMessage, getBlockContentForLanguage, normalizeRelationContent, asBucket, toMinorUnits, formatPrice } from '@cmssy/core';
-export { formatPrice, fractionDigits, fromMinorUnits, toMinorUnits } from '@cmssy/core';
+import { useState, useRef, useEffect, useMemo, createElement } from 'react';
+import { buildBlockContext, postToEditor, PROTOCOL_VERSION, parseEditorMessage } from '@cmssy/core';
+import { resolveInitialTarget, getBlockContentForLanguage, normalizeRelationContent, asBucket } from '@cmssy/core/internal';
 import { BlockErrorBoundary } from '@cmssy/react/block-error-boundary';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 // src/registry.ts
-function defineBlock(def) {
-  return def;
-}
 function buildBlockMap(blocks) {
   const map = /* @__PURE__ */ Object.create(null);
   for (const block of blocks) map[block.type] = block.component;
@@ -865,694 +862,5 @@ function CmssyLazyLayout({ load, ...props }) {
   if (!blocks) return null;
   return /* @__PURE__ */ jsx(CmssyEditableLayout, { ...props, blocks });
 }
-var LocaleContext = createContext(null);
-function CmssyLocaleProvider({
-  value,
-  children
-}) {
-  return /* @__PURE__ */ jsx(LocaleContext.Provider, { value, children });
-}
-function useCmssyLocale() {
-  return useContext(LocaleContext);
-}
-var CmssyAuthContext = createContext(null);
-function CmssyAuthProvider({
-  children,
-  basePath = "/api/cmssy/auth",
-  initialUser
-}) {
-  const seeded = initialUser !== void 0;
-  const [user, setUser] = useState(initialUser ?? null);
-  const [loading, setLoading] = useState(!seeded);
-  const generation = useRef(0);
-  const base = useMemo(() => basePath.replace(/\/+$/, ""), [basePath]);
-  const commitUser = useCallback((next) => {
-    generation.current += 1;
-    setUser(next);
-  }, []);
-  const fetchUser = useCallback(async () => {
-    try {
-      const res = await fetch(`${base}/me`, {
-        credentials: "same-origin",
-        cache: "no-store"
-      });
-      const data = await res.json();
-      return data.user ?? null;
-    } catch {
-      return null;
-    }
-  }, [base]);
-  useEffect(() => {
-    if (seeded) return;
-    const gen = generation.current;
-    void (async () => {
-      const next = await fetchUser();
-      if (gen === generation.current) {
-        setUser(next);
-        setLoading(false);
-      }
-    })();
-  }, [fetchUser, seeded]);
-  const postAction = useCallback(
-    async (action, body) => {
-      const res = await fetch(`${base}/${action}`, {
-        method: "POST",
-        credentials: "same-origin",
-        headers: { "content-type": "application/json" },
-        body: JSON.stringify(body)
-      });
-      return await res.json();
-    },
-    [base]
-  );
-  const signIn = useCallback(
-    async (identity, password) => {
-      const data = await postAction("sign-in", { identity, password });
-      if (data.ok && data.user) commitUser(data.user);
-      return { ok: Boolean(data.ok), message: data.message };
-    },
-    [postAction, commitUser]
-  );
-  const register = useCallback(
-    async (identity, password, fields3) => {
-      const data = await postAction("register", {
-        identity,
-        password,
-        fields: fields3 ?? {}
-      });
-      return { ok: Boolean(data.ok), message: data.message };
-    },
-    [postAction]
-  );
-  const signOut = useCallback(async () => {
-    try {
-      await postAction("sign-out", {});
-    } finally {
-      commitUser(null);
-    }
-  }, [postAction, commitUser]);
-  const refresh = useCallback(async () => {
-    const gen = generation.current;
-    const next = await fetchUser();
-    if (gen === generation.current) setUser(next);
-  }, [fetchUser]);
-  const value = useMemo(
-    () => ({ user, loading, signIn, register, signOut, refresh }),
-    [user, loading, signIn, register, signOut, refresh]
-  );
-  return /* @__PURE__ */ jsx(CmssyAuthContext.Provider, { value, children });
-}
-function useCmssyUser() {
-  const ctx = useContext(CmssyAuthContext);
-  if (!ctx) {
-    throw new Error("useCmssyUser must be used within <CmssyAuthProvider>");
-  }
-  return ctx;
-}
-var CmssyCommerceContext = createContext(null);
-function CmssyCommerceProvider({
-  children,
-  basePath = "/api/cmssy/cart"
-}) {
-  const base = useMemo(() => basePath.replace(/\/+$/, ""), [basePath]);
-  const generation = useRef(0);
-  const [cart, setCart] = useState(null);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState(null);
-  const post = useCallback(
-    async (action, body) => {
-      const res = await fetch(`${base}/${action}`, {
-        method: "POST",
-        credentials: "same-origin",
-        headers: { "content-type": "application/json" },
-        body: JSON.stringify(body)
-      });
-      const data = await res.json().catch(() => ({}));
-      if (!res.ok) {
-        throw new Error(
-          typeof data.message === "string" ? data.message : "Commerce request failed"
-        );
-      }
-      return data;
-    },
-    [base]
-  );
-  const runCart = useCallback(
-    async (action, body) => {
-      const gen = ++generation.current;
-      setError(null);
-      try {
-        const data = await post(action, body);
-        if (gen === generation.current) setCart(data.cart);
-      } catch (err) {
-        if (gen === generation.current) {
-          setError(
-            err instanceof Error ? err.message : "Commerce request failed"
-          );
-        }
-        throw err;
-      }
-    },
-    [post]
-  );
-  const refresh = useCallback(async () => {
-    setLoading(true);
-    try {
-      await runCart("cart", {});
-    } catch {
-      return;
-    } finally {
-      setLoading(false);
-    }
-  }, [runCart]);
-  useEffect(() => {
-    void refresh();
-  }, [refresh]);
-  const addToCart = useCallback(
-    (recordId, quantity = 1, options) => runCart("add", {
-      recordId,
-      quantity,
-      variantSelections: options?.variantSelections,
-      notes: options?.notes
-    }),
-    [runCart]
-  );
-  const updateItem = useCallback(
-    (itemId, quantity) => runCart("update", { itemId, quantity }),
-    [runCart]
-  );
-  const removeItem = useCallback(
-    (itemId) => runCart("remove", { itemId }),
-    [runCart]
-  );
-  const clearCart = useCallback(() => runCart("clear", {}), [runCart]);
-  const applyDiscount = useCallback(
-    (code) => runCart("apply-discount", { code }),
-    [runCart]
-  );
-  const removeDiscount = useCallback(
-    () => runCart("remove-discount", {}),
-    [runCart]
-  );
-  const setShippingMethod = useCallback(
-    (shippingMethodId) => runCart("set-shipping", { shippingMethodId }),
-    [runCart]
-  );
-  const merge = useCallback(() => runCart("merge", {}), [runCart]);
-  const checkout = useCallback(
-    async (input) => {
-      const gen = ++generation.current;
-      setError(null);
-      try {
-        const data = await post("checkout", {
-          ...input
-        });
-        if (gen === generation.current) setCart(null);
-        return data.order;
-      } catch (err) {
-        if (gen === generation.current) {
-          setError(err instanceof Error ? err.message : "Checkout failed");
-        }
-        throw err;
-      }
-    },
-    [post]
-  );
-  const fetchProduct = useCallback(
-    async (modelSlug, filter) => {
-      const data = await post("product", {
-        modelSlug,
-        filter
-      });
-      return data.product;
-    },
-    [post]
-  );
-  const value = useMemo(
-    () => ({
-      cart,
-      loading,
-      error,
-      addToCart,
-      updateItem,
-      removeItem,
-      clearCart,
-      applyDiscount,
-      removeDiscount,
-      setShippingMethod,
-      merge,
-      checkout,
-      refresh,
-      fetchProduct
-    }),
-    [
-      cart,
-      loading,
-      error,
-      addToCart,
-      updateItem,
-      removeItem,
-      clearCart,
-      applyDiscount,
-      removeDiscount,
-      setShippingMethod,
-      merge,
-      checkout,
-      refresh,
-      fetchProduct
-    ]
-  );
-  return /* @__PURE__ */ jsx(CmssyCommerceContext.Provider, { value, children });
-}
-function useCart() {
-  const ctx = useContext(CmssyCommerceContext);
-  if (!ctx) {
-    throw new Error("useCart must be used within <CmssyCommerceProvider>");
-  }
-  return ctx;
-}
-var productProps = {
-  modelSlug: fields.text({ label: "Model slug" }),
-  slugField: fields.text({ label: "Slug field" }),
-  slug: fields.text({ label: "Product slug" }),
-  nameField: fields.text({ label: "Name field" }),
-  priceField: fields.text({ label: "Price field" }),
-  imageField: fields.text({ label: "Image field" })
-};
-function deriveAxes(variants) {
-  const axes = /* @__PURE__ */ new Map();
-  for (const variant of variants) {
-    for (const option of variant.selectedOptions) {
-      if (!axes.has(option.name)) axes.set(option.name, /* @__PURE__ */ new Set());
-      axes.get(option.name).add(option.value);
-    }
-  }
-  return [...axes.entries()].map(([name, values]) => ({
-    name,
-    values: [...values]
-  }));
-}
-function matchVariant(variants, selections) {
-  return variants.find(
-    (variant) => variant.selectedOptions.every(
-      (opt) => selections[opt.name] === opt.value
-    )
-  ) ?? null;
-}
-function ProductComponent({ content: c }) {
-  const { fetchProduct, addToCart } = useCart();
-  const injected = c.product ?? null;
-  const [product, setProduct] = useState(injected);
-  const [loading, setLoading] = useState(!injected && Boolean(c.slug));
-  const [selections, setSelections] = useState({});
-  const [adding, setAdding] = useState(false);
-  const [added, setAdded] = useState(false);
-  const [addError, setAddError] = useState(null);
-  const modelSlug = c.modelSlug ?? "products";
-  const slugField = c.slugField ?? "slug";
-  const slug = c.slug ?? "";
-  useEffect(() => {
-    if (injected || !slug) return;
-    let active = true;
-    setLoading(true);
-    void (async () => {
-      try {
-        const result = await fetchProduct(modelSlug, { [slugField]: slug });
-        if (active) setProduct(result);
-      } finally {
-        if (active) setLoading(false);
-      }
-    })();
-    return () => {
-      active = false;
-    };
-  }, [injected, fetchProduct, modelSlug, slugField, slug]);
-  const axes = useMemo(
-    () => product ? deriveAxes(product.variants) : [],
-    [product]
-  );
-  const variant = useMemo(
-    () => product ? matchVariant(product.variants, selections) : null,
-    [product, selections]
-  );
-  if (loading) {
-    return /* @__PURE__ */ jsx("div", { "data-cmssy-product": "loading", children: "Loading\u2026" });
-  }
-  if (!product) {
-    return /* @__PURE__ */ jsx("div", { "data-cmssy-product": "not-found", children: "Product not found" });
-  }
-  const data = product.data;
-  const name = String(data[c.nameField ?? "name"] ?? "");
-  const imageUrl = c.imageField ? data[c.imageField] : null;
-  const hasVariants = product.variants.length > 0;
-  const currency = data.currency ?? "USD";
-  const priceMinor = hasVariants ? variant?.price : toMinorUnits(Number(data[c.priceField ?? "price"] ?? 0), currency);
-  const showPrice = priceMinor != null && Number.isFinite(priceMinor);
-  const allAxesSelected = axes.every((axis) => selections[axis.name]);
-  const outOfStock = variant != null && variant.inventory != null && variant.inventory <= 0;
-  const canAdd = hasVariants ? Boolean(variant) && !outOfStock : true;
-  async function onAdd() {
-    if (!product) return;
-    setAdding(true);
-    setAdded(false);
-    setAddError(null);
-    try {
-      await addToCart(
-        product.id,
-        1,
-        hasVariants ? { variantSelections: selections } : void 0
-      );
-      setAdded(true);
-    } catch (err) {
-      setAddError(err instanceof Error ? err.message : "Could not add to cart");
-    } finally {
-      setAdding(false);
-    }
-  }
-  return /* @__PURE__ */ jsxs("div", { "data-cmssy-product": product.id, children: [
-    imageUrl ? /* @__PURE__ */ jsx("img", { src: imageUrl, alt: name }) : null,
-    /* @__PURE__ */ jsx("h3", { "data-cmssy-product-name": true, children: name }),
-    showPrice ? /* @__PURE__ */ jsx("p", { "data-cmssy-product-price": true, children: formatPrice(priceMinor, currency) }) : null,
-    axes.map((axis) => /* @__PURE__ */ jsxs("label", { "data-cmssy-variant-axis": axis.name, children: [
-      /* @__PURE__ */ jsx("span", { children: axis.name }),
-      /* @__PURE__ */ jsxs(
-        "select",
-        {
-          value: selections[axis.name] ?? "",
-          onChange: (e) => setSelections((prev) => ({
-            ...prev,
-            [axis.name]: e.target.value
-          })),
-          children: [
-            /* @__PURE__ */ jsx("option", { value: "", children: "\u2014" }),
-            axis.values.map((v) => /* @__PURE__ */ jsx("option", { value: v, children: v }, v))
-          ]
-        }
-      )
-    ] }, axis.name)),
-    /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        onClick: onAdd,
-        disabled: adding || !canAdd || hasVariants && !allAxesSelected,
-        "data-cmssy-add-to-cart": true,
-        children: adding ? "Adding\u2026" : outOfStock ? "Out of stock" : added ? "Added" : "Add to cart"
-      }
-    ),
-    addError ? /* @__PURE__ */ jsx("p", { "data-cmssy-product-error": true, children: addError }) : null
-  ] });
-}
-var productBlock = defineBlock({
-  type: "product",
-  label: "Product",
-  category: "Commerce",
-  props: productProps,
-  component: ProductComponent
-});
-function CartComponent() {
-  const {
-    cart,
-    loading,
-    error,
-    updateItem,
-    removeItem,
-    applyDiscount,
-    removeDiscount
-  } = useCart();
-  const [code, setCode] = useState("");
-  const [busy, setBusy] = useState(false);
-  if (loading) {
-    return /* @__PURE__ */ jsx("div", { "data-cmssy-cart": "loading", children: "Loading\u2026" });
-  }
-  if (!cart || cart.items.length === 0) {
-    return /* @__PURE__ */ jsx("div", { "data-cmssy-cart": "empty", children: "Your cart is empty." });
-  }
-  const currency = cart.currency ?? "USD";
-  async function withBusy(fn) {
-    setBusy(true);
-    try {
-      await fn();
-    } catch {
-      setBusy(false);
-    } finally {
-      setBusy(false);
-    }
-  }
-  return /* @__PURE__ */ jsxs("div", { "data-cmssy-cart": cart.id, children: [
-    error ? /* @__PURE__ */ jsx("p", { "data-cmssy-cart-error": true, children: error }) : null,
-    /* @__PURE__ */ jsx("ul", { "data-cmssy-cart-items": true, children: cart.items.map((item) => /* @__PURE__ */ jsxs("li", { "data-cmssy-cart-item": item.id, children: [
-      /* @__PURE__ */ jsx("span", { "data-cmssy-item-name": true, children: item.snapshot.name }),
-      /* @__PURE__ */ jsx(
-        "input",
-        {
-          type: "number",
-          min: "1",
-          value: item.quantity,
-          disabled: busy,
-          onChange: (e) => {
-            const qty = Number(e.target.value);
-            if (Number.isInteger(qty) && qty >= 1) {
-              void withBusy(() => updateItem(item.id, qty));
-            }
-          },
-          "data-cmssy-item-qty": true
-        }
-      ),
-      /* @__PURE__ */ jsx("span", { "data-cmssy-item-price": true, children: formatPrice(item.snapshot.price * item.quantity, currency) }),
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          disabled: busy,
-          onClick: () => void withBusy(() => removeItem(item.id)),
-          "data-cmssy-item-remove": true,
-          children: "Remove"
-        }
-      )
-    ] }, item.id)) }),
-    /* @__PURE__ */ jsx("div", { "data-cmssy-cart-discount": true, children: cart.appliedDiscount ? /* @__PURE__ */ jsxs("p", { children: [
-      /* @__PURE__ */ jsx("span", { children: cart.appliedDiscount.code }),
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          disabled: busy,
-          onClick: () => void withBusy(() => removeDiscount()),
-          children: "Remove"
-        }
-      )
-    ] }) : /* @__PURE__ */ jsxs("p", { children: [
-      /* @__PURE__ */ jsx(
-        "input",
-        {
-          type: "text",
-          value: code,
-          placeholder: "Discount code",
-          onChange: (e) => setCode(e.target.value),
-          disabled: busy
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          disabled: busy || !code.trim(),
-          onClick: () => void withBusy(async () => {
-            await applyDiscount(code.trim());
-            setCode("");
-          }),
-          children: "Apply"
-        }
-      )
-    ] }) }),
-    /* @__PURE__ */ jsxs("dl", { "data-cmssy-cart-totals": true, children: [
-      /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx("dt", { children: "Subtotal" }),
-        /* @__PURE__ */ jsx("dd", { children: formatPrice(cart.subtotal, currency) })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx("dt", { children: "Total" }),
-        /* @__PURE__ */ jsx("dd", { "data-cmssy-cart-total": true, children: formatPrice(cart.discountedTotal, currency) })
-      ] })
-    ] })
-  ] });
-}
-var cartBlock = defineBlock({
-  type: "cart",
-  label: "Cart",
-  category: "Commerce",
-  props: {},
-  component: CartComponent
-});
-var checkoutProps = {
-  successMessage: fields.text({ label: "Success message" })
-};
-var EMAIL_RE = /^[^@\s]+@[^@\s]+\.[^@\s]+$/;
-function CheckoutComponent({
-  content: c
-}) {
-  const { cart, loading, checkout } = useCart();
-  const [email, setEmail] = useState("");
-  const [busy, setBusy] = useState(false);
-  const [error, setError] = useState(null);
-  const [order, setOrder] = useState(null);
-  if (order) {
-    return /* @__PURE__ */ jsxs("div", { "data-cmssy-checkout": "done", children: [
-      /* @__PURE__ */ jsx("p", { children: c.successMessage ?? "Order placed - awaiting payment." }),
-      /* @__PURE__ */ jsx("p", { "data-cmssy-order-id": true, children: order.id }),
-      /* @__PURE__ */ jsx("p", { "data-cmssy-order-total": true, children: formatPrice(order.total, order.currency) })
-    ] });
-  }
-  if (loading) {
-    return /* @__PURE__ */ jsx("div", { "data-cmssy-checkout": "loading", children: "Loading\u2026" });
-  }
-  if (!cart || cart.items.length === 0) {
-    return /* @__PURE__ */ jsx("div", { "data-cmssy-checkout": "empty", children: "Your cart is empty." });
-  }
-  const emailValid = EMAIL_RE.test(email.trim());
-  async function onSubmit() {
-    setBusy(true);
-    setError(null);
-    try {
-      setOrder(await checkout({ customerEmail: email.trim() }));
-    } catch (err) {
-      setError(err instanceof Error ? err.message : "Checkout failed");
-    } finally {
-      setBusy(false);
-    }
-  }
-  return /* @__PURE__ */ jsxs(
-    "form",
-    {
-      "data-cmssy-checkout": cart.id,
-      onSubmit: (e) => {
-        e.preventDefault();
-        if (emailValid && !busy) void onSubmit();
-      },
-      children: [
-        error ? /* @__PURE__ */ jsx("p", { "data-cmssy-checkout-error": true, children: error }) : null,
-        /* @__PURE__ */ jsxs("label", { children: [
-          /* @__PURE__ */ jsx("span", { children: "Email" }),
-          /* @__PURE__ */ jsx(
-            "input",
-            {
-              type: "email",
-              value: email,
-              onChange: (e) => setEmail(e.target.value),
-              required: true,
-              "data-cmssy-checkout-email": true
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsx("p", { "data-cmssy-checkout-total": true, children: formatPrice(cart.discountedTotal, cart.currency ?? "USD") }),
-        /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "submit",
-            disabled: busy || !emailValid,
-            "data-cmssy-checkout-submit": true,
-            children: busy ? "Placing order\u2026" : "Place order"
-          }
-        )
-      ]
-    }
-  );
-}
-var checkoutBlock = defineBlock({
-  type: "checkout",
-  label: "Checkout",
-  category: "Commerce",
-  props: checkoutProps,
-  component: CheckoutComponent
-});
-function useCmssyOrders(options = {}) {
-  const base = (options.basePath ?? "/api/cmssy/orders").replace(/\/+$/, "");
-  const skip = options.skip ?? 0;
-  const limit = options.limit ?? 20;
-  const [orders, setOrders] = useState([]);
-  const [total, setTotal] = useState(0);
-  const [hasMore, setHasMore] = useState(false);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState(null);
-  const load = useCallback(async () => {
-    setLoading(true);
-    setError(null);
-    try {
-      const qs = new URLSearchParams({
-        skip: String(skip),
-        limit: String(limit)
-      });
-      const res = await fetch(`${base}?${qs.toString()}`, {
-        credentials: "same-origin",
-        cache: "no-store"
-      });
-      if (res.status === 401) {
-        setOrders([]);
-        setTotal(0);
-        setHasMore(false);
-        return;
-      }
-      if (!res.ok) {
-        const body = await res.json().catch(() => ({}));
-        throw new Error(
-          body.message ?? `Orders request failed (${res.status})`
-        );
-      }
-      const data = await res.json();
-      setOrders(data.items ?? []);
-      setTotal(data.total ?? 0);
-      setHasMore(Boolean(data.hasMore));
-    } catch (e) {
-      setError(e instanceof Error ? e.message : "Could not load orders");
-    } finally {
-      setLoading(false);
-    }
-  }, [base, skip, limit]);
-  useEffect(() => {
-    void load();
-  }, [load]);
-  return { orders, total, hasMore, loading, error, refresh: load };
-}
-function useCmssyOrder(id, options = {}) {
-  const base = (options.basePath ?? "/api/cmssy/orders").replace(/\/+$/, "");
-  const [order, setOrder] = useState(null);
-  const [loading, setLoading] = useState(Boolean(id));
-  const [error, setError] = useState(null);
-  const load = useCallback(async () => {
-    if (!id) {
-      setOrder(null);
-      setLoading(false);
-      return;
-    }
-    setLoading(true);
-    setError(null);
-    try {
-      const qs = new URLSearchParams({ id });
-      const res = await fetch(`${base}?${qs.toString()}`, {
-        credentials: "same-origin",
-        cache: "no-store"
-      });
-      if (res.status === 401) {
-        setOrder(null);
-        return;
-      }
-      if (!res.ok) {
-        const body = await res.json().catch(() => ({}));
-        throw new Error(body.message ?? `Order request failed (${res.status})`);
-      }
-      const data = await res.json();
-      setOrder(data.order ?? null);
-    } catch (e) {
-      setError(e instanceof Error ? e.message : "Could not load the order");
-    } finally {
-      setLoading(false);
-    }
-  }, [base, id]);
-  useEffect(() => {
-    void load();
-  }, [load]);
-  return { order, loading, error, refresh: load };
-}
 
-export { CmssyAuthProvider, CmssyCommerceProvider, CmssyEditableLayout, CmssyEditablePage, CmssyLazyEditor, CmssyLazyLayout, CmssyLocaleProvider, cartBlock, checkoutBlock, productBlock, useCart, useCmssyLocale, useCmssyOrder, useCmssyOrders, useCmssyUser, useEditBridge };
+export { CmssyEditableLayout, CmssyEditablePage, CmssyLazyEditor, CmssyLazyLayout, useEditBridge };