@amplifyup/sdk 0.2.0 → 0.2.2
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/AmplifyRenderer.js +83 -110
- package/dist/AmplifyRenderer.js.map +1 -1
- package/dist/AmplifyRenderer.mjs +83 -110
- package/dist/AmplifyRenderer.mjs.map +1 -1
- package/dist/index.js +82 -103
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +82 -103
- package/dist/index.mjs.map +1 -1
- package/dist/react.d.mts +1 -1
- package/dist/react.d.ts +1 -1
- package/dist/react.js +103 -178
- package/dist/react.js.map +1 -1
- package/dist/react.mjs +103 -178
- package/dist/react.mjs.map +1 -1
- package/dist/server.js +1 -1
- package/dist/server.js.map +1 -1
- package/dist/server.mjs +1 -1
- package/dist/server.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -414,7 +414,7 @@ function isComposerPreview() {
|
|
|
414
414
|
if (window.self !== window.top && document.referrer) {
|
|
415
415
|
try {
|
|
416
416
|
const refUrl = new URL(document.referrer);
|
|
417
|
-
if (refUrl.hostname === "amplifyup.ai" || refUrl.hostname.endsWith(".amplifyup.ai") || refUrl.hostname === "localhost" && refUrl.port === "5001" || refUrl.pathname.includes("/dashboard/composer")
|
|
417
|
+
if (refUrl.hostname === "amplifyup.ai" || refUrl.hostname.endsWith(".amplifyup.ai") || refUrl.hostname === "localhost" && refUrl.port === "5001" || refUrl.pathname.includes("/dashboard/composer")) {
|
|
418
418
|
return true;
|
|
419
419
|
}
|
|
420
420
|
} catch {
|
|
@@ -1412,7 +1412,7 @@ var AmplifyUpSDK = class {
|
|
|
1412
1412
|
if (document.referrer) {
|
|
1413
1413
|
try {
|
|
1414
1414
|
const referrerUrl = new URL(document.referrer);
|
|
1415
|
-
if (referrerUrl.hostname === "localhost" && referrerUrl.port === "5001" || referrerUrl.pathname.includes("/dashboard/composer")
|
|
1415
|
+
if (referrerUrl.hostname === "localhost" && referrerUrl.port === "5001" || referrerUrl.pathname.includes("/dashboard/composer")) {
|
|
1416
1416
|
return true;
|
|
1417
1417
|
}
|
|
1418
1418
|
} catch {
|
|
@@ -1689,11 +1689,7 @@ var AmplifyUpSDK = class {
|
|
|
1689
1689
|
this.page(resumePath, { resumed: true });
|
|
1690
1690
|
this.lastTrackedPath = resumePath;
|
|
1691
1691
|
if (this.config?.debug) {
|
|
1692
|
-
console.log(
|
|
1693
|
-
"[AmplifyUp SDK] Idle resume page view",
|
|
1694
|
-
resumePath,
|
|
1695
|
-
`(hidden ${Math.round(idleMs / 6e4)}m)`
|
|
1696
|
-
);
|
|
1692
|
+
console.log("[AmplifyUp SDK] Idle resume page view", resumePath, `(hidden ${Math.round(idleMs / 6e4)}m)`);
|
|
1697
1693
|
}
|
|
1698
1694
|
}
|
|
1699
1695
|
noteActivity();
|
|
@@ -1713,12 +1709,7 @@ var AmplifyUpSDK = class {
|
|
|
1713
1709
|
}
|
|
1714
1710
|
state.visibleSince = null;
|
|
1715
1711
|
};
|
|
1716
|
-
const activityEvents = [
|
|
1717
|
-
"pointerdown",
|
|
1718
|
-
"keydown",
|
|
1719
|
-
"scroll",
|
|
1720
|
-
"touchstart"
|
|
1721
|
-
];
|
|
1712
|
+
const activityEvents = ["pointerdown", "keydown", "scroll", "touchstart"];
|
|
1722
1713
|
const onActivity = () => noteActivity();
|
|
1723
1714
|
window.addEventListener("scroll", onScroll, { passive: true });
|
|
1724
1715
|
document.addEventListener("visibilitychange", onVisibility);
|
|
@@ -1866,11 +1857,7 @@ var AmplifyUpSDK = class {
|
|
|
1866
1857
|
hosts.forEach((host) => observer.observe(host));
|
|
1867
1858
|
this.componentViewObservers.push(observer);
|
|
1868
1859
|
if (this.config?.debug) {
|
|
1869
|
-
console.log(
|
|
1870
|
-
"[AmplifyUp SDK] Component View tracking enabled for",
|
|
1871
|
-
hosts.length,
|
|
1872
|
-
"hosts"
|
|
1873
|
-
);
|
|
1860
|
+
console.log("[AmplifyUp SDK] Component View tracking enabled for", hosts.length, "hosts");
|
|
1874
1861
|
}
|
|
1875
1862
|
}
|
|
1876
1863
|
cleanupComponentViewTracking() {
|
|
@@ -2443,15 +2430,11 @@ Available Console Commands:
|
|
|
2443
2430
|
) : document;
|
|
2444
2431
|
if (!scopeRoot) {
|
|
2445
2432
|
if (this.config?.debug) {
|
|
2446
|
-
console.log(
|
|
2447
|
-
`[AmplifyUp SDK] Component host not found for ${eventConfig.componentId}`
|
|
2448
|
-
);
|
|
2433
|
+
console.log(`[AmplifyUp SDK] Component host not found for ${eventConfig.componentId}`);
|
|
2449
2434
|
}
|
|
2450
2435
|
return;
|
|
2451
2436
|
}
|
|
2452
|
-
targetElements = Array.from(
|
|
2453
|
-
scopeRoot.querySelectorAll(eventConfig.selector)
|
|
2454
|
-
);
|
|
2437
|
+
targetElements = Array.from(scopeRoot.querySelectorAll(eventConfig.selector));
|
|
2455
2438
|
if (scopeRoot instanceof Element && scopeRoot !== document.documentElement && scopeRoot.matches?.(eventConfig.selector)) {
|
|
2456
2439
|
targetElements.unshift(scopeRoot);
|
|
2457
2440
|
}
|
|
@@ -2484,7 +2467,9 @@ Available Console Commands:
|
|
|
2484
2467
|
});
|
|
2485
2468
|
}
|
|
2486
2469
|
if (this.config?.debug) {
|
|
2487
|
-
console.log(
|
|
2470
|
+
console.log(
|
|
2471
|
+
`[AmplifyUp SDK] Attached ${eventConfig.eventType} listener for ${eventConfig.eventName} on selector: ${eventConfig.selector}`
|
|
2472
|
+
);
|
|
2488
2473
|
}
|
|
2489
2474
|
});
|
|
2490
2475
|
});
|
|
@@ -2494,16 +2479,16 @@ Available Console Commands:
|
|
|
2494
2479
|
*/
|
|
2495
2480
|
mapEventType(eventType) {
|
|
2496
2481
|
const eventMap = {
|
|
2497
|
-
|
|
2498
|
-
|
|
2499
|
-
|
|
2500
|
-
|
|
2501
|
-
|
|
2502
|
-
|
|
2503
|
-
|
|
2504
|
-
|
|
2482
|
+
click: "click",
|
|
2483
|
+
submit: "submit",
|
|
2484
|
+
focus: "focus",
|
|
2485
|
+
blur: "blur",
|
|
2486
|
+
hover: "mouseenter",
|
|
2487
|
+
change: "change",
|
|
2488
|
+
scroll: "scroll",
|
|
2489
|
+
view: "view",
|
|
2505
2490
|
// Handled separately with IntersectionObserver
|
|
2506
|
-
|
|
2491
|
+
custom: "custom"
|
|
2507
2492
|
};
|
|
2508
2493
|
return eventMap[eventType] || eventType;
|
|
2509
2494
|
}
|
|
@@ -2579,11 +2564,7 @@ Available Console Commands:
|
|
|
2579
2564
|
(entries) => {
|
|
2580
2565
|
entries.forEach((entry) => {
|
|
2581
2566
|
if (entry.isIntersecting) {
|
|
2582
|
-
this.handleTrackedEvent(
|
|
2583
|
-
new CustomEvent("view"),
|
|
2584
|
-
config,
|
|
2585
|
-
element
|
|
2586
|
-
);
|
|
2567
|
+
this.handleTrackedEvent(new CustomEvent("view"), config, element);
|
|
2587
2568
|
observer.unobserve(element);
|
|
2588
2569
|
}
|
|
2589
2570
|
});
|
|
@@ -2726,21 +2707,15 @@ Available Console Commands:
|
|
|
2726
2707
|
return;
|
|
2727
2708
|
}
|
|
2728
2709
|
if (event.data?.type === "AMPLIFYUP_FIELD_PATCH") {
|
|
2729
|
-
window.dispatchEvent(
|
|
2730
|
-
new CustomEvent("amplifyup:field-patch", { detail: event.data })
|
|
2731
|
-
);
|
|
2710
|
+
window.dispatchEvent(new CustomEvent("amplifyup:field-patch", { detail: event.data }));
|
|
2732
2711
|
return;
|
|
2733
2712
|
}
|
|
2734
2713
|
if (event.data?.type === "AMPLIFYUP_PROPS_PATCH") {
|
|
2735
|
-
window.dispatchEvent(
|
|
2736
|
-
new CustomEvent("amplifyup:props-patch", { detail: event.data })
|
|
2737
|
-
);
|
|
2714
|
+
window.dispatchEvent(new CustomEvent("amplifyup:props-patch", { detail: event.data }));
|
|
2738
2715
|
return;
|
|
2739
2716
|
}
|
|
2740
2717
|
if (event.data?.type === "AMPLIFYUP_LAYOUT_PATCH") {
|
|
2741
|
-
window.dispatchEvent(
|
|
2742
|
-
new CustomEvent("amplifyup:layout-patch", { detail: event.data })
|
|
2743
|
-
);
|
|
2718
|
+
window.dispatchEvent(new CustomEvent("amplifyup:layout-patch", { detail: event.data }));
|
|
2744
2719
|
return;
|
|
2745
2720
|
}
|
|
2746
2721
|
if (event.data?.type === "COMPONENT_DELETABLE_STATUS") {
|
|
@@ -2803,9 +2778,7 @@ Available Console Commands:
|
|
|
2803
2778
|
const { componentId, slotName, nodeId, isPageSlot } = event.data;
|
|
2804
2779
|
let element = null;
|
|
2805
2780
|
if (isPageSlot || slotName === "main" && !nodeId && !componentId) {
|
|
2806
|
-
element = document.querySelector(
|
|
2807
|
-
'[data-slot-source="page"]'
|
|
2808
|
-
);
|
|
2781
|
+
element = document.querySelector('[data-slot-source="page"]');
|
|
2809
2782
|
}
|
|
2810
2783
|
if (!element && nodeId && slotName) {
|
|
2811
2784
|
element = document.querySelector(
|
|
@@ -2813,9 +2786,7 @@ Available Console Commands:
|
|
|
2813
2786
|
);
|
|
2814
2787
|
}
|
|
2815
2788
|
if (!element && nodeId && !slotName) {
|
|
2816
|
-
element = document.querySelector(
|
|
2817
|
-
`[data-node-id="${nodeId}"]`
|
|
2818
|
-
);
|
|
2789
|
+
element = document.querySelector(`[data-node-id="${nodeId}"]`);
|
|
2819
2790
|
}
|
|
2820
2791
|
if (!element && slotName) {
|
|
2821
2792
|
element = document.querySelector(
|
|
@@ -2856,30 +2827,33 @@ Available Console Commands:
|
|
|
2856
2827
|
};
|
|
2857
2828
|
if (window.parent && window.parent !== window) {
|
|
2858
2829
|
const hierarchyEls = this.buildComponentHierarchy(element);
|
|
2859
|
-
window.parent.postMessage(
|
|
2860
|
-
|
|
2861
|
-
|
|
2862
|
-
|
|
2863
|
-
|
|
2864
|
-
|
|
2865
|
-
|
|
2866
|
-
|
|
2867
|
-
|
|
2868
|
-
|
|
2869
|
-
|
|
2870
|
-
|
|
2871
|
-
|
|
2872
|
-
|
|
2873
|
-
|
|
2874
|
-
|
|
2875
|
-
|
|
2876
|
-
|
|
2877
|
-
|
|
2878
|
-
|
|
2879
|
-
|
|
2880
|
-
|
|
2881
|
-
|
|
2882
|
-
|
|
2830
|
+
window.parent.postMessage(
|
|
2831
|
+
{
|
|
2832
|
+
type: "ELEMENT_POSITION",
|
|
2833
|
+
componentId: componentId || null,
|
|
2834
|
+
slotName: slotName || null,
|
|
2835
|
+
nodeId: nodeId || null,
|
|
2836
|
+
isPageSlot: !!isPageSlot || element.getAttribute("data-slot-source") === "page",
|
|
2837
|
+
hierarchy: hierarchyEls.map((el, index) => {
|
|
2838
|
+
const elComponentId = el.getAttribute("data-amplifyup-component") || el.getAttribute("data-component-id");
|
|
2839
|
+
const elSlotName = el.getAttribute("data-amplifyup-slot") || el.getAttribute("data-slot-id");
|
|
2840
|
+
const isSlot = !elComponentId && !!elSlotName;
|
|
2841
|
+
const pageSlot = isSlot && el.getAttribute("data-slot-source") === "page";
|
|
2842
|
+
return {
|
|
2843
|
+
index,
|
|
2844
|
+
componentId: elComponentId,
|
|
2845
|
+
componentName: pageSlot ? "Page" : el.getAttribute("data-component-name"),
|
|
2846
|
+
slotName: isSlot ? elSlotName : null,
|
|
2847
|
+
isSlot,
|
|
2848
|
+
isPageSlot: pageSlot,
|
|
2849
|
+
nodeId: el.getAttribute("data-node-id") || (isSlot ? el.getAttribute("data-parent-node-id") : null)
|
|
2850
|
+
};
|
|
2851
|
+
}),
|
|
2852
|
+
position,
|
|
2853
|
+
bounds
|
|
2854
|
+
},
|
|
2855
|
+
"*"
|
|
2856
|
+
);
|
|
2883
2857
|
}
|
|
2884
2858
|
} else {
|
|
2885
2859
|
console.warn("[AmplifyUp SDK] Element not found for position request");
|
|
@@ -2895,7 +2869,11 @@ Available Console Commands:
|
|
|
2895
2869
|
switch (message.type) {
|
|
2896
2870
|
case "ENABLE_HIGHLIGHTING":
|
|
2897
2871
|
case "UPDATE_HIGHLIGHTING":
|
|
2898
|
-
console.log(
|
|
2872
|
+
console.log(
|
|
2873
|
+
"[AmplifyUp SDK] Enabling highlighting with registry:",
|
|
2874
|
+
message.componentRegistry?.length || 0,
|
|
2875
|
+
"components"
|
|
2876
|
+
);
|
|
2899
2877
|
this.enableHighlighting(
|
|
2900
2878
|
message.componentRegistry || [],
|
|
2901
2879
|
message.highlightComponents ?? true,
|
|
@@ -2955,12 +2933,15 @@ Available Console Commands:
|
|
|
2955
2933
|
const tagName = target.tagName.toLowerCase();
|
|
2956
2934
|
const text = (target.textContent || "").replace(/\s+/g, " ").trim().substring(0, 80);
|
|
2957
2935
|
if (window.parent && window.parent !== window) {
|
|
2958
|
-
window.parent.postMessage(
|
|
2959
|
-
|
|
2960
|
-
|
|
2961
|
-
|
|
2962
|
-
|
|
2963
|
-
|
|
2936
|
+
window.parent.postMessage(
|
|
2937
|
+
{
|
|
2938
|
+
type: "ELEMENT_CLICKED_FOR_EVENT",
|
|
2939
|
+
selector,
|
|
2940
|
+
tagName,
|
|
2941
|
+
text
|
|
2942
|
+
},
|
|
2943
|
+
"*"
|
|
2944
|
+
);
|
|
2964
2945
|
}
|
|
2965
2946
|
};
|
|
2966
2947
|
document.addEventListener("click", this.eventSelectionClickHandler, true);
|
|
@@ -2986,9 +2967,7 @@ Available Console Commands:
|
|
|
2986
2967
|
return "[" + attr.name + '="' + attr.value + '"]';
|
|
2987
2968
|
}
|
|
2988
2969
|
if (el.className && typeof el.className === "string") {
|
|
2989
|
-
const classes = el.className.split(" ").filter(
|
|
2990
|
-
(c) => c && !c.startsWith("has-") && !c.includes("selectable") && !c.includes("selected")
|
|
2991
|
-
);
|
|
2970
|
+
const classes = el.className.split(" ").filter((c) => c && !c.startsWith("has-") && !c.includes("selectable") && !c.includes("selected"));
|
|
2992
2971
|
if (classes.length > 0) {
|
|
2993
2972
|
return el.tagName.toLowerCase() + "." + classes[0];
|
|
2994
2973
|
}
|
|
@@ -3038,9 +3017,7 @@ Available Console Commands:
|
|
|
3038
3017
|
}
|
|
3039
3018
|
});
|
|
3040
3019
|
if (containing.length === 0) return null;
|
|
3041
|
-
const innermost = containing.filter(
|
|
3042
|
-
(el) => !containing.some((other) => other !== el && el.contains(other))
|
|
3043
|
-
);
|
|
3020
|
+
const innermost = containing.filter((el) => !containing.some((other) => other !== el && el.contains(other)));
|
|
3044
3021
|
if (innermost.length === 1) return innermost[0];
|
|
3045
3022
|
let best = innermost[0];
|
|
3046
3023
|
let bestArea = Infinity;
|
|
@@ -3157,9 +3134,7 @@ Available Console Commands:
|
|
|
3157
3134
|
*/
|
|
3158
3135
|
enableHighlighting(componentRegistry, highlightComponents, showZones) {
|
|
3159
3136
|
if (typeof document === "undefined") return;
|
|
3160
|
-
const previouslySelected = Array.from(
|
|
3161
|
-
document.querySelectorAll(".amplifyup-selected")
|
|
3162
|
-
);
|
|
3137
|
+
const previouslySelected = Array.from(document.querySelectorAll(".amplifyup-selected"));
|
|
3163
3138
|
this.componentRegistry = componentRegistry;
|
|
3164
3139
|
this.highlightingEnabled = true;
|
|
3165
3140
|
this.highlightComponentsEnabled = highlightComponents;
|
|
@@ -3532,10 +3507,7 @@ Available Console Commands:
|
|
|
3532
3507
|
if (shouldReapply && this.highlightingEnabled) {
|
|
3533
3508
|
setTimeout(() => {
|
|
3534
3509
|
if (this.highlightingEnabled) {
|
|
3535
|
-
this.applyComponentHighlights(
|
|
3536
|
-
this.highlightComponentsEnabled,
|
|
3537
|
-
this.showZonesEnabled
|
|
3538
|
-
);
|
|
3510
|
+
this.applyComponentHighlights(this.highlightComponentsEnabled, this.showZonesEnabled);
|
|
3539
3511
|
}
|
|
3540
3512
|
}, 100);
|
|
3541
3513
|
}
|
|
@@ -3544,7 +3516,13 @@ Available Console Commands:
|
|
|
3544
3516
|
childList: true,
|
|
3545
3517
|
subtree: true,
|
|
3546
3518
|
attributes: true,
|
|
3547
|
-
attributeFilter: [
|
|
3519
|
+
attributeFilter: [
|
|
3520
|
+
"data-amplifyup-component",
|
|
3521
|
+
"data-component-id",
|
|
3522
|
+
"data-amplifyup-slot",
|
|
3523
|
+
"data-slot-id",
|
|
3524
|
+
"data-slot-empty"
|
|
3525
|
+
]
|
|
3548
3526
|
});
|
|
3549
3527
|
}
|
|
3550
3528
|
/**
|
|
@@ -3558,9 +3536,7 @@ Available Console Commands:
|
|
|
3558
3536
|
this.teardownComposerDragDrop();
|
|
3559
3537
|
if (opts?.clearSelection !== false && typeof window !== "undefined") {
|
|
3560
3538
|
window.__AMPLIFYUP_COMPOSER_EDIT__ = false;
|
|
3561
|
-
window.dispatchEvent(
|
|
3562
|
-
new CustomEvent("amplifyup:composer-edit", { detail: { enabled: false } })
|
|
3563
|
-
);
|
|
3539
|
+
window.dispatchEvent(new CustomEvent("amplifyup:composer-edit", { detail: { enabled: false } }));
|
|
3564
3540
|
}
|
|
3565
3541
|
if (this.mutationObserver) {
|
|
3566
3542
|
this.mutationObserver.disconnect();
|
|
@@ -3718,7 +3694,10 @@ Available Console Commands:
|
|
|
3718
3694
|
e.stopPropagation();
|
|
3719
3695
|
this.sendSelectionMessage(htmlEl, hierarchy);
|
|
3720
3696
|
if (window.parent && window.parent !== window) {
|
|
3721
|
-
window.parent.postMessage(
|
|
3697
|
+
window.parent.postMessage(
|
|
3698
|
+
{ type: "CHECK_COMPONENT_DELETABLE", componentId: component.component_id },
|
|
3699
|
+
"*"
|
|
3700
|
+
);
|
|
3722
3701
|
}
|
|
3723
3702
|
};
|
|
3724
3703
|
htmlEl.addEventListener("click", handleClick);
|