@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/dev.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) {
|
|
@@ -77,9 +127,6 @@ function isBrowser() {
|
|
|
77
127
|
return typeof window !== "undefined" && typeof document !== "undefined";
|
|
78
128
|
}
|
|
79
129
|
|
|
80
|
-
// src/constants/target.ts
|
|
81
|
-
var TARGET = "solid";
|
|
82
|
-
|
|
83
130
|
// src/functions/is-iframe.ts
|
|
84
131
|
function isIframe() {
|
|
85
132
|
return isBrowser() && window.self !== window.top;
|
|
@@ -715,6 +762,38 @@ function getBlockActions(options) {
|
|
|
715
762
|
return obj;
|
|
716
763
|
}
|
|
717
764
|
|
|
765
|
+
// src/functions/transform-style-property.ts
|
|
766
|
+
function transformStyleProperty({
|
|
767
|
+
style
|
|
768
|
+
}) {
|
|
769
|
+
return style;
|
|
770
|
+
}
|
|
771
|
+
|
|
772
|
+
// src/functions/get-style.ts
|
|
773
|
+
var getStyle = ({
|
|
774
|
+
block,
|
|
775
|
+
context
|
|
776
|
+
}) => {
|
|
777
|
+
return mapStyleObjToStrIfNeeded(transformStyleProperty({
|
|
778
|
+
style: block.style || {},
|
|
779
|
+
context,
|
|
780
|
+
block
|
|
781
|
+
}));
|
|
782
|
+
};
|
|
783
|
+
function mapStyleObjToStrIfNeeded(style) {
|
|
784
|
+
switch (TARGET) {
|
|
785
|
+
case "svelte":
|
|
786
|
+
case "vue":
|
|
787
|
+
case "solid":
|
|
788
|
+
return convertStyleMapToCSSArray(style).join(" ");
|
|
789
|
+
case "qwik":
|
|
790
|
+
case "reactNative":
|
|
791
|
+
case "react":
|
|
792
|
+
case "rsc":
|
|
793
|
+
return style;
|
|
794
|
+
}
|
|
795
|
+
}
|
|
796
|
+
|
|
718
797
|
// src/functions/transform-block-properties.ts
|
|
719
798
|
function transformBlockProperties({
|
|
720
799
|
properties
|
|
@@ -736,8 +815,11 @@ function getBlockProperties({
|
|
|
736
815
|
...extractRelevantRootBlockProperties(block),
|
|
737
816
|
...block.properties,
|
|
738
817
|
"builder-id": block.id,
|
|
739
|
-
style:
|
|
740
|
-
|
|
818
|
+
style: getStyle({
|
|
819
|
+
block,
|
|
820
|
+
context
|
|
821
|
+
}),
|
|
822
|
+
[getClassPropName()]: [block.id, "builder-block", block.class, block.properties?.class].filter(Boolean).join(" ")
|
|
741
823
|
};
|
|
742
824
|
return transformBlockProperties({
|
|
743
825
|
properties,
|
|
@@ -745,53 +827,6 @@ function getBlockProperties({
|
|
|
745
827
|
block
|
|
746
828
|
});
|
|
747
829
|
}
|
|
748
|
-
function getStyleAttribute(style) {
|
|
749
|
-
switch (TARGET) {
|
|
750
|
-
case "svelte":
|
|
751
|
-
case "vue":
|
|
752
|
-
case "solid":
|
|
753
|
-
return convertStyleMapToCSSArray(style).join(" ");
|
|
754
|
-
case "qwik":
|
|
755
|
-
case "reactNative":
|
|
756
|
-
case "react":
|
|
757
|
-
case "rsc":
|
|
758
|
-
return style;
|
|
759
|
-
}
|
|
760
|
-
}
|
|
761
|
-
|
|
762
|
-
// src/components/dynamic-renderer/dynamic-renderer.tsx
|
|
763
|
-
import { Show as Show3 } from "solid-js";
|
|
764
|
-
import { Dynamic } from "solid-js/web";
|
|
765
|
-
|
|
766
|
-
// src/components/dynamic-renderer/dynamic-renderer.helpers.ts
|
|
767
|
-
var EMPTY_HTML_ELEMENTS = /* @__PURE__ */ new Set(["area", "base", "br", "col", "embed", "hr", "img", "input", "keygen", "link", "meta", "param", "source", "track", "wbr"]);
|
|
768
|
-
var isEmptyElement = (tagName) => {
|
|
769
|
-
return typeof tagName === "string" && EMPTY_HTML_ELEMENTS.has(tagName.toLowerCase());
|
|
770
|
-
};
|
|
771
|
-
|
|
772
|
-
// src/components/dynamic-renderer/dynamic-renderer.tsx
|
|
773
|
-
function DynamicRenderer(props) {
|
|
774
|
-
return <Show3
|
|
775
|
-
fallback={<Dynamic
|
|
776
|
-
{...props.attributes}
|
|
777
|
-
{...props.actionAttributes}
|
|
778
|
-
component={props.TagName}
|
|
779
|
-
/>}
|
|
780
|
-
when={!isEmptyElement(props.TagName)}
|
|
781
|
-
><Show3
|
|
782
|
-
fallback={<Dynamic
|
|
783
|
-
{...props.attributes}
|
|
784
|
-
{...props.actionAttributes}
|
|
785
|
-
component={props.TagName}
|
|
786
|
-
>{props.children}</Dynamic>}
|
|
787
|
-
when={typeof props.TagName === "string"}
|
|
788
|
-
><Dynamic
|
|
789
|
-
{...props.attributes}
|
|
790
|
-
{...props.actionAttributes}
|
|
791
|
-
component={props.TagName}
|
|
792
|
-
>{props.children}</Dynamic></Show3></Show3>;
|
|
793
|
-
}
|
|
794
|
-
var Dynamic_renderer_default = DynamicRenderer;
|
|
795
830
|
|
|
796
831
|
// src/components/block/components/block-wrapper.tsx
|
|
797
832
|
function BlockWrapper(props) {
|
|
@@ -814,7 +849,7 @@ function BlockWrapper(props) {
|
|
|
814
849
|
var Block_wrapper_default = BlockWrapper;
|
|
815
850
|
|
|
816
851
|
// src/components/block/components/component-ref/component-ref.tsx
|
|
817
|
-
import { Show as
|
|
852
|
+
import { Show as Show3, For, createSignal as createSignal2 } from "solid-js";
|
|
818
853
|
import { Dynamic as Dynamic3 } from "solid-js/web";
|
|
819
854
|
|
|
820
855
|
// src/components/block/components/interactive-element.tsx
|
|
@@ -878,12 +913,13 @@ function ComponentRef(props) {
|
|
|
878
913
|
const [Wrapper, setWrapper] = createSignal2(
|
|
879
914
|
props.isInteractive ? interactive_element_default : props.componentRef
|
|
880
915
|
);
|
|
881
|
-
return <
|
|
916
|
+
return <Show3 when={props.componentRef}><Dynamic3
|
|
882
917
|
{...getWrapperProps({
|
|
883
918
|
componentOptions: props.componentOptions,
|
|
884
919
|
builderBlock: props.builderBlock,
|
|
885
920
|
context: props.context,
|
|
886
921
|
componentRef: props.componentRef,
|
|
922
|
+
linkComponent: props.linkComponent,
|
|
887
923
|
includeBlockProps: props.includeBlockProps,
|
|
888
924
|
isInteractive: props.isInteractive,
|
|
889
925
|
contextValue: props.context
|
|
@@ -896,8 +932,9 @@ function ComponentRef(props) {
|
|
|
896
932
|
block={child}
|
|
897
933
|
context={props.context}
|
|
898
934
|
registeredComponents={props.registeredComponents}
|
|
935
|
+
linkComponent={props.linkComponent}
|
|
899
936
|
/>;
|
|
900
|
-
}}</For></Dynamic3></
|
|
937
|
+
}}</For></Dynamic3></Show3>;
|
|
901
938
|
}
|
|
902
939
|
var Component_ref_default = ComponentRef;
|
|
903
940
|
|
|
@@ -909,6 +946,7 @@ function RepeatedBlock(props) {
|
|
|
909
946
|
block={props.block}
|
|
910
947
|
context={store()}
|
|
911
948
|
registeredComponents={props.registeredComponents}
|
|
949
|
+
linkComponent={props.linkComponent}
|
|
912
950
|
/></builder_context_default.Provider>;
|
|
913
951
|
}
|
|
914
952
|
var Repeated_block_default = RepeatedBlock;
|
|
@@ -940,6 +978,10 @@ function Block(props) {
|
|
|
940
978
|
});
|
|
941
979
|
}
|
|
942
980
|
function Tag() {
|
|
981
|
+
const shouldUseLink = props.block.tagName === "a" || processedBlock().properties?.href || processedBlock().href;
|
|
982
|
+
if (shouldUseLink) {
|
|
983
|
+
return props.linkComponent || "a";
|
|
984
|
+
}
|
|
943
985
|
return props.block.tagName || "div";
|
|
944
986
|
}
|
|
945
987
|
function canShowBlock() {
|
|
@@ -963,32 +1005,37 @@ function Block(props) {
|
|
|
963
1005
|
componentOptions: {
|
|
964
1006
|
...getBlockComponentOptions(processedBlock()),
|
|
965
1007
|
builderContext: props.context,
|
|
1008
|
+
...blockComponent()?.name === "Core:Button" || blockComponent()?.name === "Symbol" || blockComponent()?.name === "Columns" ? {
|
|
1009
|
+
builderLinkComponent: props.linkComponent
|
|
1010
|
+
} : {},
|
|
966
1011
|
...blockComponent()?.name === "Symbol" || blockComponent()?.name === "Columns" ? {
|
|
967
1012
|
builderComponents: props.registeredComponents
|
|
968
1013
|
} : {}
|
|
969
1014
|
},
|
|
970
1015
|
context: childrenContext(),
|
|
1016
|
+
linkComponent: props.linkComponent,
|
|
971
1017
|
registeredComponents: props.registeredComponents,
|
|
972
1018
|
builderBlock: processedBlock(),
|
|
973
1019
|
includeBlockProps: blockComponent()?.noWrap === true,
|
|
974
1020
|
isInteractive: !blockComponent()?.isRSC
|
|
975
1021
|
};
|
|
976
1022
|
}
|
|
977
|
-
return <
|
|
1023
|
+
return <Show4 when={canShowBlock()}>
|
|
978
1024
|
<Block_styles_default block={props.block} context={props.context} />
|
|
979
|
-
<
|
|
1025
|
+
<Show4
|
|
980
1026
|
fallback={<Component_ref_default
|
|
981
1027
|
componentRef={componentRefProps().componentRef}
|
|
982
1028
|
componentOptions={componentRefProps().componentOptions}
|
|
983
1029
|
blockChildren={componentRefProps().blockChildren}
|
|
984
1030
|
context={componentRefProps().context}
|
|
985
1031
|
registeredComponents={componentRefProps().registeredComponents}
|
|
1032
|
+
linkComponent={componentRefProps().linkComponent}
|
|
986
1033
|
builderBlock={componentRefProps().builderBlock}
|
|
987
1034
|
includeBlockProps={componentRefProps().includeBlockProps}
|
|
988
1035
|
isInteractive={componentRefProps().isInteractive}
|
|
989
1036
|
/>}
|
|
990
1037
|
when={!blockComponent()?.noWrap}
|
|
991
|
-
><
|
|
1038
|
+
><Show4
|
|
992
1039
|
fallback={<For2 each={repeatItem()}>{(data, _index) => {
|
|
993
1040
|
const index = _index();
|
|
994
1041
|
return <Repeated_block_default
|
|
@@ -996,6 +1043,7 @@ function Block(props) {
|
|
|
996
1043
|
repeatContext={data.context}
|
|
997
1044
|
block={data.block}
|
|
998
1045
|
registeredComponents={props.registeredComponents}
|
|
1046
|
+
linkComponent={props.linkComponent}
|
|
999
1047
|
/>;
|
|
1000
1048
|
}}</For2>}
|
|
1001
1049
|
when={!repeatItem()}
|
|
@@ -1003,6 +1051,7 @@ function Block(props) {
|
|
|
1003
1051
|
Wrapper={Tag()}
|
|
1004
1052
|
block={processedBlock()}
|
|
1005
1053
|
context={props.context}
|
|
1054
|
+
linkComponent={props.linkComponent}
|
|
1006
1055
|
>
|
|
1007
1056
|
<Component_ref_default
|
|
1008
1057
|
componentRef={componentRefProps().componentRef}
|
|
@@ -1010,6 +1059,7 @@ function Block(props) {
|
|
|
1010
1059
|
blockChildren={componentRefProps().blockChildren}
|
|
1011
1060
|
context={componentRefProps().context}
|
|
1012
1061
|
registeredComponents={componentRefProps().registeredComponents}
|
|
1062
|
+
linkComponent={componentRefProps().linkComponent}
|
|
1013
1063
|
builderBlock={componentRefProps().builderBlock}
|
|
1014
1064
|
includeBlockProps={componentRefProps().includeBlockProps}
|
|
1015
1065
|
isInteractive={componentRefProps().isInteractive}
|
|
@@ -1021,10 +1071,11 @@ function Block(props) {
|
|
|
1021
1071
|
block={child}
|
|
1022
1072
|
context={childrenContext()}
|
|
1023
1073
|
registeredComponents={props.registeredComponents}
|
|
1074
|
+
linkComponent={props.linkComponent}
|
|
1024
1075
|
/>;
|
|
1025
1076
|
}}</For2>
|
|
1026
|
-
</Block_wrapper_default></
|
|
1027
|
-
</
|
|
1077
|
+
</Block_wrapper_default></Show4></Show4>
|
|
1078
|
+
</Show4>;
|
|
1028
1079
|
}
|
|
1029
1080
|
var Block_default = Block;
|
|
1030
1081
|
|
|
@@ -1093,15 +1144,16 @@ function Blocks(props) {
|
|
|
1093
1144
|
styleProp={props.styleProp}
|
|
1094
1145
|
BlocksWrapper={props.context?.BlocksWrapper}
|
|
1095
1146
|
BlocksWrapperProps={props.context?.BlocksWrapperProps}
|
|
1096
|
-
><
|
|
1147
|
+
><Show5 when={props.blocks}><For3 each={props.blocks}>{(block, _index) => {
|
|
1097
1148
|
const index = _index();
|
|
1098
1149
|
return <Block_default
|
|
1099
1150
|
key={block.id}
|
|
1100
1151
|
block={block}
|
|
1152
|
+
linkComponent={props.linkComponent}
|
|
1101
1153
|
context={props.context || builderContext}
|
|
1102
1154
|
registeredComponents={props.registeredComponents || componentsContext.registeredComponents}
|
|
1103
1155
|
/>;
|
|
1104
|
-
}}</For3></
|
|
1156
|
+
}}</For3></Show5></Blocks_wrapper_default>;
|
|
1105
1157
|
}
|
|
1106
1158
|
var Blocks_default = Blocks;
|
|
1107
1159
|
|
|
@@ -1150,7 +1202,13 @@ function Columns(props) {
|
|
|
1150
1202
|
const mobileWidth = "100%";
|
|
1151
1203
|
const mobileMarginLeft = 0;
|
|
1152
1204
|
const marginLeftKey = "margin-left";
|
|
1205
|
+
const sharedStyles = {
|
|
1206
|
+
display: "flex",
|
|
1207
|
+
flexDirection: "column",
|
|
1208
|
+
alignItems: "stretch"
|
|
1209
|
+
};
|
|
1153
1210
|
return {
|
|
1211
|
+
...sharedStyles,
|
|
1154
1212
|
width,
|
|
1155
1213
|
[marginLeftKey]: gutterPixels,
|
|
1156
1214
|
"--column-width-mobile": getMobileStyle({
|
|
@@ -1212,18 +1270,21 @@ function Columns(props) {
|
|
|
1212
1270
|
style={columnsCssVars()}
|
|
1213
1271
|
{...{}}
|
|
1214
1272
|
>
|
|
1215
|
-
<
|
|
1273
|
+
<Show6 when={TARGET !== "reactNative"}><Inlined_styles_default styles={columnsStyles()} /></Show6>
|
|
1216
1274
|
<For4 each={props.columns}>{(column, _index) => {
|
|
1217
1275
|
const index = _index();
|
|
1218
|
-
return <
|
|
1219
|
-
class={"builder-column " + css2({
|
|
1220
|
-
display: "flex",
|
|
1221
|
-
flexDirection: "column",
|
|
1222
|
-
alignItems: "stretch"
|
|
1223
|
-
})}
|
|
1224
|
-
style={columnCssVars(index)}
|
|
1225
|
-
{...{}}
|
|
1276
|
+
return <Dynamic_renderer_default
|
|
1226
1277
|
key={index}
|
|
1278
|
+
TagName={column.link ? props.builderLinkComponent || "a" : "div"}
|
|
1279
|
+
actionAttributes={{}}
|
|
1280
|
+
attributes={{
|
|
1281
|
+
...{},
|
|
1282
|
+
...column.link ? {
|
|
1283
|
+
href: column.link
|
|
1284
|
+
} : {},
|
|
1285
|
+
[getClassPropName()]: "builder-column",
|
|
1286
|
+
style: mapStyleObjToStrIfNeeded(columnCssVars(index))
|
|
1287
|
+
}}
|
|
1227
1288
|
><Blocks_default
|
|
1228
1289
|
path={`component.options.columns.${index}.blocks`}
|
|
1229
1290
|
parent={props.builderBlock.id}
|
|
@@ -1232,8 +1293,9 @@ function Columns(props) {
|
|
|
1232
1293
|
}}
|
|
1233
1294
|
context={props.builderContext}
|
|
1234
1295
|
registeredComponents={props.builderComponents}
|
|
1296
|
+
linkComponent={props.builderLinkComponent}
|
|
1235
1297
|
blocks={column.blocks}
|
|
1236
|
-
/></
|
|
1298
|
+
/></Dynamic_renderer_default>;
|
|
1237
1299
|
}}</For4>
|
|
1238
1300
|
</div>;
|
|
1239
1301
|
}
|
|
@@ -1246,7 +1308,7 @@ function FragmentComponent(props) {
|
|
|
1246
1308
|
var fragment_default = FragmentComponent;
|
|
1247
1309
|
|
|
1248
1310
|
// src/blocks/image/image.tsx
|
|
1249
|
-
import { Show as
|
|
1311
|
+
import { Show as Show7 } from "solid-js";
|
|
1250
1312
|
import { css as css3 } from "solid-styled-components";
|
|
1251
1313
|
|
|
1252
1314
|
// src/blocks/image/image.helpers.ts
|
|
@@ -1336,7 +1398,7 @@ function Image(props) {
|
|
|
1336
1398
|
}
|
|
1337
1399
|
return <>
|
|
1338
1400
|
<picture>
|
|
1339
|
-
<
|
|
1401
|
+
<Show7 when={webpSrcSet()}><source type="image/webp" srcset={webpSrcSet()} /></Show7>
|
|
1340
1402
|
<img
|
|
1341
1403
|
class={"builder-image" + (props.className ? " " + props.className : "") + " " + css3({
|
|
1342
1404
|
opacity: "1",
|
|
@@ -1355,7 +1417,7 @@ function Image(props) {
|
|
|
1355
1417
|
sizes={props.sizes}
|
|
1356
1418
|
/>
|
|
1357
1419
|
</picture>
|
|
1358
|
-
<
|
|
1420
|
+
<Show7
|
|
1359
1421
|
when={props.aspectRatio && !(props.builderBlock?.children?.length && props.fitContent)}
|
|
1360
1422
|
><div
|
|
1361
1423
|
class={"builder-image-sizer " + css3({
|
|
@@ -1366,9 +1428,9 @@ function Image(props) {
|
|
|
1366
1428
|
style={{
|
|
1367
1429
|
"padding-top": props.aspectRatio * 100 + "%"
|
|
1368
1430
|
}}
|
|
1369
|
-
/></
|
|
1370
|
-
<
|
|
1371
|
-
<
|
|
1431
|
+
/></Show7>
|
|
1432
|
+
<Show7 when={props.builderBlock?.children?.length && props.fitContent}>{props.children}</Show7>
|
|
1433
|
+
<Show7 when={!props.fitContent && props.children}><div
|
|
1372
1434
|
class={css3({
|
|
1373
1435
|
display: "flex",
|
|
1374
1436
|
flexDirection: "column",
|
|
@@ -1379,7 +1441,7 @@ function Image(props) {
|
|
|
1379
1441
|
width: "100%",
|
|
1380
1442
|
height: "100%"
|
|
1381
1443
|
})}
|
|
1382
|
-
>{props.children}</div></
|
|
1444
|
+
>{props.children}</div></Show7>
|
|
1383
1445
|
</>;
|
|
1384
1446
|
}
|
|
1385
1447
|
var image_default = Image;
|
|
@@ -1409,7 +1471,7 @@ var section_default = SectionComponent;
|
|
|
1409
1471
|
import { onMount as onMount4, on as on3, createEffect as createEffect3, createSignal as createSignal14 } from "solid-js";
|
|
1410
1472
|
|
|
1411
1473
|
// src/components/content-variants/content-variants.tsx
|
|
1412
|
-
import { Show as
|
|
1474
|
+
import { Show as Show11, For as For5, onMount as onMount3, createSignal as createSignal13 } from "solid-js";
|
|
1413
1475
|
|
|
1414
1476
|
// src/helpers/url.ts
|
|
1415
1477
|
var getTopLevelDomain = (host) => {
|
|
@@ -1603,7 +1665,7 @@ var handleABTesting = async ({
|
|
|
1603
1665
|
var getDefaultCanTrack = (canTrack) => checkIsDefined(canTrack) ? canTrack : true;
|
|
1604
1666
|
|
|
1605
1667
|
// src/components/content/content.tsx
|
|
1606
|
-
import { Show as
|
|
1668
|
+
import { Show as Show10, createSignal as createSignal12 } from "solid-js";
|
|
1607
1669
|
|
|
1608
1670
|
// src/blocks/button/component-info.ts
|
|
1609
1671
|
var componentInfo = {
|
|
@@ -2412,7 +2474,7 @@ var componentInfo12 = {
|
|
|
2412
2474
|
};
|
|
2413
2475
|
|
|
2414
2476
|
// src/blocks/video/video.tsx
|
|
2415
|
-
import { Show as
|
|
2477
|
+
import { Show as Show8 } from "solid-js";
|
|
2416
2478
|
function Video(props) {
|
|
2417
2479
|
function videoProps() {
|
|
2418
2480
|
return {
|
|
@@ -2463,8 +2525,8 @@ function Video(props) {
|
|
|
2463
2525
|
}}
|
|
2464
2526
|
src={props.video || "no-src"}
|
|
2465
2527
|
poster={props.posterImage}
|
|
2466
|
-
><
|
|
2467
|
-
<
|
|
2528
|
+
><Show8 when={!props.lazyLoad}><source type="video/mp4" src={props.video} /></Show8></video>
|
|
2529
|
+
<Show8
|
|
2468
2530
|
when={props.aspectRatio && !(props.fitContent && props.builderBlock?.children?.length)}
|
|
2469
2531
|
><div
|
|
2470
2532
|
style={{
|
|
@@ -2473,15 +2535,15 @@ function Video(props) {
|
|
|
2473
2535
|
"pointer-events": "none",
|
|
2474
2536
|
"font-size": "0px"
|
|
2475
2537
|
}}
|
|
2476
|
-
/></
|
|
2477
|
-
<
|
|
2538
|
+
/></Show8>
|
|
2539
|
+
<Show8 when={props.builderBlock?.children?.length && props.fitContent}><div
|
|
2478
2540
|
style={{
|
|
2479
2541
|
display: "flex",
|
|
2480
2542
|
"flex-direction": "column",
|
|
2481
2543
|
"align-items": "stretch"
|
|
2482
2544
|
}}
|
|
2483
|
-
>{props.children}</div></
|
|
2484
|
-
<
|
|
2545
|
+
>{props.children}</div></Show8>
|
|
2546
|
+
<Show8 when={props.builderBlock?.children?.length && !props.fitContent}><div
|
|
2485
2547
|
style={{
|
|
2486
2548
|
"pointer-events": "none",
|
|
2487
2549
|
display: "flex",
|
|
@@ -2493,7 +2555,7 @@ function Video(props) {
|
|
|
2493
2555
|
width: "100%",
|
|
2494
2556
|
height: "100%"
|
|
2495
2557
|
}}
|
|
2496
|
-
>{props.children}</div></
|
|
2558
|
+
>{props.children}</div></Show8>
|
|
2497
2559
|
</div>;
|
|
2498
2560
|
}
|
|
2499
2561
|
var video_default = Video;
|
|
@@ -2613,7 +2675,7 @@ function InlinedScript(props) {
|
|
|
2613
2675
|
var Inlined_script_default = InlinedScript;
|
|
2614
2676
|
|
|
2615
2677
|
// src/components/content/components/enable-editor.tsx
|
|
2616
|
-
import { Show as
|
|
2678
|
+
import { Show as Show9, onMount as onMount2, on as on2, createEffect as createEffect2, createSignal as createSignal10 } from "solid-js";
|
|
2617
2679
|
import { Dynamic as Dynamic5 } from "solid-js/web";
|
|
2618
2680
|
|
|
2619
2681
|
// src/helpers/preview-lru-cache/get.ts
|
|
@@ -3108,7 +3170,7 @@ var getInteractionPropertiesForEvent = (event) => {
|
|
|
3108
3170
|
};
|
|
3109
3171
|
|
|
3110
3172
|
// src/constants/sdk-version.ts
|
|
3111
|
-
var SDK_VERSION = "0.12.
|
|
3173
|
+
var SDK_VERSION = "0.12.4";
|
|
3112
3174
|
|
|
3113
3175
|
// src/functions/register.ts
|
|
3114
3176
|
var registry = {};
|
|
@@ -3532,7 +3594,7 @@ function EnableEditor(props) {
|
|
|
3532
3594
|
}
|
|
3533
3595
|
}
|
|
3534
3596
|
createEffect2(on2(() => [props.locale], onUpdateFn_6));
|
|
3535
|
-
return <builder_context_default.Provider value={props.builderContextSignal}><
|
|
3597
|
+
return <builder_context_default.Provider value={props.builderContextSignal}><Show9 when={props.builderContextSignal.content}><Dynamic5
|
|
3536
3598
|
class={`variant-${props.content?.testVariationId || props.content?.id}`}
|
|
3537
3599
|
{...{}}
|
|
3538
3600
|
key={forceReRenderCount()}
|
|
@@ -3547,7 +3609,7 @@ function EnableEditor(props) {
|
|
|
3547
3609
|
}}
|
|
3548
3610
|
{...props.contentWrapperProps}
|
|
3549
3611
|
component={ContentWrapper()}
|
|
3550
|
-
>{props.children}</Dynamic5></
|
|
3612
|
+
>{props.children}</Dynamic5></Show9></builder_context_default.Provider>;
|
|
3551
3613
|
}
|
|
3552
3614
|
var Enable_editor_default = EnableEditor;
|
|
3553
3615
|
|
|
@@ -3769,21 +3831,23 @@ function ContentComponent(props) {
|
|
|
3769
3831
|
builderContextSignal={builderContextSignal()}
|
|
3770
3832
|
contentWrapper={props.contentWrapper}
|
|
3771
3833
|
contentWrapperProps={props.contentWrapperProps}
|
|
3834
|
+
linkComponent={props.linkComponent}
|
|
3772
3835
|
trustedHosts={props.trustedHosts}
|
|
3773
3836
|
{...{
|
|
3774
3837
|
setBuilderContextSignal
|
|
3775
3838
|
}}
|
|
3776
3839
|
>
|
|
3777
|
-
<
|
|
3778
|
-
<
|
|
3840
|
+
<Show10 when={props.isSsrAbTest}><Inlined_script_default scriptStr={scriptStr()} /></Show10>
|
|
3841
|
+
<Show10 when={TARGET !== "reactNative"}><Styles_default
|
|
3779
3842
|
contentId={builderContextSignal().content?.id}
|
|
3780
3843
|
cssCode={builderContextSignal().content?.data?.cssCode}
|
|
3781
3844
|
customFonts={builderContextSignal().content?.data?.customFonts}
|
|
3782
|
-
/></
|
|
3845
|
+
/></Show10>
|
|
3783
3846
|
<Blocks_default
|
|
3784
3847
|
blocks={builderContextSignal().content?.data?.blocks}
|
|
3785
3848
|
context={builderContextSignal()}
|
|
3786
3849
|
registeredComponents={registeredComponents()}
|
|
3850
|
+
linkComponent={props.linkComponent}
|
|
3787
3851
|
/>
|
|
3788
3852
|
</Enable_editor_default></components_context_default.Provider>;
|
|
3789
3853
|
}
|
|
@@ -3822,8 +3886,8 @@ function ContentVariants(props) {
|
|
|
3822
3886
|
setShouldRenderVariants(false);
|
|
3823
3887
|
});
|
|
3824
3888
|
return <>
|
|
3825
|
-
<
|
|
3826
|
-
<
|
|
3889
|
+
<Show11 when={!props.__isNestedRender && TARGET !== "reactNative"}><Inlined_script_default scriptStr={getScriptString()} /></Show11>
|
|
3890
|
+
<Show11 when={shouldRenderVariants()}>
|
|
3827
3891
|
<Inlined_styles_default
|
|
3828
3892
|
id={`variants-styles-${props.content?.id}`}
|
|
3829
3893
|
styles={hideVariantsStyleString()}
|
|
@@ -3843,6 +3907,7 @@ function ContentVariants(props) {
|
|
|
3843
3907
|
apiKey={props.apiKey}
|
|
3844
3908
|
apiVersion={props.apiVersion}
|
|
3845
3909
|
customComponents={props.customComponents}
|
|
3910
|
+
linkComponent={props.linkComponent}
|
|
3846
3911
|
canTrack={props.canTrack}
|
|
3847
3912
|
locale={props.locale}
|
|
3848
3913
|
includeRefs={props.includeRefs}
|
|
@@ -3855,7 +3920,7 @@ function ContentVariants(props) {
|
|
|
3855
3920
|
trustedHosts={props.trustedHosts}
|
|
3856
3921
|
/>;
|
|
3857
3922
|
}}</For5>
|
|
3858
|
-
</
|
|
3923
|
+
</Show11>
|
|
3859
3924
|
<Content_default
|
|
3860
3925
|
{...{}}
|
|
3861
3926
|
content={defaultContent()}
|
|
@@ -3866,6 +3931,7 @@ function ContentVariants(props) {
|
|
|
3866
3931
|
apiKey={props.apiKey}
|
|
3867
3932
|
apiVersion={props.apiVersion}
|
|
3868
3933
|
customComponents={props.customComponents}
|
|
3934
|
+
linkComponent={props.linkComponent}
|
|
3869
3935
|
canTrack={props.canTrack}
|
|
3870
3936
|
locale={props.locale}
|
|
3871
3937
|
includeRefs={props.includeRefs}
|
|
@@ -3910,7 +3976,7 @@ function Symbol(props) {
|
|
|
3910
3976
|
const [contentToUse, setContentToUse] = createSignal14(props.symbol?.content);
|
|
3911
3977
|
function className() {
|
|
3912
3978
|
return [
|
|
3913
|
-
...[props.attributes
|
|
3979
|
+
...[props.attributes[getClassPropName()]],
|
|
3914
3980
|
"builder-symbol",
|
|
3915
3981
|
props.symbol?.inline ? "builder-inline-symbol" : void 0,
|
|
3916
3982
|
props.symbol?.dynamic || props.dynamic ? "builder-dynamic-symbol" : void 0
|
|
@@ -3951,6 +4017,7 @@ function Symbol(props) {
|
|
|
3951
4017
|
}}
|
|
3952
4018
|
model={props.symbol?.model}
|
|
3953
4019
|
content={contentToUse()}
|
|
4020
|
+
linkComponent={props.builderLinkComponent}
|
|
3954
4021
|
/></div>;
|
|
3955
4022
|
}
|
|
3956
4023
|
var symbol_default = Symbol;
|