@builder.io/sdk-qwik 0.0.29 → 0.0.31

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.
@@ -0,0 +1,2958 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
4
+
5
+ const qwik = require('@builder.io/qwik');
6
+ const jsxRuntime = require('@builder.io/qwik/jsx-runtime');
7
+
8
+ /** This file should be overriden for each framework. Ideally this would be implemented in Mitosis. */ const TARGET = 'qwik';
9
+
10
+ function isBrowser() {
11
+ return typeof window !== 'undefined' && typeof document !== 'undefined';
12
+ }
13
+
14
+ const registry = {};
15
+ function register(type, info) {
16
+ let typeList = registry[type];
17
+ if (!typeList) typeList = registry[type] = [];
18
+ typeList.push(info);
19
+ if (isBrowser()) {
20
+ const message = {
21
+ type: 'builder.register',
22
+ data: {
23
+ type,
24
+ info
25
+ }
26
+ };
27
+ try {
28
+ parent.postMessage(message, '*');
29
+ if (parent !== window) window.postMessage(message, '*');
30
+ } catch (err) {
31
+ console.debug('Could not postmessage', err);
32
+ }
33
+ }
34
+ }
35
+
36
+ const registerInsertMenu = ()=>{
37
+ register('insertMenu', {
38
+ name: '_default',
39
+ default: true,
40
+ items: [
41
+ {
42
+ name: 'Box'
43
+ },
44
+ {
45
+ name: 'Text'
46
+ },
47
+ {
48
+ name: 'Image'
49
+ },
50
+ {
51
+ name: 'Columns'
52
+ },
53
+ ...TARGET === 'reactNative' ? [] : [
54
+ {
55
+ name: 'Core:Section'
56
+ },
57
+ {
58
+ name: 'Core:Button'
59
+ },
60
+ {
61
+ name: 'Embed'
62
+ },
63
+ {
64
+ name: 'Custom Code'
65
+ }
66
+ ]
67
+ ]
68
+ });
69
+ };
70
+ let isSetupForEditing = false;
71
+ const setupBrowserForEditing = ()=>{
72
+ if (isSetupForEditing) return;
73
+ isSetupForEditing = true;
74
+ if (isBrowser()) {
75
+ window.parent?.postMessage({
76
+ type: 'builder.sdkInfo',
77
+ data: {
78
+ target: TARGET,
79
+ // TODO: compile these in
80
+ // type: process.env.SDK_TYPE,
81
+ // version: process.env.SDK_VERSION,
82
+ supportsPatchUpdates: false,
83
+ // Supports builder-model="..." attribute which is needed to
84
+ // scope our '+ add block' button styling
85
+ supportsAddBlockScoping: true,
86
+ supportsCustomBreakpoints: true
87
+ }
88
+ }, '*');
89
+ window.addEventListener('message', ({ data })=>{
90
+ if (!data?.type) return;
91
+ switch(data.type){
92
+ case 'builder.evaluate':
93
+ {
94
+ const text = data.data.text;
95
+ const args = data.data.arguments || [];
96
+ const id = data.data.id;
97
+ // tslint:disable-next-line:no-function-constructor-with-string-args
98
+ const fn = new Function(text);
99
+ let result;
100
+ let error = null;
101
+ try {
102
+ // eslint-disable-next-line prefer-spread
103
+ result = fn.apply(null, args);
104
+ } catch (err) {
105
+ error = err;
106
+ }
107
+ if (error) window.parent?.postMessage({
108
+ type: 'builder.evaluateError',
109
+ data: {
110
+ id,
111
+ error: error.message
112
+ }
113
+ }, '*');
114
+ else if (result && typeof result.then === 'function') result.then((finalResult)=>{
115
+ window.parent?.postMessage({
116
+ type: 'builder.evaluateResult',
117
+ data: {
118
+ id,
119
+ result: finalResult
120
+ }
121
+ }, '*');
122
+ }).catch(console.error);
123
+ else window.parent?.postMessage({
124
+ type: 'builder.evaluateResult',
125
+ data: {
126
+ result,
127
+ id
128
+ }
129
+ }, '*');
130
+ break;
131
+ }
132
+ }
133
+ });
134
+ }
135
+ };
136
+
137
+ const BuilderContext = qwik.createContext("Builder");
138
+
139
+ function isIframe() {
140
+ return isBrowser() && window.self !== window.top;
141
+ }
142
+
143
+ function isEditing() {
144
+ return isIframe() && window.location.search.indexOf('builder.frameEditing=') !== -1;
145
+ }
146
+
147
+ /**
148
+ * We need to serialize values to a string in case there are Proxy values, as is the case with SolidJS etc.
149
+ */ const fastClone = (obj)=>JSON.parse(JSON.stringify(obj));
150
+
151
+ const SIZES = {
152
+ small: {
153
+ min: 320,
154
+ default: 321,
155
+ max: 640
156
+ },
157
+ medium: {
158
+ min: 641,
159
+ default: 642,
160
+ max: 991
161
+ },
162
+ large: {
163
+ min: 990,
164
+ default: 991,
165
+ max: 1200
166
+ }
167
+ };
168
+ const getMaxWidthQueryForSize = (size, sizeValues = SIZES)=>`@media (max-width: ${sizeValues[size].max}px)`;
169
+ const getSizesForBreakpoints = ({ small , medium })=>{
170
+ const newSizes = fastClone(SIZES); // Note: this helps to get a deep clone of fields like small, medium etc
171
+ if (!small || !medium) return newSizes;
172
+ const smallMin = Math.floor(small / 2);
173
+ newSizes.small = {
174
+ max: small,
175
+ min: smallMin,
176
+ default: smallMin + 1
177
+ };
178
+ const mediumMin = newSizes.small.max + 1;
179
+ newSizes.medium = {
180
+ max: medium,
181
+ min: mediumMin,
182
+ default: mediumMin + 1
183
+ };
184
+ const largeMin = newSizes.medium.max + 1;
185
+ newSizes.large = {
186
+ max: 2000,
187
+ min: largeMin,
188
+ default: largeMin + 1
189
+ };
190
+ return newSizes;
191
+ };
192
+
193
+ function evaluate({ code , context , state , event }) {
194
+ if (code === '') {
195
+ console.warn('Skipping evaluation of empty code block.');
196
+ return;
197
+ }
198
+ const builder = {
199
+ isEditing: isEditing(),
200
+ isBrowser: isBrowser(),
201
+ isServer: !isBrowser()
202
+ };
203
+ // Be able to handle simple expressions like "state.foo" or "1 + 1"
204
+ // as well as full blocks like "var foo = "bar"; return foo"
205
+ const useReturn = !(code.includes(';') || code.includes(' return ') || code.trim().startsWith('return '));
206
+ const useCode = useReturn ? `return (${code});` : code;
207
+ try {
208
+ return new Function('builder', 'Builder' /* <- legacy */ , 'state', 'context', 'event', useCode)(builder, builder, state, context, event);
209
+ } catch (e) {
210
+ console.warn('Builder custom code error: \n While Evaluating: \n ', useCode, '\n', e.message || e);
211
+ }
212
+ }
213
+
214
+ /**
215
+ * Minimal implementation of lodash's _.set
216
+ * https://lodash.com/docs/4.17.15#set
217
+ *
218
+ * See ./set.test.ts for usage examples
219
+ */ const set = (obj, _path, value)=>{
220
+ if (Object(obj) !== obj) return obj;
221
+ const path = Array.isArray(_path) ? _path : _path.toString().match(/[^.[\]]+/g);
222
+ path.slice(0, -1).reduce((a, c, i)=>Object(a[c]) === a[c] ? a[c] : a[c] = Math.abs(Number(path[i + 1])) >> 0 === +path[i + 1] ? [] : {}, obj)[path[path.length - 1]] = value;
223
+ return obj;
224
+ };
225
+
226
+ // Noope way for targets to make modifications to the block object if/as needed
227
+ function transformBlock(block) {
228
+ return block;
229
+ }
230
+
231
+ const evaluateBindings = ({ block , context , state })=>{
232
+ if (!block.bindings) return block;
233
+ const copy = fastClone(block);
234
+ const copied = {
235
+ ...copy,
236
+ properties: {
237
+ ...copy.properties
238
+ },
239
+ actions: {
240
+ ...copy.actions
241
+ }
242
+ };
243
+ for(const binding in block.bindings){
244
+ const expression = block.bindings[binding];
245
+ const value = evaluate({
246
+ code: expression,
247
+ state,
248
+ context
249
+ });
250
+ set(copied, binding, value);
251
+ }
252
+ return copied;
253
+ };
254
+ function getProcessedBlock({ block , context , shouldEvaluateBindings , state }) {
255
+ const transformedBlock = transformBlock(block);
256
+ if (shouldEvaluateBindings) return evaluateBindings({
257
+ block: transformedBlock,
258
+ state,
259
+ context
260
+ });
261
+ else return transformedBlock;
262
+ }
263
+
264
+ const camelToKebabCase = (string)=>string.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, '$1-$2').toLowerCase();
265
+
266
+ const convertStyleMaptoCSS = (style)=>{
267
+ const cssProps = Object.entries(style).map(([key, value])=>{
268
+ if (typeof value === 'string') return `${camelToKebabCase(key)}: ${value};`;
269
+ });
270
+ return cssProps.join('\n');
271
+ };
272
+ const createCssClass = ({ mediaQuery , className , styles })=>{
273
+ const cssClass = `.${className} {
274
+ ${convertStyleMaptoCSS(styles)}
275
+ }`;
276
+ if (mediaQuery) return `${mediaQuery} {
277
+ ${cssClass}
278
+ }`;
279
+ else return cssClass;
280
+ };
281
+
282
+ // GENERATED BY MITOSIS
283
+ const tag$1 = function tag(props, state) {
284
+ // NOTE: we have to obfusctate the name of the tag due to a limitation in the svelte-preprocessor plugin.
285
+ // https://github.com/sveltejs/vite-plugin-svelte/issues/315#issuecomment-1109000027
286
+ return "style";
287
+ };
288
+ const RenderInlinedStyles = (props)=>{
289
+ const state = {};
290
+ state.tag = tag$1();
291
+ return /*#__PURE__*/ jsxRuntime.jsx(jsxRuntime.Fragment, {
292
+ children: /*#__PURE__*/ jsxRuntime.jsx(state.tag, {
293
+ children: qwik._wrapSignal(props, "styles")
294
+ })
295
+ });
296
+ };
297
+ const RenderInlinedStyles$1 = RenderInlinedStyles;
298
+
299
+ // GENERATED BY MITOSIS
300
+ const useBlock$1 = function useBlock(props, state) {
301
+ return getProcessedBlock({
302
+ block: props.block,
303
+ state: props.context.state,
304
+ context: props.context.context,
305
+ shouldEvaluateBindings: true
306
+ });
307
+ };
308
+ const css = function css(props, state) {
309
+ const styles = useBlock$1(props).responsiveStyles;
310
+ const content = props.context.content;
311
+ const sizesWithUpdatedBreakpoints = getSizesForBreakpoints(content?.meta?.breakpoints || {});
312
+ const largeStyles = styles?.large;
313
+ const mediumStyles = styles?.medium;
314
+ const smallStyles = styles?.small;
315
+ const className = useBlock$1(props).id;
316
+ const largeStylesClass = largeStyles ? createCssClass({
317
+ className,
318
+ styles: largeStyles
319
+ }) : "";
320
+ const mediumStylesClass = mediumStyles ? createCssClass({
321
+ className,
322
+ styles: mediumStyles,
323
+ mediaQuery: getMaxWidthQueryForSize("medium", sizesWithUpdatedBreakpoints)
324
+ }) : "";
325
+ const smallStylesClass = smallStyles ? createCssClass({
326
+ className,
327
+ styles: smallStyles,
328
+ mediaQuery: getMaxWidthQueryForSize("small", sizesWithUpdatedBreakpoints)
329
+ }) : "";
330
+ return [
331
+ largeStylesClass,
332
+ mediumStylesClass,
333
+ smallStylesClass
334
+ ].join(" ");
335
+ };
336
+ const BlockStyles = (props)=>{
337
+ return /*#__PURE__*/ jsxRuntime.jsx(jsxRuntime.Fragment, {
338
+ children: TARGET !== "reactNative" && css(props) ? /*#__PURE__*/ jsxRuntime.jsx(RenderInlinedStyles$1, {
339
+ styles: css(props)
340
+ }) : null
341
+ });
342
+ };
343
+ const BlockStyles$1 = BlockStyles;
344
+
345
+ function capitalizeFirstLetter(string) {
346
+ return string.charAt(0).toUpperCase() + string.slice(1);
347
+ }
348
+ const getEventHandlerName = (key)=>`on${capitalizeFirstLetter(key)}$`;
349
+
350
+ function crateEventHandler(value, options) {
351
+ return qwik.inlinedQrl((event)=>{
352
+ const [options, value] = qwik.useLexicalScope();
353
+ return evaluate({
354
+ code: value,
355
+ context: options.context,
356
+ state: options.state,
357
+ event
358
+ });
359
+ }, "crateEventHandler_wgxT8Hlq4s8", [
360
+ options,
361
+ value
362
+ ]);
363
+ }
364
+
365
+ function getBlockActions(options) {
366
+ const obj = {};
367
+ const optionActions = options.block.actions ?? {};
368
+ for(const key in optionActions){
369
+ // eslint-disable-next-line no-prototype-builtins
370
+ if (!optionActions.hasOwnProperty(key)) continue;
371
+ const value = optionActions[key];
372
+ obj[getEventHandlerName(key)] = crateEventHandler(value, options);
373
+ }
374
+ return obj;
375
+ }
376
+
377
+ function getBlockComponentOptions(block) {
378
+ return {
379
+ ...block.component?.options,
380
+ ...block.options,
381
+ /**
382
+ * Our built-in components frequently make use of the block, so we provide all of it under `builderBlock`
383
+ */ builderBlock: block
384
+ };
385
+ }
386
+
387
+ function getBlockProperties(block) {
388
+ return {
389
+ ...block.properties,
390
+ 'builder-id': block.id,
391
+ class: [
392
+ block.id,
393
+ 'builder-block',
394
+ block.class,
395
+ block.properties?.class
396
+ ].filter(Boolean).join(' ')
397
+ };
398
+ }
399
+
400
+ function getBlockTag(block) {
401
+ return block.tagName || 'div';
402
+ }
403
+
404
+ /**
405
+ * https://developer.mozilla.org/en-US/docs/Glossary/Empty_element
406
+ */ const EMPTY_HTML_ELEMENTS = [
407
+ 'area',
408
+ 'base',
409
+ 'br',
410
+ 'col',
411
+ 'embed',
412
+ 'hr',
413
+ 'img',
414
+ 'input',
415
+ 'keygen',
416
+ 'link',
417
+ 'meta',
418
+ 'param',
419
+ 'source',
420
+ 'track',
421
+ 'wbr'
422
+ ];
423
+ const isEmptyHtmlElement = (tagName)=>{
424
+ return typeof tagName === 'string' && EMPTY_HTML_ELEMENTS.includes(tagName.toLowerCase());
425
+ };
426
+
427
+ // GENERATED BY MITOSIS
428
+ const RenderComponent = (props)=>{
429
+ return /*#__PURE__*/ jsxRuntime.jsx(jsxRuntime.Fragment, {
430
+ children: props.componentRef ? /*#__PURE__*/ jsxRuntime.jsxs(props.componentRef, {
431
+ ...props.componentOptions,
432
+ children: [
433
+ (props.blockChildren || []).map(function(child) {
434
+ return /*#__PURE__*/ jsxRuntime.jsx(RenderBlock$1, {
435
+ block: child,
436
+ get context () {
437
+ return props.context;
438
+ },
439
+ [qwik._IMMUTABLE]: {
440
+ context: qwik._wrapSignal(props, "context")
441
+ }
442
+ }, "render-block-" + child.id);
443
+ }),
444
+ (props.blockChildren || []).map(function(child) {
445
+ return /*#__PURE__*/ jsxRuntime.jsx(BlockStyles$1, {
446
+ block: child,
447
+ get context () {
448
+ return props.context;
449
+ },
450
+ [qwik._IMMUTABLE]: {
451
+ context: qwik._wrapSignal(props, "context")
452
+ }
453
+ }, "block-style-" + child.id);
454
+ })
455
+ ]
456
+ }) : null
457
+ });
458
+ };
459
+ const RenderComponent$1 = RenderComponent;
460
+
461
+ // GENERATED BY MITOSIS
462
+ const RenderComponentWithContext = /*#__PURE__*/ qwik.componentQrl(qwik.inlinedQrl((props)=>{
463
+ qwik.useContextProvider(BuilderContext, qwik.useStore({
464
+ content: (()=>{
465
+ return props.context.content;
466
+ })(),
467
+ state: (()=>{
468
+ return props.context.state;
469
+ })(),
470
+ context: (()=>{
471
+ return props.context.context;
472
+ })(),
473
+ apiKey: (()=>{
474
+ return props.context.apiKey;
475
+ })(),
476
+ registeredComponents: (()=>{
477
+ return props.context.registeredComponents;
478
+ })(),
479
+ inheritedStyles: (()=>{
480
+ return props.context.inheritedStyles;
481
+ })()
482
+ }));
483
+ return /*#__PURE__*/ jsxRuntime.jsx(RenderComponent$1, {
484
+ get componentRef () {
485
+ return props.componentRef;
486
+ },
487
+ get componentOptions () {
488
+ return props.componentOptions;
489
+ },
490
+ get blockChildren () {
491
+ return props.blockChildren;
492
+ },
493
+ get context () {
494
+ return props.context;
495
+ },
496
+ [qwik._IMMUTABLE]: {
497
+ componentRef: qwik._wrapSignal(props, "componentRef"),
498
+ componentOptions: qwik._wrapSignal(props, "componentOptions"),
499
+ blockChildren: qwik._wrapSignal(props, "blockChildren"),
500
+ context: qwik._wrapSignal(props, "context")
501
+ }
502
+ });
503
+ }, "RenderComponentWithContext_component_nXOUbUnjTAo"));
504
+ const RenderComponentWithContext$1 = RenderComponentWithContext;
505
+
506
+ // GENERATED BY MITOSIS
507
+ /**
508
+ * We can't make this a generic `ProvideContext` function because Vue 2 won't support root slots, e.g.
509
+ *
510
+ * ```vue
511
+ * <template>
512
+ * <slot></slot>
513
+ * </template>
514
+ * ```
515
+ */ const RenderRepeatedBlock = /*#__PURE__*/ qwik.componentQrl(qwik.inlinedQrl((props)=>{
516
+ qwik.useContextProvider(BuilderContext, qwik.useStore({
517
+ content: (()=>{
518
+ return props.repeatContext.content;
519
+ })(),
520
+ state: (()=>{
521
+ return props.repeatContext.state;
522
+ })(),
523
+ context: (()=>{
524
+ return props.repeatContext.context;
525
+ })(),
526
+ apiKey: (()=>{
527
+ return props.repeatContext.apiKey;
528
+ })(),
529
+ registeredComponents: (()=>{
530
+ return props.repeatContext.registeredComponents;
531
+ })(),
532
+ inheritedStyles: (()=>{
533
+ return props.repeatContext.inheritedStyles;
534
+ })()
535
+ }));
536
+ return /*#__PURE__*/ jsxRuntime.jsx(RenderBlock$1, {
537
+ get block () {
538
+ return props.block;
539
+ },
540
+ get context () {
541
+ return props.repeatContext;
542
+ },
543
+ [qwik._IMMUTABLE]: {
544
+ block: qwik._wrapSignal(props, "block"),
545
+ context: qwik._wrapSignal(props, "repeatContext")
546
+ }
547
+ });
548
+ }, "RenderRepeatedBlock_component_nRyVBtbGKc8"));
549
+ const RenderRepeatedBlock$1 = RenderRepeatedBlock;
550
+
551
+ // GENERATED BY MITOSIS
552
+ const component = function component(props, state) {
553
+ const componentName = getProcessedBlock({
554
+ block: props.block,
555
+ state: props.context.state,
556
+ context: props.context.context,
557
+ shouldEvaluateBindings: false
558
+ }).component?.name;
559
+ if (!componentName) return null;
560
+ const ref = props.context.registeredComponents[componentName];
561
+ if (!ref) {
562
+ // TODO: Public doc page with more info about this message
563
+ console.warn(`
564
+ Could not find a registered component named "${componentName}".
565
+ If you registered it, is the file that registered it imported by the file that needs to render it?`);
566
+ return undefined;
567
+ } else return ref;
568
+ };
569
+ const tag = function tag(props, state) {
570
+ return getBlockTag(useBlock(props));
571
+ };
572
+ const useBlock = function useBlock(props, state) {
573
+ return repeatItemData(props) ? props.block : getProcessedBlock({
574
+ block: props.block,
575
+ state: props.context.state,
576
+ context: props.context.context,
577
+ shouldEvaluateBindings: true
578
+ });
579
+ };
580
+ const attributes = function attributes(props, state) {
581
+ return {
582
+ ...getBlockProperties(useBlock(props)),
583
+ ...getBlockActions({
584
+ block: useBlock(props),
585
+ state: props.context.state,
586
+ context: props.context.context
587
+ }),
588
+ ...{}
589
+ };
590
+ };
591
+ const shouldWrap = function shouldWrap(props, state) {
592
+ return !component(props)?.noWrap;
593
+ };
594
+ const renderComponentProps = function renderComponentProps(props, state) {
595
+ return {
596
+ blockChildren: useChildren(props),
597
+ componentRef: component(props)?.component,
598
+ componentOptions: {
599
+ ...getBlockComponentOptions(useBlock(props)),
600
+ /**
601
+ * These attributes are passed to the wrapper element when there is one. If `noWrap` is set to true, then
602
+ * they are provided to the component itself directly.
603
+ */ ...shouldWrap(props) ? {} : {
604
+ attributes: attributes(props)
605
+ }
606
+ },
607
+ context: childrenContext(props)
608
+ };
609
+ };
610
+ const useChildren = function useChildren(props, state) {
611
+ // TO-DO: When should `canHaveChildren` dictate rendering?
612
+ // This is currently commented out because some Builder components (e.g. Box) do not have `canHaveChildren: true`,
613
+ // but still receive and need to render children.
614
+ // return state.componentInfo?.canHaveChildren ? state.useBlock.children : [];
615
+ return useBlock(props).children ?? [];
616
+ };
617
+ const childrenWithoutParentComponent = function childrenWithoutParentComponent(props, state) {
618
+ /**
619
+ * When there is no `componentRef`, there might still be children that need to be rendered. In this case,
620
+ * we render them outside of `componentRef`.
621
+ * NOTE: We make sure not to render this if `repeatItemData` is non-null, because that means we are rendering an array of
622
+ * blocks, and the children will be repeated within those blocks.
623
+ */ const shouldRenderChildrenOutsideRef = !component(props)?.component && !repeatItemData(props);
624
+ return shouldRenderChildrenOutsideRef ? useChildren(props) : [];
625
+ };
626
+ const repeatItemData = function repeatItemData(props, state) {
627
+ /**
628
+ * we don't use `state.useBlock` here because the processing done within its logic includes evaluating the block's bindings,
629
+ * which will not work if there is a repeat.
630
+ */ const { repeat , ...blockWithoutRepeat } = props.block;
631
+ if (!repeat?.collection) return undefined;
632
+ const itemsArray = evaluate({
633
+ code: repeat.collection,
634
+ state: props.context.state,
635
+ context: props.context.context
636
+ });
637
+ if (!Array.isArray(itemsArray)) return undefined;
638
+ const collectionName = repeat.collection.split(".").pop();
639
+ const itemNameToUse = repeat.itemName || (collectionName ? collectionName + "Item" : "item");
640
+ const repeatArray = itemsArray.map((item, index)=>({
641
+ context: {
642
+ ...props.context,
643
+ state: {
644
+ ...props.context.state,
645
+ $index: index,
646
+ $item: item,
647
+ [itemNameToUse]: item,
648
+ [`$${itemNameToUse}Index`]: index
649
+ }
650
+ },
651
+ block: blockWithoutRepeat
652
+ }));
653
+ return repeatArray;
654
+ };
655
+ const inheritedTextStyles = function inheritedTextStyles(props, state) {
656
+ return {};
657
+ };
658
+ const childrenContext = function childrenContext(props, state) {
659
+ return {
660
+ apiKey: props.context.apiKey,
661
+ state: props.context.state,
662
+ content: props.context.content,
663
+ context: props.context.context,
664
+ registeredComponents: props.context.registeredComponents,
665
+ inheritedStyles: inheritedTextStyles()
666
+ };
667
+ };
668
+ const renderComponentTag = function renderComponentTag(props, state) {
669
+ if (TARGET === "reactNative") return RenderComponentWithContext$1;
670
+ else return RenderComponent$1;
671
+ };
672
+ const RenderBlock = (props)=>{
673
+ const state = {};
674
+ state.tag = tag(props);
675
+ state.renderComponentTag = renderComponentTag();
676
+ return /*#__PURE__*/ jsxRuntime.jsx(jsxRuntime.Fragment, {
677
+ children: shouldWrap(props) ? /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
678
+ children: [
679
+ isEmptyHtmlElement(tag(props)) ? /*#__PURE__*/ jsxRuntime.jsx(state.tag, {
680
+ ...attributes(props)
681
+ }) : null,
682
+ !isEmptyHtmlElement(tag(props)) && repeatItemData(props) ? (repeatItemData(props) || []).map(function(data, index) {
683
+ return /*#__PURE__*/ jsxRuntime.jsx(RenderRepeatedBlock$1, {
684
+ get repeatContext () {
685
+ return data.context;
686
+ },
687
+ get block () {
688
+ return data.block;
689
+ },
690
+ [qwik._IMMUTABLE]: {
691
+ repeatContext: qwik._wrapSignal(data, "context"),
692
+ block: qwik._wrapSignal(data, "block")
693
+ }
694
+ }, index);
695
+ }) : null,
696
+ !isEmptyHtmlElement(tag(props)) && !repeatItemData(props) ? /*#__PURE__*/ jsxRuntime.jsxs(state.tag, {
697
+ ...attributes(props),
698
+ children: [
699
+ /*#__PURE__*/ jsxRuntime.jsx(state.renderComponentTag, {
700
+ ...renderComponentProps(props)
701
+ }),
702
+ (childrenWithoutParentComponent(props) || []).map(function(child) {
703
+ return /*#__PURE__*/ jsxRuntime.jsx(RenderBlock, {
704
+ block: child,
705
+ context: childrenContext(props)
706
+ }, "render-block-" + child.id);
707
+ }),
708
+ (childrenWithoutParentComponent(props) || []).map(function(child) {
709
+ return /*#__PURE__*/ jsxRuntime.jsx(BlockStyles$1, {
710
+ block: child,
711
+ context: childrenContext(props)
712
+ }, "block-style-" + child.id);
713
+ })
714
+ ]
715
+ }) : null
716
+ ]
717
+ }) : /*#__PURE__*/ jsxRuntime.jsx(state.renderComponentTag, {
718
+ ...renderComponentProps(props)
719
+ })
720
+ });
721
+ };
722
+ const RenderBlock$1 = RenderBlock;
723
+
724
+ // GENERATED BY MITOSIS
725
+ const className = function className(props, state, builderContext) {
726
+ return "builder-blocks" + (!props.blocks?.length ? " no-blocks" : "");
727
+ };
728
+ const onClick$1 = function onClick(props, state, builderContext) {
729
+ if (isEditing() && !props.blocks?.length) window.parent?.postMessage({
730
+ type: "builder.clickEmptyBlocks",
731
+ data: {
732
+ parentElementId: props.parent,
733
+ dataPath: props.path
734
+ }
735
+ }, "*");
736
+ };
737
+ const onMouseEnter = function onMouseEnter(props, state, builderContext) {
738
+ if (isEditing() && !props.blocks?.length) window.parent?.postMessage({
739
+ type: "builder.hoverEmptyBlocks",
740
+ data: {
741
+ parentElementId: props.parent,
742
+ dataPath: props.path
743
+ }
744
+ }, "*");
745
+ };
746
+ const RenderBlocks = /*#__PURE__*/ qwik.componentQrl(qwik.inlinedQrl((props)=>{
747
+ qwik.useStylesScopedQrl(qwik.inlinedQrl(STYLES$3, "RenderBlocks_component_useStylesScoped_0XKYzaR059E"));
748
+ const builderContext = qwik.useContext(BuilderContext);
749
+ const state = {};
750
+ return /*#__PURE__*/ jsxRuntime.jsxs("div", {
751
+ class: className(props) + " div-RenderBlocks",
752
+ get "builder-path" () {
753
+ return props.path;
754
+ },
755
+ get "builder-parent-id" () {
756
+ return props.parent;
757
+ },
758
+ get style () {
759
+ return props.styleProp;
760
+ },
761
+ onClick$: qwik.inlinedQrl((event)=>{
762
+ const [builderContext, props, state] = qwik.useLexicalScope();
763
+ return onClick$1(props);
764
+ }, "RenderBlocks_component_div_onClick_RzhhZa265Yg", [
765
+ builderContext,
766
+ props,
767
+ state
768
+ ]),
769
+ onMouseEnter$: qwik.inlinedQrl((event)=>{
770
+ const [builderContext, props, state] = qwik.useLexicalScope();
771
+ return onMouseEnter(props);
772
+ }, "RenderBlocks_component_div_onMouseEnter_nG7I7RYG3JQ", [
773
+ builderContext,
774
+ props,
775
+ state
776
+ ]),
777
+ children: [
778
+ props.blocks ? (props.blocks || []).map(function(block) {
779
+ return /*#__PURE__*/ jsxRuntime.jsx(RenderBlock$1, {
780
+ block: block,
781
+ context: builderContext
782
+ }, "render-block-" + block.id);
783
+ }) : null,
784
+ props.blocks ? (props.blocks || []).map(function(block) {
785
+ return /*#__PURE__*/ jsxRuntime.jsx(BlockStyles$1, {
786
+ block: block,
787
+ context: builderContext
788
+ }, "block-style-" + block.id);
789
+ }) : null
790
+ ],
791
+ [qwik._IMMUTABLE]: {
792
+ "builder-path": qwik._wrapSignal(props, "path"),
793
+ "builder-parent-id": qwik._wrapSignal(props, "parent"),
794
+ style: qwik._wrapSignal(props, "styleProp")
795
+ }
796
+ });
797
+ }, "RenderBlocks_component_MYUZ0j1uLsw"));
798
+ const RenderBlocks$1 = RenderBlocks;
799
+ const STYLES$3 = `.div-RenderBlocks {
800
+ display: flex;
801
+ flex-direction: column;
802
+ align-items: stretch; }`;
803
+
804
+ // GENERATED BY MITOSIS
805
+ const getGutterSize = function getGutterSize(props, state) {
806
+ return typeof props.space === "number" ? props.space || 0 : 20;
807
+ };
808
+ const getColumns = function getColumns(props, state) {
809
+ return props.columns || [];
810
+ };
811
+ const getWidth = function getWidth(props, state, index) {
812
+ const columns = getColumns(props);
813
+ return columns[index]?.width || 100 / columns.length;
814
+ };
815
+ const getColumnCssWidth = function getColumnCssWidth(props, state, index) {
816
+ const columns = getColumns(props);
817
+ const gutterSize = getGutterSize(props);
818
+ const subtractWidth = gutterSize * (columns.length - 1) / columns.length;
819
+ return `calc(${getWidth(props, state, index)}% - ${subtractWidth}px)`;
820
+ };
821
+ const maybeApplyForTablet = function maybeApplyForTablet(props, state, prop) {
822
+ const _stackColumnsAt = props.stackColumnsAt || "tablet";
823
+ return _stackColumnsAt === "tablet" ? prop : "inherit";
824
+ };
825
+ const columnsCssVars = function columnsCssVars(props, state) {
826
+ const flexDir = props.stackColumnsAt === "never" ? "inherit" : props.reverseColumnsWhenStacked ? "column-reverse" : "column";
827
+ return {
828
+ "--flex-dir": flexDir,
829
+ "--flex-dir-tablet": maybeApplyForTablet(props, state, flexDir)
830
+ };
831
+ };
832
+ const columnCssVars = function columnCssVars(props, state) {
833
+ const width = "100%";
834
+ const marginLeft = "0";
835
+ return {
836
+ "--column-width": width,
837
+ "--column-margin-left": marginLeft,
838
+ "--column-width-tablet": maybeApplyForTablet(props, state, width),
839
+ "--column-margin-left-tablet": maybeApplyForTablet(props, state, marginLeft)
840
+ };
841
+ };
842
+ const Columns = /*#__PURE__*/ qwik.componentQrl(qwik.inlinedQrl((props)=>{
843
+ qwik.useStylesScopedQrl(qwik.inlinedQrl(STYLES$2, "Columns_component_useStylesScoped_s7JLZz7MCCQ"));
844
+ const state = {};
845
+ return /*#__PURE__*/ jsxRuntime.jsx("div", {
846
+ class: "builder-columns div-Columns",
847
+ style: columnsCssVars(props, state),
848
+ children: (props.columns || []).map(function(column, index) {
849
+ return /*#__PURE__*/ jsxRuntime.jsx("div", {
850
+ class: "builder-column div-Columns-2",
851
+ style: {
852
+ width: getColumnCssWidth(props, state, index),
853
+ marginLeft: `${index === 0 ? 0 : getGutterSize(props)}px`,
854
+ ...columnCssVars(props, state)
855
+ },
856
+ children: /*#__PURE__*/ jsxRuntime.jsx(RenderBlocks$1, {
857
+ get blocks () {
858
+ return column.blocks;
859
+ },
860
+ path: `component.options.columns.${index}.blocks`,
861
+ get parent () {
862
+ return props.builderBlock.id;
863
+ },
864
+ styleProp: {
865
+ flexGrow: "1"
866
+ },
867
+ [qwik._IMMUTABLE]: {
868
+ blocks: qwik._wrapSignal(column, "blocks"),
869
+ parent: qwik._wrapSignal(props.builderBlock, "id")
870
+ }
871
+ })
872
+ }, index);
873
+ })
874
+ });
875
+ }, "Columns_component_7yLj4bxdI6c"));
876
+ const Columns$1 = Columns;
877
+ const STYLES$2 = `.div-Columns {
878
+ display: flex;
879
+ align-items: stretch;
880
+ line-height: normal; }@media (max-width: 991px) { .div-Columns {
881
+ flex-direction: var(--flex-dir-tablet); } }@media (max-width: 639px) { .div-Columns {
882
+ flex-direction: var(--flex-dir); } }.div-Columns-2 {
883
+ display: flex;
884
+ flex-direction: column;
885
+ align-items: stretch; }@media (max-width: 991px) { .div-Columns-2 {
886
+ width: var(--column-width-tablet) !important;
887
+ margin-left: var(--column-margin-left-tablet) !important; } }@media (max-width: 639px) { .div-Columns-2 {
888
+ width: var(--column-width) !important;
889
+ margin-left: var(--column-margin-left) !important; } }`;
890
+
891
+ // Taken from (and modified) the shopify theme script repo
892
+ // https://github.com/Shopify/theme-scripts/blob/bcfb471f2a57d439e2f964a1bb65b67708cc90c3/packages/theme-images/images.js#L59
893
+ function removeProtocol(path) {
894
+ return path.replace(/http(s)?:/, '');
895
+ }
896
+ function updateQueryParam(uri = '', key, value) {
897
+ const re = new RegExp('([?&])' + key + '=.*?(&|$)', 'i');
898
+ const separator = uri.indexOf('?') !== -1 ? '&' : '?';
899
+ if (uri.match(re)) return uri.replace(re, '$1' + key + '=' + encodeURIComponent(value) + '$2');
900
+ return uri + separator + key + '=' + encodeURIComponent(value);
901
+ }
902
+ function getShopifyImageUrl(src, size) {
903
+ if (!src || !src?.match(/cdn\.shopify\.com/) || !size) return src;
904
+ if (size === 'master') return removeProtocol(src);
905
+ const match = src.match(/(_\d+x(\d+)?)?(\.(jpg|jpeg|gif|png|bmp|bitmap|tiff|tif)(\?v=\d+)?)/i);
906
+ if (match) {
907
+ const prefix = src.split(match[0]);
908
+ const suffix = match[3];
909
+ const useSize = size.match('x') ? size : `${size}x`;
910
+ return removeProtocol(`${prefix[0]}_${useSize}${suffix}`);
911
+ }
912
+ return null;
913
+ }
914
+ function getSrcSet(url) {
915
+ if (!url) return url;
916
+ const sizes = [
917
+ 100,
918
+ 200,
919
+ 400,
920
+ 800,
921
+ 1200,
922
+ 1600,
923
+ 2000
924
+ ];
925
+ if (url.match(/builder\.io/)) {
926
+ let srcUrl = url;
927
+ const widthInSrc = Number(url.split('?width=')[1]);
928
+ if (!isNaN(widthInSrc)) srcUrl = `${srcUrl} ${widthInSrc}w`;
929
+ return sizes.filter((size)=>size !== widthInSrc).map((size)=>`${updateQueryParam(url, 'width', size)} ${size}w`).concat([
930
+ srcUrl
931
+ ]).join(', ');
932
+ }
933
+ if (url.match(/cdn\.shopify\.com/)) return sizes.map((size)=>[
934
+ getShopifyImageUrl(url, `${size}x${size}`),
935
+ size
936
+ ]).filter(([sizeUrl])=>!!sizeUrl).map(([sizeUrl, size])=>`${sizeUrl} ${size}w`).concat([
937
+ url
938
+ ]).join(', ');
939
+ return url;
940
+ }
941
+
942
+ // GENERATED BY MITOSIS
943
+ const srcSetToUse = function srcSetToUse(props, state) {
944
+ const imageToUse = props.image || props.src;
945
+ const url = imageToUse;
946
+ if (!url || // We can auto add srcset for cdn.builder.io and shopify
947
+ // images, otherwise you can supply this prop manually
948
+ !(url.match(/builder\.io/) || url.match(/cdn\.shopify\.com/))) return props.srcset;
949
+ if (props.srcset && props.image?.includes("builder.io/api/v1/image")) {
950
+ if (!props.srcset.includes(props.image.split("?")[0])) {
951
+ console.debug("Removed given srcset");
952
+ return getSrcSet(url);
953
+ }
954
+ } else if (props.image && !props.srcset) return getSrcSet(url);
955
+ return getSrcSet(url);
956
+ };
957
+ const webpSrcSet = function webpSrcSet(props, state) {
958
+ if (srcSetToUse(props)?.match(/builder\.io/) && !props.noWebp) return srcSetToUse(props).replace(/\?/g, "?format=webp&");
959
+ else return "";
960
+ };
961
+ const Image = /*#__PURE__*/ qwik.componentQrl(qwik.inlinedQrl((props)=>{
962
+ qwik.useStylesScopedQrl(qwik.inlinedQrl(STYLES$1, "Image_component_useStylesScoped_fBMYiVf9fuU"));
963
+ return /*#__PURE__*/ jsxRuntime.jsxs(qwik.Fragment, {
964
+ children: [
965
+ /*#__PURE__*/ jsxRuntime.jsxs("picture", {
966
+ children: [
967
+ webpSrcSet(props) ? /*#__PURE__*/ jsxRuntime.jsx("source", {
968
+ type: "image/webp",
969
+ srcSet: webpSrcSet(props)
970
+ }) : null,
971
+ /*#__PURE__*/ jsxRuntime.jsx("img", {
972
+ loading: "lazy",
973
+ get alt () {
974
+ return props.altText;
975
+ },
976
+ role: props.altText ? "presentation" : undefined,
977
+ style: {
978
+ objectPosition: props.backgroundSize || "center",
979
+ objectFit: props.backgroundSize || "cover"
980
+ },
981
+ class: "builder-image" + (props.className ? " " + props.className : "") + " img-Image",
982
+ get src () {
983
+ return props.image;
984
+ },
985
+ srcSet: srcSetToUse(props),
986
+ get sizes () {
987
+ return props.sizes;
988
+ },
989
+ [qwik._IMMUTABLE]: {
990
+ alt: qwik._wrapSignal(props, "altText"),
991
+ src: qwik._wrapSignal(props, "image"),
992
+ sizes: qwik._wrapSignal(props, "sizes")
993
+ }
994
+ }),
995
+ /*#__PURE__*/ jsxRuntime.jsx("source", {
996
+ srcSet: srcSetToUse(props)
997
+ })
998
+ ]
999
+ }),
1000
+ props.aspectRatio && !(props.builderBlock?.children?.length && props.fitContent) ? /*#__PURE__*/ jsxRuntime.jsx("div", {
1001
+ class: "builder-image-sizer div-Image",
1002
+ style: {
1003
+ paddingTop: // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
1004
+ props.aspectRatio * 100 + "%"
1005
+ }
1006
+ }) : null,
1007
+ props.builderBlock?.children?.length && props.fitContent ? /*#__PURE__*/ jsxRuntime.jsx(qwik.Slot, {}) : null,
1008
+ !props.fitContent && props.children ? /*#__PURE__*/ jsxRuntime.jsx("div", {
1009
+ class: "div-Image-2",
1010
+ children: /*#__PURE__*/ jsxRuntime.jsx(qwik.Slot, {})
1011
+ }) : null
1012
+ ]
1013
+ });
1014
+ }, "Image_component_LRxDkFa1EfU"));
1015
+ const Image$1 = Image;
1016
+ const STYLES$1 = `.img-Image {
1017
+ opacity: 1;
1018
+ transition: opacity 0.2s ease-in-out;
1019
+ position: absolute;
1020
+ height: 100%;
1021
+ width: 100%;
1022
+ top: 0px;
1023
+ left: 0px; }.div-Image {
1024
+ width: 100%;
1025
+ pointer-events: none;
1026
+ font-size: 0; }.div-Image-2 {
1027
+ display: flex;
1028
+ flex-direction: column;
1029
+ align-items: stretch;
1030
+ position: absolute;
1031
+ top: 0;
1032
+ left: 0;
1033
+ width: 100%;
1034
+ height: 100%; }`;
1035
+
1036
+ // GENERATED BY MITOSIS
1037
+ const Text = /*#__PURE__*/ qwik.componentQrl(qwik.inlinedQrl((props)=>{
1038
+ return /*#__PURE__*/ jsxRuntime.jsx("span", {
1039
+ class: "builder-text",
1040
+ get dangerouslySetInnerHTML () {
1041
+ return props.text;
1042
+ },
1043
+ [qwik._IMMUTABLE]: {
1044
+ dangerouslySetInnerHTML: qwik._wrapSignal(props, "text")
1045
+ }
1046
+ });
1047
+ }, "Text_component_15p0cKUxgIE"));
1048
+ const Text$1 = Text;
1049
+
1050
+ // GENERATED BY MITOSIS
1051
+ const videoProps = function videoProps(props, state) {
1052
+ return {
1053
+ ...props.autoPlay === true ? {
1054
+ autoPlay: true
1055
+ } : {},
1056
+ ...props.muted === true ? {
1057
+ muted: true
1058
+ } : {},
1059
+ ...props.controls === true ? {
1060
+ controls: true
1061
+ } : {},
1062
+ ...props.loop === true ? {
1063
+ loop: true
1064
+ } : {},
1065
+ ...props.playsInline === true ? {
1066
+ playsInline: true
1067
+ } : {}
1068
+ };
1069
+ };
1070
+ const spreadProps = function spreadProps(props, state) {
1071
+ return {
1072
+ ...props.attributes,
1073
+ ...videoProps(props)
1074
+ };
1075
+ };
1076
+ const Video = /*#__PURE__*/ qwik.componentQrl(qwik.inlinedQrl((props)=>{
1077
+ return /*#__PURE__*/ jsxRuntime.jsx("video", {
1078
+ ...spreadProps(props),
1079
+ style: {
1080
+ width: "100%",
1081
+ height: "100%",
1082
+ ...props.attributes?.style,
1083
+ objectFit: props.fit,
1084
+ objectPosition: props.position,
1085
+ // Hack to get object fit to work as expected and
1086
+ // not have the video overflow
1087
+ borderRadius: 1
1088
+ },
1089
+ src: props.video || "no-src",
1090
+ get poster () {
1091
+ return props.posterImage;
1092
+ },
1093
+ [qwik._IMMUTABLE]: {
1094
+ poster: qwik._wrapSignal(props, "posterImage")
1095
+ }
1096
+ });
1097
+ }, "Video_component_qdcTZflYyoQ"));
1098
+ const Video$1 = Video;
1099
+
1100
+ // GENERATED BY MITOSIS
1101
+ const Button = /*#__PURE__*/ qwik.componentQrl(qwik.inlinedQrl((props)=>{
1102
+ qwik.useStylesScopedQrl(qwik.inlinedQrl(STYLES, "Button_component_useStylesScoped_a1JZ0Q0Q2Oc"));
1103
+ return /*#__PURE__*/ jsxRuntime.jsx(jsxRuntime.Fragment, {
1104
+ children: props.link ? /*#__PURE__*/ jsxRuntime.jsx("a", {
1105
+ role: "button",
1106
+ ...props.attributes,
1107
+ get href () {
1108
+ return props.link;
1109
+ },
1110
+ target: props.openLinkInNewTab ? "_blank" : undefined,
1111
+ children: qwik._wrapSignal(props, "text"),
1112
+ [qwik._IMMUTABLE]: {
1113
+ href: qwik._wrapSignal(props, "link")
1114
+ }
1115
+ }) : /*#__PURE__*/ jsxRuntime.jsx("button", {
1116
+ class: "button-Button",
1117
+ ...props.attributes,
1118
+ children: qwik._wrapSignal(props, "text")
1119
+ })
1120
+ });
1121
+ }, "Button_component_gJoMUICXoUQ"));
1122
+ const Button$1 = Button;
1123
+ const STYLES = `.button-Button {
1124
+ all: unset; }`;
1125
+
1126
+ const componentInfo$a = {
1127
+ name: 'Core:Button',
1128
+ builtIn: true,
1129
+ image: 'https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F81a15681c3e74df09677dfc57a615b13',
1130
+ defaultStyles: {
1131
+ // TODO: make min width more intuitive and set one
1132
+ appearance: 'none',
1133
+ paddingTop: '15px',
1134
+ paddingBottom: '15px',
1135
+ paddingLeft: '25px',
1136
+ paddingRight: '25px',
1137
+ backgroundColor: '#000000',
1138
+ color: 'white',
1139
+ borderRadius: '4px',
1140
+ textAlign: 'center',
1141
+ cursor: 'pointer'
1142
+ },
1143
+ inputs: [
1144
+ {
1145
+ name: 'text',
1146
+ type: 'text',
1147
+ defaultValue: 'Click me!',
1148
+ bubble: true
1149
+ },
1150
+ {
1151
+ name: 'link',
1152
+ type: 'url',
1153
+ bubble: true
1154
+ },
1155
+ {
1156
+ name: 'openLinkInNewTab',
1157
+ type: 'boolean',
1158
+ defaultValue: false,
1159
+ friendlyName: 'Open link in new tab'
1160
+ }
1161
+ ],
1162
+ static: true,
1163
+ noWrap: true
1164
+ };
1165
+
1166
+ /**
1167
+ * Input attributes that are functions must be converted to strings before being serialized to JSON.
1168
+ */ // eslint-disable-next-line @typescript-eslint/ban-types
1169
+ const serializeFn = (fnValue)=>{
1170
+ const fnStr = fnValue.toString().trim();
1171
+ // we need to account for a few different fn syntaxes:
1172
+ // 1. `function name(args) => {code}`
1173
+ // 2. `name(args) => {code}`
1174
+ // 3. `(args) => {}`
1175
+ const appendFunction = !fnStr.startsWith('function') && !fnStr.startsWith('(');
1176
+ return `return (${appendFunction ? 'function ' : ''}${fnStr}).apply(this, arguments)`;
1177
+ };
1178
+
1179
+ const componentInfo$9 = {
1180
+ // TODO: ways to statically preprocess JSON for references, functions, etc
1181
+ name: 'Columns',
1182
+ builtIn: true,
1183
+ inputs: [
1184
+ {
1185
+ name: 'columns',
1186
+ type: 'array',
1187
+ broadcast: true,
1188
+ subFields: [
1189
+ {
1190
+ name: 'blocks',
1191
+ type: 'array',
1192
+ hideFromUI: true,
1193
+ defaultValue: [
1194
+ {
1195
+ '@type': '@builder.io/sdk:Element',
1196
+ responsiveStyles: {
1197
+ large: {
1198
+ display: 'flex',
1199
+ flexDirection: 'column',
1200
+ alignItems: 'stretch',
1201
+ flexShrink: '0',
1202
+ position: 'relative',
1203
+ marginTop: '30px',
1204
+ textAlign: 'center',
1205
+ lineHeight: 'normal',
1206
+ height: 'auto',
1207
+ minHeight: '20px',
1208
+ minWidth: '20px',
1209
+ overflow: 'hidden'
1210
+ }
1211
+ },
1212
+ component: {
1213
+ name: 'Image',
1214
+ options: {
1215
+ image: 'https://builder.io/api/v1/image/assets%2Fpwgjf0RoYWbdnJSbpBAjXNRMe9F2%2Ffb27a7c790324294af8be1c35fe30f4d',
1216
+ backgroundPosition: 'center',
1217
+ backgroundSize: 'cover',
1218
+ aspectRatio: 0.7004048582995948
1219
+ }
1220
+ }
1221
+ },
1222
+ {
1223
+ '@type': '@builder.io/sdk:Element',
1224
+ responsiveStyles: {
1225
+ large: {
1226
+ display: 'flex',
1227
+ flexDirection: 'column',
1228
+ alignItems: 'stretch',
1229
+ flexShrink: '0',
1230
+ position: 'relative',
1231
+ marginTop: '30px',
1232
+ textAlign: 'center',
1233
+ lineHeight: 'normal',
1234
+ height: 'auto'
1235
+ }
1236
+ },
1237
+ component: {
1238
+ name: 'Text',
1239
+ options: {
1240
+ text: '<p>Enter some text...</p>'
1241
+ }
1242
+ }
1243
+ }
1244
+ ]
1245
+ },
1246
+ {
1247
+ name: 'width',
1248
+ type: 'number',
1249
+ hideFromUI: true,
1250
+ helperText: 'Width %, e.g. set to 50 to fill half of the space'
1251
+ },
1252
+ {
1253
+ name: 'link',
1254
+ type: 'url',
1255
+ helperText: 'Optionally set a url that clicking this column will link to'
1256
+ }
1257
+ ],
1258
+ defaultValue: [
1259
+ {
1260
+ blocks: [
1261
+ {
1262
+ '@type': '@builder.io/sdk:Element',
1263
+ responsiveStyles: {
1264
+ large: {
1265
+ display: 'flex',
1266
+ flexDirection: 'column',
1267
+ alignItems: 'stretch',
1268
+ flexShrink: '0',
1269
+ position: 'relative',
1270
+ marginTop: '30px',
1271
+ textAlign: 'center',
1272
+ lineHeight: 'normal',
1273
+ height: 'auto',
1274
+ minHeight: '20px',
1275
+ minWidth: '20px',
1276
+ overflow: 'hidden'
1277
+ }
1278
+ },
1279
+ component: {
1280
+ name: 'Image',
1281
+ options: {
1282
+ image: 'https://builder.io/api/v1/image/assets%2Fpwgjf0RoYWbdnJSbpBAjXNRMe9F2%2Ffb27a7c790324294af8be1c35fe30f4d',
1283
+ backgroundPosition: 'center',
1284
+ backgroundSize: 'cover',
1285
+ aspectRatio: 0.7004048582995948
1286
+ }
1287
+ }
1288
+ },
1289
+ {
1290
+ '@type': '@builder.io/sdk:Element',
1291
+ responsiveStyles: {
1292
+ large: {
1293
+ display: 'flex',
1294
+ flexDirection: 'column',
1295
+ alignItems: 'stretch',
1296
+ flexShrink: '0',
1297
+ position: 'relative',
1298
+ marginTop: '30px',
1299
+ textAlign: 'center',
1300
+ lineHeight: 'normal',
1301
+ height: 'auto'
1302
+ }
1303
+ },
1304
+ component: {
1305
+ name: 'Text',
1306
+ options: {
1307
+ text: '<p>Enter some text...</p>'
1308
+ }
1309
+ }
1310
+ }
1311
+ ]
1312
+ },
1313
+ {
1314
+ blocks: [
1315
+ {
1316
+ '@type': '@builder.io/sdk:Element',
1317
+ responsiveStyles: {
1318
+ large: {
1319
+ display: 'flex',
1320
+ flexDirection: 'column',
1321
+ alignItems: 'stretch',
1322
+ flexShrink: '0',
1323
+ position: 'relative',
1324
+ marginTop: '30px',
1325
+ textAlign: 'center',
1326
+ lineHeight: 'normal',
1327
+ height: 'auto',
1328
+ minHeight: '20px',
1329
+ minWidth: '20px',
1330
+ overflow: 'hidden'
1331
+ }
1332
+ },
1333
+ component: {
1334
+ name: 'Image',
1335
+ options: {
1336
+ image: 'https://builder.io/api/v1/image/assets%2Fpwgjf0RoYWbdnJSbpBAjXNRMe9F2%2Ffb27a7c790324294af8be1c35fe30f4d',
1337
+ backgroundPosition: 'center',
1338
+ backgroundSize: 'cover',
1339
+ aspectRatio: 0.7004048582995948
1340
+ }
1341
+ }
1342
+ },
1343
+ {
1344
+ '@type': '@builder.io/sdk:Element',
1345
+ responsiveStyles: {
1346
+ large: {
1347
+ display: 'flex',
1348
+ flexDirection: 'column',
1349
+ alignItems: 'stretch',
1350
+ flexShrink: '0',
1351
+ position: 'relative',
1352
+ marginTop: '30px',
1353
+ textAlign: 'center',
1354
+ lineHeight: 'normal',
1355
+ height: 'auto'
1356
+ }
1357
+ },
1358
+ component: {
1359
+ name: 'Text',
1360
+ options: {
1361
+ text: '<p>Enter some text...</p>'
1362
+ }
1363
+ }
1364
+ }
1365
+ ]
1366
+ }
1367
+ ],
1368
+ onChange: serializeFn((options)=>{
1369
+ function clearWidths() {
1370
+ columns.forEach((col)=>{
1371
+ col.delete('width');
1372
+ });
1373
+ }
1374
+ const columns = options.get('columns');
1375
+ if (Array.isArray(columns)) {
1376
+ const containsColumnWithWidth = !!columns.find((col)=>col.get('width'));
1377
+ if (containsColumnWithWidth) {
1378
+ const containsColumnWithoutWidth = !!columns.find((col)=>!col.get('width'));
1379
+ if (containsColumnWithoutWidth) clearWidths();
1380
+ else {
1381
+ const sumWidths = columns.reduce((memo, col)=>{
1382
+ return memo + col.get('width');
1383
+ }, 0);
1384
+ const widthsDontAddUp = sumWidths !== 100;
1385
+ if (widthsDontAddUp) clearWidths();
1386
+ }
1387
+ }
1388
+ }
1389
+ })
1390
+ },
1391
+ {
1392
+ name: 'space',
1393
+ type: 'number',
1394
+ defaultValue: 20,
1395
+ helperText: 'Size of gap between columns',
1396
+ advanced: true
1397
+ },
1398
+ {
1399
+ name: 'stackColumnsAt',
1400
+ type: 'string',
1401
+ defaultValue: 'tablet',
1402
+ helperText: 'Convert horizontal columns to vertical at what device size',
1403
+ enum: [
1404
+ 'tablet',
1405
+ 'mobile',
1406
+ 'never'
1407
+ ],
1408
+ advanced: true
1409
+ },
1410
+ {
1411
+ name: 'reverseColumnsWhenStacked',
1412
+ type: 'boolean',
1413
+ defaultValue: false,
1414
+ helperText: 'When stacking columns for mobile devices, reverse the ordering',
1415
+ advanced: true
1416
+ }
1417
+ ]
1418
+ };
1419
+
1420
+ const componentInfo$8 = {
1421
+ name: 'Fragment',
1422
+ static: true,
1423
+ hidden: true,
1424
+ builtIn: true,
1425
+ canHaveChildren: true,
1426
+ noWrap: true
1427
+ };
1428
+
1429
+ // GENERATED BY MITOSIS
1430
+ const FragmentComponent = /*#__PURE__*/ qwik.componentQrl(qwik.inlinedQrl((props)=>{
1431
+ return /*#__PURE__*/ jsxRuntime.jsx("span", {
1432
+ children: /*#__PURE__*/ jsxRuntime.jsx(qwik.Slot, {})
1433
+ });
1434
+ }, "FragmentComponent_component_T0AypnadAK0"));
1435
+ const Fragment = FragmentComponent;
1436
+
1437
+ const componentInfo$7 = {
1438
+ name: 'Image',
1439
+ static: true,
1440
+ builtIn: true,
1441
+ 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',
1442
+ defaultStyles: {
1443
+ position: 'relative',
1444
+ minHeight: '20px',
1445
+ minWidth: '20px',
1446
+ overflow: 'hidden'
1447
+ },
1448
+ canHaveChildren: true,
1449
+ inputs: [
1450
+ {
1451
+ name: 'image',
1452
+ type: 'file',
1453
+ bubble: true,
1454
+ allowedFileTypes: [
1455
+ 'jpeg',
1456
+ 'jpg',
1457
+ 'png',
1458
+ 'svg'
1459
+ ],
1460
+ required: true,
1461
+ defaultValue: 'https://cdn.builder.io/api/v1/image/assets%2Fpwgjf0RoYWbdnJSbpBAjXNRMe9F2%2Ffb27a7c790324294af8be1c35fe30f4d',
1462
+ onChange: serializeFn((options)=>{
1463
+ const DEFAULT_ASPECT_RATIO = 0.7041;
1464
+ options.delete('srcset');
1465
+ options.delete('noWebp');
1466
+ function loadImage(url, timeout = 60000) {
1467
+ return new Promise((resolve, reject)=>{
1468
+ const img = document.createElement('img');
1469
+ let loaded = false;
1470
+ img.onload = ()=>{
1471
+ loaded = true;
1472
+ resolve(img);
1473
+ };
1474
+ img.addEventListener('error', (event)=>{
1475
+ console.warn('Image load failed', event.error);
1476
+ reject(event.error);
1477
+ });
1478
+ img.src = url;
1479
+ setTimeout(()=>{
1480
+ if (!loaded) reject(new Error('Image load timed out'));
1481
+ }, timeout);
1482
+ });
1483
+ }
1484
+ function round(num) {
1485
+ return Math.round(num * 1000) / 1000;
1486
+ }
1487
+ const value = options.get('image');
1488
+ const aspectRatio = options.get('aspectRatio');
1489
+ // For SVG images - don't render as webp, keep them as SVG
1490
+ fetch(value).then((res)=>res.blob()).then((blob)=>{
1491
+ if (blob.type.includes('svg')) options.set('noWebp', true);
1492
+ });
1493
+ if (value && (!aspectRatio || aspectRatio === DEFAULT_ASPECT_RATIO)) return loadImage(value).then((img)=>{
1494
+ const possiblyUpdatedAspectRatio = options.get('aspectRatio');
1495
+ if (options.get('image') === value && (!possiblyUpdatedAspectRatio || possiblyUpdatedAspectRatio === DEFAULT_ASPECT_RATIO)) {
1496
+ if (img.width && img.height) {
1497
+ options.set('aspectRatio', round(img.height / img.width));
1498
+ options.set('height', img.height);
1499
+ options.set('width', img.width);
1500
+ }
1501
+ }
1502
+ });
1503
+ })
1504
+ },
1505
+ {
1506
+ name: 'backgroundSize',
1507
+ type: 'text',
1508
+ defaultValue: 'cover',
1509
+ enum: [
1510
+ {
1511
+ label: 'contain',
1512
+ value: 'contain',
1513
+ helperText: 'The image should never get cropped'
1514
+ },
1515
+ {
1516
+ label: 'cover',
1517
+ value: 'cover',
1518
+ helperText: "The image should fill it's box, cropping when needed"
1519
+ }
1520
+ ]
1521
+ },
1522
+ {
1523
+ name: 'backgroundPosition',
1524
+ type: 'text',
1525
+ defaultValue: 'center',
1526
+ enum: [
1527
+ 'center',
1528
+ 'top',
1529
+ 'left',
1530
+ 'right',
1531
+ 'bottom',
1532
+ 'top left',
1533
+ 'top right',
1534
+ 'bottom left',
1535
+ 'bottom right'
1536
+ ]
1537
+ },
1538
+ {
1539
+ name: 'altText',
1540
+ type: 'string',
1541
+ helperText: 'Text to display when the user has images off'
1542
+ },
1543
+ {
1544
+ name: 'height',
1545
+ type: 'number',
1546
+ hideFromUI: true
1547
+ },
1548
+ {
1549
+ name: 'width',
1550
+ type: 'number',
1551
+ hideFromUI: true
1552
+ },
1553
+ {
1554
+ name: 'sizes',
1555
+ type: 'string',
1556
+ hideFromUI: true
1557
+ },
1558
+ {
1559
+ name: 'srcset',
1560
+ type: 'string',
1561
+ hideFromUI: true
1562
+ },
1563
+ {
1564
+ name: 'lazy',
1565
+ type: 'boolean',
1566
+ defaultValue: true,
1567
+ hideFromUI: true
1568
+ },
1569
+ {
1570
+ name: 'fitContent',
1571
+ type: 'boolean',
1572
+ helperText: "When child blocks are provided, fit to them instead of using the image's aspect ratio",
1573
+ defaultValue: true
1574
+ },
1575
+ {
1576
+ name: 'aspectRatio',
1577
+ type: 'number',
1578
+ 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",
1579
+ advanced: true,
1580
+ defaultValue: 0.7041
1581
+ }
1582
+ ]
1583
+ };
1584
+
1585
+ const componentInfo$6 = {
1586
+ name: 'Core:Section',
1587
+ static: true,
1588
+ builtIn: true,
1589
+ image: 'https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F682efef23ace49afac61748dd305c70a',
1590
+ inputs: [
1591
+ {
1592
+ name: 'maxWidth',
1593
+ type: 'number',
1594
+ defaultValue: 1200
1595
+ },
1596
+ {
1597
+ name: 'lazyLoad',
1598
+ type: 'boolean',
1599
+ defaultValue: false,
1600
+ advanced: true,
1601
+ description: 'Only render this section when in view'
1602
+ }
1603
+ ],
1604
+ defaultStyles: {
1605
+ paddingLeft: '20px',
1606
+ paddingRight: '20px',
1607
+ paddingTop: '50px',
1608
+ paddingBottom: '50px',
1609
+ marginTop: '0px',
1610
+ width: '100vw',
1611
+ marginLeft: 'calc(50% - 50vw)'
1612
+ },
1613
+ canHaveChildren: true,
1614
+ defaultChildren: [
1615
+ {
1616
+ '@type': '@builder.io/sdk:Element',
1617
+ responsiveStyles: {
1618
+ large: {
1619
+ textAlign: 'center'
1620
+ }
1621
+ },
1622
+ component: {
1623
+ name: 'Text',
1624
+ options: {
1625
+ 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>"
1626
+ }
1627
+ }
1628
+ }
1629
+ ]
1630
+ };
1631
+
1632
+ // GENERATED BY MITOSIS
1633
+ const SectionComponent = /*#__PURE__*/ qwik.componentQrl(qwik.inlinedQrl((props)=>{
1634
+ return /*#__PURE__*/ jsxRuntime.jsx("section", {
1635
+ ...props.attributes,
1636
+ style: (()=>{
1637
+ props.maxWidth && typeof props.maxWidth === "number" ? props.maxWidth : undefined;
1638
+ })(),
1639
+ children: /*#__PURE__*/ jsxRuntime.jsx(qwik.Slot, {})
1640
+ });
1641
+ }, "SectionComponent_component_ZWF9iD5WeLg"));
1642
+ const Section = SectionComponent;
1643
+
1644
+ const componentInfo$5 = {
1645
+ name: 'Symbol',
1646
+ noWrap: true,
1647
+ static: true,
1648
+ builtIn: true,
1649
+ inputs: [
1650
+ {
1651
+ name: 'symbol',
1652
+ type: 'uiSymbol'
1653
+ },
1654
+ {
1655
+ name: 'dataOnly',
1656
+ helperText: "Make this a data symbol that doesn't display any UI",
1657
+ type: 'boolean',
1658
+ defaultValue: false,
1659
+ advanced: true,
1660
+ hideFromUI: true
1661
+ },
1662
+ {
1663
+ name: 'inheritState',
1664
+ helperText: 'Inherit the parent component state and data',
1665
+ type: 'boolean',
1666
+ defaultValue: false,
1667
+ advanced: true
1668
+ },
1669
+ {
1670
+ name: 'renderToLiquid',
1671
+ helperText: 'Render this symbols contents to liquid. Turn off to fetch with javascript and use custom targeting',
1672
+ type: 'boolean',
1673
+ defaultValue: false,
1674
+ advanced: true,
1675
+ hideFromUI: true
1676
+ },
1677
+ {
1678
+ name: 'useChildren',
1679
+ hideFromUI: true,
1680
+ type: 'boolean'
1681
+ }
1682
+ ]
1683
+ };
1684
+
1685
+ const componentInfo$4 = {
1686
+ name: 'Text',
1687
+ static: true,
1688
+ builtIn: true,
1689
+ 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',
1690
+ inputs: [
1691
+ {
1692
+ name: 'text',
1693
+ type: 'html',
1694
+ required: true,
1695
+ autoFocus: true,
1696
+ bubble: true,
1697
+ defaultValue: 'Enter some text...'
1698
+ }
1699
+ ],
1700
+ defaultStyles: {
1701
+ lineHeight: 'normal',
1702
+ height: 'auto',
1703
+ textAlign: 'center'
1704
+ }
1705
+ };
1706
+
1707
+ const componentInfo$3 = {
1708
+ name: 'Video',
1709
+ canHaveChildren: true,
1710
+ builtIn: true,
1711
+ defaultStyles: {
1712
+ minHeight: '20px',
1713
+ minWidth: '20px'
1714
+ },
1715
+ 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',
1716
+ inputs: [
1717
+ {
1718
+ name: 'video',
1719
+ type: 'file',
1720
+ allowedFileTypes: [
1721
+ 'mp4'
1722
+ ],
1723
+ bubble: true,
1724
+ defaultValue: 'https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/assets%2FKQlEmWDxA0coC3PK6UvkrjwkIGI2%2F28cb070609f546cdbe5efa20e931aa4b?alt=media&token=912e9551-7a7c-4dfb-86b6-3da1537d1a7f',
1725
+ required: true
1726
+ },
1727
+ {
1728
+ name: 'posterImage',
1729
+ type: 'file',
1730
+ allowedFileTypes: [
1731
+ 'jpeg',
1732
+ 'png'
1733
+ ],
1734
+ helperText: 'Image to show before the video plays'
1735
+ },
1736
+ {
1737
+ name: 'autoPlay',
1738
+ type: 'boolean',
1739
+ defaultValue: true
1740
+ },
1741
+ {
1742
+ name: 'controls',
1743
+ type: 'boolean',
1744
+ defaultValue: false
1745
+ },
1746
+ {
1747
+ name: 'muted',
1748
+ type: 'boolean',
1749
+ defaultValue: true
1750
+ },
1751
+ {
1752
+ name: 'loop',
1753
+ type: 'boolean',
1754
+ defaultValue: true
1755
+ },
1756
+ {
1757
+ name: 'playsInline',
1758
+ type: 'boolean',
1759
+ defaultValue: true
1760
+ },
1761
+ {
1762
+ name: 'fit',
1763
+ type: 'text',
1764
+ defaultValue: 'cover',
1765
+ enum: [
1766
+ 'contain',
1767
+ 'cover',
1768
+ 'fill',
1769
+ 'auto'
1770
+ ]
1771
+ },
1772
+ {
1773
+ name: 'fitContent',
1774
+ type: 'boolean',
1775
+ helperText: 'When child blocks are provided, fit to them instead of using the aspect ratio',
1776
+ defaultValue: true,
1777
+ advanced: true
1778
+ },
1779
+ {
1780
+ name: 'position',
1781
+ type: 'text',
1782
+ defaultValue: 'center',
1783
+ enum: [
1784
+ 'center',
1785
+ 'top',
1786
+ 'left',
1787
+ 'right',
1788
+ 'bottom',
1789
+ 'top left',
1790
+ 'top right',
1791
+ 'bottom left',
1792
+ 'bottom right'
1793
+ ]
1794
+ },
1795
+ {
1796
+ name: 'height',
1797
+ type: 'number',
1798
+ advanced: true
1799
+ },
1800
+ {
1801
+ name: 'width',
1802
+ type: 'number',
1803
+ advanced: true
1804
+ },
1805
+ {
1806
+ name: 'aspectRatio',
1807
+ type: 'number',
1808
+ advanced: true,
1809
+ defaultValue: 0.7004048582995948
1810
+ },
1811
+ {
1812
+ name: 'lazyLoad',
1813
+ type: 'boolean',
1814
+ helperText: 'Load this video "lazily" - as in only when a user scrolls near the video. Recommended for optmized performance and bandwidth consumption',
1815
+ defaultValue: true,
1816
+ advanced: true
1817
+ }
1818
+ ]
1819
+ };
1820
+
1821
+ const componentInfo$2 = {
1822
+ name: 'Embed',
1823
+ static: true,
1824
+ builtIn: true,
1825
+ inputs: [
1826
+ {
1827
+ name: 'url',
1828
+ type: 'url',
1829
+ required: true,
1830
+ defaultValue: '',
1831
+ helperText: 'e.g. enter a youtube url, google map, etc',
1832
+ onChange: serializeFn((options)=>{
1833
+ const url = options.get('url');
1834
+ if (url) {
1835
+ options.set('content', 'Loading...');
1836
+ // TODO: get this out of here!
1837
+ const apiKey = 'ae0e60e78201a3f2b0de4b';
1838
+ return fetch(`https://iframe.ly/api/iframely?url=${url}&api_key=${apiKey}`).then((res)=>res.json()).then((data)=>{
1839
+ if (options.get('url') === url) {
1840
+ if (data.html) options.set('content', data.html);
1841
+ else options.set('content', 'Invalid url, please try another');
1842
+ }
1843
+ }).catch((_err)=>{
1844
+ options.set('content', 'There was an error embedding this URL, please try again or another URL');
1845
+ });
1846
+ } else options.delete('content');
1847
+ })
1848
+ },
1849
+ {
1850
+ name: 'content',
1851
+ type: 'html',
1852
+ defaultValue: '<div style="padding: 20px; text-align: center">(Choose an embed URL)<div>',
1853
+ hideFromUI: true
1854
+ }
1855
+ ]
1856
+ };
1857
+
1858
+ const SCRIPT_MIME_TYPES = [
1859
+ 'text/javascript',
1860
+ 'application/javascript',
1861
+ 'application/ecmascript'
1862
+ ];
1863
+ const isJsScript = (script)=>SCRIPT_MIME_TYPES.includes(script.type);
1864
+
1865
+ // GENERATED BY MITOSIS
1866
+ const findAndRunScripts$1 = function findAndRunScripts(props, state, elem) {
1867
+ if (!elem || !elem.getElementsByTagName) return;
1868
+ const scripts = elem.getElementsByTagName("script");
1869
+ for(let i = 0; i < scripts.length; i++){
1870
+ const script = scripts[i];
1871
+ if (script.src && !state.scriptsInserted.includes(script.src)) {
1872
+ state.scriptsInserted.push(script.src);
1873
+ const newScript = document.createElement("script");
1874
+ newScript.async = true;
1875
+ newScript.src = script.src;
1876
+ document.head.appendChild(newScript);
1877
+ } else if (isJsScript(script) && !state.scriptsRun.includes(script.innerText)) try {
1878
+ state.scriptsRun.push(script.innerText);
1879
+ new Function(script.innerText)();
1880
+ } catch (error) {
1881
+ console.warn("`Embed`: Error running script:", error);
1882
+ }
1883
+ }
1884
+ };
1885
+ const Embed = /*#__PURE__*/ qwik.componentQrl(qwik.inlinedQrl((props)=>{
1886
+ const elem = qwik.useRef();
1887
+ const state = qwik.useStore({
1888
+ ranInitFn: false,
1889
+ scriptsInserted: [],
1890
+ scriptsRun: []
1891
+ });
1892
+ qwik.useWatchQrl(qwik.inlinedQrl(({ track })=>{
1893
+ const [elem, props, state] = qwik.useLexicalScope();
1894
+ state && track(state, "ranInitFn");
1895
+ if (elem && !state.ranInitFn) {
1896
+ state.ranInitFn = true;
1897
+ findAndRunScripts$1(props, state, elem);
1898
+ }
1899
+ }, "Embed_component_useWatch_AxgWjrHdlAI", [
1900
+ elem,
1901
+ props,
1902
+ state
1903
+ ]));
1904
+ return /*#__PURE__*/ jsxRuntime.jsx("div", {
1905
+ class: "builder-embed",
1906
+ ref: elem,
1907
+ get dangerouslySetInnerHTML () {
1908
+ return props.content;
1909
+ },
1910
+ [qwik._IMMUTABLE]: {
1911
+ dangerouslySetInnerHTML: qwik._wrapSignal(props, "content")
1912
+ }
1913
+ });
1914
+ }, "Embed_component_Uji08ORjXbE"));
1915
+ const embed = Embed;
1916
+
1917
+ // GENERATED BY MITOSIS
1918
+ const ImgComponent = /*#__PURE__*/ qwik.componentQrl(qwik.inlinedQrl((props)=>{
1919
+ return /*#__PURE__*/ jsxRuntime.jsx("img", {
1920
+ style: {
1921
+ objectFit: props.backgroundSize || "cover",
1922
+ objectPosition: props.backgroundPosition || "center"
1923
+ },
1924
+ get alt () {
1925
+ return props.altText;
1926
+ },
1927
+ src: props.imgSrc || props.image,
1928
+ ...props.attributes,
1929
+ [qwik._IMMUTABLE]: {
1930
+ alt: qwik._wrapSignal(props, "altText")
1931
+ }
1932
+ }, isEditing() && props.imgSrc || "default-key");
1933
+ }, "ImgComponent_component_FXvIDBSffO8"));
1934
+ const Img = ImgComponent;
1935
+
1936
+ const componentInfo$1 = {
1937
+ // friendlyName?
1938
+ name: 'Raw:Img',
1939
+ hideFromInsertMenu: true,
1940
+ builtIn: true,
1941
+ 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',
1942
+ inputs: [
1943
+ {
1944
+ name: 'image',
1945
+ bubble: true,
1946
+ type: 'file',
1947
+ allowedFileTypes: [
1948
+ 'jpeg',
1949
+ 'jpg',
1950
+ 'png',
1951
+ 'svg'
1952
+ ],
1953
+ required: true
1954
+ }
1955
+ ],
1956
+ noWrap: true,
1957
+ static: true
1958
+ };
1959
+
1960
+ // GENERATED BY MITOSIS
1961
+ const findAndRunScripts = function findAndRunScripts(props, state, elem) {
1962
+ // TODO: Move this function to standalone one in '@builder.io/utils'
1963
+ if (elem && elem.getElementsByTagName && typeof window !== "undefined") {
1964
+ const scripts = elem.getElementsByTagName("script");
1965
+ for(let i = 0; i < scripts.length; i++){
1966
+ const script = scripts[i];
1967
+ if (script.src) {
1968
+ if (state.scriptsInserted.includes(script.src)) continue;
1969
+ state.scriptsInserted.push(script.src);
1970
+ const newScript = document.createElement("script");
1971
+ newScript.async = true;
1972
+ newScript.src = script.src;
1973
+ document.head.appendChild(newScript);
1974
+ } else if (!script.type || [
1975
+ "text/javascript",
1976
+ "application/javascript",
1977
+ "application/ecmascript"
1978
+ ].includes(script.type)) {
1979
+ if (state.scriptsRun.includes(script.innerText)) continue;
1980
+ try {
1981
+ state.scriptsRun.push(script.innerText);
1982
+ new Function(script.innerText)();
1983
+ } catch (error) {
1984
+ console.warn("`CustomCode`: Error running script:", error);
1985
+ }
1986
+ }
1987
+ }
1988
+ }
1989
+ };
1990
+ const CustomCode = /*#__PURE__*/ qwik.componentQrl(qwik.inlinedQrl((props)=>{
1991
+ const elem = qwik.useRef();
1992
+ const state = qwik.useStore({
1993
+ scriptsInserted: [],
1994
+ scriptsRun: []
1995
+ });
1996
+ qwik.useClientEffectQrl(qwik.inlinedQrl(()=>{
1997
+ const [elem, props, state] = qwik.useLexicalScope();
1998
+ findAndRunScripts(props, state, elem);
1999
+ }, "CustomCode_component_useClientEffect_4w4c951ufB4", [
2000
+ elem,
2001
+ props,
2002
+ state
2003
+ ]));
2004
+ return /*#__PURE__*/ jsxRuntime.jsx("div", {
2005
+ ref: elem,
2006
+ class: "builder-custom-code" + (props.replaceNodes ? " replace-nodes" : ""),
2007
+ get dangerouslySetInnerHTML () {
2008
+ return props.code;
2009
+ },
2010
+ [qwik._IMMUTABLE]: {
2011
+ dangerouslySetInnerHTML: qwik._wrapSignal(props, "code")
2012
+ }
2013
+ });
2014
+ }, "CustomCode_component_uYOSy7w7Zqw"));
2015
+ const customCode = CustomCode;
2016
+
2017
+ const componentInfo = {
2018
+ name: 'Custom Code',
2019
+ static: true,
2020
+ builtIn: true,
2021
+ requiredPermissions: [
2022
+ 'editCode'
2023
+ ],
2024
+ inputs: [
2025
+ {
2026
+ name: 'code',
2027
+ type: 'html',
2028
+ required: true,
2029
+ defaultValue: '<p>Hello there, I am custom HTML code!</p>',
2030
+ code: true
2031
+ },
2032
+ {
2033
+ name: 'replaceNodes',
2034
+ type: 'boolean',
2035
+ helperText: 'Preserve server rendered dom nodes',
2036
+ advanced: true
2037
+ },
2038
+ {
2039
+ name: 'scriptsClientOnly',
2040
+ type: 'boolean',
2041
+ defaultValue: false,
2042
+ helperText: 'Only print and run scripts on the client. Important when scripts influence DOM that could be replaced when client loads',
2043
+ advanced: true
2044
+ }
2045
+ ]
2046
+ };
2047
+
2048
+ /**
2049
+ * Returns a list of all registered components.
2050
+ * NOTE: This needs to be a function to work around ESM circular dependencies.
2051
+ */ const getDefaultRegisteredComponents = ()=>[
2052
+ {
2053
+ component: Columns$1,
2054
+ ...componentInfo$9
2055
+ },
2056
+ {
2057
+ component: Image$1,
2058
+ ...componentInfo$7
2059
+ },
2060
+ {
2061
+ component: Img,
2062
+ ...componentInfo$1
2063
+ },
2064
+ {
2065
+ component: Text$1,
2066
+ ...componentInfo$4
2067
+ },
2068
+ {
2069
+ component: Video$1,
2070
+ ...componentInfo$3
2071
+ },
2072
+ {
2073
+ component: Symbol$2,
2074
+ ...componentInfo$5
2075
+ },
2076
+ {
2077
+ component: Button$1,
2078
+ ...componentInfo$a
2079
+ },
2080
+ {
2081
+ component: Section,
2082
+ ...componentInfo$6
2083
+ },
2084
+ {
2085
+ component: Fragment,
2086
+ ...componentInfo$8
2087
+ },
2088
+ {
2089
+ component: embed,
2090
+ ...componentInfo$2
2091
+ },
2092
+ {
2093
+ component: customCode,
2094
+ ...componentInfo
2095
+ }
2096
+ ];
2097
+
2098
+ /**
2099
+ * Convert deep object to a flat object with dots
2100
+ *
2101
+ * { foo: { bar: 'baz' }} -> { 'foo.bar': 'baz' }
2102
+ */ function flatten(object, path = null, separator = '.') {
2103
+ return Object.keys(object).reduce((acc, key)=>{
2104
+ const value = object[key];
2105
+ const newPath = [
2106
+ path,
2107
+ key
2108
+ ].filter(Boolean).join(separator);
2109
+ const isObject = [
2110
+ typeof value === 'object',
2111
+ value !== null,
2112
+ !(Array.isArray(value) && value.length === 0)
2113
+ ].every(Boolean);
2114
+ return isObject ? {
2115
+ ...acc,
2116
+ ...flatten(value, newPath, separator)
2117
+ } : {
2118
+ ...acc,
2119
+ [newPath]: value
2120
+ };
2121
+ }, {});
2122
+ }
2123
+
2124
+ const BUILDER_SEARCHPARAMS_PREFIX = 'builder.';
2125
+ const convertSearchParamsToQueryObject = (searchParams)=>{
2126
+ const options = {};
2127
+ searchParams.forEach((value, key)=>{
2128
+ options[key] = value;
2129
+ });
2130
+ return options;
2131
+ };
2132
+ const getBuilderSearchParams = (_options)=>{
2133
+ if (!_options) return {};
2134
+ const options = normalizeSearchParams(_options);
2135
+ const newOptions = {};
2136
+ Object.keys(options).forEach((key)=>{
2137
+ if (key.startsWith(BUILDER_SEARCHPARAMS_PREFIX)) {
2138
+ const trimmedKey = key.replace(BUILDER_SEARCHPARAMS_PREFIX, '');
2139
+ newOptions[trimmedKey] = options[key];
2140
+ }
2141
+ });
2142
+ return newOptions;
2143
+ };
2144
+ const getBuilderSearchParamsFromWindow = ()=>{
2145
+ if (!isBrowser()) return {};
2146
+ const searchParams = new URLSearchParams(window.location.search);
2147
+ return getBuilderSearchParams(searchParams);
2148
+ };
2149
+ const normalizeSearchParams = (searchParams)=>searchParams instanceof URLSearchParams ? convertSearchParamsToQueryObject(searchParams) : searchParams;
2150
+
2151
+ function getGlobalThis() {
2152
+ if (typeof globalThis !== 'undefined') return globalThis;
2153
+ if (typeof window !== 'undefined') return window;
2154
+ if (typeof global !== 'undefined') return global;
2155
+ if (typeof self !== 'undefined') return self;
2156
+ return null;
2157
+ }
2158
+
2159
+ async function getFetch() {
2160
+ const globalFetch = getGlobalThis().fetch;
2161
+ if (typeof globalFetch === 'undefined' && typeof global !== 'undefined') throw new Error('`fetch()` not found, ensure you have it as part of your polyfills.');
2162
+ return globalFetch.default || globalFetch;
2163
+ }
2164
+
2165
+ /**
2166
+ * Only gets one level up from hostname
2167
+ * wwww.example.com -> example.com
2168
+ * www.example.co.uk -> example.co.uk
2169
+ */ const getTopLevelDomain = (host)=>{
2170
+ const parts = host.split('.');
2171
+ if (parts.length > 2) return parts.slice(1).join('.');
2172
+ return host;
2173
+ };
2174
+
2175
+ /**
2176
+ * NOTE: This function is `async` because its react-native override is async. Do not remove the `async` keyword!
2177
+ */ const getCookie = async ({ name , canTrack })=>{
2178
+ try {
2179
+ if (!canTrack) return undefined;
2180
+ /**
2181
+ * Extracted from MDN docs
2182
+ * https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie#example_2_get_a_sample_cookie_named_test2
2183
+ */ return document.cookie.split('; ').find((row)=>row.startsWith(`${name}=`))?.split('=')[1];
2184
+ } catch (err) {
2185
+ console.debug('[COOKIE] GET error: ', err);
2186
+ }
2187
+ };
2188
+ const stringifyCookie = (cookie)=>cookie.map(([key, value])=>value ? `${key}=${value}` : key).join('; ');
2189
+ const SECURE_CONFIG = [
2190
+ [
2191
+ 'secure',
2192
+ ''
2193
+ ],
2194
+ [
2195
+ 'SameSite',
2196
+ 'None'
2197
+ ]
2198
+ ];
2199
+ const createCookieString = ({ name , value , expires })=>{
2200
+ const secure = isBrowser() ? location.protocol === 'https:' : true;
2201
+ const secureObj = secure ? SECURE_CONFIG : [
2202
+ []
2203
+ ];
2204
+ // TODO: need to know if secure server side
2205
+ const expiresObj = expires ? [
2206
+ [
2207
+ 'expires',
2208
+ expires.toUTCString()
2209
+ ]
2210
+ ] : [
2211
+ []
2212
+ ];
2213
+ const cookieValue = [
2214
+ [
2215
+ name,
2216
+ value
2217
+ ],
2218
+ ...expiresObj,
2219
+ [
2220
+ 'path',
2221
+ '/'
2222
+ ],
2223
+ [
2224
+ 'domain',
2225
+ getTopLevelDomain(window.location.hostname)
2226
+ ],
2227
+ ...secureObj
2228
+ ];
2229
+ const cookie = stringifyCookie(cookieValue);
2230
+ return cookie;
2231
+ };
2232
+ /**
2233
+ * NOTE: This function is `async` because its react-native override is async. Do not remove the `async` keyword!
2234
+ */ const setCookie = async ({ name , value , expires , canTrack })=>{
2235
+ try {
2236
+ if (!canTrack) return undefined;
2237
+ const cookie = createCookieString({
2238
+ name,
2239
+ value,
2240
+ expires
2241
+ });
2242
+ document.cookie = cookie;
2243
+ } catch (err) {
2244
+ console.warn('[COOKIE] SET error: ', err);
2245
+ }
2246
+ };
2247
+
2248
+ const BUILDER_STORE_PREFIX = 'builderio.variations';
2249
+ const getContentTestKey = (id)=>`${BUILDER_STORE_PREFIX}.${id}`;
2250
+ const getContentVariationCookie = ({ contentId , canTrack })=>getCookie({
2251
+ name: getContentTestKey(contentId),
2252
+ canTrack
2253
+ });
2254
+ const setContentVariationCookie = ({ contentId , canTrack , value })=>setCookie({
2255
+ name: getContentTestKey(contentId),
2256
+ value,
2257
+ canTrack
2258
+ });
2259
+
2260
+ const checkIsDefined = (maybeT)=>maybeT !== null && maybeT !== undefined;
2261
+
2262
+ const checkIsBuilderContentWithVariations = (item)=>checkIsDefined(item.id) && checkIsDefined(item.variations) && Object.keys(item.variations).length > 0;
2263
+ /**
2264
+ * Randomly assign a variation to this user and store it in cookies/storage
2265
+ */ const getRandomVariationId = ({ id , variations })=>{
2266
+ let n = 0;
2267
+ const random = Math.random();
2268
+ // loop over variations test ratios, incrementing a counter,
2269
+ // until we find the variation that this user should be assigned to
2270
+ for(const id1 in variations){
2271
+ const testRatio = variations[id1]?.testRatio;
2272
+ n += testRatio;
2273
+ if (random < n) return id1;
2274
+ }
2275
+ // `item.variations` does not include the default variation
2276
+ // if we arrive here, then it means that the random number fits in the default variation bucket
2277
+ return id;
2278
+ };
2279
+ const getTestFields = ({ item , testGroupId })=>{
2280
+ const variationValue = item.variations[testGroupId];
2281
+ if (testGroupId === item.id || // handle edge-case where `testGroupId` points to non-existing variation
2282
+ !variationValue) return {
2283
+ testVariationId: item.id,
2284
+ testVariationName: 'Default'
2285
+ };
2286
+ else return {
2287
+ data: variationValue.data,
2288
+ testVariationId: variationValue.id,
2289
+ testVariationName: variationValue.name || (variationValue.id === item.id ? 'Default' : '')
2290
+ };
2291
+ };
2292
+ const getContentVariation = async ({ item , canTrack })=>{
2293
+ // try to find test variation in cookies/storage
2294
+ const testGroupId = await getContentVariationCookie({
2295
+ canTrack,
2296
+ contentId: item.id
2297
+ });
2298
+ const testFields = testGroupId ? getTestFields({
2299
+ item,
2300
+ testGroupId
2301
+ }) : undefined;
2302
+ if (testFields) return testFields;
2303
+ else {
2304
+ // if variation not found in storage, assign a random variation to this user
2305
+ const randomVariationId = getRandomVariationId({
2306
+ variations: item.variations,
2307
+ id: item.id
2308
+ });
2309
+ // store variation in cookies/storage
2310
+ setContentVariationCookie({
2311
+ contentId: item.id,
2312
+ value: randomVariationId,
2313
+ canTrack
2314
+ }).catch((err)=>{
2315
+ console.error('could not store A/B test variation: ', err);
2316
+ });
2317
+ return getTestFields({
2318
+ item,
2319
+ testGroupId: randomVariationId
2320
+ });
2321
+ }
2322
+ };
2323
+ const handleABTesting = async ({ item , canTrack })=>{
2324
+ if (!checkIsBuilderContentWithVariations(item)) return;
2325
+ const variationValue = await getContentVariation({
2326
+ item,
2327
+ canTrack
2328
+ });
2329
+ Object.assign(item, variationValue);
2330
+ };
2331
+
2332
+ async function getContent(options) {
2333
+ return (await getAllContent({
2334
+ ...options,
2335
+ limit: 1
2336
+ })).results[0] || null;
2337
+ }
2338
+ const generateContentUrl = (options)=>{
2339
+ const { limit =30 , userAttributes , query , noTraverse =false , model , apiKey , includeRefs =true , } = options;
2340
+ if (!apiKey) throw new Error('Missing API key');
2341
+ const url = new URL(`https://cdn.builder.io/api/v2/content/${model}?apiKey=${apiKey}&limit=${limit}&noTraverse=${noTraverse}&includeRefs=${includeRefs}`);
2342
+ const queryOptions = {
2343
+ ...getBuilderSearchParamsFromWindow(),
2344
+ ...normalizeSearchParams(options.options || {})
2345
+ };
2346
+ const flattened = flatten(queryOptions);
2347
+ for(const key in flattened)url.searchParams.set(key, String(flattened[key]));
2348
+ if (userAttributes) url.searchParams.set('userAttributes', JSON.stringify(userAttributes));
2349
+ if (query) {
2350
+ const flattened1 = flatten({
2351
+ query
2352
+ });
2353
+ for(const key1 in flattened1)url.searchParams.set(key1, JSON.stringify(flattened1[key1]));
2354
+ }
2355
+ return url;
2356
+ };
2357
+ async function getAllContent(options) {
2358
+ const url = generateContentUrl(options);
2359
+ const fetch = await getFetch();
2360
+ const content = await fetch(url.href).then((res)=>res.json());
2361
+ const canTrack = options.canTrack !== false;
2362
+ if (canTrack) for (const item of content.results)await handleABTesting({
2363
+ item,
2364
+ canTrack
2365
+ });
2366
+ return content;
2367
+ }
2368
+
2369
+ function isPreviewing() {
2370
+ if (!isBrowser()) return false;
2371
+ if (isEditing()) return false;
2372
+ return Boolean(location.search.indexOf('builder.preview=') !== -1);
2373
+ }
2374
+
2375
+ /**
2376
+ * @deprecated. Use the `customComponents` prop in RenderContent instead to provide your custom components to the builder SDK.
2377
+ */ const components = [];
2378
+ /**
2379
+ * @deprecated. Use the `customComponents` prop in RenderContent instead to provide your custom components to the builder SDK.
2380
+ */ function registerComponent(component, info) {
2381
+ components.push({
2382
+ component,
2383
+ ...info
2384
+ });
2385
+ console.warn('registerComponent is deprecated. Use the `customComponents` prop in RenderContent instead to provide your custom components to the builder SDK.');
2386
+ return component;
2387
+ }
2388
+ const createRegisterComponentMessage = ({ component: _ , ...info })=>({
2389
+ type: 'builder.registerComponent',
2390
+ data: prepareComponentInfoToSend(info)
2391
+ });
2392
+ const serializeValue = (value)=>typeof value === 'function' ? serializeFn(value) : fastClone(value);
2393
+ const prepareComponentInfoToSend = ({ inputs , ...info })=>({
2394
+ ...fastClone(info),
2395
+ inputs: inputs?.map((input)=>Object.entries(input).reduce((acc, [key, value])=>({
2396
+ ...acc,
2397
+ [key]: serializeValue(value)
2398
+ }), {}))
2399
+ });
2400
+
2401
+ /**
2402
+ * @credit https://stackoverflow.com/a/2117523
2403
+ */ function uuidv4() {
2404
+ return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
2405
+ const r = Math.random() * 16 | 0, v = c == 'x' ? r : r & 0x3 | 0x8;
2406
+ return v.toString(16);
2407
+ });
2408
+ }
2409
+ /**
2410
+ * Slightly cleaner and smaller UUIDs
2411
+ */ function uuid() {
2412
+ return uuidv4().replace(/-/g, '');
2413
+ }
2414
+
2415
+ const SESSION_LOCAL_STORAGE_KEY = 'builderSessionId';
2416
+ const getSessionId = async ({ canTrack })=>{
2417
+ if (!canTrack) return undefined;
2418
+ const sessionId = await getCookie({
2419
+ name: SESSION_LOCAL_STORAGE_KEY,
2420
+ canTrack
2421
+ });
2422
+ if (checkIsDefined(sessionId)) return sessionId;
2423
+ else {
2424
+ const newSessionId = createSessionId();
2425
+ setSessionId({
2426
+ id: newSessionId,
2427
+ canTrack
2428
+ });
2429
+ }
2430
+ };
2431
+ const createSessionId = ()=>uuid();
2432
+ const setSessionId = ({ id , canTrack })=>setCookie({
2433
+ name: SESSION_LOCAL_STORAGE_KEY,
2434
+ value: id,
2435
+ canTrack
2436
+ });
2437
+
2438
+ const getLocalStorage = ()=>isBrowser() && typeof localStorage !== 'undefined' ? localStorage : undefined;
2439
+ const getLocalStorageItem = ({ key , canTrack })=>{
2440
+ try {
2441
+ if (canTrack) return getLocalStorage()?.getItem(key);
2442
+ return undefined;
2443
+ } catch (err) {
2444
+ console.debug('[LocalStorage] GET error: ', err);
2445
+ }
2446
+ };
2447
+ const setLocalStorageItem = ({ key , canTrack , value })=>{
2448
+ try {
2449
+ if (canTrack) getLocalStorage()?.setItem(key, value);
2450
+ } catch (err) {
2451
+ console.debug('[LocalStorage] SET error: ', err);
2452
+ }
2453
+ };
2454
+
2455
+ const VISITOR_LOCAL_STORAGE_KEY = 'builderVisitorId';
2456
+ const getVisitorId = ({ canTrack })=>{
2457
+ if (!canTrack) return undefined;
2458
+ const visitorId = getLocalStorageItem({
2459
+ key: VISITOR_LOCAL_STORAGE_KEY,
2460
+ canTrack
2461
+ });
2462
+ if (checkIsDefined(visitorId)) return visitorId;
2463
+ else {
2464
+ const newVisitorId = createVisitorId();
2465
+ setVisitorId({
2466
+ id: newVisitorId,
2467
+ canTrack
2468
+ });
2469
+ }
2470
+ };
2471
+ const createVisitorId = ()=>uuid();
2472
+ const setVisitorId = ({ id , canTrack })=>setLocalStorageItem({
2473
+ key: VISITOR_LOCAL_STORAGE_KEY,
2474
+ value: id,
2475
+ canTrack
2476
+ });
2477
+
2478
+ const getTrackingEventData = async ({ canTrack })=>{
2479
+ if (!canTrack) return {
2480
+ visitorId: undefined,
2481
+ sessionId: undefined
2482
+ };
2483
+ const sessionId = await getSessionId({
2484
+ canTrack
2485
+ });
2486
+ const visitorId = getVisitorId({
2487
+ canTrack
2488
+ });
2489
+ return {
2490
+ sessionId,
2491
+ visitorId
2492
+ };
2493
+ };
2494
+ const createEvent = async ({ type: eventType , canTrack , apiKey , metadata , ...properties })=>({
2495
+ type: eventType,
2496
+ data: {
2497
+ ...properties,
2498
+ metadata: JSON.stringify(metadata),
2499
+ ...await getTrackingEventData({
2500
+ canTrack
2501
+ }),
2502
+ ownerId: apiKey
2503
+ }
2504
+ });
2505
+ async function _track(eventProps) {
2506
+ if (!eventProps.canTrack) return;
2507
+ if (isEditing()) return;
2508
+ if (!(isBrowser() || TARGET === 'reactNative')) return;
2509
+ return fetch(`https://builder.io/api/v1/track`, {
2510
+ method: 'POST',
2511
+ body: JSON.stringify({
2512
+ events: [
2513
+ await createEvent(eventProps)
2514
+ ]
2515
+ }),
2516
+ headers: {
2517
+ 'content-type': 'application/json'
2518
+ },
2519
+ mode: 'cors'
2520
+ }).catch((err)=>{
2521
+ console.error('Failed to track: ', err);
2522
+ });
2523
+ }
2524
+ const track = (args)=>_track({
2525
+ ...args,
2526
+ canTrack: true
2527
+ });
2528
+
2529
+ // GENERATED BY MITOSIS
2530
+ const getCssFromFont = function getCssFromFont(props, state, font) {
2531
+ // TODO: compute what font sizes are used and only load those.......
2532
+ const family = font.family + (font.kind && !font.kind.includes("#") ? ", " + font.kind : "");
2533
+ const name = family.split(",")[0];
2534
+ const url = font.fileUrl ?? font?.files?.regular;
2535
+ let str = "";
2536
+ if (url && family && name) str += `
2537
+ @font-face {
2538
+ font-family: "${family}";
2539
+ src: local("${name}"), url('${url}') format('woff2');
2540
+ font-display: fallback;
2541
+ font-weight: 400;
2542
+ }
2543
+ `.trim();
2544
+ if (font.files) for(const weight in font.files){
2545
+ const isNumber = String(Number(weight)) === weight;
2546
+ if (!isNumber) continue;
2547
+ // TODO: maybe limit number loaded
2548
+ const weightUrl = font.files[weight];
2549
+ if (weightUrl && weightUrl !== url) str += `
2550
+ @font-face {
2551
+ font-family: "${family}";
2552
+ src: url('${weightUrl}') format('woff2');
2553
+ font-display: fallback;
2554
+ font-weight: ${weight};
2555
+ }
2556
+ `.trim();
2557
+ }
2558
+ return str;
2559
+ };
2560
+ const getFontCss = function getFontCss(props, state, { customFonts }) {
2561
+ // TODO: flag for this
2562
+ // if (!this.builder.allowCustomFonts) {
2563
+ // return '';
2564
+ // }
2565
+ // TODO: separate internal data from external
2566
+ return customFonts?.map((font)=>getCssFromFont(props, state, font))?.join(" ") || "";
2567
+ };
2568
+ const injectedStyles = function injectedStyles(props, state) {
2569
+ return `
2570
+ ${props.cssCode || ""}
2571
+ ${getFontCss(props, state, {
2572
+ customFonts: props.customFonts
2573
+ })}`;
2574
+ };
2575
+ const RenderContentStyles = /*#__PURE__*/ qwik.componentQrl(qwik.inlinedQrl((props)=>{
2576
+ const state = {};
2577
+ return /*#__PURE__*/ jsxRuntime.jsx(RenderInlinedStyles$1, {
2578
+ styles: injectedStyles(props, state)
2579
+ });
2580
+ }, "RenderContentStyles_component_Og0xL34Zbvc"));
2581
+ const RenderContentStyles$1 = RenderContentStyles;
2582
+
2583
+ // GENERATED BY MITOSIS
2584
+ const useContent = function useContent(props, state, elementRef) {
2585
+ if (!props.content && !state.overrideContent) return undefined;
2586
+ const mergedContent = {
2587
+ ...props.content,
2588
+ ...state.overrideContent,
2589
+ data: {
2590
+ ...props.content?.data,
2591
+ ...props.data,
2592
+ ...state.overrideContent?.data
2593
+ }
2594
+ };
2595
+ return mergedContent;
2596
+ };
2597
+ const canTrackToUse = function canTrackToUse(props, state, elementRef) {
2598
+ return props.canTrack || true;
2599
+ };
2600
+ const contentState = function contentState(props, state, elementRef) {
2601
+ return {
2602
+ ...props.content?.data?.state,
2603
+ ...props.data,
2604
+ ...state.overrideState
2605
+ };
2606
+ };
2607
+ const contextContext = function contextContext(props, state, elementRef) {
2608
+ return props.context || {};
2609
+ };
2610
+ const allRegisteredComponents = function allRegisteredComponents(props, state, elementRef) {
2611
+ const allComponentsArray = [
2612
+ ...getDefaultRegisteredComponents(),
2613
+ // While this `components` object is deprecated, we must maintain support for it.
2614
+ // Since users are able to override our default components, we need to make sure that we do not break such
2615
+ // existing usage.
2616
+ // This is why we spread `components` after the default Builder.io components, but before the `props.customComponents`,
2617
+ // which is the new standard way of providing custom components, and must therefore take precedence.
2618
+ ...components,
2619
+ ...props.customComponents || []
2620
+ ];
2621
+ const allComponents = allComponentsArray.reduce((acc, curr)=>({
2622
+ ...acc,
2623
+ [curr.name]: curr
2624
+ }), {});
2625
+ return allComponents;
2626
+ };
2627
+ const processMessage = function processMessage(props, state, elementRef, event) {
2628
+ const { data } = event;
2629
+ if (data) switch(data.type){
2630
+ case "builder.contentUpdate":
2631
+ {
2632
+ const messageContent = data.data;
2633
+ const key = messageContent.key || messageContent.alias || messageContent.entry || messageContent.modelName;
2634
+ const contentData = messageContent.data;
2635
+ if (key === props.model) {
2636
+ state.overrideContent = contentData;
2637
+ state.forceReRenderCount = state.forceReRenderCount + 1; // This is a hack to force Qwik to re-render.
2638
+ }
2639
+ break;
2640
+ }
2641
+ }
2642
+ };
2643
+ const evaluateJsCode = function evaluateJsCode(props, state, elementRef) {
2644
+ // run any dynamic JS code attached to content
2645
+ const jsCode = useContent(props, state)?.data?.jsCode;
2646
+ if (jsCode) evaluate({
2647
+ code: jsCode,
2648
+ context: contextContext(props),
2649
+ state: contentState(props, state)
2650
+ });
2651
+ };
2652
+ const httpReqsData = function httpReqsData(props, state, elementRef) {
2653
+ return {};
2654
+ };
2655
+ const onClick = function onClick(props, state, elementRef, _event) {
2656
+ if (useContent(props, state)) {
2657
+ const variationId = useContent(props, state)?.testVariationId;
2658
+ const contentId = useContent(props, state)?.id;
2659
+ _track({
2660
+ type: "click",
2661
+ canTrack: canTrackToUse(props),
2662
+ contentId,
2663
+ apiKey: props.apiKey,
2664
+ variationId: variationId !== contentId ? variationId : undefined
2665
+ });
2666
+ }
2667
+ };
2668
+ const evalExpression = function evalExpression(props, state, elementRef, expression) {
2669
+ return expression.replace(/{{([^}]+)}}/g, (_match, group)=>evaluate({
2670
+ code: group,
2671
+ context: contextContext(props),
2672
+ state: contentState(props, state)
2673
+ }));
2674
+ };
2675
+ const handleRequest = function handleRequest(props, state, elementRef, { url , key }) {
2676
+ getFetch().then((fetch)=>fetch(url)).then((response)=>response.json()).then((json)=>{
2677
+ const newOverrideState = {
2678
+ ...state.overrideState,
2679
+ [key]: json
2680
+ };
2681
+ state.overrideState = newOverrideState;
2682
+ }).catch((err)=>{
2683
+ console.log("error fetching dynamic data", url, err);
2684
+ });
2685
+ };
2686
+ const runHttpRequests = function runHttpRequests(props, state, elementRef) {
2687
+ const requests = useContent(props, state)?.data?.httpRequests ?? {};
2688
+ Object.entries(requests).forEach(([key, url])=>{
2689
+ if (url && (!httpReqsData()[key] || isEditing())) {
2690
+ const evaluatedUrl = evalExpression(props, state, elementRef, url);
2691
+ handleRequest(props, state, elementRef, {
2692
+ url: evaluatedUrl,
2693
+ key
2694
+ });
2695
+ }
2696
+ });
2697
+ };
2698
+ const emitStateUpdate = function emitStateUpdate(props, state, elementRef) {
2699
+ if (isEditing()) window.dispatchEvent(new CustomEvent("builder:component:stateChange", {
2700
+ detail: {
2701
+ state: contentState(props, state),
2702
+ ref: {
2703
+ name: props.model
2704
+ }
2705
+ }
2706
+ }));
2707
+ };
2708
+ const shouldRenderContentStyles = function shouldRenderContentStyles(props, state, elementRef) {
2709
+ return Boolean((useContent(props, state)?.data?.cssCode || useContent(props, state)?.data?.customFonts?.length) && TARGET !== "reactNative");
2710
+ };
2711
+ const RenderContent = /*#__PURE__*/ qwik.componentQrl(qwik.inlinedQrl((props)=>{
2712
+ const elementRef = qwik.useRef();
2713
+ const state = qwik.useStore({
2714
+ forceReRenderCount: 0,
2715
+ overrideContent: null,
2716
+ overrideState: {},
2717
+ update: 0
2718
+ });
2719
+ qwik.useContextProvider(BuilderContext, qwik.useStore({
2720
+ content: (()=>{
2721
+ return useContent(props, state);
2722
+ })(),
2723
+ state: (()=>{
2724
+ return contentState(props, state);
2725
+ })(),
2726
+ context: (()=>{
2727
+ return contextContext(props);
2728
+ })(),
2729
+ apiKey: (()=>{
2730
+ return props.apiKey;
2731
+ })(),
2732
+ registeredComponents: (()=>{
2733
+ return allRegisteredComponents(props);
2734
+ })()
2735
+ }));
2736
+ qwik.useClientEffectQrl(qwik.inlinedQrl(()=>{
2737
+ const [elementRef, props, state] = qwik.useLexicalScope();
2738
+ if (isBrowser()) {
2739
+ if (isEditing()) {
2740
+ state.forceReRenderCount = state.forceReRenderCount + 1;
2741
+ registerInsertMenu();
2742
+ setupBrowserForEditing();
2743
+ Object.values(allRegisteredComponents(props)).forEach((registeredComponent)=>{
2744
+ const message = createRegisterComponentMessage(registeredComponent);
2745
+ window.parent?.postMessage(message, "*");
2746
+ });
2747
+ window.addEventListener("message", processMessage.bind(null, props, state, elementRef));
2748
+ window.addEventListener("builder:component:stateChangeListenerActivated", emitStateUpdate.bind(null, props, state, elementRef));
2749
+ }
2750
+ if (useContent(props, state)) {
2751
+ const variationId = useContent(props, state)?.testVariationId;
2752
+ const contentId = useContent(props, state)?.id;
2753
+ _track({
2754
+ type: "impression",
2755
+ canTrack: canTrackToUse(props),
2756
+ contentId,
2757
+ apiKey: props.apiKey,
2758
+ variationId: variationId !== contentId ? variationId : undefined
2759
+ });
2760
+ }
2761
+ // override normal content in preview mode
2762
+ if (isPreviewing()) {
2763
+ const searchParams = new URL(location.href).searchParams;
2764
+ if (props.model && searchParams.get("builder.preview") === props.model) {
2765
+ const previewApiKey = searchParams.get("apiKey") || searchParams.get("builder.space");
2766
+ if (previewApiKey) getContent({
2767
+ model: props.model,
2768
+ apiKey: previewApiKey
2769
+ }).then((content)=>{
2770
+ if (content) state.overrideContent = content;
2771
+ });
2772
+ }
2773
+ }
2774
+ evaluateJsCode(props, state);
2775
+ runHttpRequests(props, state, elementRef);
2776
+ emitStateUpdate(props, state);
2777
+ }
2778
+ }, "RenderContent_component_useClientEffect_cA0sVHIkr5g", [
2779
+ elementRef,
2780
+ props,
2781
+ state
2782
+ ]));
2783
+ qwik.useWatchQrl(qwik.inlinedQrl(({ track })=>{
2784
+ const [elementRef, props, state] = qwik.useLexicalScope();
2785
+ state.useContent?.data && track(state.useContent?.data, "jsCode");
2786
+ evaluateJsCode(props, state);
2787
+ }, "RenderContent_component_useWatch_OIBatobA0hE", [
2788
+ elementRef,
2789
+ props,
2790
+ state
2791
+ ]));
2792
+ qwik.useWatchQrl(qwik.inlinedQrl(({ track })=>{
2793
+ const [elementRef, props, state] = qwik.useLexicalScope();
2794
+ state.useContent?.data && track(state.useContent?.data, "httpRequests");
2795
+ runHttpRequests(props, state, elementRef);
2796
+ }, "RenderContent_component_useWatch_1_LQM67VNl14k", [
2797
+ elementRef,
2798
+ props,
2799
+ state
2800
+ ]));
2801
+ qwik.useWatchQrl(qwik.inlinedQrl(({ track })=>{
2802
+ const [elementRef, props, state] = qwik.useLexicalScope();
2803
+ state && track(state, "contentState");
2804
+ emitStateUpdate(props, state);
2805
+ }, "RenderContent_component_useWatch_2_aGi0RpYNBO0", [
2806
+ elementRef,
2807
+ props,
2808
+ state
2809
+ ]));
2810
+ qwik.useCleanupQrl(qwik.inlinedQrl(()=>{
2811
+ const [elementRef, props, state] = qwik.useLexicalScope();
2812
+ if (isBrowser()) {
2813
+ window.removeEventListener("message", processMessage.bind(null, props, state, elementRef));
2814
+ window.removeEventListener("builder:component:stateChangeListenerActivated", emitStateUpdate.bind(null, props, state, elementRef));
2815
+ }
2816
+ }, "RenderContent_component_useCleanup_FwcO310HVAI", [
2817
+ elementRef,
2818
+ props,
2819
+ state
2820
+ ]));
2821
+ return /*#__PURE__*/ jsxRuntime.jsx(jsxRuntime.Fragment, {
2822
+ children: useContent(props, state) ? /*#__PURE__*/ jsxRuntime.jsxs("div", {
2823
+ ref: elementRef,
2824
+ onClick$: qwik.inlinedQrl((event)=>{
2825
+ const [elementRef, props, state] = qwik.useLexicalScope();
2826
+ return onClick(props, state);
2827
+ }, "RenderContent_component__Fragment_div_onClick_wLg5o3ZkpC0", [
2828
+ elementRef,
2829
+ props,
2830
+ state
2831
+ ]),
2832
+ "builder-content-id": useContent(props, state)?.id,
2833
+ get "builder-model" () {
2834
+ return props.model;
2835
+ },
2836
+ children: [
2837
+ shouldRenderContentStyles(props, state) ? /*#__PURE__*/ jsxRuntime.jsx(RenderContentStyles$1, {
2838
+ cssCode: useContent(props, state)?.data?.cssCode,
2839
+ customFonts: useContent(props, state)?.data?.customFonts
2840
+ }) : null,
2841
+ /*#__PURE__*/ jsxRuntime.jsx(RenderBlocks$1, {
2842
+ blocks: useContent(props, state)?.data?.blocks
2843
+ }, state.forceReRenderCount)
2844
+ ],
2845
+ [qwik._IMMUTABLE]: {
2846
+ "builder-model": qwik._wrapSignal(props, "model")
2847
+ }
2848
+ }) : null
2849
+ });
2850
+ }, "RenderContent_component_hEAI0ahViXM"));
2851
+ const RenderContent$1 = RenderContent;
2852
+
2853
+ // GENERATED BY MITOSIS
2854
+ const contentToUse = function contentToUse(props, state, builderContext) {
2855
+ return props.symbol?.content || state.fetchedContent;
2856
+ };
2857
+ const Symbol$1 = /*#__PURE__*/ qwik.componentQrl(qwik.inlinedQrl((props)=>{
2858
+ const builderContext = qwik.useContext(BuilderContext);
2859
+ const state = qwik.useStore({
2860
+ className: "builder-symbol",
2861
+ fetchedContent: null
2862
+ });
2863
+ qwik.useWatchQrl(qwik.inlinedQrl(({ track })=>{
2864
+ const [builderContext, props, state] = qwik.useLexicalScope();
2865
+ props && track(props, "symbol");
2866
+ state && track(state, "fetchedContent");
2867
+ const symbolToUse = props.symbol;
2868
+ /**
2869
+ * If:
2870
+ * - we have a symbol prop
2871
+ * - yet it does not have any content
2872
+ * - and we have not already stored content from before
2873
+ * - and it has a model name
2874
+ *
2875
+ * then we want to re-fetch the symbol content.
2876
+ */ if (symbolToUse && !symbolToUse.content && !state.fetchedContent && symbolToUse.model) getContent({
2877
+ model: symbolToUse.model,
2878
+ apiKey: builderContext.apiKey,
2879
+ query: {
2880
+ id: symbolToUse.entry
2881
+ }
2882
+ }).then((response)=>{
2883
+ state.fetchedContent = response;
2884
+ });
2885
+ }, "Symbol_component_useWatch_9HNT04zd0Dk", [
2886
+ builderContext,
2887
+ props,
2888
+ state
2889
+ ]));
2890
+ return /*#__PURE__*/ jsxRuntime.jsx("div", {
2891
+ ...props.attributes,
2892
+ get class () {
2893
+ return state.className;
2894
+ },
2895
+ children: /*#__PURE__*/ jsxRuntime.jsx(RenderContent$1, {
2896
+ get apiKey () {
2897
+ return builderContext.apiKey;
2898
+ },
2899
+ get context () {
2900
+ return builderContext.context;
2901
+ },
2902
+ customComponents: Object.values(builderContext.registeredComponents),
2903
+ data: {
2904
+ ...props.symbol?.data,
2905
+ ...builderContext.state,
2906
+ ...props.symbol?.content?.data?.state
2907
+ },
2908
+ model: props.symbol?.model,
2909
+ content: contentToUse(props, state),
2910
+ [qwik._IMMUTABLE]: {
2911
+ apiKey: qwik._wrapSignal(builderContext, "apiKey"),
2912
+ context: qwik._wrapSignal(builderContext, "context")
2913
+ }
2914
+ }),
2915
+ [qwik._IMMUTABLE]: {
2916
+ class: qwik._wrapSignal(state, "className")
2917
+ }
2918
+ });
2919
+ }, "Symbol_component_WVvggdkUPdk"));
2920
+ const Symbol$2 = Symbol$1;
2921
+
2922
+ const settings = {};
2923
+ function setEditorSettings(newSettings) {
2924
+ if (isBrowser()) {
2925
+ Object.assign(settings, newSettings);
2926
+ const message = {
2927
+ type: 'builder.settingsChange',
2928
+ data: settings
2929
+ };
2930
+ parent.postMessage(message, '*');
2931
+ }
2932
+ }
2933
+
2934
+ exports.Button = Button$1;
2935
+ exports.Columns = Columns$1;
2936
+ exports.Fragment = Fragment;
2937
+ exports.Image = Image$1;
2938
+ exports.RenderBlocks = RenderBlocks$1;
2939
+ exports.RenderContent = RenderContent$1;
2940
+ exports.Section = Section;
2941
+ exports.Symbol = Symbol$2;
2942
+ exports.Text = Text$1;
2943
+ exports.Video = Video$1;
2944
+ exports.components = components;
2945
+ exports.convertSearchParamsToQueryObject = convertSearchParamsToQueryObject;
2946
+ exports.createRegisterComponentMessage = createRegisterComponentMessage;
2947
+ exports.generateContentUrl = generateContentUrl;
2948
+ exports.getAllContent = getAllContent;
2949
+ exports.getBuilderSearchParams = getBuilderSearchParams;
2950
+ exports.getBuilderSearchParamsFromWindow = getBuilderSearchParamsFromWindow;
2951
+ exports.getContent = getContent;
2952
+ exports.isEditing = isEditing;
2953
+ exports.isPreviewing = isPreviewing;
2954
+ exports.normalizeSearchParams = normalizeSearchParams;
2955
+ exports.register = register;
2956
+ exports.registerComponent = registerComponent;
2957
+ exports.setEditorSettings = setEditorSettings;
2958
+ exports.track = track;