@builder.io/sdk-solid 1.0.20 → 1.0.22
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 +4 -4
- package/lib/browser/dev.js +23 -41
- package/lib/browser/dev.jsx +30 -41
- package/lib/browser/index.js +23 -41
- package/lib/browser/index.jsx +30 -41
- package/lib/edge/dev.js +23 -41
- package/lib/edge/dev.jsx +30 -41
- package/lib/edge/index.js +23 -41
- package/lib/edge/index.jsx +30 -41
- package/lib/node/dev.js +45 -43
- package/lib/node/dev.jsx +52 -43
- package/lib/node/index.js +46 -43
- package/lib/node/index.jsx +53 -43
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -695,7 +695,7 @@ type Search = URLSearchParams | string | QueryObject;
|
|
|
695
695
|
|
|
696
696
|
declare function isEditing(search?: Search): boolean;
|
|
697
697
|
|
|
698
|
-
declare function isPreviewing(
|
|
698
|
+
declare function isPreviewing(_search?: Search): boolean;
|
|
699
699
|
|
|
700
700
|
declare const createRegisterComponentMessage: (info: ComponentInfo) => {
|
|
701
701
|
type: string;
|
|
@@ -938,11 +938,11 @@ interface GetContentOptions {
|
|
|
938
938
|
/**
|
|
939
939
|
* Optional override of the `fetch` function. (Defaults to global `fetch`)
|
|
940
940
|
*/
|
|
941
|
-
fetch?:
|
|
941
|
+
fetch?: (input: string, init?: object) => Promise<any>;
|
|
942
942
|
/**
|
|
943
|
-
* Optional fetch options to be passed to the `fetch` function.
|
|
943
|
+
* Optional fetch options to be passed as the second argument to the `fetch` function.
|
|
944
944
|
*/
|
|
945
|
-
fetchOptions?:
|
|
945
|
+
fetchOptions?: object;
|
|
946
946
|
}
|
|
947
947
|
|
|
948
948
|
type GetBuilderPropsOptions = (Omit<GetContentOptions, 'model'> & {
|
package/lib/browser/dev.js
CHANGED
|
@@ -165,7 +165,8 @@ function isIframe() {
|
|
|
165
165
|
|
|
166
166
|
// src/functions/is-editing.ts
|
|
167
167
|
function isEditing(search) {
|
|
168
|
-
return isIframe() && (TARGET === "reactNative" ||
|
|
168
|
+
return isIframe() && (TARGET === "reactNative" || // accessing window.location.search is safe here because `isIframe()` is only `true` if we're in a browser.
|
|
169
|
+
getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1);
|
|
169
170
|
}
|
|
170
171
|
|
|
171
172
|
// src/functions/track/helpers.ts
|
|
@@ -536,9 +537,6 @@ function bindAnimations(animations) {
|
|
|
536
537
|
case "pageLoad":
|
|
537
538
|
triggerAnimation(animation);
|
|
538
539
|
break;
|
|
539
|
-
case "hover":
|
|
540
|
-
bindHoverAnimation(animation);
|
|
541
|
-
break;
|
|
542
540
|
case "scrollInView":
|
|
543
541
|
bindScrollInViewAnimation(animation);
|
|
544
542
|
break;
|
|
@@ -597,33 +595,6 @@ function triggerAnimation(animation) {
|
|
|
597
595
|
});
|
|
598
596
|
});
|
|
599
597
|
}
|
|
600
|
-
function bindHoverAnimation(animation) {
|
|
601
|
-
const elements = Array.prototype.slice.call(document.getElementsByClassName(animation.elementId || animation.id || ""));
|
|
602
|
-
if (!elements.length) {
|
|
603
|
-
warnElementNotPresent(animation.elementId || animation.id || "");
|
|
604
|
-
return;
|
|
605
|
-
}
|
|
606
|
-
Array.from(elements).forEach((element) => {
|
|
607
|
-
augmentAnimation(animation, element);
|
|
608
|
-
const defaultState = animation.steps[0].styles;
|
|
609
|
-
const hoverState = animation.steps[1].styles;
|
|
610
|
-
function attachDefaultState() {
|
|
611
|
-
assign(element.style, defaultState);
|
|
612
|
-
}
|
|
613
|
-
function attachHoverState() {
|
|
614
|
-
assign(element.style, hoverState);
|
|
615
|
-
}
|
|
616
|
-
attachDefaultState();
|
|
617
|
-
element.addEventListener("mouseenter", attachHoverState);
|
|
618
|
-
element.addEventListener("mouseleave", attachDefaultState);
|
|
619
|
-
setTimeout(() => {
|
|
620
|
-
element.style.transition = `all ${animation.duration}s ${camelCaseToKebabCase(animation.easing)}`;
|
|
621
|
-
if (animation.delay) {
|
|
622
|
-
element.style.transitionDelay = animation.delay + "s";
|
|
623
|
-
}
|
|
624
|
-
});
|
|
625
|
-
});
|
|
626
|
-
}
|
|
627
598
|
function bindScrollInViewAnimation(animation) {
|
|
628
599
|
const elements = Array.prototype.slice.call(document.getElementsByClassName(animation.elementId || animation.id || ""));
|
|
629
600
|
if (!elements.length) {
|
|
@@ -934,7 +905,20 @@ function BlockStyles(props) {
|
|
|
934
905
|
styles: smallStyles,
|
|
935
906
|
mediaQuery: getMaxWidthQueryForSize("small", sizesWithUpdatedBreakpoints)
|
|
936
907
|
}) : "";
|
|
937
|
-
|
|
908
|
+
const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
|
|
909
|
+
let hoverStylesClass = "";
|
|
910
|
+
if (hoverAnimation) {
|
|
911
|
+
const hoverStyles = hoverAnimation.steps?.[1]?.styles || {};
|
|
912
|
+
hoverStylesClass = createCssClass({
|
|
913
|
+
className: `${className}:hover`,
|
|
914
|
+
styles: {
|
|
915
|
+
...hoverStyles,
|
|
916
|
+
transition: `all ${hoverAnimation.duration}s ${camelCaseToKebabCase(hoverAnimation.easing)}`,
|
|
917
|
+
transitionDelay: hoverAnimation.delay ? `${hoverAnimation.delay}s` : "0s"
|
|
918
|
+
}
|
|
919
|
+
}) || "";
|
|
920
|
+
}
|
|
921
|
+
return [largeStylesClass, mediumStylesClass, smallStylesClass, hoverStylesClass].join(" ");
|
|
938
922
|
});
|
|
939
923
|
return createComponent(Show, {
|
|
940
924
|
get when() {
|
|
@@ -1266,7 +1250,7 @@ function Block(props) {
|
|
|
1266
1250
|
const blockId = processedBlock().id;
|
|
1267
1251
|
const animations = processedBlock().animations;
|
|
1268
1252
|
if (animations && blockId) {
|
|
1269
|
-
bindAnimations(animations.
|
|
1253
|
+
bindAnimations(animations.map((animation) => ({
|
|
1270
1254
|
...animation,
|
|
1271
1255
|
elementId: blockId
|
|
1272
1256
|
})));
|
|
@@ -4192,14 +4176,12 @@ async function fetchEntries(options) {
|
|
|
4192
4176
|
}
|
|
4193
4177
|
|
|
4194
4178
|
// src/functions/is-previewing.ts
|
|
4195
|
-
function isPreviewing(
|
|
4196
|
-
|
|
4197
|
-
|
|
4198
|
-
}
|
|
4199
|
-
const normalizedSearch = getSearchString(search || window.location.search);
|
|
4200
|
-
if (isEditing(normalizedSearch)) {
|
|
4179
|
+
function isPreviewing(_search) {
|
|
4180
|
+
const search = _search || (isBrowser() ? window.location.search : void 0);
|
|
4181
|
+
if (!search) {
|
|
4201
4182
|
return false;
|
|
4202
4183
|
}
|
|
4184
|
+
const normalizedSearch = getSearchString(search);
|
|
4203
4185
|
return Boolean(normalizedSearch.indexOf("builder.preview=") !== -1);
|
|
4204
4186
|
}
|
|
4205
4187
|
|
|
@@ -4450,7 +4432,7 @@ function isFromTrustedHost(trustedHosts, e) {
|
|
|
4450
4432
|
}
|
|
4451
4433
|
|
|
4452
4434
|
// src/constants/sdk-version.ts
|
|
4453
|
-
var SDK_VERSION = "1.0.
|
|
4435
|
+
var SDK_VERSION = "1.0.22";
|
|
4454
4436
|
|
|
4455
4437
|
// src/functions/register.ts
|
|
4456
4438
|
var registry = {};
|
|
@@ -4828,7 +4810,7 @@ function EnableEditor(props) {
|
|
|
4828
4810
|
variationId: variationId !== contentId ? variationId : void 0
|
|
4829
4811
|
});
|
|
4830
4812
|
}
|
|
4831
|
-
if (isPreviewing()) {
|
|
4813
|
+
if (isPreviewing() && !isEditing()) {
|
|
4832
4814
|
const searchParams = new URL(location.href).searchParams;
|
|
4833
4815
|
const searchParamPreviewModel = searchParams.get("builder.preview");
|
|
4834
4816
|
const searchParamPreviewId = searchParams.get(`builder.preview.${searchParamPreviewModel}`);
|
package/lib/browser/dev.jsx
CHANGED
|
@@ -152,7 +152,8 @@ function isIframe() {
|
|
|
152
152
|
|
|
153
153
|
// src/functions/is-editing.ts
|
|
154
154
|
function isEditing(search) {
|
|
155
|
-
return isIframe() && (TARGET === "reactNative" ||
|
|
155
|
+
return isIframe() && (TARGET === "reactNative" || // accessing window.location.search is safe here because `isIframe()` is only `true` if we're in a browser.
|
|
156
|
+
getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1);
|
|
156
157
|
}
|
|
157
158
|
|
|
158
159
|
// src/functions/track/helpers.ts
|
|
@@ -523,9 +524,6 @@ function bindAnimations(animations) {
|
|
|
523
524
|
case "pageLoad":
|
|
524
525
|
triggerAnimation(animation);
|
|
525
526
|
break;
|
|
526
|
-
case "hover":
|
|
527
|
-
bindHoverAnimation(animation);
|
|
528
|
-
break;
|
|
529
527
|
case "scrollInView":
|
|
530
528
|
bindScrollInViewAnimation(animation);
|
|
531
529
|
break;
|
|
@@ -584,33 +582,6 @@ function triggerAnimation(animation) {
|
|
|
584
582
|
});
|
|
585
583
|
});
|
|
586
584
|
}
|
|
587
|
-
function bindHoverAnimation(animation) {
|
|
588
|
-
const elements = Array.prototype.slice.call(document.getElementsByClassName(animation.elementId || animation.id || ""));
|
|
589
|
-
if (!elements.length) {
|
|
590
|
-
warnElementNotPresent(animation.elementId || animation.id || "");
|
|
591
|
-
return;
|
|
592
|
-
}
|
|
593
|
-
Array.from(elements).forEach((element) => {
|
|
594
|
-
augmentAnimation(animation, element);
|
|
595
|
-
const defaultState = animation.steps[0].styles;
|
|
596
|
-
const hoverState = animation.steps[1].styles;
|
|
597
|
-
function attachDefaultState() {
|
|
598
|
-
assign(element.style, defaultState);
|
|
599
|
-
}
|
|
600
|
-
function attachHoverState() {
|
|
601
|
-
assign(element.style, hoverState);
|
|
602
|
-
}
|
|
603
|
-
attachDefaultState();
|
|
604
|
-
element.addEventListener("mouseenter", attachHoverState);
|
|
605
|
-
element.addEventListener("mouseleave", attachDefaultState);
|
|
606
|
-
setTimeout(() => {
|
|
607
|
-
element.style.transition = `all ${animation.duration}s ${camelCaseToKebabCase(animation.easing)}`;
|
|
608
|
-
if (animation.delay) {
|
|
609
|
-
element.style.transitionDelay = animation.delay + "s";
|
|
610
|
-
}
|
|
611
|
-
});
|
|
612
|
-
});
|
|
613
|
-
}
|
|
614
585
|
function bindScrollInViewAnimation(animation) {
|
|
615
586
|
const elements = Array.prototype.slice.call(document.getElementsByClassName(animation.elementId || animation.id || ""));
|
|
616
587
|
if (!elements.length) {
|
|
@@ -921,7 +892,27 @@ function BlockStyles(props) {
|
|
|
921
892
|
sizesWithUpdatedBreakpoints
|
|
922
893
|
)
|
|
923
894
|
}) : "";
|
|
924
|
-
|
|
895
|
+
const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
|
|
896
|
+
let hoverStylesClass = "";
|
|
897
|
+
if (hoverAnimation) {
|
|
898
|
+
const hoverStyles = hoverAnimation.steps?.[1]?.styles || {};
|
|
899
|
+
hoverStylesClass = createCssClass({
|
|
900
|
+
className: `${className}:hover`,
|
|
901
|
+
styles: {
|
|
902
|
+
...hoverStyles,
|
|
903
|
+
transition: `all ${hoverAnimation.duration}s ${camelCaseToKebabCase(
|
|
904
|
+
hoverAnimation.easing
|
|
905
|
+
)}`,
|
|
906
|
+
transitionDelay: hoverAnimation.delay ? `${hoverAnimation.delay}s` : "0s"
|
|
907
|
+
}
|
|
908
|
+
}) || "";
|
|
909
|
+
}
|
|
910
|
+
return [
|
|
911
|
+
largeStylesClass,
|
|
912
|
+
mediumStylesClass,
|
|
913
|
+
smallStylesClass,
|
|
914
|
+
hoverStylesClass
|
|
915
|
+
].join(" ");
|
|
925
916
|
});
|
|
926
917
|
return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default id="builderio-block" styles={css5()} /></Show2>;
|
|
927
918
|
}
|
|
@@ -1200,7 +1191,7 @@ function Block(props) {
|
|
|
1200
1191
|
const animations = processedBlock().animations;
|
|
1201
1192
|
if (animations && blockId) {
|
|
1202
1193
|
bindAnimations(
|
|
1203
|
-
animations.
|
|
1194
|
+
animations.map((animation) => ({
|
|
1204
1195
|
...animation,
|
|
1205
1196
|
elementId: blockId
|
|
1206
1197
|
}))
|
|
@@ -3775,14 +3766,12 @@ async function fetchEntries(options) {
|
|
|
3775
3766
|
}
|
|
3776
3767
|
|
|
3777
3768
|
// src/functions/is-previewing.ts
|
|
3778
|
-
function isPreviewing(
|
|
3779
|
-
|
|
3780
|
-
|
|
3781
|
-
}
|
|
3782
|
-
const normalizedSearch = getSearchString(search || window.location.search);
|
|
3783
|
-
if (isEditing(normalizedSearch)) {
|
|
3769
|
+
function isPreviewing(_search) {
|
|
3770
|
+
const search = _search || (isBrowser() ? window.location.search : void 0);
|
|
3771
|
+
if (!search) {
|
|
3784
3772
|
return false;
|
|
3785
3773
|
}
|
|
3774
|
+
const normalizedSearch = getSearchString(search);
|
|
3786
3775
|
return Boolean(normalizedSearch.indexOf("builder.preview=") !== -1);
|
|
3787
3776
|
}
|
|
3788
3777
|
|
|
@@ -4033,7 +4022,7 @@ function isFromTrustedHost(trustedHosts, e) {
|
|
|
4033
4022
|
}
|
|
4034
4023
|
|
|
4035
4024
|
// src/constants/sdk-version.ts
|
|
4036
|
-
var SDK_VERSION = "1.0.
|
|
4025
|
+
var SDK_VERSION = "1.0.22";
|
|
4037
4026
|
|
|
4038
4027
|
// src/functions/register.ts
|
|
4039
4028
|
var registry = {};
|
|
@@ -4425,7 +4414,7 @@ function EnableEditor(props) {
|
|
|
4425
4414
|
variationId: variationId !== contentId ? variationId : void 0
|
|
4426
4415
|
});
|
|
4427
4416
|
}
|
|
4428
|
-
if (isPreviewing()) {
|
|
4417
|
+
if (isPreviewing() && !isEditing()) {
|
|
4429
4418
|
const searchParams = new URL(location.href).searchParams;
|
|
4430
4419
|
const searchParamPreviewModel = searchParams.get("builder.preview");
|
|
4431
4420
|
const searchParamPreviewId = searchParams.get(
|
package/lib/browser/index.js
CHANGED
|
@@ -164,7 +164,8 @@ function isIframe() {
|
|
|
164
164
|
|
|
165
165
|
// src/functions/is-editing.ts
|
|
166
166
|
function isEditing(search) {
|
|
167
|
-
return isIframe() && (TARGET === "reactNative" ||
|
|
167
|
+
return isIframe() && (TARGET === "reactNative" || // accessing window.location.search is safe here because `isIframe()` is only `true` if we're in a browser.
|
|
168
|
+
getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1);
|
|
168
169
|
}
|
|
169
170
|
|
|
170
171
|
// src/functions/track/helpers.ts
|
|
@@ -534,9 +535,6 @@ function bindAnimations(animations) {
|
|
|
534
535
|
case "pageLoad":
|
|
535
536
|
triggerAnimation(animation);
|
|
536
537
|
break;
|
|
537
|
-
case "hover":
|
|
538
|
-
bindHoverAnimation(animation);
|
|
539
|
-
break;
|
|
540
538
|
case "scrollInView":
|
|
541
539
|
bindScrollInViewAnimation(animation);
|
|
542
540
|
break;
|
|
@@ -594,33 +592,6 @@ function triggerAnimation(animation) {
|
|
|
594
592
|
});
|
|
595
593
|
});
|
|
596
594
|
}
|
|
597
|
-
function bindHoverAnimation(animation) {
|
|
598
|
-
const elements = Array.prototype.slice.call(document.getElementsByClassName(animation.elementId || animation.id || ""));
|
|
599
|
-
if (!elements.length) {
|
|
600
|
-
warnElementNotPresent(animation.elementId || animation.id || "");
|
|
601
|
-
return;
|
|
602
|
-
}
|
|
603
|
-
Array.from(elements).forEach((element) => {
|
|
604
|
-
augmentAnimation(animation, element);
|
|
605
|
-
const defaultState = animation.steps[0].styles;
|
|
606
|
-
const hoverState = animation.steps[1].styles;
|
|
607
|
-
function attachDefaultState() {
|
|
608
|
-
assign(element.style, defaultState);
|
|
609
|
-
}
|
|
610
|
-
function attachHoverState() {
|
|
611
|
-
assign(element.style, hoverState);
|
|
612
|
-
}
|
|
613
|
-
attachDefaultState();
|
|
614
|
-
element.addEventListener("mouseenter", attachHoverState);
|
|
615
|
-
element.addEventListener("mouseleave", attachDefaultState);
|
|
616
|
-
setTimeout(() => {
|
|
617
|
-
element.style.transition = `all ${animation.duration}s ${camelCaseToKebabCase(animation.easing)}`;
|
|
618
|
-
if (animation.delay) {
|
|
619
|
-
element.style.transitionDelay = animation.delay + "s";
|
|
620
|
-
}
|
|
621
|
-
});
|
|
622
|
-
});
|
|
623
|
-
}
|
|
624
595
|
function bindScrollInViewAnimation(animation) {
|
|
625
596
|
const elements = Array.prototype.slice.call(document.getElementsByClassName(animation.elementId || animation.id || ""));
|
|
626
597
|
if (!elements.length) {
|
|
@@ -928,7 +899,20 @@ function BlockStyles(props) {
|
|
|
928
899
|
styles: smallStyles,
|
|
929
900
|
mediaQuery: getMaxWidthQueryForSize("small", sizesWithUpdatedBreakpoints)
|
|
930
901
|
}) : "";
|
|
931
|
-
|
|
902
|
+
const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
|
|
903
|
+
let hoverStylesClass = "";
|
|
904
|
+
if (hoverAnimation) {
|
|
905
|
+
const hoverStyles = hoverAnimation.steps?.[1]?.styles || {};
|
|
906
|
+
hoverStylesClass = createCssClass({
|
|
907
|
+
className: `${className}:hover`,
|
|
908
|
+
styles: {
|
|
909
|
+
...hoverStyles,
|
|
910
|
+
transition: `all ${hoverAnimation.duration}s ${camelCaseToKebabCase(hoverAnimation.easing)}`,
|
|
911
|
+
transitionDelay: hoverAnimation.delay ? `${hoverAnimation.delay}s` : "0s"
|
|
912
|
+
}
|
|
913
|
+
}) || "";
|
|
914
|
+
}
|
|
915
|
+
return [largeStylesClass, mediumStylesClass, smallStylesClass, hoverStylesClass].join(" ");
|
|
932
916
|
});
|
|
933
917
|
return createComponent(Show, {
|
|
934
918
|
get when() {
|
|
@@ -1260,7 +1244,7 @@ function Block(props) {
|
|
|
1260
1244
|
const blockId = processedBlock().id;
|
|
1261
1245
|
const animations = processedBlock().animations;
|
|
1262
1246
|
if (animations && blockId) {
|
|
1263
|
-
bindAnimations(animations.
|
|
1247
|
+
bindAnimations(animations.map((animation) => ({
|
|
1264
1248
|
...animation,
|
|
1265
1249
|
elementId: blockId
|
|
1266
1250
|
})));
|
|
@@ -4180,14 +4164,12 @@ async function fetchEntries(options) {
|
|
|
4180
4164
|
}
|
|
4181
4165
|
|
|
4182
4166
|
// src/functions/is-previewing.ts
|
|
4183
|
-
function isPreviewing(
|
|
4184
|
-
|
|
4185
|
-
|
|
4186
|
-
}
|
|
4187
|
-
const normalizedSearch = getSearchString(search || window.location.search);
|
|
4188
|
-
if (isEditing(normalizedSearch)) {
|
|
4167
|
+
function isPreviewing(_search) {
|
|
4168
|
+
const search = _search || (isBrowser() ? window.location.search : void 0);
|
|
4169
|
+
if (!search) {
|
|
4189
4170
|
return false;
|
|
4190
4171
|
}
|
|
4172
|
+
const normalizedSearch = getSearchString(search);
|
|
4191
4173
|
return Boolean(normalizedSearch.indexOf("builder.preview=") !== -1);
|
|
4192
4174
|
}
|
|
4193
4175
|
|
|
@@ -4435,7 +4417,7 @@ function isFromTrustedHost(trustedHosts, e) {
|
|
|
4435
4417
|
}
|
|
4436
4418
|
|
|
4437
4419
|
// src/constants/sdk-version.ts
|
|
4438
|
-
var SDK_VERSION = "1.0.
|
|
4420
|
+
var SDK_VERSION = "1.0.22";
|
|
4439
4421
|
|
|
4440
4422
|
// src/functions/register.ts
|
|
4441
4423
|
var registry = {};
|
|
@@ -4811,7 +4793,7 @@ function EnableEditor(props) {
|
|
|
4811
4793
|
variationId: variationId !== contentId ? variationId : void 0
|
|
4812
4794
|
});
|
|
4813
4795
|
}
|
|
4814
|
-
if (isPreviewing()) {
|
|
4796
|
+
if (isPreviewing() && !isEditing()) {
|
|
4815
4797
|
const searchParams = new URL(location.href).searchParams;
|
|
4816
4798
|
const searchParamPreviewModel = searchParams.get("builder.preview");
|
|
4817
4799
|
const searchParamPreviewId = searchParams.get(`builder.preview.${searchParamPreviewModel}`);
|
package/lib/browser/index.jsx
CHANGED
|
@@ -151,7 +151,8 @@ function isIframe() {
|
|
|
151
151
|
|
|
152
152
|
// src/functions/is-editing.ts
|
|
153
153
|
function isEditing(search) {
|
|
154
|
-
return isIframe() && (TARGET === "reactNative" ||
|
|
154
|
+
return isIframe() && (TARGET === "reactNative" || // accessing window.location.search is safe here because `isIframe()` is only `true` if we're in a browser.
|
|
155
|
+
getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1);
|
|
155
156
|
}
|
|
156
157
|
|
|
157
158
|
// src/functions/track/helpers.ts
|
|
@@ -521,9 +522,6 @@ function bindAnimations(animations) {
|
|
|
521
522
|
case "pageLoad":
|
|
522
523
|
triggerAnimation(animation);
|
|
523
524
|
break;
|
|
524
|
-
case "hover":
|
|
525
|
-
bindHoverAnimation(animation);
|
|
526
|
-
break;
|
|
527
525
|
case "scrollInView":
|
|
528
526
|
bindScrollInViewAnimation(animation);
|
|
529
527
|
break;
|
|
@@ -581,33 +579,6 @@ function triggerAnimation(animation) {
|
|
|
581
579
|
});
|
|
582
580
|
});
|
|
583
581
|
}
|
|
584
|
-
function bindHoverAnimation(animation) {
|
|
585
|
-
const elements = Array.prototype.slice.call(document.getElementsByClassName(animation.elementId || animation.id || ""));
|
|
586
|
-
if (!elements.length) {
|
|
587
|
-
warnElementNotPresent(animation.elementId || animation.id || "");
|
|
588
|
-
return;
|
|
589
|
-
}
|
|
590
|
-
Array.from(elements).forEach((element) => {
|
|
591
|
-
augmentAnimation(animation, element);
|
|
592
|
-
const defaultState = animation.steps[0].styles;
|
|
593
|
-
const hoverState = animation.steps[1].styles;
|
|
594
|
-
function attachDefaultState() {
|
|
595
|
-
assign(element.style, defaultState);
|
|
596
|
-
}
|
|
597
|
-
function attachHoverState() {
|
|
598
|
-
assign(element.style, hoverState);
|
|
599
|
-
}
|
|
600
|
-
attachDefaultState();
|
|
601
|
-
element.addEventListener("mouseenter", attachHoverState);
|
|
602
|
-
element.addEventListener("mouseleave", attachDefaultState);
|
|
603
|
-
setTimeout(() => {
|
|
604
|
-
element.style.transition = `all ${animation.duration}s ${camelCaseToKebabCase(animation.easing)}`;
|
|
605
|
-
if (animation.delay) {
|
|
606
|
-
element.style.transitionDelay = animation.delay + "s";
|
|
607
|
-
}
|
|
608
|
-
});
|
|
609
|
-
});
|
|
610
|
-
}
|
|
611
582
|
function bindScrollInViewAnimation(animation) {
|
|
612
583
|
const elements = Array.prototype.slice.call(document.getElementsByClassName(animation.elementId || animation.id || ""));
|
|
613
584
|
if (!elements.length) {
|
|
@@ -915,7 +886,27 @@ function BlockStyles(props) {
|
|
|
915
886
|
sizesWithUpdatedBreakpoints
|
|
916
887
|
)
|
|
917
888
|
}) : "";
|
|
918
|
-
|
|
889
|
+
const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
|
|
890
|
+
let hoverStylesClass = "";
|
|
891
|
+
if (hoverAnimation) {
|
|
892
|
+
const hoverStyles = hoverAnimation.steps?.[1]?.styles || {};
|
|
893
|
+
hoverStylesClass = createCssClass({
|
|
894
|
+
className: `${className}:hover`,
|
|
895
|
+
styles: {
|
|
896
|
+
...hoverStyles,
|
|
897
|
+
transition: `all ${hoverAnimation.duration}s ${camelCaseToKebabCase(
|
|
898
|
+
hoverAnimation.easing
|
|
899
|
+
)}`,
|
|
900
|
+
transitionDelay: hoverAnimation.delay ? `${hoverAnimation.delay}s` : "0s"
|
|
901
|
+
}
|
|
902
|
+
}) || "";
|
|
903
|
+
}
|
|
904
|
+
return [
|
|
905
|
+
largeStylesClass,
|
|
906
|
+
mediumStylesClass,
|
|
907
|
+
smallStylesClass,
|
|
908
|
+
hoverStylesClass
|
|
909
|
+
].join(" ");
|
|
919
910
|
});
|
|
920
911
|
return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default id="builderio-block" styles={css5()} /></Show2>;
|
|
921
912
|
}
|
|
@@ -1194,7 +1185,7 @@ function Block(props) {
|
|
|
1194
1185
|
const animations = processedBlock().animations;
|
|
1195
1186
|
if (animations && blockId) {
|
|
1196
1187
|
bindAnimations(
|
|
1197
|
-
animations.
|
|
1188
|
+
animations.map((animation) => ({
|
|
1198
1189
|
...animation,
|
|
1199
1190
|
elementId: blockId
|
|
1200
1191
|
}))
|
|
@@ -3763,14 +3754,12 @@ async function fetchEntries(options) {
|
|
|
3763
3754
|
}
|
|
3764
3755
|
|
|
3765
3756
|
// src/functions/is-previewing.ts
|
|
3766
|
-
function isPreviewing(
|
|
3767
|
-
|
|
3768
|
-
|
|
3769
|
-
}
|
|
3770
|
-
const normalizedSearch = getSearchString(search || window.location.search);
|
|
3771
|
-
if (isEditing(normalizedSearch)) {
|
|
3757
|
+
function isPreviewing(_search) {
|
|
3758
|
+
const search = _search || (isBrowser() ? window.location.search : void 0);
|
|
3759
|
+
if (!search) {
|
|
3772
3760
|
return false;
|
|
3773
3761
|
}
|
|
3762
|
+
const normalizedSearch = getSearchString(search);
|
|
3774
3763
|
return Boolean(normalizedSearch.indexOf("builder.preview=") !== -1);
|
|
3775
3764
|
}
|
|
3776
3765
|
|
|
@@ -4018,7 +4007,7 @@ function isFromTrustedHost(trustedHosts, e) {
|
|
|
4018
4007
|
}
|
|
4019
4008
|
|
|
4020
4009
|
// src/constants/sdk-version.ts
|
|
4021
|
-
var SDK_VERSION = "1.0.
|
|
4010
|
+
var SDK_VERSION = "1.0.22";
|
|
4022
4011
|
|
|
4023
4012
|
// src/functions/register.ts
|
|
4024
4013
|
var registry = {};
|
|
@@ -4408,7 +4397,7 @@ function EnableEditor(props) {
|
|
|
4408
4397
|
variationId: variationId !== contentId ? variationId : void 0
|
|
4409
4398
|
});
|
|
4410
4399
|
}
|
|
4411
|
-
if (isPreviewing()) {
|
|
4400
|
+
if (isPreviewing() && !isEditing()) {
|
|
4412
4401
|
const searchParams = new URL(location.href).searchParams;
|
|
4413
4402
|
const searchParamPreviewModel = searchParams.get("builder.preview");
|
|
4414
4403
|
const searchParamPreviewId = searchParams.get(
|
package/lib/edge/dev.js
CHANGED
|
@@ -171,7 +171,8 @@ function isIframe() {
|
|
|
171
171
|
|
|
172
172
|
// src/functions/is-editing.ts
|
|
173
173
|
function isEditing(search) {
|
|
174
|
-
return isIframe() && (TARGET === "reactNative" ||
|
|
174
|
+
return isIframe() && (TARGET === "reactNative" || // accessing window.location.search is safe here because `isIframe()` is only `true` if we're in a browser.
|
|
175
|
+
getSearchString(search || window.location.search).indexOf("builder.frameEditing=") !== -1);
|
|
175
176
|
}
|
|
176
177
|
|
|
177
178
|
// src/functions/track/helpers.ts
|
|
@@ -3689,9 +3690,6 @@ function bindAnimations(animations) {
|
|
|
3689
3690
|
case "pageLoad":
|
|
3690
3691
|
triggerAnimation(animation);
|
|
3691
3692
|
break;
|
|
3692
|
-
case "hover":
|
|
3693
|
-
bindHoverAnimation(animation);
|
|
3694
|
-
break;
|
|
3695
3693
|
case "scrollInView":
|
|
3696
3694
|
bindScrollInViewAnimation(animation);
|
|
3697
3695
|
break;
|
|
@@ -3750,33 +3748,6 @@ function triggerAnimation(animation) {
|
|
|
3750
3748
|
});
|
|
3751
3749
|
});
|
|
3752
3750
|
}
|
|
3753
|
-
function bindHoverAnimation(animation) {
|
|
3754
|
-
const elements = Array.prototype.slice.call(document.getElementsByClassName(animation.elementId || animation.id || ""));
|
|
3755
|
-
if (!elements.length) {
|
|
3756
|
-
warnElementNotPresent(animation.elementId || animation.id || "");
|
|
3757
|
-
return;
|
|
3758
|
-
}
|
|
3759
|
-
Array.from(elements).forEach((element) => {
|
|
3760
|
-
augmentAnimation(animation, element);
|
|
3761
|
-
const defaultState = animation.steps[0].styles;
|
|
3762
|
-
const hoverState = animation.steps[1].styles;
|
|
3763
|
-
function attachDefaultState() {
|
|
3764
|
-
assign(element.style, defaultState);
|
|
3765
|
-
}
|
|
3766
|
-
function attachHoverState() {
|
|
3767
|
-
assign(element.style, hoverState);
|
|
3768
|
-
}
|
|
3769
|
-
attachDefaultState();
|
|
3770
|
-
element.addEventListener("mouseenter", attachHoverState);
|
|
3771
|
-
element.addEventListener("mouseleave", attachDefaultState);
|
|
3772
|
-
setTimeout(() => {
|
|
3773
|
-
element.style.transition = `all ${animation.duration}s ${camelCaseToKebabCase(animation.easing)}`;
|
|
3774
|
-
if (animation.delay) {
|
|
3775
|
-
element.style.transitionDelay = animation.delay + "s";
|
|
3776
|
-
}
|
|
3777
|
-
});
|
|
3778
|
-
});
|
|
3779
|
-
}
|
|
3780
3751
|
function bindScrollInViewAnimation(animation) {
|
|
3781
3752
|
const elements = Array.prototype.slice.call(document.getElementsByClassName(animation.elementId || animation.id || ""));
|
|
3782
3753
|
if (!elements.length) {
|
|
@@ -4087,7 +4058,20 @@ function BlockStyles(props) {
|
|
|
4087
4058
|
styles: smallStyles,
|
|
4088
4059
|
mediaQuery: getMaxWidthQueryForSize("small", sizesWithUpdatedBreakpoints)
|
|
4089
4060
|
}) : "";
|
|
4090
|
-
|
|
4061
|
+
const hoverAnimation = processedBlock.animations && processedBlock.animations.find((item) => item.trigger === "hover");
|
|
4062
|
+
let hoverStylesClass = "";
|
|
4063
|
+
if (hoverAnimation) {
|
|
4064
|
+
const hoverStyles = hoverAnimation.steps?.[1]?.styles || {};
|
|
4065
|
+
hoverStylesClass = createCssClass({
|
|
4066
|
+
className: `${className}:hover`,
|
|
4067
|
+
styles: {
|
|
4068
|
+
...hoverStyles,
|
|
4069
|
+
transition: `all ${hoverAnimation.duration}s ${camelCaseToKebabCase(hoverAnimation.easing)}`,
|
|
4070
|
+
transitionDelay: hoverAnimation.delay ? `${hoverAnimation.delay}s` : "0s"
|
|
4071
|
+
}
|
|
4072
|
+
}) || "";
|
|
4073
|
+
}
|
|
4074
|
+
return [largeStylesClass, mediumStylesClass, smallStylesClass, hoverStylesClass].join(" ");
|
|
4091
4075
|
});
|
|
4092
4076
|
return createComponent(Show, {
|
|
4093
4077
|
get when() {
|
|
@@ -4419,7 +4403,7 @@ function Block(props) {
|
|
|
4419
4403
|
const blockId = processedBlock().id;
|
|
4420
4404
|
const animations = processedBlock().animations;
|
|
4421
4405
|
if (animations && blockId) {
|
|
4422
|
-
bindAnimations(animations.
|
|
4406
|
+
bindAnimations(animations.map((animation) => ({
|
|
4423
4407
|
...animation,
|
|
4424
4408
|
elementId: blockId
|
|
4425
4409
|
})));
|
|
@@ -7345,14 +7329,12 @@ async function fetchEntries(options) {
|
|
|
7345
7329
|
}
|
|
7346
7330
|
|
|
7347
7331
|
// src/functions/is-previewing.ts
|
|
7348
|
-
function isPreviewing(
|
|
7349
|
-
|
|
7350
|
-
|
|
7351
|
-
}
|
|
7352
|
-
const normalizedSearch = getSearchString(search || window.location.search);
|
|
7353
|
-
if (isEditing(normalizedSearch)) {
|
|
7332
|
+
function isPreviewing(_search) {
|
|
7333
|
+
const search = _search || (isBrowser() ? window.location.search : void 0);
|
|
7334
|
+
if (!search) {
|
|
7354
7335
|
return false;
|
|
7355
7336
|
}
|
|
7337
|
+
const normalizedSearch = getSearchString(search);
|
|
7356
7338
|
return Boolean(normalizedSearch.indexOf("builder.preview=") !== -1);
|
|
7357
7339
|
}
|
|
7358
7340
|
|
|
@@ -7603,7 +7585,7 @@ function isFromTrustedHost(trustedHosts, e) {
|
|
|
7603
7585
|
}
|
|
7604
7586
|
|
|
7605
7587
|
// src/constants/sdk-version.ts
|
|
7606
|
-
var SDK_VERSION = "1.0.
|
|
7588
|
+
var SDK_VERSION = "1.0.22";
|
|
7607
7589
|
|
|
7608
7590
|
// src/functions/register.ts
|
|
7609
7591
|
var registry = {};
|
|
@@ -7981,7 +7963,7 @@ function EnableEditor(props) {
|
|
|
7981
7963
|
variationId: variationId !== contentId ? variationId : void 0
|
|
7982
7964
|
});
|
|
7983
7965
|
}
|
|
7984
|
-
if (isPreviewing()) {
|
|
7966
|
+
if (isPreviewing() && !isEditing()) {
|
|
7985
7967
|
const searchParams = new URL(location.href).searchParams;
|
|
7986
7968
|
const searchParamPreviewModel = searchParams.get("builder.preview");
|
|
7987
7969
|
const searchParamPreviewId = searchParams.get(`builder.preview.${searchParamPreviewModel}`);
|