@builder.io/sdk-solid 0.12.3 → 0.12.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +23 -14
- package/lib/browser/dev.js +243 -161
- package/lib/browser/dev.jsx +185 -118
- package/lib/browser/index.js +243 -161
- package/lib/browser/index.jsx +185 -118
- package/lib/edge/dev.js +243 -161
- package/lib/edge/dev.jsx +185 -118
- package/lib/edge/index.js +243 -161
- package/lib/edge/index.jsx +185 -118
- package/lib/node/dev.js +243 -161
- package/lib/node/dev.jsx +185 -118
- package/lib/node/index.js +243 -161
- package/lib/node/index.jsx +185 -118
- package/package.json +1 -1
package/lib/node/index.jsx
CHANGED
|
@@ -1,31 +1,81 @@
|
|
|
1
|
-
// src/
|
|
1
|
+
// src/components/dynamic-renderer/dynamic-renderer.tsx
|
|
2
2
|
import { Show } from "solid-js";
|
|
3
|
-
|
|
3
|
+
import { Dynamic } from "solid-js/web";
|
|
4
|
+
|
|
5
|
+
// src/components/dynamic-renderer/dynamic-renderer.helpers.ts
|
|
6
|
+
var EMPTY_HTML_ELEMENTS = /* @__PURE__ */ new Set(["area", "base", "br", "col", "embed", "hr", "img", "input", "keygen", "link", "meta", "param", "source", "track", "wbr"]);
|
|
7
|
+
var isEmptyElement = (tagName) => {
|
|
8
|
+
return typeof tagName === "string" && EMPTY_HTML_ELEMENTS.has(tagName.toLowerCase());
|
|
9
|
+
};
|
|
10
|
+
|
|
11
|
+
// src/components/dynamic-renderer/dynamic-renderer.tsx
|
|
12
|
+
function DynamicRenderer(props) {
|
|
4
13
|
return <Show
|
|
5
|
-
fallback={<
|
|
6
|
-
class={`builder-button ${props.attributes.class}`}
|
|
7
|
-
role="button"
|
|
8
|
-
{...{}}
|
|
14
|
+
fallback={<Dynamic
|
|
9
15
|
{...props.attributes}
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
16
|
+
{...props.actionAttributes}
|
|
17
|
+
component={props.TagName}
|
|
18
|
+
/>}
|
|
19
|
+
when={!isEmptyElement(props.TagName)}
|
|
20
|
+
><Show
|
|
21
|
+
fallback={<Dynamic
|
|
22
|
+
{...props.attributes}
|
|
23
|
+
{...props.actionAttributes}
|
|
24
|
+
component={props.TagName}
|
|
25
|
+
>{props.children}</Dynamic>}
|
|
26
|
+
when={typeof props.TagName === "string"}
|
|
27
|
+
><Dynamic
|
|
15
28
|
{...props.attributes}
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
29
|
+
{...props.actionAttributes}
|
|
30
|
+
component={props.TagName}
|
|
31
|
+
>{props.children}</Dynamic></Show></Show>;
|
|
32
|
+
}
|
|
33
|
+
var Dynamic_renderer_default = DynamicRenderer;
|
|
34
|
+
|
|
35
|
+
// src/constants/target.ts
|
|
36
|
+
var TARGET = "solid";
|
|
37
|
+
|
|
38
|
+
// src/functions/get-class-prop-name.ts
|
|
39
|
+
var getClassPropName = () => {
|
|
40
|
+
switch (TARGET) {
|
|
41
|
+
case "react":
|
|
42
|
+
case "reactNative":
|
|
43
|
+
case "rsc":
|
|
44
|
+
return "className";
|
|
45
|
+
case "svelte":
|
|
46
|
+
case "vue":
|
|
47
|
+
case "solid":
|
|
48
|
+
case "qwik":
|
|
49
|
+
return "class";
|
|
50
|
+
}
|
|
51
|
+
};
|
|
52
|
+
|
|
53
|
+
// src/blocks/button/button.tsx
|
|
54
|
+
function Button(props) {
|
|
55
|
+
return <Dynamic_renderer_default
|
|
56
|
+
TagName={props.link ? props.builderLinkComponent || "a" : "button"}
|
|
57
|
+
attributes={{
|
|
58
|
+
...props.attributes,
|
|
59
|
+
[getClassPropName()]: `${props.link ? "" : "builder-button"} ${props.attributes[getClassPropName()] || ""}`,
|
|
60
|
+
...props.link ? {
|
|
61
|
+
href: props.link,
|
|
62
|
+
target: props.openLinkInNewTab ? "_blank" : void 0,
|
|
63
|
+
role: "link"
|
|
64
|
+
} : {
|
|
65
|
+
role: "button"
|
|
66
|
+
}
|
|
67
|
+
}}
|
|
68
|
+
actionAttributes={{}}
|
|
69
|
+
>{props.text}</Dynamic_renderer_default>;
|
|
20
70
|
}
|
|
21
71
|
var button_default = Button;
|
|
22
72
|
|
|
23
73
|
// src/blocks/columns/columns.tsx
|
|
24
|
-
import { Show as
|
|
74
|
+
import { Show as Show6, For as For4, createSignal as createSignal5 } from "solid-js";
|
|
25
75
|
import { css as css2 } from "solid-styled-components";
|
|
26
76
|
|
|
27
77
|
// src/components/blocks/blocks.tsx
|
|
28
|
-
import { useContext, Show as
|
|
78
|
+
import { useContext, Show as Show5, For as For3 } from "solid-js";
|
|
29
79
|
|
|
30
80
|
// src/context/builder.context.ts
|
|
31
81
|
import { createContext } from "solid-js";
|
|
@@ -49,7 +99,7 @@ import { createContext as createContext2 } from "solid-js";
|
|
|
49
99
|
var components_context_default = createContext2({ registeredComponents: {} });
|
|
50
100
|
|
|
51
101
|
// src/components/block/block.tsx
|
|
52
|
-
import { Show as
|
|
102
|
+
import { Show as Show4, For as For2, createSignal as createSignal4 } from "solid-js";
|
|
53
103
|
|
|
54
104
|
// src/functions/get-block-component-options.ts
|
|
55
105
|
function getBlockComponentOptions(block) {
|
|
@@ -76,9 +126,6 @@ function isBrowser() {
|
|
|
76
126
|
return typeof window !== "undefined" && typeof document !== "undefined";
|
|
77
127
|
}
|
|
78
128
|
|
|
79
|
-
// src/constants/target.ts
|
|
80
|
-
var TARGET = "solid";
|
|
81
|
-
|
|
82
129
|
// src/functions/is-iframe.ts
|
|
83
130
|
function isIframe() {
|
|
84
131
|
return isBrowser() && window.self !== window.top;
|
|
@@ -709,6 +756,38 @@ function getBlockActions(options) {
|
|
|
709
756
|
return obj;
|
|
710
757
|
}
|
|
711
758
|
|
|
759
|
+
// src/functions/transform-style-property.ts
|
|
760
|
+
function transformStyleProperty({
|
|
761
|
+
style
|
|
762
|
+
}) {
|
|
763
|
+
return style;
|
|
764
|
+
}
|
|
765
|
+
|
|
766
|
+
// src/functions/get-style.ts
|
|
767
|
+
var getStyle = ({
|
|
768
|
+
block,
|
|
769
|
+
context
|
|
770
|
+
}) => {
|
|
771
|
+
return mapStyleObjToStrIfNeeded(transformStyleProperty({
|
|
772
|
+
style: block.style || {},
|
|
773
|
+
context,
|
|
774
|
+
block
|
|
775
|
+
}));
|
|
776
|
+
};
|
|
777
|
+
function mapStyleObjToStrIfNeeded(style) {
|
|
778
|
+
switch (TARGET) {
|
|
779
|
+
case "svelte":
|
|
780
|
+
case "vue":
|
|
781
|
+
case "solid":
|
|
782
|
+
return convertStyleMapToCSSArray(style).join(" ");
|
|
783
|
+
case "qwik":
|
|
784
|
+
case "reactNative":
|
|
785
|
+
case "react":
|
|
786
|
+
case "rsc":
|
|
787
|
+
return style;
|
|
788
|
+
}
|
|
789
|
+
}
|
|
790
|
+
|
|
712
791
|
// src/functions/transform-block-properties.ts
|
|
713
792
|
function transformBlockProperties({
|
|
714
793
|
properties
|
|
@@ -730,8 +809,11 @@ function getBlockProperties({
|
|
|
730
809
|
...extractRelevantRootBlockProperties(block),
|
|
731
810
|
...block.properties,
|
|
732
811
|
"builder-id": block.id,
|
|
733
|
-
style:
|
|
734
|
-
|
|
812
|
+
style: getStyle({
|
|
813
|
+
block,
|
|
814
|
+
context
|
|
815
|
+
}),
|
|
816
|
+
[getClassPropName()]: [block.id, "builder-block", block.class, block.properties?.class].filter(Boolean).join(" ")
|
|
735
817
|
};
|
|
736
818
|
return transformBlockProperties({
|
|
737
819
|
properties,
|
|
@@ -739,53 +821,6 @@ function getBlockProperties({
|
|
|
739
821
|
block
|
|
740
822
|
});
|
|
741
823
|
}
|
|
742
|
-
function getStyleAttribute(style) {
|
|
743
|
-
switch (TARGET) {
|
|
744
|
-
case "svelte":
|
|
745
|
-
case "vue":
|
|
746
|
-
case "solid":
|
|
747
|
-
return convertStyleMapToCSSArray(style).join(" ");
|
|
748
|
-
case "qwik":
|
|
749
|
-
case "reactNative":
|
|
750
|
-
case "react":
|
|
751
|
-
case "rsc":
|
|
752
|
-
return style;
|
|
753
|
-
}
|
|
754
|
-
}
|
|
755
|
-
|
|
756
|
-
// src/components/dynamic-renderer/dynamic-renderer.tsx
|
|
757
|
-
import { Show as Show3 } from "solid-js";
|
|
758
|
-
import { Dynamic } from "solid-js/web";
|
|
759
|
-
|
|
760
|
-
// src/components/dynamic-renderer/dynamic-renderer.helpers.ts
|
|
761
|
-
var EMPTY_HTML_ELEMENTS = /* @__PURE__ */ new Set(["area", "base", "br", "col", "embed", "hr", "img", "input", "keygen", "link", "meta", "param", "source", "track", "wbr"]);
|
|
762
|
-
var isEmptyElement = (tagName) => {
|
|
763
|
-
return typeof tagName === "string" && EMPTY_HTML_ELEMENTS.has(tagName.toLowerCase());
|
|
764
|
-
};
|
|
765
|
-
|
|
766
|
-
// src/components/dynamic-renderer/dynamic-renderer.tsx
|
|
767
|
-
function DynamicRenderer(props) {
|
|
768
|
-
return <Show3
|
|
769
|
-
fallback={<Dynamic
|
|
770
|
-
{...props.attributes}
|
|
771
|
-
{...props.actionAttributes}
|
|
772
|
-
component={props.TagName}
|
|
773
|
-
/>}
|
|
774
|
-
when={!isEmptyElement(props.TagName)}
|
|
775
|
-
><Show3
|
|
776
|
-
fallback={<Dynamic
|
|
777
|
-
{...props.attributes}
|
|
778
|
-
{...props.actionAttributes}
|
|
779
|
-
component={props.TagName}
|
|
780
|
-
>{props.children}</Dynamic>}
|
|
781
|
-
when={typeof props.TagName === "string"}
|
|
782
|
-
><Dynamic
|
|
783
|
-
{...props.attributes}
|
|
784
|
-
{...props.actionAttributes}
|
|
785
|
-
component={props.TagName}
|
|
786
|
-
>{props.children}</Dynamic></Show3></Show3>;
|
|
787
|
-
}
|
|
788
|
-
var Dynamic_renderer_default = DynamicRenderer;
|
|
789
824
|
|
|
790
825
|
// src/components/block/components/block-wrapper.tsx
|
|
791
826
|
function BlockWrapper(props) {
|
|
@@ -808,7 +843,7 @@ function BlockWrapper(props) {
|
|
|
808
843
|
var Block_wrapper_default = BlockWrapper;
|
|
809
844
|
|
|
810
845
|
// src/components/block/components/component-ref/component-ref.tsx
|
|
811
|
-
import { Show as
|
|
846
|
+
import { Show as Show3, For, createSignal as createSignal2 } from "solid-js";
|
|
812
847
|
import { Dynamic as Dynamic3 } from "solid-js/web";
|
|
813
848
|
|
|
814
849
|
// src/components/block/components/interactive-element.tsx
|
|
@@ -872,12 +907,13 @@ function ComponentRef(props) {
|
|
|
872
907
|
const [Wrapper, setWrapper] = createSignal2(
|
|
873
908
|
props.isInteractive ? interactive_element_default : props.componentRef
|
|
874
909
|
);
|
|
875
|
-
return <
|
|
910
|
+
return <Show3 when={props.componentRef}><Dynamic3
|
|
876
911
|
{...getWrapperProps({
|
|
877
912
|
componentOptions: props.componentOptions,
|
|
878
913
|
builderBlock: props.builderBlock,
|
|
879
914
|
context: props.context,
|
|
880
915
|
componentRef: props.componentRef,
|
|
916
|
+
linkComponent: props.linkComponent,
|
|
881
917
|
includeBlockProps: props.includeBlockProps,
|
|
882
918
|
isInteractive: props.isInteractive,
|
|
883
919
|
contextValue: props.context
|
|
@@ -890,8 +926,9 @@ function ComponentRef(props) {
|
|
|
890
926
|
block={child}
|
|
891
927
|
context={props.context}
|
|
892
928
|
registeredComponents={props.registeredComponents}
|
|
929
|
+
linkComponent={props.linkComponent}
|
|
893
930
|
/>;
|
|
894
|
-
}}</For></Dynamic3></
|
|
931
|
+
}}</For></Dynamic3></Show3>;
|
|
895
932
|
}
|
|
896
933
|
var Component_ref_default = ComponentRef;
|
|
897
934
|
|
|
@@ -903,6 +940,7 @@ function RepeatedBlock(props) {
|
|
|
903
940
|
block={props.block}
|
|
904
941
|
context={store()}
|
|
905
942
|
registeredComponents={props.registeredComponents}
|
|
943
|
+
linkComponent={props.linkComponent}
|
|
906
944
|
/></builder_context_default.Provider>;
|
|
907
945
|
}
|
|
908
946
|
var Repeated_block_default = RepeatedBlock;
|
|
@@ -934,6 +972,10 @@ function Block(props) {
|
|
|
934
972
|
});
|
|
935
973
|
}
|
|
936
974
|
function Tag() {
|
|
975
|
+
const shouldUseLink = props.block.tagName === "a" || processedBlock().properties?.href || processedBlock().href;
|
|
976
|
+
if (shouldUseLink) {
|
|
977
|
+
return props.linkComponent || "a";
|
|
978
|
+
}
|
|
937
979
|
return props.block.tagName || "div";
|
|
938
980
|
}
|
|
939
981
|
function canShowBlock() {
|
|
@@ -957,32 +999,37 @@ function Block(props) {
|
|
|
957
999
|
componentOptions: {
|
|
958
1000
|
...getBlockComponentOptions(processedBlock()),
|
|
959
1001
|
builderContext: props.context,
|
|
1002
|
+
...blockComponent()?.name === "Core:Button" || blockComponent()?.name === "Symbol" || blockComponent()?.name === "Columns" ? {
|
|
1003
|
+
builderLinkComponent: props.linkComponent
|
|
1004
|
+
} : {},
|
|
960
1005
|
...blockComponent()?.name === "Symbol" || blockComponent()?.name === "Columns" ? {
|
|
961
1006
|
builderComponents: props.registeredComponents
|
|
962
1007
|
} : {}
|
|
963
1008
|
},
|
|
964
1009
|
context: childrenContext(),
|
|
1010
|
+
linkComponent: props.linkComponent,
|
|
965
1011
|
registeredComponents: props.registeredComponents,
|
|
966
1012
|
builderBlock: processedBlock(),
|
|
967
1013
|
includeBlockProps: blockComponent()?.noWrap === true,
|
|
968
1014
|
isInteractive: !blockComponent()?.isRSC
|
|
969
1015
|
};
|
|
970
1016
|
}
|
|
971
|
-
return <
|
|
1017
|
+
return <Show4 when={canShowBlock()}>
|
|
972
1018
|
<Block_styles_default block={props.block} context={props.context} />
|
|
973
|
-
<
|
|
1019
|
+
<Show4
|
|
974
1020
|
fallback={<Component_ref_default
|
|
975
1021
|
componentRef={componentRefProps().componentRef}
|
|
976
1022
|
componentOptions={componentRefProps().componentOptions}
|
|
977
1023
|
blockChildren={componentRefProps().blockChildren}
|
|
978
1024
|
context={componentRefProps().context}
|
|
979
1025
|
registeredComponents={componentRefProps().registeredComponents}
|
|
1026
|
+
linkComponent={componentRefProps().linkComponent}
|
|
980
1027
|
builderBlock={componentRefProps().builderBlock}
|
|
981
1028
|
includeBlockProps={componentRefProps().includeBlockProps}
|
|
982
1029
|
isInteractive={componentRefProps().isInteractive}
|
|
983
1030
|
/>}
|
|
984
1031
|
when={!blockComponent()?.noWrap}
|
|
985
|
-
><
|
|
1032
|
+
><Show4
|
|
986
1033
|
fallback={<For2 each={repeatItem()}>{(data, _index) => {
|
|
987
1034
|
const index = _index();
|
|
988
1035
|
return <Repeated_block_default
|
|
@@ -990,6 +1037,7 @@ function Block(props) {
|
|
|
990
1037
|
repeatContext={data.context}
|
|
991
1038
|
block={data.block}
|
|
992
1039
|
registeredComponents={props.registeredComponents}
|
|
1040
|
+
linkComponent={props.linkComponent}
|
|
993
1041
|
/>;
|
|
994
1042
|
}}</For2>}
|
|
995
1043
|
when={!repeatItem()}
|
|
@@ -997,6 +1045,7 @@ function Block(props) {
|
|
|
997
1045
|
Wrapper={Tag()}
|
|
998
1046
|
block={processedBlock()}
|
|
999
1047
|
context={props.context}
|
|
1048
|
+
linkComponent={props.linkComponent}
|
|
1000
1049
|
>
|
|
1001
1050
|
<Component_ref_default
|
|
1002
1051
|
componentRef={componentRefProps().componentRef}
|
|
@@ -1004,6 +1053,7 @@ function Block(props) {
|
|
|
1004
1053
|
blockChildren={componentRefProps().blockChildren}
|
|
1005
1054
|
context={componentRefProps().context}
|
|
1006
1055
|
registeredComponents={componentRefProps().registeredComponents}
|
|
1056
|
+
linkComponent={componentRefProps().linkComponent}
|
|
1007
1057
|
builderBlock={componentRefProps().builderBlock}
|
|
1008
1058
|
includeBlockProps={componentRefProps().includeBlockProps}
|
|
1009
1059
|
isInteractive={componentRefProps().isInteractive}
|
|
@@ -1015,10 +1065,11 @@ function Block(props) {
|
|
|
1015
1065
|
block={child}
|
|
1016
1066
|
context={childrenContext()}
|
|
1017
1067
|
registeredComponents={props.registeredComponents}
|
|
1068
|
+
linkComponent={props.linkComponent}
|
|
1018
1069
|
/>;
|
|
1019
1070
|
}}</For2>
|
|
1020
|
-
</Block_wrapper_default></
|
|
1021
|
-
</
|
|
1071
|
+
</Block_wrapper_default></Show4></Show4>
|
|
1072
|
+
</Show4>;
|
|
1022
1073
|
}
|
|
1023
1074
|
var Block_default = Block;
|
|
1024
1075
|
|
|
@@ -1087,15 +1138,16 @@ function Blocks(props) {
|
|
|
1087
1138
|
styleProp={props.styleProp}
|
|
1088
1139
|
BlocksWrapper={props.context?.BlocksWrapper}
|
|
1089
1140
|
BlocksWrapperProps={props.context?.BlocksWrapperProps}
|
|
1090
|
-
><
|
|
1141
|
+
><Show5 when={props.blocks}><For3 each={props.blocks}>{(block, _index) => {
|
|
1091
1142
|
const index = _index();
|
|
1092
1143
|
return <Block_default
|
|
1093
1144
|
key={block.id}
|
|
1094
1145
|
block={block}
|
|
1146
|
+
linkComponent={props.linkComponent}
|
|
1095
1147
|
context={props.context || builderContext}
|
|
1096
1148
|
registeredComponents={props.registeredComponents || componentsContext.registeredComponents}
|
|
1097
1149
|
/>;
|
|
1098
|
-
}}</For3></
|
|
1150
|
+
}}</For3></Show5></Blocks_wrapper_default>;
|
|
1099
1151
|
}
|
|
1100
1152
|
var Blocks_default = Blocks;
|
|
1101
1153
|
|
|
@@ -1144,7 +1196,13 @@ function Columns(props) {
|
|
|
1144
1196
|
const mobileWidth = "100%";
|
|
1145
1197
|
const mobileMarginLeft = 0;
|
|
1146
1198
|
const marginLeftKey = "margin-left";
|
|
1199
|
+
const sharedStyles = {
|
|
1200
|
+
display: "flex",
|
|
1201
|
+
flexDirection: "column",
|
|
1202
|
+
alignItems: "stretch"
|
|
1203
|
+
};
|
|
1147
1204
|
return {
|
|
1205
|
+
...sharedStyles,
|
|
1148
1206
|
width,
|
|
1149
1207
|
[marginLeftKey]: gutterPixels,
|
|
1150
1208
|
"--column-width-mobile": getMobileStyle({
|
|
@@ -1206,18 +1264,21 @@ function Columns(props) {
|
|
|
1206
1264
|
style={columnsCssVars()}
|
|
1207
1265
|
{...{}}
|
|
1208
1266
|
>
|
|
1209
|
-
<
|
|
1267
|
+
<Show6 when={TARGET !== "reactNative"}><Inlined_styles_default styles={columnsStyles()} /></Show6>
|
|
1210
1268
|
<For4 each={props.columns}>{(column, _index) => {
|
|
1211
1269
|
const index = _index();
|
|
1212
|
-
return <
|
|
1213
|
-
class={"builder-column " + css2({
|
|
1214
|
-
display: "flex",
|
|
1215
|
-
flexDirection: "column",
|
|
1216
|
-
alignItems: "stretch"
|
|
1217
|
-
})}
|
|
1218
|
-
style={columnCssVars(index)}
|
|
1219
|
-
{...{}}
|
|
1270
|
+
return <Dynamic_renderer_default
|
|
1220
1271
|
key={index}
|
|
1272
|
+
TagName={column.link ? props.builderLinkComponent || "a" : "div"}
|
|
1273
|
+
actionAttributes={{}}
|
|
1274
|
+
attributes={{
|
|
1275
|
+
...{},
|
|
1276
|
+
...column.link ? {
|
|
1277
|
+
href: column.link
|
|
1278
|
+
} : {},
|
|
1279
|
+
[getClassPropName()]: "builder-column",
|
|
1280
|
+
style: mapStyleObjToStrIfNeeded(columnCssVars(index))
|
|
1281
|
+
}}
|
|
1221
1282
|
><Blocks_default
|
|
1222
1283
|
path={`component.options.columns.${index}.blocks`}
|
|
1223
1284
|
parent={props.builderBlock.id}
|
|
@@ -1226,8 +1287,9 @@ function Columns(props) {
|
|
|
1226
1287
|
}}
|
|
1227
1288
|
context={props.builderContext}
|
|
1228
1289
|
registeredComponents={props.builderComponents}
|
|
1290
|
+
linkComponent={props.builderLinkComponent}
|
|
1229
1291
|
blocks={column.blocks}
|
|
1230
|
-
/></
|
|
1292
|
+
/></Dynamic_renderer_default>;
|
|
1231
1293
|
}}</For4>
|
|
1232
1294
|
</div>;
|
|
1233
1295
|
}
|
|
@@ -1240,7 +1302,7 @@ function FragmentComponent(props) {
|
|
|
1240
1302
|
var fragment_default = FragmentComponent;
|
|
1241
1303
|
|
|
1242
1304
|
// src/blocks/image/image.tsx
|
|
1243
|
-
import { Show as
|
|
1305
|
+
import { Show as Show7 } from "solid-js";
|
|
1244
1306
|
import { css as css3 } from "solid-styled-components";
|
|
1245
1307
|
|
|
1246
1308
|
// src/blocks/image/image.helpers.ts
|
|
@@ -1329,7 +1391,7 @@ function Image(props) {
|
|
|
1329
1391
|
}
|
|
1330
1392
|
return <>
|
|
1331
1393
|
<picture>
|
|
1332
|
-
<
|
|
1394
|
+
<Show7 when={webpSrcSet()}><source type="image/webp" srcset={webpSrcSet()} /></Show7>
|
|
1333
1395
|
<img
|
|
1334
1396
|
class={"builder-image" + (props.className ? " " + props.className : "") + " " + css3({
|
|
1335
1397
|
opacity: "1",
|
|
@@ -1348,7 +1410,7 @@ function Image(props) {
|
|
|
1348
1410
|
sizes={props.sizes}
|
|
1349
1411
|
/>
|
|
1350
1412
|
</picture>
|
|
1351
|
-
<
|
|
1413
|
+
<Show7
|
|
1352
1414
|
when={props.aspectRatio && !(props.builderBlock?.children?.length && props.fitContent)}
|
|
1353
1415
|
><div
|
|
1354
1416
|
class={"builder-image-sizer " + css3({
|
|
@@ -1359,9 +1421,9 @@ function Image(props) {
|
|
|
1359
1421
|
style={{
|
|
1360
1422
|
"padding-top": props.aspectRatio * 100 + "%"
|
|
1361
1423
|
}}
|
|
1362
|
-
/></
|
|
1363
|
-
<
|
|
1364
|
-
<
|
|
1424
|
+
/></Show7>
|
|
1425
|
+
<Show7 when={props.builderBlock?.children?.length && props.fitContent}>{props.children}</Show7>
|
|
1426
|
+
<Show7 when={!props.fitContent && props.children}><div
|
|
1365
1427
|
class={css3({
|
|
1366
1428
|
display: "flex",
|
|
1367
1429
|
flexDirection: "column",
|
|
@@ -1372,7 +1434,7 @@ function Image(props) {
|
|
|
1372
1434
|
width: "100%",
|
|
1373
1435
|
height: "100%"
|
|
1374
1436
|
})}
|
|
1375
|
-
>{props.children}</div></
|
|
1437
|
+
>{props.children}</div></Show7>
|
|
1376
1438
|
</>;
|
|
1377
1439
|
}
|
|
1378
1440
|
var image_default = Image;
|
|
@@ -1402,7 +1464,7 @@ var section_default = SectionComponent;
|
|
|
1402
1464
|
import { onMount as onMount4, on as on3, createEffect as createEffect3, createSignal as createSignal14 } from "solid-js";
|
|
1403
1465
|
|
|
1404
1466
|
// src/components/content-variants/content-variants.tsx
|
|
1405
|
-
import { Show as
|
|
1467
|
+
import { Show as Show11, For as For5, onMount as onMount3, createSignal as createSignal13 } from "solid-js";
|
|
1406
1468
|
|
|
1407
1469
|
// src/helpers/url.ts
|
|
1408
1470
|
var getTopLevelDomain = (host) => {
|
|
@@ -1596,7 +1658,7 @@ var handleABTesting = async ({
|
|
|
1596
1658
|
var getDefaultCanTrack = (canTrack) => checkIsDefined(canTrack) ? canTrack : true;
|
|
1597
1659
|
|
|
1598
1660
|
// src/components/content/content.tsx
|
|
1599
|
-
import { Show as
|
|
1661
|
+
import { Show as Show10, createSignal as createSignal12 } from "solid-js";
|
|
1600
1662
|
|
|
1601
1663
|
// src/blocks/button/component-info.ts
|
|
1602
1664
|
var componentInfo = {
|
|
@@ -2402,7 +2464,7 @@ var componentInfo12 = {
|
|
|
2402
2464
|
};
|
|
2403
2465
|
|
|
2404
2466
|
// src/blocks/video/video.tsx
|
|
2405
|
-
import { Show as
|
|
2467
|
+
import { Show as Show8 } from "solid-js";
|
|
2406
2468
|
function Video(props) {
|
|
2407
2469
|
function videoProps() {
|
|
2408
2470
|
return {
|
|
@@ -2453,8 +2515,8 @@ function Video(props) {
|
|
|
2453
2515
|
}}
|
|
2454
2516
|
src={props.video || "no-src"}
|
|
2455
2517
|
poster={props.posterImage}
|
|
2456
|
-
><
|
|
2457
|
-
<
|
|
2518
|
+
><Show8 when={!props.lazyLoad}><source type="video/mp4" src={props.video} /></Show8></video>
|
|
2519
|
+
<Show8
|
|
2458
2520
|
when={props.aspectRatio && !(props.fitContent && props.builderBlock?.children?.length)}
|
|
2459
2521
|
><div
|
|
2460
2522
|
style={{
|
|
@@ -2463,15 +2525,15 @@ function Video(props) {
|
|
|
2463
2525
|
"pointer-events": "none",
|
|
2464
2526
|
"font-size": "0px"
|
|
2465
2527
|
}}
|
|
2466
|
-
/></
|
|
2467
|
-
<
|
|
2528
|
+
/></Show8>
|
|
2529
|
+
<Show8 when={props.builderBlock?.children?.length && props.fitContent}><div
|
|
2468
2530
|
style={{
|
|
2469
2531
|
display: "flex",
|
|
2470
2532
|
"flex-direction": "column",
|
|
2471
2533
|
"align-items": "stretch"
|
|
2472
2534
|
}}
|
|
2473
|
-
>{props.children}</div></
|
|
2474
|
-
<
|
|
2535
|
+
>{props.children}</div></Show8>
|
|
2536
|
+
<Show8 when={props.builderBlock?.children?.length && !props.fitContent}><div
|
|
2475
2537
|
style={{
|
|
2476
2538
|
"pointer-events": "none",
|
|
2477
2539
|
display: "flex",
|
|
@@ -2483,7 +2545,7 @@ function Video(props) {
|
|
|
2483
2545
|
width: "100%",
|
|
2484
2546
|
height: "100%"
|
|
2485
2547
|
}}
|
|
2486
|
-
>{props.children}</div></
|
|
2548
|
+
>{props.children}</div></Show8>
|
|
2487
2549
|
</div>;
|
|
2488
2550
|
}
|
|
2489
2551
|
var video_default = Video;
|
|
@@ -2603,7 +2665,7 @@ function InlinedScript(props) {
|
|
|
2603
2665
|
var Inlined_script_default = InlinedScript;
|
|
2604
2666
|
|
|
2605
2667
|
// src/components/content/components/enable-editor.tsx
|
|
2606
|
-
import { Show as
|
|
2668
|
+
import { Show as Show9, onMount as onMount2, on as on2, createEffect as createEffect2, createSignal as createSignal10 } from "solid-js";
|
|
2607
2669
|
import { Dynamic as Dynamic5 } from "solid-js/web";
|
|
2608
2670
|
|
|
2609
2671
|
// src/helpers/preview-lru-cache/get.ts
|
|
@@ -3093,7 +3155,7 @@ var getInteractionPropertiesForEvent = (event) => {
|
|
|
3093
3155
|
};
|
|
3094
3156
|
|
|
3095
3157
|
// src/constants/sdk-version.ts
|
|
3096
|
-
var SDK_VERSION = "0.12.
|
|
3158
|
+
var SDK_VERSION = "0.12.4";
|
|
3097
3159
|
|
|
3098
3160
|
// src/functions/register.ts
|
|
3099
3161
|
var registry = {};
|
|
@@ -3515,7 +3577,7 @@ function EnableEditor(props) {
|
|
|
3515
3577
|
}
|
|
3516
3578
|
}
|
|
3517
3579
|
createEffect2(on2(() => [props.locale], onUpdateFn_6));
|
|
3518
|
-
return <builder_context_default.Provider value={props.builderContextSignal}><
|
|
3580
|
+
return <builder_context_default.Provider value={props.builderContextSignal}><Show9 when={props.builderContextSignal.content}><Dynamic5
|
|
3519
3581
|
class={`variant-${props.content?.testVariationId || props.content?.id}`}
|
|
3520
3582
|
{...{}}
|
|
3521
3583
|
key={forceReRenderCount()}
|
|
@@ -3530,7 +3592,7 @@ function EnableEditor(props) {
|
|
|
3530
3592
|
}}
|
|
3531
3593
|
{...props.contentWrapperProps}
|
|
3532
3594
|
component={ContentWrapper()}
|
|
3533
|
-
>{props.children}</Dynamic5></
|
|
3595
|
+
>{props.children}</Dynamic5></Show9></builder_context_default.Provider>;
|
|
3534
3596
|
}
|
|
3535
3597
|
var Enable_editor_default = EnableEditor;
|
|
3536
3598
|
|
|
@@ -3752,21 +3814,23 @@ function ContentComponent(props) {
|
|
|
3752
3814
|
builderContextSignal={builderContextSignal()}
|
|
3753
3815
|
contentWrapper={props.contentWrapper}
|
|
3754
3816
|
contentWrapperProps={props.contentWrapperProps}
|
|
3817
|
+
linkComponent={props.linkComponent}
|
|
3755
3818
|
trustedHosts={props.trustedHosts}
|
|
3756
3819
|
{...{
|
|
3757
3820
|
setBuilderContextSignal
|
|
3758
3821
|
}}
|
|
3759
3822
|
>
|
|
3760
|
-
<
|
|
3761
|
-
<
|
|
3823
|
+
<Show10 when={props.isSsrAbTest}><Inlined_script_default scriptStr={scriptStr()} /></Show10>
|
|
3824
|
+
<Show10 when={TARGET !== "reactNative"}><Styles_default
|
|
3762
3825
|
contentId={builderContextSignal().content?.id}
|
|
3763
3826
|
cssCode={builderContextSignal().content?.data?.cssCode}
|
|
3764
3827
|
customFonts={builderContextSignal().content?.data?.customFonts}
|
|
3765
|
-
/></
|
|
3828
|
+
/></Show10>
|
|
3766
3829
|
<Blocks_default
|
|
3767
3830
|
blocks={builderContextSignal().content?.data?.blocks}
|
|
3768
3831
|
context={builderContextSignal()}
|
|
3769
3832
|
registeredComponents={registeredComponents()}
|
|
3833
|
+
linkComponent={props.linkComponent}
|
|
3770
3834
|
/>
|
|
3771
3835
|
</Enable_editor_default></components_context_default.Provider>;
|
|
3772
3836
|
}
|
|
@@ -3805,8 +3869,8 @@ function ContentVariants(props) {
|
|
|
3805
3869
|
setShouldRenderVariants(false);
|
|
3806
3870
|
});
|
|
3807
3871
|
return <>
|
|
3808
|
-
<
|
|
3809
|
-
<
|
|
3872
|
+
<Show11 when={!props.__isNestedRender && TARGET !== "reactNative"}><Inlined_script_default scriptStr={getScriptString()} /></Show11>
|
|
3873
|
+
<Show11 when={shouldRenderVariants()}>
|
|
3810
3874
|
<Inlined_styles_default
|
|
3811
3875
|
id={`variants-styles-${props.content?.id}`}
|
|
3812
3876
|
styles={hideVariantsStyleString()}
|
|
@@ -3826,6 +3890,7 @@ function ContentVariants(props) {
|
|
|
3826
3890
|
apiKey={props.apiKey}
|
|
3827
3891
|
apiVersion={props.apiVersion}
|
|
3828
3892
|
customComponents={props.customComponents}
|
|
3893
|
+
linkComponent={props.linkComponent}
|
|
3829
3894
|
canTrack={props.canTrack}
|
|
3830
3895
|
locale={props.locale}
|
|
3831
3896
|
includeRefs={props.includeRefs}
|
|
@@ -3838,7 +3903,7 @@ function ContentVariants(props) {
|
|
|
3838
3903
|
trustedHosts={props.trustedHosts}
|
|
3839
3904
|
/>;
|
|
3840
3905
|
}}</For5>
|
|
3841
|
-
</
|
|
3906
|
+
</Show11>
|
|
3842
3907
|
<Content_default
|
|
3843
3908
|
{...{}}
|
|
3844
3909
|
content={defaultContent()}
|
|
@@ -3849,6 +3914,7 @@ function ContentVariants(props) {
|
|
|
3849
3914
|
apiKey={props.apiKey}
|
|
3850
3915
|
apiVersion={props.apiVersion}
|
|
3851
3916
|
customComponents={props.customComponents}
|
|
3917
|
+
linkComponent={props.linkComponent}
|
|
3852
3918
|
canTrack={props.canTrack}
|
|
3853
3919
|
locale={props.locale}
|
|
3854
3920
|
includeRefs={props.includeRefs}
|
|
@@ -3893,7 +3959,7 @@ function Symbol(props) {
|
|
|
3893
3959
|
const [contentToUse, setContentToUse] = createSignal14(props.symbol?.content);
|
|
3894
3960
|
function className() {
|
|
3895
3961
|
return [
|
|
3896
|
-
...[props.attributes
|
|
3962
|
+
...[props.attributes[getClassPropName()]],
|
|
3897
3963
|
"builder-symbol",
|
|
3898
3964
|
props.symbol?.inline ? "builder-inline-symbol" : void 0,
|
|
3899
3965
|
props.symbol?.dynamic || props.dynamic ? "builder-dynamic-symbol" : void 0
|
|
@@ -3934,6 +4000,7 @@ function Symbol(props) {
|
|
|
3934
4000
|
}}
|
|
3935
4001
|
model={props.symbol?.model}
|
|
3936
4002
|
content={contentToUse()}
|
|
4003
|
+
linkComponent={props.builderLinkComponent}
|
|
3937
4004
|
/></div>;
|
|
3938
4005
|
}
|
|
3939
4006
|
var symbol_default = Symbol;
|