@builder.io/sdk-react 1.0.2 → 1.0.4

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.
Files changed (93) hide show
  1. package/README.md +4 -3
  2. package/lib/browser/blocks-exports.cjs +187 -0
  3. package/lib/browser/blocks-exports.mjs +3441 -0
  4. package/lib/browser/index.cjs +1 -187
  5. package/lib/browser/index.mjs +26 -3449
  6. package/lib/browser/{server-entry-a595b1cf.cjs → server-entry-093e302c.cjs} +1 -1
  7. package/lib/browser/{server-entry-f6f9bdcb.js → server-entry-7839c812.js} +1 -1
  8. package/lib/browser/server-entry.cjs +1 -1
  9. package/lib/browser/server-entry.mjs +1 -1
  10. package/lib/edge/blocks-0fc8e8d2.js +3385 -0
  11. package/lib/edge/blocks-exports.cjs +1 -0
  12. package/lib/edge/blocks-exports.mjs +16 -0
  13. package/lib/edge/blocks-f8688fcb.cjs +32 -0
  14. package/lib/edge/button-61181684.cjs +1 -0
  15. package/lib/edge/button-d9bbef90.js +29 -0
  16. package/lib/edge/columns-d152e266.cjs +28 -0
  17. package/lib/edge/columns-f7a9bca7.js +156 -0
  18. package/lib/edge/content-variants-cdcbcdd8.js +1711 -0
  19. package/lib/edge/content-variants-d2500971.cjs +133 -0
  20. package/lib/edge/custom-code-33b73ed1.js +44 -0
  21. package/lib/edge/custom-code-7390ba8b.cjs +1 -0
  22. package/lib/edge/dynamic-blocks-exports.cjs +39 -0
  23. package/lib/edge/dynamic-blocks-exports.mjs +37 -0
  24. package/lib/edge/dynamic-renderer-b5124984.js +9 -0
  25. package/lib/edge/dynamic-renderer-c00b8bcb.cjs +1 -0
  26. package/lib/edge/embed-11e03fa7.js +38 -0
  27. package/lib/edge/embed-9edce7df.cjs +1 -0
  28. package/lib/edge/form-ac531791.cjs +1 -0
  29. package/lib/edge/form-fb5fd55e.js +194 -0
  30. package/lib/edge/fragment-015b0912.js +8 -0
  31. package/lib/edge/fragment-61ef192d.cjs +1 -0
  32. package/lib/edge/get-class-prop-name-caee6506.cjs +1 -0
  33. package/lib/edge/get-class-prop-name-f22d7d53.js +18 -0
  34. package/lib/edge/image-6a3654d5.js +118 -0
  35. package/lib/edge/image-e4128296.cjs +17 -0
  36. package/lib/edge/img-317659e2.js +21 -0
  37. package/lib/edge/img-f2eeaa75.cjs +1 -0
  38. package/lib/edge/index.cjs +1 -207
  39. package/lib/edge/index.mjs +25 -5922
  40. package/lib/edge/input-526ea905.js +21 -0
  41. package/lib/edge/input-562438c4.cjs +1 -0
  42. package/lib/edge/section-68fbc212.js +26 -0
  43. package/lib/edge/section-70c8b709.cjs +1 -0
  44. package/lib/edge/select-17802399.js +21 -0
  45. package/lib/edge/select-d87a6280.cjs +1 -0
  46. package/lib/edge/server-entry-88f58ed4.cjs +2 -0
  47. package/lib/edge/{server-entry-f6f9bdcb.js → server-entry-e0830caf.js} +373 -372
  48. package/lib/edge/server-entry.cjs +1 -1
  49. package/lib/edge/server-entry.mjs +1 -1
  50. package/lib/edge/slot-39b50f6b.cjs +1 -0
  51. package/lib/edge/slot-eb244885.js +33 -0
  52. package/lib/edge/submit-button-13d8d5a7.cjs +1 -0
  53. package/lib/edge/submit-button-71dd4015.js +8 -0
  54. package/lib/edge/symbol-bf773f2a.js +78 -0
  55. package/lib/edge/symbol-ee31bb7f.cjs +1 -0
  56. package/lib/edge/text-15f0a6f4.js +18 -0
  57. package/lib/edge/text-7fdbde16.cjs +1 -0
  58. package/lib/edge/video-66b20833.js +106 -0
  59. package/lib/edge/video-702696a8.cjs +1 -0
  60. package/lib/node/blocks-exports.cjs +227 -0
  61. package/lib/node/blocks-exports.mjs +3548 -0
  62. package/lib/node/index.cjs +1 -227
  63. package/lib/node/index.mjs +27 -3556
  64. package/lib/node/{server-entry-31b5d683.cjs → server-entry-0e638a4f.cjs} +1 -1
  65. package/lib/node/{server-entry-c2b6d198.js → server-entry-e1cc0803.js} +1 -1
  66. package/lib/node/server-entry.cjs +1 -1
  67. package/lib/node/server-entry.mjs +1 -1
  68. package/package.json +19 -13
  69. package/types/blocks/button/index.d.ts +1 -0
  70. package/types/blocks/columns/index.d.ts +1 -0
  71. package/types/blocks/custom-code/index.d.ts +1 -0
  72. package/types/blocks/embed/index.d.ts +1 -0
  73. package/types/blocks/form/form/index.d.ts +1 -0
  74. package/types/blocks/form/input/index.d.ts +1 -0
  75. package/types/blocks/form/select/index.d.ts +1 -0
  76. package/types/blocks/form/submit-button/index.d.ts +1 -0
  77. package/types/blocks/fragment/index.d.ts +1 -0
  78. package/types/blocks/image/index.d.ts +1 -0
  79. package/types/blocks/img/index.d.ts +1 -0
  80. package/types/blocks/raw-text/index.d.ts +1 -0
  81. package/types/blocks/section/index.d.ts +1 -0
  82. package/types/blocks/slot/index.d.ts +1 -0
  83. package/types/blocks/symbol/index.d.ts +1 -0
  84. package/types/blocks/text/index.d.ts +1 -0
  85. package/types/blocks/textarea/index.d.ts +1 -0
  86. package/types/blocks/video/index.d.ts +1 -0
  87. package/types/components/blocks/index.d.ts +1 -0
  88. package/types/components/content-variants/index.d.ts +1 -0
  89. package/types/components/error-boundary.d.ts +11 -0
  90. package/types/constants/sdk-version.d.ts +1 -1
  91. package/types/functions/get-content/types.d.ts +1 -1
  92. package/types/index-helpers/blocks-exports.d.ts +10 -11
  93. package/lib/edge/server-entry-a595b1cf.cjs +0 -2
@@ -1,3559 +1,30 @@
1
1
  "use client";
2
- import { jsx, Fragment, jsxs } from "react/jsx-runtime";
3
- import { T as TARGET, i as isEditing, h as isBrowser, j as getUserAttributes, k as fastClone, l as checkIsDefined, m as logger, n as getDefaultCanTrack, o as _track, a as isPreviewing, p as createEditorListener, q as registerInsertMenu, u as setupBrowserForEditing, c as createRegisterComponentMessage, e as fetchOneEntry, v as fetch$1, w as serializeComponentInfo, x as handleABTestingSync } from "./server-entry-c2b6d198.js";
4
- import { _ as H, f as K, d as q, g as z, r as J, s as Y, b as G, t as Q } from "./server-entry-c2b6d198.js";
5
- import { createContext, useState, useEffect, useContext, useRef, createElement } from "react";
6
- import { createRequire } from "node:module";
7
- const EMPTY_HTML_ELEMENTS = /* @__PURE__ */ new Set(["area", "base", "br", "col", "embed", "hr", "img", "input", "keygen", "link", "meta", "param", "source", "track", "wbr"]), isEmptyElement = (e) => typeof e == "string" && EMPTY_HTML_ELEMENTS.has(e.toLowerCase());
8
- function DynamicRenderer(e) {
9
- return /* @__PURE__ */ jsx(Fragment, { children: isEmptyElement(e.TagName) ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(e.TagName, { ...e.attributes, ...e.actionAttributes }) }) : /* @__PURE__ */ jsx(Fragment, { children: typeof e.TagName == "string" ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(e.TagName, { ...e.attributes, ...e.actionAttributes, children: e.children }) }) : /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(e.TagName, { ...e.attributes, ...e.actionAttributes, children: e.children }) }) }) });
10
- }
11
- const getClassPropName = () => {
12
- switch (TARGET) {
13
- case "react":
14
- case "reactNative":
15
- case "rsc":
16
- return "className";
17
- case "svelte":
18
- case "vue":
19
- case "solid":
20
- case "qwik":
21
- return "class";
22
- }
23
- };
24
- function Button(e) {
25
- return /* @__PURE__ */ jsx(
26
- DynamicRenderer,
27
- {
28
- attributes: {
29
- ...e.attributes,
30
- [getClassPropName()]: `${e.link ? "" : "builder-button"} ${e.attributes[getClassPropName()] || ""}`,
31
- ...e.link ? {
32
- href: e.link,
33
- target: e.openLinkInNewTab ? "_blank" : void 0,
34
- role: "link"
35
- } : {
36
- role: "button"
37
- }
38
- },
39
- TagName: e.link ? e.builderLinkComponent || "a" : "button",
40
- actionAttributes: {},
41
- children: e.text
42
- }
43
- );
44
- }
45
- const builderContext = createContext({
46
- content: null,
47
- context: {},
48
- localState: void 0,
49
- rootSetState() {
50
- },
51
- rootState: {},
52
- apiKey: null,
53
- apiVersion: void 0,
54
- componentInfos: {},
55
- inheritedStyles: {},
56
- BlocksWrapper: "div",
57
- BlocksWrapperProps: {}
58
- }), ComponentsContext = createContext({ registeredComponents: {} });
59
- function getBlockComponentOptions(e) {
60
- var t;
61
- return {
62
- ...(t = e.component) == null ? void 0 : t.options,
63
- ...e.options,
64
- /**
65
- * Our built-in components frequently make use of the block, so we provide all of it under `builderBlock`
66
- */
67
- builderBlock: e
68
- };
69
- }
70
- const getFunctionArguments = ({
71
- builder: e,
72
- context: t,
73
- event: n,
74
- state: i
75
- }) => Object.entries({
76
- state: i,
77
- Builder: e,
78
- // legacy
79
- builder: e,
80
- context: t,
81
- event: n
82
- }), getBuilderGlobals = () => ({
83
- isEditing: isEditing(),
84
- isBrowser: isBrowser(),
85
- isServer: !isBrowser(),
86
- getUserAttributes: () => getUserAttributes()
87
- }), parseCode = (e, {
88
- isExpression: t = !0
89
- }) => /* we disable this for cases where we definitely don't want a return */ t && !(e.includes(";") || e.includes(" return ") || e.trim().startsWith("return ")) ? `return (${e});` : e, runInBrowser = ({
90
- code: e,
91
- builder: t,
92
- context: n,
93
- event: i,
94
- localState: o,
95
- rootSetState: a,
96
- rootState: r
97
- }) => {
98
- const s = getFunctionArguments({
99
- builder: t,
100
- context: n,
101
- event: i,
102
- state: flattenState({
103
- rootState: r,
104
- localState: o,
105
- rootSetState: a
106
- })
107
- });
108
- return new Function(...s.map(([l]) => l), e)(...s.map(([, l]) => l));
109
- };
110
- function flattenState({
111
- rootState: e,
112
- localState: t,
113
- rootSetState: n
114
- }) {
115
- return new Proxy(e, {
116
- get: (i, o) => {
117
- if (t && o in t)
118
- return t[o];
119
- const a = i[o];
120
- return typeof a == "object" ? flattenState({
121
- rootState: a,
122
- localState: void 0,
123
- rootSetState: n ? (r) => {
124
- i[o] = r, n(i);
125
- } : void 0
126
- }) : a;
127
- },
128
- set: (i, o, a) => {
129
- if (t && o in t)
130
- throw new Error("Writing to local state is not allowed as it is read-only.");
131
- return i[o] = a, n == null || n(i), !0;
132
- }
133
- });
134
- }
135
- const set = (e, t, n) => {
136
- if (Object(e) !== e)
137
- return e;
138
- const i = Array.isArray(t) ? t : t.toString().match(/[^.[\]]+/g);
139
- return i.slice(0, -1).reduce((o, a, r) => Object(o[a]) === o[a] ? o[a] : o[a] = Math.abs(Number(i[r + 1])) >> 0 === +i[r + 1] ? [] : {}, e)[i[i.length - 1]] = n, e;
140
- }, noop = () => {
141
- };
142
- let safeDynamicRequire = noop;
143
- try {
144
- safeDynamicRequire = createRequire(import.meta.url);
145
- } catch (error) {
146
- try {
147
- safeDynamicRequire = eval("require");
148
- } catch (e) {
149
- }
150
- }
151
- const getSyncValName = (e) => `bldr_${e}_sync`, BUILDER_SET_STATE_NAME = "BUILDER_SET_STATE", INJECTED_IVM_GLOBAL = "BUILDER_IVM", REF_TO_PROXY_FN = `
152
- var refToProxy = (obj) => {
153
- if (typeof obj !== 'object' || obj === null) {
154
- return obj;
155
- }
156
- return new Proxy({}, {
157
- get(target, key) {
158
- if (key === 'copySync') {
159
- return () => obj.copySync();
160
- }
161
- const val = obj.getSync(key);
162
- if (typeof val?.getSync === 'function') {
163
- return refToProxy(val);
164
- }
165
- return val;
166
- },
167
- set(target, key, value) {
168
- const v = typeof value === 'object' ? new ${INJECTED_IVM_GLOBAL}.Reference(value) : value;
169
- obj.setSync(key, v);
170
- ${BUILDER_SET_STATE_NAME}(key, value)
171
- },
172
- deleteProperty(target, key) {
173
- obj.deleteSync(key);
174
- }
175
- })
176
- }
177
- `, processCode = ({
178
- code: e,
179
- args: t
180
- }) => {
181
- const n = t.map(([i]) => `var ${i} = refToProxy(${getSyncValName(i)}); `).join("");
182
- return `
183
- ${REF_TO_PROXY_FN}
184
- ${n}
185
- function theFunction() {
186
- ${e}
187
- }
188
-
189
- let output = theFunction()
190
-
191
- if (typeof output === 'object' && output !== null) {
192
- output = JSON.stringify(output.copySync ? output.copySync() : output);
193
- }
194
-
195
- output;
196
- `;
197
- }, getIsolateContext = () => {
198
- const e = safeDynamicRequire("isolated-vm");
199
- return new e.Isolate({
200
- memoryLimit: 128
201
- }).createContextSync();
202
- }, runInNode = ({
203
- code: e,
204
- builder: t,
205
- context: n,
206
- event: i,
207
- localState: o,
208
- rootSetState: a,
209
- rootState: r
210
- }) => {
211
- const s = safeDynamicRequire("isolated-vm"), l = fastClone({
212
- ...r,
213
- ...o
214
- }), c = getFunctionArguments({
215
- builder: t,
216
- context: n,
217
- event: i,
218
- state: l
219
- }), u = getIsolateContext(), y = u.global;
220
- y.setSync("global", y.derefInto()), y.setSync("log", function(...d) {
221
- console.log(...d);
222
- }), y.setSync(BUILDER_SET_STATE_NAME, function(d, f) {
223
- set(r, d, f), a == null || a(r);
224
- }), c.forEach(([d, f]) => {
225
- const v = typeof f == "object" ? new s.Reference(
226
- // workaround: methods with default values for arguments is not being cloned over
227
- d === "builder" ? {
228
- ...f,
229
- getUserAttributes: () => f.getUserAttributes()
230
- } : f
231
- ) : null;
232
- y.setSync(getSyncValName(d), v);
233
- }), y.setSync(INJECTED_IVM_GLOBAL, s);
234
- const x = processCode({
235
- code: e,
236
- args: c
237
- }), m = u.evalSync(x);
238
- try {
239
- return JSON.parse(m);
240
- } catch {
241
- return m;
242
- }
243
- };
244
- function isNodeRuntime() {
245
- var e;
246
- return typeof process != "undefined" && checkIsDefined((e = process == null ? void 0 : process.versions) == null ? void 0 : e.node);
247
- }
248
- const shouldForceBrowserRuntimeInNode = () => {
249
- var i;
250
- if (!isNodeRuntime())
251
- return !1;
252
- const e = process.arch === "arm64", t = process.version.startsWith("v20"), n = (i = process.env.NODE_OPTIONS) == null ? void 0 : i.includes("--no-node-snapshot");
253
- return e && t && !n ? (logger.log("Skipping usage of `isolated-vm` to avoid crashes in Node v20 on an arm64 machine.\n If you would like to use the `isolated-vm` package on this machine, please provide the `NODE_OPTIONS=--no-node-snapshot` config to your Node process.\n See https://github.com/BuilderIO/builder/blob/main/packages/sdks/README.md#node-v20--m1-macs-apple-silicon-support for more information.\n "), !0) : !1;
254
- }, chooseBrowserOrServerEval = (e) => isBrowser() || shouldForceBrowserRuntimeInNode() ? runInBrowser(e) : runInNode(e);
255
- function evaluate({
256
- code: e,
257
- context: t,
258
- localState: n,
259
- rootState: i,
260
- rootSetState: o,
261
- event: a,
262
- isExpression: r = !0
263
- }) {
264
- if (e === "") {
265
- logger.warn("Skipping evaluation of empty code block.");
266
- return;
267
- }
268
- const s = {
269
- code: parseCode(e, {
270
- isExpression: r
271
- }),
272
- builder: getBuilderGlobals(),
273
- context: t,
274
- event: a,
275
- rootSetState: o,
276
- rootState: i,
277
- localState: n
278
- };
279
- try {
280
- return chooseBrowserOrServerEval(s);
281
- } catch (l) {
282
- logger.error("Failed code evaluation: " + l.message, {
283
- code: e
284
- });
285
- return;
286
- }
287
- }
288
- function transformBlock(e) {
289
- return e;
290
- }
291
- const evaluateBindings = ({
292
- block: e,
293
- context: t,
294
- localState: n,
295
- rootState: i,
296
- rootSetState: o
297
- }) => {
298
- if (!e.bindings)
299
- return e;
300
- const a = fastClone(e), r = {
301
- ...a,
302
- properties: {
303
- ...a.properties
304
- },
305
- actions: {
306
- ...a.actions
307
- }
308
- };
309
- for (const s in e.bindings) {
310
- const l = e.bindings[s], c = evaluate({
311
- code: l,
312
- localState: n,
313
- rootState: i,
314
- rootSetState: o,
315
- context: t
316
- });
317
- set(r, s, c);
318
- }
319
- return r;
320
- };
321
- function getProcessedBlock({
322
- block: e,
323
- context: t,
324
- shouldEvaluateBindings: n,
325
- localState: i,
326
- rootState: o,
327
- rootSetState: a
328
- }) {
329
- const r = e;
330
- return n ? evaluateBindings({
331
- block: r,
332
- localState: i,
333
- rootState: o,
334
- rootSetState: a,
335
- context: t
336
- }) : r;
337
- }
338
- function throttle(e, t, n = {}) {
339
- let i, o, a, r = null, s = 0;
340
- const l = function() {
341
- s = n.leading === !1 ? 0 : Date.now(), r = null, a = e.apply(i, o), r || (i = o = null);
342
- };
343
- return function() {
344
- const c = Date.now();
345
- !s && n.leading === !1 && (s = c);
346
- const u = t - (c - s);
347
- return i = this, o = arguments, u <= 0 || u > t ? (r && (clearTimeout(r), r = null), s = c, a = e.apply(i, o), r || (i = o = null)) : !r && n.trailing !== !1 && (r = setTimeout(l, u)), a;
348
- };
349
- }
350
- function assign(e, ...t) {
351
- const n = Object(e);
352
- for (let i = 1; i < arguments.length; i++) {
353
- const o = arguments[i];
354
- if (o != null)
355
- for (const a in o)
356
- Object.prototype.hasOwnProperty.call(o, a) && (n[a] = o[a]);
357
- }
358
- return n;
359
- }
360
- const camelCaseToKebabCase = (e) => e ? e.replace(/([A-Z])/g, (t) => `-${t[0].toLowerCase()}`) : "";
361
- function bindAnimations(e) {
362
- for (const t of e)
363
- switch (t.trigger) {
364
- case "pageLoad":
365
- triggerAnimation(t);
366
- break;
367
- case "hover":
368
- bindHoverAnimation(t);
369
- break;
370
- case "scrollInView":
371
- bindScrollInViewAnimation(t);
372
- break;
373
- }
374
- }
375
- function warnElementNotPresent(e) {
376
- console.warn(`Cannot animate element: element with ID ${e} not found!`);
377
- }
378
- function augmentAnimation(e, t) {
379
- const n = getAllStylesUsed(e), i = getComputedStyle(t), o = e.steps[0].styles, a = e.steps[e.steps.length - 1].styles, r = [o, a];
380
- for (const s of r)
381
- for (const l of n)
382
- l in s || (s[l] = i[l]);
383
- }
384
- function getAllStylesUsed(e) {
385
- const t = [];
386
- for (const n of e.steps)
387
- for (const i in n.styles)
388
- t.indexOf(i) === -1 && t.push(i);
389
- return t;
390
- }
391
- function triggerAnimation(e) {
392
- const t = Array.prototype.slice.call(document.getElementsByClassName(e.elementId || e.id || ""));
393
- if (!t.length) {
394
- warnElementNotPresent(e.elementId || e.id || "");
395
- return;
396
- }
397
- Array.from(t).forEach((n) => {
398
- augmentAnimation(e, n), n.style.transition = "none", n.style.transitionDelay = "0", assign(n.style, e.steps[0].styles), setTimeout(() => {
399
- n.style.transition = `all ${e.duration}s ${camelCaseToKebabCase(e.easing)}`, e.delay && (n.style.transitionDelay = e.delay + "s"), assign(n.style, e.steps[1].styles), setTimeout(() => {
400
- n.style.transition = "", n.style.transitionDelay = "";
401
- }, (e.delay || 0) * 1e3 + e.duration * 1e3 + 100);
402
- });
403
- });
404
- }
405
- function bindHoverAnimation(e) {
406
- const t = Array.prototype.slice.call(document.getElementsByClassName(e.elementId || e.id || ""));
407
- if (!t.length) {
408
- warnElementNotPresent(e.elementId || e.id || "");
409
- return;
410
- }
411
- Array.from(t).forEach((n) => {
412
- augmentAnimation(e, n);
413
- const i = e.steps[0].styles, o = e.steps[1].styles;
414
- function a() {
415
- assign(n.style, i);
416
- }
417
- function r() {
418
- assign(n.style, o);
419
- }
420
- a(), n.addEventListener("mouseenter", r), n.addEventListener("mouseleave", a), setTimeout(() => {
421
- n.style.transition = `all ${e.duration}s ${camelCaseToKebabCase(e.easing)}`, e.delay && (n.style.transitionDelay = e.delay + "s");
422
- });
423
- });
424
- }
425
- function bindScrollInViewAnimation(e) {
426
- const t = Array.prototype.slice.call(document.getElementsByClassName(e.elementId || e.id || ""));
427
- if (!t.length) {
428
- warnElementNotPresent(e.elementId || e.id || "");
429
- return;
430
- }
431
- Array.from(t).forEach((n) => {
432
- augmentAnimation(e, n);
433
- let i = !1, o = !1;
434
- function a() {
435
- !i && s(n) ? (i = !0, o = !0, setTimeout(() => {
436
- assign(n.style, e.steps[1].styles), e.repeat || document.removeEventListener("scroll", r), setTimeout(() => {
437
- o = !1, e.repeat || (n.style.transition = "", n.style.transitionDelay = "");
438
- }, (e.duration + (e.delay || 0)) * 1e3 + 100);
439
- })) : e.repeat && i && !o && !s(n) && (i = !1, assign(n.style, e.steps[0].styles));
440
- }
441
- const r = throttle(a, 200, {
442
- leading: !1
443
- });
444
- function s(u) {
445
- const y = u.getBoundingClientRect(), x = window.innerHeight, d = (e.thresholdPercent || 0) / 100 * x;
446
- return y.bottom > d && y.top < x - d;
447
- }
448
- const l = e.steps[0].styles;
449
- function c() {
450
- assign(n.style, l);
451
- }
452
- c(), setTimeout(() => {
453
- n.style.transition = `all ${e.duration}s ${camelCaseToKebabCase(e.easing)}`, e.delay && (n.style.transitionDelay = e.delay + "s");
454
- }), document.addEventListener("scroll", r, {
455
- capture: !0,
456
- passive: !0
457
- }), a();
458
- });
459
- }
460
- const getComponent = ({
461
- block: e,
462
- context: t,
463
- registeredComponents: n
464
- }) => {
465
- var a;
466
- const i = (a = getProcessedBlock({
467
- block: e,
468
- localState: t.localState,
469
- rootState: t.rootState,
470
- rootSetState: t.rootSetState,
471
- context: t.context,
472
- shouldEvaluateBindings: !1
473
- }).component) == null ? void 0 : a.name;
474
- if (!i)
475
- return null;
476
- const o = n[i];
477
- if (o)
478
- return o;
479
- console.warn(`
480
- Could not find a registered component named "${i}".
481
- If you registered it, is the file that registered it imported by the file that needs to render it?`);
482
- }, getRepeatItemData = ({
483
- block: e,
484
- context: t
485
- }) => {
486
- const {
487
- repeat: n,
488
- ...i
489
- } = e;
490
- if (!(n != null && n.collection))
491
- return;
492
- const o = evaluate({
493
- code: n.collection,
494
- localState: t.localState,
495
- rootState: t.rootState,
496
- rootSetState: t.rootSetState,
497
- context: t.context
498
- });
499
- if (!Array.isArray(o))
500
- return;
501
- const a = n.collection.split(".").pop(), r = n.itemName || (a ? a + "Item" : "item");
502
- return o.map((l, c) => ({
503
- context: {
504
- ...t,
505
- localState: {
506
- ...t.localState,
507
- $index: c,
508
- $item: l,
509
- [r]: l,
510
- [`$${r}Index`]: c
511
- }
512
- },
513
- block: i
514
- }));
515
- }, SIZES = {
516
- small: {
517
- min: 320,
518
- default: 321,
519
- max: 640
520
- },
521
- medium: {
522
- min: 641,
523
- default: 642,
524
- max: 991
525
- },
526
- large: {
527
- min: 990,
528
- default: 991,
529
- max: 1200
530
- }
531
- }, getMaxWidthQueryForSize = (e, t = SIZES) => `@media (max-width: ${t[e].max}px)`, getSizesForBreakpoints = ({
532
- small: e,
533
- medium: t
534
- }) => {
535
- const n = fastClone(SIZES);
536
- if (!e || !t)
537
- return n;
538
- const i = Math.floor(e / 2);
539
- n.small = {
540
- max: e,
541
- min: i,
542
- default: i + 1
543
- };
544
- const o = n.small.max + 1;
545
- n.medium = {
546
- max: t,
547
- min: o,
548
- default: o + 1
549
- };
550
- const a = n.medium.max + 1;
551
- return n.large = {
552
- max: 2e3,
553
- // TODO: decide upper limit
554
- min: a,
555
- default: a + 1
556
- }, n;
557
- }, camelToKebabCase = (e) => e.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase(), convertStyleMapToCSSArray = (e) => Object.entries(e).map(([n, i]) => {
558
- if (typeof i == "string")
559
- return `${camelToKebabCase(n)}: ${i};`;
560
- }).filter(checkIsDefined), convertStyleMapToCSS = (e) => convertStyleMapToCSSArray(e).join(`
561
- `), createCssClass = ({
562
- mediaQuery: e,
563
- className: t,
564
- styles: n
565
- }) => {
566
- const i = `.${t} {
567
- ${convertStyleMapToCSS(n)}
568
- }`;
569
- return e ? `${e} {
570
- ${i}
571
- }` : i;
572
- };
573
- function InlinedStyles(e) {
574
- return /* @__PURE__ */ jsx("style", { dangerouslySetInnerHTML: { __html: e.styles }, id: e.id });
575
- }
576
- function BlockStyles(e) {
577
- function t() {
578
- const i = getProcessedBlock({
579
- block: e.block,
580
- localState: e.context.localState,
581
- rootState: e.context.rootState,
582
- rootSetState: e.context.rootSetState,
583
- context: e.context.context,
584
- shouldEvaluateBindings: !0
585
- });
586
- return checkIsDefined(i.hide) ? !i.hide : checkIsDefined(i.show) ? i.show : !0;
587
- }
588
- function n() {
589
- var d;
590
- const i = getProcessedBlock({
591
- block: e.block,
592
- localState: e.context.localState,
593
- rootState: e.context.rootState,
594
- rootSetState: e.context.rootSetState,
595
- context: e.context.context,
596
- shouldEvaluateBindings: !0
597
- }), o = i.responsiveStyles, a = e.context.content, r = getSizesForBreakpoints(
598
- ((d = a == null ? void 0 : a.meta) == null ? void 0 : d.breakpoints) || {}
599
- ), s = o == null ? void 0 : o.large, l = o == null ? void 0 : o.medium, c = o == null ? void 0 : o.small, u = i.id;
600
- if (!u)
601
- return "";
602
- const y = s ? createCssClass({
603
- className: u,
604
- styles: s
605
- }) : "", x = l ? createCssClass({
606
- className: u,
607
- styles: l,
608
- mediaQuery: getMaxWidthQueryForSize(
609
- "medium",
610
- r
611
- )
612
- }) : "", m = c ? createCssClass({
613
- className: u,
614
- styles: c,
615
- mediaQuery: getMaxWidthQueryForSize(
616
- "small",
617
- r
618
- )
619
- }) : "";
620
- return [y, x, m].join(" ");
621
- }
622
- return /* @__PURE__ */ jsx(Fragment, { children: n() && t() ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(InlinedStyles, { styles: n() }) }) : null });
623
- }
624
- function capitalizeFirstLetter(e) {
625
- return e.charAt(0).toUpperCase() + e.slice(1);
626
- }
627
- const getEventHandlerName = (e) => `on${capitalizeFirstLetter(e)}`, createEventHandler = (e, t) => (n) => evaluate({
628
- code: e,
629
- context: t.context,
630
- localState: t.localState,
631
- rootState: t.rootState,
632
- rootSetState: t.rootSetState,
633
- event: n,
634
- isExpression: !1
635
- });
636
- function getBlockActions(e) {
637
- var i;
638
- const t = {}, n = (i = e.block.actions) != null ? i : {};
639
- for (const o in n) {
640
- if (!n.hasOwnProperty(o))
641
- continue;
642
- const a = n[o];
643
- let r = getEventHandlerName(o);
644
- if (e.stripPrefix)
645
- switch (TARGET) {
646
- case "vue":
647
- r = r.replace("v-on:", "");
648
- break;
649
- case "svelte":
650
- r = r.replace("on:", "");
651
- break;
652
- }
653
- t[r] = createEventHandler(a, e);
654
- }
655
- return t;
656
- }
657
- function transformStyleProperty({
658
- style: e
659
- }) {
660
- return e;
661
- }
662
- const getStyle = ({
663
- block: e,
664
- context: t
665
- }) => mapStyleObjToStrIfNeeded(transformStyleProperty({
666
- style: e.style || {},
667
- context: t,
668
- block: e
669
- }));
670
- function mapStyleObjToStrIfNeeded(e) {
671
- switch (TARGET) {
672
- case "svelte":
673
- case "vue":
674
- case "solid":
675
- return convertStyleMapToCSSArray(e).join(" ");
676
- case "qwik":
677
- case "reactNative":
678
- case "react":
679
- case "rsc":
680
- return e;
681
- }
682
- }
683
- function transformBlockProperties({
684
- properties: e
685
- }) {
686
- return e;
687
- }
688
- const extractRelevantRootBlockProperties = (e) => ({
689
- href: e.href
690
- });
691
- function getBlockProperties({
692
- block: e,
693
- context: t
694
- }) {
695
- var i;
696
- const n = {
697
- ...extractRelevantRootBlockProperties(e),
698
- ...e.properties,
699
- "builder-id": e.id,
700
- style: getStyle({
701
- block: e,
702
- context: t
703
- }),
704
- [getClassPropName()]: [e.id, "builder-block", e.class, (i = e.properties) == null ? void 0 : i.class].filter(Boolean).join(" ")
705
- };
706
- return transformBlockProperties({
707
- properties: n,
708
- context: t,
709
- block: e
710
- });
711
- }
712
- function BlockWrapper(e) {
713
- return /* @__PURE__ */ jsx(
714
- DynamicRenderer,
715
- {
716
- TagName: e.Wrapper,
717
- attributes: getBlockProperties({
718
- block: e.block,
719
- context: e.context
720
- }),
721
- actionAttributes: getBlockActions({
722
- block: e.block,
723
- rootState: e.context.rootState,
724
- rootSetState: e.context.rootSetState,
725
- localState: e.context.localState,
726
- context: e.context.context,
727
- stripPrefix: !0
728
- }),
729
- children: e.children
730
- }
731
- );
732
- }
733
- function InteractiveElement(e) {
734
- return /* @__PURE__ */ jsx(
735
- e.Wrapper,
736
- {
737
- ...e.wrapperProps,
738
- attributes: e.includeBlockProps ? {
739
- ...getBlockProperties({
740
- block: e.block,
741
- context: e.context
742
- }),
743
- ...getBlockActions({
744
- block: e.block,
745
- rootState: e.context.rootState,
746
- rootSetState: e.context.rootSetState,
747
- localState: e.context.localState,
748
- context: e.context.context
749
- })
750
- } : {},
751
- children: e.children
752
- }
753
- );
754
- }
755
- const getWrapperProps = ({
756
- componentOptions: e,
757
- builderBlock: t,
758
- context: n,
759
- componentRef: i,
760
- includeBlockProps: o,
761
- isInteractive: a,
762
- contextValue: r
763
- }) => {
764
- const s = {
765
- ...e,
766
- /**
767
- * If `noWrap` is set to `true`, then the block's props/attributes are provided to the
768
- * component itself directly. Otherwise, they are provided to the wrapper element.
769
- */
770
- ...o ? {
771
- attributes: getBlockProperties({
772
- block: t,
773
- context: r
774
- })
775
- } : {}
776
- };
777
- return a ? {
778
- Wrapper: i,
779
- block: t,
780
- context: n,
781
- wrapperProps: e,
782
- includeBlockProps: o
783
- } : s;
784
- };
785
- function ComponentRef(e) {
786
- var i;
787
- const [t, n] = useState(
788
- () => e.isInteractive ? InteractiveElement : e.componentRef
789
- );
790
- return /* @__PURE__ */ jsx(Fragment, { children: e.componentRef ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
791
- t,
792
- {
793
- ...getWrapperProps({
794
- componentOptions: e.componentOptions,
795
- builderBlock: e.builderBlock,
796
- context: e.context,
797
- componentRef: e.componentRef,
798
- linkComponent: e.linkComponent,
799
- includeBlockProps: e.includeBlockProps,
800
- isInteractive: e.isInteractive,
801
- contextValue: e.context
802
- }),
803
- children: (i = e.blockChildren) == null ? void 0 : i.map((o) => /* @__PURE__ */ jsx(
804
- Block,
805
- {
806
- block: o,
807
- context: e.context,
808
- registeredComponents: e.registeredComponents,
809
- linkComponent: e.linkComponent
810
- },
811
- o.id
812
- ))
813
- }
814
- ) }) : null });
815
- }
816
- function RepeatedBlock(e) {
817
- const [t, n] = useState(() => e.repeatContext);
818
- return /* @__PURE__ */ jsx(builderContext.Provider, { value: t, children: /* @__PURE__ */ jsx(
819
- Block,
820
- {
821
- block: e.block,
822
- context: t,
823
- registeredComponents: e.registeredComponents,
824
- linkComponent: e.linkComponent
825
- }
826
- ) });
827
- }
828
- function Block(e) {
829
- var u, y, x;
830
- function t() {
831
- return getComponent({
832
- block: e.block,
833
- context: e.context,
834
- registeredComponents: e.registeredComponents
835
- });
836
- }
837
- function n() {
838
- return getRepeatItemData({
839
- block: e.block,
840
- context: e.context
841
- });
842
- }
843
- function i() {
844
- var m;
845
- return (m = e.block.repeat) != null && m.collection ? e.block : getProcessedBlock({
846
- block: e.block,
847
- localState: e.context.localState,
848
- rootState: e.context.rootState,
849
- rootSetState: e.context.rootSetState,
850
- context: e.context.context,
851
- shouldEvaluateBindings: !0
852
- });
853
- }
854
- function o() {
855
- var d;
856
- return e.block.tagName === "a" || ((d = i().properties) == null ? void 0 : d.href) || i().href ? e.linkComponent || "a" : e.block.tagName || "div";
857
- }
858
- function a() {
859
- var f, v;
860
- if ((f = e.block.repeat) != null && f.collection)
861
- return !!((v = n == null ? void 0 : n()) != null && v.length);
862
- const m = "hide" in i() ? i().hide : !1;
863
- return ("show" in i() ? i().show : !0) && !m;
864
- }
865
- function r() {
866
- var d, f;
867
- return !((d = t == null ? void 0 : t()) != null && d.component) && !n() ? (f = i().children) != null ? f : [] : [];
868
- }
869
- function s() {
870
- var m, d, f, v, R, S, C, w, E, B, F;
871
- return {
872
- blockChildren: (m = i().children) != null ? m : [],
873
- componentRef: (d = t == null ? void 0 : t()) == null ? void 0 : d.component,
874
- componentOptions: {
875
- ...getBlockComponentOptions(i()),
876
- builderContext: e.context,
877
- ...((f = t == null ? void 0 : t()) == null ? void 0 : f.name) === "Core:Button" || ((v = t == null ? void 0 : t()) == null ? void 0 : v.name) === "Symbol" || ((R = t == null ? void 0 : t()) == null ? void 0 : R.name) === "Columns" || ((S = t == null ? void 0 : t()) == null ? void 0 : S.name) === "Form:Form" ? {
878
- builderLinkComponent: e.linkComponent
879
- } : {},
880
- ...((C = t == null ? void 0 : t()) == null ? void 0 : C.name) === "Symbol" || ((w = t == null ? void 0 : t()) == null ? void 0 : w.name) === "Columns" || ((E = t == null ? void 0 : t()) == null ? void 0 : E.name) === "Form:Form" ? {
881
- builderComponents: e.registeredComponents
882
- } : {}
883
- },
884
- context: l,
885
- linkComponent: e.linkComponent,
886
- registeredComponents: e.registeredComponents,
887
- builderBlock: i(),
888
- includeBlockProps: ((B = t == null ? void 0 : t()) == null ? void 0 : B.noWrap) === !0,
889
- isInteractive: !((F = t == null ? void 0 : t()) != null && F.isRSC)
890
- };
891
- }
892
- const [l, c] = useState(() => e.context);
893
- return useEffect(() => {
894
- const m = i().id, d = i().animations;
895
- d && m && bindAnimations(
896
- d.filter((f) => f.trigger !== "hover").map((f) => ({
897
- ...f,
898
- elementId: m
899
- }))
900
- );
901
- }, []), /* @__PURE__ */ jsx(Fragment, { children: a() ? /* @__PURE__ */ jsxs(Fragment, { children: [
902
- /* @__PURE__ */ jsx(BlockStyles, { block: e.block, context: e.context }),
903
- (u = t == null ? void 0 : t()) != null && u.noWrap ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
904
- ComponentRef,
905
- {
906
- componentRef: s().componentRef,
907
- componentOptions: s().componentOptions,
908
- blockChildren: s().blockChildren,
909
- context: s().context,
910
- registeredComponents: s().registeredComponents,
911
- linkComponent: s().linkComponent,
912
- builderBlock: s().builderBlock,
913
- includeBlockProps: s().includeBlockProps,
914
- isInteractive: s().isInteractive
915
- }
916
- ) }) : /* @__PURE__ */ jsx(Fragment, { children: n() ? /* @__PURE__ */ jsx(Fragment, { children: (x = n()) == null ? void 0 : x.map((m, d) => /* @__PURE__ */ jsx(
917
- RepeatedBlock,
918
- {
919
- repeatContext: m.context,
920
- block: m.block,
921
- registeredComponents: e.registeredComponents,
922
- linkComponent: e.linkComponent
923
- },
924
- d
925
- )) }) : /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(
926
- BlockWrapper,
927
- {
928
- Wrapper: o(),
929
- block: i(),
930
- context: e.context,
931
- linkComponent: e.linkComponent,
932
- children: [
933
- /* @__PURE__ */ jsx(
934
- ComponentRef,
935
- {
936
- componentRef: s().componentRef,
937
- componentOptions: s().componentOptions,
938
- blockChildren: s().blockChildren,
939
- context: s().context,
940
- registeredComponents: s().registeredComponents,
941
- linkComponent: s().linkComponent,
942
- builderBlock: s().builderBlock,
943
- includeBlockProps: s().includeBlockProps,
944
- isInteractive: s().isInteractive
945
- }
946
- ),
947
- (y = r()) == null ? void 0 : y.map((m) => /* @__PURE__ */ jsx(
948
- Block,
949
- {
950
- block: m,
951
- context: l,
952
- registeredComponents: e.registeredComponents,
953
- linkComponent: e.linkComponent
954
- },
955
- m.id
956
- ))
957
- ]
958
- }
959
- ) }) })
960
- ] }) : null });
961
- }
962
- function BlocksWrapper(e) {
963
- function t() {
964
- var o;
965
- return "builder-blocks" + ((o = e.blocks) != null && o.length ? "" : " no-blocks");
966
- }
967
- function n() {
968
- var o, a;
969
- isEditing() && !((o = e.blocks) != null && o.length) && ((a = window.parent) == null || a.postMessage(
970
- {
971
- type: "builder.clickEmptyBlocks",
972
- data: {
973
- parentElementId: e.parent,
974
- dataPath: e.path
975
- }
976
- },
977
- "*"
978
- ));
979
- }
980
- function i() {
981
- var o, a;
982
- isEditing() && !((o = e.blocks) != null && o.length) && ((a = window.parent) == null || a.postMessage(
983
- {
984
- type: "builder.hoverEmptyBlocks",
985
- data: {
986
- parentElementId: e.parent,
987
- dataPath: e.path
988
- }
989
- },
990
- "*"
991
- ));
992
- }
993
- return /* @__PURE__ */ jsxs(Fragment, { children: [
994
- /* @__PURE__ */ jsx(
995
- e.BlocksWrapper,
996
- {
997
- className: t() + " props-blocks-wrapper-7354e098",
998
- "builder-path": e.path,
999
- "builder-parent-id": e.parent,
1000
- style: e.styleProp,
1001
- onClick: (o) => n(),
1002
- onMouseEnter: (o) => i(),
1003
- onKeyPress: (o) => n(),
1004
- ...e.BlocksWrapperProps,
1005
- children: e.children
1006
- }
1007
- ),
1008
- /* @__PURE__ */ jsx("style", { children: `.props-blocks-wrapper-7354e098 {
1009
- display: flex;
1010
- flex-direction: column;
1011
- align-items: stretch;
1012
- }` })
1013
- ] });
1014
- }
1015
- function Blocks(e) {
1016
- var i, o, a;
1017
- const t = useContext(builderContext), n = useContext(ComponentsContext);
1018
- return /* @__PURE__ */ jsx(
1019
- BlocksWrapper,
1020
- {
1021
- blocks: e.blocks,
1022
- parent: e.parent,
1023
- path: e.path,
1024
- styleProp: e.styleProp,
1025
- BlocksWrapper: (i = e.context) == null ? void 0 : i.BlocksWrapper,
1026
- BlocksWrapperProps: (o = e.context) == null ? void 0 : o.BlocksWrapperProps,
1027
- children: e.blocks ? /* @__PURE__ */ jsx(Fragment, { children: (a = e.blocks) == null ? void 0 : a.map((r) => /* @__PURE__ */ jsx(
1028
- Block,
1029
- {
1030
- block: r,
1031
- linkComponent: e.linkComponent,
1032
- context: e.context || t,
1033
- registeredComponents: e.registeredComponents || n.registeredComponents
1034
- },
1035
- r.id
1036
- )) }) : null
1037
- }
1038
- );
1039
- }
1040
- function Columns(e) {
1041
- var R;
1042
- const [t, n] = useState(
1043
- () => typeof e.space == "number" ? e.space || 0 : 20
1044
- ), [i, o] = useState(() => e.columns || []), [a, r] = useState(
1045
- () => e.stackColumnsAt || "tablet"
1046
- );
1047
- function s(S) {
1048
- var C;
1049
- return ((C = i[S]) == null ? void 0 : C.width) || 100 / i.length;
1050
- }
1051
- function l(S) {
1052
- const C = t * (i.length - 1) / i.length;
1053
- return `calc(${s(S)}% - ${C}px)`;
1054
- }
1055
- function c({
1056
- stackedStyle: S,
1057
- desktopStyle: C
1058
- }) {
1059
- return a === "tablet" ? S : C;
1060
- }
1061
- function u({
1062
- stackedStyle: S,
1063
- desktopStyle: C
1064
- }) {
1065
- return a === "never" ? C : S;
1066
- }
1067
- const [y, x] = useState(
1068
- () => e.stackColumnsAt === "never" ? "row" : e.reverseColumnsWhenStacked ? "column-reverse" : "column"
1069
- );
1070
- function m() {
1071
- return {
1072
- "--flex-dir": y,
1073
- "--flex-dir-tablet": c({
1074
- stackedStyle: y,
1075
- desktopStyle: "row"
1076
- })
1077
- };
1078
- }
1079
- function d(S) {
1080
- const C = S === 0 ? 0 : t, w = l(S), E = `${C}px`, B = "100%", F = 0;
1081
- return {
1082
- ...{
1083
- display: "flex",
1084
- flexDirection: "column",
1085
- alignItems: "stretch"
1086
- },
1087
- width: w,
1088
- ["marginLeft"]: E,
1089
- "--column-width-mobile": u({
1090
- stackedStyle: B,
1091
- desktopStyle: w
1092
- }),
1093
- "--column-margin-left-mobile": u({
1094
- stackedStyle: F,
1095
- desktopStyle: E
1096
- }),
1097
- "--column-width-tablet": c({
1098
- stackedStyle: B,
1099
- desktopStyle: w
1100
- }),
1101
- "--column-margin-left-tablet": c({
1102
- stackedStyle: F,
1103
- desktopStyle: E
1104
- })
1105
- };
1106
- }
1107
- function f(S) {
1108
- var w, E;
1109
- return getSizesForBreakpoints(
1110
- ((E = (w = e.builderContext.content) == null ? void 0 : w.meta) == null ? void 0 : E.breakpoints) || {}
1111
- )[S].max;
1112
- }
1113
- function v() {
1114
- return `
1115
- @media (max-width: ${f("medium")}px) {
1116
- .${e.builderBlock.id}-breakpoints {
1117
- flex-direction: var(--flex-dir-tablet);
1118
- align-items: stretch;
1119
- }
1120
-
1121
- .${e.builderBlock.id}-breakpoints > .builder-column {
1122
- width: var(--column-width-tablet) !important;
1123
- margin-left: var(--column-margin-left-tablet) !important;
1124
- }
1125
- }
1126
-
1127
- @media (max-width: ${f("small")}px) {
1128
- .${e.builderBlock.id}-breakpoints {
1129
- flex-direction: var(--flex-dir);
1130
- align-items: stretch;
1131
- }
1132
-
1133
- .${e.builderBlock.id}-breakpoints > .builder-column {
1134
- width: var(--column-width-mobile) !important;
1135
- margin-left: var(--column-margin-left-mobile) !important;
1136
- }
1137
- },
1138
- `;
1139
- }
1140
- return /* @__PURE__ */ jsxs(Fragment, { children: [
1141
- /* @__PURE__ */ jsxs(
1142
- "div",
1143
- {
1144
- className: `builder-columns ${e.builderBlock.id}-breakpoints div-f5024694`,
1145
- style: m(),
1146
- children: [
1147
- /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(InlinedStyles, { styles: v() }) }),
1148
- (R = e.columns) == null ? void 0 : R.map((S, C) => /* @__PURE__ */ jsx(
1149
- DynamicRenderer,
1150
- {
1151
- TagName: S.link ? e.builderLinkComponent || "a" : "div",
1152
- actionAttributes: {},
1153
- attributes: {
1154
- ...S.link ? {
1155
- href: S.link
1156
- } : {},
1157
- [getClassPropName()]: "builder-column",
1158
- style: mapStyleObjToStrIfNeeded(d(C))
1159
- },
1160
- children: /* @__PURE__ */ jsx(
1161
- Blocks,
1162
- {
1163
- path: `component.options.columns.${C}.blocks`,
1164
- parent: e.builderBlock.id,
1165
- styleProp: {
1166
- flexGrow: "1"
1167
- },
1168
- context: e.builderContext,
1169
- registeredComponents: e.builderComponents,
1170
- linkComponent: e.builderLinkComponent,
1171
- blocks: S.blocks
1172
- }
1173
- )
1174
- },
1175
- C
1176
- ))
1177
- ]
1178
- }
1179
- ),
1180
- /* @__PURE__ */ jsx("style", { children: `.div-f5024694 {
1181
- display: flex;
1182
- line-height: normal;
1183
- }` })
1184
- ] });
1185
- }
1186
- function FragmentComponent(e) {
1187
- return /* @__PURE__ */ jsx("span", { children: e.children });
1188
- }
1189
- function removeProtocol(e) {
1190
- return e.replace(/http(s)?:/, "");
1191
- }
1192
- function updateQueryParam(e = "", t, n) {
1193
- const i = new RegExp("([?&])" + t + "=.*?(&|$)", "i"), o = e.indexOf("?") !== -1 ? "&" : "?";
1194
- return e.match(i) ? e.replace(i, "$1" + t + "=" + encodeURIComponent(n) + "$2") : e + o + t + "=" + encodeURIComponent(n);
1195
- }
1196
- function getShopifyImageUrl(e, t) {
1197
- if (!e || !(e != null && e.match(/cdn\.shopify\.com/)) || !t)
1198
- return e;
1199
- if (t === "master")
1200
- return removeProtocol(e);
1201
- const n = e.match(/(_\d+x(\d+)?)?(\.(jpg|jpeg|gif|png|bmp|bitmap|tiff|tif)(\?v=\d+)?)/i);
1202
- if (n) {
1203
- const i = e.split(n[0]), o = n[3], a = t.match("x") ? t : `${t}x`;
1204
- return removeProtocol(`${i[0]}_${a}${o}`);
1205
- }
1206
- return null;
1207
- }
1208
- function getSrcSet(e) {
1209
- if (!e)
1210
- return e;
1211
- const t = [100, 200, 400, 800, 1200, 1600, 2e3];
1212
- if (e.match(/builder\.io/)) {
1213
- let n = e;
1214
- const i = Number(e.split("?width=")[1]);
1215
- return isNaN(i) || (n = `${n} ${i}w`), t.filter((o) => o !== i).map((o) => `${updateQueryParam(e, "width", o)} ${o}w`).concat([n]).join(", ");
1216
- }
1217
- return e.match(/cdn\.shopify\.com/) ? t.map((n) => [getShopifyImageUrl(e, `${n}x${n}`), n]).filter(([n]) => !!n).map(([n, i]) => `${n} ${i}w`).concat([e]).join(", ") : e;
1218
- }
1219
- function Image(e) {
1220
- var o, a, r, s;
1221
- function t() {
1222
- var u;
1223
- const c = e.image || e.src;
1224
- if (!c || // We can auto add srcset for cdn.builder.io and shopify
1225
- // images, otherwise you can supply this prop manually
1226
- !(c.match(/builder\.io/) || c.match(/cdn\.shopify\.com/)))
1227
- return e.srcset;
1228
- if (e.srcset && ((u = e.image) != null && u.includes("builder.io/api/v1/image"))) {
1229
- if (!e.srcset.includes(e.image.split("?")[0]))
1230
- return console.debug("Removed given srcset"), getSrcSet(c);
1231
- } else if (e.image && !e.srcset)
1232
- return getSrcSet(c);
1233
- return getSrcSet(c);
1234
- }
1235
- function n() {
1236
- var l;
1237
- return (l = t == null ? void 0 : t()) != null && l.match(/builder\.io/) && !e.noWebp ? t().replace(/\?/g, "?format=webp&") : "";
1238
- }
1239
- function i() {
1240
- const l = {
1241
- position: "absolute",
1242
- height: "100%",
1243
- width: "100%",
1244
- left: "0px",
1245
- top: "0px"
1246
- };
1247
- return e.aspectRatio ? l : void 0;
1248
- }
1249
- return /* @__PURE__ */ jsxs(Fragment, { children: [
1250
- /* @__PURE__ */ jsxs(Fragment, { children: [
1251
- /* @__PURE__ */ jsxs("picture", { children: [
1252
- n() ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx("source", { type: "image/webp", srcSet: n() }) }) : null,
1253
- /* @__PURE__ */ jsx(
1254
- "img",
1255
- {
1256
- loading: "lazy",
1257
- alt: e.altText,
1258
- role: e.altText ? "presentation" : void 0,
1259
- style: {
1260
- objectPosition: e.backgroundPosition || "center",
1261
- objectFit: e.backgroundSize || "cover",
1262
- ...i()
1263
- },
1264
- className: "builder-image" + (e.className ? " " + e.className : "") + " img-40c70c9b",
1265
- src: e.image,
1266
- srcSet: t(),
1267
- sizes: e.sizes
1268
- }
1269
- )
1270
- ] }),
1271
- e.aspectRatio && !((a = (o = e.builderBlock) == null ? void 0 : o.children) != null && a.length && e.fitContent) ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
1272
- "div",
1273
- {
1274
- className: "builder-image-sizer div-40c70c9b",
1275
- style: {
1276
- paddingTop: e.aspectRatio * 100 + "%"
1277
- }
1278
- }
1279
- ) }) : null,
1280
- (s = (r = e.builderBlock) == null ? void 0 : r.children) != null && s.length && e.fitContent ? /* @__PURE__ */ jsx(Fragment, { children: e.children }) : null,
1281
- !e.fitContent && e.children ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx("div", { className: "div-40c70c9b-2", children: e.children }) }) : null
1282
- ] }),
1283
- /* @__PURE__ */ jsx("style", { children: `.img-40c70c9b {
1284
- opacity: 1;
1285
- transition: opacity 0.2s ease-in-out;
1286
- }.div-40c70c9b {
1287
- width: 100%;
1288
- pointer-events: none;
1289
- font-size: 0;
1290
- }.div-40c70c9b-2 {
1291
- display: flex;
1292
- flex-direction: column;
1293
- align-items: stretch;
1294
- position: absolute;
1295
- top: 0;
1296
- left: 0;
1297
- width: 100%;
1298
- height: 100%;
1299
- }` })
1300
- ] });
1301
- }
1302
- function SectionComponent(e) {
1303
- return /* @__PURE__ */ jsx(
1304
- "section",
1305
- {
1306
- ...e.attributes,
1307
- style: {
1308
- width: "100%",
1309
- alignSelf: "stretch",
1310
- flexGrow: 1,
1311
- boxSizing: "border-box",
1312
- maxWidth: e.maxWidth || 1200,
1313
- display: "flex",
1314
- flexDirection: "column",
1315
- alignItems: "stretch",
1316
- marginLeft: "auto",
1317
- marginRight: "auto"
1318
- },
1319
- children: e.children
1320
- }
1321
- );
1322
- }
1323
- const componentInfo$f = {
1324
- name: "Core:Button",
1325
- image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F81a15681c3e74df09677dfc57a615b13",
1326
- defaultStyles: {
1327
- // TODO: make min width more intuitive and set one
1328
- appearance: "none",
1329
- paddingTop: "15px",
1330
- paddingBottom: "15px",
1331
- paddingLeft: "25px",
1332
- paddingRight: "25px",
1333
- backgroundColor: "#000000",
1334
- color: "white",
1335
- borderRadius: "4px",
1336
- textAlign: "center",
1337
- cursor: "pointer"
1338
- },
1339
- inputs: [{
1340
- name: "text",
1341
- type: "text",
1342
- defaultValue: "Click me!",
1343
- bubble: !0
1344
- }, {
1345
- name: "link",
1346
- type: "url",
1347
- bubble: !0
1348
- }, {
1349
- name: "openLinkInNewTab",
1350
- type: "boolean",
1351
- defaultValue: !1,
1352
- friendlyName: "Open link in new tab"
1353
- }],
1354
- static: !0,
1355
- noWrap: !0
1356
- }, componentInfo$e = {
1357
- // TODO: ways to statically preprocess JSON for references, functions, etc
1358
- name: "Columns",
1359
- isRSC: !0,
1360
- inputs: [{
1361
- name: "columns",
1362
- type: "array",
1363
- broadcast: !0,
1364
- subFields: [{
1365
- name: "blocks",
1366
- type: "array",
1367
- hideFromUI: !0,
1368
- defaultValue: [{
1369
- "@type": "@builder.io/sdk:Element",
1370
- responsiveStyles: {
1371
- large: {
1372
- display: "flex",
1373
- flexDirection: "column",
1374
- alignItems: "stretch",
1375
- flexShrink: "0",
1376
- position: "relative",
1377
- marginTop: "30px",
1378
- textAlign: "center",
1379
- lineHeight: "normal",
1380
- height: "auto",
1381
- minHeight: "20px",
1382
- minWidth: "20px",
1383
- overflow: "hidden"
1384
- }
1385
- },
1386
- component: {
1387
- name: "Image",
1388
- options: {
1389
- image: "https://builder.io/api/v1/image/assets%2Fpwgjf0RoYWbdnJSbpBAjXNRMe9F2%2Ffb27a7c790324294af8be1c35fe30f4d",
1390
- backgroundPosition: "center",
1391
- backgroundSize: "cover",
1392
- aspectRatio: 0.7004048582995948
1393
- }
1394
- }
1395
- }, {
1396
- "@type": "@builder.io/sdk:Element",
1397
- responsiveStyles: {
1398
- large: {
1399
- display: "flex",
1400
- flexDirection: "column",
1401
- alignItems: "stretch",
1402
- flexShrink: "0",
1403
- position: "relative",
1404
- marginTop: "30px",
1405
- textAlign: "center",
1406
- lineHeight: "normal",
1407
- height: "auto"
1408
- }
1409
- },
1410
- component: {
1411
- name: "Text",
1412
- options: {
1413
- text: "<p>Enter some text...</p>"
1414
- }
1415
- }
1416
- }]
1417
- }, {
1418
- name: "width",
1419
- type: "number",
1420
- hideFromUI: !0,
1421
- helperText: "Width %, e.g. set to 50 to fill half of the space"
1422
- }, {
1423
- name: "link",
1424
- type: "url",
1425
- helperText: "Optionally set a url that clicking this column will link to"
1426
- }],
1427
- defaultValue: [{
1428
- blocks: [{
1429
- "@type": "@builder.io/sdk:Element",
1430
- responsiveStyles: {
1431
- large: {
1432
- display: "flex",
1433
- flexDirection: "column",
1434
- alignItems: "stretch",
1435
- flexShrink: "0",
1436
- position: "relative",
1437
- marginTop: "30px",
1438
- textAlign: "center",
1439
- lineHeight: "normal",
1440
- height: "auto",
1441
- minHeight: "20px",
1442
- minWidth: "20px",
1443
- overflow: "hidden"
1444
- }
1445
- },
1446
- component: {
1447
- name: "Image",
1448
- options: {
1449
- image: "https://builder.io/api/v1/image/assets%2Fpwgjf0RoYWbdnJSbpBAjXNRMe9F2%2Ffb27a7c790324294af8be1c35fe30f4d",
1450
- backgroundPosition: "center",
1451
- backgroundSize: "cover",
1452
- aspectRatio: 0.7004048582995948
1453
- }
1454
- }
1455
- }, {
1456
- "@type": "@builder.io/sdk:Element",
1457
- responsiveStyles: {
1458
- large: {
1459
- display: "flex",
1460
- flexDirection: "column",
1461
- alignItems: "stretch",
1462
- flexShrink: "0",
1463
- position: "relative",
1464
- marginTop: "30px",
1465
- textAlign: "center",
1466
- lineHeight: "normal",
1467
- height: "auto"
1468
- }
1469
- },
1470
- component: {
1471
- name: "Text",
1472
- options: {
1473
- text: "<p>Enter some text...</p>"
1474
- }
1475
- }
1476
- }]
1477
- }, {
1478
- blocks: [{
1479
- "@type": "@builder.io/sdk:Element",
1480
- responsiveStyles: {
1481
- large: {
1482
- display: "flex",
1483
- flexDirection: "column",
1484
- alignItems: "stretch",
1485
- flexShrink: "0",
1486
- position: "relative",
1487
- marginTop: "30px",
1488
- textAlign: "center",
1489
- lineHeight: "normal",
1490
- height: "auto",
1491
- minHeight: "20px",
1492
- minWidth: "20px",
1493
- overflow: "hidden"
1494
- }
1495
- },
1496
- component: {
1497
- name: "Image",
1498
- options: {
1499
- image: "https://builder.io/api/v1/image/assets%2Fpwgjf0RoYWbdnJSbpBAjXNRMe9F2%2Ffb27a7c790324294af8be1c35fe30f4d",
1500
- backgroundPosition: "center",
1501
- backgroundSize: "cover",
1502
- aspectRatio: 0.7004048582995948
1503
- }
1504
- }
1505
- }, {
1506
- "@type": "@builder.io/sdk:Element",
1507
- responsiveStyles: {
1508
- large: {
1509
- display: "flex",
1510
- flexDirection: "column",
1511
- alignItems: "stretch",
1512
- flexShrink: "0",
1513
- position: "relative",
1514
- marginTop: "30px",
1515
- textAlign: "center",
1516
- lineHeight: "normal",
1517
- height: "auto"
1518
- }
1519
- },
1520
- component: {
1521
- name: "Text",
1522
- options: {
1523
- text: "<p>Enter some text...</p>"
1524
- }
1525
- }
1526
- }]
1527
- }],
1528
- onChange: (e) => {
1529
- function t() {
1530
- n.forEach((i) => {
1531
- i.delete("width");
1532
- });
1533
- }
1534
- const n = e.get("columns");
1535
- Array.isArray(n) && n.find((o) => o.get("width")) && (n.find((a) => !a.get("width")) || n.reduce((s, l) => s + l.get("width"), 0) !== 100) && t();
1536
- }
1537
- }, {
1538
- name: "space",
1539
- type: "number",
1540
- defaultValue: 20,
1541
- helperText: "Size of gap between columns",
1542
- advanced: !0
1543
- }, {
1544
- name: "stackColumnsAt",
1545
- type: "string",
1546
- defaultValue: "tablet",
1547
- helperText: "Convert horizontal columns to vertical at what device size",
1548
- enum: ["tablet", "mobile", "never"],
1549
- advanced: !0
1550
- }, {
1551
- name: "reverseColumnsWhenStacked",
1552
- type: "boolean",
1553
- defaultValue: !1,
1554
- helperText: "When stacking columns for mobile devices, reverse the ordering",
1555
- advanced: !0
1556
- }]
1557
- }, componentInfo$d = {
1558
- name: "Fragment",
1559
- static: !0,
1560
- hidden: !0,
1561
- canHaveChildren: !0,
1562
- noWrap: !0
1563
- }, componentInfo$c = {
1564
- name: "Image",
1565
- static: !0,
1566
- image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",
1567
- defaultStyles: {
1568
- position: "relative",
1569
- minHeight: "20px",
1570
- minWidth: "20px",
1571
- overflow: "hidden"
1572
- },
1573
- canHaveChildren: !0,
1574
- inputs: [{
1575
- name: "image",
1576
- type: "file",
1577
- bubble: !0,
1578
- allowedFileTypes: ["jpeg", "jpg", "png", "svg"],
1579
- required: !0,
1580
- defaultValue: "https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F72c80f114dc149019051b6852a9e3b7a",
1581
- onChange: (e) => {
1582
- e.delete("srcset"), e.delete("noWebp");
1583
- function n(r, s = 6e4) {
1584
- return new Promise((l, c) => {
1585
- const u = document.createElement("img");
1586
- let y = !1;
1587
- u.onload = () => {
1588
- y = !0, l(u);
1589
- }, u.addEventListener("error", (x) => {
1590
- console.warn("Image load failed", x.error), c(x.error);
1591
- }), u.src = r, setTimeout(() => {
1592
- y || c(new Error("Image load timed out"));
1593
- }, s);
1594
- });
1595
- }
1596
- function i(r) {
1597
- return Math.round(r * 1e3) / 1e3;
1598
- }
1599
- const o = e.get("image"), a = e.get("aspectRatio");
1600
- if (fetch(o).then((r) => r.blob()).then((r) => {
1601
- r.type.includes("svg") && e.set("noWebp", !0);
1602
- }), o && (!a || a === 0.7041))
1603
- return n(o).then((r) => {
1604
- const s = e.get("aspectRatio");
1605
- e.get("image") === o && (!s || s === 0.7041) && r.width && r.height && (e.set("aspectRatio", i(r.height / r.width)), e.set("height", r.height), e.set("width", r.width));
1606
- });
1607
- }
1608
- }, {
1609
- name: "backgroundSize",
1610
- type: "text",
1611
- defaultValue: "cover",
1612
- enum: [{
1613
- label: "contain",
1614
- value: "contain",
1615
- helperText: "The image should never get cropped"
1616
- }, {
1617
- label: "cover",
1618
- value: "cover",
1619
- helperText: "The image should fill it's box, cropping when needed"
1620
- }]
1621
- }, {
1622
- name: "backgroundPosition",
1623
- type: "text",
1624
- defaultValue: "center",
1625
- enum: ["center", "top", "left", "right", "bottom", "top left", "top right", "bottom left", "bottom right"]
1626
- }, {
1627
- name: "altText",
1628
- type: "string",
1629
- helperText: "Text to display when the user has images off"
1630
- }, {
1631
- name: "height",
1632
- type: "number",
1633
- hideFromUI: !0
1634
- }, {
1635
- name: "width",
1636
- type: "number",
1637
- hideFromUI: !0
1638
- }, {
1639
- name: "sizes",
1640
- type: "string",
1641
- hideFromUI: !0
1642
- }, {
1643
- name: "srcset",
1644
- type: "string",
1645
- hideFromUI: !0
1646
- }, {
1647
- name: "lazy",
1648
- type: "boolean",
1649
- defaultValue: !0,
1650
- hideFromUI: !0
1651
- }, {
1652
- name: "fitContent",
1653
- type: "boolean",
1654
- helperText: "When child blocks are provided, fit to them instead of using the image's aspect ratio",
1655
- defaultValue: !0
1656
- }, {
1657
- name: "aspectRatio",
1658
- type: "number",
1659
- helperText: "This is the ratio of height/width, e.g. set to 1.5 for a 300px wide and 200px tall photo. Set to 0 to not force the image to maintain it's aspect ratio",
1660
- advanced: !0,
1661
- defaultValue: 0.7041
1662
- }]
1663
- }, componentInfo$b = {
1664
- name: "Core:Section",
1665
- static: !0,
1666
- image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F682efef23ace49afac61748dd305c70a",
1667
- inputs: [{
1668
- name: "maxWidth",
1669
- type: "number",
1670
- defaultValue: 1200
1671
- }, {
1672
- name: "lazyLoad",
1673
- type: "boolean",
1674
- defaultValue: !1,
1675
- advanced: !0,
1676
- description: "Only render this section when in view"
1677
- }],
1678
- defaultStyles: {
1679
- paddingLeft: "20px",
1680
- paddingRight: "20px",
1681
- paddingTop: "50px",
1682
- paddingBottom: "50px",
1683
- marginTop: "0px",
1684
- width: "100vw",
1685
- marginLeft: "calc(50% - 50vw)"
1686
- },
1687
- canHaveChildren: !0,
1688
- defaultChildren: [{
1689
- "@type": "@builder.io/sdk:Element",
1690
- responsiveStyles: {
1691
- large: {
1692
- textAlign: "center"
1693
- }
1694
- },
1695
- component: {
1696
- name: "Text",
1697
- options: {
1698
- text: "<p><b>I am a section! My content keeps from getting too wide, so that it's easy to read even on big screens.</b></p><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</p>"
1699
- }
1700
- }
1701
- }]
1702
- }, componentInfo$a = {
1703
- name: "Slot",
1704
- isRSC: !0,
1705
- description: "Allow child blocks to be inserted into this content when used as a Symbol",
1706
- docsLink: "https://www.builder.io/c/docs/symbols-with-blocks",
1707
- image: "https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F3aad6de36eae43b59b52c85190fdef56",
1708
- // Maybe wrap this for canHaveChildren so bind children to this hm
1709
- inputs: [{
1710
- name: "name",
1711
- type: "string",
1712
- required: !0,
1713
- defaultValue: "children"
1714
- }]
1715
- };
1716
- function Slot(e) {
1717
- var t, n, i;
1718
- return /* @__PURE__ */ jsx(
1719
- "div",
1720
- {
1721
- style: {
1722
- pointerEvents: "auto"
1723
- },
1724
- ...!((t = e.builderContext.context) != null && t.symbolId) && {
1725
- "builder-slot": e.name
1726
- },
1727
- children: /* @__PURE__ */ jsx(
1728
- Blocks,
1729
- {
1730
- parent: (n = e.builderContext.context) == null ? void 0 : n.symbolId,
1731
- path: `symbol.data.${e.name}`,
1732
- context: e.builderContext,
1733
- blocks: (i = e.builderContext.rootState) == null ? void 0 : i[e.name]
1734
- }
1735
- )
1736
- }
1737
- );
1738
- }
1739
- const componentInfo$9 = {
1740
- name: "Symbol",
1741
- noWrap: !0,
1742
- static: !0,
1743
- isRSC: !0,
1744
- inputs: [{
1745
- name: "symbol",
1746
- type: "uiSymbol"
1747
- }, {
1748
- name: "dataOnly",
1749
- helperText: "Make this a data symbol that doesn't display any UI",
1750
- type: "boolean",
1751
- defaultValue: !1,
1752
- advanced: !0,
1753
- hideFromUI: !0
1754
- }, {
1755
- name: "inheritState",
1756
- helperText: "Inherit the parent component state and data",
1757
- type: "boolean",
1758
- defaultValue: !1,
1759
- advanced: !0
1760
- }, {
1761
- name: "renderToLiquid",
1762
- helperText: "Render this symbols contents to liquid. Turn off to fetch with javascript and use custom targeting",
1763
- type: "boolean",
1764
- defaultValue: !1,
1765
- advanced: !0,
1766
- hideFromUI: !0
1767
- }, {
1768
- name: "useChildren",
1769
- hideFromUI: !0,
1770
- type: "boolean"
1771
- }]
1772
- }, componentInfo$8 = {
1773
- name: "Text",
1774
- static: !0,
1775
- isRSC: !0,
1776
- image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-text_fields-24px%20(1).svg?alt=media&token=12177b73-0ee3-42ca-98c6-0dd003de1929",
1777
- inputs: [{
1778
- name: "text",
1779
- type: "html",
1780
- required: !0,
1781
- autoFocus: !0,
1782
- bubble: !0,
1783
- defaultValue: "Enter some text..."
1784
- }],
1785
- defaultStyles: {
1786
- lineHeight: "normal",
1787
- height: "auto",
1788
- textAlign: "center"
1789
- }
1790
- };
1791
- function Text(e) {
1792
- var t;
1793
- return /* @__PURE__ */ jsx(
1794
- "div",
1795
- {
1796
- className: "builder-text",
1797
- dangerouslySetInnerHTML: { __html: ((t = e.text) == null ? void 0 : t.toString()) || "" },
1798
- style: {
1799
- outline: "none"
1800
- }
1801
- }
1802
- );
1803
- }
1804
- const componentInfo$7 = {
1805
- name: "Custom Code",
1806
- static: !0,
1807
- requiredPermissions: ["editCode"],
1808
- inputs: [{
1809
- name: "code",
1810
- type: "html",
1811
- required: !0,
1812
- defaultValue: "<p>Hello there, I am custom HTML code!</p>",
1813
- code: !0
1814
- }, {
1815
- name: "replaceNodes",
1816
- type: "boolean",
1817
- helperText: "Preserve server rendered dom nodes",
1818
- advanced: !0
1819
- }, {
1820
- name: "scriptsClientOnly",
1821
- type: "boolean",
1822
- defaultValue: !1,
1823
- helperText: "Only print and run scripts on the client. Important when scripts influence DOM that could be replaced when client loads",
1824
- advanced: !0
1825
- }]
1826
- };
1827
- function CustomCode(e) {
1828
- const t = useRef(null), [n, i] = useState(() => []), [o, a] = useState(() => []);
1829
- return useEffect(() => {
1830
- var s;
1831
- if (!((s = t.current) != null && s.getElementsByTagName) || typeof window == "undefined")
1832
- return;
1833
- const r = t.current.getElementsByTagName("script");
1834
- for (let l = 0; l < r.length; l++) {
1835
- const c = r[l];
1836
- if (c.src) {
1837
- if (n.includes(c.src))
1838
- continue;
1839
- n.push(c.src);
1840
- const u = document.createElement("script");
1841
- u.async = !0, u.src = c.src, document.head.appendChild(u);
1842
- } else if (!c.type || [
1843
- "text/javascript",
1844
- "application/javascript",
1845
- "application/ecmascript"
1846
- ].includes(c.type)) {
1847
- if (o.includes(c.innerText))
1848
- continue;
1849
- try {
1850
- o.push(c.innerText), new Function(c.innerText)();
1851
- } catch (u) {
1852
- console.warn("`CustomCode`: Error running script:", u);
1853
- }
1854
- }
1855
- }
1856
- }, []), /* @__PURE__ */ jsx(
1857
- "div",
1858
- {
1859
- ref: t,
1860
- className: "builder-custom-code" + (e.replaceNodes ? " replace-nodes" : ""),
1861
- dangerouslySetInnerHTML: { __html: e.code }
1862
- }
1863
- );
1864
- }
1865
- const componentInfo$6 = {
1866
- name: "Embed",
1867
- static: !0,
1868
- inputs: [{
1869
- name: "url",
1870
- type: "url",
1871
- required: !0,
1872
- defaultValue: "",
1873
- helperText: "e.g. enter a youtube url, google map, etc",
1874
- onChange: (e) => {
1875
- const t = e.get("url");
1876
- if (t)
1877
- return e.set("content", "Loading..."), fetch(`https://iframe.ly/api/iframely?url=${t}&api_key=ae0e60e78201a3f2b0de4b`).then((i) => i.json()).then((i) => {
1878
- e.get("url") === t && (i.html ? e.set("content", i.html) : e.set("content", "Invalid url, please try another"));
1879
- }).catch((i) => {
1880
- e.set("content", "There was an error embedding this URL, please try again or another URL");
1881
- });
1882
- e.delete("content");
1883
- }
1884
- }, {
1885
- name: "content",
1886
- type: "html",
1887
- defaultValue: '<div style="padding: 20px; text-align: center">(Choose an embed URL)<div>',
1888
- hideFromUI: !0
1889
- }]
1890
- }, SCRIPT_MIME_TYPES = ["text/javascript", "application/javascript", "application/ecmascript"], isJsScript = (e) => SCRIPT_MIME_TYPES.includes(e.type);
1891
- function Embed(e) {
1892
- const t = useRef(null), [n, i] = useState(() => []), [o, a] = useState(() => []), [r, s] = useState(() => !1);
1893
- function l() {
1894
- if (!t.current || !t.current.getElementsByTagName)
1895
- return;
1896
- const c = t.current.getElementsByTagName("script");
1897
- for (let u = 0; u < c.length; u++) {
1898
- const y = c[u];
1899
- if (y.src && !n.includes(y.src)) {
1900
- n.push(y.src);
1901
- const x = document.createElement("script");
1902
- x.async = !0, x.src = y.src, document.head.appendChild(x);
1903
- } else if (isJsScript(y) && !o.includes(y.innerText))
1904
- try {
1905
- o.push(y.innerText), new Function(y.innerText)();
1906
- } catch (x) {
1907
- console.warn("`Embed`: Error running script:", x);
1908
- }
1909
- }
1910
- }
1911
- return useEffect(() => {
1912
- t.current && !r && (s(!0), l());
1913
- }, [t.current, r]), /* @__PURE__ */ jsx(
1914
- "div",
1915
- {
1916
- className: "builder-embed",
1917
- ref: t,
1918
- dangerouslySetInnerHTML: { __html: e.content }
1919
- }
1920
- );
1921
- }
1922
- const componentInfo$5 = {
1923
- name: "Form:Form",
1924
- // editableTags: ['builder-form-error']
1925
- defaults: {
1926
- responsiveStyles: {
1927
- large: {
1928
- marginTop: "15px",
1929
- paddingBottom: "15px"
1930
- }
1931
- }
1932
- },
1933
- image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2Fef36d2a846134910b64b88e6d18c5ca5",
1934
- inputs: [{
1935
- name: "sendSubmissionsTo",
1936
- type: "string",
1937
- // TODO: save to builder data and user can download as csv
1938
- // TODO: easy for mode too or computed add/remove fields form mode
1939
- // so you can edit details and high level mode at same time...
1940
- // Later - more integrations like mailchimp
1941
- // /api/v1/form-submit?to=mailchimp
1942
- enum: [{
1943
- label: "Send to email",
1944
- value: "email",
1945
- helperText: "Send form submissions to the email address of your choosing"
1946
- }, {
1947
- label: "Custom",
1948
- value: "custom",
1949
- helperText: "Handle where the form requests go manually with a little code, e.g. to your own custom backend"
1950
- }],
1951
- defaultValue: "email"
1952
- }, {
1953
- name: "sendSubmissionsToEmail",
1954
- type: "string",
1955
- required: !0,
1956
- // TODO: required: () => options.get("sendSubmissionsTo") === "email"
1957
- defaultValue: "your@email.com",
1958
- showIf: 'options.get("sendSubmissionsTo") === "email"'
1959
- }, {
1960
- name: "sendWithJs",
1961
- type: "boolean",
1962
- helperText: "Set to false to use basic html form action",
1963
- defaultValue: !0,
1964
- showIf: 'options.get("sendSubmissionsTo") === "custom"'
1965
- }, {
1966
- name: "name",
1967
- type: "string",
1968
- defaultValue: "My form"
1969
- // advanced: true
1970
- }, {
1971
- name: "action",
1972
- type: "string",
1973
- helperText: "URL to send the form data to",
1974
- showIf: 'options.get("sendSubmissionsTo") === "custom"'
1975
- }, {
1976
- name: "contentType",
1977
- type: "string",
1978
- defaultValue: "application/json",
1979
- advanced: !0,
1980
- // TODO: do automatically if file input
1981
- enum: ["application/json", "multipart/form-data", "application/x-www-form-urlencoded"],
1982
- showIf: 'options.get("sendSubmissionsTo") === "custom" && options.get("sendWithJs") === true'
1983
- }, {
1984
- name: "method",
1985
- type: "string",
1986
- showIf: 'options.get("sendSubmissionsTo") === "custom"',
1987
- defaultValue: "POST",
1988
- advanced: !0
1989
- }, {
1990
- name: "previewState",
1991
- type: "string",
1992
- // TODO: persist: false flag
1993
- enum: ["unsubmitted", "sending", "success", "error"],
1994
- defaultValue: "unsubmitted",
1995
- helperText: 'Choose a state to edit, e.g. choose "success" to show what users see on success and edit the message',
1996
- showIf: 'options.get("sendSubmissionsTo") !== "zapier" && options.get("sendWithJs") === true'
1997
- }, {
1998
- name: "successUrl",
1999
- type: "url",
2000
- helperText: "Optional URL to redirect the user to on form submission success",
2001
- showIf: 'options.get("sendSubmissionsTo") !== "zapier" && options.get("sendWithJs") === true'
2002
- }, {
2003
- name: "resetFormOnSubmit",
2004
- type: "boolean",
2005
- showIf: "options.get('sendSubmissionsTo') === 'custom' && options.get('sendWithJs') === true",
2006
- advanced: !0
2007
- }, {
2008
- name: "successMessage",
2009
- type: "uiBlocks",
2010
- hideFromUI: !0,
2011
- defaultValue: [{
2012
- "@type": "@builder.io/sdk:Element",
2013
- responsiveStyles: {
2014
- large: {
2015
- marginTop: "10px"
2016
- }
2017
- },
2018
- component: {
2019
- name: "Text",
2020
- options: {
2021
- text: "<span>Thanks!</span>"
2022
- }
2023
- }
2024
- }]
2025
- }, {
2026
- name: "validate",
2027
- type: "boolean",
2028
- defaultValue: !0,
2029
- advanced: !0
2030
- }, {
2031
- name: "errorMessagePath",
2032
- type: "text",
2033
- advanced: !0,
2034
- helperText: 'Path to where to get the error message from in a JSON response to display to the user, e.g. "error.message" for a response like { "error": { "message": "this username is taken" }}'
2035
- }, {
2036
- name: "errorMessage",
2037
- type: "uiBlocks",
2038
- hideFromUI: !0,
2039
- defaultValue: [{
2040
- "@type": "@builder.io/sdk:Element",
2041
- responsiveStyles: {
2042
- large: {
2043
- marginTop: "10px"
2044
- }
2045
- },
2046
- bindings: {
2047
- "component.options.text": "state.formErrorMessage || block.component.options.text"
2048
- },
2049
- component: {
2050
- name: "Text",
2051
- options: {
2052
- text: "<span>Form submission error :( Please check your answers and try again</span>"
2053
- }
2054
- }
2055
- }]
2056
- }, {
2057
- name: "sendingMessage",
2058
- type: "uiBlocks",
2059
- hideFromUI: !0,
2060
- defaultValue: [{
2061
- "@type": "@builder.io/sdk:Element",
2062
- responsiveStyles: {
2063
- large: {
2064
- marginTop: "10px"
2065
- }
2066
- },
2067
- component: {
2068
- name: "Text",
2069
- options: {
2070
- text: "<span>Sending...</span>"
2071
- }
2072
- }
2073
- }]
2074
- }, {
2075
- name: "customHeaders",
2076
- type: "map",
2077
- valueType: {
2078
- type: "string"
2079
- },
2080
- advanced: !0,
2081
- showIf: 'options.get("sendSubmissionsTo") === "custom" && options.get("sendWithJs") === true'
2082
- }],
2083
- noWrap: !0,
2084
- canHaveChildren: !0,
2085
- defaultChildren: [{
2086
- "@type": "@builder.io/sdk:Element",
2087
- responsiveStyles: {
2088
- large: {
2089
- marginTop: "10px"
2090
- }
2091
- },
2092
- component: {
2093
- name: "Text",
2094
- options: {
2095
- text: "<span>Enter your name</span>"
2096
- }
2097
- }
2098
- }, {
2099
- "@type": "@builder.io/sdk:Element",
2100
- responsiveStyles: {
2101
- large: {
2102
- marginTop: "10px"
2103
- }
2104
- },
2105
- component: {
2106
- name: "Form:Input",
2107
- options: {
2108
- name: "name",
2109
- placeholder: "Jane Doe"
2110
- }
2111
- }
2112
- }, {
2113
- "@type": "@builder.io/sdk:Element",
2114
- responsiveStyles: {
2115
- large: {
2116
- marginTop: "10px"
2117
- }
2118
- },
2119
- component: {
2120
- name: "Text",
2121
- options: {
2122
- text: "<span>Enter your email</span>"
2123
- }
2124
- }
2125
- }, {
2126
- "@type": "@builder.io/sdk:Element",
2127
- responsiveStyles: {
2128
- large: {
2129
- marginTop: "10px"
2130
- }
2131
- },
2132
- component: {
2133
- name: "Form:Input",
2134
- options: {
2135
- name: "email",
2136
- placeholder: "jane@doe.com"
2137
- }
2138
- }
2139
- }, {
2140
- "@type": "@builder.io/sdk:Element",
2141
- responsiveStyles: {
2142
- large: {
2143
- marginTop: "10px"
2144
- }
2145
- },
2146
- component: {
2147
- name: "Form:SubmitButton",
2148
- options: {
2149
- text: "Submit"
2150
- }
2151
- }
2152
- }]
2153
- }, validEnvList = ["production", "qa", "test", "development", "dev", "cdn-qa", "cloud", "fast", "cdn2", "cdn-prod"], getEnv = () => {
2154
- const e = process.env.NODE_ENV || "production";
2155
- return validEnvList.includes(e) ? e : "production";
2156
- }, get = (e, t, n) => {
2157
- const i = String.prototype.split.call(t, /[,[\].]+?/).filter(Boolean).reduce((o, a) => o != null ? o[a] : o, e);
2158
- return i === void 0 || i === e ? n : i;
2159
- };
2160
- function FormComponent(e) {
2161
- var y, x;
2162
- const t = useRef(null), [n, i] = useState(() => "unsubmitted"), [o, a] = useState(() => null), [r, s] = useState(() => "");
2163
- function l(m) {
2164
- var f, v;
2165
- const d = {
2166
- ...e.builderContext.rootState,
2167
- ...m
2168
- };
2169
- e.builderContext.rootSetState ? (v = (f = e.builderContext).rootSetState) == null || v.call(f, d) : e.builderContext.rootState = d;
2170
- }
2171
- function c() {
2172
- return isEditing() && e.previewState || n;
2173
- }
2174
- function u(m) {
2175
- var f;
2176
- const d = e.sendWithJs || e.sendSubmissionsTo === "email";
2177
- if (e.sendSubmissionsTo === "zapier")
2178
- m.preventDefault();
2179
- else if (d) {
2180
- if (!(e.action || e.sendSubmissionsTo === "email")) {
2181
- m.preventDefault();
2182
- return;
2183
- }
2184
- m.preventDefault();
2185
- const v = m.currentTarget, R = e.customHeaders || {};
2186
- let S;
2187
- const C = new FormData(v), w = Array.from(
2188
- m.currentTarget.querySelectorAll("input,select,textarea")
2189
- ).filter((g) => !!g.name).map((g) => {
2190
- let I;
2191
- const A = g.name;
2192
- if (g instanceof HTMLInputElement)
2193
- if (g.type === "radio") {
2194
- if (g.checked)
2195
- return I = g.name, {
2196
- key: A,
2197
- value: I
2198
- };
2199
- } else if (g.type === "checkbox")
2200
- I = g.checked;
2201
- else if (g.type === "number" || g.type === "range") {
2202
- const j = g.valueAsNumber;
2203
- isNaN(j) || (I = j);
2204
- } else
2205
- g.type === "file" ? I = g.files : I = g.value;
2206
- else
2207
- I = g.value;
2208
- return {
2209
- key: A,
2210
- value: I
2211
- };
2212
- });
2213
- let E = e.contentType;
2214
- if (e.sendSubmissionsTo === "email" && (E = "multipart/form-data"), Array.from(w).forEach(({ value: g }) => {
2215
- (g instanceof File || Array.isArray(g) && g[0] instanceof File || g instanceof FileList) && (E = "multipart/form-data");
2216
- }), E !== "application/json")
2217
- S = C;
2218
- else {
2219
- const g = {};
2220
- Array.from(w).forEach(({ value: I, key: A }) => {
2221
- set(g, A, I);
2222
- }), S = JSON.stringify(g);
2223
- }
2224
- E && E !== "multipart/form-data" && (d && ((f = e.action) != null && f.includes("zapier.com")) || (R["content-type"] = E));
2225
- const B = new CustomEvent("presubmit", { detail: { body: S } });
2226
- if (t.current && (t.current.dispatchEvent(B), B.defaultPrevented))
2227
- return;
2228
- i("sending");
2229
- const F = `${getEnv() === "dev" ? "http://localhost:5000" : "https://builder.io"}/api/v1/form-submit?apiKey=${e.builderContext.apiKey}&to=${btoa(
2230
- e.sendSubmissionsToEmail || ""
2231
- )}&name=${encodeURIComponent(e.name || "")}`;
2232
- fetch(
2233
- e.sendSubmissionsTo === "email" ? F : e.action,
2234
- { body: S, headers: R, method: e.method || "post" }
2235
- ).then(
2236
- async (g) => {
2237
- let I;
2238
- const A = g.headers.get("content-type");
2239
- if (A && A.indexOf("application/json") !== -1 ? I = await g.json() : I = await g.text(), !g.ok && e.errorMessagePath) {
2240
- let j = get(I, e.errorMessagePath);
2241
- j && (typeof j != "string" && (j = JSON.stringify(j)), s(j), l({ formErrorMessage: j }));
2242
- }
2243
- if (a(I), i(g.ok ? "success" : "error"), g.ok) {
2244
- const j = new CustomEvent("submit:success", {
2245
- detail: { res: g, body: I }
2246
- });
2247
- if (t.current) {
2248
- if (t.current.dispatchEvent(j), j.defaultPrevented)
2249
- return;
2250
- e.resetFormOnSubmit !== !1 && t.current.reset();
2251
- }
2252
- if (e.successUrl)
2253
- if (t.current) {
2254
- const V = new CustomEvent("route", {
2255
- detail: { url: e.successUrl }
2256
- });
2257
- t.current.dispatchEvent(V), V.defaultPrevented || (location.href = e.successUrl);
2258
- } else
2259
- location.href = e.successUrl;
2260
- }
2261
- },
2262
- (g) => {
2263
- const I = new CustomEvent("submit:error", {
2264
- detail: { error: g }
2265
- });
2266
- t.current && (t.current.dispatchEvent(I), I.defaultPrevented) || (a(g), i("error"));
2267
- }
2268
- );
2269
- }
2270
- }
2271
- return /* @__PURE__ */ jsxs(Fragment, { children: [
2272
- " ",
2273
- /* @__PURE__ */ jsxs(
2274
- "form",
2275
- {
2276
- validate: e.validate,
2277
- ref: t,
2278
- action: !e.sendWithJs && e.action,
2279
- method: e.method,
2280
- name: e.name,
2281
- onSubmit: (m) => u(m),
2282
- ...e.attributes,
2283
- children: [
2284
- " ",
2285
- e.builderBlock && e.builderBlock.children ? /* @__PURE__ */ jsx(Fragment, { children: (x = (y = e.builderBlock) == null ? void 0 : y.children) == null ? void 0 : x.map((m, d) => /* @__PURE__ */ jsx(
2286
- Block,
2287
- {
2288
- block: m,
2289
- context: e.builderContext,
2290
- registeredComponents: e.builderComponents,
2291
- linkComponent: e.builderLinkComponent
2292
- },
2293
- `form-block-${d}`
2294
- )) }) : null,
2295
- " ",
2296
- c() === "error" ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
2297
- Blocks,
2298
- {
2299
- path: "errorMessage",
2300
- blocks: e.errorMessage,
2301
- context: e.builderContext
2302
- }
2303
- ) }) : null,
2304
- " ",
2305
- c() === "sending" ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
2306
- Blocks,
2307
- {
2308
- path: "sendingMessage",
2309
- blocks: e.sendingMessage,
2310
- context: e.builderContext
2311
- }
2312
- ) }) : null,
2313
- " ",
2314
- c() === "error" && o ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("pre", { className: "builder-form-error-text pre-25b9edf0", children: [
2315
- " ",
2316
- JSON.stringify(o, null, 2),
2317
- " "
2318
- ] }) }) : null,
2319
- " ",
2320
- c() === "success" ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
2321
- Blocks,
2322
- {
2323
- path: "successMessage",
2324
- blocks: e.successMessage,
2325
- context: e.builderContext
2326
- }
2327
- ) }) : null,
2328
- " "
2329
- ]
2330
- }
2331
- ),
2332
- " ",
2333
- /* @__PURE__ */ jsx("style", { children: ".pre-25b9edf0 { padding: 10px; color: red; text-align: center; }" }),
2334
- " "
2335
- ] });
2336
- }
2337
- const componentInfo$4 = {
2338
- name: "Form:Input",
2339
- image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2Fad6f37889d9e40bbbbc72cdb5875d6ca",
2340
- inputs: [
2341
- {
2342
- name: "type",
2343
- type: "text",
2344
- enum: ["text", "number", "email", "url", "checkbox", "radio", "range", "date", "datetime-local", "search", "tel", "time", "file", "month", "week", "password", "color", "hidden"],
2345
- defaultValue: "text"
2346
- },
2347
- {
2348
- name: "name",
2349
- type: "string",
2350
- required: !0,
2351
- helperText: 'Every input in a form needs a unique name describing what it takes, e.g. "email"'
2352
- },
2353
- {
2354
- name: "placeholder",
2355
- type: "string",
2356
- defaultValue: "Hello there",
2357
- helperText: "Text to display when there is no value"
2358
- },
2359
- // TODO: handle value vs default value automatically like ng-model
2360
- {
2361
- name: "defaultValue",
2362
- type: "string"
2363
- },
2364
- {
2365
- name: "value",
2366
- type: "string",
2367
- advanced: !0
2368
- },
2369
- {
2370
- name: "required",
2371
- type: "boolean",
2372
- helperText: "Is this input required to be filled out to submit a form",
2373
- defaultValue: !1
2374
- }
2375
- ],
2376
- noWrap: !0,
2377
- static: !0,
2378
- defaultStyles: {
2379
- paddingTop: "10px",
2380
- paddingBottom: "10px",
2381
- paddingLeft: "10px",
2382
- paddingRight: "10px",
2383
- borderRadius: "3px",
2384
- borderWidth: "1px",
2385
- borderStyle: "solid",
2386
- borderColor: "#ccc"
2387
- }
2388
- };
2389
- function FormInputComponent(e) {
2390
- return /* @__PURE__ */ createElement(
2391
- "input",
2392
- {
2393
- ...e.attributes,
2394
- key: isEditing() && e.defaultValue ? e.defaultValue : "default-key",
2395
- placeholder: e.placeholder,
2396
- type: e.type,
2397
- name: e.name,
2398
- value: e.value,
2399
- defaultValue: e.defaultValue,
2400
- required: e.required
2401
- }
2402
- );
2403
- }
2404
- const componentInfo$3 = {
2405
- name: "Form:Select",
2406
- image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F83acca093fb24aaf94dee136e9a4b045",
2407
- defaultStyles: {
2408
- alignSelf: "flex-start"
2409
- },
2410
- inputs: [{
2411
- name: "options",
2412
- type: "list",
2413
- required: !0,
2414
- subFields: [{
2415
- name: "value",
2416
- type: "text",
2417
- required: !0
2418
- }, {
2419
- name: "name",
2420
- type: "text"
2421
- }],
2422
- defaultValue: [{
2423
- value: "option 1"
2424
- }, {
2425
- value: "option 2"
2426
- }]
2427
- }, {
2428
- name: "name",
2429
- type: "string",
2430
- required: !0,
2431
- helperText: 'Every select in a form needs a unique name describing what it gets, e.g. "email"'
2432
- }, {
2433
- name: "defaultValue",
2434
- type: "string"
2435
- }, {
2436
- name: "value",
2437
- type: "string",
2438
- advanced: !0
2439
- }, {
2440
- name: "required",
2441
- type: "boolean",
2442
- defaultValue: !1
2443
- }],
2444
- static: !0,
2445
- noWrap: !0
2446
- };
2447
- function SelectComponent(e) {
2448
- var t;
2449
- return /* @__PURE__ */ createElement(
2450
- "select",
2451
- {
2452
- ...e.attributes,
2453
- value: e.value,
2454
- key: isEditing() && e.defaultValue ? e.defaultValue : "default-key",
2455
- defaultValue: e.defaultValue,
2456
- name: e.name
2457
- },
2458
- (t = e.options) == null ? void 0 : t.map((n) => /* @__PURE__ */ jsx("option", { value: n.value, children: n.name || n.value }))
2459
- );
2460
- }
2461
- const componentInfo$2 = {
2462
- name: "Form:SubmitButton",
2463
- image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2Fdf2820ffed1f4349a94c40b3221f5b98",
2464
- defaultStyles: {
2465
- appearance: "none",
2466
- paddingTop: "15px",
2467
- paddingBottom: "15px",
2468
- paddingLeft: "25px",
2469
- paddingRight: "25px",
2470
- backgroundColor: "#3898EC",
2471
- color: "white",
2472
- borderRadius: "4px",
2473
- cursor: "pointer"
2474
- },
2475
- inputs: [{
2476
- name: "text",
2477
- type: "text",
2478
- defaultValue: "Click me"
2479
- }],
2480
- static: !0,
2481
- noWrap: !0
2482
- // TODO: optional children? maybe as optional form input
2483
- // that only shows if advanced setting is flipped
2484
- // TODO: defaultChildren
2485
- // canHaveChildren: true,
2486
- };
2487
- function SubmitButton(e) {
2488
- return /* @__PURE__ */ jsx("button", { type: "submit", ...e.attributes, children: e.text });
2489
- }
2490
- const componentInfo$1 = {
2491
- // friendlyName?
2492
- name: "Raw:Img",
2493
- hideFromInsertMenu: !0,
2494
- image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",
2495
- inputs: [{
2496
- name: "image",
2497
- bubble: !0,
2498
- type: "file",
2499
- allowedFileTypes: ["jpeg", "jpg", "png", "svg", "gif", "webp"],
2500
- required: !0
2501
- }],
2502
- noWrap: !0,
2503
- static: !0
2504
- };
2505
- function ImgComponent(e) {
2506
- return /* @__PURE__ */ jsx(
2507
- "img",
2508
- {
2509
- style: {
2510
- objectFit: e.backgroundSize || "cover",
2511
- objectPosition: e.backgroundPosition || "center"
2512
- },
2513
- alt: e.altText,
2514
- src: e.imgSrc || e.image,
2515
- ...e.attributes
2516
- },
2517
- isEditing() && e.imgSrc || "default-key"
2518
- );
2519
- }
2520
- const componentInfo = {
2521
- name: "Video",
2522
- canHaveChildren: !0,
2523
- defaultStyles: {
2524
- minHeight: "20px",
2525
- minWidth: "20px"
2526
- },
2527
- image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-videocam-24px%20(1).svg?alt=media&token=49a84e4a-b20e-4977-a650-047f986874bb",
2528
- inputs: [{
2529
- name: "video",
2530
- type: "file",
2531
- allowedFileTypes: ["mp4"],
2532
- bubble: !0,
2533
- defaultValue: "https://cdn.builder.io/o/assets%2FYJIGb4i01jvw0SRdL5Bt%2Fd27731a526464deba0016216f5f9e570%2Fcompressed?apiKey=YJIGb4i01jvw0SRdL5Bt&token=d27731a526464deba0016216f5f9e570&alt=media&optimized=true",
2534
- required: !0
2535
- }, {
2536
- name: "posterImage",
2537
- type: "file",
2538
- allowedFileTypes: ["jpeg", "png"],
2539
- helperText: "Image to show before the video plays"
2540
- }, {
2541
- name: "autoPlay",
2542
- type: "boolean",
2543
- defaultValue: !0
2544
- }, {
2545
- name: "controls",
2546
- type: "boolean",
2547
- defaultValue: !1
2548
- }, {
2549
- name: "muted",
2550
- type: "boolean",
2551
- defaultValue: !0
2552
- }, {
2553
- name: "loop",
2554
- type: "boolean",
2555
- defaultValue: !0
2556
- }, {
2557
- name: "playsInline",
2558
- type: "boolean",
2559
- defaultValue: !0
2560
- }, {
2561
- name: "fit",
2562
- type: "text",
2563
- defaultValue: "cover",
2564
- enum: ["contain", "cover", "fill", "auto"]
2565
- }, {
2566
- name: "preload",
2567
- type: "text",
2568
- defaultValue: "metadata",
2569
- enum: ["auto", "metadata", "none"]
2570
- }, {
2571
- name: "fitContent",
2572
- type: "boolean",
2573
- helperText: "When child blocks are provided, fit to them instead of using the aspect ratio",
2574
- defaultValue: !0,
2575
- advanced: !0
2576
- }, {
2577
- name: "position",
2578
- type: "text",
2579
- defaultValue: "center",
2580
- enum: ["center", "top", "left", "right", "bottom", "top left", "top right", "bottom left", "bottom right"]
2581
- }, {
2582
- name: "height",
2583
- type: "number",
2584
- advanced: !0
2585
- }, {
2586
- name: "width",
2587
- type: "number",
2588
- advanced: !0
2589
- }, {
2590
- name: "aspectRatio",
2591
- type: "number",
2592
- advanced: !0,
2593
- defaultValue: 0.7004048582995948
2594
- }, {
2595
- name: "lazyLoad",
2596
- type: "boolean",
2597
- helperText: 'Load this video "lazily" - as in only when a user scrolls near the video. Recommended for optmized performance and bandwidth consumption',
2598
- defaultValue: !0,
2599
- advanced: !0
2600
- }]
2601
- };
2602
- function Video(e) {
2603
- var i, o, a, r, s, l, c;
2604
- function t() {
2605
- return {
2606
- ...e.autoPlay === !0 ? {
2607
- autoPlay: !0
2608
- } : {},
2609
- ...e.muted === !0 ? {
2610
- muted: !0
2611
- } : {},
2612
- ...e.controls === !0 ? {
2613
- controls: !0
2614
- } : {},
2615
- ...e.loop === !0 ? {
2616
- loop: !0
2617
- } : {},
2618
- ...e.playsInline === !0 ? {
2619
- playsInline: !0
2620
- } : {}
2621
- };
2622
- }
2623
- function n() {
2624
- return {
2625
- ...t()
2626
- };
2627
- }
2628
- return /* @__PURE__ */ jsxs(
2629
- "div",
2630
- {
2631
- style: {
2632
- position: "relative"
2633
- },
2634
- children: [
2635
- /* @__PURE__ */ jsx(
2636
- "video",
2637
- {
2638
- className: "builder-video",
2639
- ...n(),
2640
- preload: e.preload || "metadata",
2641
- style: {
2642
- width: "100%",
2643
- height: "100%",
2644
- ...(i = e.attributes) == null ? void 0 : i.style,
2645
- objectFit: e.fit,
2646
- objectPosition: e.position,
2647
- // Hack to get object fit to work as expected and
2648
- // not have the video overflow
2649
- zIndex: 2,
2650
- borderRadius: "1px",
2651
- ...e.aspectRatio ? {
2652
- position: "absolute"
2653
- } : null
2654
- },
2655
- src: e.video || "no-src",
2656
- poster: e.posterImage,
2657
- children: e.lazyLoad ? null : /* @__PURE__ */ jsx("source", { type: "video/mp4", src: e.video })
2658
- }
2659
- ),
2660
- e.aspectRatio && !(e.fitContent && ((a = (o = e.builderBlock) == null ? void 0 : o.children) != null && a.length)) ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
2661
- "div",
2662
- {
2663
- style: {
2664
- width: "100%",
2665
- paddingTop: e.aspectRatio * 100 + "%",
2666
- pointerEvents: "none",
2667
- fontSize: "0px"
2668
- }
2669
- }
2670
- ) }) : null,
2671
- (s = (r = e.builderBlock) == null ? void 0 : r.children) != null && s.length && e.fitContent ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
2672
- "div",
2673
- {
2674
- style: {
2675
- display: "flex",
2676
- flexDirection: "column",
2677
- alignItems: "stretch"
2678
- },
2679
- children: e.children
2680
- }
2681
- ) }) : null,
2682
- (c = (l = e.builderBlock) == null ? void 0 : l.children) != null && c.length && !e.fitContent ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
2683
- "div",
2684
- {
2685
- style: {
2686
- pointerEvents: "none",
2687
- display: "flex",
2688
- flexDirection: "column",
2689
- alignItems: "stretch",
2690
- position: "absolute",
2691
- top: "0",
2692
- left: "0",
2693
- width: "100%",
2694
- height: "100%"
2695
- },
2696
- children: e.children
2697
- }
2698
- ) }) : null
2699
- ]
2700
- }
2701
- );
2702
- }
2703
- const getExtraComponents = () => [{
2704
- component: CustomCode,
2705
- ...componentInfo$7
2706
- }, {
2707
- component: Embed,
2708
- ...componentInfo$6
2709
- }, {
2710
- component: FormComponent,
2711
- ...componentInfo$5
2712
- }, {
2713
- component: FormInputComponent,
2714
- ...componentInfo$4
2715
- }, {
2716
- component: SubmitButton,
2717
- ...componentInfo$2
2718
- }, {
2719
- component: SelectComponent,
2720
- ...componentInfo$3
2721
- }, {
2722
- component: ImgComponent,
2723
- ...componentInfo$1
2724
- }, {
2725
- component: Video,
2726
- ...componentInfo
2727
- }], getDefaultRegisteredComponents = () => [{
2728
- component: Button,
2729
- ...componentInfo$f
2730
- }, {
2731
- component: Columns,
2732
- ...componentInfo$e
2733
- }, {
2734
- component: FragmentComponent,
2735
- ...componentInfo$d
2736
- }, {
2737
- component: Image,
2738
- ...componentInfo$c
2739
- }, {
2740
- component: SectionComponent,
2741
- ...componentInfo$b
2742
- }, {
2743
- component: Slot,
2744
- ...componentInfo$a
2745
- }, {
2746
- component: Symbol$1,
2747
- ...componentInfo$9
2748
- }, {
2749
- component: Text,
2750
- ...componentInfo$8
2751
- }, ...getExtraComponents()], UPDATE_COOKIES_AND_STYLES_SCRIPT = `function updateCookiesAndStyles(contentId, variants, isHydrationTarget) {
2752
- function getAndSetVariantId() {
2753
- function setCookie(name, value, days) {
2754
- let expires = '';
2755
- if (days) {
2756
- const date = new Date();
2757
- date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);
2758
- expires = '; expires=' + date.toUTCString();
2759
- }
2760
- document.cookie = name + '=' + (value || '') + expires + '; path=/' + '; Secure; SameSite=None';
2761
- }
2762
- function getCookie(name) {
2763
- const nameEQ = name + '=';
2764
- const ca = document.cookie.split(';');
2765
- for (let i = 0; i < ca.length; i++) {
2766
- let c = ca[i];
2767
- while (c.charAt(0) === ' ') c = c.substring(1, c.length);
2768
- if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length, c.length);
2769
- }
2770
- return null;
2771
- }
2772
- const cookieName = \`builder.tests.\${contentId}\`;
2773
- const variantInCookie = getCookie(cookieName);
2774
- const availableIDs = variants.map(vr => vr.id).concat(contentId);
2775
- if (variantInCookie && availableIDs.includes(variantInCookie)) {
2776
- return variantInCookie;
2777
- }
2778
- let n = 0;
2779
- const random = Math.random();
2780
- for (let i = 0; i < variants.length; i++) {
2781
- const variant = variants[i];
2782
- const testRatio = variant.testRatio;
2783
- n += testRatio;
2784
- if (random < n) {
2785
- setCookie(cookieName, variant.id);
2786
- return variant.id;
2787
- }
2788
- }
2789
- setCookie(cookieName, contentId);
2790
- return contentId;
2791
- }
2792
- const winningVariantId = getAndSetVariantId();
2793
- const styleEl = document.currentScript?.previousElementSibling;
2794
- if (isHydrationTarget) {
2795
- styleEl.remove();
2796
- const thisScriptEl = document.currentScript;
2797
- thisScriptEl?.remove();
2798
- } else {
2799
- const newStyleStr = variants.concat({
2800
- id: contentId
2801
- }).filter(variant => variant.id !== winningVariantId).map(value => {
2802
- return \`.variant-\${value.id} { display: none; }
2803
- \`;
2804
- }).join('');
2805
- styleEl.innerHTML = newStyleStr;
2806
- }
2807
- }`, UPDATE_VARIANT_VISIBILITY_SCRIPT = `function updateVariantVisibility(variantContentId, defaultContentId, isHydrationTarget) {
2808
- if (!navigator.cookieEnabled) {
2809
- return;
2810
- }
2811
- function getCookie(name) {
2812
- const nameEQ = name + '=';
2813
- const ca = document.cookie.split(';');
2814
- for (let i = 0; i < ca.length; i++) {
2815
- let c = ca[i];
2816
- while (c.charAt(0) === ' ') c = c.substring(1, c.length);
2817
- if (c.indexOf(nameEQ) === 0) return c.substring(nameEQ.length, c.length);
2818
- }
2819
- return null;
2820
- }
2821
- const cookieName = \`builder.tests.\${defaultContentId}\`;
2822
- const winningVariant = getCookie(cookieName);
2823
- const parentDiv = document.currentScript?.parentElement;
2824
- const isDefaultContent = variantContentId === defaultContentId;
2825
- const isWinningVariant = winningVariant === variantContentId;
2826
- if (isWinningVariant && !isDefaultContent) {
2827
- parentDiv?.removeAttribute('hidden');
2828
- parentDiv?.removeAttribute('aria-hidden');
2829
- } else if (!isWinningVariant && isDefaultContent) {
2830
- parentDiv?.setAttribute('hidden', 'true');
2831
- parentDiv?.setAttribute('aria-hidden', 'true');
2832
- }
2833
- if (isHydrationTarget) {
2834
- if (!isWinningVariant) {
2835
- parentDiv?.remove();
2836
- }
2837
- const thisScriptEl = document.currentScript;
2838
- thisScriptEl?.remove();
2839
- }
2840
- return;
2841
- }`, UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME = "builderIoAbTest", UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME = "builderIoRenderContent", getVariants = (e) => Object.values((e == null ? void 0 : e.variations) || {}).map((t) => ({
2842
- ...t,
2843
- testVariationId: t.id,
2844
- id: e == null ? void 0 : e.id
2845
- })), checkShouldRenderVariants = ({
2846
- canTrack: e,
2847
- content: t
2848
- }) => !(!(getVariants(t).length > 0) || !e || isBrowser()), getIsHydrationTarget = (e) => e === "react" || e === "reactNative", isHydrationTarget = getIsHydrationTarget(TARGET), getScriptString = () => `
2849
- window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME} = ${UPDATE_COOKIES_AND_STYLES_SCRIPT}
2850
- window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME} = ${UPDATE_VARIANT_VISIBILITY_SCRIPT}
2851
- `, getUpdateCookieAndStylesScript = (e, t) => `
2852
- window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME}(
2853
- "${t}",${JSON.stringify(e)}, ${isHydrationTarget}
2854
- )`, getUpdateVariantVisibilityScript = ({
2855
- contentId: e,
2856
- variationId: t
2857
- }) => `window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME}(
2858
- "${t}", "${e}", ${isHydrationTarget}
2859
- )`;
2860
- function InlinedScript(e) {
2861
- return /* @__PURE__ */ jsx(
2862
- "script",
2863
- {
2864
- dangerouslySetInnerHTML: { __html: e.scriptStr },
2865
- id: e.id || ""
2866
- }
2867
- );
2868
- }
2869
- function round(e) {
2870
- return Math.round(e * 1e3) / 1e3;
2871
- }
2872
- const findParentElement = (e, t, n = !0) => {
2873
- if (!(e instanceof HTMLElement))
2874
- return null;
2875
- let i = n ? e : e.parentElement;
2876
- do {
2877
- if (!i)
2878
- return null;
2879
- if (t(i))
2880
- return i;
2881
- } while (i = i.parentElement);
2882
- return null;
2883
- }, findBuilderParent = (e) => findParentElement(e, (t) => {
2884
- const n = t.getAttribute("builder-id") || t.id;
2885
- return (n == null ? void 0 : n.indexOf("builder-")) === 0;
2886
- }), computeOffset = ({
2887
- event: e,
2888
- target: t
2889
- }) => {
2890
- const n = t.getBoundingClientRect(), i = e.clientX - n.left, o = e.clientY - n.top, a = round(i / n.width), r = round(o / n.height);
2891
- return {
2892
- x: a,
2893
- y: r
2894
- };
2895
- }, getInteractionPropertiesForEvent = (e) => {
2896
- const t = e.target, n = t && findBuilderParent(t), i = (n == null ? void 0 : n.getAttribute("builder-id")) || (n == null ? void 0 : n.id);
2897
- return {
2898
- targetBuilderElement: i || void 0,
2899
- metadata: {
2900
- targetOffset: t ? computeOffset({
2901
- event: e,
2902
- target: t
2903
- }) : void 0,
2904
- builderTargetOffset: n ? computeOffset({
2905
- event: e,
2906
- target: n
2907
- }) : void 0,
2908
- builderElementIndex: n && i ? [].slice.call(document.getElementsByClassName(i)).indexOf(n) : void 0
2909
- }
2910
- };
2911
- };
2912
- function EnableEditor(e) {
2913
- var F, g, I, A, j, V, $;
2914
- const t = useRef(null), [n, i] = useState(() => 0);
2915
- useState(() => !0);
2916
- function o(h) {
2917
- var p, k;
2918
- const b = {
2919
- ...e.builderContextSignal.rootState,
2920
- ...h
2921
- };
2922
- e.builderContextSignal.rootSetState ? (k = (p = e.builderContextSignal).rootSetState) == null || k.call(p, b) : e.setBuilderContextSignal((T) => ({
2923
- ...T,
2924
- rootState: b
2925
- }));
2926
- }
2927
- function a(h) {
2928
- var p, k, T, P, N;
2929
- const b = {
2930
- ...e.builderContextSignal.content,
2931
- ...h,
2932
- data: {
2933
- ...(p = e.builderContextSignal.content) == null ? void 0 : p.data,
2934
- ...h == null ? void 0 : h.data
2935
- },
2936
- meta: {
2937
- ...(k = e.builderContextSignal.content) == null ? void 0 : k.meta,
2938
- ...h == null ? void 0 : h.meta,
2939
- breakpoints: ((T = h == null ? void 0 : h.meta) == null ? void 0 : T.breakpoints) || ((N = (P = e.builderContextSignal.content) == null ? void 0 : P.meta) == null ? void 0 : N.breakpoints)
2940
- }
2941
- };
2942
- e.setBuilderContextSignal((W) => ({
2943
- ...W,
2944
- content: b
2945
- }));
2946
- }
2947
- useState(() => 0);
2948
- const [r, s] = useState(
2949
- () => !1
2950
- ), [l, c] = useState(
2951
- () => e.contentWrapper || "div"
2952
- );
2953
- function u(h) {
2954
- return createEditorListener({
2955
- model: e.model,
2956
- trustedHosts: e.trustedHosts,
2957
- callbacks: {
2958
- configureSdk: (b) => {
2959
- var T;
2960
- const { breakpoints: p, contentId: k } = b;
2961
- !k || k !== ((T = e.builderContextSignal.content) == null ? void 0 : T.id) || p && (a({
2962
- meta: {
2963
- breakpoints: p
2964
- }
2965
- }), i(n + 1));
2966
- },
2967
- animation: (b) => {
2968
- triggerAnimation(b);
2969
- },
2970
- contentUpdate: (b) => {
2971
- a(b), i(n + 1);
2972
- }
2973
- }
2974
- })(h);
2975
- }
2976
- function y() {
2977
- var b, p;
2978
- const h = (p = (b = e.builderContextSignal.content) == null ? void 0 : b.data) == null ? void 0 : p.jsCode;
2979
- h && evaluate({
2980
- code: h,
2981
- context: e.context || {},
2982
- localState: void 0,
2983
- rootState: e.builderContextSignal.rootState,
2984
- rootSetState: e.builderContextSignal.rootSetState
2985
- });
2986
- }
2987
- const [x, m] = useState(() => ({})), [d, f] = useState(() => !1);
2988
- function v(h) {
2989
- var b, p;
2990
- if (e.builderContextSignal.content) {
2991
- const k = (b = e.builderContextSignal.content) == null ? void 0 : b.testVariationId, T = (p = e.builderContextSignal.content) == null ? void 0 : p.id;
2992
- _track({
2993
- type: "click",
2994
- canTrack: getDefaultCanTrack(e.canTrack),
2995
- contentId: T,
2996
- apiKey: e.apiKey,
2997
- variationId: k !== T ? k : void 0,
2998
- ...getInteractionPropertiesForEvent(h),
2999
- unique: !d
3000
- });
3001
- }
3002
- d || f(!0);
3003
- }
3004
- function R(h) {
3005
- return h.replace(
3006
- /{{([^}]+)}}/g,
3007
- (b, p) => evaluate({
3008
- code: p,
3009
- context: e.context || {},
3010
- localState: void 0,
3011
- rootState: e.builderContextSignal.rootState,
3012
- rootSetState: e.builderContextSignal.rootSetState
3013
- })
3014
- );
3015
- }
3016
- function S({ url: h, key: b }) {
3017
- fetch$1(h).then((p) => p.json()).then((p) => {
3018
- var T, P;
3019
- const k = {
3020
- ...e.builderContextSignal.rootState,
3021
- [b]: p
3022
- };
3023
- (P = (T = e.builderContextSignal).rootSetState) == null || P.call(T, k), x[b] = !0;
3024
- }).catch((p) => {
3025
- console.error("error fetching dynamic data", h, p);
3026
- });
3027
- }
3028
- function C() {
3029
- var b, p, k;
3030
- const h = (k = (p = (b = e.builderContextSignal.content) == null ? void 0 : b.data) == null ? void 0 : p.httpRequests) != null ? k : {};
3031
- Object.entries(h).forEach(([T, P]) => {
3032
- if (P && (!x[T] || isEditing())) {
3033
- const N = R(P);
3034
- S({
3035
- url: N,
3036
- key: T
3037
- });
3038
- }
3039
- });
3040
- }
3041
- function w() {
3042
- isEditing() && window.dispatchEvent(
3043
- new CustomEvent(
3044
- "builder:component:stateChange",
3045
- {
3046
- detail: {
3047
- state: fastClone(e.builderContextSignal.rootState),
3048
- ref: {
3049
- name: e.model
3050
- }
3051
- }
3052
- }
3053
- )
3054
- );
3055
- }
3056
- function E(h) {
3057
- i(n + 1), window.addEventListener("message", u), registerInsertMenu(), setupBrowserForEditing({
3058
- ...e.locale ? {
3059
- locale: e.locale
3060
- } : {},
3061
- ...e.enrich ? {
3062
- enrich: e.enrich
3063
- } : {},
3064
- ...e.trustedHosts ? {
3065
- trustedHosts: e.trustedHosts
3066
- } : {}
3067
- }), Object.values(
3068
- e.builderContextSignal.componentInfos
3069
- ).forEach((b) => {
3070
- var k;
3071
- const p = createRegisterComponentMessage(b);
3072
- (k = window.parent) == null || k.postMessage(p, "*");
3073
- }), window.addEventListener(
3074
- "builder:component:stateChangeListenerActivated",
3075
- w
3076
- );
3077
- }
3078
- function B(h) {
3079
- const b = new URL(location.href).searchParams, p = b.get("builder.preview"), k = b.get(
3080
- `builder.preview.${p}`
3081
- ), T = b.get("apiKey") || b.get("builder.space");
3082
- p === e.model && T === e.apiKey && (!e.content || k === e.content.id) && fetchOneEntry({
3083
- model: e.model,
3084
- apiKey: e.apiKey,
3085
- apiVersion: e.builderContextSignal.apiVersion
3086
- }).then((P) => {
3087
- P && a(P);
3088
- });
3089
- }
3090
- return useEffect(() => {
3091
- var h;
3092
- return (h = t.current) == null || h.addEventListener(
3093
- "initeditingbldr",
3094
- E
3095
- ), () => {
3096
- var b;
3097
- return (b = t.current) == null ? void 0 : b.removeEventListener(
3098
- "initeditingbldr",
3099
- E
3100
- );
3101
- };
3102
- }, []), useEffect(() => {
3103
- var h;
3104
- return (h = t.current) == null || h.addEventListener(
3105
- "initpreviewingbldr",
3106
- B
3107
- ), () => {
3108
- var b;
3109
- return (b = t.current) == null ? void 0 : b.removeEventListener(
3110
- "initpreviewingbldr",
3111
- B
3112
- );
3113
- };
3114
- }, []), useEffect(() => {
3115
- var h, b;
3116
- if (isBrowser()) {
3117
- if (isEditing() && t.current && t.current.dispatchEvent(new CustomEvent("initeditingbldr")), e.builderContextSignal.content && getDefaultCanTrack(e.canTrack)) {
3118
- const k = (h = e.builderContextSignal.content) == null ? void 0 : h.testVariationId, T = (b = e.builderContextSignal.content) == null ? void 0 : b.id, P = e.apiKey;
3119
- _track({
3120
- type: "impression",
3121
- canTrack: !0,
3122
- contentId: T,
3123
- apiKey: P,
3124
- variationId: k !== T ? k : void 0
3125
- });
3126
- }
3127
- isPreviewing() && t.current && t.current.dispatchEvent(new CustomEvent("initpreviewingbldr"));
3128
- }
3129
- }, []), useEffect(() => {
3130
- e.apiKey || logger.error(
3131
- "No API key provided to `RenderContent` component. This can cause issues. Please provide an API key using the `apiKey` prop."
3132
- ), y(), C(), w();
3133
- }, []), useEffect(() => {
3134
- e.content && a(e.content);
3135
- }, [e.content]), useEffect(() => {
3136
- }, [r]), useEffect(() => {
3137
- y();
3138
- }, [(g = (F = e.builderContextSignal.content) == null ? void 0 : F.data) == null ? void 0 : g.jsCode]), useEffect(() => {
3139
- C();
3140
- }, [(A = (I = e.builderContextSignal.content) == null ? void 0 : I.data) == null ? void 0 : A.httpRequests]), useEffect(() => {
3141
- w();
3142
- }, [e.builderContextSignal.rootState]), useEffect(() => {
3143
- e.data && o(e.data);
3144
- }, [e.data]), useEffect(() => {
3145
- e.locale && o({
3146
- locale: e.locale
3147
- });
3148
- }, [e.locale]), useEffect(() => () => {
3149
- isBrowser() && (window.removeEventListener("message", u), window.removeEventListener(
3150
- "builder:component:stateChangeListenerActivated",
3151
- w
3152
- ));
3153
- }, []), /* @__PURE__ */ jsx(builderContext.Provider, { value: e.builderContextSignal, children: e.builderContextSignal.content ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ createElement(
3154
- l,
3155
- {
3156
- key: n,
3157
- ref: t,
3158
- onClick: (h) => v(h),
3159
- "builder-content-id": (j = e.builderContextSignal.content) == null ? void 0 : j.id,
3160
- "builder-model": e.model,
3161
- ...e.showContent ? {} : {
3162
- hidden: !0,
3163
- "aria-hidden": !0
3164
- },
3165
- ...e.contentWrapperProps,
3166
- className: `variant-${((V = e.content) == null ? void 0 : V.testVariationId) || (($ = e.content) == null ? void 0 : $.id)}`
3167
- },
3168
- e.children
3169
- ) }) : null });
3170
- }
3171
- const getCssFromFont = (e) => {
3172
- var a, r;
3173
- const t = e.family + (e.kind && !e.kind.includes("#") ? ", " + e.kind : ""), n = t.split(",")[0], i = (r = e.fileUrl) != null ? r : (a = e == null ? void 0 : e.files) == null ? void 0 : a.regular;
3174
- let o = "";
3175
- if (i && t && n && (o += `
3176
- @font-face {
3177
- font-family: "${t}";
3178
- src: local("${n}"), url('${i}') format('woff2');
3179
- font-display: fallback;
3180
- font-weight: 400;
3181
- }
3182
- `.trim()), e.files)
3183
- for (const s in e.files) {
3184
- if (!(String(Number(s)) === s))
3185
- continue;
3186
- const c = e.files[s];
3187
- c && c !== i && (o += `
3188
- @font-face {
3189
- font-family: "${t}";
3190
- src: url('${c}') format('woff2');
3191
- font-display: fallback;
3192
- font-weight: ${s};
3193
- }
3194
- `.trim());
3195
- }
3196
- return o;
3197
- }, getFontCss = ({
3198
- customFonts: e
3199
- }) => {
3200
- var t;
3201
- return ((t = e == null ? void 0 : e.map((n) => getCssFromFont(n))) == null ? void 0 : t.join(" ")) || "";
3202
- }, getCss = ({
3203
- cssCode: e,
3204
- contentId: t
3205
- }) => e ? t ? (e == null ? void 0 : e.replace(/&/g, `div[builder-content-id="${t}"]`)) || "" : e : "";
3206
- function ContentStyles(e) {
3207
- const [t, n] = useState(
3208
- () => `
3209
- ${getCss({
3210
- cssCode: e.cssCode,
3211
- contentId: e.contentId
3212
- })}
3213
- ${getFontCss({
3214
- customFonts: e.customFonts
3215
- })}
3216
-
3217
- .builder-button {
3218
- all: unset;
3219
- }
3220
-
3221
- .builder-text > p:first-of-type, .builder-text > .builder-paragraph:first-of-type {
3222
- margin: 0;
3223
- }
3224
- .builder-text > p, .builder-text > .builder-paragraph {
3225
- color: inherit;
3226
- line-height: inherit;
3227
- letter-spacing: inherit;
3228
- font-weight: inherit;
3229
- font-size: inherit;
3230
- text-align: inherit;
3231
- font-family: inherit;
3232
- }
3233
- `.trim()
3234
- );
3235
- return /* @__PURE__ */ jsx(InlinedStyles, { styles: t });
3236
- }
3237
- const getRootStateInitialValue = ({
3238
- content: e,
3239
- data: t,
3240
- locale: n
3241
- }) => {
3242
- var a, r, s;
3243
- const i = {}, o = ((a = e == null ? void 0 : e.data) == null ? void 0 : a.state) || {};
3244
- return (s = (r = e == null ? void 0 : e.data) == null ? void 0 : r.inputs) == null || s.forEach((l) => {
3245
- l.name && l.defaultValue !== void 0 && (i[l.name] = l.defaultValue);
3246
- }), {
3247
- ...i,
3248
- ...o,
3249
- ...t,
3250
- ...n ? {
3251
- locale: n
3252
- } : {}
3253
- };
3254
- }, getContentInitialValue = ({
3255
- content: e,
3256
- data: t
3257
- }) => e ? {
3258
- ...e,
3259
- data: {
3260
- ...e == null ? void 0 : e.data,
3261
- ...t
3262
- },
3263
- meta: e == null ? void 0 : e.meta
3264
- } : void 0;
3265
- function ContentComponent(e) {
3266
- var l, c, u, y, x, m, d;
3267
- const [t, n] = useState(
3268
- () => {
3269
- var f, v;
3270
- return getUpdateVariantVisibilityScript({
3271
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
3272
- variationId: (f = e.content) == null ? void 0 : f.testVariationId,
3273
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
3274
- contentId: (v = e.content) == null ? void 0 : v.id
3275
- });
3276
- }
3277
- );
3278
- function i(f) {
3279
- s((v) => ({
3280
- ...v,
3281
- rootState: f
3282
- }));
3283
- }
3284
- const [o, a] = useState(
3285
- () => [
3286
- ...getDefaultRegisteredComponents(),
3287
- ...e.customComponents || []
3288
- ].reduce(
3289
- (f, { component: v, ...R }) => ({
3290
- ...f,
3291
- [R.name]: {
3292
- component: v,
3293
- ...serializeComponentInfo(R)
3294
- }
3295
- }),
3296
- {}
3297
- )
3298
- ), [r, s] = useState(() => ({
3299
- content: getContentInitialValue({
3300
- content: e.content,
3301
- data: e.data
3302
- }),
3303
- localState: void 0,
3304
- rootState: getRootStateInitialValue({
3305
- content: e.content,
3306
- data: e.data,
3307
- locale: e.locale
3308
- }),
3309
- rootSetState: i,
3310
- context: e.context || {},
3311
- apiKey: e.apiKey,
3312
- apiVersion: e.apiVersion,
3313
- componentInfos: [
3314
- ...getDefaultRegisteredComponents(),
3315
- ...e.customComponents || []
3316
- ].reduce(
3317
- (f, { component: v, ...R }) => ({
3318
- ...f,
3319
- [R.name]: serializeComponentInfo(R)
3320
- }),
3321
- {}
3322
- ),
3323
- inheritedStyles: {},
3324
- BlocksWrapper: e.blocksWrapper || "div",
3325
- BlocksWrapperProps: e.blocksWrapperProps || {}
3326
- }));
3327
- return /* @__PURE__ */ jsx(
3328
- ComponentsContext.Provider,
3329
- {
3330
- value: {
3331
- registeredComponents: o
3332
- },
3333
- children: /* @__PURE__ */ jsxs(
3334
- EnableEditor,
3335
- {
3336
- content: e.content,
3337
- data: e.data,
3338
- model: e.model,
3339
- context: e.context,
3340
- apiKey: e.apiKey,
3341
- canTrack: e.canTrack,
3342
- locale: e.locale,
3343
- enrich: e.enrich,
3344
- showContent: e.showContent,
3345
- builderContextSignal: r,
3346
- contentWrapper: e.contentWrapper,
3347
- contentWrapperProps: e.contentWrapperProps,
3348
- linkComponent: e.linkComponent,
3349
- trustedHosts: e.trustedHosts,
3350
- setBuilderContextSignal: s,
3351
- children: [
3352
- e.isSsrAbTest ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(InlinedScript, { scriptStr: t }) }) : null,
3353
- /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
3354
- ContentStyles,
3355
- {
3356
- contentId: (l = r.content) == null ? void 0 : l.id,
3357
- cssCode: (u = (c = r.content) == null ? void 0 : c.data) == null ? void 0 : u.cssCode,
3358
- customFonts: (x = (y = r.content) == null ? void 0 : y.data) == null ? void 0 : x.customFonts
3359
- }
3360
- ) }),
3361
- /* @__PURE__ */ jsx(
3362
- Blocks,
3363
- {
3364
- blocks: (d = (m = r.content) == null ? void 0 : m.data) == null ? void 0 : d.blocks,
3365
- context: r,
3366
- registeredComponents: o,
3367
- linkComponent: e.linkComponent
3368
- }
3369
- )
3370
- ]
3371
- }
3372
- )
3373
- }
3374
- );
3375
- }
3376
- function ContentVariants(e) {
3377
- var r, s;
3378
- const [t, n] = useState(
3379
- () => checkShouldRenderVariants({
3380
- canTrack: getDefaultCanTrack(e.canTrack),
3381
- content: e.content
3382
- })
3383
- );
3384
- function i() {
3385
- var l;
3386
- return getUpdateCookieAndStylesScript(
3387
- getVariants(e.content).map((c) => ({
3388
- id: c.testVariationId,
3389
- testRatio: c.testRatio
3390
- })),
3391
- ((l = e.content) == null ? void 0 : l.id) || ""
3392
- );
3393
- }
3394
- function o() {
3395
- return getVariants(e.content).map((l) => `.variant-${l.testVariationId} { display: none; } `).join("");
3396
- }
3397
- function a() {
3398
- var l;
3399
- return t ? {
3400
- ...e.content,
3401
- testVariationId: (l = e.content) == null ? void 0 : l.id
3402
- } : handleABTestingSync({
3403
- item: e.content,
3404
- canTrack: getDefaultCanTrack(e.canTrack)
3405
- });
3406
- }
3407
- return useEffect(() => {
3408
- }, []), /* @__PURE__ */ jsxs(Fragment, { children: [
3409
- !e.__isNestedRender && TARGET !== "reactNative" ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(InlinedScript, { scriptStr: getScriptString() }) }) : null,
3410
- t ? /* @__PURE__ */ jsxs(Fragment, { children: [
3411
- /* @__PURE__ */ jsx(
3412
- InlinedStyles,
3413
- {
3414
- id: `variants-styles-${(r = e.content) == null ? void 0 : r.id}`,
3415
- styles: o()
3416
- }
3417
- ),
3418
- /* @__PURE__ */ jsx(InlinedScript, { scriptStr: i() }),
3419
- (s = getVariants(e.content)) == null ? void 0 : s.map((l) => /* @__PURE__ */ jsx(
3420
- ContentComponent,
3421
- {
3422
- content: l,
3423
- showContent: !1,
3424
- model: e.model,
3425
- data: e.data,
3426
- context: e.context,
3427
- apiKey: e.apiKey,
3428
- apiVersion: e.apiVersion,
3429
- customComponents: e.customComponents,
3430
- linkComponent: e.linkComponent,
3431
- canTrack: e.canTrack,
3432
- locale: e.locale,
3433
- enrich: e.enrich,
3434
- isSsrAbTest: t,
3435
- blocksWrapper: e.blocksWrapper,
3436
- blocksWrapperProps: e.blocksWrapperProps,
3437
- contentWrapper: e.contentWrapper,
3438
- contentWrapperProps: e.contentWrapperProps,
3439
- trustedHosts: e.trustedHosts
3440
- },
3441
- l.testVariationId
3442
- ))
3443
- ] }) : null,
3444
- /* @__PURE__ */ jsx(
3445
- ContentComponent,
3446
- {
3447
- content: a(),
3448
- showContent: !0,
3449
- model: e.model,
3450
- data: e.data,
3451
- context: e.context,
3452
- apiKey: e.apiKey,
3453
- apiVersion: e.apiVersion,
3454
- customComponents: e.customComponents,
3455
- linkComponent: e.linkComponent,
3456
- canTrack: e.canTrack,
3457
- locale: e.locale,
3458
- enrich: e.enrich,
3459
- isSsrAbTest: t,
3460
- blocksWrapper: e.blocksWrapper,
3461
- blocksWrapperProps: e.blocksWrapperProps,
3462
- contentWrapper: e.contentWrapper,
3463
- contentWrapperProps: e.contentWrapperProps,
3464
- trustedHosts: e.trustedHosts
3465
- }
3466
- )
3467
- ] });
3468
- }
3469
- const fetchSymbolContent = async ({
3470
- builderContextValue: e,
3471
- symbol: t
3472
- }) => {
3473
- if (t != null && t.model && // This is a hack, we should not need to check for this, but it is needed for Svelte.
3474
- (e != null && e.apiKey))
3475
- return fetchOneEntry({
3476
- model: t.model,
3477
- apiKey: e.apiKey,
3478
- apiVersion: e.apiVersion,
3479
- ...(t == null ? void 0 : t.entry) && {
3480
- query: {
3481
- id: t.entry
3482
- }
3483
- }
3484
- }).catch((n) => {
3485
- logger.error("Could not fetch symbol content: ", n);
3486
- });
3487
- };
3488
- function Symbol$1(e) {
3489
- var a, r, s, l;
3490
- function t() {
3491
- var c, u;
3492
- return [
3493
- e.attributes[getClassPropName()],
3494
- "builder-symbol",
3495
- (c = e.symbol) != null && c.inline ? "builder-inline-symbol" : void 0,
3496
- (u = e.symbol) != null && u.dynamic || e.dynamic ? "builder-dynamic-symbol" : void 0
3497
- ].filter(Boolean).join(" ");
3498
- }
3499
- const [n, i] = useState(() => {
3500
- var c;
3501
- return (c = e.symbol) == null ? void 0 : c.content;
3502
- });
3503
- function o() {
3504
- n || fetchSymbolContent({
3505
- symbol: e.symbol,
3506
- builderContextValue: e.builderContext
3507
- }).then((c) => {
3508
- c && i(c);
3509
- });
3510
- }
3511
- return useEffect(() => {
3512
- }, []), useEffect(() => {
3513
- o();
3514
- }, [e.symbol]), /* @__PURE__ */ jsx("div", { ...e.attributes, className: t(), children: /* @__PURE__ */ jsx(
3515
- ContentVariants,
3516
- {
3517
- __isNestedRender: !0,
3518
- apiVersion: e.builderContext.apiVersion,
3519
- apiKey: e.builderContext.apiKey,
3520
- context: {
3521
- ...e.builderContext.context,
3522
- symbolId: (a = e.builderBlock) == null ? void 0 : a.id
3523
- },
3524
- customComponents: Object.values(e.builderComponents),
3525
- data: {
3526
- ...(r = e.symbol) == null ? void 0 : r.data,
3527
- ...e.builderContext.localState,
3528
- ...(s = n == null ? void 0 : n.data) == null ? void 0 : s.state
3529
- },
3530
- model: (l = e.symbol) == null ? void 0 : l.model,
3531
- content: n,
3532
- linkComponent: e.builderLinkComponent
3533
- }
3534
- ) });
3535
- }
2
+ import { Blocks as o, Button as a, Columns as n, Content as c, Fragment as m, Image as g, Section as p, Symbol as d, Text as l, Video as u } from "./blocks-exports.mjs";
3
+ import { _ as E, c as b, f as h, d as B, e as C, g as S, i as x, a as P, r as k, s as y, b as R, t as T } from "./server-entry-e1cc0803.js";
4
+ import "react/jsx-runtime";
5
+ import "react";
6
+ import "node:module";
3536
7
  export {
3537
- Blocks,
3538
- Button,
3539
- Columns,
3540
- ContentVariants as Content,
3541
- FragmentComponent as Fragment,
3542
- Image,
3543
- SectionComponent as Section,
3544
- Symbol$1 as Symbol,
3545
- Text,
3546
- Video,
3547
- H as _processContentResult,
3548
- createRegisterComponentMessage,
3549
- K as fetchBuilderProps,
3550
- q as fetchEntries,
3551
- fetchOneEntry,
3552
- z as getBuilderSearchParams,
3553
- isEditing,
3554
- isPreviewing,
3555
- J as register,
3556
- Y as setEditorSettings,
3557
- G as subscribeToEditor,
3558
- Q as track
8
+ o as Blocks,
9
+ a as Button,
10
+ n as Columns,
11
+ c as Content,
12
+ m as Fragment,
13
+ g as Image,
14
+ p as Section,
15
+ d as Symbol,
16
+ l as Text,
17
+ u as Video,
18
+ E as _processContentResult,
19
+ b as createRegisterComponentMessage,
20
+ h as fetchBuilderProps,
21
+ B as fetchEntries,
22
+ C as fetchOneEntry,
23
+ S as getBuilderSearchParams,
24
+ x as isEditing,
25
+ P as isPreviewing,
26
+ k as register,
27
+ y as setEditorSettings,
28
+ R as subscribeToEditor,
29
+ T as track
3559
30
  };