@dreamtree-org/landing-kit 0.9.0 → 0.10.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/MIGRATION.md +16 -0
- package/PLATFORM-API.md +17 -13
- package/README.md +41 -1
- package/ai-skills/landing-kit.md +7 -6
- package/auth.css +57 -0
- package/auth.d.ts +2 -2
- package/dist/auth.cjs +143 -38
- package/dist/auth.js +139 -34
- package/dist/index.cjs +605 -540
- package/dist/index.js +573 -508
- package/dist/platform.cjs +1208 -408
- package/dist/platform.js +1209 -409
- package/index.d.ts +25 -0
- package/package.json +3 -2
- package/platform.d.ts +37 -3
- package/styles.css +57 -0
package/dist/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
|
|
3
3
|
// src/LandingPage.jsx
|
|
4
|
-
import { Fragment as
|
|
4
|
+
import { Fragment as Fragment6, cloneElement, isValidElement as isValidElement2 } from "react";
|
|
5
5
|
|
|
6
6
|
// src/AuthShell.jsx
|
|
7
7
|
import { useId } from "react";
|
|
@@ -90,12 +90,120 @@ function DemoAccounts({ load, onSelect, className = "" }) {
|
|
|
90
90
|
] });
|
|
91
91
|
}
|
|
92
92
|
|
|
93
|
+
// src/DreamtreeSso.jsx
|
|
94
|
+
import { useEffect as useEffect2, useRef as useRef2 } from "react";
|
|
95
|
+
|
|
96
|
+
// src/sso.js
|
|
97
|
+
function decodeKey(part) {
|
|
98
|
+
const key = part.split("=")[0];
|
|
99
|
+
try {
|
|
100
|
+
return decodeURIComponent(key.replace(/\+/g, " "));
|
|
101
|
+
} catch {
|
|
102
|
+
return key;
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
function buildSsoUrl(startUrl, { returnTo, companySlug } = {}) {
|
|
106
|
+
const raw = String(startUrl != null ? startUrl : "");
|
|
107
|
+
const hashAt = raw.indexOf("#");
|
|
108
|
+
const hash = hashAt === -1 ? "" : raw.slice(hashAt);
|
|
109
|
+
const beforeHash = hashAt === -1 ? raw : raw.slice(0, hashAt);
|
|
110
|
+
const queryAt = beforeHash.indexOf("?");
|
|
111
|
+
const path = queryAt === -1 ? beforeHash : beforeHash.slice(0, queryAt);
|
|
112
|
+
const query = queryAt === -1 ? "" : beforeHash.slice(queryAt + 1);
|
|
113
|
+
const add = [
|
|
114
|
+
["return_to", returnTo],
|
|
115
|
+
["dt_company", companySlug]
|
|
116
|
+
].filter(([, v]) => v != null && v !== "");
|
|
117
|
+
const replaced = new Set(add.map(([k]) => k));
|
|
118
|
+
const params = query.split("&").filter((p) => p && !replaced.has(decodeKey(p))).concat(add.map(([k, v]) => `${k}=${encodeURIComponent(String(v))}`));
|
|
119
|
+
return `${path}${params.length ? `?${params.join("&")}` : ""}${hash}`;
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
// src/icons.jsx
|
|
123
|
+
import { createElement, isValidElement } from "react";
|
|
124
|
+
import { Fragment as Fragment2, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
125
|
+
var base = {
|
|
126
|
+
viewBox: "0 0 24 24",
|
|
127
|
+
fill: "none",
|
|
128
|
+
stroke: "currentColor",
|
|
129
|
+
strokeWidth: 2,
|
|
130
|
+
strokeLinecap: "round",
|
|
131
|
+
strokeLinejoin: "round",
|
|
132
|
+
"aria-hidden": "true",
|
|
133
|
+
focusable: "false"
|
|
134
|
+
};
|
|
135
|
+
var make = (paths) => function Icon({ size = 16, className = "dt-lp-icon" }) {
|
|
136
|
+
return /* @__PURE__ */ jsx2("svg", { ...base, width: size, height: size, className, children: paths });
|
|
137
|
+
};
|
|
138
|
+
var ArrowRight = make(/* @__PURE__ */ jsx2("path", { d: "M5 12h14M13 6l6 6-6 6" }));
|
|
139
|
+
var ChevronRight = make(/* @__PURE__ */ jsx2("path", { d: "m9 6 6 6-6 6" }));
|
|
140
|
+
var Check = make(/* @__PURE__ */ jsx2("path", { d: "M20 6 9 17l-5-5" }));
|
|
141
|
+
var Help = make(
|
|
142
|
+
/* @__PURE__ */ jsxs2(Fragment2, { children: [
|
|
143
|
+
/* @__PURE__ */ jsx2("circle", { cx: "12", cy: "12", r: "10" }),
|
|
144
|
+
/* @__PURE__ */ jsx2("path", { d: "M9.1 9a3 3 0 0 1 5.8 1c0 2-3 3-3 3M12 17h.01" })
|
|
145
|
+
] })
|
|
146
|
+
);
|
|
147
|
+
var Alert = make(
|
|
148
|
+
/* @__PURE__ */ jsxs2(Fragment2, { children: [
|
|
149
|
+
/* @__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" }),
|
|
150
|
+
/* @__PURE__ */ jsx2("path", { d: "M12 9v4M12 17h.01" })
|
|
151
|
+
] })
|
|
152
|
+
);
|
|
153
|
+
var MenuIcon = make(/* @__PURE__ */ jsx2("path", { d: "M4 6h16M4 12h16M4 18h16" }));
|
|
154
|
+
var Close = make(/* @__PURE__ */ jsx2("path", { d: "M18 6 6 18M6 6l12 12" }));
|
|
155
|
+
var Calendar = make(
|
|
156
|
+
/* @__PURE__ */ jsxs2(Fragment2, { children: [
|
|
157
|
+
/* @__PURE__ */ jsx2("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2" }),
|
|
158
|
+
/* @__PURE__ */ jsx2("path", { d: "M16 2v4M8 2v4M3 10h18m-12 6 2 2 4-4" })
|
|
159
|
+
] })
|
|
160
|
+
);
|
|
161
|
+
function renderIcon(icon, size = 20, className = "dt-lp-icon") {
|
|
162
|
+
if (!icon) return null;
|
|
163
|
+
if (isValidElement(icon)) return icon;
|
|
164
|
+
return createElement(icon, { size, "aria-hidden": true, className, strokeWidth: 1.8 });
|
|
165
|
+
}
|
|
166
|
+
|
|
167
|
+
// src/DreamtreeSso.jsx
|
|
168
|
+
import { Fragment as Fragment3, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
169
|
+
var DEFAULT_SSO_LABEL = "Continue with Dreamtree";
|
|
170
|
+
function DreamtreeSso({ provider, children }) {
|
|
171
|
+
const { startUrl, mode, label = DEFAULT_SSO_LABEL, companySlug, returnTo } = provider;
|
|
172
|
+
const isSso = mode === "sso";
|
|
173
|
+
const autoRedirect = isSso && provider.autoRedirect !== false;
|
|
174
|
+
const href = buildSsoUrl(startUrl, { returnTo, companySlug });
|
|
175
|
+
const redirected = useRef2(false);
|
|
176
|
+
useEffect2(() => {
|
|
177
|
+
if (!autoRedirect || redirected.current) return;
|
|
178
|
+
redirected.current = true;
|
|
179
|
+
window.location.assign(href);
|
|
180
|
+
}, [autoRedirect, href]);
|
|
181
|
+
const button = /* @__PURE__ */ jsxs3("a", { className: "dt-auth-sso-btn", href, children: [
|
|
182
|
+
/* @__PURE__ */ jsx3("span", { children: label }),
|
|
183
|
+
/* @__PURE__ */ jsx3(ArrowRight, { size: 16, className: "dt-auth-sso-icon" })
|
|
184
|
+
] });
|
|
185
|
+
if (isSso) {
|
|
186
|
+
return /* @__PURE__ */ jsxs3("div", { className: "dt-auth-sso dt-auth-sso--only", children: [
|
|
187
|
+
autoRedirect ? /* @__PURE__ */ jsxs3("p", { className: "dt-auth-sso-status", role: "status", "aria-live": "polite", children: [
|
|
188
|
+
/* @__PURE__ */ jsx3("span", { className: "dt-auth-sso-spinner", "aria-hidden": "true" }),
|
|
189
|
+
"Redirecting to Dreamtree ID\u2026"
|
|
190
|
+
] }) : null,
|
|
191
|
+
button
|
|
192
|
+
] });
|
|
193
|
+
}
|
|
194
|
+
return /* @__PURE__ */ jsxs3(Fragment3, { children: [
|
|
195
|
+
/* @__PURE__ */ jsx3("div", { className: "dt-auth-sso", children: button }),
|
|
196
|
+
/* @__PURE__ */ jsx3("div", { className: "dt-auth-or", children: /* @__PURE__ */ jsx3("span", { children: "or" }) }),
|
|
197
|
+
children
|
|
198
|
+
] });
|
|
199
|
+
}
|
|
200
|
+
|
|
93
201
|
// src/useTapReveal.js
|
|
94
|
-
import { useCallback, useRef as
|
|
202
|
+
import { useCallback, useRef as useRef3, useState as useState2 } from "react";
|
|
95
203
|
function useTapReveal({ taps = 4, windowMs = 1500 } = {}) {
|
|
96
204
|
const [revealed, setRevealed] = useState2(false);
|
|
97
|
-
const count =
|
|
98
|
-
const last =
|
|
205
|
+
const count = useRef3(0);
|
|
206
|
+
const last = useRef3(0);
|
|
99
207
|
const onClick = useCallback(() => {
|
|
100
208
|
if (revealed) return;
|
|
101
209
|
const now = Date.now();
|
|
@@ -107,7 +215,7 @@ function useTapReveal({ taps = 4, windowMs = 1500 } = {}) {
|
|
|
107
215
|
}
|
|
108
216
|
|
|
109
217
|
// src/AuthShell.jsx
|
|
110
|
-
import { jsx as
|
|
218
|
+
import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
111
219
|
var DEFAULT_LEGAL = [
|
|
112
220
|
{ label: "Privacy Policy", href: "/privacy" },
|
|
113
221
|
{ label: "Terms", href: "/terms" },
|
|
@@ -115,10 +223,10 @@ var DEFAULT_LEGAL = [
|
|
|
115
223
|
];
|
|
116
224
|
function BrandMark({ brand, size }) {
|
|
117
225
|
if (brand.logoSrc) {
|
|
118
|
-
return /* @__PURE__ */
|
|
226
|
+
return /* @__PURE__ */ jsx4("img", { className: "dt-auth-mark-img", src: brand.logoSrc, alt: "", width: size, height: size });
|
|
119
227
|
}
|
|
120
|
-
if (brand.mark) return /* @__PURE__ */
|
|
121
|
-
return /* @__PURE__ */
|
|
228
|
+
if (brand.mark) return /* @__PURE__ */ jsx4("span", { className: "dt-auth-mark-node", children: brand.mark });
|
|
229
|
+
return /* @__PURE__ */ jsx4("span", { className: "dt-auth-monogram", style: { width: size, height: size }, "aria-hidden": "true", children: brand.name.charAt(0) });
|
|
122
230
|
}
|
|
123
231
|
function brandStyle(brand) {
|
|
124
232
|
return {
|
|
@@ -137,7 +245,8 @@ function AuthShell({
|
|
|
137
245
|
legalLinks = DEFAULT_LEGAL,
|
|
138
246
|
linkComponent: LinkComponent,
|
|
139
247
|
className = "",
|
|
140
|
-
demoAccounts
|
|
248
|
+
demoAccounts,
|
|
249
|
+
ssoProvider
|
|
141
250
|
}) {
|
|
142
251
|
var _a, _b;
|
|
143
252
|
const headingId = useId();
|
|
@@ -145,44 +254,44 @@ function AuthShell({
|
|
|
145
254
|
const isPlatform = variant === "platform";
|
|
146
255
|
const headline = isPlatform ? brand.platformHeadline || "Platform administration" : brand.headline;
|
|
147
256
|
const pitch = isPlatform ? brand.platformPitch || `Super administrator console for ${brand.name}. Every action here is audited.` : brand.pitch;
|
|
148
|
-
const renderLink = (l) => LinkComponent ? /* @__PURE__ */
|
|
149
|
-
return /* @__PURE__ */
|
|
257
|
+
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);
|
|
258
|
+
return /* @__PURE__ */ jsxs4(
|
|
150
259
|
"div",
|
|
151
260
|
{
|
|
152
261
|
className: `dt-auth ${isPlatform ? "dt-auth--platform" : ""} ${className}`,
|
|
153
262
|
style: brandStyle(brand),
|
|
154
263
|
"data-product": brand.id,
|
|
155
264
|
children: [
|
|
156
|
-
/* @__PURE__ */
|
|
157
|
-
/* @__PURE__ */
|
|
158
|
-
/* @__PURE__ */
|
|
159
|
-
/* @__PURE__ */
|
|
160
|
-
isPlatform ? /* @__PURE__ */
|
|
265
|
+
/* @__PURE__ */ jsxs4("aside", { className: "dt-auth-panel", children: [
|
|
266
|
+
/* @__PURE__ */ jsxs4("a", { href: "/", className: "dt-auth-brand", children: [
|
|
267
|
+
/* @__PURE__ */ jsx4(BrandMark, { brand, size: 28 }),
|
|
268
|
+
/* @__PURE__ */ jsx4("span", { className: "dt-auth-brand-name", children: brand.name }),
|
|
269
|
+
isPlatform ? /* @__PURE__ */ jsx4("span", { className: "dt-auth-badge", children: "Platform" }) : null
|
|
161
270
|
] }),
|
|
162
|
-
/* @__PURE__ */
|
|
163
|
-
/* @__PURE__ */
|
|
164
|
-
pitch ? /* @__PURE__ */
|
|
165
|
-
!isPlatform && ((_b = brand.points) == null ? void 0 : _b.length) ? /* @__PURE__ */
|
|
271
|
+
/* @__PURE__ */ jsxs4("div", { className: "dt-auth-pitch", children: [
|
|
272
|
+
/* @__PURE__ */ jsx4("h2", { children: headline }),
|
|
273
|
+
pitch ? /* @__PURE__ */ jsx4("p", { children: pitch }) : null,
|
|
274
|
+
!isPlatform && ((_b = brand.points) == null ? void 0 : _b.length) ? /* @__PURE__ */ jsx4("ul", { children: brand.points.map((p) => /* @__PURE__ */ jsx4("li", { children: p }, p)) }) : null
|
|
166
275
|
] }),
|
|
167
|
-
/* @__PURE__ */
|
|
276
|
+
/* @__PURE__ */ jsx4("p", { className: "dt-auth-panel-foot", children: brand.category || "by Dreamtree-Org" })
|
|
168
277
|
] }),
|
|
169
|
-
/* @__PURE__ */
|
|
170
|
-
/* @__PURE__ */
|
|
171
|
-
/* @__PURE__ */
|
|
172
|
-
/* @__PURE__ */
|
|
173
|
-
isPlatform ? /* @__PURE__ */
|
|
278
|
+
/* @__PURE__ */ jsx4("main", { className: "dt-auth-main", children: /* @__PURE__ */ jsxs4("div", { className: "dt-auth-column", children: [
|
|
279
|
+
/* @__PURE__ */ jsxs4("a", { href: "/", className: "dt-auth-brand dt-auth-brand--mobile", children: [
|
|
280
|
+
/* @__PURE__ */ jsx4(BrandMark, { brand, size: 24 }),
|
|
281
|
+
/* @__PURE__ */ jsx4("span", { className: "dt-auth-brand-name", children: brand.name }),
|
|
282
|
+
isPlatform ? /* @__PURE__ */ jsx4("span", { className: "dt-auth-badge", children: "Platform" }) : null
|
|
174
283
|
] }),
|
|
175
|
-
/* @__PURE__ */
|
|
176
|
-
/* @__PURE__ */
|
|
177
|
-
/* @__PURE__ */
|
|
178
|
-
subtitle ? /* @__PURE__ */
|
|
284
|
+
/* @__PURE__ */ jsxs4("section", { className: "dt-auth-card", "aria-labelledby": headingId, children: [
|
|
285
|
+
/* @__PURE__ */ jsxs4("header", { className: "dt-auth-head", children: [
|
|
286
|
+
/* @__PURE__ */ jsx4("h1", { id: headingId, ...demoAccounts ? tapProps : {}, children: title2 }),
|
|
287
|
+
subtitle ? /* @__PURE__ */ jsx4("p", { children: subtitle }) : null
|
|
179
288
|
] }),
|
|
180
|
-
children,
|
|
181
|
-
demoAccounts && revealed ? /* @__PURE__ */
|
|
289
|
+
ssoProvider ? /* @__PURE__ */ jsx4(DreamtreeSso, { provider: ssoProvider, children }) : children,
|
|
290
|
+
demoAccounts && revealed && (ssoProvider == null ? void 0 : ssoProvider.mode) !== "sso" ? /* @__PURE__ */ jsx4(DemoAccounts, { load: demoAccounts.load, onSelect: demoAccounts.onSelect }) : null
|
|
182
291
|
] }),
|
|
183
|
-
footer ? /* @__PURE__ */
|
|
184
|
-
(legalLinks == null ? void 0 : legalLinks.length) ? /* @__PURE__ */
|
|
185
|
-
i > 0 ? /* @__PURE__ */
|
|
292
|
+
footer ? /* @__PURE__ */ jsx4("div", { className: "dt-auth-footer", children: footer }) : null,
|
|
293
|
+
(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: [
|
|
294
|
+
i > 0 ? /* @__PURE__ */ jsx4("span", { "aria-hidden": "true", children: "\xB7" }) : null,
|
|
186
295
|
renderLink(l)
|
|
187
296
|
] }, l.href)) }) : null
|
|
188
297
|
] }) })
|
|
@@ -193,7 +302,7 @@ function AuthShell({
|
|
|
193
302
|
|
|
194
303
|
// src/context.jsx
|
|
195
304
|
import { createContext, useContext } from "react";
|
|
196
|
-
import { jsx as
|
|
305
|
+
import { jsx as jsx5 } from "react/jsx-runtime";
|
|
197
306
|
var LandingContext = createContext({ brand: null, linkComponent: null, onBookDemo: null, home: true });
|
|
198
307
|
var LandingProvider = LandingContext.Provider;
|
|
199
308
|
var useLanding = () => useContext(LandingContext);
|
|
@@ -206,95 +315,50 @@ function SmartLink({ href, children, className, reload, ...rest }) {
|
|
|
206
315
|
const to = resolveHref(href, home);
|
|
207
316
|
const internal = to && to.startsWith("/") && !to.startsWith("//") && !to.includes("#");
|
|
208
317
|
if (Link && internal && !reload) {
|
|
209
|
-
return /* @__PURE__ */
|
|
318
|
+
return /* @__PURE__ */ jsx5(Link, { to, href: to, className, ...rest, children });
|
|
210
319
|
}
|
|
211
|
-
return /* @__PURE__ */
|
|
320
|
+
return /* @__PURE__ */ jsx5("a", { href: to, className, ...rest, children });
|
|
212
321
|
}
|
|
213
322
|
|
|
214
323
|
// src/Header.jsx
|
|
215
324
|
import { useState as useState3 } from "react";
|
|
216
325
|
|
|
217
|
-
// src/icons.jsx
|
|
218
|
-
import { createElement, isValidElement } from "react";
|
|
219
|
-
import { Fragment as Fragment2, jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
220
|
-
var base = {
|
|
221
|
-
viewBox: "0 0 24 24",
|
|
222
|
-
fill: "none",
|
|
223
|
-
stroke: "currentColor",
|
|
224
|
-
strokeWidth: 2,
|
|
225
|
-
strokeLinecap: "round",
|
|
226
|
-
strokeLinejoin: "round",
|
|
227
|
-
"aria-hidden": "true",
|
|
228
|
-
focusable: "false"
|
|
229
|
-
};
|
|
230
|
-
var make = (paths) => function Icon({ size = 16, className = "dt-lp-icon" }) {
|
|
231
|
-
return /* @__PURE__ */ jsx4("svg", { ...base, width: size, height: size, className, children: paths });
|
|
232
|
-
};
|
|
233
|
-
var ArrowRight = make(/* @__PURE__ */ jsx4("path", { d: "M5 12h14M13 6l6 6-6 6" }));
|
|
234
|
-
var ChevronRight = make(/* @__PURE__ */ jsx4("path", { d: "m9 6 6 6-6 6" }));
|
|
235
|
-
var Check = make(/* @__PURE__ */ jsx4("path", { d: "M20 6 9 17l-5-5" }));
|
|
236
|
-
var Help = make(
|
|
237
|
-
/* @__PURE__ */ jsxs3(Fragment2, { children: [
|
|
238
|
-
/* @__PURE__ */ jsx4("circle", { cx: "12", cy: "12", r: "10" }),
|
|
239
|
-
/* @__PURE__ */ jsx4("path", { d: "M9.1 9a3 3 0 0 1 5.8 1c0 2-3 3-3 3M12 17h.01" })
|
|
240
|
-
] })
|
|
241
|
-
);
|
|
242
|
-
var Alert = make(
|
|
243
|
-
/* @__PURE__ */ jsxs3(Fragment2, { children: [
|
|
244
|
-
/* @__PURE__ */ jsx4("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" }),
|
|
245
|
-
/* @__PURE__ */ jsx4("path", { d: "M12 9v4M12 17h.01" })
|
|
246
|
-
] })
|
|
247
|
-
);
|
|
248
|
-
var MenuIcon = make(/* @__PURE__ */ jsx4("path", { d: "M4 6h16M4 12h16M4 18h16" }));
|
|
249
|
-
var Close = make(/* @__PURE__ */ jsx4("path", { d: "M18 6 6 18M6 6l12 12" }));
|
|
250
|
-
var Calendar = make(
|
|
251
|
-
/* @__PURE__ */ jsxs3(Fragment2, { children: [
|
|
252
|
-
/* @__PURE__ */ jsx4("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2" }),
|
|
253
|
-
/* @__PURE__ */ jsx4("path", { d: "M16 2v4M8 2v4M3 10h18m-12 6 2 2 4-4" })
|
|
254
|
-
] })
|
|
255
|
-
);
|
|
256
|
-
function renderIcon(icon, size = 20, className = "dt-lp-icon") {
|
|
257
|
-
if (!icon) return null;
|
|
258
|
-
if (isValidElement(icon)) return icon;
|
|
259
|
-
return createElement(icon, { size, "aria-hidden": true, className, strokeWidth: 1.8 });
|
|
260
|
-
}
|
|
261
|
-
|
|
262
326
|
// src/Brand.jsx
|
|
263
|
-
import { jsx as
|
|
327
|
+
import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
264
328
|
function BrandMark2({ brand, size = 36 }) {
|
|
265
329
|
if (brand.logoSrc) {
|
|
266
|
-
return /* @__PURE__ */
|
|
330
|
+
return /* @__PURE__ */ jsx6("img", { className: "dt-lp-mark-img", src: brand.logoSrc, alt: "", width: size, height: size });
|
|
267
331
|
}
|
|
268
|
-
if (brand.mark) return /* @__PURE__ */
|
|
269
|
-
return /* @__PURE__ */
|
|
332
|
+
if (brand.mark) return /* @__PURE__ */ jsx6("span", { className: "dt-lp-mark-node", "aria-hidden": "true", children: brand.mark });
|
|
333
|
+
return /* @__PURE__ */ jsx6("span", { className: "dt-lp-monogram", style: { width: size, height: size }, "aria-hidden": "true", children: brand.name.charAt(0) });
|
|
270
334
|
}
|
|
271
335
|
function Wordmark({ name }) {
|
|
272
336
|
const m = /^(.+?)(Pro)$/.exec(name);
|
|
273
|
-
if (!m) return /* @__PURE__ */
|
|
274
|
-
return /* @__PURE__ */
|
|
337
|
+
if (!m) return /* @__PURE__ */ jsx6("span", { className: "dt-lp-wordmark", children: name });
|
|
338
|
+
return /* @__PURE__ */ jsxs5("span", { className: "dt-lp-wordmark", children: [
|
|
275
339
|
m[1],
|
|
276
|
-
/* @__PURE__ */
|
|
340
|
+
/* @__PURE__ */ jsx6("span", { className: "dt-lp-wordmark-hi", children: m[2] })
|
|
277
341
|
] });
|
|
278
342
|
}
|
|
279
343
|
function BrandLockup({ brand: own2, byline = "by Dreamtree-Org", href = "/" }) {
|
|
280
344
|
const ctx = useLanding();
|
|
281
345
|
const brand = own2 || ctx.brand;
|
|
282
346
|
if (!brand) return null;
|
|
283
|
-
return /* @__PURE__ */
|
|
284
|
-
/* @__PURE__ */
|
|
285
|
-
/* @__PURE__ */
|
|
286
|
-
/* @__PURE__ */
|
|
287
|
-
byline ? /* @__PURE__ */
|
|
347
|
+
return /* @__PURE__ */ jsxs5("a", { href, className: "dt-lp-brand", "aria-label": `${brand.name}${byline ? ` ${byline}` : ""}, home`, children: [
|
|
348
|
+
/* @__PURE__ */ jsx6(BrandMark2, { brand }),
|
|
349
|
+
/* @__PURE__ */ jsxs5("span", { className: "dt-lp-brand-text", "aria-hidden": "true", children: [
|
|
350
|
+
/* @__PURE__ */ jsx6(Wordmark, { name: brand.name }),
|
|
351
|
+
byline ? /* @__PURE__ */ jsx6("span", { className: "dt-lp-byline", children: byline }) : null
|
|
288
352
|
] })
|
|
289
353
|
] });
|
|
290
354
|
}
|
|
291
355
|
|
|
292
356
|
// src/BookDemoButton.jsx
|
|
293
|
-
import { jsx as
|
|
357
|
+
import { jsx as jsx7 } from "react/jsx-runtime";
|
|
294
358
|
function BookDemoButton({ size = "md", variant = "primary", className = "", children = "Book a demo", onClick }) {
|
|
295
359
|
const { onBookDemo } = useLanding();
|
|
296
360
|
const handler = onClick || (onBookDemo ? (e) => onBookDemo(e.currentTarget) : void 0);
|
|
297
|
-
return /* @__PURE__ */
|
|
361
|
+
return /* @__PURE__ */ jsx7(
|
|
298
362
|
"button",
|
|
299
363
|
{
|
|
300
364
|
type: "button",
|
|
@@ -308,61 +372,61 @@ function BookDemoButton({ size = "md", variant = "primary", className = "", chil
|
|
|
308
372
|
}
|
|
309
373
|
|
|
310
374
|
// src/Section.jsx
|
|
311
|
-
import { jsx as
|
|
375
|
+
import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
312
376
|
function Wrap({ className = "", narrow, children }) {
|
|
313
|
-
return /* @__PURE__ */
|
|
377
|
+
return /* @__PURE__ */ jsx8("div", { className: `dt-lp-wrap${narrow ? " dt-lp-wrap--narrow" : ""} ${className}`.trim(), children });
|
|
314
378
|
}
|
|
315
379
|
function Eyebrow({ children, className = "" }) {
|
|
316
380
|
if (!children) return null;
|
|
317
|
-
return /* @__PURE__ */
|
|
381
|
+
return /* @__PURE__ */ jsx8("p", { className: `dt-lp-eyebrow ${className}`.trim(), children });
|
|
318
382
|
}
|
|
319
383
|
function SectionIntro({ id, eyebrow, title: title2, body, align = "start", children }) {
|
|
320
|
-
return /* @__PURE__ */
|
|
321
|
-
/* @__PURE__ */
|
|
322
|
-
/* @__PURE__ */
|
|
323
|
-
body ? /* @__PURE__ */
|
|
384
|
+
return /* @__PURE__ */ jsxs6("div", { className: `dt-lp-intro dt-lp-intro--${align}`, children: [
|
|
385
|
+
/* @__PURE__ */ jsx8(Eyebrow, { children: eyebrow }),
|
|
386
|
+
/* @__PURE__ */ jsx8("h2", { id, className: "dt-lp-h2", children: title2 }),
|
|
387
|
+
body ? /* @__PURE__ */ jsx8("p", { className: "dt-lp-lead", children: body }) : null,
|
|
324
388
|
children
|
|
325
389
|
] });
|
|
326
390
|
}
|
|
327
391
|
function Section({ id, labelledBy, tone: tone2 = "plain", className = "", children, narrow }) {
|
|
328
|
-
return /* @__PURE__ */
|
|
392
|
+
return /* @__PURE__ */ jsx8("section", { id, "aria-labelledby": labelledBy, className: `dt-lp-section dt-lp-tone--${tone2} ${className}`.trim(), children: /* @__PURE__ */ jsx8(Wrap, { narrow, children }) });
|
|
329
393
|
}
|
|
330
394
|
function TextLink({ href, children, className = "", ...rest }) {
|
|
331
|
-
return /* @__PURE__ */
|
|
395
|
+
return /* @__PURE__ */ jsxs6(SmartLink, { href, className: `dt-lp-textlink ${className}`.trim(), ...rest, children: [
|
|
332
396
|
children,
|
|
333
397
|
" ",
|
|
334
|
-
/* @__PURE__ */
|
|
398
|
+
/* @__PURE__ */ jsx8(ArrowRight, {})
|
|
335
399
|
] });
|
|
336
400
|
}
|
|
337
401
|
function Cta({ cta, className = "" }) {
|
|
338
402
|
if (!cta) return null;
|
|
339
403
|
if (Array.isArray(cta)) {
|
|
340
404
|
if (!cta.length) return null;
|
|
341
|
-
return /* @__PURE__ */
|
|
405
|
+
return /* @__PURE__ */ jsx8("div", { className: `dt-lp-ctas ${className}`.trim(), children: cta.map((c2, i) => /* @__PURE__ */ jsx8(Cta, { cta: c2 }, i)) });
|
|
342
406
|
}
|
|
343
407
|
const c = typeof cta === "string" ? { label: cta, demo: true } : cta;
|
|
344
|
-
if (c.href && !c.demo) return /* @__PURE__ */
|
|
345
|
-
return /* @__PURE__ */
|
|
408
|
+
if (c.href && !c.demo) return /* @__PURE__ */ jsx8(TextLink, { href: c.href, className, children: c.label });
|
|
409
|
+
return /* @__PURE__ */ jsxs6(BookDemoButton, { size: "lg", className, children: [
|
|
346
410
|
c.label,
|
|
347
411
|
" ",
|
|
348
|
-
/* @__PURE__ */
|
|
412
|
+
/* @__PURE__ */ jsx8(ArrowRight, {})
|
|
349
413
|
] });
|
|
350
414
|
}
|
|
351
415
|
|
|
352
416
|
// src/Header.jsx
|
|
353
|
-
import { jsx as
|
|
417
|
+
import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
354
418
|
function Header({ nav = [], login = { label: "Log in", href: "/login" }, cta = "Book a demo", brand }) {
|
|
355
419
|
const { home } = useLanding();
|
|
356
420
|
const [open, setOpen] = useState3(false);
|
|
357
421
|
const items = login ? [...nav, login] : nav;
|
|
358
|
-
return /* @__PURE__ */
|
|
359
|
-
/* @__PURE__ */
|
|
360
|
-
/* @__PURE__ */
|
|
361
|
-
nav.length ? /* @__PURE__ */
|
|
362
|
-
/* @__PURE__ */
|
|
363
|
-
login ? /* @__PURE__ */
|
|
364
|
-
cta ? /* @__PURE__ */
|
|
365
|
-
items.length ? /* @__PURE__ */
|
|
422
|
+
return /* @__PURE__ */ jsxs7("header", { className: "dt-lp-header", children: [
|
|
423
|
+
/* @__PURE__ */ jsxs7(Wrap, { className: "dt-lp-header-bar", children: [
|
|
424
|
+
/* @__PURE__ */ jsx9(BrandLockup, { brand }),
|
|
425
|
+
nav.length ? /* @__PURE__ */ jsx9("nav", { "aria-label": "Primary", className: "dt-lp-nav", children: nav.map((n) => /* @__PURE__ */ jsx9(SmartLink, { href: n.href, className: "dt-lp-nav-link", children: n.label }, n.href)) }) : null,
|
|
426
|
+
/* @__PURE__ */ jsxs7("div", { className: "dt-lp-header-actions", children: [
|
|
427
|
+
login ? /* @__PURE__ */ jsx9(SmartLink, { href: login.href, className: "dt-lp-nav-link dt-lp-login", reload: true, children: login.label }) : null,
|
|
428
|
+
cta ? /* @__PURE__ */ jsx9(BookDemoButton, { size: "sm", children: cta }) : null,
|
|
429
|
+
items.length ? /* @__PURE__ */ jsxs7(
|
|
366
430
|
"button",
|
|
367
431
|
{
|
|
368
432
|
type: "button",
|
|
@@ -373,29 +437,29 @@ function Header({ nav = [], login = { label: "Log in", href: "/login" }, cta = "
|
|
|
373
437
|
"data-menu-toggle": "",
|
|
374
438
|
onClick: () => setOpen((o) => !o),
|
|
375
439
|
children: [
|
|
376
|
-
/* @__PURE__ */
|
|
377
|
-
/* @__PURE__ */
|
|
440
|
+
/* @__PURE__ */ jsx9("span", { className: "dt-lp-menu-open", children: /* @__PURE__ */ jsx9(MenuIcon, { size: 20 }) }),
|
|
441
|
+
/* @__PURE__ */ jsx9("span", { className: "dt-lp-menu-close", children: /* @__PURE__ */ jsx9(Close, { size: 20 }) })
|
|
378
442
|
]
|
|
379
443
|
}
|
|
380
444
|
) : null
|
|
381
445
|
] })
|
|
382
446
|
] }),
|
|
383
|
-
items.length ? /* @__PURE__ */
|
|
447
|
+
items.length ? /* @__PURE__ */ jsx9("nav", { id: "mobile-nav", "aria-label": "Mobile", className: "dt-lp-mobile-nav", hidden: !open, onClick: (e) => {
|
|
384
448
|
var _a, _b;
|
|
385
449
|
return ((_b = (_a = e.target).closest) == null ? void 0 : _b.call(_a, "a")) && setOpen(false);
|
|
386
|
-
}, children: /* @__PURE__ */
|
|
450
|
+
}, children: /* @__PURE__ */ jsx9(Wrap, { children: /* @__PURE__ */ jsx9("ul", { children: items.map((n) => /* @__PURE__ */ jsx9("li", { children: /* @__PURE__ */ jsx9(SmartLink, { href: n.href, reload: n === login, children: n.label }) }, n.href)) }) }) }) : null
|
|
387
451
|
] });
|
|
388
452
|
}
|
|
389
453
|
|
|
390
454
|
// src/DreamtreeFooter.jsx
|
|
391
|
-
import { jsx as
|
|
455
|
+
import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
392
456
|
function DreamtreeMark({ size = 28 }) {
|
|
393
|
-
return /* @__PURE__ */
|
|
394
|
-
/* @__PURE__ */
|
|
395
|
-
/* @__PURE__ */
|
|
396
|
-
/* @__PURE__ */
|
|
457
|
+
return /* @__PURE__ */ jsxs8("span", { className: "dt-lp-org", role: "img", "aria-label": "Dreamtree-Org", children: [
|
|
458
|
+
/* @__PURE__ */ jsx10("svg", { viewBox: "0 0 48.35 48.35", width: size, height: size, "aria-hidden": "true", children: /* @__PURE__ */ jsxs8("g", { fill: "none", strokeWidth: "4", strokeLinecap: "round", strokeLinejoin: "round", stroke: "#0f766e", children: [
|
|
459
|
+
/* @__PURE__ */ jsx10("path", { d: "M23.01,44.02c-9.02.03-16.36-7.27-16.39-16.29-.02-7.98,5.72-14.81,13.59-16.16,13.31-2.57,16.81-3.78,21.48-9.57,2.33,4.67,4.67,9.76,4.67,18.67,0,12.84-11.16,23.34-23.34,23.34Z" }),
|
|
460
|
+
/* @__PURE__ */ jsx10("path", { d: "M2,46.35c0-7,4.32-12.51,11.86-14.01,5.65-1.12,11.49-4.67,13.82-7" })
|
|
397
461
|
] }) }),
|
|
398
|
-
/* @__PURE__ */
|
|
462
|
+
/* @__PURE__ */ jsx10("span", { "aria-hidden": "true", className: "dt-lp-org-name", children: "Dreamtree-Org" })
|
|
399
463
|
] });
|
|
400
464
|
}
|
|
401
465
|
function DreamtreeFooter({
|
|
@@ -409,27 +473,27 @@ function DreamtreeFooter({
|
|
|
409
473
|
}) {
|
|
410
474
|
const ctx = useLanding();
|
|
411
475
|
const brand = own2 || ctx.brand;
|
|
412
|
-
return /* @__PURE__ */
|
|
413
|
-
/* @__PURE__ */
|
|
414
|
-
/* @__PURE__ */
|
|
415
|
-
/* @__PURE__ */
|
|
416
|
-
blurb ? /* @__PURE__ */
|
|
476
|
+
return /* @__PURE__ */ jsxs8("footer", { className: "dt-lp-footer", children: [
|
|
477
|
+
/* @__PURE__ */ jsxs8(Wrap, { className: `dt-lp-footer-grid dt-lp-footer-grid--${Math.min(columns.length, 3)}`, children: [
|
|
478
|
+
/* @__PURE__ */ jsxs8("div", { className: "dt-lp-footer-about", children: [
|
|
479
|
+
/* @__PURE__ */ jsx10(DreamtreeMark, {}),
|
|
480
|
+
blurb ? /* @__PURE__ */ jsx10("p", { children: blurb }) : null
|
|
417
481
|
] }),
|
|
418
|
-
columns.map((col) => /* @__PURE__ */
|
|
419
|
-
/* @__PURE__ */
|
|
420
|
-
/* @__PURE__ */
|
|
482
|
+
columns.map((col) => /* @__PURE__ */ jsxs8("nav", { "aria-label": col.label || col.title, className: "dt-lp-footer-col", children: [
|
|
483
|
+
/* @__PURE__ */ jsx10("p", { className: "dt-lp-footer-title", children: col.title }),
|
|
484
|
+
/* @__PURE__ */ jsx10("ul", { className: col.links.length > 5 && col.compact !== false ? "dt-lp-footer-links" : "dt-lp-footer-links dt-lp-footer-links--one", children: col.links.map((l) => /* @__PURE__ */ jsx10("li", { children: /* @__PURE__ */ jsx10(SmartLink, { href: l.href, reload: l.reload, children: l.label }) }, l.href)) })
|
|
421
485
|
] }, col.title))
|
|
422
486
|
] }),
|
|
423
|
-
/* @__PURE__ */
|
|
424
|
-
/* @__PURE__ */
|
|
487
|
+
/* @__PURE__ */ jsx10("div", { className: "dt-lp-footer-bar", children: /* @__PURE__ */ jsxs8(Wrap, { className: "dt-lp-footer-bar-inner", children: [
|
|
488
|
+
/* @__PURE__ */ jsxs8("p", { children: [
|
|
425
489
|
"\xA9 ",
|
|
426
490
|
year,
|
|
427
491
|
" ",
|
|
428
492
|
org,
|
|
429
493
|
". All rights reserved."
|
|
430
494
|
] }),
|
|
431
|
-
legal.length ? /* @__PURE__ */
|
|
432
|
-
brand && tagline ? /* @__PURE__ */
|
|
495
|
+
legal.length ? /* @__PURE__ */ jsx10("nav", { "aria-label": "Legal", className: "dt-lp-footer-legal", children: legal.map((l) => /* @__PURE__ */ jsx10(SmartLink, { href: l.href, children: l.label }, l.href)) }) : null,
|
|
496
|
+
brand && tagline ? /* @__PURE__ */ jsxs8("p", { children: [
|
|
433
497
|
brand.name,
|
|
434
498
|
": ",
|
|
435
499
|
tagline
|
|
@@ -439,7 +503,7 @@ function DreamtreeFooter({
|
|
|
439
503
|
}
|
|
440
504
|
|
|
441
505
|
// src/MarketingLayout.jsx
|
|
442
|
-
import { jsx as
|
|
506
|
+
import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
443
507
|
function MarketingLayout({
|
|
444
508
|
brand,
|
|
445
509
|
nav = [],
|
|
@@ -455,16 +519,16 @@ function MarketingLayout({
|
|
|
455
519
|
if (!brand || !brand.name) {
|
|
456
520
|
throw new Error(`landing-kit: "brand" is missing. Pass getBrand('<product>') from @dreamtree-org/auth-kit, or your own { id, name, primary }.`);
|
|
457
521
|
}
|
|
458
|
-
return /* @__PURE__ */
|
|
459
|
-
/* @__PURE__ */
|
|
460
|
-
/* @__PURE__ */
|
|
461
|
-
/* @__PURE__ */
|
|
462
|
-
footer === false ? null : /* @__PURE__ */
|
|
522
|
+
return /* @__PURE__ */ jsx11(LandingProvider, { value: { brand, linkComponent, onBookDemo, home }, children: /* @__PURE__ */ jsxs9("div", { className: `dt-landing ${className}`.trim(), style: brandStyle(brand), "data-product": brand.id, children: [
|
|
523
|
+
/* @__PURE__ */ jsx11("a", { href: "#main", className: "dt-lp-skip", children: "Skip to content" }),
|
|
524
|
+
/* @__PURE__ */ jsx11(Header, { nav, ...login !== void 0 ? { login } : {}, ...cta !== void 0 ? { cta } : {} }),
|
|
525
|
+
/* @__PURE__ */ jsx11("main", { id: "main", children }),
|
|
526
|
+
footer === false ? null : /* @__PURE__ */ jsx11(DreamtreeFooter, { ...footer || {} })
|
|
463
527
|
] }) });
|
|
464
528
|
}
|
|
465
529
|
|
|
466
530
|
// src/Hero.jsx
|
|
467
|
-
import { Fragment as
|
|
531
|
+
import { Fragment as Fragment4, jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
468
532
|
function Hero({
|
|
469
533
|
eyebrow,
|
|
470
534
|
title: title2,
|
|
@@ -479,169 +543,169 @@ function Hero({
|
|
|
479
543
|
backdrop
|
|
480
544
|
}) {
|
|
481
545
|
const [first, hi] = Array.isArray(title2) ? title2 : [title2, null];
|
|
482
|
-
return /* @__PURE__ */
|
|
483
|
-
/* @__PURE__ */
|
|
484
|
-
backdrop ? /* @__PURE__ */
|
|
485
|
-
/* @__PURE__ */
|
|
486
|
-
/* @__PURE__ */
|
|
487
|
-
/* @__PURE__ */
|
|
546
|
+
return /* @__PURE__ */ jsxs10("section", { id, "aria-labelledby": "hero-title", className: `dt-lp-hero${overlap ? " dt-lp-hero--overlap" : ""}`, children: [
|
|
547
|
+
/* @__PURE__ */ jsx12("div", { className: "dt-lp-hero-glow", "aria-hidden": "true" }),
|
|
548
|
+
backdrop ? /* @__PURE__ */ jsx12("div", { className: "dt-lp-hero-backdrop", "aria-hidden": "true", children: backdrop }) : null,
|
|
549
|
+
/* @__PURE__ */ jsxs10(Wrap, { className: "dt-lp-hero-inner", children: [
|
|
550
|
+
/* @__PURE__ */ jsx12(Eyebrow, { children: eyebrow }),
|
|
551
|
+
/* @__PURE__ */ jsxs10("h1", { id: "hero-title", className: "dt-lp-h1", children: [
|
|
488
552
|
first,
|
|
489
|
-
hi ? /* @__PURE__ */
|
|
553
|
+
hi ? /* @__PURE__ */ jsxs10(Fragment4, { children: [
|
|
490
554
|
" ",
|
|
491
|
-
/* @__PURE__ */
|
|
555
|
+
/* @__PURE__ */ jsx12("span", { className: "dt-lp-h1-hi", children: hi })
|
|
492
556
|
] }) : null
|
|
493
557
|
] }),
|
|
494
|
-
subtitle ? /* @__PURE__ */
|
|
495
|
-
lead ? /* @__PURE__ */
|
|
496
|
-
/* @__PURE__ */
|
|
497
|
-
cta ? /* @__PURE__ */
|
|
498
|
-
secondary ? /* @__PURE__ */
|
|
558
|
+
subtitle ? /* @__PURE__ */ jsx12("p", { className: "dt-lp-hero-subtitle", children: subtitle }) : null,
|
|
559
|
+
lead ? /* @__PURE__ */ jsx12("p", { className: "dt-lp-hero-lead", children: lead }) : null,
|
|
560
|
+
/* @__PURE__ */ jsxs10("div", { className: "dt-lp-actions", children: [
|
|
561
|
+
cta ? /* @__PURE__ */ jsx12(BookDemoButton, { size: "lg", children: cta }) : null,
|
|
562
|
+
secondary ? /* @__PURE__ */ jsx12(TextLink, { href: secondary.href, children: secondary.label }) : null
|
|
499
563
|
] }),
|
|
500
|
-
(chips == null ? void 0 : chips.length) ? /* @__PURE__ */
|
|
564
|
+
(chips == null ? void 0 : chips.length) ? /* @__PURE__ */ jsx12("ul", { className: "dt-lp-chips", "aria-label": chipsLabel, children: chips.map((c) => /* @__PURE__ */ jsx12("li", { children: c }, c)) }) : null
|
|
501
565
|
] })
|
|
502
566
|
] });
|
|
503
567
|
}
|
|
504
568
|
|
|
505
569
|
// src/FeatureSection.jsx
|
|
506
|
-
import { Fragment as
|
|
570
|
+
import { Fragment as Fragment5, jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
507
571
|
var asItem = (x) => typeof x === "string" ? { title: x } : x;
|
|
508
572
|
function Items({ items, kind }) {
|
|
509
|
-
return /* @__PURE__ */
|
|
510
|
-
f.icon ? /* @__PURE__ */
|
|
511
|
-
/* @__PURE__ */
|
|
512
|
-
f.label ? /* @__PURE__ */
|
|
513
|
-
/* @__PURE__ */
|
|
514
|
-
f.body ? /* @__PURE__ */
|
|
573
|
+
return /* @__PURE__ */ jsx13("ul", { className: `dt-lp-grid dt-lp-grid--${kind}`, children: items.map(asItem).map((f) => /* @__PURE__ */ jsxs11("li", { className: `dt-lp-card dt-lp-card--${kind}`, children: [
|
|
574
|
+
f.icon ? /* @__PURE__ */ jsx13("span", { className: "dt-lp-icon-tile", children: renderIcon(f.icon, 20) }) : null,
|
|
575
|
+
/* @__PURE__ */ jsxs11("div", { className: "dt-lp-card-text", children: [
|
|
576
|
+
f.label ? /* @__PURE__ */ jsx13("p", { className: "dt-lp-kicker", children: f.label }) : null,
|
|
577
|
+
/* @__PURE__ */ jsx13("h3", { className: "dt-lp-h3", children: f.href ? /* @__PURE__ */ jsx13(SmartLink, { href: f.href, children: f.title }) : f.title }),
|
|
578
|
+
f.body ? /* @__PURE__ */ jsx13("p", { children: f.body }) : null
|
|
515
579
|
] })
|
|
516
580
|
] }, f.title)) });
|
|
517
581
|
}
|
|
518
582
|
function Checklist({ items, icon: Icon = Check, tone: tone2 = "good", labelledBy }) {
|
|
519
|
-
return /* @__PURE__ */
|
|
520
|
-
/* @__PURE__ */
|
|
521
|
-
/* @__PURE__ */
|
|
583
|
+
return /* @__PURE__ */ jsx13("ul", { className: `dt-lp-checklist dt-lp-checklist--${tone2}`, "aria-labelledby": labelledBy, children: items.map((x) => /* @__PURE__ */ jsxs11("li", { children: [
|
|
584
|
+
/* @__PURE__ */ jsx13(Icon, { size: 18 }),
|
|
585
|
+
/* @__PURE__ */ jsx13("span", { children: x })
|
|
522
586
|
] }, x)) });
|
|
523
587
|
}
|
|
524
588
|
function InlineItems({ items }) {
|
|
525
589
|
if (!(items == null ? void 0 : items.length)) return null;
|
|
526
|
-
return /* @__PURE__ */
|
|
590
|
+
return /* @__PURE__ */ jsx13("ul", { className: "dt-lp-inline-items", children: items.map(asItem).map((f) => /* @__PURE__ */ jsxs11("li", { children: [
|
|
527
591
|
f.icon ? renderIcon(f.icon, 22) : null,
|
|
528
|
-
/* @__PURE__ */
|
|
529
|
-
/* @__PURE__ */
|
|
530
|
-
f.body ? /* @__PURE__ */
|
|
592
|
+
/* @__PURE__ */ jsxs11("span", { children: [
|
|
593
|
+
/* @__PURE__ */ jsx13("span", { className: "dt-lp-inline-title", children: f.title }),
|
|
594
|
+
f.body ? /* @__PURE__ */ jsx13("span", { className: "dt-lp-inline-body", children: f.body }) : null
|
|
531
595
|
] })
|
|
532
596
|
] }, f.title)) });
|
|
533
597
|
}
|
|
534
598
|
function Media({ children }) {
|
|
535
|
-
return /* @__PURE__ */
|
|
599
|
+
return /* @__PURE__ */ jsx13("div", { className: "dt-lp-media", children });
|
|
536
600
|
}
|
|
537
601
|
function Pair({ className, reverse, text, side }) {
|
|
538
|
-
return /* @__PURE__ */
|
|
602
|
+
return /* @__PURE__ */ jsxs11("div", { className: `${className}${reverse ? " dt-lp-pair--reverse" : ""}`, children: [
|
|
539
603
|
reverse ? side : text,
|
|
540
604
|
reverse ? text : side
|
|
541
605
|
] });
|
|
542
606
|
}
|
|
543
607
|
function Chips({ items, label, className = "" }) {
|
|
544
608
|
if (!(items == null ? void 0 : items.length)) return null;
|
|
545
|
-
return /* @__PURE__ */
|
|
609
|
+
return /* @__PURE__ */ jsx13("ul", { className: `dt-lp-chips dt-lp-chips--start ${className}`.trim(), "aria-label": label, children: items.map((c) => /* @__PURE__ */ jsx13("li", { children: c }, c)) });
|
|
546
610
|
}
|
|
547
611
|
function FeatureSection(props) {
|
|
548
612
|
const { id, variant = "cards", tone: tone2, eyebrow, title: title2, body, items = [], cta, footnote, media, reverse, bullets } = props;
|
|
549
613
|
const hid2 = `${id || variant}-title`;
|
|
550
614
|
const defaultTone = { highlight: "dark", split: "tinted", compare: "muted" }[variant] || "plain";
|
|
551
|
-
const shell = (children, extra = {}) => /* @__PURE__ */
|
|
615
|
+
const shell = (children, extra = {}) => /* @__PURE__ */ jsx13(Section, { id, labelledBy: hid2, tone: tone2 || defaultTone, className: `dt-lp-feature dt-lp-feature--${variant}`, ...extra, children });
|
|
552
616
|
switch (variant) {
|
|
553
617
|
case "split":
|
|
554
618
|
return shell(
|
|
555
|
-
/* @__PURE__ */
|
|
619
|
+
/* @__PURE__ */ jsx13(
|
|
556
620
|
Pair,
|
|
557
621
|
{
|
|
558
622
|
className: "dt-lp-split",
|
|
559
623
|
reverse,
|
|
560
|
-
text: /* @__PURE__ */
|
|
561
|
-
media ? /* @__PURE__ */
|
|
562
|
-
(bullets == null ? void 0 : bullets.length) ? /* @__PURE__ */
|
|
563
|
-
/* @__PURE__ */
|
|
624
|
+
text: /* @__PURE__ */ jsxs11(SectionIntro, { id: hid2, eyebrow, title: title2, body, children: [
|
|
625
|
+
media ? /* @__PURE__ */ jsx13(InlineItems, { items }) : null,
|
|
626
|
+
(bullets == null ? void 0 : bullets.length) ? /* @__PURE__ */ jsx13(Checklist, { items: bullets }) : null,
|
|
627
|
+
/* @__PURE__ */ jsx13(Cta, { cta, className: "dt-lp-mt" })
|
|
564
628
|
] }, "text"),
|
|
565
|
-
side: media ? /* @__PURE__ */
|
|
629
|
+
side: media ? /* @__PURE__ */ jsx13(Media, { children: media }, "side") : /* @__PURE__ */ jsx13(Items, { items, kind: "split" }, "side")
|
|
566
630
|
}
|
|
567
631
|
)
|
|
568
632
|
);
|
|
569
633
|
case "list":
|
|
570
634
|
return shell(
|
|
571
|
-
/* @__PURE__ */
|
|
572
|
-
/* @__PURE__ */
|
|
573
|
-
/* @__PURE__ */
|
|
574
|
-
/* @__PURE__ */
|
|
635
|
+
/* @__PURE__ */ jsxs11(Fragment5, { children: [
|
|
636
|
+
/* @__PURE__ */ jsx13(SectionIntro, { id: hid2, eyebrow, title: title2, body, align: "center" }),
|
|
637
|
+
/* @__PURE__ */ jsx13(Items, { items, kind: "list" }),
|
|
638
|
+
/* @__PURE__ */ jsx13(Cta, { cta, className: "dt-lp-mt" })
|
|
575
639
|
] })
|
|
576
640
|
);
|
|
577
641
|
case "intro": {
|
|
578
642
|
const { subtitle, detail, note, glance = [], glanceTitle = "At a glance", link: link2 } = props;
|
|
579
643
|
return shell(
|
|
580
|
-
/* @__PURE__ */
|
|
581
|
-
/* @__PURE__ */
|
|
582
|
-
/* @__PURE__ */
|
|
583
|
-
subtitle ? /* @__PURE__ */
|
|
584
|
-
detail ? /* @__PURE__ */
|
|
585
|
-
note ? /* @__PURE__ */
|
|
586
|
-
/* @__PURE__ */
|
|
644
|
+
/* @__PURE__ */ jsxs11("div", { className: "dt-lp-intro-grid", children: [
|
|
645
|
+
/* @__PURE__ */ jsxs11("div", { children: [
|
|
646
|
+
/* @__PURE__ */ jsx13(SectionIntro, { id: hid2, eyebrow, title: title2, body }),
|
|
647
|
+
subtitle ? /* @__PURE__ */ jsx13("h3", { className: "dt-lp-h3 dt-lp-h3--lg", children: subtitle }) : null,
|
|
648
|
+
detail ? /* @__PURE__ */ jsx13("p", { className: "dt-lp-body", children: detail }) : null,
|
|
649
|
+
note ? /* @__PURE__ */ jsx13("p", { className: "dt-lp-note", children: note }) : null,
|
|
650
|
+
/* @__PURE__ */ jsx13(Cta, { cta, className: "dt-lp-mt" })
|
|
587
651
|
] }),
|
|
588
|
-
glance.length ? /* @__PURE__ */
|
|
589
|
-
/* @__PURE__ */
|
|
590
|
-
/* @__PURE__ */
|
|
591
|
-
props.glanceNote ? /* @__PURE__ */
|
|
592
|
-
link2 ? /* @__PURE__ */
|
|
652
|
+
glance.length ? /* @__PURE__ */ jsxs11("aside", { className: "dt-lp-glance", "aria-labelledby": `${hid2}-glance`, children: [
|
|
653
|
+
/* @__PURE__ */ jsx13("p", { id: `${hid2}-glance`, className: "dt-lp-eyebrow", children: glanceTitle }),
|
|
654
|
+
/* @__PURE__ */ jsx13(Checklist, { items: glance }),
|
|
655
|
+
props.glanceNote ? /* @__PURE__ */ jsx13("p", { className: "dt-lp-note", children: props.glanceNote }) : null,
|
|
656
|
+
link2 ? /* @__PURE__ */ jsx13(TextLink, { href: link2.href, className: "dt-lp-mt", children: link2.label }) : null
|
|
593
657
|
] }) : null
|
|
594
658
|
] })
|
|
595
659
|
);
|
|
596
660
|
}
|
|
597
661
|
case "highlight": {
|
|
598
662
|
const { note, noteLabel = "Important:" } = props;
|
|
599
|
-
const text = /* @__PURE__ */
|
|
600
|
-
/* @__PURE__ */
|
|
601
|
-
/* @__PURE__ */
|
|
602
|
-
body ? /* @__PURE__ */
|
|
603
|
-
note ? /* @__PURE__ */
|
|
604
|
-
/* @__PURE__ */
|
|
605
|
-
/* @__PURE__ */
|
|
606
|
-
/* @__PURE__ */
|
|
663
|
+
const text = /* @__PURE__ */ jsxs11("div", { className: "dt-lp-intro", children: [
|
|
664
|
+
/* @__PURE__ */ jsx13(Eyebrow, { children: eyebrow }),
|
|
665
|
+
/* @__PURE__ */ jsx13("h2", { id: hid2, className: "dt-lp-h2", children: title2 }),
|
|
666
|
+
body ? /* @__PURE__ */ jsx13("p", { className: "dt-lp-lead", children: body }) : null,
|
|
667
|
+
note ? /* @__PURE__ */ jsxs11("p", { className: "dt-lp-callout", children: [
|
|
668
|
+
/* @__PURE__ */ jsx13(Alert, { size: 20 }),
|
|
669
|
+
/* @__PURE__ */ jsxs11("span", { children: [
|
|
670
|
+
/* @__PURE__ */ jsx13("strong", { children: noteLabel }),
|
|
607
671
|
" ",
|
|
608
672
|
note
|
|
609
673
|
] })
|
|
610
674
|
] }) : null,
|
|
611
|
-
media ? /* @__PURE__ */
|
|
612
|
-
/* @__PURE__ */
|
|
675
|
+
media ? /* @__PURE__ */ jsx13(InlineItems, { items }) : null,
|
|
676
|
+
/* @__PURE__ */ jsx13(Cta, { cta, className: "dt-lp-mt" })
|
|
613
677
|
] }, "text");
|
|
614
|
-
const side = media ? /* @__PURE__ */
|
|
678
|
+
const side = media ? /* @__PURE__ */ jsx13(Media, { children: media }, "side") : /* @__PURE__ */ jsx13("ul", { className: "dt-lp-grid dt-lp-grid--chips", children: items.map(asItem).map((f) => /* @__PURE__ */ jsxs11("li", { className: "dt-lp-chip-card", children: [
|
|
615
679
|
renderIcon(f.icon, 22),
|
|
616
|
-
/* @__PURE__ */
|
|
680
|
+
/* @__PURE__ */ jsx13("span", { children: f.title })
|
|
617
681
|
] }, f.title)) }, "side");
|
|
618
|
-
return shell(/* @__PURE__ */
|
|
682
|
+
return shell(/* @__PURE__ */ jsx13(Pair, { className: "dt-lp-split dt-lp-split--wide", reverse, text, side }));
|
|
619
683
|
}
|
|
620
684
|
case "band": {
|
|
621
685
|
const { examples, examplesLabel = "Examples" } = props;
|
|
622
|
-
const text = /* @__PURE__ */
|
|
623
|
-
/* @__PURE__ */
|
|
624
|
-
/* @__PURE__ */
|
|
625
|
-
media ? /* @__PURE__ */
|
|
626
|
-
/* @__PURE__ */
|
|
686
|
+
const text = /* @__PURE__ */ jsxs11("div", { children: [
|
|
687
|
+
/* @__PURE__ */ jsx13(SectionIntro, { id: hid2, eyebrow, title: title2, body }),
|
|
688
|
+
/* @__PURE__ */ jsx13(Chips, { items: examples, label: examplesLabel, className: "dt-lp-mt" }),
|
|
689
|
+
media ? /* @__PURE__ */ jsx13(InlineItems, { items }) : null,
|
|
690
|
+
/* @__PURE__ */ jsx13(Cta, { cta, className: "dt-lp-mt" })
|
|
627
691
|
] }, "text");
|
|
628
|
-
const side = media ? /* @__PURE__ */
|
|
692
|
+
const side = media ? /* @__PURE__ */ jsx13(Media, { children: media }, "side") : /* @__PURE__ */ jsx13("ul", { className: "dt-lp-band-list", children: items.map(asItem).map((f) => /* @__PURE__ */ jsxs11("li", { children: [
|
|
629
693
|
renderIcon(f.icon, 22),
|
|
630
|
-
/* @__PURE__ */
|
|
694
|
+
/* @__PURE__ */ jsx13("span", { children: f.title })
|
|
631
695
|
] }, f.title)) }, "side");
|
|
632
|
-
return shell(/* @__PURE__ */
|
|
696
|
+
return shell(/* @__PURE__ */ jsx13(Pair, { className: "dt-lp-band", reverse, text, side }));
|
|
633
697
|
}
|
|
634
698
|
case "compare": {
|
|
635
699
|
const { columns = [] } = props;
|
|
636
700
|
return shell(
|
|
637
|
-
/* @__PURE__ */
|
|
638
|
-
/* @__PURE__ */
|
|
639
|
-
/* @__PURE__ */
|
|
701
|
+
/* @__PURE__ */ jsxs11(Fragment5, { children: [
|
|
702
|
+
/* @__PURE__ */ jsx13(SectionIntro, { id: hid2, eyebrow, title: title2, body }),
|
|
703
|
+
/* @__PURE__ */ jsx13("div", { className: "dt-lp-compare", children: columns.map((col, i) => {
|
|
640
704
|
const cid = `${id || "compare"}-${i + 1}`;
|
|
641
705
|
const tone3 = col.tone || (i === 0 ? "good" : "check");
|
|
642
|
-
return /* @__PURE__ */
|
|
643
|
-
/* @__PURE__ */
|
|
644
|
-
/* @__PURE__ */
|
|
706
|
+
return /* @__PURE__ */ jsxs11("div", { className: "dt-lp-card dt-lp-card--compare", children: [
|
|
707
|
+
/* @__PURE__ */ jsx13("h3", { id: cid, className: "dt-lp-h3 dt-lp-h3--lg", children: col.title }),
|
|
708
|
+
/* @__PURE__ */ jsx13(Checklist, { items: col.items, tone: tone3, icon: tone3 === "good" ? Check : Help, labelledBy: cid })
|
|
645
709
|
] }, cid);
|
|
646
710
|
}) })
|
|
647
711
|
] })
|
|
@@ -649,124 +713,124 @@ function FeatureSection(props) {
|
|
|
649
713
|
}
|
|
650
714
|
case "links":
|
|
651
715
|
return shell(
|
|
652
|
-
/* @__PURE__ */
|
|
653
|
-
/* @__PURE__ */
|
|
654
|
-
/* @__PURE__ */
|
|
655
|
-
/* @__PURE__ */
|
|
716
|
+
/* @__PURE__ */ jsxs11(Fragment5, { children: [
|
|
717
|
+
/* @__PURE__ */ jsx13(SectionIntro, { id: hid2, eyebrow, title: title2, body }),
|
|
718
|
+
/* @__PURE__ */ jsx13("ul", { className: "dt-lp-grid dt-lp-grid--links", children: items.map((s) => /* @__PURE__ */ jsx13("li", { children: /* @__PURE__ */ jsxs11(SmartLink, { href: s.href, className: "dt-lp-linkcard", children: [
|
|
719
|
+
/* @__PURE__ */ jsxs11("span", { className: "dt-lp-linkcard-title", children: [
|
|
656
720
|
s.title,
|
|
657
721
|
" ",
|
|
658
|
-
/* @__PURE__ */
|
|
722
|
+
/* @__PURE__ */ jsx13(ArrowRight, {})
|
|
659
723
|
] }),
|
|
660
|
-
s.body ? /* @__PURE__ */
|
|
724
|
+
s.body ? /* @__PURE__ */ jsx13("span", { className: "dt-lp-linkcard-body", children: s.body }) : null
|
|
661
725
|
] }) }, s.href)) })
|
|
662
726
|
] })
|
|
663
727
|
);
|
|
664
728
|
case "detail": {
|
|
665
729
|
return shell(
|
|
666
|
-
/* @__PURE__ */
|
|
667
|
-
/* @__PURE__ */
|
|
668
|
-
/* @__PURE__ */
|
|
669
|
-
body ? /* @__PURE__ */
|
|
670
|
-
(bullets == null ? void 0 : bullets.length) ? /* @__PURE__ */
|
|
730
|
+
/* @__PURE__ */ jsxs11("div", { className: "dt-lp-detail", children: [
|
|
731
|
+
/* @__PURE__ */ jsx13("h2", { id: hid2, className: "dt-lp-h2", children: title2 }),
|
|
732
|
+
/* @__PURE__ */ jsxs11("div", { children: [
|
|
733
|
+
body ? /* @__PURE__ */ jsx13("p", { className: "dt-lp-body", children: body }) : null,
|
|
734
|
+
(bullets == null ? void 0 : bullets.length) ? /* @__PURE__ */ jsx13(Checklist, { items: bullets }) : null
|
|
671
735
|
] })
|
|
672
736
|
] })
|
|
673
737
|
);
|
|
674
738
|
}
|
|
675
739
|
default:
|
|
676
740
|
return shell(
|
|
677
|
-
/* @__PURE__ */
|
|
678
|
-
/* @__PURE__ */
|
|
679
|
-
/* @__PURE__ */
|
|
680
|
-
footnote ? /* @__PURE__ */
|
|
681
|
-
/* @__PURE__ */
|
|
741
|
+
/* @__PURE__ */ jsxs11(Fragment5, { children: [
|
|
742
|
+
/* @__PURE__ */ jsx13(SectionIntro, { id: hid2, eyebrow, title: title2, body }),
|
|
743
|
+
/* @__PURE__ */ jsx13(Items, { items, kind: "cards" }),
|
|
744
|
+
footnote ? /* @__PURE__ */ jsx13("p", { className: "dt-lp-footnote", children: footnote }) : null,
|
|
745
|
+
/* @__PURE__ */ jsx13(Cta, { cta, className: "dt-lp-mt" })
|
|
682
746
|
] })
|
|
683
747
|
);
|
|
684
748
|
}
|
|
685
749
|
}
|
|
686
750
|
|
|
687
751
|
// src/Audiences.jsx
|
|
688
|
-
import { jsx as
|
|
752
|
+
import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
689
753
|
function Audiences({ id = "audiences", eyebrow, title: title2, body, items = [], linkLabel = "See how it works", tone: tone2 = "muted" }) {
|
|
690
754
|
const hid2 = `${id}-title`;
|
|
691
|
-
return /* @__PURE__ */
|
|
692
|
-
/* @__PURE__ */
|
|
693
|
-
/* @__PURE__ */
|
|
755
|
+
return /* @__PURE__ */ jsxs12(Section, { id, labelledBy: hid2, tone: tone2, className: "dt-lp-audiences", children: [
|
|
756
|
+
/* @__PURE__ */ jsx14(SectionIntro, { id: hid2, eyebrow, title: title2, body, align: "center" }),
|
|
757
|
+
/* @__PURE__ */ jsx14("div", { className: `dt-lp-grid dt-lp-grid--audiences dt-lp-grid--n${Math.min(items.length, 4)}`, children: items.map((a, i) => {
|
|
694
758
|
var _a;
|
|
695
759
|
const aid = a.id || `${id}-${i + 1}`;
|
|
696
|
-
return /* @__PURE__ */
|
|
697
|
-
a.icon ? /* @__PURE__ */
|
|
698
|
-
/* @__PURE__ */
|
|
699
|
-
/* @__PURE__ */
|
|
700
|
-
a.keyword ? /* @__PURE__ */
|
|
701
|
-
/* @__PURE__ */
|
|
702
|
-
/* @__PURE__ */
|
|
760
|
+
return /* @__PURE__ */ jsxs12("article", { id: aid, "aria-labelledby": `${aid}-title`, className: "dt-lp-card dt-lp-card--audience", children: [
|
|
761
|
+
a.icon ? /* @__PURE__ */ jsx14("span", { className: "dt-lp-audience-icon", children: renderIcon(a.icon, 30) }) : null,
|
|
762
|
+
/* @__PURE__ */ jsxs12("div", { className: a.media ? "dt-lp-audience-head" : void 0, children: [
|
|
763
|
+
/* @__PURE__ */ jsxs12("div", { children: [
|
|
764
|
+
a.keyword ? /* @__PURE__ */ jsx14("p", { className: "dt-lp-kicker", children: a.keyword }) : null,
|
|
765
|
+
/* @__PURE__ */ jsx14("h3", { id: `${aid}-title`, className: "dt-lp-h3 dt-lp-h3--lg", children: a.title }),
|
|
766
|
+
/* @__PURE__ */ jsx14("p", { className: a.media || a.features ? void 0 : "dt-lp-grow", children: a.body })
|
|
703
767
|
] }),
|
|
704
|
-
a.media ? /* @__PURE__ */
|
|
768
|
+
a.media ? /* @__PURE__ */ jsx14("div", { className: "dt-lp-audience-media", "aria-hidden": "true", children: a.media }) : null
|
|
705
769
|
] }),
|
|
706
|
-
((_a = a.features) == null ? void 0 : _a.length) ? /* @__PURE__ */
|
|
770
|
+
((_a = a.features) == null ? void 0 : _a.length) ? /* @__PURE__ */ jsx14("ul", { className: "dt-lp-audience-features dt-lp-grow", children: a.features.map((f) => {
|
|
707
771
|
const it = typeof f === "string" ? { title: f } : f;
|
|
708
|
-
return /* @__PURE__ */
|
|
772
|
+
return /* @__PURE__ */ jsxs12("li", { children: [
|
|
709
773
|
it.icon ? renderIcon(it.icon, 22) : null,
|
|
710
|
-
/* @__PURE__ */
|
|
774
|
+
/* @__PURE__ */ jsx14("span", { children: it.title })
|
|
711
775
|
] }, it.title);
|
|
712
776
|
}) }) : null,
|
|
713
|
-
a.href ? /* @__PURE__ */
|
|
777
|
+
a.href ? /* @__PURE__ */ jsx14(TextLink, { href: a.href, "aria-label": `${a.keyword || a.title}: ${(a.linkLabel || linkLabel).toLowerCase()}`, children: a.linkLabel || linkLabel }) : null
|
|
714
778
|
] }, aid);
|
|
715
779
|
}) })
|
|
716
780
|
] });
|
|
717
781
|
}
|
|
718
782
|
|
|
719
783
|
// src/HowItWorks.jsx
|
|
720
|
-
import { jsx as
|
|
784
|
+
import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
721
785
|
function HowItWorks({ id = "how-it-works", eyebrow, title: title2, body, steps, items, tone: tone2 = "plain", cta }) {
|
|
722
786
|
const list = steps || items || [];
|
|
723
787
|
const hid2 = `${id}-title`;
|
|
724
|
-
return /* @__PURE__ */
|
|
725
|
-
/* @__PURE__ */
|
|
726
|
-
/* @__PURE__ */
|
|
727
|
-
/* @__PURE__ */
|
|
728
|
-
/* @__PURE__ */
|
|
729
|
-
/* @__PURE__ */
|
|
788
|
+
return /* @__PURE__ */ jsxs13(Section, { id, labelledBy: hid2, tone: tone2, className: "dt-lp-steps", children: [
|
|
789
|
+
/* @__PURE__ */ jsx15(SectionIntro, { id: hid2, eyebrow, title: title2, body }),
|
|
790
|
+
/* @__PURE__ */ jsx15("ol", { className: "dt-lp-grid dt-lp-grid--steps", children: list.map((st, i) => /* @__PURE__ */ jsxs13("li", { className: "dt-lp-card", children: [
|
|
791
|
+
/* @__PURE__ */ jsx15("span", { className: "dt-lp-step-num", "aria-hidden": "true", children: i + 1 }),
|
|
792
|
+
/* @__PURE__ */ jsx15("h3", { className: "dt-lp-h3", children: st.name || st.title }),
|
|
793
|
+
/* @__PURE__ */ jsx15("p", { children: st.text || st.body })
|
|
730
794
|
] }, st.name || st.title)) }),
|
|
731
|
-
/* @__PURE__ */
|
|
795
|
+
/* @__PURE__ */ jsx15(Cta, { cta, className: "dt-lp-mt" })
|
|
732
796
|
] });
|
|
733
797
|
}
|
|
734
798
|
|
|
735
799
|
// src/Faq.jsx
|
|
736
|
-
import { jsx as
|
|
800
|
+
import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
737
801
|
function Faq({ id = "faq", eyebrow, title: title2 = "Frequently asked questions", intro: intro2, items = [], openFirst = true, tone: tone2 = "muted" }) {
|
|
738
802
|
const hid2 = `${id}-title`;
|
|
739
|
-
return /* @__PURE__ */
|
|
740
|
-
/* @__PURE__ */
|
|
741
|
-
/* @__PURE__ */
|
|
742
|
-
/* @__PURE__ */
|
|
743
|
-
/* @__PURE__ */
|
|
744
|
-
/* @__PURE__ */
|
|
803
|
+
return /* @__PURE__ */ jsxs14(Section, { id, labelledBy: hid2, tone: tone2, narrow: true, className: "dt-lp-faq", children: [
|
|
804
|
+
/* @__PURE__ */ jsx16(SectionIntro, { id: hid2, eyebrow, title: title2, body: intro2, align: "center" }),
|
|
805
|
+
/* @__PURE__ */ jsx16("div", { className: "dt-lp-faq-list", children: items.map((f, i) => /* @__PURE__ */ jsxs14("details", { className: "dt-lp-faq-item", open: openFirst && i === 0, children: [
|
|
806
|
+
/* @__PURE__ */ jsxs14("summary", { children: [
|
|
807
|
+
/* @__PURE__ */ jsx16("h3", { className: "dt-lp-h3", children: f.q }),
|
|
808
|
+
/* @__PURE__ */ jsx16(ChevronRight, { size: 18, className: "dt-lp-icon dt-lp-faq-chevron" })
|
|
745
809
|
] }),
|
|
746
|
-
/* @__PURE__ */
|
|
810
|
+
/* @__PURE__ */ jsx16("p", { children: f.a })
|
|
747
811
|
] }, f.q)) })
|
|
748
812
|
] });
|
|
749
813
|
}
|
|
750
814
|
|
|
751
815
|
// src/DemoCta.jsx
|
|
752
|
-
import { jsx as
|
|
816
|
+
import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
753
817
|
function DemoCta({ id = "demo", eyebrow, title: title2, body, label = "Book a demo", chips, chipsLabel = "Business types", note, link: link2 }) {
|
|
754
|
-
return /* @__PURE__ */
|
|
755
|
-
eyebrow ? /* @__PURE__ */
|
|
756
|
-
/* @__PURE__ */
|
|
757
|
-
body ? /* @__PURE__ */
|
|
758
|
-
/* @__PURE__ */
|
|
759
|
-
(chips == null ? void 0 : chips.length) ? /* @__PURE__ */
|
|
760
|
-
note ? /* @__PURE__ */
|
|
761
|
-
note.title ? /* @__PURE__ */
|
|
762
|
-
note.body ? /* @__PURE__ */
|
|
818
|
+
return /* @__PURE__ */ jsx17("section", { id, "aria-labelledby": `${id}-title`, className: "dt-lp-section dt-lp-cta", children: /* @__PURE__ */ jsx17(Wrap, { children: /* @__PURE__ */ jsxs15("div", { className: "dt-lp-cta-panel", children: [
|
|
819
|
+
eyebrow ? /* @__PURE__ */ jsx17("p", { className: "dt-lp-eyebrow dt-lp-eyebrow--inverse", children: eyebrow }) : null,
|
|
820
|
+
/* @__PURE__ */ jsx17("h2", { id: `${id}-title`, className: "dt-lp-h2 dt-lp-h2--cta", children: title2 }),
|
|
821
|
+
body ? /* @__PURE__ */ jsx17("p", { className: "dt-lp-cta-body", children: body }) : null,
|
|
822
|
+
/* @__PURE__ */ jsx17(BookDemoButton, { size: "lg", variant: "inverse", children: label }),
|
|
823
|
+
(chips == null ? void 0 : chips.length) ? /* @__PURE__ */ jsx17("ul", { className: "dt-lp-chips dt-lp-chips--inverse", "aria-label": chipsLabel, children: chips.map((k) => /* @__PURE__ */ jsx17("li", { children: k }, k)) }) : null,
|
|
824
|
+
note ? /* @__PURE__ */ jsxs15("div", { className: "dt-lp-cta-note", children: [
|
|
825
|
+
note.title ? /* @__PURE__ */ jsx17("h3", { className: "dt-lp-h3", children: note.title }) : null,
|
|
826
|
+
note.body ? /* @__PURE__ */ jsx17("p", { children: note.body }) : null
|
|
763
827
|
] }) : null,
|
|
764
|
-
link2 ? /* @__PURE__ */
|
|
828
|
+
link2 ? /* @__PURE__ */ jsx17("p", { className: "dt-lp-cta-link", children: /* @__PURE__ */ jsx17(SmartLink, { href: link2.href, reload: link2.reload, children: link2.label }) }) : null
|
|
765
829
|
] }) }) });
|
|
766
830
|
}
|
|
767
831
|
|
|
768
832
|
// src/LandingPage.jsx
|
|
769
|
-
import { jsx as
|
|
833
|
+
import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
770
834
|
var BLOCKS = { audiences: Audiences, steps: HowItWorks, faq: Faq, cta: DemoCta };
|
|
771
835
|
var TAIL = ["audiences", "steps", "faq", "cta"];
|
|
772
836
|
function LandingPage({ brand, content, preview = null, slots = {}, linkComponent, onBookDemo, home = true, className }) {
|
|
@@ -780,22 +844,22 @@ function LandingPage({ brand, content, preview = null, slots = {}, linkComponent
|
|
|
780
844
|
var _a;
|
|
781
845
|
if (!s) return null;
|
|
782
846
|
if (isValidElement2(s)) return cloneElement(s, { key: (_a = s.key) != null ? _a : `el-${i}` });
|
|
783
|
-
if (s.use === "preview") return preview ? /* @__PURE__ */
|
|
847
|
+
if (s.use === "preview") return preview ? /* @__PURE__ */ jsx18("div", { children: preview }, "preview") : null;
|
|
784
848
|
if (s.use) {
|
|
785
849
|
if (slots && Object.prototype.hasOwnProperty.call(slots, s.use)) {
|
|
786
850
|
const node = slots[s.use];
|
|
787
|
-
return node ? /* @__PURE__ */
|
|
851
|
+
return node ? /* @__PURE__ */ jsx18(Fragment6, { children: node }, `slot-${s.use}`) : null;
|
|
788
852
|
}
|
|
789
853
|
const Block = BLOCKS[s.use];
|
|
790
854
|
if (!Block) {
|
|
791
855
|
const known = ["preview", ...TAIL, ...Object.keys(slots || {})].join(", ");
|
|
792
856
|
throw new Error(`landing-kit: unknown section use "${s.use}" (known: ${known}). Pass custom sections as <LandingPage slots={{ ${s.use}: <YourSection /> }} />.`);
|
|
793
857
|
}
|
|
794
|
-
return content[s.use] ? /* @__PURE__ */
|
|
858
|
+
return content[s.use] ? /* @__PURE__ */ jsx18(Block, { ...content[s.use] }, s.use) : null;
|
|
795
859
|
}
|
|
796
|
-
return /* @__PURE__ */
|
|
860
|
+
return /* @__PURE__ */ jsx18(FeatureSection, { ...s }, s.id || `section-${i}`);
|
|
797
861
|
};
|
|
798
|
-
return /* @__PURE__ */
|
|
862
|
+
return /* @__PURE__ */ jsxs16(
|
|
799
863
|
MarketingLayout,
|
|
800
864
|
{
|
|
801
865
|
brand,
|
|
@@ -808,12 +872,12 @@ function LandingPage({ brand, content, preview = null, slots = {}, linkComponent
|
|
|
808
872
|
onBookDemo,
|
|
809
873
|
className,
|
|
810
874
|
children: [
|
|
811
|
-
/* @__PURE__ */
|
|
875
|
+
/* @__PURE__ */ jsx18(Hero, { ...hero, overlap: !!preview && !previewInline }),
|
|
812
876
|
preview && !previewInline ? preview : null,
|
|
813
877
|
sections.map(render),
|
|
814
878
|
TAIL.filter((k) => !used.has(k) && content[k]).map((k) => {
|
|
815
879
|
const Block = BLOCKS[k];
|
|
816
|
-
return /* @__PURE__ */
|
|
880
|
+
return /* @__PURE__ */ jsx18(Block, { ...content[k] }, k);
|
|
817
881
|
})
|
|
818
882
|
]
|
|
819
883
|
}
|
|
@@ -821,7 +885,7 @@ function LandingPage({ brand, content, preview = null, slots = {}, linkComponent
|
|
|
821
885
|
}
|
|
822
886
|
|
|
823
887
|
// src/PreviewFrame.jsx
|
|
824
|
-
import { jsx as
|
|
888
|
+
import { jsx as jsx19, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
825
889
|
function PreviewFrame({
|
|
826
890
|
id = "product",
|
|
827
891
|
heading: heading2,
|
|
@@ -833,25 +897,25 @@ function PreviewFrame({
|
|
|
833
897
|
}) {
|
|
834
898
|
const ctx = useLanding();
|
|
835
899
|
const brand = own2 || ctx.brand;
|
|
836
|
-
return /* @__PURE__ */
|
|
837
|
-
/* @__PURE__ */
|
|
838
|
-
/* @__PURE__ */
|
|
839
|
-
/* @__PURE__ */
|
|
840
|
-
/* @__PURE__ */
|
|
841
|
-
brand ? /* @__PURE__ */
|
|
842
|
-
meta ? /* @__PURE__ */
|
|
900
|
+
return /* @__PURE__ */ jsxs17("section", { id, "aria-labelledby": `${id}-title`, className: "dt-lp-preview", children: [
|
|
901
|
+
/* @__PURE__ */ jsx19("h2", { id: `${id}-title`, className: "dt-lp-sr-only", children: heading2 || `${brand ? brand.name : "Product"} overview` }),
|
|
902
|
+
/* @__PURE__ */ jsx19(Wrap, { children: /* @__PURE__ */ jsxs17("figure", { className: "dt-lp-preview-frame", children: [
|
|
903
|
+
/* @__PURE__ */ jsxs17("div", { className: "dt-lp-preview-bar", children: [
|
|
904
|
+
/* @__PURE__ */ jsxs17("div", { className: "dt-lp-preview-title", children: [
|
|
905
|
+
brand ? /* @__PURE__ */ jsx19(Wordmark, { name: brand.name }) : null,
|
|
906
|
+
meta ? /* @__PURE__ */ jsx19("span", { className: "dt-lp-preview-meta", children: meta }) : null
|
|
843
907
|
] }),
|
|
844
|
-
badge ? /* @__PURE__ */
|
|
908
|
+
badge ? /* @__PURE__ */ jsx19("span", { className: "dt-lp-preview-badge", children: badge }) : null
|
|
845
909
|
] }),
|
|
846
|
-
/* @__PURE__ */
|
|
847
|
-
caption ? /* @__PURE__ */
|
|
910
|
+
/* @__PURE__ */ jsx19("div", { className: "dt-lp-preview-body", children }),
|
|
911
|
+
caption ? /* @__PURE__ */ jsx19("figcaption", { className: "dt-lp-sr-only", children: caption }) : null
|
|
848
912
|
] }) })
|
|
849
913
|
] });
|
|
850
914
|
}
|
|
851
915
|
|
|
852
916
|
// src/DemoDialog.jsx
|
|
853
|
-
import { useEffect as
|
|
854
|
-
import { jsx as
|
|
917
|
+
import { useEffect as useEffect3, useRef as useRef4, useState as useState4 } from "react";
|
|
918
|
+
import { jsx as jsx20, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
855
919
|
var DEFAULT_DEMO_FIELDS = [
|
|
856
920
|
{ name: "name", label: "Your name", required: true, maxLength: 120, autoComplete: "name" },
|
|
857
921
|
{ name: "phone", label: "Mobile", type: "tel", required: true, maxLength: 20, autoComplete: "tel", inputMode: "tel" },
|
|
@@ -873,14 +937,14 @@ function Field({ f, value, onChange, error }) {
|
|
|
873
937
|
};
|
|
874
938
|
let control;
|
|
875
939
|
if (f.type === "select") {
|
|
876
|
-
control = /* @__PURE__ */
|
|
877
|
-
/* @__PURE__ */
|
|
878
|
-
(f.options || []).map((o) => /* @__PURE__ */
|
|
940
|
+
control = /* @__PURE__ */ jsxs18("select", { ...common, children: [
|
|
941
|
+
/* @__PURE__ */ jsx20("option", { value: "", children: f.placeholder || "Choose one" }),
|
|
942
|
+
(f.options || []).map((o) => /* @__PURE__ */ jsx20("option", { value: o.value, children: o.label }, o.value))
|
|
879
943
|
] });
|
|
880
944
|
} else if (f.type === "textarea") {
|
|
881
|
-
control = /* @__PURE__ */
|
|
945
|
+
control = /* @__PURE__ */ jsx20("textarea", { ...common, rows: f.rows || 3, maxLength: f.maxLength });
|
|
882
946
|
} else {
|
|
883
|
-
control = /* @__PURE__ */
|
|
947
|
+
control = /* @__PURE__ */ jsx20(
|
|
884
948
|
"input",
|
|
885
949
|
{
|
|
886
950
|
...common,
|
|
@@ -893,13 +957,13 @@ function Field({ f, value, onChange, error }) {
|
|
|
893
957
|
}
|
|
894
958
|
);
|
|
895
959
|
}
|
|
896
|
-
return /* @__PURE__ */
|
|
897
|
-
/* @__PURE__ */
|
|
960
|
+
return /* @__PURE__ */ jsxs18("label", { htmlFor: id, className: `dt-lp-field${f.wide || f.type === "textarea" ? " dt-lp-field--wide" : ""}`, children: [
|
|
961
|
+
/* @__PURE__ */ jsxs18("span", { children: [
|
|
898
962
|
f.label,
|
|
899
963
|
f.required ? " *" : ""
|
|
900
964
|
] }),
|
|
901
965
|
control,
|
|
902
|
-
error ? /* @__PURE__ */
|
|
966
|
+
error ? /* @__PURE__ */ jsx20("span", { id: errId, className: "dt-lp-field-error", children: error }) : null
|
|
903
967
|
] });
|
|
904
968
|
}
|
|
905
969
|
function DemoDialog({
|
|
@@ -919,7 +983,7 @@ function DemoDialog({
|
|
|
919
983
|
successMessage,
|
|
920
984
|
validate
|
|
921
985
|
}) {
|
|
922
|
-
const ref =
|
|
986
|
+
const ref = useRef4(null);
|
|
923
987
|
const [form, setForm] = useState4(() => initial(fields2));
|
|
924
988
|
const [website, setWebsite] = useState4("");
|
|
925
989
|
const [consent, setConsent] = useState4(false);
|
|
@@ -928,7 +992,7 @@ function DemoDialog({
|
|
|
928
992
|
const [fieldErrors, setFieldErrors] = useState4({});
|
|
929
993
|
const [sent, setSent] = useState4(false);
|
|
930
994
|
const name = brand ? brand.name : "a";
|
|
931
|
-
|
|
995
|
+
useEffect3(() => {
|
|
932
996
|
const dlg = ref.current;
|
|
933
997
|
if (open && dlg && !dlg.open && typeof dlg.showModal === "function") dlg.showModal();
|
|
934
998
|
}, [open]);
|
|
@@ -963,7 +1027,7 @@ function DemoDialog({
|
|
|
963
1027
|
};
|
|
964
1028
|
const first = String(form.name || "").trim().split(/\s+/)[0] || "there";
|
|
965
1029
|
const thanks = typeof successMessage === "function" ? successMessage(form) : successMessage || `Thanks, ${first}. We have your request. Someone from the ${name} team will call you within one working day to fix a time.`;
|
|
966
|
-
return /* @__PURE__ */
|
|
1030
|
+
return /* @__PURE__ */ jsxs18(
|
|
967
1031
|
"dialog",
|
|
968
1032
|
{
|
|
969
1033
|
ref,
|
|
@@ -976,33 +1040,33 @@ function DemoDialog({
|
|
|
976
1040
|
onClose();
|
|
977
1041
|
},
|
|
978
1042
|
children: [
|
|
979
|
-
/* @__PURE__ */
|
|
980
|
-
/* @__PURE__ */
|
|
981
|
-
/* @__PURE__ */
|
|
1043
|
+
/* @__PURE__ */ jsxs18("div", { className: "dt-lp-dialog-head", children: [
|
|
1044
|
+
/* @__PURE__ */ jsx20("h2", { id: "dt-demo-title", children: sent ? "Thank you" : title2 || `Book a ${name} demo` }),
|
|
1045
|
+
/* @__PURE__ */ jsx20("button", { type: "button", className: "dt-lp-dialog-x", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ jsx20(Close, { size: 18 }) })
|
|
982
1046
|
] }),
|
|
983
|
-
/* @__PURE__ */
|
|
984
|
-
/* @__PURE__ */
|
|
985
|
-
/* @__PURE__ */
|
|
986
|
-
] }) : /* @__PURE__ */
|
|
987
|
-
intro2 ? /* @__PURE__ */
|
|
988
|
-
err ? /* @__PURE__ */
|
|
989
|
-
/* @__PURE__ */
|
|
990
|
-
/* @__PURE__ */
|
|
1047
|
+
/* @__PURE__ */ jsx20("div", { className: "dt-lp-dialog-body", children: sent ? /* @__PURE__ */ jsxs18("div", { className: "dt-lp-stack", children: [
|
|
1048
|
+
/* @__PURE__ */ jsx20("p", { role: "status", children: thanks }),
|
|
1049
|
+
/* @__PURE__ */ jsx20("button", { type: "button", className: "dt-lp-btn dt-lp-btn--outline dt-lp-btn--md", onClick: onClose, children: "Close" })
|
|
1050
|
+
] }) : /* @__PURE__ */ jsxs18("form", { className: "dt-lp-stack", onSubmit: submit, noValidate: true, children: [
|
|
1051
|
+
intro2 ? /* @__PURE__ */ jsx20("p", { className: "dt-lp-muted", children: intro2 }) : null,
|
|
1052
|
+
err ? /* @__PURE__ */ jsx20("p", { role: "alert", className: "dt-lp-error", children: err }) : null,
|
|
1053
|
+
/* @__PURE__ */ jsx20("div", { className: "dt-lp-fields", children: fields2.map((f) => /* @__PURE__ */ jsx20(Field, { f, value: form[f.name], onChange: set(f.name), error: fieldErrors[f.name] }, f.name)) }),
|
|
1054
|
+
/* @__PURE__ */ jsx20("div", { "aria-hidden": "true", className: "dt-lp-honeypot", children: /* @__PURE__ */ jsxs18("label", { children: [
|
|
991
1055
|
"Website",
|
|
992
|
-
/* @__PURE__ */
|
|
1056
|
+
/* @__PURE__ */ jsx20("input", { type: "text", name: "website", tabIndex: -1, autoComplete: "off", value: website, onChange: (e) => setWebsite(e.target.value) })
|
|
993
1057
|
] }) }),
|
|
994
|
-
/* @__PURE__ */
|
|
995
|
-
/* @__PURE__ */
|
|
996
|
-
/* @__PURE__ */
|
|
1058
|
+
/* @__PURE__ */ jsxs18("label", { className: "dt-lp-consent", children: [
|
|
1059
|
+
/* @__PURE__ */ jsx20("input", { type: "checkbox", checked: consent, onChange: (e) => setConsent(e.target.checked) }),
|
|
1060
|
+
/* @__PURE__ */ jsx20("span", { children: consentText || `I agree that ${fiduciary} may call, message or email me about this demo.` })
|
|
997
1061
|
] }),
|
|
998
|
-
privacyHref ? /* @__PURE__ */
|
|
1062
|
+
privacyHref ? /* @__PURE__ */ jsxs18("p", { className: "dt-lp-fineprint", children: [
|
|
999
1063
|
"Used only to arrange your demo. See the ",
|
|
1000
|
-
/* @__PURE__ */
|
|
1064
|
+
/* @__PURE__ */ jsx20("a", { href: privacyHref, children: "privacy policy" }),
|
|
1001
1065
|
policyVersion ? ` (v${policyVersion})` : "",
|
|
1002
1066
|
"."
|
|
1003
1067
|
] }) : null,
|
|
1004
|
-
/* @__PURE__ */
|
|
1005
|
-
/* @__PURE__ */
|
|
1068
|
+
/* @__PURE__ */ jsxs18("button", { type: "submit", className: "dt-lp-btn dt-lp-btn--primary dt-lp-btn--md", disabled: !ready || busy, "aria-busy": busy ? "true" : void 0, children: [
|
|
1069
|
+
/* @__PURE__ */ jsx20(Calendar, { size: 16 }),
|
|
1006
1070
|
busy ? "Sending\u2026" : submitLabel
|
|
1007
1071
|
] })
|
|
1008
1072
|
] }) })
|
|
@@ -1012,33 +1076,33 @@ function DemoDialog({
|
|
|
1012
1076
|
}
|
|
1013
1077
|
|
|
1014
1078
|
// src/PageHero.jsx
|
|
1015
|
-
import { jsx as
|
|
1079
|
+
import { jsx as jsx21, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
1016
1080
|
function Breadcrumbs({ items = [] }) {
|
|
1017
1081
|
if (!items.length) return null;
|
|
1018
|
-
return /* @__PURE__ */
|
|
1082
|
+
return /* @__PURE__ */ jsx21("nav", { "aria-label": "Breadcrumb", className: "dt-lp-crumbs", children: /* @__PURE__ */ jsx21("ol", { children: items.map((c, i) => {
|
|
1019
1083
|
const last = i === items.length - 1;
|
|
1020
|
-
return /* @__PURE__ */
|
|
1021
|
-
i > 0 ? /* @__PURE__ */
|
|
1022
|
-
last || !c.href ? /* @__PURE__ */
|
|
1084
|
+
return /* @__PURE__ */ jsxs19("li", { children: [
|
|
1085
|
+
i > 0 ? /* @__PURE__ */ jsx21(ChevronRight, { size: 14 }) : null,
|
|
1086
|
+
last || !c.href ? /* @__PURE__ */ jsx21("span", { "aria-current": last ? "page" : void 0, children: c.label }) : /* @__PURE__ */ jsx21(SmartLink, { href: c.href, children: c.label })
|
|
1023
1087
|
] }, `${c.label}-${i}`);
|
|
1024
1088
|
}) }) });
|
|
1025
1089
|
}
|
|
1026
1090
|
function PageHero({ breadcrumbs, eyebrow, title: title2, lead, cta = "Book a demo", secondary }) {
|
|
1027
|
-
return /* @__PURE__ */
|
|
1028
|
-
/* @__PURE__ */
|
|
1029
|
-
/* @__PURE__ */
|
|
1030
|
-
/* @__PURE__ */
|
|
1031
|
-
lead ? /* @__PURE__ */
|
|
1032
|
-
/* @__PURE__ */
|
|
1033
|
-
cta ? /* @__PURE__ */
|
|
1034
|
-
secondary ? /* @__PURE__ */
|
|
1091
|
+
return /* @__PURE__ */ jsx21("section", { "aria-labelledby": "hero-title", className: "dt-lp-hero dt-lp-hero--page", children: /* @__PURE__ */ jsxs19(Wrap, { className: "dt-lp-hero-inner dt-lp-hero-inner--start", children: [
|
|
1092
|
+
/* @__PURE__ */ jsx21(Breadcrumbs, { items: breadcrumbs }),
|
|
1093
|
+
/* @__PURE__ */ jsx21(Eyebrow, { className: "dt-lp-mt-lg", children: eyebrow }),
|
|
1094
|
+
/* @__PURE__ */ jsx21("h1", { id: "hero-title", className: "dt-lp-h1 dt-lp-h1--page", children: title2 }),
|
|
1095
|
+
lead ? /* @__PURE__ */ jsx21("p", { id: "answer", className: "dt-lp-hero-lead", children: lead }) : null,
|
|
1096
|
+
/* @__PURE__ */ jsxs19("div", { className: "dt-lp-actions dt-lp-actions--start", children: [
|
|
1097
|
+
cta ? /* @__PURE__ */ jsx21(BookDemoButton, { size: "lg", children: cta }) : null,
|
|
1098
|
+
secondary ? /* @__PURE__ */ jsx21(TextLink, { href: secondary.href, children: secondary.label }) : null
|
|
1035
1099
|
] })
|
|
1036
1100
|
] }) });
|
|
1037
1101
|
}
|
|
1038
1102
|
|
|
1039
1103
|
// src/island.jsx
|
|
1040
1104
|
import { createRoot } from "react-dom/client";
|
|
1041
|
-
import { jsx as
|
|
1105
|
+
import { jsx as jsx22 } from "react/jsx-runtime";
|
|
1042
1106
|
function createDemoIsland(props) {
|
|
1043
1107
|
let root;
|
|
1044
1108
|
let returnTo = null;
|
|
@@ -1057,7 +1121,7 @@ function createDemoIsland(props) {
|
|
|
1057
1121
|
root = createRoot(host);
|
|
1058
1122
|
}
|
|
1059
1123
|
const p = typeof props === "function" ? props() : props;
|
|
1060
|
-
root.render(/* @__PURE__ */
|
|
1124
|
+
root.render(/* @__PURE__ */ jsx22(DemoDialog, { ...p, onClose: close }, Date.now()));
|
|
1061
1125
|
},
|
|
1062
1126
|
close
|
|
1063
1127
|
};
|
|
@@ -1862,10 +1926,10 @@ function themeVars(input) {
|
|
|
1862
1926
|
}
|
|
1863
1927
|
|
|
1864
1928
|
// src/tenant/HeroSlider.jsx
|
|
1865
|
-
import { useCallback as useCallback2, useEffect as
|
|
1929
|
+
import { useCallback as useCallback2, useEffect as useEffect4, useRef as useRef5, useState as useState5 } from "react";
|
|
1866
1930
|
|
|
1867
1931
|
// src/tenant/icons.jsx
|
|
1868
|
-
import { Fragment as
|
|
1932
|
+
import { Fragment as Fragment7, jsx as jsx23, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
1869
1933
|
var base2 = {
|
|
1870
1934
|
viewBox: "0 0 24 24",
|
|
1871
1935
|
fill: "none",
|
|
@@ -1877,88 +1941,88 @@ var base2 = {
|
|
|
1877
1941
|
focusable: "false"
|
|
1878
1942
|
};
|
|
1879
1943
|
var PATHS = {
|
|
1880
|
-
"shield-check": /* @__PURE__ */
|
|
1881
|
-
/* @__PURE__ */
|
|
1882
|
-
/* @__PURE__ */
|
|
1944
|
+
"shield-check": /* @__PURE__ */ jsxs20(Fragment7, { children: [
|
|
1945
|
+
/* @__PURE__ */ jsx23("path", { d: "M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10Z" }),
|
|
1946
|
+
/* @__PURE__ */ jsx23("path", { d: "m9 12 2 2 4-4" })
|
|
1883
1947
|
] }),
|
|
1884
|
-
"badge-check": /* @__PURE__ */
|
|
1885
|
-
/* @__PURE__ */
|
|
1886
|
-
/* @__PURE__ */
|
|
1948
|
+
"badge-check": /* @__PURE__ */ jsxs20(Fragment7, { children: [
|
|
1949
|
+
/* @__PURE__ */ jsx23("path", { d: "M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z" }),
|
|
1950
|
+
/* @__PURE__ */ jsx23("path", { d: "m9 12 2 2 4-4" })
|
|
1887
1951
|
] }),
|
|
1888
|
-
truck: /* @__PURE__ */
|
|
1889
|
-
/* @__PURE__ */
|
|
1890
|
-
/* @__PURE__ */
|
|
1891
|
-
/* @__PURE__ */
|
|
1892
|
-
/* @__PURE__ */
|
|
1893
|
-
/* @__PURE__ */
|
|
1952
|
+
truck: /* @__PURE__ */ jsxs20(Fragment7, { children: [
|
|
1953
|
+
/* @__PURE__ */ jsx23("path", { d: "M14 18V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v11a1 1 0 0 0 1 1h2" }),
|
|
1954
|
+
/* @__PURE__ */ jsx23("path", { d: "M15 18H9" }),
|
|
1955
|
+
/* @__PURE__ */ jsx23("path", { d: "M19 18h2a1 1 0 0 0 1-1v-3.65a1 1 0 0 0-.22-.62L18.3 9.38a1 1 0 0 0-.78-.38H14" }),
|
|
1956
|
+
/* @__PURE__ */ jsx23("circle", { cx: "17", cy: "18", r: "2" }),
|
|
1957
|
+
/* @__PURE__ */ jsx23("circle", { cx: "7", cy: "18", r: "2" })
|
|
1894
1958
|
] }),
|
|
1895
|
-
wrench: /* @__PURE__ */
|
|
1896
|
-
refresh: /* @__PURE__ */
|
|
1897
|
-
/* @__PURE__ */
|
|
1898
|
-
/* @__PURE__ */
|
|
1899
|
-
/* @__PURE__ */
|
|
1900
|
-
/* @__PURE__ */
|
|
1959
|
+
wrench: /* @__PURE__ */ jsx23("path", { d: "M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z" }),
|
|
1960
|
+
refresh: /* @__PURE__ */ jsxs20(Fragment7, { children: [
|
|
1961
|
+
/* @__PURE__ */ jsx23("path", { d: "M3 12a9 9 0 0 1 15-6.7L21 8" }),
|
|
1962
|
+
/* @__PURE__ */ jsx23("path", { d: "M21 3v5h-5" }),
|
|
1963
|
+
/* @__PURE__ */ jsx23("path", { d: "M21 12a9 9 0 0 1-15 6.7L3 16" }),
|
|
1964
|
+
/* @__PURE__ */ jsx23("path", { d: "M8 16H3v5" })
|
|
1901
1965
|
] }),
|
|
1902
|
-
battery: /* @__PURE__ */
|
|
1903
|
-
/* @__PURE__ */
|
|
1904
|
-
/* @__PURE__ */
|
|
1966
|
+
battery: /* @__PURE__ */ jsxs20(Fragment7, { children: [
|
|
1967
|
+
/* @__PURE__ */ jsx23("rect", { x: "2", y: "7", width: "16", height: "10", rx: "2" }),
|
|
1968
|
+
/* @__PURE__ */ jsx23("path", { d: "M22 11v2M6 11v2M10 11v2" })
|
|
1905
1969
|
] }),
|
|
1906
|
-
cpu: /* @__PURE__ */
|
|
1907
|
-
/* @__PURE__ */
|
|
1908
|
-
/* @__PURE__ */
|
|
1909
|
-
/* @__PURE__ */
|
|
1970
|
+
cpu: /* @__PURE__ */ jsxs20(Fragment7, { children: [
|
|
1971
|
+
/* @__PURE__ */ jsx23("rect", { x: "4", y: "4", width: "16", height: "16", rx: "2" }),
|
|
1972
|
+
/* @__PURE__ */ jsx23("rect", { x: "9", y: "9", width: "6", height: "6" }),
|
|
1973
|
+
/* @__PURE__ */ jsx23("path", { d: "M15 2v2M15 20v2M2 15h2M2 9h2M20 15h2M20 9h2M9 2v2M9 20v2" })
|
|
1910
1974
|
] }),
|
|
1911
|
-
laptop: /* @__PURE__ */
|
|
1912
|
-
star: /* @__PURE__ */
|
|
1913
|
-
headset: /* @__PURE__ */
|
|
1914
|
-
rupee: /* @__PURE__ */
|
|
1915
|
-
award: /* @__PURE__ */
|
|
1916
|
-
/* @__PURE__ */
|
|
1917
|
-
/* @__PURE__ */
|
|
1975
|
+
laptop: /* @__PURE__ */ jsx23("path", { d: "M20 16V7a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v9m16 0H4m16 0 1.28 2.55a1 1 0 0 1-.9 1.45H3.62a1 1 0 0 1-.9-1.45L4 16" }),
|
|
1976
|
+
star: /* @__PURE__ */ jsx23("path", { d: "M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z" }),
|
|
1977
|
+
headset: /* @__PURE__ */ jsx23("path", { d: "M3 14h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-7a9 9 0 0 1 18 0v7a2 2 0 0 1-2 2h-1a2 2 0 0 1-2-2v-3a2 2 0 0 1 2-2h3" }),
|
|
1978
|
+
rupee: /* @__PURE__ */ jsx23("path", { d: "M6 3h12M6 8h12M6 13l8.5 8M6 13h3M9 13c6.67 0 6.67-10 0-10" }),
|
|
1979
|
+
award: /* @__PURE__ */ jsxs20(Fragment7, { children: [
|
|
1980
|
+
/* @__PURE__ */ jsx23("circle", { cx: "12", cy: "8", r: "6" }),
|
|
1981
|
+
/* @__PURE__ */ jsx23("path", { d: "M15.48 12.89 17 22l-5-3-5 3 1.52-9.11" })
|
|
1918
1982
|
] }),
|
|
1919
|
-
clock: /* @__PURE__ */
|
|
1920
|
-
/* @__PURE__ */
|
|
1921
|
-
/* @__PURE__ */
|
|
1983
|
+
clock: /* @__PURE__ */ jsxs20(Fragment7, { children: [
|
|
1984
|
+
/* @__PURE__ */ jsx23("circle", { cx: "12", cy: "12", r: "10" }),
|
|
1985
|
+
/* @__PURE__ */ jsx23("path", { d: "M12 6v6l4 2" })
|
|
1922
1986
|
] }),
|
|
1923
|
-
"map-pin": /* @__PURE__ */
|
|
1924
|
-
/* @__PURE__ */
|
|
1925
|
-
/* @__PURE__ */
|
|
1987
|
+
"map-pin": /* @__PURE__ */ jsxs20(Fragment7, { children: [
|
|
1988
|
+
/* @__PURE__ */ jsx23("path", { d: "M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z" }),
|
|
1989
|
+
/* @__PURE__ */ jsx23("circle", { cx: "12", cy: "10", r: "3" })
|
|
1926
1990
|
] }),
|
|
1927
|
-
phone: /* @__PURE__ */
|
|
1928
|
-
check: /* @__PURE__ */
|
|
1929
|
-
sparkles: /* @__PURE__ */
|
|
1930
|
-
/* @__PURE__ */
|
|
1931
|
-
/* @__PURE__ */
|
|
1991
|
+
phone: /* @__PURE__ */ jsx23("path", { d: "M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z" }),
|
|
1992
|
+
check: /* @__PURE__ */ jsx23("path", { d: "M20 6 9 17l-5-5" }),
|
|
1993
|
+
sparkles: /* @__PURE__ */ jsxs20(Fragment7, { children: [
|
|
1994
|
+
/* @__PURE__ */ jsx23("path", { d: "M12 3l1.9 5.1L19 10l-5.1 1.9L12 17l-1.9-5.1L5 10l5.1-1.9L12 3z" }),
|
|
1995
|
+
/* @__PURE__ */ jsx23("path", { d: "M5 3v4M3 5h4M19 17v4M17 19h4" })
|
|
1932
1996
|
] }),
|
|
1933
|
-
tag: /* @__PURE__ */
|
|
1934
|
-
/* @__PURE__ */
|
|
1935
|
-
/* @__PURE__ */
|
|
1997
|
+
tag: /* @__PURE__ */ jsxs20(Fragment7, { children: [
|
|
1998
|
+
/* @__PURE__ */ jsx23("path", { d: "M12.59 2.59A2 2 0 0 0 11.17 2H4a2 2 0 0 0-2 2v7.17a2 2 0 0 0 .59 1.42l8.7 8.7a2.43 2.43 0 0 0 3.42 0l6.58-6.58a2.43 2.43 0 0 0 0-3.42z" }),
|
|
1999
|
+
/* @__PURE__ */ jsx23("circle", { cx: "7.5", cy: "7.5", r: "1.5" })
|
|
1936
2000
|
] }),
|
|
1937
|
-
gift: /* @__PURE__ */
|
|
1938
|
-
/* @__PURE__ */
|
|
1939
|
-
/* @__PURE__ */
|
|
1940
|
-
/* @__PURE__ */
|
|
2001
|
+
gift: /* @__PURE__ */ jsxs20(Fragment7, { children: [
|
|
2002
|
+
/* @__PURE__ */ jsx23("rect", { x: "3", y: "8", width: "18", height: "4", rx: "1" }),
|
|
2003
|
+
/* @__PURE__ */ jsx23("path", { d: "M12 8v13M19 12v7a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2v-7" }),
|
|
2004
|
+
/* @__PURE__ */ jsx23("path", { d: "M7.5 8a2.5 2.5 0 0 1 0-5C10 3 12 8 12 8s2-5 4.5-5a2.5 2.5 0 0 1 0 5" })
|
|
1941
2005
|
] }),
|
|
1942
|
-
heart: /* @__PURE__ */
|
|
2006
|
+
heart: /* @__PURE__ */ jsx23("path", { d: "M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z" }),
|
|
1943
2007
|
// Controls (not offered to content).
|
|
1944
|
-
"chevron-left": /* @__PURE__ */
|
|
1945
|
-
"chevron-right": /* @__PURE__ */
|
|
1946
|
-
pause: /* @__PURE__ */
|
|
1947
|
-
play: /* @__PURE__ */
|
|
2008
|
+
"chevron-left": /* @__PURE__ */ jsx23("path", { d: "m15 18-6-6 6-6" }),
|
|
2009
|
+
"chevron-right": /* @__PURE__ */ jsx23("path", { d: "m9 18 6-6-6-6" }),
|
|
2010
|
+
pause: /* @__PURE__ */ jsx23("path", { d: "M8 5v14M16 5v14" }),
|
|
2011
|
+
play: /* @__PURE__ */ jsx23("path", { d: "M7 4.5v15l12-7.5-12-7.5Z" })
|
|
1948
2012
|
};
|
|
1949
2013
|
function NamedIcon({ name, size = 20, className = "dt-lp-icon" }) {
|
|
1950
2014
|
const paths = PATHS[name];
|
|
1951
2015
|
if (!paths) return null;
|
|
1952
|
-
return /* @__PURE__ */
|
|
2016
|
+
return /* @__PURE__ */ jsx23("svg", { ...base2, width: size, height: size, className, children: paths });
|
|
1953
2017
|
}
|
|
1954
2018
|
|
|
1955
2019
|
// src/tenant/HeroSlider.jsx
|
|
1956
|
-
import { jsx as
|
|
2020
|
+
import { jsx as jsx24, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
1957
2021
|
var reducedMotion = () => typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
|
|
1958
2022
|
function Slide({ slide, index, count, active, headingTag: H, media, eager }) {
|
|
1959
2023
|
const wide = media(slide.image, "wide");
|
|
1960
2024
|
const narrow = media(slide.mobile_image, "narrow");
|
|
1961
|
-
return /* @__PURE__ */
|
|
2025
|
+
return /* @__PURE__ */ jsxs21(
|
|
1962
2026
|
"div",
|
|
1963
2027
|
{
|
|
1964
2028
|
className: `dt-lp-slide dt-lp-slide--${slide.align} dt-lp-slide--overlay-${wide || narrow ? slide.overlay : "none"}${wide || narrow ? " dt-lp-slide--image" : ""}`,
|
|
@@ -1968,15 +2032,15 @@ function Slide({ slide, index, count, active, headingTag: H, media, eager }) {
|
|
|
1968
2032
|
"aria-hidden": active ? void 0 : "true",
|
|
1969
2033
|
"data-active": active ? "" : void 0,
|
|
1970
2034
|
children: [
|
|
1971
|
-
wide || narrow ? /* @__PURE__ */
|
|
1972
|
-
narrow && wide ? /* @__PURE__ */
|
|
1973
|
-
/* @__PURE__ */
|
|
2035
|
+
wide || narrow ? /* @__PURE__ */ jsxs21("picture", { className: "dt-lp-slide-media", children: [
|
|
2036
|
+
narrow && wide ? /* @__PURE__ */ jsx24("source", { media: "(max-width: 640px)", srcSet: narrow }) : null,
|
|
2037
|
+
/* @__PURE__ */ jsx24("img", { src: wide || narrow, alt: slide.image && slide.image.alt || "", loading: eager ? "eager" : "lazy", decoding: "async" })
|
|
1974
2038
|
] }) : null,
|
|
1975
|
-
/* @__PURE__ */
|
|
1976
|
-
slide.eyebrow ? /* @__PURE__ */
|
|
1977
|
-
/* @__PURE__ */
|
|
1978
|
-
slide.text ? /* @__PURE__ */
|
|
1979
|
-
slide.cta_label && slide.cta_href ? /* @__PURE__ */
|
|
2039
|
+
/* @__PURE__ */ jsx24("div", { className: "dt-lp-wrap dt-lp-slide-body", children: /* @__PURE__ */ jsxs21("div", { className: "dt-lp-slide-copy", children: [
|
|
2040
|
+
slide.eyebrow ? /* @__PURE__ */ jsx24("p", { className: "dt-lp-eyebrow dt-lp-slide-eyebrow", children: slide.eyebrow }) : null,
|
|
2041
|
+
/* @__PURE__ */ jsx24(H, { className: "dt-lp-slide-heading", children: slide.heading }),
|
|
2042
|
+
slide.text ? /* @__PURE__ */ jsx24("p", { className: "dt-lp-slide-text", children: slide.text }) : null,
|
|
2043
|
+
slide.cta_label && slide.cta_href ? /* @__PURE__ */ jsx24(SmartLink, { href: slide.cta_href, className: "dt-lp-btn dt-lp-btn--lg dt-lp-btn--primary dt-lp-slide-cta", tabIndex: active ? void 0 : -1, children: slide.cta_label }) : null
|
|
1980
2044
|
] }) })
|
|
1981
2045
|
]
|
|
1982
2046
|
}
|
|
@@ -1987,17 +2051,17 @@ function HeroSlider({ id, slides = [], height = "standard", autoplay = true, int
|
|
|
1987
2051
|
const [index, setIndex] = useState5(0);
|
|
1988
2052
|
const [playing, setPlaying] = useState5(false);
|
|
1989
2053
|
const [hold, setHold] = useState5(false);
|
|
1990
|
-
const touch =
|
|
2054
|
+
const touch = useRef5(null);
|
|
1991
2055
|
const go = useCallback2((i) => setIndex((i % count + count) % count), [count]);
|
|
1992
|
-
|
|
2056
|
+
useEffect4(() => {
|
|
1993
2057
|
setPlaying(Boolean(autoplay) && count > 1 && !reducedMotion());
|
|
1994
2058
|
}, [autoplay, count]);
|
|
1995
|
-
|
|
2059
|
+
useEffect4(() => {
|
|
1996
2060
|
if (!playing || hold || count < 2) return void 0;
|
|
1997
2061
|
const t = setTimeout(() => go(index + 1), Math.max(3, Number(interval) || 6) * 1e3);
|
|
1998
2062
|
return () => clearTimeout(t);
|
|
1999
2063
|
}, [playing, hold, index, interval, count, go]);
|
|
2000
|
-
|
|
2064
|
+
useEffect4(() => {
|
|
2001
2065
|
if (index >= count) setIndex(0);
|
|
2002
2066
|
}, [count, index]);
|
|
2003
2067
|
if (!count) return null;
|
|
@@ -2020,7 +2084,7 @@ function HeroSlider({ id, slides = [], height = "standard", autoplay = true, int
|
|
|
2020
2084
|
touch.current = null;
|
|
2021
2085
|
if (Math.abs(dx) > 40) go(index + (dx < 0 ? 1 : -1));
|
|
2022
2086
|
};
|
|
2023
|
-
return /* @__PURE__ */
|
|
2087
|
+
return /* @__PURE__ */ jsxs21(
|
|
2024
2088
|
"section",
|
|
2025
2089
|
{
|
|
2026
2090
|
id,
|
|
@@ -2035,12 +2099,12 @@ function HeroSlider({ id, slides = [], height = "standard", autoplay = true, int
|
|
|
2035
2099
|
onTouchStart,
|
|
2036
2100
|
onTouchEnd,
|
|
2037
2101
|
children: [
|
|
2038
|
-
/* @__PURE__ */
|
|
2039
|
-
count > 1 ? /* @__PURE__ */
|
|
2040
|
-
/* @__PURE__ */
|
|
2041
|
-
/* @__PURE__ */
|
|
2042
|
-
/* @__PURE__ */
|
|
2043
|
-
autoplay ? /* @__PURE__ */
|
|
2102
|
+
/* @__PURE__ */ jsx24("div", { className: "dt-lp-slides", "aria-live": playing && !hold ? "off" : "polite", children: slides.map((s, i) => /* @__PURE__ */ jsx24(Slide, { slide: s, index: i, count, active: i === index, eager: i === 0, headingTag: first && i === 0 ? "h1" : "h2", media }, i)) }),
|
|
2103
|
+
count > 1 ? /* @__PURE__ */ jsxs21("div", { className: "dt-lp-slider-controls", children: [
|
|
2104
|
+
/* @__PURE__ */ jsx24("button", { type: "button", className: "dt-lp-slider-btn", "aria-label": "Previous slide", onClick: () => go(index - 1), children: /* @__PURE__ */ jsx24(NamedIcon, { name: "chevron-left", size: 20 }) }),
|
|
2105
|
+
/* @__PURE__ */ jsx24("div", { className: "dt-lp-slider-dots", children: slides.map((s, i) => /* @__PURE__ */ jsx24("button", { type: "button", className: "dt-lp-slider-dot", "aria-label": `Go to slide ${i + 1}`, "aria-current": i === index ? "true" : void 0, onClick: () => go(i) }, i)) }),
|
|
2106
|
+
/* @__PURE__ */ jsx24("button", { type: "button", className: "dt-lp-slider-btn", "aria-label": "Next slide", onClick: () => go(index + 1), children: /* @__PURE__ */ jsx24(NamedIcon, { name: "chevron-right", size: 20 }) }),
|
|
2107
|
+
autoplay ? /* @__PURE__ */ jsx24("button", { type: "button", className: "dt-lp-slider-btn", "aria-label": playing ? "Pause slides" : "Play slides", onClick: () => setPlaying((p) => !p), children: /* @__PURE__ */ jsx24(NamedIcon, { name: playing ? "pause" : "play", size: 18 }) }) : null
|
|
2044
2108
|
] }) : null
|
|
2045
2109
|
]
|
|
2046
2110
|
}
|
|
@@ -2049,69 +2113,69 @@ function HeroSlider({ id, slides = [], height = "standard", autoplay = true, int
|
|
|
2049
2113
|
|
|
2050
2114
|
// src/tenant/blocks.jsx
|
|
2051
2115
|
import { useState as useState6 } from "react";
|
|
2052
|
-
import { jsx as
|
|
2116
|
+
import { jsx as jsx25, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
2053
2117
|
var hid = (id) => `${id}-title`;
|
|
2054
|
-
var Heading = ({ id, title: title2, intro: intro2, align = "center" }) => title2 ? /* @__PURE__ */
|
|
2118
|
+
var Heading = ({ id, title: title2, intro: intro2, align = "center" }) => title2 ? /* @__PURE__ */ jsx25(SectionIntro, { id: hid(id), title: title2, body: intro2, align }) : null;
|
|
2055
2119
|
function SlotSection({ id, title: title2, intro: intro2, tone: tone2, slot, ...props }) {
|
|
2056
2120
|
const body = typeof slot === "function" ? slot({ title: title2, intro: intro2, ...props }) : slot;
|
|
2057
2121
|
if (!body) return null;
|
|
2058
|
-
return /* @__PURE__ */
|
|
2059
|
-
/* @__PURE__ */
|
|
2060
|
-
/* @__PURE__ */
|
|
2122
|
+
return /* @__PURE__ */ jsxs22(Section, { id, labelledBy: title2 ? hid(id) : void 0, tone: tone2, className: "dt-lp-slot", children: [
|
|
2123
|
+
/* @__PURE__ */ jsx25(Heading, { id, title: title2, intro: intro2, align: "start" }),
|
|
2124
|
+
/* @__PURE__ */ jsx25("div", { className: "dt-lp-slot-body", children: body })
|
|
2061
2125
|
] });
|
|
2062
2126
|
}
|
|
2063
2127
|
function PromoBanner({ id, eyebrow, heading: heading2, text, cta_label: label, cta_href: href, image, style = "brand", media }) {
|
|
2064
2128
|
const src = media(image, "wide");
|
|
2065
|
-
return /* @__PURE__ */
|
|
2066
|
-
/* @__PURE__ */
|
|
2067
|
-
eyebrow ? /* @__PURE__ */
|
|
2068
|
-
/* @__PURE__ */
|
|
2069
|
-
text ? /* @__PURE__ */
|
|
2070
|
-
label && href ? /* @__PURE__ */
|
|
2129
|
+
return /* @__PURE__ */ jsx25("section", { id, "aria-labelledby": hid(id), className: "dt-lp-section dt-lp-promo-wrap", children: /* @__PURE__ */ jsx25("div", { className: "dt-lp-wrap", children: /* @__PURE__ */ jsxs22("div", { className: `dt-lp-promo dt-lp-promo--${style}${src ? " dt-lp-promo--image" : ""}`, children: [
|
|
2130
|
+
/* @__PURE__ */ jsxs22("div", { className: "dt-lp-promo-copy", children: [
|
|
2131
|
+
eyebrow ? /* @__PURE__ */ jsx25("p", { className: "dt-lp-eyebrow dt-lp-eyebrow--inverse", children: eyebrow }) : null,
|
|
2132
|
+
/* @__PURE__ */ jsx25("h2", { id: hid(id), className: "dt-lp-h2 dt-lp-promo-heading", children: heading2 }),
|
|
2133
|
+
text ? /* @__PURE__ */ jsx25("p", { className: "dt-lp-promo-text", children: text }) : null,
|
|
2134
|
+
label && href ? /* @__PURE__ */ jsx25(SmartLink, { href, className: "dt-lp-btn dt-lp-btn--lg dt-lp-btn--inverse", children: label }) : null
|
|
2071
2135
|
] }),
|
|
2072
|
-
src ? /* @__PURE__ */
|
|
2136
|
+
src ? /* @__PURE__ */ jsx25("img", { className: "dt-lp-promo-img", src, alt: image.alt || "", loading: "lazy", decoding: "async" }) : null
|
|
2073
2137
|
] }) }) });
|
|
2074
2138
|
}
|
|
2075
2139
|
function TrustBadges({ id, title: title2, intro: intro2, items = [], tone: tone2 }) {
|
|
2076
|
-
return /* @__PURE__ */
|
|
2077
|
-
/* @__PURE__ */
|
|
2078
|
-
/* @__PURE__ */
|
|
2079
|
-
/* @__PURE__ */
|
|
2080
|
-
/* @__PURE__ */
|
|
2081
|
-
/* @__PURE__ */
|
|
2082
|
-
it.text ? /* @__PURE__ */
|
|
2140
|
+
return /* @__PURE__ */ jsxs22(Section, { id, labelledBy: title2 ? hid(id) : void 0, tone: tone2, children: [
|
|
2141
|
+
/* @__PURE__ */ jsx25(Heading, { id, title: title2, intro: intro2 }),
|
|
2142
|
+
/* @__PURE__ */ jsx25("ul", { className: "dt-lp-tgrid dt-lp-tgrid--4", children: items.map((it, i) => /* @__PURE__ */ jsxs22("li", { className: "dt-lp-card dt-lp-tcard", children: [
|
|
2143
|
+
/* @__PURE__ */ jsx25("span", { className: "dt-lp-icon-tile", children: /* @__PURE__ */ jsx25(NamedIcon, { name: it.icon, size: 22 }) }),
|
|
2144
|
+
/* @__PURE__ */ jsxs22("div", { className: "dt-lp-card-text", children: [
|
|
2145
|
+
/* @__PURE__ */ jsx25("h3", { className: "dt-lp-h3", children: it.title }),
|
|
2146
|
+
it.text ? /* @__PURE__ */ jsx25("p", { children: it.text }) : null
|
|
2083
2147
|
] })
|
|
2084
2148
|
] }, i)) })
|
|
2085
2149
|
] });
|
|
2086
2150
|
}
|
|
2087
2151
|
function CtaCards({ id, title: title2, items = [], tone: tone2 }) {
|
|
2088
|
-
return /* @__PURE__ */
|
|
2089
|
-
/* @__PURE__ */
|
|
2090
|
-
/* @__PURE__ */
|
|
2091
|
-
/* @__PURE__ */
|
|
2092
|
-
/* @__PURE__ */
|
|
2093
|
-
/* @__PURE__ */
|
|
2094
|
-
it.text ? /* @__PURE__ */
|
|
2095
|
-
it.cta_label ? /* @__PURE__ */
|
|
2152
|
+
return /* @__PURE__ */ jsxs22(Section, { id, labelledBy: title2 ? hid(id) : void 0, tone: tone2, children: [
|
|
2153
|
+
/* @__PURE__ */ jsx25(Heading, { id, title: title2 }),
|
|
2154
|
+
/* @__PURE__ */ jsx25("ul", { className: `dt-lp-tgrid dt-lp-tgrid--${Math.min(items.length, 4) || 1}`, children: items.map((it, i) => /* @__PURE__ */ jsx25("li", { children: /* @__PURE__ */ jsxs22(SmartLink, { href: it.cta_href, className: "dt-lp-card dt-lp-tcard dt-lp-ctacard", children: [
|
|
2155
|
+
/* @__PURE__ */ jsx25("span", { className: "dt-lp-icon-tile", children: /* @__PURE__ */ jsx25(NamedIcon, { name: it.icon, size: 22 }) }),
|
|
2156
|
+
/* @__PURE__ */ jsxs22("div", { className: "dt-lp-card-text", children: [
|
|
2157
|
+
/* @__PURE__ */ jsx25("h3", { className: "dt-lp-h3", children: it.title }),
|
|
2158
|
+
it.text ? /* @__PURE__ */ jsx25("p", { children: it.text }) : null,
|
|
2159
|
+
it.cta_label ? /* @__PURE__ */ jsxs22("span", { className: "dt-lp-textlink", children: [
|
|
2096
2160
|
it.cta_label,
|
|
2097
2161
|
" ",
|
|
2098
|
-
/* @__PURE__ */
|
|
2162
|
+
/* @__PURE__ */ jsx25(NamedIcon, { name: "chevron-right", size: 16 })
|
|
2099
2163
|
] }) : null
|
|
2100
2164
|
] })
|
|
2101
2165
|
] }) }, i)) })
|
|
2102
2166
|
] });
|
|
2103
2167
|
}
|
|
2104
2168
|
function Testimonials({ id, title: title2, items = [], tone: tone2 }) {
|
|
2105
|
-
return /* @__PURE__ */
|
|
2106
|
-
/* @__PURE__ */
|
|
2107
|
-
/* @__PURE__ */
|
|
2169
|
+
return /* @__PURE__ */ jsxs22(Section, { id, labelledBy: title2 ? hid(id) : void 0, tone: tone2, children: [
|
|
2170
|
+
/* @__PURE__ */ jsx25(Heading, { id, title: title2 }),
|
|
2171
|
+
/* @__PURE__ */ jsx25("ul", { className: "dt-lp-tgrid dt-lp-tgrid--3", children: items.map((it, i) => {
|
|
2108
2172
|
const stars = Math.max(1, Math.min(5, Number(it.rating) || 5));
|
|
2109
|
-
return /* @__PURE__ */
|
|
2110
|
-
/* @__PURE__ */
|
|
2111
|
-
/* @__PURE__ */
|
|
2112
|
-
/* @__PURE__ */
|
|
2113
|
-
/* @__PURE__ */
|
|
2114
|
-
it.detail ? /* @__PURE__ */
|
|
2173
|
+
return /* @__PURE__ */ jsxs22("li", { className: "dt-lp-card dt-lp-quote", children: [
|
|
2174
|
+
/* @__PURE__ */ jsx25("p", { className: "dt-lp-stars", "aria-label": `${stars} out of 5 stars`, children: Array.from({ length: 5 }, (_, s) => /* @__PURE__ */ jsx25("span", { "aria-hidden": "true", className: s < stars ? "dt-lp-star dt-lp-star--on" : "dt-lp-star", children: "\u2605" }, s)) }),
|
|
2175
|
+
/* @__PURE__ */ jsx25("blockquote", { children: /* @__PURE__ */ jsx25("p", { children: it.quote }) }),
|
|
2176
|
+
/* @__PURE__ */ jsxs22("p", { className: "dt-lp-quote-by", children: [
|
|
2177
|
+
/* @__PURE__ */ jsx25("strong", { children: it.name }),
|
|
2178
|
+
it.detail ? /* @__PURE__ */ jsxs22("span", { children: [
|
|
2115
2179
|
" \xB7 ",
|
|
2116
2180
|
it.detail
|
|
2117
2181
|
] }) : null
|
|
@@ -2121,29 +2185,29 @@ function Testimonials({ id, title: title2, items = [], tone: tone2 }) {
|
|
|
2121
2185
|
] });
|
|
2122
2186
|
}
|
|
2123
2187
|
function FaqSection({ id, title: title2, intro: intro2, items = [], tone: tone2 }) {
|
|
2124
|
-
return /* @__PURE__ */
|
|
2188
|
+
return /* @__PURE__ */ jsx25(Faq, { id, title: title2, intro: intro2, items, tone: tone2, openFirst: true });
|
|
2125
2189
|
}
|
|
2126
2190
|
function RichText({ id, title: title2, html, width = "narrow", tone: tone2 }) {
|
|
2127
|
-
return /* @__PURE__ */
|
|
2128
|
-
title2 ? /* @__PURE__ */
|
|
2129
|
-
/* @__PURE__ */
|
|
2191
|
+
return /* @__PURE__ */ jsxs22(Section, { id, labelledBy: title2 ? hid(id) : void 0, tone: tone2, narrow: width === "narrow", children: [
|
|
2192
|
+
title2 ? /* @__PURE__ */ jsx25("h2", { id: hid(id), className: "dt-lp-h2", children: title2 }) : null,
|
|
2193
|
+
/* @__PURE__ */ jsx25("div", { className: "dt-lp-prose", dangerouslySetInnerHTML: { __html: sanitizeRichText(html) } })
|
|
2130
2194
|
] });
|
|
2131
2195
|
}
|
|
2132
2196
|
function UspStrip({ id, items = [], tone: tone2 = "tinted" }) {
|
|
2133
|
-
return /* @__PURE__ */
|
|
2134
|
-
/* @__PURE__ */
|
|
2135
|
-
/* @__PURE__ */
|
|
2136
|
-
/* @__PURE__ */
|
|
2137
|
-
it.text ? /* @__PURE__ */
|
|
2197
|
+
return /* @__PURE__ */ jsx25("section", { id, "aria-label": "Highlights", className: `dt-lp-usp dt-lp-tone--${tone2}`, children: /* @__PURE__ */ jsx25("div", { className: "dt-lp-wrap", children: /* @__PURE__ */ jsx25("ul", { className: "dt-lp-usp-list", children: items.map((it, i) => /* @__PURE__ */ jsxs22("li", { className: "dt-lp-usp-item", children: [
|
|
2198
|
+
/* @__PURE__ */ jsx25(NamedIcon, { name: it.icon, size: 20, className: "dt-lp-icon dt-lp-usp-icon" }),
|
|
2199
|
+
/* @__PURE__ */ jsxs22("span", { children: [
|
|
2200
|
+
/* @__PURE__ */ jsx25("strong", { children: it.title }),
|
|
2201
|
+
it.text ? /* @__PURE__ */ jsx25("span", { className: "dt-lp-usp-text", children: it.text }) : null
|
|
2138
2202
|
] })
|
|
2139
2203
|
] }, i)) }) }) });
|
|
2140
2204
|
}
|
|
2141
2205
|
function BrandStrip({ id, title: title2, items = [], tone: tone2, media }) {
|
|
2142
|
-
return /* @__PURE__ */
|
|
2143
|
-
/* @__PURE__ */
|
|
2144
|
-
/* @__PURE__ */
|
|
2206
|
+
return /* @__PURE__ */ jsxs22(Section, { id, labelledBy: title2 ? hid(id) : void 0, tone: tone2, className: "dt-lp-brands", children: [
|
|
2207
|
+
/* @__PURE__ */ jsx25(Heading, { id, title: title2 }),
|
|
2208
|
+
/* @__PURE__ */ jsx25("ul", { className: "dt-lp-brand-list", children: items.map((it, i) => {
|
|
2145
2209
|
const src = media(it.logo, "logo");
|
|
2146
|
-
return /* @__PURE__ */
|
|
2210
|
+
return /* @__PURE__ */ jsx25("li", { className: "dt-lp-brand-item", children: src ? /* @__PURE__ */ jsx25("img", { src, alt: it.name, loading: "lazy", decoding: "async" }) : /* @__PURE__ */ jsx25("span", { children: it.name }) }, i);
|
|
2147
2211
|
}) })
|
|
2148
2212
|
] });
|
|
2149
2213
|
}
|
|
@@ -2162,36 +2226,36 @@ function Newsletter({ id, title: title2, text, button_label: button, consent_tex
|
|
|
2162
2226
|
setState({ status: "error", message: err && err.message || "Could not subscribe. Please try again." });
|
|
2163
2227
|
}
|
|
2164
2228
|
};
|
|
2165
|
-
return /* @__PURE__ */
|
|
2166
|
-
/* @__PURE__ */
|
|
2167
|
-
state.status === "done" ? /* @__PURE__ */
|
|
2168
|
-
/* @__PURE__ */
|
|
2169
|
-
/* @__PURE__ */
|
|
2170
|
-
/* @__PURE__ */
|
|
2171
|
-
/* @__PURE__ */
|
|
2229
|
+
return /* @__PURE__ */ jsxs22(Section, { id, labelledBy: hid(id), tone: tone2, narrow: true, children: [
|
|
2230
|
+
/* @__PURE__ */ jsx25(SectionIntro, { id: hid(id), title: title2, body: text, align: "center" }),
|
|
2231
|
+
state.status === "done" ? /* @__PURE__ */ jsx25("p", { className: "dt-lp-news-done", role: "status", children: state.message }) : /* @__PURE__ */ jsxs22("form", { className: "dt-lp-news", onSubmit: submit, children: [
|
|
2232
|
+
/* @__PURE__ */ jsxs22("div", { className: "dt-lp-news-row", children: [
|
|
2233
|
+
/* @__PURE__ */ jsx25("label", { className: "dt-lp-sr", htmlFor: `${id}-email`, children: "Email" }),
|
|
2234
|
+
/* @__PURE__ */ jsx25("input", { id: `${id}-email`, type: "email", required: true, autoComplete: "email", placeholder: "you@example.com", value: email, onChange: (e) => setEmail(e.target.value), className: "dt-lp-input" }),
|
|
2235
|
+
/* @__PURE__ */ jsx25("button", { type: "submit", className: "dt-lp-btn dt-lp-btn--md dt-lp-btn--primary", disabled: !consent || state.status === "busy", "aria-busy": state.status === "busy" ? "true" : void 0, children: button })
|
|
2172
2236
|
] }),
|
|
2173
|
-
/* @__PURE__ */
|
|
2174
|
-
/* @__PURE__ */
|
|
2175
|
-
/* @__PURE__ */
|
|
2237
|
+
/* @__PURE__ */ jsxs22("label", { className: "dt-lp-news-consent", children: [
|
|
2238
|
+
/* @__PURE__ */ jsx25("input", { type: "checkbox", checked: consent, onChange: (e) => setConsent(e.target.checked), required: true }),
|
|
2239
|
+
/* @__PURE__ */ jsx25("span", { children: consentText })
|
|
2176
2240
|
] }),
|
|
2177
|
-
state.status === "error" ? /* @__PURE__ */
|
|
2241
|
+
state.status === "error" ? /* @__PURE__ */ jsx25("p", { className: "dt-lp-news-error", role: "alert", children: state.message }) : null
|
|
2178
2242
|
] })
|
|
2179
2243
|
] });
|
|
2180
2244
|
}
|
|
2181
2245
|
function Gallery({ id, title: title2, items = [], columns = "3", tone: tone2, media }) {
|
|
2182
2246
|
const shown = items.map((it) => ({ ...it, src: media(it.image, "gallery") })).filter((it) => it.src);
|
|
2183
2247
|
if (!shown.length) return null;
|
|
2184
|
-
return /* @__PURE__ */
|
|
2185
|
-
/* @__PURE__ */
|
|
2186
|
-
/* @__PURE__ */
|
|
2187
|
-
/* @__PURE__ */
|
|
2188
|
-
it.caption ? /* @__PURE__ */
|
|
2248
|
+
return /* @__PURE__ */ jsxs22(Section, { id, labelledBy: title2 ? hid(id) : void 0, tone: tone2, children: [
|
|
2249
|
+
/* @__PURE__ */ jsx25(Heading, { id, title: title2 }),
|
|
2250
|
+
/* @__PURE__ */ jsx25("ul", { className: `dt-lp-gallery dt-lp-gallery--${columns}`, children: shown.map((it, i) => /* @__PURE__ */ jsx25("li", { children: /* @__PURE__ */ jsxs22("figure", { children: [
|
|
2251
|
+
/* @__PURE__ */ jsx25("img", { src: it.src, alt: it.image.alt || it.caption || "", loading: "lazy", decoding: "async" }),
|
|
2252
|
+
it.caption ? /* @__PURE__ */ jsx25("figcaption", { children: it.caption }) : null
|
|
2189
2253
|
] }) }, i)) })
|
|
2190
2254
|
] });
|
|
2191
2255
|
}
|
|
2192
2256
|
|
|
2193
2257
|
// src/tenant/TenantPage.jsx
|
|
2194
|
-
import { jsx as
|
|
2258
|
+
import { jsx as jsx26 } from "react/jsx-runtime";
|
|
2195
2259
|
var TENANT_BLOCKS = {
|
|
2196
2260
|
hero_slider: HeroSlider,
|
|
2197
2261
|
featured: SlotSection,
|
|
@@ -2236,15 +2300,15 @@ function TenantPage({
|
|
|
2236
2300
|
const ctx = useMemo(() => ({ brand: { id: "tenant", name: storeName, primary: vars.theme.primary }, linkComponent, onBookDemo: null, home: true }), [storeName, vars.theme.primary, linkComponent]);
|
|
2237
2301
|
const media = (ref, variant) => ref && ref.media_id != null ? resolveMedia(ref, variant) : null;
|
|
2238
2302
|
const visible = doc.sections.filter((s) => s.enabled && TENANT_BLOCKS[s.type]);
|
|
2239
|
-
return /* @__PURE__ */
|
|
2303
|
+
return /* @__PURE__ */ jsx26(LandingProvider, { value: ctx, children: /* @__PURE__ */ jsx26("div", { className: `dt-landing dt-lp-tenant ${className}`.trim(), style: vars.style, "data-theme": vars.theme.mode === "auto" ? void 0 : vars.theme.mode, children: visible.map((s, i) => {
|
|
2240
2304
|
const Block = TENANT_BLOCKS[s.type];
|
|
2241
|
-
return /* @__PURE__ */
|
|
2305
|
+
return /* @__PURE__ */ jsx26(SectionBoundary, { children: /* @__PURE__ */ jsx26(Block, { ...s.props, id: `s-${s.id}`, first: i === 0 && headingStart === 1, media, slot: slots[s.type], onSubscribe }) }, s.id);
|
|
2242
2306
|
}) }) });
|
|
2243
2307
|
}
|
|
2244
2308
|
|
|
2245
2309
|
// src/tenant/TemplateRegion.jsx
|
|
2246
|
-
import { Fragment as
|
|
2247
|
-
import { jsx as
|
|
2310
|
+
import { Fragment as Fragment8, useMemo as useMemo2 } from "react";
|
|
2311
|
+
import { jsx as jsx27 } from "react/jsx-runtime";
|
|
2248
2312
|
var noMedia2 = () => null;
|
|
2249
2313
|
function TemplateRegion({
|
|
2250
2314
|
blocks = [],
|
|
@@ -2258,14 +2322,14 @@ function TemplateRegion({
|
|
|
2258
2322
|
const vars = useMemo2(() => themeVars(theme), [theme]);
|
|
2259
2323
|
const ctx = useMemo2(() => ({ brand: { id: "tenant", name: storeName, primary: vars.theme.primary }, linkComponent, onBookDemo: null, home: false }), [storeName, vars.theme.primary, linkComponent]);
|
|
2260
2324
|
const media = (ref, variant) => ref && ref.media_id != null ? resolveMedia(ref, variant) : null;
|
|
2261
|
-
return /* @__PURE__ */
|
|
2325
|
+
return /* @__PURE__ */ jsx27(Fragment8, { children: blocks.filter((b) => b && b.enabled !== false).map((b) => {
|
|
2262
2326
|
const Slot = slots[b.type];
|
|
2263
2327
|
if (Slot) {
|
|
2264
|
-
return /* @__PURE__ */
|
|
2328
|
+
return /* @__PURE__ */ jsx27(SectionBoundary, { children: /* @__PURE__ */ jsx27(Slot, { block: b, props: b.props || {} }) }, b.id);
|
|
2265
2329
|
}
|
|
2266
2330
|
const Block = TENANT_BLOCKS[b.type];
|
|
2267
2331
|
if (!Block || Block === TENANT_BLOCKS.featured) return null;
|
|
2268
|
-
return /* @__PURE__ */
|
|
2332
|
+
return /* @__PURE__ */ jsx27(SectionBoundary, { children: /* @__PURE__ */ jsx27(LandingProvider, { value: ctx, children: /* @__PURE__ */ jsx27("div", { className: `dt-landing dt-lp-tenant dt-lp-region ${className}`.trim(), style: vars.style, "data-block": b.type, children: /* @__PURE__ */ jsx27(Block, { ...b.props, id: `b-${b.id}`, first: false, media, slot: null, onSubscribe: null }) }) }) }, b.id);
|
|
2269
2333
|
}) });
|
|
2270
2334
|
}
|
|
2271
2335
|
|
|
@@ -2565,6 +2629,7 @@ export {
|
|
|
2565
2629
|
Wrap,
|
|
2566
2630
|
brandStyle,
|
|
2567
2631
|
brands,
|
|
2632
|
+
buildSsoUrl,
|
|
2568
2633
|
createDemoIsland,
|
|
2569
2634
|
fetchDemoAccounts,
|
|
2570
2635
|
getBrand,
|