@hortonstudio/main 1.9.1 → 1.9.3

package/autoInit/site-settings.js

@@ -0,0 +1,134 @@
+export function init() {
+  function setupSiteSettings() {
+    const wrapper = document.querySelector('[data-site-settings-element="wrapper"]');
+
+    if (!wrapper) {
+      return;
+    }
+
+    // Find all lists inside the wrapper
+    const lists = wrapper.querySelectorAll('[data-site-settings-element="list"]');
+
+    if (lists.length === 0) {
+      return;
+    }
+
+    // Collect all site settings data
+    const siteSettings = {};
+
+    lists.forEach(list => {
+      // Find all descendants with data-site-settings attribute
+      const settingElements = list.querySelectorAll('[data-site-settings]');
+
+      settingElements.forEach(element => {
+        // Clone the element to avoid modifying the original DOM
+        const clonedElement = element.cloneNode(true);
+
+        // Find and remove elements with data-site-settings-hide that match their classes
+        const hideElements = clonedElement.querySelectorAll('[data-site-settings-hide]');
+
+        hideElements.forEach(hideElement => {
+          const hideValue = hideElement.getAttribute('data-site-settings-hide');
+
+          if (hideValue) {
+            // Split by spaces to get all class names to check
+            const classesToHide = hideValue.split(' ').filter(c => c.trim());
+
+            // Check if element has any of the classes
+            const hasMatchingClass = classesToHide.some(className =>
+              hideElement.classList.contains(className)
+            );
+
+            // Remove element if it has a matching class
+            if (hasMatchingClass) {
+              hideElement.remove();
+            }
+          }
+        });
+
+        const settingName = element.getAttribute('data-site-settings');
+        const settingValue = clonedElement.textContent.trim();
+
+        // Only store if both name and value exist (ignore empty elements like images)
+        if (settingName && settingValue) {
+          siteSettings[settingName] = settingValue;
+        }
+      });
+    });
+
+    // If no site settings found, exit early
+    if (Object.keys(siteSettings).length === 0) {
+      return;
+    }
+
+    // Replace text content efficiently using TreeWalker
+    const walker = document.createTreeWalker(
+      document.body,
+      NodeFilter.SHOW_TEXT,
+      {
+        acceptNode: (node) => {
+          // Check if any site setting names exist in the text content
+          const text = node.textContent;
+          for (const name in siteSettings) {
+            if (text.includes(`{{${name}}}`)) {
+              return NodeFilter.FILTER_ACCEPT;
+            }
+          }
+          return NodeFilter.FILTER_SKIP;
+        }
+      }
+    );
+
+    const textNodes = [];
+    let node;
+    while (node = walker.nextNode()) {
+      textNodes.push(node);
+    }
+
+    // Replace text in collected nodes
+    textNodes.forEach(textNode => {
+      let newText = textNode.textContent;
+      let hasChanges = false;
+
+      for (const name in siteSettings) {
+        const placeholder = `{{${name}}}`;
+        if (newText.includes(placeholder)) {
+          newText = newText.replace(new RegExp(placeholder, 'g'), siteSettings[name]);
+          hasChanges = true;
+        }
+      }
+
+      if (hasChanges) {
+        textNode.textContent = newText;
+      }
+    });
+
+    // Replace link hrefs
+    const links = document.querySelectorAll('a[href]');
+    links.forEach(link => {
+      let href = link.getAttribute('href');
+      let hasChanges = false;
+
+      for (const name in siteSettings) {
+        const placeholder = `{{${name}}}`;
+        if (href.includes(placeholder)) {
+          href = href.replace(new RegExp(placeholder, 'g'), siteSettings[name]);
+          hasChanges = true;
+        }
+      }
+
+      if (hasChanges) {
+        link.setAttribute('href', href);
+      }
+    });
+  }
+
+  setupSiteSettings();
+
+  return {
+    result: "site-settings initialized",
+    destroy: () => {
+      // No cleanup needed - this module only modifies DOM during init
+    }
+  };
+}

package/index.js

@@ -32,6 +32,7 @@ const initializeHsMain = async () => {
     accessibility: () => import("./autoInit/accessibility.js"),
     counter: () => import("./autoInit/counter.js"),
     form: () => import("./autoInit/form.js"),
+    "site-settings": () => import("./autoInit/site-settings.js"),
   };
 
   let scripts = [
@@ -71,6 +72,7 @@ const initializeHsMain = async () => {
     accessibility: true,
     counter: true,
     form: true,
+    "site-settings": true,
     // Only include transition if no-transition attribute is NOT present
     ...(hasNoTransition ? {} : { transition: true }),
   };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hortonstudio/main",
-  "version": "1.9.1",
+  "version": "1.9.3",
   "description": "Animation and utility library for client websites",
   "main": "index.js",
   "type": "module",