@loczer/storefront-sdk 0.148.0 → 0.150.0

package/dist/components/PlaygroundDevFloatingButton/index.js

@@ -0,0 +1,216 @@
+import { jsx as i, jsxs as M } from "react/jsx-runtime";
+import { useState as K, useRef as c, useCallback as h, useEffect as O, useMemo as U } from "react";
+import J from "interactjs";
+import Q from "../../chunks/assets/dev.svg-jGkd1F38.js";
+import { Button as Z } from "../../ui/button.js";
+import { cn as F } from "@rpcbase/ui";
+import { usePlaygroundDevSettings as ee, DEFAULT_PLAYGROUND_DEV_SETTINGS as te, writePlaygroundDevSettings as ne, resetPlaygroundDevSettings as re } from "../../lib/playgroundDevSettings.js";
+const oe = [
+  {
+    value: "current_booking_hero",
+    label: "Current booking hero",
+    hint: "Default storefront hero with the right-side booking form"
+  },
+  {
+    value: "booking_bar_overlay_hero",
+    label: "Booking bar over image",
+    hint: "Keep left content and replace right form by image + overlapping booking bar"
+  },
+  {
+    value: "vertical_marquee_hero",
+    label: "Vertical marquee hero",
+    hint: "Keep the overlay booking bar and swap the static image for a vertical animated gallery"
+  }
+], fe = () => {
+  const D = ee(), [B, p] = K(!1), [Y, V] = K({ horizontal: "left", vertical: "above" }), g = c(null), L = c(null), I = c(null), T = c(!1), b = c(!1), n = c({ x: 0, y: 0 }), C = c(null), w = c(null), X = D.heroMode !== te.heroMode, W = h((t) => {
+    ne({
+      ...D,
+      heroMode: t
+    });
+  }, [D]), s = h(() => {
+    g.current != null && (window.clearTimeout(g.current), g.current = null);
+  }, []), a = h(() => {
+    const t = L.current, o = I.current;
+    if (!t || !o || typeof window > "u")
+      return;
+    const l = t.getBoundingClientRect(), y = o.getBoundingClientRect(), u = window.innerWidth, d = 16, z = l.left + y.width + d > u ? "right" : "left", P = l.top - y.height - d < 0 ? "below" : "above";
+    V((x) => x.horizontal === z && x.vertical === P ? x : { horizontal: z, vertical: P });
+  }, []), E = h(() => {
+    T.current || b.current || (s(), p(!0), window.requestAnimationFrame(() => {
+      a();
+    }));
+  }, [s, a]), S = h(() => {
+    T.current || b.current || (s(), g.current = window.setTimeout(() => {
+      p(!1), g.current = null;
+    }, 120));
+  }, [s]), q = h(() => {
+    s(), p(!1);
+  }, [s]);
+  return O(() => {
+    if (!B) return;
+    a();
+    const t = () => a();
+    return window.addEventListener("resize", t), () => window.removeEventListener("resize", t);
+  }, [B, a]), O(() => () => s(), [s]), O(() => {
+    const t = L.current;
+    if (!t || typeof window > "u") return;
+    const o = t.getBoundingClientRect();
+    C.current = {
+      left: o.left,
+      top: o.top,
+      width: o.width,
+      height: o.height
+    };
+    const l = 8, y = () => {
+      if (!C.current) return n.current;
+      const { left: e, top: r, width: m, height: _ } = C.current, f = l - e, A = l - r, v = window.innerWidth - l - m - e, k = window.innerHeight - l - _ - r, R = Math.min(Math.max(n.current.x, f), v), N = Math.min(Math.max(n.current.y, A), k);
+      return n.current = { x: R, y: N }, { x: R, y: N, minX: f, minY: A, maxX: v, maxY: k };
+    }, u = () => {
+      const { x: e, y: r } = y();
+      t.style.transform = `translate3d(${e}px, ${r}px, 0)`;
+    }, d = () => {
+      w.current != null && (cancelAnimationFrame(w.current), w.current = null), b.current = !1;
+    }, z = window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches, P = (e, r) => {
+      if (z) {
+        u(), b.current = !1;
+        return;
+      }
+      let m = performance.now();
+      b.current = !0;
+      const _ = 0.92, f = 0.7, A = 20, v = (k) => {
+        const R = (k - m) / 1e3;
+        m = k, n.current.x += e * R, n.current.y += r * R;
+        const { minX: N, minY: H, maxX: $, maxY: j } = y();
+        if (n.current.x <= N + 1e-3 && e < 0 ? (n.current.x = N, e = -e * f) : n.current.x >= $ - 1e-3 && e > 0 && (n.current.x = $, e = -e * f), n.current.y <= H + 1e-3 && r < 0 ? (n.current.y = H, r = -r * f) : n.current.y >= j - 1e-3 && r > 0 && (n.current.y = j, r = -r * f), e *= _, r *= _, t.style.transform = `translate3d(${n.current.x}px, ${n.current.y}px, 0)`, Math.hypot(e, r) < A) {
+          d();
+          return;
+        }
+        w.current = requestAnimationFrame(v);
+      };
+      w.current = requestAnimationFrame(v);
+    }, x = J(t).draggable({ inertia: !1 }).styleCursor(!1).on("dragstart", () => {
+      d(), T.current = !0, p(!1), s();
+    }).on("dragmove", (e) => {
+      n.current.x += e.dx, n.current.y += e.dy, u();
+    }).on("dragend", (e) => {
+      const r = Number.isFinite(e.velocityX) ? e.velocityX : 0, m = Number.isFinite(e.velocityY) ? e.velocityY : 0;
+      T.current = !1, Math.hypot(r, m) >= 10 ? P(r, m) : (u(), d()), a();
+    }), G = () => {
+      const e = t.getBoundingClientRect();
+      C.current = {
+        left: e.left - n.current.x,
+        top: e.top - n.current.y,
+        width: e.width,
+        height: e.height
+      }, u(), a();
+    };
+    return window.addEventListener("resize", G), u(), a(), () => {
+      x.unset(), d(), window.removeEventListener("resize", G);
+    };
+  }, [s, a]), U(() => !1, []) ? /* @__PURE__ */ i("div", { className: "fixed bottom-4 left-4 z-50 pointer-events-none select-none", children: /* @__PURE__ */ i(
+    "div",
+    {
+      ref: L,
+      className: "pointer-events-auto",
+      style: { touchAction: "none" },
+      children: /* @__PURE__ */ M(
+        "div",
+        {
+          className: "relative",
+          onMouseEnter: E,
+          onMouseLeave: S,
+          onFocusCapture: E,
+          onBlurCapture: (t) => {
+            const o = t.relatedTarget;
+            (!o || !t.currentTarget.contains(o)) && S();
+          },
+          children: [
+            /* @__PURE__ */ i(
+              "button",
+              {
+                type: "button",
+                "aria-label": "Playground developer tools",
+                className: F(
+                  "inline-flex h-14 w-14 md:h-12 md:w-12 items-center justify-center rounded-full shadow-lg ring-1 transition-colors p-1 cursor-pointer",
+                  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/90 focus-visible:ring-offset-2 focus-visible:ring-offset-pink-600",
+                  "bg-pink-600 hover:bg-pink-700 ring-pink-700"
+                ),
+                onMouseDown: q,
+                onTouchStart: q,
+                onFocus: E,
+                onKeyDown: (t) => {
+                  t.key === "Escape" && (p(!1), s());
+                },
+                children: /* @__PURE__ */ i(
+                  "img",
+                  {
+                    src: Q,
+                    className: "h-9 w-9 md:h-8 md:w-8",
+                    alt: "",
+                    draggable: !1
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ M(
+              "div",
+              {
+                ref: I,
+                className: F(
+                  "absolute w-80 rounded-xl border border-pink-500/40 bg-gray-950/95 text-gray-100 shadow-xl backdrop-blur-sm transition-all duration-150",
+                  Y.vertical === "above" ? "bottom-full mb-3" : "top-full mt-3",
+                  Y.horizontal === "left" ? "left-0" : "right-0",
+                  B ? "pointer-events-auto opacity-100 translate-y-0" : "pointer-events-none opacity-0 translate-y-2"
+                ),
+                onMouseEnter: E,
+                onMouseLeave: S,
+                children: [
+                  /* @__PURE__ */ i("div", { className: "px-4 py-3 border-b border-pink-500/40", children: /* @__PURE__ */ i("p", { className: "text-sm font-semibold text-pink-200", children: "Playground overrides" }) }),
+                  /* @__PURE__ */ M("div", { className: "px-4 py-3 space-y-3", children: [
+                    /* @__PURE__ */ i("p", { className: "text-xs font-semibold uppercase tracking-wide text-pink-200", children: "Hero layout" }),
+                    oe.map((t) => {
+                      const o = D.heroMode === t.value;
+                      return /* @__PURE__ */ M("label", { className: "flex cursor-pointer items-start gap-3 rounded-lg border border-pink-500/30 p-2", children: [
+                        /* @__PURE__ */ i(
+                          "input",
+                          {
+                            type: "radio",
+                            name: "playground-hero-mode",
+                            className: "mt-0.5 h-4 w-4 accent-pink-500",
+                            checked: o,
+                            onChange: () => W(t.value)
+                          }
+                        ),
+                        /* @__PURE__ */ M("span", { className: "flex flex-col gap-1", children: [
+                          /* @__PURE__ */ i("span", { className: "text-sm font-medium text-gray-100", children: t.label }),
+                          /* @__PURE__ */ i("span", { className: F("text-xs", o ? "text-pink-300" : "text-gray-400"), children: t.hint })
+                        ] })
+                      ] }, t.value);
+                    })
+                  ] }),
+                  /* @__PURE__ */ i("div", { className: "px-4 pb-4", children: /* @__PURE__ */ i(
+                    Z,
+                    {
+                      type: "button",
+                      variant: "outline",
+                      className: F(
+                        "w-full border border-pink-500/60 bg-pink-500/10 text-pink-100 hover:text-white hover:bg-pink-500/30 cursor-pointer",
+                        !X && "pointer-events-none opacity-60"
+                      ),
+                      onClick: re,
+                      disabled: !X,
+                      children: "Reset overrides"
+                    }
+                  ) })
+                ]
+              }
+            )
+          ]
+        }
+      )
+    }
+  ) }) : null;
+};
+export {
+  fe as PlaygroundDevFloatingButton
+};

package/dist/components/PoweredByLoczerBadge/index.d.ts

@@ -0,0 +1,9 @@
+import { ComponentPropsWithoutRef } from 'react';
+type PoweredByLoczerBadgeProps = Omit<ComponentPropsWithoutRef<"a">, "children"> & {
+    language?: string | null;
+    markClassName?: string;
+    showTagline?: boolean;
+};
+export declare function PoweredByLoczerBadge({ language, ...props }: PoweredByLoczerBadgeProps): import("react/jsx-runtime").JSX.Element;
+export type { PoweredByLoczerBadgeProps };
+//# sourceMappingURL=index.d.ts.map

package/dist/components/PoweredByLoczerBadge/index.js

@@ -0,0 +1,73 @@
+import { jsx as e, jsxs as o } from "react/jsx-runtime";
+import { useId as h } from "react";
+import { cn as C } from "@rpcbase/ui";
+import { useTranslation as c } from "react-i18next";
+import { I18nProvider as p } from "../../i18n/I18nProvider.js";
+const f = "https://loczer.com";
+function m({ className: r }) {
+  const t = h();
+  return /* @__PURE__ */ o(
+    "svg",
+    {
+      viewBox: "0 0 128 128",
+      xmlns: "http://www.w3.org/2000/svg",
+      className: r,
+      "aria-hidden": "true",
+      focusable: "false",
+      children: [
+        /* @__PURE__ */ e("rect", { width: "128", height: "128", rx: "28", fill: `url(#${t})` }),
+        /* @__PURE__ */ e(
+          "path",
+          {
+            d: "M48.4 18.9333C46.1014 18.9333 43.897 19.8464 42.2717 21.4717C40.6464 23.0971 39.7333 25.3015 39.7333 27.6C39.7333 29.8985 40.6464 32.1029 42.2717 33.7283C43.897 35.3536 46.1014 36.2667 48.4 36.2667C49.5381 36.2667 50.6651 36.0425 51.7166 35.607C52.7681 35.1714 53.7235 34.533 54.5282 33.7283C55.333 32.9235 55.9714 31.9681 56.4069 30.9166C56.8425 29.8651 57.0667 28.7381 57.0667 27.6C57.0667 25.3015 56.1536 23.0971 54.5282 21.4717C52.9029 19.8464 50.6985 18.9333 48.4 18.9333ZM74.3323 29.2995C73.4316 29.3263 72.5768 29.7027 71.9489 30.349L62.5646 39.7333H48.4C46.663 39.7355 44.9668 40.2595 43.5313 41.2374C42.0958 42.2154 40.9873 43.6021 40.3495 45.2177H40.3427L33.6667 61.962L33.6734 61.9687C33.1026 63.1419 32.8041 64.4287 32.8 65.7333C32.8 68.0319 33.7131 70.2363 35.3384 71.8616C36.9637 73.4869 39.1681 74.4 41.4667 74.4C42.4139 74.3952 43.354 74.235 44.2495 73.926L44.263 73.9396L56.8094 70.0328L68.0828 83.3104C68.3218 83.7093 68.6386 84.056 69.0144 84.3299C69.3901 84.6039 69.8171 84.7994 70.27 84.905C70.7229 85.0105 71.1923 85.0238 71.6505 84.9442C72.1086 84.8646 72.546 84.6936 72.9367 84.4415C73.3274 84.1893 73.6634 83.8612 73.9247 83.4765C74.186 83.0919 74.3672 82.6586 74.4577 82.2025C74.5481 81.7463 74.5458 81.2767 74.451 80.8214C74.3561 80.3662 74.1707 79.9347 73.9057 79.5526L63.5057 62.2193C63.1987 61.7064 62.7642 61.2817 62.2446 60.9863C61.725 60.6909 61.1378 60.5349 60.5401 60.5333L60.5333 60.5198L51.8802 60.5333L55.8547 52.801C56.0534 52.4701 56.2299 52.1263 56.3828 51.7719L57.3713 49.849L65.151 46.4635L65.1713 46.4568C65.652 46.2856 66.089 46.0105 66.451 45.651L76.851 35.251C77.352 34.7641 77.6941 34.1372 77.8326 33.4525C77.9712 32.7677 77.8996 32.0571 77.6273 31.4137C77.3551 30.7704 76.8948 30.2243 76.3068 29.847C75.7188 29.4697 75.0306 29.2789 74.3323 29.2995ZM86.5333 39.7333C77.9587 39.7333 70.9333 46.7588 70.9333 55.3333C70.9333 63.9079 77.9587 70.9333 86.5333 70.9333C95.1079 70.9333 102.133 63.9079 102.133 55.3333C102.133 46.7588 95.1079 39.7333 86.5333 39.7333ZM86.5333 46.6667C91.3609 46.6667 95.2 50.5058 95.2 55.3333C95.2 60.1609 91.3609 64 86.5333 64C81.7058 64 77.8667 60.1609 77.8667 55.3333C77.8667 50.5058 81.7058 46.6667 86.5333 46.6667ZM48.4 77.8667C39.8254 77.8667 32.8 84.8921 32.8 93.4667C32.8 102.041 39.8254 109.067 48.4 109.067C56.9746 109.067 64 102.041 64 93.4667C64 84.8921 56.9746 77.8667 48.4 77.8667ZM48.4 84.8C53.2275 84.8 57.0667 88.6391 57.0667 93.4667C57.0667 98.2942 53.2275 102.133 48.4 102.133C43.5725 102.133 39.7333 98.2942 39.7333 93.4667C39.7333 88.6391 43.5725 84.8 48.4 84.8Z",
+            fill: "white"
+          }
+        ),
+        /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ o("linearGradient", { id: t, x1: "0", y1: "0", x2: "128", y2: "128", gradientUnits: "userSpaceOnUse", children: [
+          /* @__PURE__ */ e("stop", { stopColor: "#193CB8" }),
+          /* @__PURE__ */ e("stop", { offset: "1", stopColor: "#193CB8", stopOpacity: "0.7" })
+        ] }) })
+      ]
+    }
+  );
+}
+function v({
+  language: r,
+  ...t
+}) {
+  return /* @__PURE__ */ e(p, { initialLanguage: r, children: /* @__PURE__ */ e(w, { ...t }) });
+}
+function w({
+  className: r,
+  href: t = f,
+  markClassName: n,
+  rel: s = "noopener noreferrer",
+  showTagline: a = !0,
+  target: l = "_blank",
+  ...d
+}) {
+  const { t: i } = c();
+  return /* @__PURE__ */ o(
+    "a",
+    {
+      className: C(
+        "group inline-flex w-fit items-center gap-3 rounded-2xl border border-white/10 bg-white/5 px-3 py-2 shadow-sm transition hover:border-white/20 hover:bg-white/10",
+        r
+      ),
+      href: t,
+      target: l,
+      rel: s,
+      ...d,
+      children: [
+        /* @__PURE__ */ e(m, { className: C("h-8 w-8 flex-shrink-0", n) }),
+        /* @__PURE__ */ o("span", { className: "flex flex-col items-start leading-tight text-left", children: [
+          /* @__PURE__ */ e("span", { className: "font-medium text-white/90 group-hover:text-white", children: i("platform_footer_powered_by") }),
+          a ? /* @__PURE__ */ e("span", { className: "text-[11px] text-white/60 group-hover:text-white/80", children: i("platform_footer_tagline") }) : null
+        ] })
+      ]
+    }
+  );
+}
+export {
+  v as PoweredByLoczerBadge
+};

package/dist/components/ProductPriceBadge/index.d.ts

@@ -0,0 +1,9 @@
+import { StorefrontPublicProductPrice } from '../../lib/storefrontProducts';
+type ProductPriceBadgeProps = {
+    prices?: StorefrontPublicProductPrice[];
+    minPriceMinor?: number;
+    className?: string;
+};
+export declare const ProductPriceBadge: ({ prices, minPriceMinor, className }: ProductPriceBadgeProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ProductPriceBadge/index.js

@@ -0,0 +1,229 @@
+import { jsx as t, jsxs as n, Fragment as re } from "react/jsx-runtime";
+import { useId as oe, useState as j, useRef as y, useEffect as O } from "react";
+import { Drawer as i } from "@base-ui/react/drawer";
+import { Popover as u } from "@base-ui/react/popover";
+import { useMediaQuery as Q } from "@rpcbase/client";
+import { cn as m } from "@rpcbase/ui";
+import { TrendingDown as ae, Phone as ie, Mail as se } from "lucide-react";
+import { useTranslation as le } from "react-i18next";
+import { useOptionalStorefront as de } from "../../StorefrontProvider.js";
+import { buildPriceTierLabels as ce, buildDailyPriceRows as pe, formatStorefrontPriceMinor as ue } from "../../lib/pricing.js";
+import { Badge as me, badgeVariants as fe } from "../../ui/badge.js";
+const W = 180, he = "(max-width: 767px)", C = "loczer:storefront:product-price-popover-open", ge = (s) => typeof Node < "u" && s instanceof Node, Y = (s) => {
+  typeof window > "u" || window.dispatchEvent(new CustomEvent(C, { detail: { id: s } }));
+}, Ce = ({ prices: s, minPriceMinor: T, className: L }) => {
+  const { t: r, i18n: w } = le(), f = oe(), M = de(), $ = Q(he), H = Q("(hover: none), (pointer: coarse)"), h = !!($ || H), [l, c] = j(!1), [k, g] = j(!1), d = y(null), P = y(null), R = y(null), B = ce(s, w.language, r), N = pe(s, w.language), v = B[0], I = B[1], o = () => {
+    d.current && (clearTimeout(d.current), d.current = null);
+  }, p = () => {
+    h || (o(), c(!0), Y(f));
+  }, _ = () => {
+    o(), c(!1);
+  }, U = () => {
+    o(), g(!0), Y(f);
+  }, q = () => {
+    g(!1);
+  }, G = () => {
+    l || p();
+  }, E = (e) => ge(e) ? !!(P.current?.contains(e) || R.current?.contains(e)) : !1, z = (e) => {
+    E(e) || (o(), d.current = setTimeout(() => {
+      c(!1), d.current = null;
+    }, W));
+  }, S = (e) => {
+    z(e?.relatedTarget);
+  }, J = (e) => {
+    const a = e.relatedTarget ?? document.activeElement;
+    E(a) || _();
+  };
+  if (O(() => {
+    if (typeof window > "u")
+      return () => {
+        o();
+      };
+    const e = (a) => {
+      a.detail?.id !== f && (o(), c(!1), g(!1));
+    };
+    return window.addEventListener(C, e), () => {
+      window.removeEventListener(C, e), o();
+    };
+  }, [f]), O(() => {
+    if (!l || typeof window > "u") return;
+    const e = (a) => {
+      if (E(a.target)) {
+        o();
+        return;
+      }
+      d.current || z(a.target);
+    };
+    return window.addEventListener("pointermove", e, { passive: !0 }), window.addEventListener("mousemove", e, { passive: !0 }), () => {
+      window.removeEventListener("pointermove", e), window.removeEventListener("mousemove", e);
+    };
+  }, [l]), O(() => {
+    if (h) {
+      o(), c(!1);
+      return;
+    }
+    g(!1);
+  }, [h]), !v)
+    return typeof T != "number" ? null : /* @__PURE__ */ t(me, { variant: "outline", className: m("border-slate-200 bg-white text-slate-700", L), children: /* @__PURE__ */ t("span", { children: r("price_from", {
+      price: ue(T, w.language)
+    }) }) });
+  const A = m(
+    fe({ variant: "outline" }),
+    "gap-1.5 border-slate-200 bg-white text-slate-700 transition hover:border-slate-300 hover:text-slate-950 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-slate-900/15",
+    N.length > 0 && "cursor-help",
+    L
+  ), x = M?.storefrontConfiguration.shop.emailAddress?.trim(), b = M?.storefrontConfiguration.shop.contactPhone1?.trim(), K = !!(x || b), F = () => /* @__PURE__ */ n(re, { children: [
+    /* @__PURE__ */ t("span", { className: "font-semibold", children: v }),
+    I ? /* @__PURE__ */ n("span", { className: "inline-flex items-center gap-1 text-slate-500", children: [
+      /* @__PURE__ */ t(ae, { className: "h-3 w-3", strokeWidth: 2.4, "aria-hidden": "true" }),
+      /* @__PURE__ */ t("span", { children: r("price_then", { price: I }) })
+    ] }) : null
+  ] }), X = () => K ? /* @__PURE__ */ n("div", { className: "border-t border-slate-200 pt-2 text-slate-600", children: [
+    /* @__PURE__ */ t("p", { className: "leading-snug", children: /* @__PURE__ */ t("span", { children: r("price_table_contact_prompt") }) }),
+    /* @__PURE__ */ n("div", { className: "mt-2 flex flex-wrap gap-x-3 gap-y-1", children: [
+      b ? /* @__PURE__ */ n(
+        "a",
+        {
+          className: "inline-flex min-w-0 items-center gap-1 font-medium text-slate-800 underline-offset-4 hover:underline",
+          href: `tel:${b}`,
+          children: [
+            /* @__PURE__ */ t(ie, { className: "h-3 w-3 shrink-0", "aria-hidden": "true" }),
+            /* @__PURE__ */ t("span", { className: "whitespace-nowrap", children: b })
+          ]
+        }
+      ) : null,
+      x ? /* @__PURE__ */ n(
+        "a",
+        {
+          className: "inline-flex min-w-0 items-center gap-1 font-medium text-slate-800 underline-offset-4 hover:underline",
+          href: `mailto:${x}`,
+          children: [
+            /* @__PURE__ */ t(se, { className: "h-3 w-3 shrink-0", "aria-hidden": "true" }),
+            /* @__PURE__ */ t("span", { className: "break-all", children: x })
+          ]
+        }
+      ) : null
+    ] })
+  ] }) : null, V = (e, a) => /* @__PURE__ */ n("div", { className: m("grid gap-2", a === "popover" ? "text-xs" : "text-base"), children: [
+    e ? /* @__PURE__ */ t("p", { className: "font-semibold uppercase tracking-[0.12em] text-slate-500", children: /* @__PURE__ */ t("span", { children: r("price_table_title") }) }) : null,
+    /* @__PURE__ */ t("ul", { className: m("grid gap-1 text-slate-600", a === "drawer" && "gap-1.5"), children: N.map(({ dayCount: D, totalPriceLabel: Z, perDayPriceLabel: ee }) => {
+      const te = r("price_table_day", { count: D }), ne = r("price_table_per_day", { price: ee });
+      return /* @__PURE__ */ t("li", { children: /* @__PURE__ */ n("div", { className: "flex items-baseline gap-2", children: [
+        /* @__PURE__ */ t("span", { className: "shrink-0 leading-tight", children: te }),
+        /* @__PURE__ */ t("span", { className: "mx-1 flex-1 border-b border-dotted border-slate-300", "aria-hidden": "true" }),
+        /* @__PURE__ */ n("span", { className: "shrink-0 font-medium leading-tight text-slate-950", children: [
+          Z,
+          /* @__PURE__ */ n("span", { className: m("ml-1 font-medium text-slate-500", a === "popover" ? "text-[11px]" : "text-sm"), children: [
+            /* @__PURE__ */ t("span", { children: "(" }),
+            /* @__PURE__ */ t("span", { children: ne }),
+            /* @__PURE__ */ t("span", { children: ")" })
+          ] })
+        ] })
+      ] }) }, D);
+    }) }),
+    X()
+  ] });
+  return h ? /* @__PURE__ */ n(
+    i.Root,
+    {
+      open: k,
+      onOpenChange: (e) => {
+        e ? U() : q();
+      },
+      swipeDirection: "down",
+      children: [
+        /* @__PURE__ */ t(
+          i.Trigger,
+          {
+            ref: P,
+            type: "button",
+            className: A,
+            "aria-label": r("price_details_aria_label", { price: v }),
+            "aria-expanded": k,
+            onClick: (e) => {
+              e.stopPropagation();
+            },
+            onPointerDown: (e) => {
+              e.stopPropagation();
+            },
+            children: F()
+          }
+        ),
+        /* @__PURE__ */ n(i.Portal, { children: [
+          /* @__PURE__ */ t(i.Backdrop, { className: "pointer-events-auto fixed inset-0 z-50 bg-black/50 outline-none data-[closed]:animate-out data-[closed]:fade-out-0 data-[open]:animate-in data-[open]:fade-in-0" }),
+          /* @__PURE__ */ t(i.Viewport, { className: "pointer-events-none fixed inset-0 z-50", children: /* @__PURE__ */ n(i.Popup, { className: "pointer-events-auto fixed inset-x-0 bottom-0 z-50 flex max-h-[90dvh] flex-col rounded-t-2xl border-t border-slate-200 bg-white text-slate-950 shadow-xl outline-none data-[closed]:animate-out data-[closed]:fade-out-0 data-[closed]:slide-out-to-bottom data-[open]:animate-in data-[open]:fade-in-0 data-[open]:slide-in-from-bottom", children: [
+            /* @__PURE__ */ t("div", { className: "mx-auto mt-4 h-2 w-[100px] shrink-0 rounded-full bg-slate-200", "aria-hidden": "true" }),
+            /* @__PURE__ */ t(i.Content, { children: /* @__PURE__ */ n("div", { className: "flex max-h-[calc(90dvh-1rem)] flex-col", children: [
+              /* @__PURE__ */ t("div", { className: "border-b border-slate-200 px-4 py-4 text-left", children: /* @__PURE__ */ t(i.Title, { className: "text-left text-lg font-semibold text-slate-950", children: /* @__PURE__ */ t("span", { children: r("price_table_title") }) }) }),
+              /* @__PURE__ */ t("div", { className: "flex-1 overflow-y-auto px-4 pb-6 pt-3", children: V(!1, "drawer") })
+            ] }) })
+          ] }) })
+        ] })
+      ]
+    }
+  ) : /* @__PURE__ */ n(
+    u.Root,
+    {
+      open: l,
+      onOpenChange: (e) => {
+        e ? p() : _();
+      },
+      children: [
+        /* @__PURE__ */ t(
+          u.Trigger,
+          {
+            ref: P,
+            type: "button",
+            openOnHover: !0,
+            delay: 0,
+            closeDelay: W,
+            className: A,
+            "aria-label": r("price_details_aria_label", { price: v }),
+            "aria-expanded": l,
+            onMouseEnter: p,
+            onMouseMove: G,
+            onMouseLeave: S,
+            onBlur: J,
+            onClick: (e) => {
+              e.preventDefault(), e.stopPropagation(), l ? _() : p();
+            },
+            onPointerDown: (e) => {
+              e.stopPropagation();
+            },
+            children: F()
+          }
+        ),
+        N.length > 0 ? /* @__PURE__ */ t(u.Portal, { children: /* @__PURE__ */ t(
+          u.Positioner,
+          {
+            side: "top",
+            align: "end",
+            sideOffset: 8,
+            collisionPadding: 12,
+            className: "pointer-events-auto z-[70] outline-none",
+            children: /* @__PURE__ */ t(
+              u.Popup,
+              {
+                ref: R,
+                initialFocus: !1,
+                className: "w-64 rounded-xl border border-slate-200 bg-white p-3 text-slate-950 shadow-xl outline-none data-[closed]:animate-out data-[closed]:fade-out-0 data-[closed]:zoom-out-95 data-[open]:animate-in data-[open]:fade-in-0 data-[open]:zoom-in-95",
+                onPointerDown: (e) => {
+                  e.stopPropagation(), o();
+                },
+                onClick: (e) => {
+                  e.stopPropagation();
+                },
+                onMouseEnter: p,
+                onMouseLeave: S,
+                children: V(!0, "popover")
+              }
+            )
+          }
+        ) }) : null
+      ]
+    }
+  );
+};
+export {
+  Ce as ProductPriceBadge
+};

package/dist/components/ProductWarningNotice/index.d.ts

@@ -0,0 +1,7 @@
+type ProductWarningNoticeProps = {
+    warning?: string;
+    className?: string;
+};
+export declare function ProductWarningNotice({ warning, className }: ProductWarningNoticeProps): import("react/jsx-runtime").JSX.Element | null;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ProductWarningNotice/index.js

@@ -0,0 +1,22 @@
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import { AlertCircle as a } from "lucide-react";
+import { cn as m } from "@rpcbase/ui";
+function l({ warning: n, className: i }) {
+  const r = n?.trim();
+  return r ? /* @__PURE__ */ t(
+    "div",
+    {
+      className: m(
+        "flex items-center gap-2 text-xs font-medium text-amber-700",
+        i
+      ),
+      children: [
+        /* @__PURE__ */ e(a, { className: "h-4 w-4 shrink-0", "aria-hidden": "true" }),
+        /* @__PURE__ */ e("span", { className: "leading-snug", children: r })
+      ]
+    }
+  ) : null;
+}
+export {
+  l as ProductWarningNotice
+};

package/dist/components/StepSectionTitle/index.d.ts

@@ -0,0 +1,8 @@
+type StepSectionTitleProps = {
+    stepNumber: number;
+    title: string;
+    className?: string;
+};
+export declare const StepSectionTitle: ({ stepNumber, title, className }: StepSectionTitleProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/components/StepSectionTitle/index.js

@@ -0,0 +1,6 @@
+import { jsx as r } from "react/jsx-runtime";
+import { cn as i } from "@rpcbase/ui";
+const c = ({ stepNumber: t, title: e, className: o }) => /* @__PURE__ */ r("h2", { className: i("text-lg font-semibold tracking-tight sm:text-xl", o), children: `${t}. ${e}` });
+export {
+  c as StepSectionTitle
+};

package/dist/components/StorefrontCartPanel/index.d.ts

@@ -0,0 +1,25 @@
+import { StorefrontCartSummaryLine } from '../../lib/cartSummary';
+type StorefrontCartPanelProps = {
+    lines: StorefrontCartSummaryLine[];
+    itemCount: number;
+    totalPerDayMinor: number;
+    estimatedDays?: number;
+    estimatedTotalMinor?: number;
+    discountedEstimatedTotalMinor?: number;
+    discountAmountMinor?: number;
+    couponCode?: string;
+    durationLabel?: string;
+    title?: string;
+    description?: string;
+    checkoutPath?: string;
+    showCheckoutAction?: boolean;
+    showClearAction?: boolean;
+    editable?: boolean;
+    stickyTopClassName?: string;
+    onQuantityChange?: (key: string, quantity: number) => void;
+    onRemove?: (key: string) => void;
+    onClear?: () => void;
+};
+export declare function StorefrontCartPanel({ lines, itemCount, totalPerDayMinor, estimatedDays, estimatedTotalMinor, discountedEstimatedTotalMinor, discountAmountMinor, couponCode, durationLabel, title, description, checkoutPath, showCheckoutAction, showClearAction, editable, stickyTopClassName, onQuantityChange, onRemove, onClear, }: StorefrontCartPanelProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=index.d.ts.map