@builder.io/sdk-qwik 0.1.4 → 0.1.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/index.qwik.cjs +937 -870
- package/lib/index.qwik.mjs +938 -871
- package/package.json +1 -1
- package/types/components/render-block/render-block.d.ts +3 -0
- package/types/components/render-block/render-component.d.ts +8 -1
- package/types/components/render-content/components/render-styles.d.ts +2 -13
- package/types/components/render-content/components/render-styles.helpers.d.ts +15 -0
- package/types/components/render-content/render-content.d.ts +6 -18
- package/types/components/render-content/render-content.helpers.d.ts +7 -0
- package/types/components/render-content/render-content.types.d.ts +27 -0
- package/types/context/types.d.ts +1 -0
- package/types/index-helpers/blocks-exports.d.ts +6 -6
- package/types/types/builder-content.d.ts +1 -2
- package/types/types/input.d.ts +117 -0
package/lib/index.qwik.cjs
CHANGED
|
@@ -132,7 +132,35 @@ const setupBrowserForEditing = (options = {}) => {
|
|
|
132
132
|
});
|
|
133
133
|
}
|
|
134
134
|
};
|
|
135
|
-
const
|
|
135
|
+
const Button = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
136
|
+
qwik.useStylesScopedQrl(qwik.inlinedQrl(STYLES$3, "Button_component_useStylesScoped_a1JZ0Q0Q2Oc"));
|
|
137
|
+
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {
|
|
138
|
+
children: props.link ? /* @__PURE__ */ jsxRuntime.jsx("a", {
|
|
139
|
+
role: "button",
|
|
140
|
+
...props.attributes,
|
|
141
|
+
get href() {
|
|
142
|
+
return props.link;
|
|
143
|
+
},
|
|
144
|
+
target: props.openLinkInNewTab ? "_blank" : void 0,
|
|
145
|
+
children: qwik._wrapSignal(props, "text"),
|
|
146
|
+
[qwik._IMMUTABLE]: {
|
|
147
|
+
href: qwik._wrapSignal(props, "link")
|
|
148
|
+
}
|
|
149
|
+
}) : /* @__PURE__ */ jsxRuntime.jsx("button", {
|
|
150
|
+
class: "button-Button",
|
|
151
|
+
...props.attributes,
|
|
152
|
+
children: qwik._wrapSignal(props, "text")
|
|
153
|
+
}),
|
|
154
|
+
[qwik._IMMUTABLE]: {
|
|
155
|
+
children: false
|
|
156
|
+
}
|
|
157
|
+
}, "jc_0");
|
|
158
|
+
}, "Button_component_gJoMUICXoUQ"));
|
|
159
|
+
const STYLES$3 = `
|
|
160
|
+
.button-Button {
|
|
161
|
+
all: unset;
|
|
162
|
+
}`;
|
|
163
|
+
const builderContext = qwik.createContext("Builder");
|
|
136
164
|
function isIframe() {
|
|
137
165
|
return isBrowser() && window.self !== window.top;
|
|
138
166
|
}
|
|
@@ -506,7 +534,7 @@ const RenderComponent = (props) => {
|
|
|
506
534
|
}, "R9_0");
|
|
507
535
|
};
|
|
508
536
|
const RenderRepeatedBlock = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
509
|
-
qwik.useContextProvider(
|
|
537
|
+
qwik.useContextProvider(builderContext, qwik.useStore({
|
|
510
538
|
content: props.repeatContext.content,
|
|
511
539
|
state: props.repeatContext.state,
|
|
512
540
|
context: props.repeatContext.context,
|
|
@@ -544,10 +572,24 @@ const useBlock = function useBlock22(props, state) {
|
|
|
544
572
|
shouldEvaluateBindings: true
|
|
545
573
|
});
|
|
546
574
|
};
|
|
575
|
+
const proxyState = function proxyState2(props, state) {
|
|
576
|
+
if (typeof Proxy === "undefined") {
|
|
577
|
+
console.error("no Proxy available in this environment, cannot proxy state.");
|
|
578
|
+
return props.context.state;
|
|
579
|
+
}
|
|
580
|
+
const useState = new Proxy(props.context.state, {
|
|
581
|
+
set: (obj, prop, value) => {
|
|
582
|
+
obj[prop] = value;
|
|
583
|
+
props.context.setState?.(obj);
|
|
584
|
+
return true;
|
|
585
|
+
}
|
|
586
|
+
});
|
|
587
|
+
return useState;
|
|
588
|
+
};
|
|
547
589
|
const actions = function actions2(props, state) {
|
|
548
590
|
return getBlockActions({
|
|
549
591
|
block: useBlock(props),
|
|
550
|
-
state: props
|
|
592
|
+
state: proxyState(props),
|
|
551
593
|
context: props.context.context
|
|
552
594
|
});
|
|
553
595
|
};
|
|
@@ -594,6 +636,7 @@ const childrenContext = function childrenContext2(props, state) {
|
|
|
594
636
|
state: props.context.state,
|
|
595
637
|
content: props.context.content,
|
|
596
638
|
context: props.context.context,
|
|
639
|
+
setState: props.context.setState,
|
|
597
640
|
registeredComponents: props.context.registeredComponents,
|
|
598
641
|
inheritedStyles: getInheritedTextStyles()
|
|
599
642
|
};
|
|
@@ -656,10 +699,10 @@ const RenderBlock = (props) => {
|
|
|
656
699
|
}, "9d_3");
|
|
657
700
|
};
|
|
658
701
|
const RenderBlock$1 = RenderBlock;
|
|
659
|
-
const className$1 = function className2(props, state,
|
|
702
|
+
const className$1 = function className2(props, state, builderContext2) {
|
|
660
703
|
return "builder-blocks" + (!props.blocks?.length ? " no-blocks" : "");
|
|
661
704
|
};
|
|
662
|
-
const onClick$1 = function onClick2(props, state,
|
|
705
|
+
const onClick$1 = function onClick2(props, state, builderContext2) {
|
|
663
706
|
if (isEditing() && !props.blocks?.length)
|
|
664
707
|
window.parent?.postMessage({
|
|
665
708
|
type: "builder.clickEmptyBlocks",
|
|
@@ -669,7 +712,7 @@ const onClick$1 = function onClick2(props, state, builderContext) {
|
|
|
669
712
|
}
|
|
670
713
|
}, "*");
|
|
671
714
|
};
|
|
672
|
-
const onMouseEnter = function onMouseEnter2(props, state,
|
|
715
|
+
const onMouseEnter = function onMouseEnter2(props, state, builderContext2) {
|
|
673
716
|
if (isEditing() && !props.blocks?.length)
|
|
674
717
|
window.parent?.postMessage({
|
|
675
718
|
type: "builder.hoverEmptyBlocks",
|
|
@@ -680,8 +723,8 @@ const onMouseEnter = function onMouseEnter2(props, state, builderContext) {
|
|
|
680
723
|
}, "*");
|
|
681
724
|
};
|
|
682
725
|
const RenderBlocks = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
683
|
-
qwik.useStylesScopedQrl(qwik.inlinedQrl(STYLES$
|
|
684
|
-
const builderContext = qwik.useContext(
|
|
726
|
+
qwik.useStylesScopedQrl(qwik.inlinedQrl(STYLES$2, "RenderBlocks_component_useStylesScoped_0XKYzaR059E"));
|
|
727
|
+
const builderContext$1 = qwik.useContext(builderContext);
|
|
685
728
|
const state = {};
|
|
686
729
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", {
|
|
687
730
|
class: className$1(props) + " div-RenderBlocks",
|
|
@@ -698,7 +741,7 @@ const RenderBlocks = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) =
|
|
|
698
741
|
const [builderContext2, props2, state2] = qwik.useLexicalScope();
|
|
699
742
|
return onClick$1(props2);
|
|
700
743
|
}, "RenderBlocks_component_div_onClick_RzhhZa265Yg", [
|
|
701
|
-
builderContext,
|
|
744
|
+
builderContext$1,
|
|
702
745
|
props,
|
|
703
746
|
state
|
|
704
747
|
]),
|
|
@@ -706,7 +749,7 @@ const RenderBlocks = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) =
|
|
|
706
749
|
const [builderContext2, props2, state2] = qwik.useLexicalScope();
|
|
707
750
|
return onMouseEnter(props2);
|
|
708
751
|
}, "RenderBlocks_component_div_onMouseEnter_nG7I7RYG3JQ", [
|
|
709
|
-
builderContext,
|
|
752
|
+
builderContext$1,
|
|
710
753
|
props,
|
|
711
754
|
state
|
|
712
755
|
]),
|
|
@@ -714,13 +757,13 @@ const RenderBlocks = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) =
|
|
|
714
757
|
props.blocks ? (props.blocks || []).map(function(block) {
|
|
715
758
|
return /* @__PURE__ */ jsxRuntime.jsx(RenderBlock$1, {
|
|
716
759
|
block,
|
|
717
|
-
context: builderContext
|
|
760
|
+
context: builderContext$1
|
|
718
761
|
}, "render-block-" + block.id);
|
|
719
762
|
}) : null,
|
|
720
763
|
props.blocks ? (props.blocks || []).map(function(block) {
|
|
721
764
|
return /* @__PURE__ */ jsxRuntime.jsx(BlockStyles, {
|
|
722
765
|
block,
|
|
723
|
-
context: builderContext
|
|
766
|
+
context: builderContext$1
|
|
724
767
|
}, "block-style-" + block.id);
|
|
725
768
|
}) : null
|
|
726
769
|
],
|
|
@@ -732,7 +775,7 @@ const RenderBlocks = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) =
|
|
|
732
775
|
}
|
|
733
776
|
});
|
|
734
777
|
}, "RenderBlocks_component_MYUZ0j1uLsw"));
|
|
735
|
-
const STYLES$
|
|
778
|
+
const STYLES$2 = `
|
|
736
779
|
.div-RenderBlocks {
|
|
737
780
|
display: flex;
|
|
738
781
|
flex-direction: column;
|
|
@@ -827,7 +870,7 @@ const columnsStyles = function columnsStyles2(props, state) {
|
|
|
827
870
|
`;
|
|
828
871
|
};
|
|
829
872
|
const Columns = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
830
|
-
qwik.useStylesScopedQrl(qwik.inlinedQrl(STYLES$
|
|
873
|
+
qwik.useStylesScopedQrl(qwik.inlinedQrl(STYLES$1, "Columns_component_useStylesScoped_s7JLZz7MCCQ"));
|
|
831
874
|
const state = {};
|
|
832
875
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", {
|
|
833
876
|
class: `builder-columns ${props.builderBlock.id}-breakpoints div-Columns`,
|
|
@@ -872,7 +915,7 @@ const Columns = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
|
872
915
|
}
|
|
873
916
|
});
|
|
874
917
|
}, "Columns_component_7yLj4bxdI6c"));
|
|
875
|
-
const STYLES$
|
|
918
|
+
const STYLES$1 = `
|
|
876
919
|
.div-Columns {
|
|
877
920
|
display: flex;
|
|
878
921
|
line-height: normal;
|
|
@@ -881,6 +924,11 @@ const STYLES$2 = `
|
|
|
881
924
|
flex-direction: column;
|
|
882
925
|
align-items: stretch;
|
|
883
926
|
}`;
|
|
927
|
+
const FragmentComponent = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
928
|
+
return /* @__PURE__ */ jsxRuntime.jsx("span", {
|
|
929
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {}, "oj_0")
|
|
930
|
+
});
|
|
931
|
+
}, "FragmentComponent_component_T0AypnadAK0"));
|
|
884
932
|
function removeProtocol(path) {
|
|
885
933
|
return path.replace(/http(s)?:/, "");
|
|
886
934
|
}
|
|
@@ -967,7 +1015,7 @@ const aspectRatioCss = function aspectRatioCss2(props, state) {
|
|
|
967
1015
|
return out;
|
|
968
1016
|
};
|
|
969
1017
|
const Image = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
970
|
-
qwik.useStylesScopedQrl(qwik.inlinedQrl(STYLES
|
|
1018
|
+
qwik.useStylesScopedQrl(qwik.inlinedQrl(STYLES, "Image_component_useStylesScoped_fBMYiVf9fuU"));
|
|
971
1019
|
return /* @__PURE__ */ jsxRuntime.jsxs(qwik.Fragment, {
|
|
972
1020
|
children: [
|
|
973
1021
|
/* @__PURE__ */ jsxRuntime.jsxs("picture", {
|
|
@@ -1023,7 +1071,7 @@ const Image = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
|
1023
1071
|
}
|
|
1024
1072
|
}, "0A_2");
|
|
1025
1073
|
}, "Image_component_LRxDkFa1EfU"));
|
|
1026
|
-
const STYLES
|
|
1074
|
+
const STYLES = `
|
|
1027
1075
|
.img-Image {
|
|
1028
1076
|
opacity: 1;
|
|
1029
1077
|
transition: opacity 0.2s ease-in-out;
|
|
@@ -1041,90 +1089,6 @@ const STYLES$1 = `
|
|
|
1041
1089
|
width: 100%;
|
|
1042
1090
|
height: 100%;
|
|
1043
1091
|
}`;
|
|
1044
|
-
const Text = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
1045
|
-
return /* @__PURE__ */ jsxRuntime.jsx("span", {
|
|
1046
|
-
class: "builder-text",
|
|
1047
|
-
get dangerouslySetInnerHTML() {
|
|
1048
|
-
return props.text;
|
|
1049
|
-
},
|
|
1050
|
-
[qwik._IMMUTABLE]: {
|
|
1051
|
-
dangerouslySetInnerHTML: qwik._wrapSignal(props, "text")
|
|
1052
|
-
}
|
|
1053
|
-
});
|
|
1054
|
-
}, "Text_component_15p0cKUxgIE"));
|
|
1055
|
-
const videoProps = function videoProps2(props, state) {
|
|
1056
|
-
return {
|
|
1057
|
-
...props.autoPlay === true ? {
|
|
1058
|
-
autoPlay: true
|
|
1059
|
-
} : {},
|
|
1060
|
-
...props.muted === true ? {
|
|
1061
|
-
muted: true
|
|
1062
|
-
} : {},
|
|
1063
|
-
...props.controls === true ? {
|
|
1064
|
-
controls: true
|
|
1065
|
-
} : {},
|
|
1066
|
-
...props.loop === true ? {
|
|
1067
|
-
loop: true
|
|
1068
|
-
} : {},
|
|
1069
|
-
...props.playsInline === true ? {
|
|
1070
|
-
playsInline: true
|
|
1071
|
-
} : {}
|
|
1072
|
-
};
|
|
1073
|
-
};
|
|
1074
|
-
const spreadProps = function spreadProps2(props, state) {
|
|
1075
|
-
return {
|
|
1076
|
-
...props.attributes,
|
|
1077
|
-
...videoProps(props)
|
|
1078
|
-
};
|
|
1079
|
-
};
|
|
1080
|
-
const Video = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
1081
|
-
return /* @__PURE__ */ jsxRuntime.jsx("video", {
|
|
1082
|
-
...spreadProps(props),
|
|
1083
|
-
style: {
|
|
1084
|
-
width: "100%",
|
|
1085
|
-
height: "100%",
|
|
1086
|
-
...props.attributes?.style,
|
|
1087
|
-
objectFit: props.fit,
|
|
1088
|
-
objectPosition: props.position,
|
|
1089
|
-
borderRadius: 1
|
|
1090
|
-
},
|
|
1091
|
-
src: props.video || "no-src",
|
|
1092
|
-
get poster() {
|
|
1093
|
-
return props.posterImage;
|
|
1094
|
-
},
|
|
1095
|
-
[qwik._IMMUTABLE]: {
|
|
1096
|
-
poster: qwik._wrapSignal(props, "posterImage")
|
|
1097
|
-
}
|
|
1098
|
-
});
|
|
1099
|
-
}, "Video_component_qdcTZflYyoQ"));
|
|
1100
|
-
const Button = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
1101
|
-
qwik.useStylesScopedQrl(qwik.inlinedQrl(STYLES, "Button_component_useStylesScoped_a1JZ0Q0Q2Oc"));
|
|
1102
|
-
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {
|
|
1103
|
-
children: props.link ? /* @__PURE__ */ jsxRuntime.jsx("a", {
|
|
1104
|
-
role: "button",
|
|
1105
|
-
...props.attributes,
|
|
1106
|
-
get href() {
|
|
1107
|
-
return props.link;
|
|
1108
|
-
},
|
|
1109
|
-
target: props.openLinkInNewTab ? "_blank" : void 0,
|
|
1110
|
-
children: qwik._wrapSignal(props, "text"),
|
|
1111
|
-
[qwik._IMMUTABLE]: {
|
|
1112
|
-
href: qwik._wrapSignal(props, "link")
|
|
1113
|
-
}
|
|
1114
|
-
}) : /* @__PURE__ */ jsxRuntime.jsx("button", {
|
|
1115
|
-
class: "button-Button",
|
|
1116
|
-
...props.attributes,
|
|
1117
|
-
children: qwik._wrapSignal(props, "text")
|
|
1118
|
-
}),
|
|
1119
|
-
[qwik._IMMUTABLE]: {
|
|
1120
|
-
children: false
|
|
1121
|
-
}
|
|
1122
|
-
}, "jc_0");
|
|
1123
|
-
}, "Button_component_gJoMUICXoUQ"));
|
|
1124
|
-
const STYLES = `
|
|
1125
|
-
.button-Button {
|
|
1126
|
-
all: unset;
|
|
1127
|
-
}`;
|
|
1128
1092
|
const componentInfo$a = {
|
|
1129
1093
|
name: "Core:Button",
|
|
1130
1094
|
builtIn: true,
|
|
@@ -1417,11 +1381,6 @@ const componentInfo$8 = {
|
|
|
1417
1381
|
canHaveChildren: true,
|
|
1418
1382
|
noWrap: true
|
|
1419
1383
|
};
|
|
1420
|
-
const FragmentComponent = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
1421
|
-
return /* @__PURE__ */ jsxRuntime.jsx("span", {
|
|
1422
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(qwik.Slot, {}, "oj_0")
|
|
1423
|
-
});
|
|
1424
|
-
}, "FragmentComponent_component_T0AypnadAK0"));
|
|
1425
1384
|
const componentInfo$7 = {
|
|
1426
1385
|
name: "Image",
|
|
1427
1386
|
static: true,
|
|
@@ -1675,667 +1634,787 @@ const componentInfo$5 = {
|
|
|
1675
1634
|
}
|
|
1676
1635
|
]
|
|
1677
1636
|
};
|
|
1678
|
-
|
|
1679
|
-
|
|
1680
|
-
|
|
1681
|
-
|
|
1682
|
-
|
|
1683
|
-
|
|
1684
|
-
|
|
1685
|
-
|
|
1686
|
-
|
|
1687
|
-
|
|
1688
|
-
|
|
1689
|
-
|
|
1690
|
-
|
|
1691
|
-
|
|
1637
|
+
function getGlobalThis() {
|
|
1638
|
+
if (typeof globalThis !== "undefined")
|
|
1639
|
+
return globalThis;
|
|
1640
|
+
if (typeof window !== "undefined")
|
|
1641
|
+
return window;
|
|
1642
|
+
if (typeof global !== "undefined")
|
|
1643
|
+
return global;
|
|
1644
|
+
if (typeof self !== "undefined")
|
|
1645
|
+
return self;
|
|
1646
|
+
return globalThis;
|
|
1647
|
+
}
|
|
1648
|
+
function getFetch() {
|
|
1649
|
+
const globalFetch = getGlobalThis().fetch;
|
|
1650
|
+
if (typeof globalFetch === "undefined") {
|
|
1651
|
+
console.warn(`Builder SDK could not find a global fetch function. Make sure you have a polyfill for fetch in your project.
|
|
1652
|
+
For more information, read https://github.com/BuilderIO/this-package-uses-fetch`);
|
|
1653
|
+
throw new Error("Builder SDK could not find a global `fetch` function");
|
|
1654
|
+
}
|
|
1655
|
+
return globalFetch;
|
|
1656
|
+
}
|
|
1657
|
+
const fetch$1 = getFetch();
|
|
1658
|
+
const getTopLevelDomain = (host) => {
|
|
1659
|
+
if (host === "localhost" || host === "127.0.0.1")
|
|
1660
|
+
return host;
|
|
1661
|
+
const parts = host.split(".");
|
|
1662
|
+
if (parts.length > 2)
|
|
1663
|
+
return parts.slice(1).join(".");
|
|
1664
|
+
return host;
|
|
1665
|
+
};
|
|
1666
|
+
const getCookie = async ({ name, canTrack }) => {
|
|
1667
|
+
try {
|
|
1668
|
+
if (!canTrack)
|
|
1669
|
+
return void 0;
|
|
1670
|
+
return document.cookie.split("; ").find((row) => row.startsWith(`${name}=`))?.split("=")[1];
|
|
1671
|
+
} catch (err) {
|
|
1672
|
+
console.debug("[COOKIE] GET error: ", err);
|
|
1673
|
+
return void 0;
|
|
1674
|
+
}
|
|
1675
|
+
};
|
|
1676
|
+
const stringifyCookie = (cookie) => cookie.map(([key, value]) => value ? `${key}=${value}` : key).filter(checkIsDefined).join("; ");
|
|
1677
|
+
const SECURE_CONFIG = [
|
|
1678
|
+
[
|
|
1679
|
+
"secure",
|
|
1680
|
+
""
|
|
1692
1681
|
],
|
|
1693
|
-
|
|
1694
|
-
|
|
1695
|
-
|
|
1696
|
-
|
|
1682
|
+
[
|
|
1683
|
+
"SameSite",
|
|
1684
|
+
"None"
|
|
1685
|
+
]
|
|
1686
|
+
];
|
|
1687
|
+
const createCookieString = ({ name, value, expires }) => {
|
|
1688
|
+
const secure = isBrowser() ? location.protocol === "https:" : true;
|
|
1689
|
+
const secureObj = secure ? SECURE_CONFIG : [
|
|
1690
|
+
[]
|
|
1691
|
+
];
|
|
1692
|
+
const expiresObj = expires ? [
|
|
1693
|
+
[
|
|
1694
|
+
"expires",
|
|
1695
|
+
expires.toUTCString()
|
|
1696
|
+
]
|
|
1697
|
+
] : [
|
|
1698
|
+
[]
|
|
1699
|
+
];
|
|
1700
|
+
const cookieValue = [
|
|
1701
|
+
[
|
|
1702
|
+
name,
|
|
1703
|
+
value
|
|
1704
|
+
],
|
|
1705
|
+
...expiresObj,
|
|
1706
|
+
[
|
|
1707
|
+
"path",
|
|
1708
|
+
"/"
|
|
1709
|
+
],
|
|
1710
|
+
[
|
|
1711
|
+
"domain",
|
|
1712
|
+
getTopLevelDomain(window.location.hostname)
|
|
1713
|
+
],
|
|
1714
|
+
...secureObj
|
|
1715
|
+
];
|
|
1716
|
+
const cookie = stringifyCookie(cookieValue);
|
|
1717
|
+
return cookie;
|
|
1718
|
+
};
|
|
1719
|
+
const setCookie = async ({ name, value, expires, canTrack }) => {
|
|
1720
|
+
try {
|
|
1721
|
+
if (!canTrack)
|
|
1722
|
+
return;
|
|
1723
|
+
const cookie = createCookieString({
|
|
1724
|
+
name,
|
|
1725
|
+
value,
|
|
1726
|
+
expires
|
|
1727
|
+
});
|
|
1728
|
+
document.cookie = cookie;
|
|
1729
|
+
} catch (err) {
|
|
1730
|
+
console.warn("[COOKIE] SET error: ", err);
|
|
1697
1731
|
}
|
|
1698
1732
|
};
|
|
1699
|
-
const
|
|
1700
|
-
|
|
1701
|
-
|
|
1702
|
-
|
|
1703
|
-
|
|
1704
|
-
|
|
1705
|
-
|
|
1706
|
-
|
|
1707
|
-
|
|
1708
|
-
|
|
1709
|
-
|
|
1710
|
-
|
|
1711
|
-
|
|
1712
|
-
|
|
1713
|
-
|
|
1714
|
-
|
|
1715
|
-
|
|
1716
|
-
|
|
1717
|
-
|
|
1718
|
-
|
|
1719
|
-
|
|
1720
|
-
|
|
1721
|
-
type: "file",
|
|
1722
|
-
allowedFileTypes: [
|
|
1723
|
-
"jpeg",
|
|
1724
|
-
"png"
|
|
1725
|
-
],
|
|
1726
|
-
helperText: "Image to show before the video plays"
|
|
1727
|
-
},
|
|
1728
|
-
{
|
|
1729
|
-
name: "autoPlay",
|
|
1730
|
-
type: "boolean",
|
|
1731
|
-
defaultValue: true
|
|
1732
|
-
},
|
|
1733
|
-
{
|
|
1734
|
-
name: "controls",
|
|
1735
|
-
type: "boolean",
|
|
1736
|
-
defaultValue: false
|
|
1737
|
-
},
|
|
1738
|
-
{
|
|
1739
|
-
name: "muted",
|
|
1740
|
-
type: "boolean",
|
|
1741
|
-
defaultValue: true
|
|
1742
|
-
},
|
|
1743
|
-
{
|
|
1744
|
-
name: "loop",
|
|
1745
|
-
type: "boolean",
|
|
1746
|
-
defaultValue: true
|
|
1747
|
-
},
|
|
1748
|
-
{
|
|
1749
|
-
name: "playsInline",
|
|
1750
|
-
type: "boolean",
|
|
1751
|
-
defaultValue: true
|
|
1752
|
-
},
|
|
1753
|
-
{
|
|
1754
|
-
name: "fit",
|
|
1755
|
-
type: "text",
|
|
1756
|
-
defaultValue: "cover",
|
|
1757
|
-
enum: [
|
|
1758
|
-
"contain",
|
|
1759
|
-
"cover",
|
|
1760
|
-
"fill",
|
|
1761
|
-
"auto"
|
|
1762
|
-
]
|
|
1763
|
-
},
|
|
1764
|
-
{
|
|
1765
|
-
name: "fitContent",
|
|
1766
|
-
type: "boolean",
|
|
1767
|
-
helperText: "When child blocks are provided, fit to them instead of using the aspect ratio",
|
|
1768
|
-
defaultValue: true,
|
|
1769
|
-
advanced: true
|
|
1770
|
-
},
|
|
1771
|
-
{
|
|
1772
|
-
name: "position",
|
|
1773
|
-
type: "text",
|
|
1774
|
-
defaultValue: "center",
|
|
1775
|
-
enum: [
|
|
1776
|
-
"center",
|
|
1777
|
-
"top",
|
|
1778
|
-
"left",
|
|
1779
|
-
"right",
|
|
1780
|
-
"bottom",
|
|
1781
|
-
"top left",
|
|
1782
|
-
"top right",
|
|
1783
|
-
"bottom left",
|
|
1784
|
-
"bottom right"
|
|
1785
|
-
]
|
|
1786
|
-
},
|
|
1787
|
-
{
|
|
1788
|
-
name: "height",
|
|
1789
|
-
type: "number",
|
|
1790
|
-
advanced: true
|
|
1791
|
-
},
|
|
1792
|
-
{
|
|
1793
|
-
name: "width",
|
|
1794
|
-
type: "number",
|
|
1795
|
-
advanced: true
|
|
1796
|
-
},
|
|
1797
|
-
{
|
|
1798
|
-
name: "aspectRatio",
|
|
1799
|
-
type: "number",
|
|
1800
|
-
advanced: true,
|
|
1801
|
-
defaultValue: 0.7004048582995948
|
|
1802
|
-
},
|
|
1803
|
-
{
|
|
1804
|
-
name: "lazyLoad",
|
|
1805
|
-
type: "boolean",
|
|
1806
|
-
helperText: 'Load this video "lazily" - as in only when a user scrolls near the video. Recommended for optmized performance and bandwidth consumption',
|
|
1807
|
-
defaultValue: true,
|
|
1808
|
-
advanced: true
|
|
1809
|
-
}
|
|
1810
|
-
]
|
|
1733
|
+
const BUILDER_STORE_PREFIX = "builderio.variations";
|
|
1734
|
+
const getContentTestKey = (id) => `${BUILDER_STORE_PREFIX}.${id}`;
|
|
1735
|
+
const getContentVariationCookie = ({ contentId, canTrack }) => getCookie({
|
|
1736
|
+
name: getContentTestKey(contentId),
|
|
1737
|
+
canTrack
|
|
1738
|
+
});
|
|
1739
|
+
const setContentVariationCookie = ({ contentId, canTrack, value }) => setCookie({
|
|
1740
|
+
name: getContentTestKey(contentId),
|
|
1741
|
+
value,
|
|
1742
|
+
canTrack
|
|
1743
|
+
});
|
|
1744
|
+
const checkIsBuilderContentWithVariations = (item) => checkIsDefined(item.id) && checkIsDefined(item.variations) && Object.keys(item.variations).length > 0;
|
|
1745
|
+
const getRandomVariationId = ({ id, variations }) => {
|
|
1746
|
+
let n = 0;
|
|
1747
|
+
const random = Math.random();
|
|
1748
|
+
for (const id1 in variations) {
|
|
1749
|
+
const testRatio = variations[id1]?.testRatio;
|
|
1750
|
+
n += testRatio;
|
|
1751
|
+
if (random < n)
|
|
1752
|
+
return id1;
|
|
1753
|
+
}
|
|
1754
|
+
return id;
|
|
1811
1755
|
};
|
|
1812
|
-
const
|
|
1813
|
-
|
|
1814
|
-
|
|
1815
|
-
|
|
1816
|
-
|
|
1817
|
-
|
|
1818
|
-
|
|
1819
|
-
|
|
1820
|
-
|
|
1821
|
-
|
|
1822
|
-
|
|
1823
|
-
|
|
1824
|
-
|
|
1825
|
-
if (url) {
|
|
1826
|
-
options.set("content", "Loading...");
|
|
1827
|
-
const apiKey = "ae0e60e78201a3f2b0de4b";
|
|
1828
|
-
return fetch(`https://iframe.ly/api/iframely?url=${url}&api_key=${apiKey}`).then((res) => res.json()).then((data) => {
|
|
1829
|
-
if (options.get("url") === url) {
|
|
1830
|
-
if (data.html)
|
|
1831
|
-
options.set("content", data.html);
|
|
1832
|
-
else
|
|
1833
|
-
options.set("content", "Invalid url, please try another");
|
|
1834
|
-
}
|
|
1835
|
-
}).catch((_err) => {
|
|
1836
|
-
options.set("content", "There was an error embedding this URL, please try again or another URL");
|
|
1837
|
-
});
|
|
1838
|
-
} else
|
|
1839
|
-
options.delete("content");
|
|
1840
|
-
})
|
|
1841
|
-
},
|
|
1842
|
-
{
|
|
1843
|
-
name: "content",
|
|
1844
|
-
type: "html",
|
|
1845
|
-
defaultValue: '<div style="padding: 20px; text-align: center">(Choose an embed URL)<div>',
|
|
1846
|
-
hideFromUI: true
|
|
1847
|
-
}
|
|
1848
|
-
]
|
|
1756
|
+
const getTestFields = ({ item, testGroupId }) => {
|
|
1757
|
+
const variationValue = item.variations[testGroupId];
|
|
1758
|
+
if (testGroupId === item.id || !variationValue)
|
|
1759
|
+
return {
|
|
1760
|
+
testVariationId: item.id,
|
|
1761
|
+
testVariationName: "Default"
|
|
1762
|
+
};
|
|
1763
|
+
else
|
|
1764
|
+
return {
|
|
1765
|
+
data: variationValue.data,
|
|
1766
|
+
testVariationId: variationValue.id,
|
|
1767
|
+
testVariationName: variationValue.name || (variationValue.id === item.id ? "Default" : "")
|
|
1768
|
+
};
|
|
1849
1769
|
};
|
|
1850
|
-
const
|
|
1851
|
-
|
|
1852
|
-
|
|
1853
|
-
|
|
1854
|
-
|
|
1855
|
-
const
|
|
1856
|
-
|
|
1857
|
-
|
|
1770
|
+
const getContentVariation = async ({ item, canTrack }) => {
|
|
1771
|
+
const testGroupId = await getContentVariationCookie({
|
|
1772
|
+
canTrack,
|
|
1773
|
+
contentId: item.id
|
|
1774
|
+
});
|
|
1775
|
+
const testFields = testGroupId ? getTestFields({
|
|
1776
|
+
item,
|
|
1777
|
+
testGroupId
|
|
1778
|
+
}) : void 0;
|
|
1779
|
+
if (testFields)
|
|
1780
|
+
return testFields;
|
|
1781
|
+
else {
|
|
1782
|
+
const randomVariationId = getRandomVariationId({
|
|
1783
|
+
variations: item.variations,
|
|
1784
|
+
id: item.id
|
|
1785
|
+
});
|
|
1786
|
+
setContentVariationCookie({
|
|
1787
|
+
contentId: item.id,
|
|
1788
|
+
value: randomVariationId,
|
|
1789
|
+
canTrack
|
|
1790
|
+
}).catch((err) => {
|
|
1791
|
+
console.error("could not store A/B test variation: ", err);
|
|
1792
|
+
});
|
|
1793
|
+
return getTestFields({
|
|
1794
|
+
item,
|
|
1795
|
+
testGroupId: randomVariationId
|
|
1796
|
+
});
|
|
1797
|
+
}
|
|
1798
|
+
};
|
|
1799
|
+
const handleABTesting = async ({ item, canTrack }) => {
|
|
1800
|
+
if (!checkIsBuilderContentWithVariations(item))
|
|
1858
1801
|
return;
|
|
1859
|
-
const
|
|
1860
|
-
|
|
1861
|
-
|
|
1862
|
-
|
|
1863
|
-
|
|
1864
|
-
|
|
1865
|
-
|
|
1866
|
-
|
|
1867
|
-
|
|
1868
|
-
|
|
1869
|
-
|
|
1870
|
-
|
|
1871
|
-
|
|
1872
|
-
|
|
1873
|
-
|
|
1874
|
-
|
|
1802
|
+
const variationValue = await getContentVariation({
|
|
1803
|
+
item,
|
|
1804
|
+
canTrack
|
|
1805
|
+
});
|
|
1806
|
+
Object.assign(item, variationValue);
|
|
1807
|
+
};
|
|
1808
|
+
function flatten(object, path = null, separator = ".") {
|
|
1809
|
+
return Object.keys(object).reduce((acc, key) => {
|
|
1810
|
+
const value = object[key];
|
|
1811
|
+
const newPath = [
|
|
1812
|
+
path,
|
|
1813
|
+
key
|
|
1814
|
+
].filter(Boolean).join(separator);
|
|
1815
|
+
const isObject = [
|
|
1816
|
+
typeof value === "object",
|
|
1817
|
+
value !== null,
|
|
1818
|
+
!(Array.isArray(value) && value.length === 0)
|
|
1819
|
+
].every(Boolean);
|
|
1820
|
+
return isObject ? {
|
|
1821
|
+
...acc,
|
|
1822
|
+
...flatten(value, newPath, separator)
|
|
1823
|
+
} : {
|
|
1824
|
+
...acc,
|
|
1825
|
+
[newPath]: value
|
|
1826
|
+
};
|
|
1827
|
+
}, {});
|
|
1828
|
+
}
|
|
1829
|
+
const BUILDER_SEARCHPARAMS_PREFIX = "builder.";
|
|
1830
|
+
const BUILDER_OPTIONS_PREFIX = "options.";
|
|
1831
|
+
const convertSearchParamsToQueryObject = (searchParams) => {
|
|
1832
|
+
const options = {};
|
|
1833
|
+
searchParams.forEach((value, key) => {
|
|
1834
|
+
options[key] = value;
|
|
1835
|
+
});
|
|
1836
|
+
return options;
|
|
1837
|
+
};
|
|
1838
|
+
const getBuilderSearchParams = (_options) => {
|
|
1839
|
+
if (!_options)
|
|
1840
|
+
return {};
|
|
1841
|
+
const options = normalizeSearchParams(_options);
|
|
1842
|
+
const newOptions = {};
|
|
1843
|
+
Object.keys(options).forEach((key) => {
|
|
1844
|
+
if (key.startsWith(BUILDER_SEARCHPARAMS_PREFIX)) {
|
|
1845
|
+
const trimmedKey = key.replace(BUILDER_SEARCHPARAMS_PREFIX, "").replace(BUILDER_OPTIONS_PREFIX, "");
|
|
1846
|
+
newOptions[trimmedKey] = options[key];
|
|
1847
|
+
}
|
|
1848
|
+
});
|
|
1849
|
+
return newOptions;
|
|
1850
|
+
};
|
|
1851
|
+
const getBuilderSearchParamsFromWindow = () => {
|
|
1852
|
+
if (!isBrowser())
|
|
1853
|
+
return {};
|
|
1854
|
+
const searchParams = new URLSearchParams(window.location.search);
|
|
1855
|
+
return getBuilderSearchParams(searchParams);
|
|
1856
|
+
};
|
|
1857
|
+
const normalizeSearchParams = (searchParams) => searchParams instanceof URLSearchParams ? convertSearchParamsToQueryObject(searchParams) : searchParams;
|
|
1858
|
+
const generateContentUrl = (options) => {
|
|
1859
|
+
const { limit = 30, userAttributes, query, noTraverse = false, model, apiKey, includeRefs = true, locale } = options;
|
|
1860
|
+
if (!apiKey)
|
|
1861
|
+
throw new Error("Missing API key");
|
|
1862
|
+
const url = new URL(`https://cdn.builder.io/api/v2/content/${model}?apiKey=${apiKey}&limit=${limit}&noTraverse=${noTraverse}&includeRefs=${includeRefs}${locale ? `&locale=${locale}` : ""}`);
|
|
1863
|
+
const queryOptions = {
|
|
1864
|
+
...getBuilderSearchParamsFromWindow(),
|
|
1865
|
+
...normalizeSearchParams(options.options || {})
|
|
1866
|
+
};
|
|
1867
|
+
const flattened = flatten(queryOptions);
|
|
1868
|
+
for (const key in flattened)
|
|
1869
|
+
url.searchParams.set(key, String(flattened[key]));
|
|
1870
|
+
if (userAttributes)
|
|
1871
|
+
url.searchParams.set("userAttributes", JSON.stringify(userAttributes));
|
|
1872
|
+
if (query) {
|
|
1873
|
+
const flattened1 = flatten({
|
|
1874
|
+
query
|
|
1875
|
+
});
|
|
1876
|
+
for (const key1 in flattened1)
|
|
1877
|
+
url.searchParams.set(key1, JSON.stringify(flattened1[key1]));
|
|
1875
1878
|
}
|
|
1879
|
+
return url;
|
|
1876
1880
|
};
|
|
1877
|
-
|
|
1878
|
-
|
|
1881
|
+
async function getContent(options) {
|
|
1882
|
+
return (await getAllContent({
|
|
1883
|
+
...options,
|
|
1884
|
+
limit: 1
|
|
1885
|
+
})).results[0] || null;
|
|
1886
|
+
}
|
|
1887
|
+
async function getAllContent(options) {
|
|
1888
|
+
const url = generateContentUrl(options);
|
|
1889
|
+
const res = await fetch$1(url.href);
|
|
1890
|
+
const content = await res.json();
|
|
1891
|
+
const canTrack = options.canTrack !== false;
|
|
1892
|
+
if (canTrack && Array.isArray(content.results))
|
|
1893
|
+
for (const item of content.results)
|
|
1894
|
+
await handleABTesting({
|
|
1895
|
+
item,
|
|
1896
|
+
canTrack
|
|
1897
|
+
});
|
|
1898
|
+
return content;
|
|
1899
|
+
}
|
|
1900
|
+
const className = function className22(props, state, builderContext2) {
|
|
1901
|
+
return [
|
|
1902
|
+
...[
|
|
1903
|
+
props.attributes.class
|
|
1904
|
+
],
|
|
1905
|
+
"builder-symbol",
|
|
1906
|
+
props.symbol?.inline ? "builder-inline-symbol" : void 0,
|
|
1907
|
+
props.symbol?.dynamic || props.dynamic ? "builder-dynamic-symbol" : void 0
|
|
1908
|
+
].filter(Boolean).join(" ");
|
|
1909
|
+
};
|
|
1910
|
+
const contentToUse = function contentToUse2(props, state, builderContext2) {
|
|
1911
|
+
return props.symbol?.content || state.fetchedContent;
|
|
1912
|
+
};
|
|
1913
|
+
const Symbol$1 = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
1914
|
+
const builderContext$1 = qwik.useContext(builderContext);
|
|
1879
1915
|
const state = qwik.useStore({
|
|
1880
|
-
|
|
1881
|
-
scriptsInserted: [],
|
|
1882
|
-
scriptsRun: []
|
|
1916
|
+
fetchedContent: null
|
|
1883
1917
|
});
|
|
1884
|
-
qwik.
|
|
1885
|
-
const [
|
|
1886
|
-
|
|
1887
|
-
|
|
1888
|
-
|
|
1889
|
-
|
|
1890
|
-
|
|
1891
|
-
|
|
1892
|
-
|
|
1918
|
+
qwik.useTaskQrl(qwik.inlinedQrl(({ track: track2 }) => {
|
|
1919
|
+
const [builderContext2, props2, state2] = qwik.useLexicalScope();
|
|
1920
|
+
track2(() => props2.symbol);
|
|
1921
|
+
track2(() => state2.fetchedContent);
|
|
1922
|
+
const symbolToUse = props2.symbol;
|
|
1923
|
+
if (symbolToUse && !symbolToUse.content && !state2.fetchedContent && symbolToUse.model && builderContext2?.apiKey)
|
|
1924
|
+
getContent({
|
|
1925
|
+
model: symbolToUse.model,
|
|
1926
|
+
apiKey: builderContext2.apiKey,
|
|
1927
|
+
query: {
|
|
1928
|
+
id: symbolToUse.entry
|
|
1929
|
+
}
|
|
1930
|
+
}).then((response) => {
|
|
1931
|
+
state2.fetchedContent = response;
|
|
1932
|
+
});
|
|
1933
|
+
}, "Symbol_component_useTask_NIAWAC1bMBo", [
|
|
1934
|
+
builderContext$1,
|
|
1893
1935
|
props,
|
|
1894
1936
|
state
|
|
1895
1937
|
]));
|
|
1896
1938
|
return /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
1897
|
-
|
|
1898
|
-
|
|
1939
|
+
...props.attributes,
|
|
1940
|
+
class: className(props),
|
|
1941
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(RenderContent$1, {
|
|
1942
|
+
get apiKey() {
|
|
1943
|
+
return builderContext$1.apiKey;
|
|
1944
|
+
},
|
|
1945
|
+
get context() {
|
|
1946
|
+
return builderContext$1.context;
|
|
1947
|
+
},
|
|
1948
|
+
customComponents: Object.values(builderContext$1.registeredComponents),
|
|
1949
|
+
data: {
|
|
1950
|
+
...props.symbol?.data,
|
|
1951
|
+
...builderContext$1.state,
|
|
1952
|
+
...props.symbol?.content?.data?.state
|
|
1953
|
+
},
|
|
1954
|
+
model: props.symbol?.model,
|
|
1955
|
+
content: contentToUse(props, state),
|
|
1956
|
+
[qwik._IMMUTABLE]: {
|
|
1957
|
+
apiKey: qwik._wrapSignal(builderContext$1, "apiKey"),
|
|
1958
|
+
context: qwik._wrapSignal(builderContext$1, "context")
|
|
1959
|
+
}
|
|
1960
|
+
}, "Wt_0")
|
|
1961
|
+
});
|
|
1962
|
+
}, "Symbol_component_WVvggdkUPdk"));
|
|
1963
|
+
const componentInfo$4 = {
|
|
1964
|
+
name: "Text",
|
|
1965
|
+
static: true,
|
|
1966
|
+
builtIn: true,
|
|
1967
|
+
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",
|
|
1968
|
+
inputs: [
|
|
1969
|
+
{
|
|
1970
|
+
name: "text",
|
|
1971
|
+
type: "html",
|
|
1972
|
+
required: true,
|
|
1973
|
+
autoFocus: true,
|
|
1974
|
+
bubble: true,
|
|
1975
|
+
defaultValue: "Enter some text..."
|
|
1976
|
+
}
|
|
1977
|
+
],
|
|
1978
|
+
defaultStyles: {
|
|
1979
|
+
lineHeight: "normal",
|
|
1980
|
+
height: "auto",
|
|
1981
|
+
textAlign: "center"
|
|
1982
|
+
}
|
|
1983
|
+
};
|
|
1984
|
+
const Text = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
1985
|
+
return /* @__PURE__ */ jsxRuntime.jsx("span", {
|
|
1986
|
+
class: "builder-text",
|
|
1899
1987
|
get dangerouslySetInnerHTML() {
|
|
1900
|
-
return props.
|
|
1988
|
+
return props.text;
|
|
1901
1989
|
},
|
|
1902
1990
|
[qwik._IMMUTABLE]: {
|
|
1903
|
-
dangerouslySetInnerHTML: qwik._wrapSignal(props, "
|
|
1991
|
+
dangerouslySetInnerHTML: qwik._wrapSignal(props, "text")
|
|
1904
1992
|
}
|
|
1905
1993
|
});
|
|
1906
|
-
}, "
|
|
1907
|
-
const
|
|
1908
|
-
|
|
1909
|
-
|
|
1910
|
-
objectFit: props.backgroundSize || "cover",
|
|
1911
|
-
objectPosition: props.backgroundPosition || "center"
|
|
1912
|
-
},
|
|
1913
|
-
get alt() {
|
|
1914
|
-
return props.altText;
|
|
1915
|
-
},
|
|
1916
|
-
src: props.imgSrc || props.image,
|
|
1917
|
-
...props.attributes,
|
|
1918
|
-
[qwik._IMMUTABLE]: {
|
|
1919
|
-
alt: qwik._wrapSignal(props, "altText")
|
|
1920
|
-
}
|
|
1921
|
-
}, isEditing() && props.imgSrc || "default-key");
|
|
1922
|
-
}, "ImgComponent_component_FXvIDBSffO8"));
|
|
1923
|
-
const componentInfo$1 = {
|
|
1924
|
-
name: "Raw:Img",
|
|
1925
|
-
hideFromInsertMenu: true,
|
|
1994
|
+
}, "Text_component_15p0cKUxgIE"));
|
|
1995
|
+
const componentInfo$3 = {
|
|
1996
|
+
name: "Video",
|
|
1997
|
+
canHaveChildren: true,
|
|
1926
1998
|
builtIn: true,
|
|
1927
|
-
|
|
1999
|
+
defaultStyles: {
|
|
2000
|
+
minHeight: "20px",
|
|
2001
|
+
minWidth: "20px"
|
|
2002
|
+
},
|
|
2003
|
+
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",
|
|
1928
2004
|
inputs: [
|
|
1929
2005
|
{
|
|
1930
|
-
name: "
|
|
2006
|
+
name: "video",
|
|
2007
|
+
type: "file",
|
|
2008
|
+
allowedFileTypes: [
|
|
2009
|
+
"mp4"
|
|
2010
|
+
],
|
|
1931
2011
|
bubble: true,
|
|
2012
|
+
defaultValue: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/assets%2FKQlEmWDxA0coC3PK6UvkrjwkIGI2%2F28cb070609f546cdbe5efa20e931aa4b?alt=media&token=912e9551-7a7c-4dfb-86b6-3da1537d1a7f",
|
|
2013
|
+
required: true
|
|
2014
|
+
},
|
|
2015
|
+
{
|
|
2016
|
+
name: "posterImage",
|
|
1932
2017
|
type: "file",
|
|
1933
2018
|
allowedFileTypes: [
|
|
1934
2019
|
"jpeg",
|
|
1935
|
-
"
|
|
1936
|
-
"png",
|
|
1937
|
-
"svg"
|
|
2020
|
+
"png"
|
|
1938
2021
|
],
|
|
1939
|
-
|
|
1940
|
-
}
|
|
1941
|
-
|
|
1942
|
-
|
|
1943
|
-
|
|
1944
|
-
|
|
1945
|
-
const findAndRunScripts = function findAndRunScripts22(props, state, elem) {
|
|
1946
|
-
if (elem && elem.getElementsByTagName && typeof window !== "undefined") {
|
|
1947
|
-
const scripts = elem.getElementsByTagName("script");
|
|
1948
|
-
for (let i = 0; i < scripts.length; i++) {
|
|
1949
|
-
const script = scripts[i];
|
|
1950
|
-
if (script.src) {
|
|
1951
|
-
if (state.scriptsInserted.includes(script.src))
|
|
1952
|
-
continue;
|
|
1953
|
-
state.scriptsInserted.push(script.src);
|
|
1954
|
-
const newScript = document.createElement("script");
|
|
1955
|
-
newScript.async = true;
|
|
1956
|
-
newScript.src = script.src;
|
|
1957
|
-
document.head.appendChild(newScript);
|
|
1958
|
-
} else if (!script.type || [
|
|
1959
|
-
"text/javascript",
|
|
1960
|
-
"application/javascript",
|
|
1961
|
-
"application/ecmascript"
|
|
1962
|
-
].includes(script.type)) {
|
|
1963
|
-
if (state.scriptsRun.includes(script.innerText))
|
|
1964
|
-
continue;
|
|
1965
|
-
try {
|
|
1966
|
-
state.scriptsRun.push(script.innerText);
|
|
1967
|
-
new Function(script.innerText)();
|
|
1968
|
-
} catch (error) {
|
|
1969
|
-
console.warn("`CustomCode`: Error running script:", error);
|
|
1970
|
-
}
|
|
1971
|
-
}
|
|
1972
|
-
}
|
|
1973
|
-
}
|
|
1974
|
-
};
|
|
1975
|
-
const CustomCode = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
1976
|
-
const elem = qwik.useRef();
|
|
1977
|
-
const state = qwik.useStore({
|
|
1978
|
-
scriptsInserted: [],
|
|
1979
|
-
scriptsRun: []
|
|
1980
|
-
});
|
|
1981
|
-
qwik.useClientEffectQrl(qwik.inlinedQrl(() => {
|
|
1982
|
-
const [elem2, props2, state2] = qwik.useLexicalScope();
|
|
1983
|
-
findAndRunScripts(props2, state2, elem2);
|
|
1984
|
-
}, "CustomCode_component_useClientEffect_4w4c951ufB4", [
|
|
1985
|
-
elem,
|
|
1986
|
-
props,
|
|
1987
|
-
state
|
|
1988
|
-
]));
|
|
1989
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
1990
|
-
ref: elem,
|
|
1991
|
-
class: "builder-custom-code" + (props.replaceNodes ? " replace-nodes" : ""),
|
|
1992
|
-
get dangerouslySetInnerHTML() {
|
|
1993
|
-
return props.code;
|
|
2022
|
+
helperText: "Image to show before the video plays"
|
|
2023
|
+
},
|
|
2024
|
+
{
|
|
2025
|
+
name: "autoPlay",
|
|
2026
|
+
type: "boolean",
|
|
2027
|
+
defaultValue: true
|
|
1994
2028
|
},
|
|
1995
|
-
[qwik._IMMUTABLE]: {
|
|
1996
|
-
dangerouslySetInnerHTML: qwik._wrapSignal(props, "code")
|
|
1997
|
-
}
|
|
1998
|
-
});
|
|
1999
|
-
}, "CustomCode_component_uYOSy7w7Zqw"));
|
|
2000
|
-
const componentInfo = {
|
|
2001
|
-
name: "Custom Code",
|
|
2002
|
-
static: true,
|
|
2003
|
-
builtIn: true,
|
|
2004
|
-
requiredPermissions: [
|
|
2005
|
-
"editCode"
|
|
2006
|
-
],
|
|
2007
|
-
inputs: [
|
|
2008
2029
|
{
|
|
2009
|
-
name: "
|
|
2010
|
-
type: "
|
|
2011
|
-
|
|
2012
|
-
defaultValue: "<p>Hello there, I am custom HTML code!</p>",
|
|
2013
|
-
code: true
|
|
2030
|
+
name: "controls",
|
|
2031
|
+
type: "boolean",
|
|
2032
|
+
defaultValue: false
|
|
2014
2033
|
},
|
|
2015
2034
|
{
|
|
2016
|
-
name: "
|
|
2035
|
+
name: "muted",
|
|
2017
2036
|
type: "boolean",
|
|
2018
|
-
|
|
2019
|
-
advanced: true
|
|
2037
|
+
defaultValue: true
|
|
2020
2038
|
},
|
|
2021
2039
|
{
|
|
2022
|
-
name: "
|
|
2040
|
+
name: "loop",
|
|
2023
2041
|
type: "boolean",
|
|
2024
|
-
defaultValue:
|
|
2025
|
-
|
|
2042
|
+
defaultValue: true
|
|
2043
|
+
},
|
|
2044
|
+
{
|
|
2045
|
+
name: "playsInline",
|
|
2046
|
+
type: "boolean",
|
|
2047
|
+
defaultValue: true
|
|
2048
|
+
},
|
|
2049
|
+
{
|
|
2050
|
+
name: "fit",
|
|
2051
|
+
type: "text",
|
|
2052
|
+
defaultValue: "cover",
|
|
2053
|
+
enum: [
|
|
2054
|
+
"contain",
|
|
2055
|
+
"cover",
|
|
2056
|
+
"fill",
|
|
2057
|
+
"auto"
|
|
2058
|
+
]
|
|
2059
|
+
},
|
|
2060
|
+
{
|
|
2061
|
+
name: "fitContent",
|
|
2062
|
+
type: "boolean",
|
|
2063
|
+
helperText: "When child blocks are provided, fit to them instead of using the aspect ratio",
|
|
2064
|
+
defaultValue: true,
|
|
2026
2065
|
advanced: true
|
|
2027
|
-
}
|
|
2028
|
-
|
|
2029
|
-
|
|
2030
|
-
|
|
2031
|
-
|
|
2032
|
-
|
|
2033
|
-
|
|
2034
|
-
|
|
2035
|
-
|
|
2036
|
-
|
|
2037
|
-
|
|
2038
|
-
|
|
2039
|
-
|
|
2040
|
-
|
|
2041
|
-
|
|
2042
|
-
|
|
2043
|
-
|
|
2044
|
-
|
|
2045
|
-
|
|
2046
|
-
|
|
2047
|
-
|
|
2048
|
-
|
|
2049
|
-
|
|
2050
|
-
|
|
2051
|
-
|
|
2052
|
-
|
|
2053
|
-
|
|
2054
|
-
|
|
2055
|
-
|
|
2056
|
-
|
|
2057
|
-
|
|
2058
|
-
|
|
2059
|
-
|
|
2060
|
-
|
|
2061
|
-
|
|
2062
|
-
|
|
2063
|
-
|
|
2064
|
-
|
|
2065
|
-
|
|
2066
|
-
|
|
2067
|
-
|
|
2068
|
-
component: Embed,
|
|
2069
|
-
...componentInfo$2
|
|
2070
|
-
},
|
|
2071
|
-
{
|
|
2072
|
-
component: CustomCode,
|
|
2073
|
-
...componentInfo
|
|
2074
|
-
}
|
|
2075
|
-
];
|
|
2076
|
-
function getGlobalThis() {
|
|
2077
|
-
if (typeof globalThis !== "undefined")
|
|
2078
|
-
return globalThis;
|
|
2079
|
-
if (typeof window !== "undefined")
|
|
2080
|
-
return window;
|
|
2081
|
-
if (typeof global !== "undefined")
|
|
2082
|
-
return global;
|
|
2083
|
-
if (typeof self !== "undefined")
|
|
2084
|
-
return self;
|
|
2085
|
-
return globalThis;
|
|
2086
|
-
}
|
|
2087
|
-
function getFetch() {
|
|
2088
|
-
const globalFetch = getGlobalThis().fetch;
|
|
2089
|
-
if (typeof globalFetch === "undefined") {
|
|
2090
|
-
console.warn(`Builder SDK could not find a global fetch function. Make sure you have a polyfill for fetch in your project.
|
|
2091
|
-
For more information, read https://github.com/BuilderIO/this-package-uses-fetch`);
|
|
2092
|
-
throw new Error("Builder SDK could not find a global `fetch` function");
|
|
2093
|
-
}
|
|
2094
|
-
return globalFetch;
|
|
2095
|
-
}
|
|
2096
|
-
const fetch$1 = getFetch();
|
|
2097
|
-
const getTopLevelDomain = (host) => {
|
|
2098
|
-
if (host === "localhost" || host === "127.0.0.1")
|
|
2099
|
-
return host;
|
|
2100
|
-
const parts = host.split(".");
|
|
2101
|
-
if (parts.length > 2)
|
|
2102
|
-
return parts.slice(1).join(".");
|
|
2103
|
-
return host;
|
|
2104
|
-
};
|
|
2105
|
-
const getCookie = async ({ name, canTrack }) => {
|
|
2106
|
-
try {
|
|
2107
|
-
if (!canTrack)
|
|
2108
|
-
return void 0;
|
|
2109
|
-
return document.cookie.split("; ").find((row) => row.startsWith(`${name}=`))?.split("=")[1];
|
|
2110
|
-
} catch (err) {
|
|
2111
|
-
console.debug("[COOKIE] GET error: ", err);
|
|
2112
|
-
return void 0;
|
|
2113
|
-
}
|
|
2114
|
-
};
|
|
2115
|
-
const stringifyCookie = (cookie) => cookie.map(([key, value]) => value ? `${key}=${value}` : key).filter(checkIsDefined).join("; ");
|
|
2116
|
-
const SECURE_CONFIG = [
|
|
2117
|
-
[
|
|
2118
|
-
"secure",
|
|
2119
|
-
""
|
|
2120
|
-
],
|
|
2121
|
-
[
|
|
2122
|
-
"SameSite",
|
|
2123
|
-
"None"
|
|
2124
|
-
]
|
|
2125
|
-
];
|
|
2126
|
-
const createCookieString = ({ name, value, expires }) => {
|
|
2127
|
-
const secure = isBrowser() ? location.protocol === "https:" : true;
|
|
2128
|
-
const secureObj = secure ? SECURE_CONFIG : [
|
|
2129
|
-
[]
|
|
2130
|
-
];
|
|
2131
|
-
const expiresObj = expires ? [
|
|
2132
|
-
[
|
|
2133
|
-
"expires",
|
|
2134
|
-
expires.toUTCString()
|
|
2135
|
-
]
|
|
2136
|
-
] : [
|
|
2137
|
-
[]
|
|
2138
|
-
];
|
|
2139
|
-
const cookieValue = [
|
|
2140
|
-
[
|
|
2141
|
-
name,
|
|
2142
|
-
value
|
|
2143
|
-
],
|
|
2144
|
-
...expiresObj,
|
|
2145
|
-
[
|
|
2146
|
-
"path",
|
|
2147
|
-
"/"
|
|
2148
|
-
],
|
|
2149
|
-
[
|
|
2150
|
-
"domain",
|
|
2151
|
-
getTopLevelDomain(window.location.hostname)
|
|
2152
|
-
],
|
|
2153
|
-
...secureObj
|
|
2154
|
-
];
|
|
2155
|
-
const cookie = stringifyCookie(cookieValue);
|
|
2156
|
-
return cookie;
|
|
2157
|
-
};
|
|
2158
|
-
const setCookie = async ({ name, value, expires, canTrack }) => {
|
|
2159
|
-
try {
|
|
2160
|
-
if (!canTrack)
|
|
2161
|
-
return;
|
|
2162
|
-
const cookie = createCookieString({
|
|
2163
|
-
name,
|
|
2164
|
-
value,
|
|
2165
|
-
expires
|
|
2166
|
-
});
|
|
2167
|
-
document.cookie = cookie;
|
|
2168
|
-
} catch (err) {
|
|
2169
|
-
console.warn("[COOKIE] SET error: ", err);
|
|
2170
|
-
}
|
|
2171
|
-
};
|
|
2172
|
-
const BUILDER_STORE_PREFIX = "builderio.variations";
|
|
2173
|
-
const getContentTestKey = (id) => `${BUILDER_STORE_PREFIX}.${id}`;
|
|
2174
|
-
const getContentVariationCookie = ({ contentId, canTrack }) => getCookie({
|
|
2175
|
-
name: getContentTestKey(contentId),
|
|
2176
|
-
canTrack
|
|
2177
|
-
});
|
|
2178
|
-
const setContentVariationCookie = ({ contentId, canTrack, value }) => setCookie({
|
|
2179
|
-
name: getContentTestKey(contentId),
|
|
2180
|
-
value,
|
|
2181
|
-
canTrack
|
|
2182
|
-
});
|
|
2183
|
-
const checkIsBuilderContentWithVariations = (item) => checkIsDefined(item.id) && checkIsDefined(item.variations) && Object.keys(item.variations).length > 0;
|
|
2184
|
-
const getRandomVariationId = ({ id, variations }) => {
|
|
2185
|
-
let n = 0;
|
|
2186
|
-
const random = Math.random();
|
|
2187
|
-
for (const id1 in variations) {
|
|
2188
|
-
const testRatio = variations[id1]?.testRatio;
|
|
2189
|
-
n += testRatio;
|
|
2190
|
-
if (random < n)
|
|
2191
|
-
return id1;
|
|
2192
|
-
}
|
|
2193
|
-
return id;
|
|
2066
|
+
},
|
|
2067
|
+
{
|
|
2068
|
+
name: "position",
|
|
2069
|
+
type: "text",
|
|
2070
|
+
defaultValue: "center",
|
|
2071
|
+
enum: [
|
|
2072
|
+
"center",
|
|
2073
|
+
"top",
|
|
2074
|
+
"left",
|
|
2075
|
+
"right",
|
|
2076
|
+
"bottom",
|
|
2077
|
+
"top left",
|
|
2078
|
+
"top right",
|
|
2079
|
+
"bottom left",
|
|
2080
|
+
"bottom right"
|
|
2081
|
+
]
|
|
2082
|
+
},
|
|
2083
|
+
{
|
|
2084
|
+
name: "height",
|
|
2085
|
+
type: "number",
|
|
2086
|
+
advanced: true
|
|
2087
|
+
},
|
|
2088
|
+
{
|
|
2089
|
+
name: "width",
|
|
2090
|
+
type: "number",
|
|
2091
|
+
advanced: true
|
|
2092
|
+
},
|
|
2093
|
+
{
|
|
2094
|
+
name: "aspectRatio",
|
|
2095
|
+
type: "number",
|
|
2096
|
+
advanced: true,
|
|
2097
|
+
defaultValue: 0.7004048582995948
|
|
2098
|
+
},
|
|
2099
|
+
{
|
|
2100
|
+
name: "lazyLoad",
|
|
2101
|
+
type: "boolean",
|
|
2102
|
+
helperText: 'Load this video "lazily" - as in only when a user scrolls near the video. Recommended for optmized performance and bandwidth consumption',
|
|
2103
|
+
defaultValue: true,
|
|
2104
|
+
advanced: true
|
|
2105
|
+
}
|
|
2106
|
+
]
|
|
2194
2107
|
};
|
|
2195
|
-
const
|
|
2196
|
-
|
|
2197
|
-
|
|
2198
|
-
|
|
2199
|
-
|
|
2200
|
-
|
|
2201
|
-
|
|
2202
|
-
|
|
2203
|
-
|
|
2204
|
-
|
|
2205
|
-
|
|
2206
|
-
|
|
2207
|
-
|
|
2108
|
+
const videoProps = function videoProps2(props, state) {
|
|
2109
|
+
return {
|
|
2110
|
+
...props.autoPlay === true ? {
|
|
2111
|
+
autoPlay: true
|
|
2112
|
+
} : {},
|
|
2113
|
+
...props.muted === true ? {
|
|
2114
|
+
muted: true
|
|
2115
|
+
} : {},
|
|
2116
|
+
...props.controls === true ? {
|
|
2117
|
+
controls: true
|
|
2118
|
+
} : {},
|
|
2119
|
+
...props.loop === true ? {
|
|
2120
|
+
loop: true
|
|
2121
|
+
} : {},
|
|
2122
|
+
...props.playsInline === true ? {
|
|
2123
|
+
playsInline: true
|
|
2124
|
+
} : {}
|
|
2125
|
+
};
|
|
2208
2126
|
};
|
|
2209
|
-
const
|
|
2210
|
-
|
|
2211
|
-
|
|
2212
|
-
|
|
2127
|
+
const spreadProps = function spreadProps2(props, state) {
|
|
2128
|
+
return {
|
|
2129
|
+
...props.attributes,
|
|
2130
|
+
...videoProps(props)
|
|
2131
|
+
};
|
|
2132
|
+
};
|
|
2133
|
+
const Video = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
2134
|
+
return /* @__PURE__ */ jsxRuntime.jsx("video", {
|
|
2135
|
+
...spreadProps(props),
|
|
2136
|
+
style: {
|
|
2137
|
+
width: "100%",
|
|
2138
|
+
height: "100%",
|
|
2139
|
+
...props.attributes?.style,
|
|
2140
|
+
objectFit: props.fit,
|
|
2141
|
+
objectPosition: props.position,
|
|
2142
|
+
borderRadius: 1
|
|
2143
|
+
},
|
|
2144
|
+
src: props.video || "no-src",
|
|
2145
|
+
get poster() {
|
|
2146
|
+
return props.posterImage;
|
|
2147
|
+
},
|
|
2148
|
+
[qwik._IMMUTABLE]: {
|
|
2149
|
+
poster: qwik._wrapSignal(props, "posterImage")
|
|
2150
|
+
}
|
|
2213
2151
|
});
|
|
2214
|
-
|
|
2215
|
-
|
|
2216
|
-
|
|
2217
|
-
|
|
2218
|
-
|
|
2219
|
-
|
|
2220
|
-
|
|
2221
|
-
|
|
2222
|
-
|
|
2223
|
-
|
|
2224
|
-
|
|
2225
|
-
|
|
2226
|
-
|
|
2227
|
-
|
|
2228
|
-
|
|
2229
|
-
|
|
2230
|
-
|
|
2231
|
-
|
|
2232
|
-
|
|
2233
|
-
|
|
2234
|
-
|
|
2235
|
-
|
|
2236
|
-
|
|
2152
|
+
}, "Video_component_qdcTZflYyoQ"));
|
|
2153
|
+
const componentInfo$2 = {
|
|
2154
|
+
name: "Embed",
|
|
2155
|
+
static: true,
|
|
2156
|
+
builtIn: true,
|
|
2157
|
+
inputs: [
|
|
2158
|
+
{
|
|
2159
|
+
name: "url",
|
|
2160
|
+
type: "url",
|
|
2161
|
+
required: true,
|
|
2162
|
+
defaultValue: "",
|
|
2163
|
+
helperText: "e.g. enter a youtube url, google map, etc",
|
|
2164
|
+
onChange: serializeFn((options) => {
|
|
2165
|
+
const url = options.get("url");
|
|
2166
|
+
if (url) {
|
|
2167
|
+
options.set("content", "Loading...");
|
|
2168
|
+
const apiKey = "ae0e60e78201a3f2b0de4b";
|
|
2169
|
+
return fetch(`https://iframe.ly/api/iframely?url=${url}&api_key=${apiKey}`).then((res) => res.json()).then((data) => {
|
|
2170
|
+
if (options.get("url") === url) {
|
|
2171
|
+
if (data.html)
|
|
2172
|
+
options.set("content", data.html);
|
|
2173
|
+
else
|
|
2174
|
+
options.set("content", "Invalid url, please try another");
|
|
2175
|
+
}
|
|
2176
|
+
}).catch((_err) => {
|
|
2177
|
+
options.set("content", "There was an error embedding this URL, please try again or another URL");
|
|
2178
|
+
});
|
|
2179
|
+
} else
|
|
2180
|
+
options.delete("content");
|
|
2181
|
+
})
|
|
2182
|
+
},
|
|
2183
|
+
{
|
|
2184
|
+
name: "content",
|
|
2185
|
+
type: "html",
|
|
2186
|
+
defaultValue: '<div style="padding: 20px; text-align: center">(Choose an embed URL)<div>',
|
|
2187
|
+
hideFromUI: true
|
|
2188
|
+
}
|
|
2189
|
+
]
|
|
2237
2190
|
};
|
|
2238
|
-
const
|
|
2239
|
-
|
|
2191
|
+
const SCRIPT_MIME_TYPES = [
|
|
2192
|
+
"text/javascript",
|
|
2193
|
+
"application/javascript",
|
|
2194
|
+
"application/ecmascript"
|
|
2195
|
+
];
|
|
2196
|
+
const isJsScript = (script) => SCRIPT_MIME_TYPES.includes(script.type);
|
|
2197
|
+
const findAndRunScripts$1 = function findAndRunScripts2(props, state, elem) {
|
|
2198
|
+
if (!elem || !elem.getElementsByTagName)
|
|
2240
2199
|
return;
|
|
2241
|
-
const
|
|
2242
|
-
|
|
2243
|
-
|
|
2244
|
-
|
|
2245
|
-
|
|
2200
|
+
const scripts = elem.getElementsByTagName("script");
|
|
2201
|
+
for (let i = 0; i < scripts.length; i++) {
|
|
2202
|
+
const script = scripts[i];
|
|
2203
|
+
if (script.src && !state.scriptsInserted.includes(script.src)) {
|
|
2204
|
+
state.scriptsInserted.push(script.src);
|
|
2205
|
+
const newScript = document.createElement("script");
|
|
2206
|
+
newScript.async = true;
|
|
2207
|
+
newScript.src = script.src;
|
|
2208
|
+
document.head.appendChild(newScript);
|
|
2209
|
+
} else if (isJsScript(script) && !state.scriptsRun.includes(script.innerText))
|
|
2210
|
+
try {
|
|
2211
|
+
state.scriptsRun.push(script.innerText);
|
|
2212
|
+
new Function(script.innerText)();
|
|
2213
|
+
} catch (error) {
|
|
2214
|
+
console.warn("`Embed`: Error running script:", error);
|
|
2215
|
+
}
|
|
2216
|
+
}
|
|
2246
2217
|
};
|
|
2247
|
-
|
|
2248
|
-
|
|
2249
|
-
|
|
2250
|
-
|
|
2251
|
-
|
|
2252
|
-
|
|
2253
|
-
].filter(Boolean).join(separator);
|
|
2254
|
-
const isObject = [
|
|
2255
|
-
typeof value === "object",
|
|
2256
|
-
value !== null,
|
|
2257
|
-
!(Array.isArray(value) && value.length === 0)
|
|
2258
|
-
].every(Boolean);
|
|
2259
|
-
return isObject ? {
|
|
2260
|
-
...acc,
|
|
2261
|
-
...flatten(value, newPath, separator)
|
|
2262
|
-
} : {
|
|
2263
|
-
...acc,
|
|
2264
|
-
[newPath]: value
|
|
2265
|
-
};
|
|
2266
|
-
}, {});
|
|
2267
|
-
}
|
|
2268
|
-
const BUILDER_SEARCHPARAMS_PREFIX = "builder.";
|
|
2269
|
-
const BUILDER_OPTIONS_PREFIX = "options.";
|
|
2270
|
-
const convertSearchParamsToQueryObject = (searchParams) => {
|
|
2271
|
-
const options = {};
|
|
2272
|
-
searchParams.forEach((value, key) => {
|
|
2273
|
-
options[key] = value;
|
|
2218
|
+
const Embed = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
2219
|
+
const elem = qwik.useRef();
|
|
2220
|
+
const state = qwik.useStore({
|
|
2221
|
+
ranInitFn: false,
|
|
2222
|
+
scriptsInserted: [],
|
|
2223
|
+
scriptsRun: []
|
|
2274
2224
|
});
|
|
2275
|
-
|
|
2225
|
+
qwik.useTaskQrl(qwik.inlinedQrl(({ track: track2 }) => {
|
|
2226
|
+
const [elem2, props2, state2] = qwik.useLexicalScope();
|
|
2227
|
+
track2(() => elem2);
|
|
2228
|
+
track2(() => state2.ranInitFn);
|
|
2229
|
+
if (elem2 && !state2.ranInitFn) {
|
|
2230
|
+
state2.ranInitFn = true;
|
|
2231
|
+
findAndRunScripts$1(props2, state2, elem2);
|
|
2232
|
+
}
|
|
2233
|
+
}, "Embed_component_useTask_bg7ez0XUtiM", [
|
|
2234
|
+
elem,
|
|
2235
|
+
props,
|
|
2236
|
+
state
|
|
2237
|
+
]));
|
|
2238
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
2239
|
+
class: "builder-embed",
|
|
2240
|
+
ref: elem,
|
|
2241
|
+
get dangerouslySetInnerHTML() {
|
|
2242
|
+
return props.content;
|
|
2243
|
+
},
|
|
2244
|
+
[qwik._IMMUTABLE]: {
|
|
2245
|
+
dangerouslySetInnerHTML: qwik._wrapSignal(props, "content")
|
|
2246
|
+
}
|
|
2247
|
+
});
|
|
2248
|
+
}, "Embed_component_Uji08ORjXbE"));
|
|
2249
|
+
const ImgComponent = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
2250
|
+
return /* @__PURE__ */ jsxRuntime.jsx("img", {
|
|
2251
|
+
style: {
|
|
2252
|
+
objectFit: props.backgroundSize || "cover",
|
|
2253
|
+
objectPosition: props.backgroundPosition || "center"
|
|
2254
|
+
},
|
|
2255
|
+
get alt() {
|
|
2256
|
+
return props.altText;
|
|
2257
|
+
},
|
|
2258
|
+
src: props.imgSrc || props.image,
|
|
2259
|
+
...props.attributes,
|
|
2260
|
+
[qwik._IMMUTABLE]: {
|
|
2261
|
+
alt: qwik._wrapSignal(props, "altText")
|
|
2262
|
+
}
|
|
2263
|
+
}, isEditing() && props.imgSrc || "default-key");
|
|
2264
|
+
}, "ImgComponent_component_FXvIDBSffO8"));
|
|
2265
|
+
const componentInfo$1 = {
|
|
2266
|
+
name: "Raw:Img",
|
|
2267
|
+
hideFromInsertMenu: true,
|
|
2268
|
+
builtIn: true,
|
|
2269
|
+
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",
|
|
2270
|
+
inputs: [
|
|
2271
|
+
{
|
|
2272
|
+
name: "image",
|
|
2273
|
+
bubble: true,
|
|
2274
|
+
type: "file",
|
|
2275
|
+
allowedFileTypes: [
|
|
2276
|
+
"jpeg",
|
|
2277
|
+
"jpg",
|
|
2278
|
+
"png",
|
|
2279
|
+
"svg"
|
|
2280
|
+
],
|
|
2281
|
+
required: true
|
|
2282
|
+
}
|
|
2283
|
+
],
|
|
2284
|
+
noWrap: true,
|
|
2285
|
+
static: true
|
|
2286
|
+
};
|
|
2287
|
+
const findAndRunScripts = function findAndRunScripts22(props, state, elem) {
|
|
2288
|
+
if (elem && elem.getElementsByTagName && typeof window !== "undefined") {
|
|
2289
|
+
const scripts = elem.getElementsByTagName("script");
|
|
2290
|
+
for (let i = 0; i < scripts.length; i++) {
|
|
2291
|
+
const script = scripts[i];
|
|
2292
|
+
if (script.src) {
|
|
2293
|
+
if (state.scriptsInserted.includes(script.src))
|
|
2294
|
+
continue;
|
|
2295
|
+
state.scriptsInserted.push(script.src);
|
|
2296
|
+
const newScript = document.createElement("script");
|
|
2297
|
+
newScript.async = true;
|
|
2298
|
+
newScript.src = script.src;
|
|
2299
|
+
document.head.appendChild(newScript);
|
|
2300
|
+
} else if (!script.type || [
|
|
2301
|
+
"text/javascript",
|
|
2302
|
+
"application/javascript",
|
|
2303
|
+
"application/ecmascript"
|
|
2304
|
+
].includes(script.type)) {
|
|
2305
|
+
if (state.scriptsRun.includes(script.innerText))
|
|
2306
|
+
continue;
|
|
2307
|
+
try {
|
|
2308
|
+
state.scriptsRun.push(script.innerText);
|
|
2309
|
+
new Function(script.innerText)();
|
|
2310
|
+
} catch (error) {
|
|
2311
|
+
console.warn("`CustomCode`: Error running script:", error);
|
|
2312
|
+
}
|
|
2313
|
+
}
|
|
2314
|
+
}
|
|
2315
|
+
}
|
|
2276
2316
|
};
|
|
2277
|
-
const
|
|
2278
|
-
|
|
2279
|
-
|
|
2280
|
-
|
|
2281
|
-
|
|
2282
|
-
|
|
2283
|
-
|
|
2284
|
-
|
|
2285
|
-
|
|
2317
|
+
const CustomCode = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
2318
|
+
const elem = qwik.useRef();
|
|
2319
|
+
const state = qwik.useStore({
|
|
2320
|
+
scriptsInserted: [],
|
|
2321
|
+
scriptsRun: []
|
|
2322
|
+
});
|
|
2323
|
+
qwik.useClientEffectQrl(qwik.inlinedQrl(() => {
|
|
2324
|
+
const [elem2, props2, state2] = qwik.useLexicalScope();
|
|
2325
|
+
findAndRunScripts(props2, state2, elem2);
|
|
2326
|
+
}, "CustomCode_component_useClientEffect_4w4c951ufB4", [
|
|
2327
|
+
elem,
|
|
2328
|
+
props,
|
|
2329
|
+
state
|
|
2330
|
+
]));
|
|
2331
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
2332
|
+
ref: elem,
|
|
2333
|
+
class: "builder-custom-code" + (props.replaceNodes ? " replace-nodes" : ""),
|
|
2334
|
+
get dangerouslySetInnerHTML() {
|
|
2335
|
+
return props.code;
|
|
2336
|
+
},
|
|
2337
|
+
[qwik._IMMUTABLE]: {
|
|
2338
|
+
dangerouslySetInnerHTML: qwik._wrapSignal(props, "code")
|
|
2286
2339
|
}
|
|
2287
2340
|
});
|
|
2288
|
-
|
|
2289
|
-
|
|
2290
|
-
|
|
2291
|
-
|
|
2292
|
-
|
|
2293
|
-
|
|
2294
|
-
|
|
2341
|
+
}, "CustomCode_component_uYOSy7w7Zqw"));
|
|
2342
|
+
const componentInfo = {
|
|
2343
|
+
name: "Custom Code",
|
|
2344
|
+
static: true,
|
|
2345
|
+
builtIn: true,
|
|
2346
|
+
requiredPermissions: [
|
|
2347
|
+
"editCode"
|
|
2348
|
+
],
|
|
2349
|
+
inputs: [
|
|
2350
|
+
{
|
|
2351
|
+
name: "code",
|
|
2352
|
+
type: "html",
|
|
2353
|
+
required: true,
|
|
2354
|
+
defaultValue: "<p>Hello there, I am custom HTML code!</p>",
|
|
2355
|
+
code: true
|
|
2356
|
+
},
|
|
2357
|
+
{
|
|
2358
|
+
name: "replaceNodes",
|
|
2359
|
+
type: "boolean",
|
|
2360
|
+
helperText: "Preserve server rendered dom nodes",
|
|
2361
|
+
advanced: true
|
|
2362
|
+
},
|
|
2363
|
+
{
|
|
2364
|
+
name: "scriptsClientOnly",
|
|
2365
|
+
type: "boolean",
|
|
2366
|
+
defaultValue: false,
|
|
2367
|
+
helperText: "Only print and run scripts on the client. Important when scripts influence DOM that could be replaced when client loads",
|
|
2368
|
+
advanced: true
|
|
2369
|
+
}
|
|
2370
|
+
]
|
|
2295
2371
|
};
|
|
2296
|
-
const
|
|
2297
|
-
|
|
2298
|
-
|
|
2299
|
-
|
|
2300
|
-
|
|
2301
|
-
|
|
2302
|
-
|
|
2303
|
-
...
|
|
2304
|
-
|
|
2305
|
-
|
|
2306
|
-
|
|
2307
|
-
|
|
2308
|
-
|
|
2309
|
-
|
|
2310
|
-
|
|
2311
|
-
|
|
2312
|
-
|
|
2313
|
-
|
|
2314
|
-
|
|
2315
|
-
|
|
2316
|
-
|
|
2372
|
+
const getDefaultRegisteredComponents = () => [
|
|
2373
|
+
{
|
|
2374
|
+
component: Button,
|
|
2375
|
+
...componentInfo$a
|
|
2376
|
+
},
|
|
2377
|
+
{
|
|
2378
|
+
component: Columns,
|
|
2379
|
+
...componentInfo$9
|
|
2380
|
+
},
|
|
2381
|
+
{
|
|
2382
|
+
component: CustomCode,
|
|
2383
|
+
...componentInfo
|
|
2384
|
+
},
|
|
2385
|
+
{
|
|
2386
|
+
component: Embed,
|
|
2387
|
+
...componentInfo$2
|
|
2388
|
+
},
|
|
2389
|
+
{
|
|
2390
|
+
component: FragmentComponent,
|
|
2391
|
+
...componentInfo$8
|
|
2392
|
+
},
|
|
2393
|
+
{
|
|
2394
|
+
component: Image,
|
|
2395
|
+
...componentInfo$7
|
|
2396
|
+
},
|
|
2397
|
+
{
|
|
2398
|
+
component: ImgComponent,
|
|
2399
|
+
...componentInfo$1
|
|
2400
|
+
},
|
|
2401
|
+
{
|
|
2402
|
+
component: SectionComponent,
|
|
2403
|
+
...componentInfo$6
|
|
2404
|
+
},
|
|
2405
|
+
{
|
|
2406
|
+
component: Symbol$1,
|
|
2407
|
+
...componentInfo$5
|
|
2408
|
+
},
|
|
2409
|
+
{
|
|
2410
|
+
component: Text,
|
|
2411
|
+
...componentInfo$4
|
|
2412
|
+
},
|
|
2413
|
+
{
|
|
2414
|
+
component: Video,
|
|
2415
|
+
...componentInfo$3
|
|
2317
2416
|
}
|
|
2318
|
-
|
|
2319
|
-
};
|
|
2320
|
-
async function getContent(options) {
|
|
2321
|
-
return (await getAllContent({
|
|
2322
|
-
...options,
|
|
2323
|
-
limit: 1
|
|
2324
|
-
})).results[0] || null;
|
|
2325
|
-
}
|
|
2326
|
-
async function getAllContent(options) {
|
|
2327
|
-
const url = generateContentUrl(options);
|
|
2328
|
-
const res = await fetch$1(url.href);
|
|
2329
|
-
const content = await res.json();
|
|
2330
|
-
const canTrack = options.canTrack !== false;
|
|
2331
|
-
if (canTrack && Array.isArray(content.results))
|
|
2332
|
-
for (const item of content.results)
|
|
2333
|
-
await handleABTesting({
|
|
2334
|
-
item,
|
|
2335
|
-
canTrack
|
|
2336
|
-
});
|
|
2337
|
-
return content;
|
|
2338
|
-
}
|
|
2417
|
+
];
|
|
2339
2418
|
function isPreviewing() {
|
|
2340
2419
|
if (!isBrowser())
|
|
2341
2420
|
return false;
|
|
@@ -2596,20 +2675,20 @@ const getInteractionPropertiesForEvent = (event) => {
|
|
|
2596
2675
|
}
|
|
2597
2676
|
};
|
|
2598
2677
|
};
|
|
2599
|
-
const getCssFromFont =
|
|
2678
|
+
const getCssFromFont = (font) => {
|
|
2600
2679
|
const family = font.family + (font.kind && !font.kind.includes("#") ? ", " + font.kind : "");
|
|
2601
2680
|
const name = family.split(",")[0];
|
|
2602
2681
|
const url = font.fileUrl ?? font?.files?.regular;
|
|
2603
2682
|
let str = "";
|
|
2604
2683
|
if (url && family && name)
|
|
2605
2684
|
str += `
|
|
2606
|
-
|
|
2607
|
-
|
|
2608
|
-
|
|
2609
|
-
|
|
2610
|
-
|
|
2611
|
-
|
|
2612
|
-
|
|
2685
|
+
@font-face {
|
|
2686
|
+
font-family: "${family}";
|
|
2687
|
+
src: local("${name}"), url('${url}') format('woff2');
|
|
2688
|
+
font-display: fallback;
|
|
2689
|
+
font-weight: 400;
|
|
2690
|
+
}
|
|
2691
|
+
`.trim();
|
|
2613
2692
|
if (font.files)
|
|
2614
2693
|
for (const weight in font.files) {
|
|
2615
2694
|
const isNumber = String(Number(weight)) === weight;
|
|
@@ -2618,60 +2697,102 @@ const getCssFromFont = function getCssFromFont2(props, state, font) {
|
|
|
2618
2697
|
const weightUrl = font.files[weight];
|
|
2619
2698
|
if (weightUrl && weightUrl !== url)
|
|
2620
2699
|
str += `
|
|
2621
|
-
|
|
2622
|
-
|
|
2623
|
-
|
|
2624
|
-
|
|
2625
|
-
|
|
2626
|
-
|
|
2627
|
-
|
|
2700
|
+
@font-face {
|
|
2701
|
+
font-family: "${family}";
|
|
2702
|
+
src: url('${weightUrl}') format('woff2');
|
|
2703
|
+
font-display: fallback;
|
|
2704
|
+
font-weight: ${weight};
|
|
2705
|
+
}
|
|
2706
|
+
`.trim();
|
|
2628
2707
|
}
|
|
2629
2708
|
return str;
|
|
2630
2709
|
};
|
|
2631
|
-
const getFontCss =
|
|
2632
|
-
return customFonts?.map((font) => getCssFromFont(
|
|
2710
|
+
const getFontCss = ({ customFonts }) => {
|
|
2711
|
+
return customFonts?.map((font) => getCssFromFont(font))?.join(" ") || "";
|
|
2633
2712
|
};
|
|
2634
|
-
const
|
|
2635
|
-
|
|
2636
|
-
|
|
2637
|
-
|
|
2638
|
-
|
|
2639
|
-
})
|
|
2713
|
+
const getCss = ({ cssCode, contentId }) => {
|
|
2714
|
+
if (!cssCode)
|
|
2715
|
+
return "";
|
|
2716
|
+
if (!contentId)
|
|
2717
|
+
return cssCode;
|
|
2718
|
+
return cssCode?.replace(/&/g, `div[builder-content-id="${contentId}"]`) || "";
|
|
2640
2719
|
};
|
|
2641
2720
|
const RenderContentStyles = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
2642
|
-
const state = {
|
|
2721
|
+
const state = qwik.useStore({
|
|
2722
|
+
injectedStyles: `
|
|
2723
|
+
${getCss({
|
|
2724
|
+
cssCode: props.cssCode,
|
|
2725
|
+
contentId: props.contentId
|
|
2726
|
+
})}
|
|
2727
|
+
${getFontCss({
|
|
2728
|
+
customFonts: props.customFonts
|
|
2729
|
+
})}
|
|
2730
|
+
`
|
|
2731
|
+
});
|
|
2643
2732
|
return /* @__PURE__ */ jsxRuntime.jsx(RenderInlinedStyles, {
|
|
2644
|
-
styles
|
|
2733
|
+
get styles() {
|
|
2734
|
+
return state.injectedStyles;
|
|
2735
|
+
},
|
|
2736
|
+
[qwik._IMMUTABLE]: {
|
|
2737
|
+
styles: qwik._wrapSignal(state, "injectedStyles")
|
|
2738
|
+
}
|
|
2645
2739
|
}, "V0_0");
|
|
2646
2740
|
}, "RenderContentStyles_component_Og0xL34Zbvc"));
|
|
2647
|
-
const
|
|
2648
|
-
|
|
2649
|
-
|
|
2741
|
+
const getContextStateInitialValue = ({ content, data, locale }) => {
|
|
2742
|
+
const defaultValues = {};
|
|
2743
|
+
content?.data?.inputs?.forEach((input) => {
|
|
2744
|
+
if (input.name && input.defaultValue !== void 0 && content?.data?.state && content.data.state[input.name] === void 0)
|
|
2745
|
+
defaultValues[input.name] = input.defaultValue;
|
|
2746
|
+
});
|
|
2747
|
+
const stateToUse = {
|
|
2748
|
+
...content?.data?.state,
|
|
2749
|
+
...data,
|
|
2750
|
+
...locale ? {
|
|
2751
|
+
locale
|
|
2752
|
+
} : {}
|
|
2753
|
+
};
|
|
2650
2754
|
return {
|
|
2651
|
-
...
|
|
2652
|
-
...
|
|
2755
|
+
...defaultValues,
|
|
2756
|
+
...stateToUse
|
|
2757
|
+
};
|
|
2758
|
+
};
|
|
2759
|
+
const getContentInitialValue = ({ content, data }) => {
|
|
2760
|
+
return !content ? void 0 : {
|
|
2761
|
+
...content,
|
|
2762
|
+
data: {
|
|
2763
|
+
...content?.data,
|
|
2764
|
+
...data
|
|
2765
|
+
},
|
|
2766
|
+
meta: content?.meta
|
|
2767
|
+
};
|
|
2768
|
+
};
|
|
2769
|
+
const mergeNewContent = function mergeNewContent2(props, state, elementRef, newContent) {
|
|
2770
|
+
state.useContent = {
|
|
2771
|
+
...state.useContent,
|
|
2772
|
+
...newContent,
|
|
2653
2773
|
data: {
|
|
2654
|
-
...
|
|
2655
|
-
...
|
|
2656
|
-
...state.overrideContent?.data
|
|
2774
|
+
...state.useContent?.data,
|
|
2775
|
+
...newContent?.data
|
|
2657
2776
|
},
|
|
2658
2777
|
meta: {
|
|
2659
|
-
...
|
|
2660
|
-
...
|
|
2661
|
-
breakpoints:
|
|
2778
|
+
...state.useContent?.meta,
|
|
2779
|
+
...newContent?.meta,
|
|
2780
|
+
breakpoints: newContent?.meta?.breakpoints || state.useContent?.meta?.breakpoints
|
|
2662
2781
|
}
|
|
2663
2782
|
};
|
|
2664
2783
|
};
|
|
2665
|
-
const
|
|
2666
|
-
|
|
2667
|
-
...
|
|
2668
|
-
|
|
2669
|
-
|
|
2670
|
-
|
|
2671
|
-
}
|
|
2672
|
-
...state.overrideState
|
|
2784
|
+
const setBreakpoints = function setBreakpoints2(props, state, elementRef, breakpoints) {
|
|
2785
|
+
state.useContent = {
|
|
2786
|
+
...state.useContent,
|
|
2787
|
+
meta: {
|
|
2788
|
+
...state.useContent?.meta,
|
|
2789
|
+
breakpoints
|
|
2790
|
+
}
|
|
2673
2791
|
};
|
|
2674
2792
|
};
|
|
2793
|
+
const setContextState = function setContextState2(props, state, elementRef, newState) {
|
|
2794
|
+
state.contentState = newState;
|
|
2795
|
+
};
|
|
2675
2796
|
const processMessage = function processMessage2(props, state, elementRef, event) {
|
|
2676
2797
|
const { data } = event;
|
|
2677
2798
|
if (data)
|
|
@@ -2679,9 +2800,10 @@ const processMessage = function processMessage2(props, state, elementRef, event)
|
|
|
2679
2800
|
case "builder.configureSdk": {
|
|
2680
2801
|
const messageContent = data.data;
|
|
2681
2802
|
const { breakpoints, contentId } = messageContent;
|
|
2682
|
-
if (!contentId || contentId !== useContent
|
|
2803
|
+
if (!contentId || contentId !== state.useContent?.id)
|
|
2683
2804
|
return;
|
|
2684
|
-
|
|
2805
|
+
if (breakpoints)
|
|
2806
|
+
setBreakpoints(props, state, elementRef, breakpoints);
|
|
2685
2807
|
state.forceReRenderCount = state.forceReRenderCount + 1;
|
|
2686
2808
|
break;
|
|
2687
2809
|
}
|
|
@@ -2690,7 +2812,7 @@ const processMessage = function processMessage2(props, state, elementRef, event)
|
|
|
2690
2812
|
const key = messageContent1.key || messageContent1.alias || messageContent1.entry || messageContent1.modelName;
|
|
2691
2813
|
const contentData = messageContent1.data;
|
|
2692
2814
|
if (key === props.model) {
|
|
2693
|
-
state
|
|
2815
|
+
mergeNewContent(props, state, elementRef, contentData);
|
|
2694
2816
|
state.forceReRenderCount = state.forceReRenderCount + 1;
|
|
2695
2817
|
}
|
|
2696
2818
|
break;
|
|
@@ -2698,18 +2820,18 @@ const processMessage = function processMessage2(props, state, elementRef, event)
|
|
|
2698
2820
|
}
|
|
2699
2821
|
};
|
|
2700
2822
|
const evaluateJsCode = function evaluateJsCode2(props, state, elementRef) {
|
|
2701
|
-
const jsCode = useContent
|
|
2823
|
+
const jsCode = state.useContent?.data?.jsCode;
|
|
2702
2824
|
if (jsCode)
|
|
2703
2825
|
evaluate({
|
|
2704
2826
|
code: jsCode,
|
|
2705
|
-
context:
|
|
2706
|
-
state: contentState
|
|
2827
|
+
context: props.context || {},
|
|
2828
|
+
state: state.contentState
|
|
2707
2829
|
});
|
|
2708
2830
|
};
|
|
2709
2831
|
const onClick = function onClick22(props, state, elementRef, event) {
|
|
2710
|
-
if (useContent
|
|
2711
|
-
const variationId = useContent
|
|
2712
|
-
const contentId = useContent
|
|
2832
|
+
if (state.useContent) {
|
|
2833
|
+
const variationId = state.useContent?.testVariationId;
|
|
2834
|
+
const contentId = state.useContent?.id;
|
|
2713
2835
|
_track({
|
|
2714
2836
|
type: "click",
|
|
2715
2837
|
canTrack: state.canTrackToUse,
|
|
@@ -2726,23 +2848,23 @@ const onClick = function onClick22(props, state, elementRef, event) {
|
|
|
2726
2848
|
const evalExpression = function evalExpression2(props, state, elementRef, expression) {
|
|
2727
2849
|
return expression.replace(/{{([^}]+)}}/g, (_match, group) => evaluate({
|
|
2728
2850
|
code: group,
|
|
2729
|
-
context:
|
|
2730
|
-
state: contentState
|
|
2851
|
+
context: props.context || {},
|
|
2852
|
+
state: state.contentState
|
|
2731
2853
|
}));
|
|
2732
2854
|
};
|
|
2733
2855
|
const handleRequest = function handleRequest2(props, state, elementRef, { url, key }) {
|
|
2734
2856
|
fetch$1(url).then((response) => response.json()).then((json) => {
|
|
2735
|
-
const
|
|
2736
|
-
...state.
|
|
2857
|
+
const newState = {
|
|
2858
|
+
...state.contentState,
|
|
2737
2859
|
[key]: json
|
|
2738
2860
|
};
|
|
2739
|
-
state
|
|
2861
|
+
setContextState(props, state, elementRef, newState);
|
|
2740
2862
|
}).catch((err) => {
|
|
2741
2863
|
console.log("error fetching dynamic data", url, err);
|
|
2742
2864
|
});
|
|
2743
2865
|
};
|
|
2744
2866
|
const runHttpRequests = function runHttpRequests2(props, state, elementRef) {
|
|
2745
|
-
const requests = useContent
|
|
2867
|
+
const requests = state.useContent?.data?.httpRequests ?? {};
|
|
2746
2868
|
Object.entries(requests).forEach(([key, url]) => {
|
|
2747
2869
|
if (url && (!state.httpReqsData[key] || isEditing())) {
|
|
2748
2870
|
const evaluatedUrl = evalExpression(props, state, elementRef, url);
|
|
@@ -2757,7 +2879,7 @@ const emitStateUpdate = function emitStateUpdate2(props, state, elementRef) {
|
|
|
2757
2879
|
if (isEditing())
|
|
2758
2880
|
window.dispatchEvent(new CustomEvent("builder:component:stateChange", {
|
|
2759
2881
|
detail: {
|
|
2760
|
-
state: contentState
|
|
2882
|
+
state: state.contentState,
|
|
2761
2883
|
ref: {
|
|
2762
2884
|
name: props.model
|
|
2763
2885
|
}
|
|
@@ -2765,7 +2887,7 @@ const emitStateUpdate = function emitStateUpdate2(props, state, elementRef) {
|
|
|
2765
2887
|
}));
|
|
2766
2888
|
};
|
|
2767
2889
|
const shouldRenderContentStyles = function shouldRenderContentStyles2(props, state, elementRef) {
|
|
2768
|
-
return Boolean((useContent
|
|
2890
|
+
return Boolean((state.useContent?.data?.cssCode || state.useContent?.data?.customFonts?.length) && TARGET !== "reactNative");
|
|
2769
2891
|
};
|
|
2770
2892
|
const RenderContent = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
2771
2893
|
const elementRef = qwik.useRef();
|
|
@@ -2780,18 +2902,24 @@ const RenderContent = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props)
|
|
|
2780
2902
|
}), {}),
|
|
2781
2903
|
canTrackToUse: checkIsDefined(props.canTrack) ? props.canTrack : true,
|
|
2782
2904
|
clicked: false,
|
|
2783
|
-
|
|
2905
|
+
contentState: getContextStateInitialValue({
|
|
2906
|
+
content: props.content,
|
|
2907
|
+
data: props.data,
|
|
2908
|
+
locale: props.locale
|
|
2909
|
+
}),
|
|
2784
2910
|
forceReRenderCount: 0,
|
|
2785
2911
|
httpReqsData: {},
|
|
2786
2912
|
overrideContent: null,
|
|
2787
|
-
overrideState: {},
|
|
2788
2913
|
update: 0,
|
|
2789
|
-
|
|
2914
|
+
useContent: getContentInitialValue({
|
|
2915
|
+
content: props.content,
|
|
2916
|
+
data: props.data
|
|
2917
|
+
})
|
|
2790
2918
|
});
|
|
2791
|
-
qwik.useContextProvider(
|
|
2792
|
-
content: useContent
|
|
2793
|
-
state: contentState
|
|
2794
|
-
context:
|
|
2919
|
+
qwik.useContextProvider(builderContext, qwik.useStore({
|
|
2920
|
+
content: state.useContent,
|
|
2921
|
+
state: state.contentState,
|
|
2922
|
+
context: props.context || {},
|
|
2795
2923
|
apiKey: props.apiKey,
|
|
2796
2924
|
registeredComponents: state.allRegisteredComponents
|
|
2797
2925
|
}));
|
|
@@ -2818,9 +2946,9 @@ const RenderContent = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props)
|
|
|
2818
2946
|
window.addEventListener("message", processMessage.bind(null, props2, state2, elementRef2));
|
|
2819
2947
|
window.addEventListener("builder:component:stateChangeListenerActivated", emitStateUpdate.bind(null, props2, state2, elementRef2));
|
|
2820
2948
|
}
|
|
2821
|
-
if (useContent
|
|
2822
|
-
const variationId = useContent
|
|
2823
|
-
const contentId = useContent
|
|
2949
|
+
if (state2.useContent) {
|
|
2950
|
+
const variationId = state2.useContent?.testVariationId;
|
|
2951
|
+
const contentId = state2.useContent?.id;
|
|
2824
2952
|
_track({
|
|
2825
2953
|
type: "impression",
|
|
2826
2954
|
canTrack: state2.canTrackToUse,
|
|
@@ -2839,7 +2967,7 @@ const RenderContent = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props)
|
|
|
2839
2967
|
apiKey: props2.apiKey
|
|
2840
2968
|
}).then((content) => {
|
|
2841
2969
|
if (content)
|
|
2842
|
-
state2
|
|
2970
|
+
mergeNewContent(props2, state2, elementRef2, content);
|
|
2843
2971
|
});
|
|
2844
2972
|
}
|
|
2845
2973
|
evaluateJsCode(props2, state2);
|
|
@@ -2851,30 +2979,30 @@ const RenderContent = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props)
|
|
|
2851
2979
|
props,
|
|
2852
2980
|
state
|
|
2853
2981
|
]));
|
|
2854
|
-
qwik.
|
|
2982
|
+
qwik.useTaskQrl(qwik.inlinedQrl(({ track: track2 }) => {
|
|
2855
2983
|
const [elementRef2, props2, state2] = qwik.useLexicalScope();
|
|
2856
|
-
|
|
2857
|
-
|
|
2984
|
+
track2(() => state2.useContent?.data?.jsCode);
|
|
2985
|
+
track2(() => state2.contentState);
|
|
2858
2986
|
evaluateJsCode(props2, state2);
|
|
2859
|
-
}, "
|
|
2987
|
+
}, "RenderContent_component_useTask_Kulmlf9pM08", [
|
|
2860
2988
|
elementRef,
|
|
2861
2989
|
props,
|
|
2862
2990
|
state
|
|
2863
2991
|
]));
|
|
2864
|
-
qwik.
|
|
2992
|
+
qwik.useTaskQrl(qwik.inlinedQrl(({ track: track2 }) => {
|
|
2865
2993
|
const [elementRef2, props2, state2] = qwik.useLexicalScope();
|
|
2866
|
-
|
|
2994
|
+
track2(() => state2.useContent?.data?.httpRequests);
|
|
2867
2995
|
runHttpRequests(props2, state2, elementRef2);
|
|
2868
|
-
}, "
|
|
2996
|
+
}, "RenderContent_component_useTask_1_X59YMGOetns", [
|
|
2869
2997
|
elementRef,
|
|
2870
2998
|
props,
|
|
2871
2999
|
state
|
|
2872
3000
|
]));
|
|
2873
|
-
qwik.
|
|
3001
|
+
qwik.useTaskQrl(qwik.inlinedQrl(({ track: track2 }) => {
|
|
2874
3002
|
const [elementRef2, props2, state2] = qwik.useLexicalScope();
|
|
2875
|
-
|
|
3003
|
+
track2(() => state2.contentState);
|
|
2876
3004
|
emitStateUpdate(props2, state2);
|
|
2877
|
-
}, "
|
|
3005
|
+
}, "RenderContent_component_useTask_2_u3gn3Pj2b2s", [
|
|
2878
3006
|
elementRef,
|
|
2879
3007
|
props,
|
|
2880
3008
|
state
|
|
@@ -2891,7 +3019,7 @@ const RenderContent = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props)
|
|
|
2891
3019
|
state
|
|
2892
3020
|
]));
|
|
2893
3021
|
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {
|
|
2894
|
-
children: useContent
|
|
3022
|
+
children: state.useContent ? /* @__PURE__ */ jsxRuntime.jsxs("div", {
|
|
2895
3023
|
ref: elementRef,
|
|
2896
3024
|
onClick$: qwik.inlinedQrl((event) => {
|
|
2897
3025
|
const [elementRef2, props2, state2] = qwik.useLexicalScope();
|
|
@@ -2901,17 +3029,18 @@ const RenderContent = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props)
|
|
|
2901
3029
|
props,
|
|
2902
3030
|
state
|
|
2903
3031
|
]),
|
|
2904
|
-
"builder-content-id": useContent
|
|
3032
|
+
"builder-content-id": state.useContent?.id,
|
|
2905
3033
|
get "builder-model"() {
|
|
2906
3034
|
return props.model;
|
|
2907
3035
|
},
|
|
2908
3036
|
children: [
|
|
2909
3037
|
shouldRenderContentStyles(props, state) ? /* @__PURE__ */ jsxRuntime.jsx(RenderContentStyles, {
|
|
2910
|
-
|
|
2911
|
-
|
|
3038
|
+
contentId: state.useContent?.id,
|
|
3039
|
+
cssCode: state.useContent?.data?.cssCode,
|
|
3040
|
+
customFonts: state.useContent?.data?.customFonts
|
|
2912
3041
|
}, "03_0") : null,
|
|
2913
3042
|
/* @__PURE__ */ jsxRuntime.jsx(RenderBlocks, {
|
|
2914
|
-
blocks: useContent
|
|
3043
|
+
blocks: state.useContent?.data?.blocks
|
|
2915
3044
|
}, state.forceReRenderCount)
|
|
2916
3045
|
],
|
|
2917
3046
|
[qwik._IMMUTABLE]: {
|
|
@@ -2924,69 +3053,7 @@ const RenderContent = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props)
|
|
|
2924
3053
|
}
|
|
2925
3054
|
}, "03_1");
|
|
2926
3055
|
}, "RenderContent_component_hEAI0ahViXM"));
|
|
2927
|
-
const
|
|
2928
|
-
return [
|
|
2929
|
-
...[
|
|
2930
|
-
props.attributes.class
|
|
2931
|
-
],
|
|
2932
|
-
"builder-symbol",
|
|
2933
|
-
props.symbol?.inline ? "builder-inline-symbol" : void 0,
|
|
2934
|
-
props.symbol?.dynamic || props.dynamic ? "builder-dynamic-symbol" : void 0
|
|
2935
|
-
].filter(Boolean).join(" ");
|
|
2936
|
-
};
|
|
2937
|
-
const contentToUse = function contentToUse2(props, state, builderContext) {
|
|
2938
|
-
return props.symbol?.content || state.fetchedContent;
|
|
2939
|
-
};
|
|
2940
|
-
const Symbol$1 = /* @__PURE__ */ qwik.componentQrl(qwik.inlinedQrl((props) => {
|
|
2941
|
-
const builderContext = qwik.useContext(BuilderContext);
|
|
2942
|
-
const state = qwik.useStore({
|
|
2943
|
-
fetchedContent: null
|
|
2944
|
-
});
|
|
2945
|
-
qwik.useWatchQrl(qwik.inlinedQrl(({ track: track2 }) => {
|
|
2946
|
-
const [builderContext2, props2, state2] = qwik.useLexicalScope();
|
|
2947
|
-
props2 && track2(props2, "symbol");
|
|
2948
|
-
state2 && track2(state2, "fetchedContent");
|
|
2949
|
-
const symbolToUse = props2.symbol;
|
|
2950
|
-
if (symbolToUse && !symbolToUse.content && !state2.fetchedContent && symbolToUse.model && builderContext2?.apiKey)
|
|
2951
|
-
getContent({
|
|
2952
|
-
model: symbolToUse.model,
|
|
2953
|
-
apiKey: builderContext2.apiKey,
|
|
2954
|
-
query: {
|
|
2955
|
-
id: symbolToUse.entry
|
|
2956
|
-
}
|
|
2957
|
-
}).then((response) => {
|
|
2958
|
-
state2.fetchedContent = response;
|
|
2959
|
-
});
|
|
2960
|
-
}, "Symbol_component_useWatch_9HNT04zd0Dk", [
|
|
2961
|
-
builderContext,
|
|
2962
|
-
props,
|
|
2963
|
-
state
|
|
2964
|
-
]));
|
|
2965
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
2966
|
-
...props.attributes,
|
|
2967
|
-
class: className(props),
|
|
2968
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(RenderContent, {
|
|
2969
|
-
get apiKey() {
|
|
2970
|
-
return builderContext.apiKey;
|
|
2971
|
-
},
|
|
2972
|
-
get context() {
|
|
2973
|
-
return builderContext.context;
|
|
2974
|
-
},
|
|
2975
|
-
customComponents: Object.values(builderContext.registeredComponents),
|
|
2976
|
-
data: {
|
|
2977
|
-
...props.symbol?.data,
|
|
2978
|
-
...builderContext.state,
|
|
2979
|
-
...props.symbol?.content?.data?.state
|
|
2980
|
-
},
|
|
2981
|
-
model: props.symbol?.model,
|
|
2982
|
-
content: contentToUse(props, state),
|
|
2983
|
-
[qwik._IMMUTABLE]: {
|
|
2984
|
-
apiKey: qwik._wrapSignal(builderContext, "apiKey"),
|
|
2985
|
-
context: qwik._wrapSignal(builderContext, "context")
|
|
2986
|
-
}
|
|
2987
|
-
}, "Wt_0")
|
|
2988
|
-
});
|
|
2989
|
-
}, "Symbol_component_WVvggdkUPdk"));
|
|
3056
|
+
const RenderContent$1 = RenderContent;
|
|
2990
3057
|
const settings = {};
|
|
2991
3058
|
function setEditorSettings(newSettings) {
|
|
2992
3059
|
if (isBrowser()) {
|
|
@@ -3003,7 +3070,7 @@ exports.Columns = Columns;
|
|
|
3003
3070
|
exports.Fragment = FragmentComponent;
|
|
3004
3071
|
exports.Image = Image;
|
|
3005
3072
|
exports.RenderBlocks = RenderBlocks;
|
|
3006
|
-
exports.RenderContent = RenderContent;
|
|
3073
|
+
exports.RenderContent = RenderContent$1;
|
|
3007
3074
|
exports.Section = SectionComponent;
|
|
3008
3075
|
exports.Symbol = Symbol$1;
|
|
3009
3076
|
exports.Text = Text;
|