@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/browser/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;
|
|
@@ -589,6 +636,38 @@ function getBlockActions(options) {
|
|
|
589
636
|
return obj;
|
|
590
637
|
}
|
|
591
638
|
|
|
639
|
+
// src/functions/transform-style-property.ts
|
|
640
|
+
function transformStyleProperty({
|
|
641
|
+
style
|
|
642
|
+
}) {
|
|
643
|
+
return style;
|
|
644
|
+
}
|
|
645
|
+
|
|
646
|
+
// src/functions/get-style.ts
|
|
647
|
+
var getStyle = ({
|
|
648
|
+
block,
|
|
649
|
+
context
|
|
650
|
+
}) => {
|
|
651
|
+
return mapStyleObjToStrIfNeeded(transformStyleProperty({
|
|
652
|
+
style: block.style || {},
|
|
653
|
+
context,
|
|
654
|
+
block
|
|
655
|
+
}));
|
|
656
|
+
};
|
|
657
|
+
function mapStyleObjToStrIfNeeded(style) {
|
|
658
|
+
switch (TARGET) {
|
|
659
|
+
case "svelte":
|
|
660
|
+
case "vue":
|
|
661
|
+
case "solid":
|
|
662
|
+
return convertStyleMapToCSSArray(style).join(" ");
|
|
663
|
+
case "qwik":
|
|
664
|
+
case "reactNative":
|
|
665
|
+
case "react":
|
|
666
|
+
case "rsc":
|
|
667
|
+
return style;
|
|
668
|
+
}
|
|
669
|
+
}
|
|
670
|
+
|
|
592
671
|
// src/functions/transform-block-properties.ts
|
|
593
672
|
function transformBlockProperties({
|
|
594
673
|
properties
|
|
@@ -610,8 +689,11 @@ function getBlockProperties({
|
|
|
610
689
|
...extractRelevantRootBlockProperties(block),
|
|
611
690
|
...block.properties,
|
|
612
691
|
"builder-id": block.id,
|
|
613
|
-
style:
|
|
614
|
-
|
|
692
|
+
style: getStyle({
|
|
693
|
+
block,
|
|
694
|
+
context
|
|
695
|
+
}),
|
|
696
|
+
[getClassPropName()]: [block.id, "builder-block", block.class, block.properties?.class].filter(Boolean).join(" ")
|
|
615
697
|
};
|
|
616
698
|
return transformBlockProperties({
|
|
617
699
|
properties,
|
|
@@ -619,53 +701,6 @@ function getBlockProperties({
|
|
|
619
701
|
block
|
|
620
702
|
});
|
|
621
703
|
}
|
|
622
|
-
function getStyleAttribute(style) {
|
|
623
|
-
switch (TARGET) {
|
|
624
|
-
case "svelte":
|
|
625
|
-
case "vue":
|
|
626
|
-
case "solid":
|
|
627
|
-
return convertStyleMapToCSSArray(style).join(" ");
|
|
628
|
-
case "qwik":
|
|
629
|
-
case "reactNative":
|
|
630
|
-
case "react":
|
|
631
|
-
case "rsc":
|
|
632
|
-
return style;
|
|
633
|
-
}
|
|
634
|
-
}
|
|
635
|
-
|
|
636
|
-
// src/components/dynamic-renderer/dynamic-renderer.tsx
|
|
637
|
-
import { Show as Show3 } from "solid-js";
|
|
638
|
-
import { Dynamic } from "solid-js/web";
|
|
639
|
-
|
|
640
|
-
// src/components/dynamic-renderer/dynamic-renderer.helpers.ts
|
|
641
|
-
var EMPTY_HTML_ELEMENTS = /* @__PURE__ */ new Set(["area", "base", "br", "col", "embed", "hr", "img", "input", "keygen", "link", "meta", "param", "source", "track", "wbr"]);
|
|
642
|
-
var isEmptyElement = (tagName) => {
|
|
643
|
-
return typeof tagName === "string" && EMPTY_HTML_ELEMENTS.has(tagName.toLowerCase());
|
|
644
|
-
};
|
|
645
|
-
|
|
646
|
-
// src/components/dynamic-renderer/dynamic-renderer.tsx
|
|
647
|
-
function DynamicRenderer(props) {
|
|
648
|
-
return <Show3
|
|
649
|
-
fallback={<Dynamic
|
|
650
|
-
{...props.attributes}
|
|
651
|
-
{...props.actionAttributes}
|
|
652
|
-
component={props.TagName}
|
|
653
|
-
/>}
|
|
654
|
-
when={!isEmptyElement(props.TagName)}
|
|
655
|
-
><Show3
|
|
656
|
-
fallback={<Dynamic
|
|
657
|
-
{...props.attributes}
|
|
658
|
-
{...props.actionAttributes}
|
|
659
|
-
component={props.TagName}
|
|
660
|
-
>{props.children}</Dynamic>}
|
|
661
|
-
when={typeof props.TagName === "string"}
|
|
662
|
-
><Dynamic
|
|
663
|
-
{...props.attributes}
|
|
664
|
-
{...props.actionAttributes}
|
|
665
|
-
component={props.TagName}
|
|
666
|
-
>{props.children}</Dynamic></Show3></Show3>;
|
|
667
|
-
}
|
|
668
|
-
var Dynamic_renderer_default = DynamicRenderer;
|
|
669
704
|
|
|
670
705
|
// src/components/block/components/block-wrapper.tsx
|
|
671
706
|
function BlockWrapper(props) {
|
|
@@ -688,7 +723,7 @@ function BlockWrapper(props) {
|
|
|
688
723
|
var Block_wrapper_default = BlockWrapper;
|
|
689
724
|
|
|
690
725
|
// src/components/block/components/component-ref/component-ref.tsx
|
|
691
|
-
import { Show as
|
|
726
|
+
import { Show as Show3, For, createSignal as createSignal2 } from "solid-js";
|
|
692
727
|
import { Dynamic as Dynamic3 } from "solid-js/web";
|
|
693
728
|
|
|
694
729
|
// src/components/block/components/interactive-element.tsx
|
|
@@ -752,12 +787,13 @@ function ComponentRef(props) {
|
|
|
752
787
|
const [Wrapper, setWrapper] = createSignal2(
|
|
753
788
|
props.isInteractive ? interactive_element_default : props.componentRef
|
|
754
789
|
);
|
|
755
|
-
return <
|
|
790
|
+
return <Show3 when={props.componentRef}><Dynamic3
|
|
756
791
|
{...getWrapperProps({
|
|
757
792
|
componentOptions: props.componentOptions,
|
|
758
793
|
builderBlock: props.builderBlock,
|
|
759
794
|
context: props.context,
|
|
760
795
|
componentRef: props.componentRef,
|
|
796
|
+
linkComponent: props.linkComponent,
|
|
761
797
|
includeBlockProps: props.includeBlockProps,
|
|
762
798
|
isInteractive: props.isInteractive,
|
|
763
799
|
contextValue: props.context
|
|
@@ -770,8 +806,9 @@ function ComponentRef(props) {
|
|
|
770
806
|
block={child}
|
|
771
807
|
context={props.context}
|
|
772
808
|
registeredComponents={props.registeredComponents}
|
|
809
|
+
linkComponent={props.linkComponent}
|
|
773
810
|
/>;
|
|
774
|
-
}}</For></Dynamic3></
|
|
811
|
+
}}</For></Dynamic3></Show3>;
|
|
775
812
|
}
|
|
776
813
|
var Component_ref_default = ComponentRef;
|
|
777
814
|
|
|
@@ -783,6 +820,7 @@ function RepeatedBlock(props) {
|
|
|
783
820
|
block={props.block}
|
|
784
821
|
context={store()}
|
|
785
822
|
registeredComponents={props.registeredComponents}
|
|
823
|
+
linkComponent={props.linkComponent}
|
|
786
824
|
/></builder_context_default.Provider>;
|
|
787
825
|
}
|
|
788
826
|
var Repeated_block_default = RepeatedBlock;
|
|
@@ -814,6 +852,10 @@ function Block(props) {
|
|
|
814
852
|
});
|
|
815
853
|
}
|
|
816
854
|
function Tag() {
|
|
855
|
+
const shouldUseLink = props.block.tagName === "a" || processedBlock().properties?.href || processedBlock().href;
|
|
856
|
+
if (shouldUseLink) {
|
|
857
|
+
return props.linkComponent || "a";
|
|
858
|
+
}
|
|
817
859
|
return props.block.tagName || "div";
|
|
818
860
|
}
|
|
819
861
|
function canShowBlock() {
|
|
@@ -837,32 +879,37 @@ function Block(props) {
|
|
|
837
879
|
componentOptions: {
|
|
838
880
|
...getBlockComponentOptions(processedBlock()),
|
|
839
881
|
builderContext: props.context,
|
|
882
|
+
...blockComponent()?.name === "Core:Button" || blockComponent()?.name === "Symbol" || blockComponent()?.name === "Columns" ? {
|
|
883
|
+
builderLinkComponent: props.linkComponent
|
|
884
|
+
} : {},
|
|
840
885
|
...blockComponent()?.name === "Symbol" || blockComponent()?.name === "Columns" ? {
|
|
841
886
|
builderComponents: props.registeredComponents
|
|
842
887
|
} : {}
|
|
843
888
|
},
|
|
844
889
|
context: childrenContext(),
|
|
890
|
+
linkComponent: props.linkComponent,
|
|
845
891
|
registeredComponents: props.registeredComponents,
|
|
846
892
|
builderBlock: processedBlock(),
|
|
847
893
|
includeBlockProps: blockComponent()?.noWrap === true,
|
|
848
894
|
isInteractive: !blockComponent()?.isRSC
|
|
849
895
|
};
|
|
850
896
|
}
|
|
851
|
-
return <
|
|
897
|
+
return <Show4 when={canShowBlock()}>
|
|
852
898
|
<Block_styles_default block={props.block} context={props.context} />
|
|
853
|
-
<
|
|
899
|
+
<Show4
|
|
854
900
|
fallback={<Component_ref_default
|
|
855
901
|
componentRef={componentRefProps().componentRef}
|
|
856
902
|
componentOptions={componentRefProps().componentOptions}
|
|
857
903
|
blockChildren={componentRefProps().blockChildren}
|
|
858
904
|
context={componentRefProps().context}
|
|
859
905
|
registeredComponents={componentRefProps().registeredComponents}
|
|
906
|
+
linkComponent={componentRefProps().linkComponent}
|
|
860
907
|
builderBlock={componentRefProps().builderBlock}
|
|
861
908
|
includeBlockProps={componentRefProps().includeBlockProps}
|
|
862
909
|
isInteractive={componentRefProps().isInteractive}
|
|
863
910
|
/>}
|
|
864
911
|
when={!blockComponent()?.noWrap}
|
|
865
|
-
><
|
|
912
|
+
><Show4
|
|
866
913
|
fallback={<For2 each={repeatItem()}>{(data, _index) => {
|
|
867
914
|
const index = _index();
|
|
868
915
|
return <Repeated_block_default
|
|
@@ -870,6 +917,7 @@ function Block(props) {
|
|
|
870
917
|
repeatContext={data.context}
|
|
871
918
|
block={data.block}
|
|
872
919
|
registeredComponents={props.registeredComponents}
|
|
920
|
+
linkComponent={props.linkComponent}
|
|
873
921
|
/>;
|
|
874
922
|
}}</For2>}
|
|
875
923
|
when={!repeatItem()}
|
|
@@ -877,6 +925,7 @@ function Block(props) {
|
|
|
877
925
|
Wrapper={Tag()}
|
|
878
926
|
block={processedBlock()}
|
|
879
927
|
context={props.context}
|
|
928
|
+
linkComponent={props.linkComponent}
|
|
880
929
|
>
|
|
881
930
|
<Component_ref_default
|
|
882
931
|
componentRef={componentRefProps().componentRef}
|
|
@@ -884,6 +933,7 @@ function Block(props) {
|
|
|
884
933
|
blockChildren={componentRefProps().blockChildren}
|
|
885
934
|
context={componentRefProps().context}
|
|
886
935
|
registeredComponents={componentRefProps().registeredComponents}
|
|
936
|
+
linkComponent={componentRefProps().linkComponent}
|
|
887
937
|
builderBlock={componentRefProps().builderBlock}
|
|
888
938
|
includeBlockProps={componentRefProps().includeBlockProps}
|
|
889
939
|
isInteractive={componentRefProps().isInteractive}
|
|
@@ -895,10 +945,11 @@ function Block(props) {
|
|
|
895
945
|
block={child}
|
|
896
946
|
context={childrenContext()}
|
|
897
947
|
registeredComponents={props.registeredComponents}
|
|
948
|
+
linkComponent={props.linkComponent}
|
|
898
949
|
/>;
|
|
899
950
|
}}</For2>
|
|
900
|
-
</Block_wrapper_default></
|
|
901
|
-
</
|
|
951
|
+
</Block_wrapper_default></Show4></Show4>
|
|
952
|
+
</Show4>;
|
|
902
953
|
}
|
|
903
954
|
var Block_default = Block;
|
|
904
955
|
|
|
@@ -967,15 +1018,16 @@ function Blocks(props) {
|
|
|
967
1018
|
styleProp={props.styleProp}
|
|
968
1019
|
BlocksWrapper={props.context?.BlocksWrapper}
|
|
969
1020
|
BlocksWrapperProps={props.context?.BlocksWrapperProps}
|
|
970
|
-
><
|
|
1021
|
+
><Show5 when={props.blocks}><For3 each={props.blocks}>{(block, _index) => {
|
|
971
1022
|
const index = _index();
|
|
972
1023
|
return <Block_default
|
|
973
1024
|
key={block.id}
|
|
974
1025
|
block={block}
|
|
1026
|
+
linkComponent={props.linkComponent}
|
|
975
1027
|
context={props.context || builderContext}
|
|
976
1028
|
registeredComponents={props.registeredComponents || componentsContext.registeredComponents}
|
|
977
1029
|
/>;
|
|
978
|
-
}}</For3></
|
|
1030
|
+
}}</For3></Show5></Blocks_wrapper_default>;
|
|
979
1031
|
}
|
|
980
1032
|
var Blocks_default = Blocks;
|
|
981
1033
|
|
|
@@ -1024,7 +1076,13 @@ function Columns(props) {
|
|
|
1024
1076
|
const mobileWidth = "100%";
|
|
1025
1077
|
const mobileMarginLeft = 0;
|
|
1026
1078
|
const marginLeftKey = "margin-left";
|
|
1079
|
+
const sharedStyles = {
|
|
1080
|
+
display: "flex",
|
|
1081
|
+
flexDirection: "column",
|
|
1082
|
+
alignItems: "stretch"
|
|
1083
|
+
};
|
|
1027
1084
|
return {
|
|
1085
|
+
...sharedStyles,
|
|
1028
1086
|
width,
|
|
1029
1087
|
[marginLeftKey]: gutterPixels,
|
|
1030
1088
|
"--column-width-mobile": getMobileStyle({
|
|
@@ -1086,18 +1144,21 @@ function Columns(props) {
|
|
|
1086
1144
|
style={columnsCssVars()}
|
|
1087
1145
|
{...{}}
|
|
1088
1146
|
>
|
|
1089
|
-
<
|
|
1147
|
+
<Show6 when={TARGET !== "reactNative"}><Inlined_styles_default styles={columnsStyles()} /></Show6>
|
|
1090
1148
|
<For4 each={props.columns}>{(column, _index) => {
|
|
1091
1149
|
const index = _index();
|
|
1092
|
-
return <
|
|
1093
|
-
class={"builder-column " + css2({
|
|
1094
|
-
display: "flex",
|
|
1095
|
-
flexDirection: "column",
|
|
1096
|
-
alignItems: "stretch"
|
|
1097
|
-
})}
|
|
1098
|
-
style={columnCssVars(index)}
|
|
1099
|
-
{...{}}
|
|
1150
|
+
return <Dynamic_renderer_default
|
|
1100
1151
|
key={index}
|
|
1152
|
+
TagName={column.link ? props.builderLinkComponent || "a" : "div"}
|
|
1153
|
+
actionAttributes={{}}
|
|
1154
|
+
attributes={{
|
|
1155
|
+
...{},
|
|
1156
|
+
...column.link ? {
|
|
1157
|
+
href: column.link
|
|
1158
|
+
} : {},
|
|
1159
|
+
[getClassPropName()]: "builder-column",
|
|
1160
|
+
style: mapStyleObjToStrIfNeeded(columnCssVars(index))
|
|
1161
|
+
}}
|
|
1101
1162
|
><Blocks_default
|
|
1102
1163
|
path={`component.options.columns.${index}.blocks`}
|
|
1103
1164
|
parent={props.builderBlock.id}
|
|
@@ -1106,8 +1167,9 @@ function Columns(props) {
|
|
|
1106
1167
|
}}
|
|
1107
1168
|
context={props.builderContext}
|
|
1108
1169
|
registeredComponents={props.builderComponents}
|
|
1170
|
+
linkComponent={props.builderLinkComponent}
|
|
1109
1171
|
blocks={column.blocks}
|
|
1110
|
-
/></
|
|
1172
|
+
/></Dynamic_renderer_default>;
|
|
1111
1173
|
}}</For4>
|
|
1112
1174
|
</div>;
|
|
1113
1175
|
}
|
|
@@ -1120,7 +1182,7 @@ function FragmentComponent(props) {
|
|
|
1120
1182
|
var fragment_default = FragmentComponent;
|
|
1121
1183
|
|
|
1122
1184
|
// src/blocks/image/image.tsx
|
|
1123
|
-
import { Show as
|
|
1185
|
+
import { Show as Show7 } from "solid-js";
|
|
1124
1186
|
import { css as css3 } from "solid-styled-components";
|
|
1125
1187
|
|
|
1126
1188
|
// src/blocks/image/image.helpers.ts
|
|
@@ -1210,7 +1272,7 @@ function Image(props) {
|
|
|
1210
1272
|
}
|
|
1211
1273
|
return <>
|
|
1212
1274
|
<picture>
|
|
1213
|
-
<
|
|
1275
|
+
<Show7 when={webpSrcSet()}><source type="image/webp" srcset={webpSrcSet()} /></Show7>
|
|
1214
1276
|
<img
|
|
1215
1277
|
class={"builder-image" + (props.className ? " " + props.className : "") + " " + css3({
|
|
1216
1278
|
opacity: "1",
|
|
@@ -1229,7 +1291,7 @@ function Image(props) {
|
|
|
1229
1291
|
sizes={props.sizes}
|
|
1230
1292
|
/>
|
|
1231
1293
|
</picture>
|
|
1232
|
-
<
|
|
1294
|
+
<Show7
|
|
1233
1295
|
when={props.aspectRatio && !(props.builderBlock?.children?.length && props.fitContent)}
|
|
1234
1296
|
><div
|
|
1235
1297
|
class={"builder-image-sizer " + css3({
|
|
@@ -1240,9 +1302,9 @@ function Image(props) {
|
|
|
1240
1302
|
style={{
|
|
1241
1303
|
"padding-top": props.aspectRatio * 100 + "%"
|
|
1242
1304
|
}}
|
|
1243
|
-
/></
|
|
1244
|
-
<
|
|
1245
|
-
<
|
|
1305
|
+
/></Show7>
|
|
1306
|
+
<Show7 when={props.builderBlock?.children?.length && props.fitContent}>{props.children}</Show7>
|
|
1307
|
+
<Show7 when={!props.fitContent && props.children}><div
|
|
1246
1308
|
class={css3({
|
|
1247
1309
|
display: "flex",
|
|
1248
1310
|
flexDirection: "column",
|
|
@@ -1253,7 +1315,7 @@ function Image(props) {
|
|
|
1253
1315
|
width: "100%",
|
|
1254
1316
|
height: "100%"
|
|
1255
1317
|
})}
|
|
1256
|
-
>{props.children}</div></
|
|
1318
|
+
>{props.children}</div></Show7>
|
|
1257
1319
|
</>;
|
|
1258
1320
|
}
|
|
1259
1321
|
var image_default = Image;
|
|
@@ -1283,7 +1345,7 @@ var section_default = SectionComponent;
|
|
|
1283
1345
|
import { onMount as onMount4, on as on3, createEffect as createEffect3, createSignal as createSignal14 } from "solid-js";
|
|
1284
1346
|
|
|
1285
1347
|
// src/components/content-variants/content-variants.tsx
|
|
1286
|
-
import { Show as
|
|
1348
|
+
import { Show as Show11, For as For5, onMount as onMount3, createSignal as createSignal13 } from "solid-js";
|
|
1287
1349
|
|
|
1288
1350
|
// src/helpers/url.ts
|
|
1289
1351
|
var getTopLevelDomain = (host) => {
|
|
@@ -1477,7 +1539,7 @@ var handleABTesting = async ({
|
|
|
1477
1539
|
var getDefaultCanTrack = (canTrack) => checkIsDefined(canTrack) ? canTrack : true;
|
|
1478
1540
|
|
|
1479
1541
|
// src/components/content/content.tsx
|
|
1480
|
-
import { Show as
|
|
1542
|
+
import { Show as Show10, createSignal as createSignal12 } from "solid-js";
|
|
1481
1543
|
|
|
1482
1544
|
// src/blocks/button/component-info.ts
|
|
1483
1545
|
var componentInfo = {
|
|
@@ -2286,7 +2348,7 @@ var componentInfo12 = {
|
|
|
2286
2348
|
};
|
|
2287
2349
|
|
|
2288
2350
|
// src/blocks/video/video.tsx
|
|
2289
|
-
import { Show as
|
|
2351
|
+
import { Show as Show8 } from "solid-js";
|
|
2290
2352
|
function Video(props) {
|
|
2291
2353
|
function videoProps() {
|
|
2292
2354
|
return {
|
|
@@ -2337,8 +2399,8 @@ function Video(props) {
|
|
|
2337
2399
|
}}
|
|
2338
2400
|
src={props.video || "no-src"}
|
|
2339
2401
|
poster={props.posterImage}
|
|
2340
|
-
><
|
|
2341
|
-
<
|
|
2402
|
+
><Show8 when={!props.lazyLoad}><source type="video/mp4" src={props.video} /></Show8></video>
|
|
2403
|
+
<Show8
|
|
2342
2404
|
when={props.aspectRatio && !(props.fitContent && props.builderBlock?.children?.length)}
|
|
2343
2405
|
><div
|
|
2344
2406
|
style={{
|
|
@@ -2347,15 +2409,15 @@ function Video(props) {
|
|
|
2347
2409
|
"pointer-events": "none",
|
|
2348
2410
|
"font-size": "0px"
|
|
2349
2411
|
}}
|
|
2350
|
-
/></
|
|
2351
|
-
<
|
|
2412
|
+
/></Show8>
|
|
2413
|
+
<Show8 when={props.builderBlock?.children?.length && props.fitContent}><div
|
|
2352
2414
|
style={{
|
|
2353
2415
|
display: "flex",
|
|
2354
2416
|
"flex-direction": "column",
|
|
2355
2417
|
"align-items": "stretch"
|
|
2356
2418
|
}}
|
|
2357
|
-
>{props.children}</div></
|
|
2358
|
-
<
|
|
2419
|
+
>{props.children}</div></Show8>
|
|
2420
|
+
<Show8 when={props.builderBlock?.children?.length && !props.fitContent}><div
|
|
2359
2421
|
style={{
|
|
2360
2422
|
"pointer-events": "none",
|
|
2361
2423
|
display: "flex",
|
|
@@ -2367,7 +2429,7 @@ function Video(props) {
|
|
|
2367
2429
|
width: "100%",
|
|
2368
2430
|
height: "100%"
|
|
2369
2431
|
}}
|
|
2370
|
-
>{props.children}</div></
|
|
2432
|
+
>{props.children}</div></Show8>
|
|
2371
2433
|
</div>;
|
|
2372
2434
|
}
|
|
2373
2435
|
var video_default = Video;
|
|
@@ -2487,7 +2549,7 @@ function InlinedScript(props) {
|
|
|
2487
2549
|
var Inlined_script_default = InlinedScript;
|
|
2488
2550
|
|
|
2489
2551
|
// src/components/content/components/enable-editor.tsx
|
|
2490
|
-
import { Show as
|
|
2552
|
+
import { Show as Show9, onMount as onMount2, on as on2, createEffect as createEffect2, createSignal as createSignal10 } from "solid-js";
|
|
2491
2553
|
import { Dynamic as Dynamic5 } from "solid-js/web";
|
|
2492
2554
|
|
|
2493
2555
|
// src/helpers/preview-lru-cache/get.ts
|
|
@@ -2982,7 +3044,7 @@ var getInteractionPropertiesForEvent = (event) => {
|
|
|
2982
3044
|
};
|
|
2983
3045
|
|
|
2984
3046
|
// src/constants/sdk-version.ts
|
|
2985
|
-
var SDK_VERSION = "0.12.
|
|
3047
|
+
var SDK_VERSION = "0.12.4";
|
|
2986
3048
|
|
|
2987
3049
|
// src/functions/register.ts
|
|
2988
3050
|
var registry = {};
|
|
@@ -3406,7 +3468,7 @@ function EnableEditor(props) {
|
|
|
3406
3468
|
}
|
|
3407
3469
|
}
|
|
3408
3470
|
createEffect2(on2(() => [props.locale], onUpdateFn_6));
|
|
3409
|
-
return <builder_context_default.Provider value={props.builderContextSignal}><
|
|
3471
|
+
return <builder_context_default.Provider value={props.builderContextSignal}><Show9 when={props.builderContextSignal.content}><Dynamic5
|
|
3410
3472
|
class={`variant-${props.content?.testVariationId || props.content?.id}`}
|
|
3411
3473
|
{...{}}
|
|
3412
3474
|
key={forceReRenderCount()}
|
|
@@ -3421,7 +3483,7 @@ function EnableEditor(props) {
|
|
|
3421
3483
|
}}
|
|
3422
3484
|
{...props.contentWrapperProps}
|
|
3423
3485
|
component={ContentWrapper()}
|
|
3424
|
-
>{props.children}</Dynamic5></
|
|
3486
|
+
>{props.children}</Dynamic5></Show9></builder_context_default.Provider>;
|
|
3425
3487
|
}
|
|
3426
3488
|
var Enable_editor_default = EnableEditor;
|
|
3427
3489
|
|
|
@@ -3643,21 +3705,23 @@ function ContentComponent(props) {
|
|
|
3643
3705
|
builderContextSignal={builderContextSignal()}
|
|
3644
3706
|
contentWrapper={props.contentWrapper}
|
|
3645
3707
|
contentWrapperProps={props.contentWrapperProps}
|
|
3708
|
+
linkComponent={props.linkComponent}
|
|
3646
3709
|
trustedHosts={props.trustedHosts}
|
|
3647
3710
|
{...{
|
|
3648
3711
|
setBuilderContextSignal
|
|
3649
3712
|
}}
|
|
3650
3713
|
>
|
|
3651
|
-
<
|
|
3652
|
-
<
|
|
3714
|
+
<Show10 when={props.isSsrAbTest}><Inlined_script_default scriptStr={scriptStr()} /></Show10>
|
|
3715
|
+
<Show10 when={TARGET !== "reactNative"}><Styles_default
|
|
3653
3716
|
contentId={builderContextSignal().content?.id}
|
|
3654
3717
|
cssCode={builderContextSignal().content?.data?.cssCode}
|
|
3655
3718
|
customFonts={builderContextSignal().content?.data?.customFonts}
|
|
3656
|
-
/></
|
|
3719
|
+
/></Show10>
|
|
3657
3720
|
<Blocks_default
|
|
3658
3721
|
blocks={builderContextSignal().content?.data?.blocks}
|
|
3659
3722
|
context={builderContextSignal()}
|
|
3660
3723
|
registeredComponents={registeredComponents()}
|
|
3724
|
+
linkComponent={props.linkComponent}
|
|
3661
3725
|
/>
|
|
3662
3726
|
</Enable_editor_default></components_context_default.Provider>;
|
|
3663
3727
|
}
|
|
@@ -3696,8 +3760,8 @@ function ContentVariants(props) {
|
|
|
3696
3760
|
setShouldRenderVariants(false);
|
|
3697
3761
|
});
|
|
3698
3762
|
return <>
|
|
3699
|
-
<
|
|
3700
|
-
<
|
|
3763
|
+
<Show11 when={!props.__isNestedRender && TARGET !== "reactNative"}><Inlined_script_default scriptStr={getScriptString()} /></Show11>
|
|
3764
|
+
<Show11 when={shouldRenderVariants()}>
|
|
3701
3765
|
<Inlined_styles_default
|
|
3702
3766
|
id={`variants-styles-${props.content?.id}`}
|
|
3703
3767
|
styles={hideVariantsStyleString()}
|
|
@@ -3717,6 +3781,7 @@ function ContentVariants(props) {
|
|
|
3717
3781
|
apiKey={props.apiKey}
|
|
3718
3782
|
apiVersion={props.apiVersion}
|
|
3719
3783
|
customComponents={props.customComponents}
|
|
3784
|
+
linkComponent={props.linkComponent}
|
|
3720
3785
|
canTrack={props.canTrack}
|
|
3721
3786
|
locale={props.locale}
|
|
3722
3787
|
includeRefs={props.includeRefs}
|
|
@@ -3729,7 +3794,7 @@ function ContentVariants(props) {
|
|
|
3729
3794
|
trustedHosts={props.trustedHosts}
|
|
3730
3795
|
/>;
|
|
3731
3796
|
}}</For5>
|
|
3732
|
-
</
|
|
3797
|
+
</Show11>
|
|
3733
3798
|
<Content_default
|
|
3734
3799
|
{...{}}
|
|
3735
3800
|
content={defaultContent()}
|
|
@@ -3740,6 +3805,7 @@ function ContentVariants(props) {
|
|
|
3740
3805
|
apiKey={props.apiKey}
|
|
3741
3806
|
apiVersion={props.apiVersion}
|
|
3742
3807
|
customComponents={props.customComponents}
|
|
3808
|
+
linkComponent={props.linkComponent}
|
|
3743
3809
|
canTrack={props.canTrack}
|
|
3744
3810
|
locale={props.locale}
|
|
3745
3811
|
includeRefs={props.includeRefs}
|
|
@@ -3784,7 +3850,7 @@ function Symbol(props) {
|
|
|
3784
3850
|
const [contentToUse, setContentToUse] = createSignal14(props.symbol?.content);
|
|
3785
3851
|
function className() {
|
|
3786
3852
|
return [
|
|
3787
|
-
...[props.attributes
|
|
3853
|
+
...[props.attributes[getClassPropName()]],
|
|
3788
3854
|
"builder-symbol",
|
|
3789
3855
|
props.symbol?.inline ? "builder-inline-symbol" : void 0,
|
|
3790
3856
|
props.symbol?.dynamic || props.dynamic ? "builder-dynamic-symbol" : void 0
|
|
@@ -3825,6 +3891,7 @@ function Symbol(props) {
|
|
|
3825
3891
|
}}
|
|
3826
3892
|
model={props.symbol?.model}
|
|
3827
3893
|
content={contentToUse()}
|
|
3894
|
+
linkComponent={props.builderLinkComponent}
|
|
3828
3895
|
/></div>;
|
|
3829
3896
|
}
|
|
3830
3897
|
var symbol_default = Symbol;
|