@builder.io/sdk-solid 1.0.31 → 1.0.32
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 +1 -0
- package/lib/browser/dev.js +49 -39
- package/lib/browser/dev.jsx +34 -20
- package/lib/browser/index.js +49 -39
- package/lib/browser/index.jsx +34 -20
- package/lib/edge/dev.js +53 -50
- package/lib/edge/dev.jsx +38 -31
- package/lib/edge/index.js +53 -50
- package/lib/edge/index.jsx +38 -31
- package/lib/node/dev.js +49 -39
- package/lib/node/dev.jsx +34 -20
- package/lib/node/index.js +49 -39
- package/lib/node/index.jsx +34 -20
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
package/lib/browser/dev.js
CHANGED
|
@@ -122,11 +122,7 @@ var components_context_default = createContext({ registeredComponents: {} });
|
|
|
122
122
|
function getBlockComponentOptions(block) {
|
|
123
123
|
return {
|
|
124
124
|
...block.component?.options,
|
|
125
|
-
...block.options
|
|
126
|
-
/**
|
|
127
|
-
* Our built-in components frequently make use of the block, so we provide all of it under `builderBlock`
|
|
128
|
-
*/
|
|
129
|
-
builderBlock: block
|
|
125
|
+
...block.options
|
|
130
126
|
};
|
|
131
127
|
}
|
|
132
128
|
|
|
@@ -789,11 +785,25 @@ var getRepeatItemData = ({
|
|
|
789
785
|
}));
|
|
790
786
|
return repeatArray;
|
|
791
787
|
};
|
|
792
|
-
var
|
|
793
|
-
return block && (block.isRSC || ["Core:Button", "Symbol", "Columns", "Form:Form", "Builder: Tabs", "Builder:Accordion"].includes(block.name))
|
|
788
|
+
var provideLinkComponent = (block, linkComponent) => {
|
|
789
|
+
return block && (block.isRSC && TARGET === "rsc" || ["Core:Button", "Symbol", "Columns", "Form:Form", "Builder: Tabs", "Builder:Accordion"].includes(block.name)) ? {
|
|
790
|
+
builderLinkComponent: linkComponent
|
|
791
|
+
} : {};
|
|
792
|
+
};
|
|
793
|
+
var provideRegisteredComponents = (block, registeredComponents) => {
|
|
794
|
+
return block && (block.isRSC && TARGET === "rsc" || ["Symbol", "Columns", "Form:Form", "Builder: Tabs", "Builder:Accordion"].includes(block.name)) ? {
|
|
795
|
+
builderComponents: registeredComponents
|
|
796
|
+
} : {};
|
|
797
|
+
};
|
|
798
|
+
var provideBuilderBlock = (block, builderBlock) => {
|
|
799
|
+
return block && (block.isRSC && TARGET === "rsc" || TARGET === "reactNative" && block.name === "Text" || ["Builder:Accordion", "Columns", "Form:Form", "Builder: Tabs", "Symbol", "Image", "Video"].includes(block.name)) ? {
|
|
800
|
+
builderBlock
|
|
801
|
+
} : {};
|
|
794
802
|
};
|
|
795
|
-
var
|
|
796
|
-
return block && (block.isRSC || ["
|
|
803
|
+
var provideBuilderContext = (block, context) => {
|
|
804
|
+
return block && (block.isRSC && TARGET === "rsc" || ["Builder:Accordion", "Columns", "Form:Form", "Builder: Tabs", "Symbol", "Slot"].includes(block.name)) ? {
|
|
805
|
+
builderContext: context
|
|
806
|
+
} : {};
|
|
797
807
|
};
|
|
798
808
|
|
|
799
809
|
// src/constants/device-sizes.ts
|
|
@@ -1242,13 +1252,10 @@ function Block(props) {
|
|
|
1242
1252
|
componentRef: blockComponent()?.component,
|
|
1243
1253
|
componentOptions: {
|
|
1244
1254
|
...getBlockComponentOptions(processedBlock()),
|
|
1245
|
-
|
|
1246
|
-
...
|
|
1247
|
-
|
|
1248
|
-
|
|
1249
|
-
...shouldPassRegisteredComponents(blockComponent()) ? {
|
|
1250
|
-
builderComponents: props.registeredComponents
|
|
1251
|
-
} : {}
|
|
1255
|
+
...provideBuilderBlock(blockComponent(), processedBlock()),
|
|
1256
|
+
...provideBuilderContext(blockComponent(), props.context),
|
|
1257
|
+
...provideLinkComponent(blockComponent(), props.linkComponent),
|
|
1258
|
+
...provideRegisteredComponents(blockComponent(), props.registeredComponents)
|
|
1252
1259
|
},
|
|
1253
1260
|
context: props.context,
|
|
1254
1261
|
linkComponent: props.linkComponent,
|
|
@@ -1356,9 +1363,6 @@ function Block(props) {
|
|
|
1356
1363
|
get context() {
|
|
1357
1364
|
return props.context;
|
|
1358
1365
|
},
|
|
1359
|
-
get linkComponent() {
|
|
1360
|
-
return props.linkComponent;
|
|
1361
|
-
},
|
|
1362
1366
|
get children() {
|
|
1363
1367
|
return [createComponent(component_ref_default, {
|
|
1364
1368
|
get componentRef() {
|
|
@@ -1784,7 +1788,7 @@ function getSrcSet(url) {
|
|
|
1784
1788
|
|
|
1785
1789
|
// src/blocks/image/image.tsx
|
|
1786
1790
|
var _tmpl$4 = /* @__PURE__ */ template(`<source type=image/webp>`);
|
|
1787
|
-
var _tmpl$22 = /* @__PURE__ */ template(`<picture><img
|
|
1791
|
+
var _tmpl$22 = /* @__PURE__ */ template(`<picture><img>`);
|
|
1788
1792
|
var _tmpl$32 = /* @__PURE__ */ template(`<div>`);
|
|
1789
1793
|
function Image(props) {
|
|
1790
1794
|
const srcSetToUse = createMemo(() => {
|
|
@@ -1839,18 +1843,20 @@ function Image(props) {
|
|
|
1839
1843
|
const _v$ = "builder-image" + (props.className ? " " + props.className : "") + " " + css({
|
|
1840
1844
|
opacity: "1",
|
|
1841
1845
|
transition: "opacity 0.2s ease-in-out"
|
|
1842
|
-
}), _v$2 = props.
|
|
1846
|
+
}), _v$2 = props.highPriority ? "eager" : "lazy", _v$3 = props.highPriority ? "high" : "auto", _v$4 = props.altText, _v$5 = props.altText ? void 0 : "presentation", _v$6 = {
|
|
1843
1847
|
"object-position": props.backgroundPosition || "center",
|
|
1844
1848
|
"object-fit": props.backgroundSize || "cover",
|
|
1845
1849
|
...aspectRatioCss()
|
|
1846
|
-
}, _v$
|
|
1850
|
+
}, _v$7 = props.image, _v$8 = srcSetToUse(), _v$9 = props.sizes;
|
|
1847
1851
|
_v$ !== _p$._v$ && className(_el$3, _p$._v$ = _v$);
|
|
1848
|
-
_v$2 !== _p$._v$2 && setAttribute(_el$3, "
|
|
1849
|
-
_v$3 !== _p$._v$3 && setAttribute(_el$3, "
|
|
1850
|
-
_p$._v$4
|
|
1851
|
-
_v$5 !== _p$._v$5 && setAttribute(_el$3, "
|
|
1852
|
-
|
|
1853
|
-
_v$7 !== _p$._v$7 && setAttribute(_el$3, "
|
|
1852
|
+
_v$2 !== _p$._v$2 && setAttribute(_el$3, "loading", _p$._v$2 = _v$2);
|
|
1853
|
+
_v$3 !== _p$._v$3 && setAttribute(_el$3, "fetchpriority", _p$._v$3 = _v$3);
|
|
1854
|
+
_v$4 !== _p$._v$4 && setAttribute(_el$3, "alt", _p$._v$4 = _v$4);
|
|
1855
|
+
_v$5 !== _p$._v$5 && setAttribute(_el$3, "role", _p$._v$5 = _v$5);
|
|
1856
|
+
_p$._v$6 = style(_el$3, _v$6, _p$._v$6);
|
|
1857
|
+
_v$7 !== _p$._v$7 && setAttribute(_el$3, "src", _p$._v$7 = _v$7);
|
|
1858
|
+
_v$8 !== _p$._v$8 && setAttribute(_el$3, "srcset", _p$._v$8 = _v$8);
|
|
1859
|
+
_v$9 !== _p$._v$9 && setAttribute(_el$3, "sizes", _p$._v$9 = _v$9);
|
|
1854
1860
|
return _p$;
|
|
1855
1861
|
}, {
|
|
1856
1862
|
_v$: void 0,
|
|
@@ -1859,7 +1865,9 @@ function Image(props) {
|
|
|
1859
1865
|
_v$4: void 0,
|
|
1860
1866
|
_v$5: void 0,
|
|
1861
1867
|
_v$6: void 0,
|
|
1862
|
-
_v$7: void 0
|
|
1868
|
+
_v$7: void 0,
|
|
1869
|
+
_v$8: void 0,
|
|
1870
|
+
_v$9: void 0
|
|
1863
1871
|
});
|
|
1864
1872
|
return _el$;
|
|
1865
1873
|
})(), createComponent(Show, {
|
|
@@ -1869,17 +1877,17 @@ function Image(props) {
|
|
|
1869
1877
|
get children() {
|
|
1870
1878
|
const _el$4 = _tmpl$32();
|
|
1871
1879
|
effect((_p$) => {
|
|
1872
|
-
const _v$
|
|
1880
|
+
const _v$10 = "builder-image-sizer " + css({
|
|
1873
1881
|
width: "100%",
|
|
1874
1882
|
pointerEvents: "none",
|
|
1875
1883
|
fontSize: "0"
|
|
1876
|
-
}), _v$
|
|
1877
|
-
_v$
|
|
1878
|
-
_v$
|
|
1884
|
+
}), _v$11 = props.aspectRatio * 100 + "%";
|
|
1885
|
+
_v$10 !== _p$._v$10 && className(_el$4, _p$._v$10 = _v$10);
|
|
1886
|
+
_v$11 !== _p$._v$11 && ((_p$._v$11 = _v$11) != null ? _el$4.style.setProperty("padding-top", _v$11) : _el$4.style.removeProperty("padding-top"));
|
|
1879
1887
|
return _p$;
|
|
1880
1888
|
}, {
|
|
1881
|
-
_v$
|
|
1882
|
-
_v$
|
|
1889
|
+
_v$10: void 0,
|
|
1890
|
+
_v$11: void 0
|
|
1883
1891
|
});
|
|
1884
1892
|
return _el$4;
|
|
1885
1893
|
}
|
|
@@ -2820,6 +2828,11 @@ var componentInfo5 = {
|
|
|
2820
2828
|
type: "boolean",
|
|
2821
2829
|
helperText: "When child blocks are provided, fit to them instead of using the image's aspect ratio",
|
|
2822
2830
|
defaultValue: true
|
|
2831
|
+
}, {
|
|
2832
|
+
name: "highPriority",
|
|
2833
|
+
type: "boolean",
|
|
2834
|
+
advanced: true,
|
|
2835
|
+
helperText: "Mark this image as high priority compared to other images on the page. This prevents lazy loading of the image and tells the browser to load this image before others on the page."
|
|
2823
2836
|
}, {
|
|
2824
2837
|
name: "aspectRatio",
|
|
2825
2838
|
type: "number",
|
|
@@ -5023,7 +5036,7 @@ function isFromTrustedHost(trustedHosts, e) {
|
|
|
5023
5036
|
}
|
|
5024
5037
|
|
|
5025
5038
|
// src/constants/sdk-version.ts
|
|
5026
|
-
var SDK_VERSION = "1.0.
|
|
5039
|
+
var SDK_VERSION = "1.0.32";
|
|
5027
5040
|
|
|
5028
5041
|
// src/functions/register.ts
|
|
5029
5042
|
var registry = {};
|
|
@@ -5742,9 +5755,6 @@ function ContentComponent(props) {
|
|
|
5742
5755
|
get contentWrapperProps() {
|
|
5743
5756
|
return props.contentWrapperProps;
|
|
5744
5757
|
},
|
|
5745
|
-
get linkComponent() {
|
|
5746
|
-
return props.linkComponent;
|
|
5747
|
-
},
|
|
5748
5758
|
get trustedHosts() {
|
|
5749
5759
|
return props.trustedHosts;
|
|
5750
5760
|
}
|
package/lib/browser/dev.jsx
CHANGED
|
@@ -109,11 +109,7 @@ import { Show as Show4, For as For2, onMount, createMemo as createMemo5 } from "
|
|
|
109
109
|
function getBlockComponentOptions(block) {
|
|
110
110
|
return {
|
|
111
111
|
...block.component?.options,
|
|
112
|
-
...block.options
|
|
113
|
-
/**
|
|
114
|
-
* Our built-in components frequently make use of the block, so we provide all of it under `builderBlock`
|
|
115
|
-
*/
|
|
116
|
-
builderBlock: block
|
|
112
|
+
...block.options
|
|
117
113
|
};
|
|
118
114
|
}
|
|
119
115
|
|
|
@@ -776,11 +772,25 @@ var getRepeatItemData = ({
|
|
|
776
772
|
}));
|
|
777
773
|
return repeatArray;
|
|
778
774
|
};
|
|
779
|
-
var
|
|
780
|
-
return block && (block.isRSC || ["Core:Button", "Symbol", "Columns", "Form:Form", "Builder: Tabs", "Builder:Accordion"].includes(block.name))
|
|
775
|
+
var provideLinkComponent = (block, linkComponent) => {
|
|
776
|
+
return block && (block.isRSC && TARGET === "rsc" || ["Core:Button", "Symbol", "Columns", "Form:Form", "Builder: Tabs", "Builder:Accordion"].includes(block.name)) ? {
|
|
777
|
+
builderLinkComponent: linkComponent
|
|
778
|
+
} : {};
|
|
779
|
+
};
|
|
780
|
+
var provideRegisteredComponents = (block, registeredComponents) => {
|
|
781
|
+
return block && (block.isRSC && TARGET === "rsc" || ["Symbol", "Columns", "Form:Form", "Builder: Tabs", "Builder:Accordion"].includes(block.name)) ? {
|
|
782
|
+
builderComponents: registeredComponents
|
|
783
|
+
} : {};
|
|
781
784
|
};
|
|
782
|
-
var
|
|
783
|
-
return block && (block.isRSC || ["
|
|
785
|
+
var provideBuilderBlock = (block, builderBlock) => {
|
|
786
|
+
return block && (block.isRSC && TARGET === "rsc" || TARGET === "reactNative" && block.name === "Text" || ["Builder:Accordion", "Columns", "Form:Form", "Builder: Tabs", "Symbol", "Image", "Video"].includes(block.name)) ? {
|
|
787
|
+
builderBlock
|
|
788
|
+
} : {};
|
|
789
|
+
};
|
|
790
|
+
var provideBuilderContext = (block, context) => {
|
|
791
|
+
return block && (block.isRSC && TARGET === "rsc" || ["Builder:Accordion", "Columns", "Form:Form", "Builder: Tabs", "Symbol", "Slot"].includes(block.name)) ? {
|
|
792
|
+
builderContext: context
|
|
793
|
+
} : {};
|
|
784
794
|
};
|
|
785
795
|
|
|
786
796
|
// src/components/block/components/block-styles.tsx
|
|
@@ -1183,13 +1193,13 @@ function Block(props) {
|
|
|
1183
1193
|
componentRef: blockComponent()?.component,
|
|
1184
1194
|
componentOptions: {
|
|
1185
1195
|
...getBlockComponentOptions(processedBlock()),
|
|
1186
|
-
|
|
1187
|
-
...
|
|
1188
|
-
|
|
1189
|
-
|
|
1190
|
-
|
|
1191
|
-
|
|
1192
|
-
|
|
1196
|
+
...provideBuilderBlock(blockComponent(), processedBlock()),
|
|
1197
|
+
...provideBuilderContext(blockComponent(), props.context),
|
|
1198
|
+
...provideLinkComponent(blockComponent(), props.linkComponent),
|
|
1199
|
+
...provideRegisteredComponents(
|
|
1200
|
+
blockComponent(),
|
|
1201
|
+
props.registeredComponents
|
|
1202
|
+
)
|
|
1193
1203
|
},
|
|
1194
1204
|
context: props.context,
|
|
1195
1205
|
linkComponent: props.linkComponent,
|
|
@@ -1242,7 +1252,6 @@ function Block(props) {
|
|
|
1242
1252
|
Wrapper={Tag()}
|
|
1243
1253
|
block={processedBlock()}
|
|
1244
1254
|
context={props.context}
|
|
1245
|
-
linkComponent={props.linkComponent}
|
|
1246
1255
|
>
|
|
1247
1256
|
<Component_ref_default
|
|
1248
1257
|
componentRef={componentRefProps().componentRef}
|
|
@@ -1610,7 +1619,8 @@ function Image(props) {
|
|
|
1610
1619
|
opacity: "1",
|
|
1611
1620
|
transition: "opacity 0.2s ease-in-out"
|
|
1612
1621
|
})}
|
|
1613
|
-
loading="lazy"
|
|
1622
|
+
loading={props.highPriority ? "eager" : "lazy"}
|
|
1623
|
+
fetchpriority={props.highPriority ? "high" : "auto"}
|
|
1614
1624
|
alt={props.altText}
|
|
1615
1625
|
role={props.altText ? void 0 : "presentation"}
|
|
1616
1626
|
style={{
|
|
@@ -2528,6 +2538,11 @@ var componentInfo5 = {
|
|
|
2528
2538
|
type: "boolean",
|
|
2529
2539
|
helperText: "When child blocks are provided, fit to them instead of using the image's aspect ratio",
|
|
2530
2540
|
defaultValue: true
|
|
2541
|
+
}, {
|
|
2542
|
+
name: "highPriority",
|
|
2543
|
+
type: "boolean",
|
|
2544
|
+
advanced: true,
|
|
2545
|
+
helperText: "Mark this image as high priority compared to other images on the page. This prevents lazy loading of the image and tells the browser to load this image before others on the page."
|
|
2531
2546
|
}, {
|
|
2532
2547
|
name: "aspectRatio",
|
|
2533
2548
|
type: "number",
|
|
@@ -4534,7 +4549,7 @@ function isFromTrustedHost(trustedHosts, e) {
|
|
|
4534
4549
|
}
|
|
4535
4550
|
|
|
4536
4551
|
// src/constants/sdk-version.ts
|
|
4537
|
-
var SDK_VERSION = "1.0.
|
|
4552
|
+
var SDK_VERSION = "1.0.32";
|
|
4538
4553
|
|
|
4539
4554
|
// src/functions/register.ts
|
|
4540
4555
|
var registry = {};
|
|
@@ -5252,7 +5267,6 @@ function ContentComponent(props) {
|
|
|
5252
5267
|
builderContextSignal={builderContextSignal()}
|
|
5253
5268
|
contentWrapper={props.contentWrapper}
|
|
5254
5269
|
contentWrapperProps={props.contentWrapperProps}
|
|
5255
|
-
linkComponent={props.linkComponent}
|
|
5256
5270
|
trustedHosts={props.trustedHosts}
|
|
5257
5271
|
{...{
|
|
5258
5272
|
setBuilderContextSignal
|
package/lib/browser/index.js
CHANGED
|
@@ -122,11 +122,7 @@ var components_context_default = createContext({ registeredComponents: {} });
|
|
|
122
122
|
function getBlockComponentOptions(block) {
|
|
123
123
|
return {
|
|
124
124
|
...block.component?.options,
|
|
125
|
-
...block.options
|
|
126
|
-
/**
|
|
127
|
-
* Our built-in components frequently make use of the block, so we provide all of it under `builderBlock`
|
|
128
|
-
*/
|
|
129
|
-
builderBlock: block
|
|
125
|
+
...block.options
|
|
130
126
|
};
|
|
131
127
|
}
|
|
132
128
|
|
|
@@ -783,11 +779,25 @@ var getRepeatItemData = ({
|
|
|
783
779
|
}));
|
|
784
780
|
return repeatArray;
|
|
785
781
|
};
|
|
786
|
-
var
|
|
787
|
-
return block && (block.isRSC || ["Core:Button", "Symbol", "Columns", "Form:Form", "Builder: Tabs", "Builder:Accordion"].includes(block.name))
|
|
782
|
+
var provideLinkComponent = (block, linkComponent) => {
|
|
783
|
+
return block && (block.isRSC && TARGET === "rsc" || ["Core:Button", "Symbol", "Columns", "Form:Form", "Builder: Tabs", "Builder:Accordion"].includes(block.name)) ? {
|
|
784
|
+
builderLinkComponent: linkComponent
|
|
785
|
+
} : {};
|
|
786
|
+
};
|
|
787
|
+
var provideRegisteredComponents = (block, registeredComponents) => {
|
|
788
|
+
return block && (block.isRSC && TARGET === "rsc" || ["Symbol", "Columns", "Form:Form", "Builder: Tabs", "Builder:Accordion"].includes(block.name)) ? {
|
|
789
|
+
builderComponents: registeredComponents
|
|
790
|
+
} : {};
|
|
791
|
+
};
|
|
792
|
+
var provideBuilderBlock = (block, builderBlock) => {
|
|
793
|
+
return block && (block.isRSC && TARGET === "rsc" || TARGET === "reactNative" && block.name === "Text" || ["Builder:Accordion", "Columns", "Form:Form", "Builder: Tabs", "Symbol", "Image", "Video"].includes(block.name)) ? {
|
|
794
|
+
builderBlock
|
|
795
|
+
} : {};
|
|
788
796
|
};
|
|
789
|
-
var
|
|
790
|
-
return block && (block.isRSC || ["
|
|
797
|
+
var provideBuilderContext = (block, context) => {
|
|
798
|
+
return block && (block.isRSC && TARGET === "rsc" || ["Builder:Accordion", "Columns", "Form:Form", "Builder: Tabs", "Symbol", "Slot"].includes(block.name)) ? {
|
|
799
|
+
builderContext: context
|
|
800
|
+
} : {};
|
|
791
801
|
};
|
|
792
802
|
|
|
793
803
|
// src/constants/device-sizes.ts
|
|
@@ -1236,13 +1246,10 @@ function Block(props) {
|
|
|
1236
1246
|
componentRef: blockComponent()?.component,
|
|
1237
1247
|
componentOptions: {
|
|
1238
1248
|
...getBlockComponentOptions(processedBlock()),
|
|
1239
|
-
|
|
1240
|
-
...
|
|
1241
|
-
|
|
1242
|
-
|
|
1243
|
-
...shouldPassRegisteredComponents(blockComponent()) ? {
|
|
1244
|
-
builderComponents: props.registeredComponents
|
|
1245
|
-
} : {}
|
|
1249
|
+
...provideBuilderBlock(blockComponent(), processedBlock()),
|
|
1250
|
+
...provideBuilderContext(blockComponent(), props.context),
|
|
1251
|
+
...provideLinkComponent(blockComponent(), props.linkComponent),
|
|
1252
|
+
...provideRegisteredComponents(blockComponent(), props.registeredComponents)
|
|
1246
1253
|
},
|
|
1247
1254
|
context: props.context,
|
|
1248
1255
|
linkComponent: props.linkComponent,
|
|
@@ -1350,9 +1357,6 @@ function Block(props) {
|
|
|
1350
1357
|
get context() {
|
|
1351
1358
|
return props.context;
|
|
1352
1359
|
},
|
|
1353
|
-
get linkComponent() {
|
|
1354
|
-
return props.linkComponent;
|
|
1355
|
-
},
|
|
1356
1360
|
get children() {
|
|
1357
1361
|
return [createComponent(component_ref_default, {
|
|
1358
1362
|
get componentRef() {
|
|
@@ -1778,7 +1782,7 @@ function getSrcSet(url) {
|
|
|
1778
1782
|
|
|
1779
1783
|
// src/blocks/image/image.tsx
|
|
1780
1784
|
var _tmpl$4 = /* @__PURE__ */ template(`<source type=image/webp>`);
|
|
1781
|
-
var _tmpl$22 = /* @__PURE__ */ template(`<picture><img
|
|
1785
|
+
var _tmpl$22 = /* @__PURE__ */ template(`<picture><img>`);
|
|
1782
1786
|
var _tmpl$32 = /* @__PURE__ */ template(`<div>`);
|
|
1783
1787
|
function Image(props) {
|
|
1784
1788
|
const srcSetToUse = createMemo(() => {
|
|
@@ -1832,18 +1836,20 @@ function Image(props) {
|
|
|
1832
1836
|
const _v$ = "builder-image" + (props.className ? " " + props.className : "") + " " + css({
|
|
1833
1837
|
opacity: "1",
|
|
1834
1838
|
transition: "opacity 0.2s ease-in-out"
|
|
1835
|
-
}), _v$2 = props.
|
|
1839
|
+
}), _v$2 = props.highPriority ? "eager" : "lazy", _v$3 = props.highPriority ? "high" : "auto", _v$4 = props.altText, _v$5 = props.altText ? void 0 : "presentation", _v$6 = {
|
|
1836
1840
|
"object-position": props.backgroundPosition || "center",
|
|
1837
1841
|
"object-fit": props.backgroundSize || "cover",
|
|
1838
1842
|
...aspectRatioCss()
|
|
1839
|
-
}, _v$
|
|
1843
|
+
}, _v$7 = props.image, _v$8 = srcSetToUse(), _v$9 = props.sizes;
|
|
1840
1844
|
_v$ !== _p$._v$ && className(_el$3, _p$._v$ = _v$);
|
|
1841
|
-
_v$2 !== _p$._v$2 && setAttribute(_el$3, "
|
|
1842
|
-
_v$3 !== _p$._v$3 && setAttribute(_el$3, "
|
|
1843
|
-
_p$._v$4
|
|
1844
|
-
_v$5 !== _p$._v$5 && setAttribute(_el$3, "
|
|
1845
|
-
|
|
1846
|
-
_v$7 !== _p$._v$7 && setAttribute(_el$3, "
|
|
1845
|
+
_v$2 !== _p$._v$2 && setAttribute(_el$3, "loading", _p$._v$2 = _v$2);
|
|
1846
|
+
_v$3 !== _p$._v$3 && setAttribute(_el$3, "fetchpriority", _p$._v$3 = _v$3);
|
|
1847
|
+
_v$4 !== _p$._v$4 && setAttribute(_el$3, "alt", _p$._v$4 = _v$4);
|
|
1848
|
+
_v$5 !== _p$._v$5 && setAttribute(_el$3, "role", _p$._v$5 = _v$5);
|
|
1849
|
+
_p$._v$6 = style(_el$3, _v$6, _p$._v$6);
|
|
1850
|
+
_v$7 !== _p$._v$7 && setAttribute(_el$3, "src", _p$._v$7 = _v$7);
|
|
1851
|
+
_v$8 !== _p$._v$8 && setAttribute(_el$3, "srcset", _p$._v$8 = _v$8);
|
|
1852
|
+
_v$9 !== _p$._v$9 && setAttribute(_el$3, "sizes", _p$._v$9 = _v$9);
|
|
1847
1853
|
return _p$;
|
|
1848
1854
|
}, {
|
|
1849
1855
|
_v$: void 0,
|
|
@@ -1852,7 +1858,9 @@ function Image(props) {
|
|
|
1852
1858
|
_v$4: void 0,
|
|
1853
1859
|
_v$5: void 0,
|
|
1854
1860
|
_v$6: void 0,
|
|
1855
|
-
_v$7: void 0
|
|
1861
|
+
_v$7: void 0,
|
|
1862
|
+
_v$8: void 0,
|
|
1863
|
+
_v$9: void 0
|
|
1856
1864
|
});
|
|
1857
1865
|
return _el$;
|
|
1858
1866
|
})(), createComponent(Show, {
|
|
@@ -1862,17 +1870,17 @@ function Image(props) {
|
|
|
1862
1870
|
get children() {
|
|
1863
1871
|
const _el$4 = _tmpl$32();
|
|
1864
1872
|
effect((_p$) => {
|
|
1865
|
-
const _v$
|
|
1873
|
+
const _v$10 = "builder-image-sizer " + css({
|
|
1866
1874
|
width: "100%",
|
|
1867
1875
|
pointerEvents: "none",
|
|
1868
1876
|
fontSize: "0"
|
|
1869
|
-
}), _v$
|
|
1870
|
-
_v$
|
|
1871
|
-
_v$
|
|
1877
|
+
}), _v$11 = props.aspectRatio * 100 + "%";
|
|
1878
|
+
_v$10 !== _p$._v$10 && className(_el$4, _p$._v$10 = _v$10);
|
|
1879
|
+
_v$11 !== _p$._v$11 && ((_p$._v$11 = _v$11) != null ? _el$4.style.setProperty("padding-top", _v$11) : _el$4.style.removeProperty("padding-top"));
|
|
1872
1880
|
return _p$;
|
|
1873
1881
|
}, {
|
|
1874
|
-
_v$
|
|
1875
|
-
_v$
|
|
1882
|
+
_v$10: void 0,
|
|
1883
|
+
_v$11: void 0
|
|
1876
1884
|
});
|
|
1877
1885
|
return _el$4;
|
|
1878
1886
|
}
|
|
@@ -2812,6 +2820,11 @@ var componentInfo5 = {
|
|
|
2812
2820
|
type: "boolean",
|
|
2813
2821
|
helperText: "When child blocks are provided, fit to them instead of using the image's aspect ratio",
|
|
2814
2822
|
defaultValue: true
|
|
2823
|
+
}, {
|
|
2824
|
+
name: "highPriority",
|
|
2825
|
+
type: "boolean",
|
|
2826
|
+
advanced: true,
|
|
2827
|
+
helperText: "Mark this image as high priority compared to other images on the page. This prevents lazy loading of the image and tells the browser to load this image before others on the page."
|
|
2815
2828
|
}, {
|
|
2816
2829
|
name: "aspectRatio",
|
|
2817
2830
|
type: "number",
|
|
@@ -5008,7 +5021,7 @@ function isFromTrustedHost(trustedHosts, e) {
|
|
|
5008
5021
|
}
|
|
5009
5022
|
|
|
5010
5023
|
// src/constants/sdk-version.ts
|
|
5011
|
-
var SDK_VERSION = "1.0.
|
|
5024
|
+
var SDK_VERSION = "1.0.32";
|
|
5012
5025
|
|
|
5013
5026
|
// src/functions/register.ts
|
|
5014
5027
|
var registry = {};
|
|
@@ -5725,9 +5738,6 @@ function ContentComponent(props) {
|
|
|
5725
5738
|
get contentWrapperProps() {
|
|
5726
5739
|
return props.contentWrapperProps;
|
|
5727
5740
|
},
|
|
5728
|
-
get linkComponent() {
|
|
5729
|
-
return props.linkComponent;
|
|
5730
|
-
},
|
|
5731
5741
|
get trustedHosts() {
|
|
5732
5742
|
return props.trustedHosts;
|
|
5733
5743
|
}
|
package/lib/browser/index.jsx
CHANGED
|
@@ -109,11 +109,7 @@ import { Show as Show4, For as For2, onMount, createMemo as createMemo5 } from "
|
|
|
109
109
|
function getBlockComponentOptions(block) {
|
|
110
110
|
return {
|
|
111
111
|
...block.component?.options,
|
|
112
|
-
...block.options
|
|
113
|
-
/**
|
|
114
|
-
* Our built-in components frequently make use of the block, so we provide all of it under `builderBlock`
|
|
115
|
-
*/
|
|
116
|
-
builderBlock: block
|
|
112
|
+
...block.options
|
|
117
113
|
};
|
|
118
114
|
}
|
|
119
115
|
|
|
@@ -770,11 +766,25 @@ var getRepeatItemData = ({
|
|
|
770
766
|
}));
|
|
771
767
|
return repeatArray;
|
|
772
768
|
};
|
|
773
|
-
var
|
|
774
|
-
return block && (block.isRSC || ["Core:Button", "Symbol", "Columns", "Form:Form", "Builder: Tabs", "Builder:Accordion"].includes(block.name))
|
|
769
|
+
var provideLinkComponent = (block, linkComponent) => {
|
|
770
|
+
return block && (block.isRSC && TARGET === "rsc" || ["Core:Button", "Symbol", "Columns", "Form:Form", "Builder: Tabs", "Builder:Accordion"].includes(block.name)) ? {
|
|
771
|
+
builderLinkComponent: linkComponent
|
|
772
|
+
} : {};
|
|
773
|
+
};
|
|
774
|
+
var provideRegisteredComponents = (block, registeredComponents) => {
|
|
775
|
+
return block && (block.isRSC && TARGET === "rsc" || ["Symbol", "Columns", "Form:Form", "Builder: Tabs", "Builder:Accordion"].includes(block.name)) ? {
|
|
776
|
+
builderComponents: registeredComponents
|
|
777
|
+
} : {};
|
|
775
778
|
};
|
|
776
|
-
var
|
|
777
|
-
return block && (block.isRSC || ["
|
|
779
|
+
var provideBuilderBlock = (block, builderBlock) => {
|
|
780
|
+
return block && (block.isRSC && TARGET === "rsc" || TARGET === "reactNative" && block.name === "Text" || ["Builder:Accordion", "Columns", "Form:Form", "Builder: Tabs", "Symbol", "Image", "Video"].includes(block.name)) ? {
|
|
781
|
+
builderBlock
|
|
782
|
+
} : {};
|
|
783
|
+
};
|
|
784
|
+
var provideBuilderContext = (block, context) => {
|
|
785
|
+
return block && (block.isRSC && TARGET === "rsc" || ["Builder:Accordion", "Columns", "Form:Form", "Builder: Tabs", "Symbol", "Slot"].includes(block.name)) ? {
|
|
786
|
+
builderContext: context
|
|
787
|
+
} : {};
|
|
778
788
|
};
|
|
779
789
|
|
|
780
790
|
// src/components/block/components/block-styles.tsx
|
|
@@ -1177,13 +1187,13 @@ function Block(props) {
|
|
|
1177
1187
|
componentRef: blockComponent()?.component,
|
|
1178
1188
|
componentOptions: {
|
|
1179
1189
|
...getBlockComponentOptions(processedBlock()),
|
|
1180
|
-
|
|
1181
|
-
...
|
|
1182
|
-
|
|
1183
|
-
|
|
1184
|
-
|
|
1185
|
-
|
|
1186
|
-
|
|
1190
|
+
...provideBuilderBlock(blockComponent(), processedBlock()),
|
|
1191
|
+
...provideBuilderContext(blockComponent(), props.context),
|
|
1192
|
+
...provideLinkComponent(blockComponent(), props.linkComponent),
|
|
1193
|
+
...provideRegisteredComponents(
|
|
1194
|
+
blockComponent(),
|
|
1195
|
+
props.registeredComponents
|
|
1196
|
+
)
|
|
1187
1197
|
},
|
|
1188
1198
|
context: props.context,
|
|
1189
1199
|
linkComponent: props.linkComponent,
|
|
@@ -1236,7 +1246,6 @@ function Block(props) {
|
|
|
1236
1246
|
Wrapper={Tag()}
|
|
1237
1247
|
block={processedBlock()}
|
|
1238
1248
|
context={props.context}
|
|
1239
|
-
linkComponent={props.linkComponent}
|
|
1240
1249
|
>
|
|
1241
1250
|
<Component_ref_default
|
|
1242
1251
|
componentRef={componentRefProps().componentRef}
|
|
@@ -1603,7 +1612,8 @@ function Image(props) {
|
|
|
1603
1612
|
opacity: "1",
|
|
1604
1613
|
transition: "opacity 0.2s ease-in-out"
|
|
1605
1614
|
})}
|
|
1606
|
-
loading="lazy"
|
|
1615
|
+
loading={props.highPriority ? "eager" : "lazy"}
|
|
1616
|
+
fetchpriority={props.highPriority ? "high" : "auto"}
|
|
1607
1617
|
alt={props.altText}
|
|
1608
1618
|
role={props.altText ? void 0 : "presentation"}
|
|
1609
1619
|
style={{
|
|
@@ -2520,6 +2530,11 @@ var componentInfo5 = {
|
|
|
2520
2530
|
type: "boolean",
|
|
2521
2531
|
helperText: "When child blocks are provided, fit to them instead of using the image's aspect ratio",
|
|
2522
2532
|
defaultValue: true
|
|
2533
|
+
}, {
|
|
2534
|
+
name: "highPriority",
|
|
2535
|
+
type: "boolean",
|
|
2536
|
+
advanced: true,
|
|
2537
|
+
helperText: "Mark this image as high priority compared to other images on the page. This prevents lazy loading of the image and tells the browser to load this image before others on the page."
|
|
2523
2538
|
}, {
|
|
2524
2539
|
name: "aspectRatio",
|
|
2525
2540
|
type: "number",
|
|
@@ -4519,7 +4534,7 @@ function isFromTrustedHost(trustedHosts, e) {
|
|
|
4519
4534
|
}
|
|
4520
4535
|
|
|
4521
4536
|
// src/constants/sdk-version.ts
|
|
4522
|
-
var SDK_VERSION = "1.0.
|
|
4537
|
+
var SDK_VERSION = "1.0.32";
|
|
4523
4538
|
|
|
4524
4539
|
// src/functions/register.ts
|
|
4525
4540
|
var registry = {};
|
|
@@ -5235,7 +5250,6 @@ function ContentComponent(props) {
|
|
|
5235
5250
|
builderContextSignal={builderContextSignal()}
|
|
5236
5251
|
contentWrapper={props.contentWrapper}
|
|
5237
5252
|
contentWrapperProps={props.contentWrapperProps}
|
|
5238
|
-
linkComponent={props.linkComponent}
|
|
5239
5253
|
trustedHosts={props.trustedHosts}
|
|
5240
5254
|
{...{
|
|
5241
5255
|
setBuilderContextSignal
|