payaza-storefront-layouts 1.0.14 → 1.0.15
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ShadowDOMWrapper.d.ts","sourceRoot":"","sources":["../../src/preview/ShadowDOMWrapper.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAqB,SAAS,EAAE,MAAM,OAAO,CAAC;AAGrD,UAAU,qBAAqB;IAC7B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;GASG;AACH,wBAAgB,gBAAgB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,EAAE,qBAAqB,
|
|
1
|
+
{"version":3,"file":"ShadowDOMWrapper.d.ts","sourceRoot":"","sources":["../../src/preview/ShadowDOMWrapper.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAqB,SAAS,EAAE,MAAM,OAAO,CAAC;AAGrD,UAAU,qBAAqB;IAC7B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;GASG;AACH,wBAAgB,gBAAgB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,EAAE,qBAAqB,2CAiS/G"}
|
|
@@ -39,9 +39,27 @@ export function ShadowDOMWrapper({ children, className, onReady, onLinkClick, st
|
|
|
39
39
|
containerRef.current = container;
|
|
40
40
|
// If React root doesn't exist, create it
|
|
41
41
|
if (!reactRootRef.current && container) {
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
42
|
+
// Check if container already has a root (React 18+ stores it internally)
|
|
43
|
+
if (container._reactRootContainer) {
|
|
44
|
+
// Container already has a root, don't create a new one
|
|
45
|
+
// Instead, try to use the existing root
|
|
46
|
+
console.warn('[ShadowDOMWrapper] Container already has a React root, reusing it');
|
|
47
|
+
// We can't access the root directly, so we'll need to recreate the container
|
|
48
|
+
// But for now, just skip and let the children update effect handle it
|
|
49
|
+
return;
|
|
50
|
+
}
|
|
51
|
+
try {
|
|
52
|
+
const root = createRoot(container);
|
|
53
|
+
reactRootRef.current = root;
|
|
54
|
+
root.render(childrenRef.current);
|
|
55
|
+
}
|
|
56
|
+
catch (e) {
|
|
57
|
+
if (e instanceof Error && e.message.includes('already been passed to createRoot')) {
|
|
58
|
+
console.warn('[ShadowDOMWrapper] Root already exists on container, skipping creation');
|
|
59
|
+
return;
|
|
60
|
+
}
|
|
61
|
+
throw e;
|
|
62
|
+
}
|
|
45
63
|
}
|
|
46
64
|
else if (reactRootRef.current && container && !isUnmountingRef.current) {
|
|
47
65
|
// Update content if root exists
|
|
@@ -79,10 +97,25 @@ export function ShadowDOMWrapper({ children, className, onReady, onLinkClick, st
|
|
|
79
97
|
shadowRoot.appendChild(container);
|
|
80
98
|
containerRef.current = container;
|
|
81
99
|
// Create React root and render children
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
100
|
+
// Check if container already has a root (shouldn't happen on first mount, but be safe)
|
|
101
|
+
if (container._reactRootContainer) {
|
|
102
|
+
console.warn('[ShadowDOMWrapper] Container already has a React root on initial mount');
|
|
103
|
+
// Try to reuse existing root if possible
|
|
104
|
+
return;
|
|
105
|
+
}
|
|
106
|
+
try {
|
|
107
|
+
const root = createRoot(container);
|
|
108
|
+
reactRootRef.current = root;
|
|
109
|
+
// Always render on initial mount
|
|
110
|
+
root.render(childrenRef.current);
|
|
111
|
+
}
|
|
112
|
+
catch (e) {
|
|
113
|
+
if (e instanceof Error && e.message.includes('already been passed to createRoot')) {
|
|
114
|
+
console.warn('[ShadowDOMWrapper] Root already exists on initial mount, skipping');
|
|
115
|
+
return;
|
|
116
|
+
}
|
|
117
|
+
throw e;
|
|
118
|
+
}
|
|
86
119
|
onReady?.();
|
|
87
120
|
}
|
|
88
121
|
catch (err) {
|
|
@@ -132,6 +165,34 @@ export function ShadowDOMWrapper({ children, className, onReady, onLinkClick, st
|
|
|
132
165
|
// If shadow root exists but React root doesn't, try to recreate it
|
|
133
166
|
const container = shadowRootRef.current.getElementById('shadow-preview-container');
|
|
134
167
|
if (container) {
|
|
168
|
+
// Check if container already has a React root attached
|
|
169
|
+
// React 18+ stores root info in _reactRootContainer
|
|
170
|
+
if (container._reactRootContainer) {
|
|
171
|
+
// Container already has a root, don't create a new one
|
|
172
|
+
// Store a reference to use for rendering
|
|
173
|
+
reactRootRef.current = {
|
|
174
|
+
render: (element) => {
|
|
175
|
+
// Try to access the existing root's render method
|
|
176
|
+
const existingRoot = container._reactRootContainer;
|
|
177
|
+
if (existingRoot && typeof existingRoot.render === 'function') {
|
|
178
|
+
existingRoot.render(element);
|
|
179
|
+
}
|
|
180
|
+
else {
|
|
181
|
+
// Fallback: try to find the root instance
|
|
182
|
+
console.warn('[ShadowDOMWrapper] Cannot access existing root render method');
|
|
183
|
+
}
|
|
184
|
+
},
|
|
185
|
+
unmount: () => {
|
|
186
|
+
const existingRoot = container._reactRootContainer;
|
|
187
|
+
if (existingRoot && typeof existingRoot.unmount === 'function') {
|
|
188
|
+
existingRoot.unmount();
|
|
189
|
+
}
|
|
190
|
+
}
|
|
191
|
+
};
|
|
192
|
+
containerRef.current = container;
|
|
193
|
+
reactRootRef.current.render(childrenRef.current);
|
|
194
|
+
return;
|
|
195
|
+
}
|
|
135
196
|
try {
|
|
136
197
|
const root = createRoot(container);
|
|
137
198
|
reactRootRef.current = root;
|
|
@@ -139,6 +200,10 @@ export function ShadowDOMWrapper({ children, className, onReady, onLinkClick, st
|
|
|
139
200
|
root.render(childrenRef.current);
|
|
140
201
|
}
|
|
141
202
|
catch (e) {
|
|
203
|
+
if (e instanceof Error && e.message.includes('already been passed to createRoot')) {
|
|
204
|
+
console.warn('[ShadowDOMWrapper] Root already exists, skipping creation');
|
|
205
|
+
return;
|
|
206
|
+
}
|
|
142
207
|
console.warn('[ShadowDOMWrapper] Failed to recreate React root:', e);
|
|
143
208
|
}
|
|
144
209
|
}
|