@hortonstudio/main 1.2.1 → 1.2.2

package/index.js

@@ -1,4 +1,4 @@
-// ver 1.2.1
+// ver 1.2.2
 
 const API_NAME = 'hsmain';
 
@@ -27,6 +27,25 @@ const loadModule = async (moduleName) => {
         default:
             throw new Error(`HortonStudio module "${moduleName}" is not supported.`);
     }
+    
+    // Refresh Webflow after processing
+    setTimeout(() => {
+        if (window.Webflow && window.Webflow.ready) {
+            window.Webflow.ready();
+        }
+
+        // Run all registered post-Webflow callbacks (even without Webflow)
+        setTimeout(() => {
+            postWebflowCallbacks.forEach(callback => {
+                try {
+                    callback();
+                } catch (error) {
+                    console.error('Callback error:', error);
+                }
+            });
+            window[API_NAME].loaded = true;
+        }, 100);
+    }, 100);
 };
 
 const animationModules = {
@@ -124,12 +143,19 @@ const loadHsModule = async (moduleName) => {
     try {
         const { init, version } = await loadModule(moduleName);
         const initResult = await init();
-        const { result } = initResult || {};
+        const { result, destroy } = initResult || {};
 
         moduleObj.version = version;
-        moduleObj.restart = () => {
+        
+        // Finsweet-style destroy and restart methods
+        moduleObj.destroy = () => {
+            destroy?.();
             apiInstance.process.delete(moduleName);
-            return loadHsModule(moduleName);
+        };
+        
+        moduleObj.restart = () => {
+            moduleObj.destroy?.();
+            return apiInstance.load(moduleName);
         };
 
         moduleObj.resolve?.(result);
@@ -146,10 +172,18 @@ const loadHsModule = async (moduleName) => {
 };
 
 const initializeAPI = () => {
-    const apiInstance = window[API_NAME];
-
-    const existingRequests = Array.isArray(apiInstance) ? apiInstance : [];
-    const scriptTag = findCurrentScriptTag();
+    // Handle early API calls (like Finsweet)
+    const existingAPI = window[API_NAME];
+    if (existingAPI && !Array.isArray(existingAPI)) {
+        processAPI();
+        return;
+    }
+    
+    const existingRequests = Array.isArray(existingAPI) ? existingAPI : [];
+    const scripts = [...document.querySelectorAll(`script[data-hs-main][src="${import.meta.url}"]`)];
+    const scriptTag = scripts[0] || document.querySelector('script[data-hs-main]');
+    
+    // Handle rich text blocks
     const richTextBlocks = document.querySelectorAll('.w-richtext');
     richTextBlocks.forEach(block => {
         const images = block.querySelectorAll('img');
@@ -159,17 +193,33 @@ const initializeAPI = () => {
     });
 
     window[API_NAME] = {
-        scriptTag,
+        scripts,
         modules: {},
         process: new Set(),
-
         load: loadHsModule,
+        
+        // Push method for queuing (like Finsweet)
+        push(...requests) {
+            for (let [moduleName, callback] of requests) {
+                if (typeof callback === 'function') {
+                    this.modules[moduleName]?.loading?.then(callback);
+                } else {
+                    this.load(moduleName);
+                }
+            }
+        },
+        
+        // Destroy all modules
+        destroy() {
+            for (let moduleName in this.modules) {
+                this.modules[moduleName]?.destroy?.();
+            }
+        },
 
         // API function for scripts to register post-initialization callbacks
         afterReady: (callback) => {
             if (typeof callback === 'function') {
                 postWebflowCallbacks.push(callback);
-            } else {
             }
         },
         
@@ -177,7 +227,6 @@ const initializeAPI = () => {
         afterWebflowReady: (callback) => {
             if (typeof callback === 'function') {
                 postWebflowCallbacks.push(callback);
-            } else {
             }
         },
 
@@ -198,13 +247,61 @@ const initializeAPI = () => {
         }
     };
 
-    processModules(scriptTag);
+    processAPI();
+    
+    // Process any queued requests
+    window[API_NAME].push(...existingRequests);
+};
 
-    if (existingRequests.length > 0) {
-        existingRequests.forEach(request => {
-            if (typeof request === 'string') {
-                window[API_NAME].load(request);
+const processAPI = () => {
+    // Check for auto mode
+    let autoMode = false;
+    for (let script of window[API_NAME].scripts || []) {
+        autoMode ||= script.getAttribute('data-hs-auto') === 'true';
+        
+        // Load modules based on script attributes
+        for (const moduleName of Object.keys({ ...animationModules, ...utilityModules })) {
+            if (script.hasAttribute(moduleName)) {
+                loadHsModule(moduleName);
+            }
+        }
+    }
+    
+    // Auto-discovery mode (scan DOM for attributes)
+    if (autoMode) {
+        document.fonts.ready.then(() => {
+            const foundModules = new Set();
+            const allElements = document.querySelectorAll('*');
+            
+            for (let element of allElements) {
+                for (let attrName of element.getAttributeNames()) {
+                    // Look for data-hs-[something] attributes
+                    const match = attrName.match(/^data-hs-([^-=]+)/)?.[1];
+                    if (match && attributeToModule[match]) {
+                        foundModules.add(attributeToModule[match]);
+                    }
+                }
             }
+            
+            for (let moduleName of foundModules) {
+                loadHsModule(moduleName);
+            }
+        });
+    }
+    
+    // Always load auto-init modules
+    for (const moduleName of Object.keys(autoInitModules)) {
+        loadHsModule(moduleName);
+    }
+    
+    // Hide .transition elements if transition module is not loaded
+    const hasTransition = window[API_NAME].scripts?.some(script => 
+        script.hasAttribute('data-hs-anim-transition')
+    );
+    if (!hasTransition) {
+        const transitionElements = document.querySelectorAll('.transition');
+        transitionElements.forEach(element => {
+            element.style.display = 'none';
         });
     }
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hortonstudio/main",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "main": "index.js",
   "type": "module",
   "scripts": {