@wix/site-service-interactions 1.0.7 → 1.0.9

package/cjs/build/implementations/InteractionsScriptElement.js

@@ -6,12 +6,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.createInteractionsScriptElement = void 0;
 const react_1 = __importDefault(require("react"));
 const interactionsScriptContent_1 = require("./interactionsScriptContent");
+const reviveScriptElement_1 = require("./reviveScriptElement");
 const createInteractionsScriptElement = (config, isReducedMotion, pageId) => () => {
     const configId = `interactions-config-${pageId}`;
     const interactionsScriptContent = (0, interactionsScriptContent_1.getInteractionsScriptContent)(configId, isReducedMotion);
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement("script", { type: "application/json", id: configId }, encodeURIComponent(JSON.stringify(config))),
-        react_1.default.createElement("script", { type: "module", id: `interactions-loader-${pageId}` }, interactionsScriptContent)));
+        react_1.default.createElement("script", { type: "module", id: `interactions-loader-${pageId}`, ref: reviveScriptElement_1.reviveScriptElement }, interactionsScriptContent)));
 };
 exports.createInteractionsScriptElement = createInteractionsScriptElement;
 //# sourceMappingURL=InteractionsScriptElement.js.map

package/cjs/build/implementations/InteractionsScriptElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"InteractionsScriptElement.js","sourceRoot":"","sources":["../../../src/implementations/InteractionsScriptElement.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAAyB;AAGzB,2EAA0E;AAEnE,MAAM,+BAA+B,GACxC,CAAC,MAAsB,EAAE,eAAwB,EAAE,MAAc,EAAqB,EAAE,CACxF,GAAG,EAAE;IACD,MAAM,QAAQ,GAAG,uBAAuB,MAAM,EAAE,CAAA;IAChD,MAAM,yBAAyB,GAAG,IAAA,wDAA4B,EAAC,QAAQ,EAAE,eAAe,CAAC,CAAA;IAEzF,OAAO,CACH;QACI,0CAAQ,IAAI,EAAC,kBAAkB,EAAC,EAAE,EAAE,QAAQ,IACvC,kBAAkB,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CACtC;QACT,0CAAQ,IAAI,EAAC,QAAQ,EAAC,EAAE,EAAE,uBAAuB,MAAM,EAAE,IACpD,yBAAyB,CACrB,CACV,CACN,CAAA;AACL,CAAC,CAAA;AAhBQ,QAAA,+BAA+B,mCAgBvC"}
+{"version":3,"file":"InteractionsScriptElement.js","sourceRoot":"","sources":["../../../src/implementations/InteractionsScriptElement.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAAyB;AAGzB,2EAA0E;AAC1E,+DAA2D;AAEpD,MAAM,+BAA+B,GACxC,CAAC,MAAsB,EAAE,eAAwB,EAAE,MAAc,EAAqB,EAAE,CACxF,GAAG,EAAE;IACD,MAAM,QAAQ,GAAG,uBAAuB,MAAM,EAAE,CAAA;IAChD,MAAM,yBAAyB,GAAG,IAAA,wDAA4B,EAAC,QAAQ,EAAE,eAAe,CAAC,CAAA;IAEzF,OAAO,CACH;QACI,0CAAQ,IAAI,EAAC,kBAAkB,EAAC,EAAE,EAAE,QAAQ,IACvC,kBAAkB,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CACtC;QAGT,0CAAQ,IAAI,EAAC,QAAQ,EAAC,EAAE,EAAE,uBAAuB,MAAM,EAAE,EAAE,GAAG,EAAE,yCAAmB,IAC9E,yBAAyB,CACrB,CACV,CACN,CAAA;AACL,CAAC,CAAA;AAlBQ,QAAA,+BAA+B,mCAkBvC"}

package/cjs/build/implementations/coreInteractions.js

@@ -48,13 +48,13 @@ const coreInteractions = (config, getService) => {
     const { SSR } = getService(definition_3.RenderingContextDefinition);
     const isSSRExperimentOpen = isOpen('specs.thunderbolt.interactionsInSsr');
     if (isSSRExperimentOpen) {
-        let didInitInteractInSsr = false;
-        try {
-            didInitInteractInSsr = tryInitInteractInSsr(config, isReducedMotion, getService);
-        }
-        catch (error) {
-            console.warn('failed initializing Interact in SSR, falling back to client init:', error);
-        }
+        // Emits the config and loader scripts. Works in both environments: SSR serves markup the
+        // parser executes, and on the client the loader's ref revives it into a script that runs —
+        // which is what pages rendered only on the client (password-protected / members-only,
+        // client-side navigation) need, since they never get a server-rendered document.
+        const didInitInteractInSsr = tryInitInteractInSsr(config, isReducedMotion, getService);
+        // Fall back to direct init on the client if the script element could not be set up
+        // (e.g. no pageId or no interactions).
         if (!didInitInteractInSsr && !SSR) {
             initInteract(config, isReducedMotion);
         }

package/cjs/build/implementations/coreInteractions.js.map

@@ -1 +1 @@
-{"version":3,"file":"coreInteractions.js","sourceRoot":"","sources":["../../../src/implementations/coreInteractions.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"coreInteractions.js","sourceRoot":"","sources":["../../../src/implementations/coreInteractions.ts"],"names":[],"mappings":"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"}

package/cjs/build/implementations/interactionsScriptContent.js

@@ -4,25 +4,39 @@ exports.getInteractionsScriptContent = void 0;
 const getInteractionsScriptContent = (configId, isReducedMotion) => `
     await import(\`https://static.parastorage.com/services/interact/dist/interact.umd.min.js\`);
 
+    // Wix pages run an AMD loader (RequireJS) whose define wins the interact UMD wrapper, so the
+    // bundle registers itself as a named AMD module instead of assigning window.interact. Read the
+    // global first, and when it is absent pull the module back out of the AMD loader.
+    let interactModule = window.interact;
+    if (!interactModule?.Interact) {
+        if (typeof window.require === \`function\`) {
+            try {
+                interactModule = await new Promise(function (resolve, reject) {
+                    window.require([\`interact\`], resolve, reject);
+                });
+            } catch (error) {
+                console.error(\`Failed loading Interact via the AMD loader\`, error);
+            }
+        }
+    }
+
+    const Interact = interactModule?.Interact;
     const configElement = document.getElementById(\`${configId}\`);
-    if (configElement) {
-        const Interact = window.interact?.Interact;
-        if (!Interact) {
-            console.error(\`Interact library is not loaded\`);
-        } else {
-            const config = JSON.parse(decodeURIComponent(configElement.textContent));
+    if (!Interact) {
+        console.error(\`Interact library is not loaded\`);
+    } else if (configElement) {
+        const config = JSON.parse(decodeURIComponent(configElement.textContent));
 
-            Interact.forceReducedMotion = ${isReducedMotion};
-            Interact.setup({
-                scrollOptionsGetter: function(){ return document.getElementById(\`site-root\`) },
-                allowA11yTriggers: true,
-                viewEnter: {
-                    useSafeViewEnter: true,
-                },
-            });
+        Interact.forceReducedMotion = ${isReducedMotion};
+        Interact.setup({
+            scrollOptionsGetter: function(){ return document.getElementById(\`site-root\`) },
+            allowA11yTriggers: true,
+            viewEnter: {
+                useSafeViewEnter: true,
+            },
+        });
 
-            Interact.create(config);
-        }
+        Interact.create(config);
     }
 `;
 exports.getInteractionsScriptContent = getInteractionsScriptContent;

package/cjs/build/implementations/interactionsScriptContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"interactionsScriptContent.js","sourceRoot":"","sources":["../../../src/implementations/interactionsScriptContent.ts"],"names":[],"mappings":";;;AAAO,MAAM,4BAA4B,GAAG,CAAC,QAAgB,EAAE,eAAwB,EAAE,EAAE,CAAC;;;sDAGtC,QAAQ;;;;;;;;4CAQlB,eAAe;;;;;;;;;;;;CAY1D,CAAA;AAvBY,QAAA,4BAA4B,gCAuBxC"}
+{"version":3,"file":"interactionsScriptContent.js","sourceRoot":"","sources":["../../../src/implementations/interactionsScriptContent.ts"],"names":[],"mappings":";;;AAAO,MAAM,4BAA4B,GAAG,CAAC,QAAgB,EAAE,eAAwB,EAAE,EAAE,CAAC;;;;;;;;;;;;;;;;;;;;sDAoBtC,QAAQ;;;;;;wCAMtB,eAAe;;;;;;;;;;;CAWtD,CAAA;AArCY,QAAA,4BAA4B,gCAqCxC"}

package/cjs/build/implementations/reviveScriptElement.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Replaces a React-created <script> with an equivalent the browser will execute.
+ *
+ * React DOM creates every script through `div.innerHTML` — deliberately, so that scripts it renders
+ * on the client never run (see the `type === 'script'` branch of its `createElement`). That sets the
+ * HTML spec's "already started" flag, which is sticky: moving, re-inserting or re-connecting the
+ * element changes nothing, and the flag is even copied on `cloneNode`.
+ *
+ * An element from `document.createElement` has the flag clear and runs as soon as it is connected,
+ * so copying the source across is enough. Used as a ref, this runs only on the client — refs are
+ * never invoked during `renderToString` — while SSR keeps emitting markup the parser executes.
+ * One mechanism, no environment check.
+ *
+ * On a page that was server-rendered the parser has already run this source, so hydration reviving
+ * it runs it a second time. That create is inert: `interact-element` is defined, its elements are
+ * connected, and `connect()` returns early for them, so only the first instance serves a key.
+ */
+export declare const reviveScriptElement: (rendered: HTMLScriptElement | null) => void;

package/cjs/build/implementations/reviveScriptElement.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.reviveScriptElement = void 0;
+/**
+ * Replaces a React-created <script> with an equivalent the browser will execute.
+ *
+ * React DOM creates every script through `div.innerHTML` — deliberately, so that scripts it renders
+ * on the client never run (see the `type === 'script'` branch of its `createElement`). That sets the
+ * HTML spec's "already started" flag, which is sticky: moving, re-inserting or re-connecting the
+ * element changes nothing, and the flag is even copied on `cloneNode`.
+ *
+ * An element from `document.createElement` has the flag clear and runs as soon as it is connected,
+ * so copying the source across is enough. Used as a ref, this runs only on the client — refs are
+ * never invoked during `renderToString` — while SSR keeps emitting markup the parser executes.
+ * One mechanism, no environment check.
+ *
+ * On a page that was server-rendered the parser has already run this source, so hydration reviving
+ * it runs it a second time. That create is inert: `interact-element` is defined, its elements are
+ * connected, and `connect()` returns early for them, so only the first instance serves a key.
+ */
+const reviveScriptElement = (rendered) => {
+    if (!rendered?.isConnected) {
+        return;
+    }
+    const executable = globalThis.document.createElement('script');
+    executable.type = rendered.type;
+    executable.id = rendered.id;
+    executable.textContent = rendered.textContent;
+    rendered.replaceWith(executable);
+};
+exports.reviveScriptElement = reviveScriptElement;
+//# sourceMappingURL=reviveScriptElement.js.map

package/cjs/build/implementations/reviveScriptElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reviveScriptElement.js","sourceRoot":"","sources":["../../../src/implementations/reviveScriptElement.ts"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;GAgBG;AACI,MAAM,mBAAmB,GAAG,CAAC,QAAkC,EAAE,EAAE;IACtE,IAAI,CAAC,QAAQ,EAAE,WAAW,EAAE,CAAC;QACzB,OAAM;IACV,CAAC;IAED,MAAM,UAAU,GAAG,UAAU,CAAC,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAA;IAC9D,UAAU,CAAC,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAA;IAC/B,UAAU,CAAC,EAAE,GAAG,QAAQ,CAAC,EAAE,CAAA;IAC3B,UAAU,CAAC,WAAW,GAAG,QAAQ,CAAC,WAAW,CAAA;IAE7C,QAAQ,CAAC,WAAW,CAAC,UAAU,CAAC,CAAA;AACpC,CAAC,CAAA;AAXY,QAAA,mBAAmB,uBAW/B"}

package/dist/implementations/InteractionsScriptElement.js

@@ -1,10 +1,11 @@
 import React from 'react';
 import { getInteractionsScriptContent } from './interactionsScriptContent';
+import { reviveScriptElement } from './reviveScriptElement';
 export const createInteractionsScriptElement = (config, isReducedMotion, pageId) => () => {
     const configId = `interactions-config-${pageId}`;
     const interactionsScriptContent = getInteractionsScriptContent(configId, isReducedMotion);
     return (React.createElement(React.Fragment, null,
         React.createElement("script", { type: "application/json", id: configId }, encodeURIComponent(JSON.stringify(config))),
-        React.createElement("script", { type: "module", id: `interactions-loader-${pageId}` }, interactionsScriptContent)));
+        React.createElement("script", { type: "module", id: `interactions-loader-${pageId}`, ref: reviveScriptElement }, interactionsScriptContent)));
 };
 //# sourceMappingURL=InteractionsScriptElement.js.map

package/dist/implementations/InteractionsScriptElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"InteractionsScriptElement.js","sourceRoot":"","sources":["../../src/implementations/InteractionsScriptElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,EAAE,4BAA4B,EAAE,MAAM,6BAA6B,CAAA;AAE1E,MAAM,CAAC,MAAM,+BAA+B,GACxC,CAAC,MAAsB,EAAE,eAAwB,EAAE,MAAc,EAAqB,EAAE,CACxF,GAAG,EAAE;IACD,MAAM,QAAQ,GAAG,uBAAuB,MAAM,EAAE,CAAA;IAChD,MAAM,yBAAyB,GAAG,4BAA4B,CAAC,QAAQ,EAAE,eAAe,CAAC,CAAA;IAEzF,OAAO,CACH;QACI,gCAAQ,IAAI,EAAC,kBAAkB,EAAC,EAAE,EAAE,QAAQ,IACvC,kBAAkB,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CACtC;QACT,gCAAQ,IAAI,EAAC,QAAQ,EAAC,EAAE,EAAE,uBAAuB,MAAM,EAAE,IACpD,yBAAyB,CACrB,CACV,CACN,CAAA;AACL,CAAC,CAAA"}
+{"version":3,"file":"InteractionsScriptElement.js","sourceRoot":"","sources":["../../src/implementations/InteractionsScriptElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,EAAE,4BAA4B,EAAE,MAAM,6BAA6B,CAAA;AAC1E,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAA;AAE3D,MAAM,CAAC,MAAM,+BAA+B,GACxC,CAAC,MAAsB,EAAE,eAAwB,EAAE,MAAc,EAAqB,EAAE,CACxF,GAAG,EAAE;IACD,MAAM,QAAQ,GAAG,uBAAuB,MAAM,EAAE,CAAA;IAChD,MAAM,yBAAyB,GAAG,4BAA4B,CAAC,QAAQ,EAAE,eAAe,CAAC,CAAA;IAEzF,OAAO,CACH;QACI,gCAAQ,IAAI,EAAC,kBAAkB,EAAC,EAAE,EAAE,QAAQ,IACvC,kBAAkB,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CACtC;QAGT,gCAAQ,IAAI,EAAC,QAAQ,EAAC,EAAE,EAAE,uBAAuB,MAAM,EAAE,EAAE,GAAG,EAAE,mBAAmB,IAC9E,yBAAyB,CACrB,CACV,CACN,CAAA;AACL,CAAC,CAAA"}

package/dist/implementations/coreInteractions.js

@@ -45,13 +45,13 @@ export const coreInteractions = (config, getService) => {
     const { SSR } = getService(RenderingContextDefinition);
     const isSSRExperimentOpen = isOpen('specs.thunderbolt.interactionsInSsr');
     if (isSSRExperimentOpen) {
-        let didInitInteractInSsr = false;
-        try {
-            didInitInteractInSsr = tryInitInteractInSsr(config, isReducedMotion, getService);
-        }
-        catch (error) {
-            console.warn('failed initializing Interact in SSR, falling back to client init:', error);
-        }
+        // Emits the config and loader scripts. Works in both environments: SSR serves markup the
+        // parser executes, and on the client the loader's ref revives it into a script that runs —
+        // which is what pages rendered only on the client (password-protected / members-only,
+        // client-side navigation) need, since they never get a server-rendered document.
+        const didInitInteractInSsr = tryInitInteractInSsr(config, isReducedMotion, getService);
+        // Fall back to direct init on the client if the script element could not be set up
+        // (e.g. no pageId or no interactions).
         if (!didInitInteractInSsr && !SSR) {
             initInteract(config, isReducedMotion);
         }

package/dist/implementations/coreInteractions.js.map

@@ -1 +1 @@
-{"version":3,"file":"coreInteractions.js","sourceRoot":"","sources":["../../src/implementations/coreInteractions.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"coreInteractions.js","sourceRoot":"","sources":["../../src/implementations/coreInteractions.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAExC,OAAO,EAAE,oBAAoB,EAAE,MAAM,0CAA0C,CAAA;AAC/E,OAAO,EAAE,qBAAqB,EAAE,MAAM,0CAA0C,CAAA;AAChF,OAAO,EAAE,0BAA0B,EAAE,MAAM,gDAAgD,CAAA;AAC3F,OAAO,EAAE,eAAe,EAAE,MAAM,oCAAoC,CAAA;AACpE,OAAO,EAAE,iCAAiC,EAAE,MAAM,6DAA6D,CAAA;AAE/G,OAAO,EAAE,+BAA+B,EAAE,MAAM,6BAA6B,CAAA;AAE7E,MAAM,YAAY,GAAG,CAAC,MAAsB,EAAE,eAAwB,EAAE,EAAE;IACtE,QAAQ,CAAC,kBAAkB,GAAG,eAAe,CAAA;IAC7C,QAAQ,CAAC,KAAK,CAAC;QACX,mBAAmB,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC,cAAc,CAAC,WAAW,CAAC;QAC1E,iBAAiB,EAAE,IAAI;QACvB,SAAS,EAAE;YACP,gBAAgB,EAAE,IAAI;SACzB;KACJ,CAAC,CAAA;IACF,QAAQ,CAAC,MAAM,CAAC,MAAM,CAAC,CAAA;AAC3B,CAAC,CAAA;AAED,MAAM,oBAAoB,GAAG,CACzB,MAAsB,EACtB,eAAwB,EACxB,UAAyC,EAC3C,EAAE;IACA,MAAM,eAAe,GAAG,MAAM,CAAC,YAAY,EAAE,MAAM,GAAG,CAAC,CAAA;IACvD,IAAI,CAAC,eAAe,EAAE,CAAC;QACnB,OAAO,KAAK,CAAA;IAChB,CAAC;IAED,MAAM,EAAE,WAAW,EAAE,GAAG,UAAU,CAAC,eAAe,CAAC,CAAA;IACnD,MAAM,MAAM,GAAG,WAAW,EAAE,EAAE,CAAA;IAE9B,IAAI,CAAC,MAAM,EAAE,CAAC;QACV,OAAO,KAAK,CAAA;IAChB,CAAC;IAED,MAAM,EAAE,eAAe,EAAE,GAAG,UAAU,CAAC,iCAAiC,CAAC,CAAA;IACzE,MAAM,gBAAgB,GAAG,+BAA+B,CAAC,MAAM,EAAE,eAAe,EAAE,MAAM,CAAC,CAAA;IACzF,eAAe,CAAC,gBAAgB,CAAC,CAAA;IAEjC,OAAO,IAAI,CAAA;AACf,CAAC,CAAA;AAED,MAAM,mBAAmB,GAAG,CAAC,YAA4C,EAAE,EAAE,CACzE,YAAY,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,EAAE,GAAG,EAAE,OAAO,EAAE,EAAE,EAAE;IAC1C,mBAAmB;IACnB,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;IACZ,qBAAqB;IACrB,sBAAsB;IACtB,OAAO,CAAC,OAAO,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAI,CAAC,CAAC,CAAA;IAE3C,OAAO,GAAG,CAAA;AACd,CAAC,EAAE,IAAI,GAAG,EAAU,CAAC,CAAA;AAEzB,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,MAAsB,EAAE,UAAyC,EAAE,EAAE;IAClG,MAAM,EAAE,aAAa,EAAE,eAAe,EAAE,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAA;IAC3E,MAAM,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC,qBAAqB,CAAC,CAAA;IACpD,MAAM,EAAE,GAAG,EAAE,GAAG,UAAU,CAAC,0BAA0B,CAAC,CAAA;IAEtD,MAAM,mBAAmB,GAAG,MAAM,CAAC,qCAAqC,CAAC,CAAA;IACzE,IAAI,mBAAmB,EAAE,CAAC;QACtB,yFAAyF;QACzF,2FAA2F;QAC3F,sFAAsF;QACtF,iFAAiF;QACjF,MAAM,oBAAoB,GAAG,oBAAoB,CAAC,MAAM,EAAE,eAAe,EAAE,UAAU,CAAC,CAAA;QAEtF,mFAAmF;QACnF,uCAAuC;QACvC,IAAI,CAAC,oBAAoB,IAAI,CAAC,GAAG,EAAE,CAAC;YAChC,YAAY,CAAC,MAAM,EAAE,eAAe,CAAC,CAAA;QACzC,CAAC;IACL,CAAC;SAAM,CAAC;QACJ,YAAY,CAAC,MAAM,EAAE,eAAe,CAAC,CAAA;IACzC,CAAC;IAED,OAAO;QACH,gBAAgB,EAAE,mBAAmB,CAAC,MAAM,CAAC,YAAY,CAAC;KAC7D,CAAA;AACL,CAAC,CAAA"}

package/dist/implementations/interactionsScriptContent.js

@@ -1,25 +1,39 @@
 export const getInteractionsScriptContent = (configId, isReducedMotion) => `
     await import(\`https://static.parastorage.com/services/interact/dist/interact.umd.min.js\`);
 
+    // Wix pages run an AMD loader (RequireJS) whose define wins the interact UMD wrapper, so the
+    // bundle registers itself as a named AMD module instead of assigning window.interact. Read the
+    // global first, and when it is absent pull the module back out of the AMD loader.
+    let interactModule = window.interact;
+    if (!interactModule?.Interact) {
+        if (typeof window.require === \`function\`) {
+            try {
+                interactModule = await new Promise(function (resolve, reject) {
+                    window.require([\`interact\`], resolve, reject);
+                });
+            } catch (error) {
+                console.error(\`Failed loading Interact via the AMD loader\`, error);
+            }
+        }
+    }
+
+    const Interact = interactModule?.Interact;
     const configElement = document.getElementById(\`${configId}\`);
-    if (configElement) {
-        const Interact = window.interact?.Interact;
-        if (!Interact) {
-            console.error(\`Interact library is not loaded\`);
-        } else {
-            const config = JSON.parse(decodeURIComponent(configElement.textContent));
+    if (!Interact) {
+        console.error(\`Interact library is not loaded\`);
+    } else if (configElement) {
+        const config = JSON.parse(decodeURIComponent(configElement.textContent));
 
-            Interact.forceReducedMotion = ${isReducedMotion};
-            Interact.setup({
-                scrollOptionsGetter: function(){ return document.getElementById(\`site-root\`) },
-                allowA11yTriggers: true,
-                viewEnter: {
-                    useSafeViewEnter: true,
-                },
-            });
+        Interact.forceReducedMotion = ${isReducedMotion};
+        Interact.setup({
+            scrollOptionsGetter: function(){ return document.getElementById(\`site-root\`) },
+            allowA11yTriggers: true,
+            viewEnter: {
+                useSafeViewEnter: true,
+            },
+        });
 
-            Interact.create(config);
-        }
+        Interact.create(config);
     }
 `;
 //# sourceMappingURL=interactionsScriptContent.js.map

package/dist/implementations/interactionsScriptContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"interactionsScriptContent.js","sourceRoot":"","sources":["../../src/implementations/interactionsScriptContent.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,4BAA4B,GAAG,CAAC,QAAgB,EAAE,eAAwB,EAAE,EAAE,CAAC;;;sDAGtC,QAAQ;;;;;;;;4CAQlB,eAAe;;;;;;;;;;;;CAY1D,CAAA"}
+{"version":3,"file":"interactionsScriptContent.js","sourceRoot":"","sources":["../../src/implementations/interactionsScriptContent.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,4BAA4B,GAAG,CAAC,QAAgB,EAAE,eAAwB,EAAE,EAAE,CAAC;;;;;;;;;;;;;;;;;;;;sDAoBtC,QAAQ;;;;;;wCAMtB,eAAe;;;;;;;;;;;CAWtD,CAAA"}

package/dist/implementations/reviveScriptElement.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Replaces a React-created <script> with an equivalent the browser will execute.
+ *
+ * React DOM creates every script through `div.innerHTML` — deliberately, so that scripts it renders
+ * on the client never run (see the `type === 'script'` branch of its `createElement`). That sets the
+ * HTML spec's "already started" flag, which is sticky: moving, re-inserting or re-connecting the
+ * element changes nothing, and the flag is even copied on `cloneNode`.
+ *
+ * An element from `document.createElement` has the flag clear and runs as soon as it is connected,
+ * so copying the source across is enough. Used as a ref, this runs only on the client — refs are
+ * never invoked during `renderToString` — while SSR keeps emitting markup the parser executes.
+ * One mechanism, no environment check.
+ *
+ * On a page that was server-rendered the parser has already run this source, so hydration reviving
+ * it runs it a second time. That create is inert: `interact-element` is defined, its elements are
+ * connected, and `connect()` returns early for them, so only the first instance serves a key.
+ */
+export declare const reviveScriptElement: (rendered: HTMLScriptElement | null) => void;

package/dist/implementations/reviveScriptElement.js

@@ -0,0 +1,28 @@
+/**
+ * Replaces a React-created <script> with an equivalent the browser will execute.
+ *
+ * React DOM creates every script through `div.innerHTML` — deliberately, so that scripts it renders
+ * on the client never run (see the `type === 'script'` branch of its `createElement`). That sets the
+ * HTML spec's "already started" flag, which is sticky: moving, re-inserting or re-connecting the
+ * element changes nothing, and the flag is even copied on `cloneNode`.
+ *
+ * An element from `document.createElement` has the flag clear and runs as soon as it is connected,
+ * so copying the source across is enough. Used as a ref, this runs only on the client — refs are
+ * never invoked during `renderToString` — while SSR keeps emitting markup the parser executes.
+ * One mechanism, no environment check.
+ *
+ * On a page that was server-rendered the parser has already run this source, so hydration reviving
+ * it runs it a second time. That create is inert: `interact-element` is defined, its elements are
+ * connected, and `connect()` returns early for them, so only the first instance serves a key.
+ */
+export const reviveScriptElement = (rendered) => {
+    if (!rendered?.isConnected) {
+        return;
+    }
+    const executable = globalThis.document.createElement('script');
+    executable.type = rendered.type;
+    executable.id = rendered.id;
+    executable.textContent = rendered.textContent;
+    rendered.replaceWith(executable);
+};
+//# sourceMappingURL=reviveScriptElement.js.map

package/dist/implementations/reviveScriptElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reviveScriptElement.js","sourceRoot":"","sources":["../../src/implementations/reviveScriptElement.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,QAAkC,EAAE,EAAE;IACtE,IAAI,CAAC,QAAQ,EAAE,WAAW,EAAE,CAAC;QACzB,OAAM;IACV,CAAC;IAED,MAAM,UAAU,GAAG,UAAU,CAAC,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAA;IAC9D,UAAU,CAAC,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAA;IAC/B,UAAU,CAAC,EAAE,GAAG,QAAQ,CAAC,EAAE,CAAA;IAC3B,UAAU,CAAC,WAAW,GAAG,QAAQ,CAAC,WAAW,CAAA;IAE7C,QAAQ,CAAC,WAAW,CAAC,UAAU,CAAC,CAAA;AACpC,CAAC,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/site-service-interactions",
-  "version": "1.0.7",
+  "version": "1.0.9",
   "main": "cjs/build/index.js",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -90,5 +90,5 @@
       ]
     }
   },
-  "falconPackageHash": "a05b213a75034a399556f8e0fcaab4a027182245d76e1541432d184e"
+  "falconPackageHash": "629f3f89a2fc1e079366d274ab06644e0a74eba7c695c37d6f234e61"
 }

package/src/implementations/InteractionsScriptElement.tsx

@@ -2,6 +2,7 @@ import React from 'react'
 import type { FunctionComponent } from 'react'
 import type { InteractConfig } from '@wix/interact'
 import { getInteractionsScriptContent } from './interactionsScriptContent'
+import { reviveScriptElement } from './reviveScriptElement'
 
 export const createInteractionsScriptElement =
     (config: InteractConfig, isReducedMotion: boolean, pageId: string): FunctionComponent =>
@@ -14,7 +15,9 @@ export const createInteractionsScriptElement =
                 <script type="application/json" id={configId}>
                     {encodeURIComponent(JSON.stringify(config))}
                 </script>
-                <script type="module" id={`interactions-loader-${pageId}`}>
+                {/* In SSR the parser creates this and runs it. On the client React creates a script
+                    that can never execute, so the ref swaps in one that can. */}
+                <script type="module" id={`interactions-loader-${pageId}`} ref={reviveScriptElement}>
                     {interactionsScriptContent}
                 </script>
             </>

package/src/implementations/coreInteractions.ts

@@ -62,14 +62,14 @@ export const coreInteractions = (config: InteractConfig, getService: ServicesMan
 
     const isSSRExperimentOpen = isOpen('specs.thunderbolt.interactionsInSsr')
     if (isSSRExperimentOpen) {
-        let didInitInteractInSsr = false
-
-        try {
-            didInitInteractInSsr = tryInitInteractInSsr(config, isReducedMotion, getService)
-        } catch (error) {
-            console.warn('failed initializing Interact in SSR, falling back to client init:', error)
-        }
+        // Emits the config and loader scripts. Works in both environments: SSR serves markup the
+        // parser executes, and on the client the loader's ref revives it into a script that runs —
+        // which is what pages rendered only on the client (password-protected / members-only,
+        // client-side navigation) need, since they never get a server-rendered document.
+        const didInitInteractInSsr = tryInitInteractInSsr(config, isReducedMotion, getService)
 
+        // Fall back to direct init on the client if the script element could not be set up
+        // (e.g. no pageId or no interactions).
         if (!didInitInteractInSsr && !SSR) {
             initInteract(config, isReducedMotion)
         }

package/src/implementations/interactionsScriptContent.ts

@@ -1,24 +1,38 @@
 export const getInteractionsScriptContent = (configId: string, isReducedMotion: boolean) => `
     await import(\`https://static.parastorage.com/services/interact/dist/interact.umd.min.js\`);
 
+    // Wix pages run an AMD loader (RequireJS) whose define wins the interact UMD wrapper, so the
+    // bundle registers itself as a named AMD module instead of assigning window.interact. Read the
+    // global first, and when it is absent pull the module back out of the AMD loader.
+    let interactModule = window.interact;
+    if (!interactModule?.Interact) {
+        if (typeof window.require === \`function\`) {
+            try {
+                interactModule = await new Promise(function (resolve, reject) {
+                    window.require([\`interact\`], resolve, reject);
+                });
+            } catch (error) {
+                console.error(\`Failed loading Interact via the AMD loader\`, error);
+            }
+        }
+    }
+
+    const Interact = interactModule?.Interact;
     const configElement = document.getElementById(\`${configId}\`);
-    if (configElement) {
-        const Interact = window.interact?.Interact;
-        if (!Interact) {
-            console.error(\`Interact library is not loaded\`);
-        } else {
-            const config = JSON.parse(decodeURIComponent(configElement.textContent));
+    if (!Interact) {
+        console.error(\`Interact library is not loaded\`);
+    } else if (configElement) {
+        const config = JSON.parse(decodeURIComponent(configElement.textContent));
 
-            Interact.forceReducedMotion = ${isReducedMotion};
-            Interact.setup({
-                scrollOptionsGetter: function(){ return document.getElementById(\`site-root\`) },
-                allowA11yTriggers: true,
-                viewEnter: {
-                    useSafeViewEnter: true,
-                },
-            });
+        Interact.forceReducedMotion = ${isReducedMotion};
+        Interact.setup({
+            scrollOptionsGetter: function(){ return document.getElementById(\`site-root\`) },
+            allowA11yTriggers: true,
+            viewEnter: {
+                useSafeViewEnter: true,
+            },
+        });
 
-            Interact.create(config);
-        }
+        Interact.create(config);
     }
 `

package/src/implementations/reviveScriptElement.ts

@@ -0,0 +1,29 @@
+/**
+ * Replaces a React-created <script> with an equivalent the browser will execute.
+ *
+ * React DOM creates every script through `div.innerHTML` — deliberately, so that scripts it renders
+ * on the client never run (see the `type === 'script'` branch of its `createElement`). That sets the
+ * HTML spec's "already started" flag, which is sticky: moving, re-inserting or re-connecting the
+ * element changes nothing, and the flag is even copied on `cloneNode`.
+ *
+ * An element from `document.createElement` has the flag clear and runs as soon as it is connected,
+ * so copying the source across is enough. Used as a ref, this runs only on the client — refs are
+ * never invoked during `renderToString` — while SSR keeps emitting markup the parser executes.
+ * One mechanism, no environment check.
+ *
+ * On a page that was server-rendered the parser has already run this source, so hydration reviving
+ * it runs it a second time. That create is inert: `interact-element` is defined, its elements are
+ * connected, and `connect()` returns early for them, so only the first instance serves a key.
+ */
+export const reviveScriptElement = (rendered: HTMLScriptElement | null) => {
+    if (!rendered?.isConnected) {
+        return
+    }
+
+    const executable = globalThis.document.createElement('script')
+    executable.type = rendered.type
+    executable.id = rendered.id
+    executable.textContent = rendered.textContent
+
+    rendered.replaceWith(executable)
+}