@dreamtree-org/landing-kit 0.9.0 → 0.10.1

package/dist/auth.js

@@ -87,12 +87,115 @@ function DemoAccounts({ load, onSelect, className = "" }) {
   ] });
 }
 
+// src/DreamtreeSso.jsx
+import { useEffect as useEffect2, useRef as useRef2 } from "react";
+
+// src/sso.js
+function decodeKey(part) {
+  const key = part.split("=")[0];
+  try {
+    return decodeURIComponent(key.replace(/\+/g, " "));
+  } catch {
+    return key;
+  }
+}
+function buildSsoUrl(startUrl, { returnTo, companySlug } = {}) {
+  const raw = String(startUrl != null ? startUrl : "");
+  const hashAt = raw.indexOf("#");
+  const hash = hashAt === -1 ? "" : raw.slice(hashAt);
+  const beforeHash = hashAt === -1 ? raw : raw.slice(0, hashAt);
+  const queryAt = beforeHash.indexOf("?");
+  const path = queryAt === -1 ? beforeHash : beforeHash.slice(0, queryAt);
+  const query = queryAt === -1 ? "" : beforeHash.slice(queryAt + 1);
+  const add = [
+    ["return_to", returnTo],
+    ["dt_company", companySlug]
+  ].filter(([, v]) => v != null && v !== "");
+  const replaced = new Set(add.map(([k]) => k));
+  const params = query.split("&").filter((p) => p && !replaced.has(decodeKey(p))).concat(add.map(([k, v]) => `${k}=${encodeURIComponent(String(v))}`));
+  return `${path}${params.length ? `?${params.join("&")}` : ""}${hash}`;
+}
+
+// src/icons.jsx
+import { createElement, isValidElement } from "react";
+import { Fragment as Fragment2, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var base = {
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: 2,
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  "aria-hidden": "true",
+  focusable: "false"
+};
+var make = (paths) => function Icon({ size = 16, className = "dt-lp-icon" }) {
+  return /* @__PURE__ */ jsx2("svg", { ...base, width: size, height: size, className, children: paths });
+};
+var ArrowRight = make(/* @__PURE__ */ jsx2("path", { d: "M5 12h14M13 6l6 6-6 6" }));
+var ChevronRight = make(/* @__PURE__ */ jsx2("path", { d: "m9 6 6 6-6 6" }));
+var Check = make(/* @__PURE__ */ jsx2("path", { d: "M20 6 9 17l-5-5" }));
+var Help = make(
+  /* @__PURE__ */ jsxs2(Fragment2, { children: [
+    /* @__PURE__ */ jsx2("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsx2("path", { d: "M9.1 9a3 3 0 0 1 5.8 1c0 2-3 3-3 3M12 17h.01" })
+  ] })
+);
+var Alert = make(
+  /* @__PURE__ */ jsxs2(Fragment2, { children: [
+    /* @__PURE__ */ jsx2("path", { d: "M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0Z" }),
+    /* @__PURE__ */ jsx2("path", { d: "M12 9v4M12 17h.01" })
+  ] })
+);
+var MenuIcon = make(/* @__PURE__ */ jsx2("path", { d: "M4 6h16M4 12h16M4 18h16" }));
+var Close = make(/* @__PURE__ */ jsx2("path", { d: "M18 6 6 18M6 6l12 12" }));
+var Calendar = make(
+  /* @__PURE__ */ jsxs2(Fragment2, { children: [
+    /* @__PURE__ */ jsx2("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2" }),
+    /* @__PURE__ */ jsx2("path", { d: "M16 2v4M8 2v4M3 10h18m-12 6 2 2 4-4" })
+  ] })
+);
+
+// src/DreamtreeSso.jsx
+import { Fragment as Fragment3, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var DEFAULT_SSO_LABEL = "Continue with Dreamtree";
+function DreamtreeSso({ provider, children }) {
+  const { startUrl, mode, label = DEFAULT_SSO_LABEL, companySlug, returnTo } = provider;
+  const isSso = mode === "sso";
+  const autoRedirect = isSso && provider.autoRedirect !== false;
+  const href = buildSsoUrl(startUrl, { returnTo, companySlug });
+  const redirected = useRef2(false);
+  useEffect2(() => {
+    if (!autoRedirect || redirected.current) return;
+    redirected.current = true;
+    window.location.assign(href);
+  }, [autoRedirect, href]);
+  const button = /* @__PURE__ */ jsxs3("a", { className: "dt-auth-sso-btn", href, children: [
+    /* @__PURE__ */ jsx3("span", { children: label }),
+    /* @__PURE__ */ jsx3(ArrowRight, { size: 16, className: "dt-auth-sso-icon" })
+  ] });
+  if (isSso) {
+    return /* @__PURE__ */ jsxs3("div", { className: "dt-auth-sso dt-auth-sso--only", children: [
+      autoRedirect ? /* @__PURE__ */ jsxs3("p", { className: "dt-auth-sso-status", role: "status", "aria-live": "polite", children: [
+        /* @__PURE__ */ jsx3("span", { className: "dt-auth-sso-spinner", "aria-hidden": "true" }),
+        "Redirecting to Dreamtree ID\u2026"
+      ] }) : null,
+      button
+    ] });
+  }
+  return /* @__PURE__ */ jsxs3(Fragment3, { children: [
+    /* @__PURE__ */ jsx3("div", { className: "dt-auth-sso", children: button }),
+    /* @__PURE__ */ jsx3("div", { className: "dt-auth-or", children: /* @__PURE__ */ jsx3("span", { children: "or" }) }),
+    children
+  ] });
+}
+
 // src/useTapReveal.js
-import { useCallback, useRef as useRef2, useState as useState2 } from "react";
+import { useCallback, useRef as useRef3, useState as useState2 } from "react";
 function useTapReveal({ taps = 4, windowMs = 1500 } = {}) {
   const [revealed, setRevealed] = useState2(false);
-  const count = useRef2(0);
-  const last = useRef2(0);
+  const count = useRef3(0);
+  const last = useRef3(0);
   const onClick = useCallback(() => {
     if (revealed) return;
     const now = Date.now();
@@ -104,7 +207,7 @@ function useTapReveal({ taps = 4, windowMs = 1500 } = {}) {
 }
 
 // src/AuthShell.jsx
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 var DEFAULT_LEGAL = [
   { label: "Privacy Policy", href: "/privacy" },
   { label: "Terms", href: "/terms" },
@@ -112,10 +215,10 @@ var DEFAULT_LEGAL = [
 ];
 function BrandMark({ brand, size }) {
   if (brand.logoSrc) {
-    return /* @__PURE__ */ jsx2("img", { className: "dt-auth-mark-img", src: brand.logoSrc, alt: "", width: size, height: size });
+    return /* @__PURE__ */ jsx4("img", { className: "dt-auth-mark-img", src: brand.logoSrc, alt: "", width: size, height: size });
   }
-  if (brand.mark) return /* @__PURE__ */ jsx2("span", { className: "dt-auth-mark-node", children: brand.mark });
-  return /* @__PURE__ */ jsx2("span", { className: "dt-auth-monogram", style: { width: size, height: size }, "aria-hidden": "true", children: brand.name.charAt(0) });
+  if (brand.mark) return /* @__PURE__ */ jsx4("span", { className: "dt-auth-mark-node", children: brand.mark });
+  return /* @__PURE__ */ jsx4("span", { className: "dt-auth-monogram", style: { width: size, height: size }, "aria-hidden": "true", children: brand.name.charAt(0) });
 }
 function brandStyle(brand) {
   return {
@@ -134,7 +237,8 @@ function AuthShell({
   legalLinks = DEFAULT_LEGAL,
   linkComponent: LinkComponent,
   className = "",
-  demoAccounts
+  demoAccounts,
+  ssoProvider
 }) {
   var _a, _b;
   const headingId = useId();
@@ -142,44 +246,44 @@ function AuthShell({
   const isPlatform = variant === "platform";
   const headline = isPlatform ? brand.platformHeadline || "Platform administration" : brand.headline;
   const pitch = isPlatform ? brand.platformPitch || `Super administrator console for ${brand.name}. Every action here is audited.` : brand.pitch;
-  const renderLink = (l) => LinkComponent ? /* @__PURE__ */ jsx2(LinkComponent, { to: l.href, href: l.href, className: "dt-auth-legal-link", children: l.label }, l.href) : /* @__PURE__ */ jsx2("a", { href: l.href, className: "dt-auth-legal-link", children: l.label }, l.href);
-  return /* @__PURE__ */ jsxs2(
+  const renderLink = (l) => LinkComponent ? /* @__PURE__ */ jsx4(LinkComponent, { to: l.href, href: l.href, className: "dt-auth-legal-link", children: l.label }, l.href) : /* @__PURE__ */ jsx4("a", { href: l.href, className: "dt-auth-legal-link", children: l.label }, l.href);
+  return /* @__PURE__ */ jsxs4(
     "div",
     {
       className: `dt-auth ${isPlatform ? "dt-auth--platform" : ""} ${className}`,
       style: brandStyle(brand),
       "data-product": brand.id,
       children: [
-        /* @__PURE__ */ jsxs2("aside", { className: "dt-auth-panel", children: [
-          /* @__PURE__ */ jsxs2("a", { href: "/", className: "dt-auth-brand", children: [
-            /* @__PURE__ */ jsx2(BrandMark, { brand, size: 28 }),
-            /* @__PURE__ */ jsx2("span", { className: "dt-auth-brand-name", children: brand.name }),
-            isPlatform ? /* @__PURE__ */ jsx2("span", { className: "dt-auth-badge", children: "Platform" }) : null
+        /* @__PURE__ */ jsxs4("aside", { className: "dt-auth-panel", children: [
+          /* @__PURE__ */ jsxs4("a", { href: "/", className: "dt-auth-brand", children: [
+            /* @__PURE__ */ jsx4(BrandMark, { brand, size: 28 }),
+            /* @__PURE__ */ jsx4("span", { className: "dt-auth-brand-name", children: brand.name }),
+            isPlatform ? /* @__PURE__ */ jsx4("span", { className: "dt-auth-badge", children: "Platform" }) : null
           ] }),
-          /* @__PURE__ */ jsxs2("div", { className: "dt-auth-pitch", children: [
-            /* @__PURE__ */ jsx2("h2", { children: headline }),
-            pitch ? /* @__PURE__ */ jsx2("p", { children: pitch }) : null,
-            !isPlatform && ((_b = brand.points) == null ? void 0 : _b.length) ? /* @__PURE__ */ jsx2("ul", { children: brand.points.map((p) => /* @__PURE__ */ jsx2("li", { children: p }, p)) }) : null
+          /* @__PURE__ */ jsxs4("div", { className: "dt-auth-pitch", children: [
+            /* @__PURE__ */ jsx4("h2", { children: headline }),
+            pitch ? /* @__PURE__ */ jsx4("p", { children: pitch }) : null,
+            !isPlatform && ((_b = brand.points) == null ? void 0 : _b.length) ? /* @__PURE__ */ jsx4("ul", { children: brand.points.map((p) => /* @__PURE__ */ jsx4("li", { children: p }, p)) }) : null
           ] }),
-          /* @__PURE__ */ jsx2("p", { className: "dt-auth-panel-foot", children: brand.category || "by Dreamtree-Org" })
+          /* @__PURE__ */ jsx4("p", { className: "dt-auth-panel-foot", children: brand.category || "by Dreamtree-Org" })
         ] }),
-        /* @__PURE__ */ jsx2("main", { className: "dt-auth-main", children: /* @__PURE__ */ jsxs2("div", { className: "dt-auth-column", children: [
-          /* @__PURE__ */ jsxs2("a", { href: "/", className: "dt-auth-brand dt-auth-brand--mobile", children: [
-            /* @__PURE__ */ jsx2(BrandMark, { brand, size: 24 }),
-            /* @__PURE__ */ jsx2("span", { className: "dt-auth-brand-name", children: brand.name }),
-            isPlatform ? /* @__PURE__ */ jsx2("span", { className: "dt-auth-badge", children: "Platform" }) : null
+        /* @__PURE__ */ jsx4("main", { className: "dt-auth-main", children: /* @__PURE__ */ jsxs4("div", { className: "dt-auth-column", children: [
+          /* @__PURE__ */ jsxs4("a", { href: "/", className: "dt-auth-brand dt-auth-brand--mobile", children: [
+            /* @__PURE__ */ jsx4(BrandMark, { brand, size: 24 }),
+            /* @__PURE__ */ jsx4("span", { className: "dt-auth-brand-name", children: brand.name }),
+            isPlatform ? /* @__PURE__ */ jsx4("span", { className: "dt-auth-badge", children: "Platform" }) : null
           ] }),
-          /* @__PURE__ */ jsxs2("section", { className: "dt-auth-card", "aria-labelledby": headingId, children: [
-            /* @__PURE__ */ jsxs2("header", { className: "dt-auth-head", children: [
-              /* @__PURE__ */ jsx2("h1", { id: headingId, ...demoAccounts ? tapProps : {}, children: title }),
-              subtitle ? /* @__PURE__ */ jsx2("p", { children: subtitle }) : null
+          /* @__PURE__ */ jsxs4("section", { className: "dt-auth-card", "aria-labelledby": headingId, children: [
+            /* @__PURE__ */ jsxs4("header", { className: "dt-auth-head", children: [
+              /* @__PURE__ */ jsx4("h1", { id: headingId, ...demoAccounts ? tapProps : {}, children: title }),
+              subtitle ? /* @__PURE__ */ jsx4("p", { children: subtitle }) : null
             ] }),
-            children,
-            demoAccounts && revealed ? /* @__PURE__ */ jsx2(DemoAccounts, { load: demoAccounts.load, onSelect: demoAccounts.onSelect }) : null
+            ssoProvider ? /* @__PURE__ */ jsx4(DreamtreeSso, { provider: ssoProvider, children }) : children,
+            demoAccounts && revealed && (ssoProvider == null ? void 0 : ssoProvider.mode) !== "sso" ? /* @__PURE__ */ jsx4(DemoAccounts, { load: demoAccounts.load, onSelect: demoAccounts.onSelect }) : null
           ] }),
-          footer ? /* @__PURE__ */ jsx2("div", { className: "dt-auth-footer", children: footer }) : null,
-          (legalLinks == null ? void 0 : legalLinks.length) ? /* @__PURE__ */ jsx2("nav", { className: "dt-auth-legal", "aria-label": "Legal", children: legalLinks.map((l, i) => /* @__PURE__ */ jsxs2("span", { className: "dt-auth-legal-item", children: [
-            i > 0 ? /* @__PURE__ */ jsx2("span", { "aria-hidden": "true", children: "\xB7" }) : null,
+          footer ? /* @__PURE__ */ jsx4("div", { className: "dt-auth-footer", children: footer }) : null,
+          (legalLinks == null ? void 0 : legalLinks.length) ? /* @__PURE__ */ jsx4("nav", { className: "dt-auth-legal", "aria-label": "Legal", children: legalLinks.map((l, i) => /* @__PURE__ */ jsxs4("span", { className: "dt-auth-legal-item", children: [
+            i > 0 ? /* @__PURE__ */ jsx4("span", { "aria-hidden": "true", children: "\xB7" }) : null,
             renderLink(l)
           ] }, l.href)) }) : null
         ] }) })
@@ -345,6 +449,7 @@ export {
   DemoAccounts,
   brandStyle,
   brands,
+  buildSsoUrl,
   fetchDemoAccounts,
   getBrand,
   normalizeDemoAccounts,