ultimate-jekyll-manager 0.0.149 → 0.0.151

package/dist/assets/js/libs/form-manager.js

@@ -15,6 +15,9 @@
 import { ready as domReady } from 'web-manager/modules/dom.js';
 import { showNotification, getDeviceType } from 'web-manager/modules/utilities.js';
 
+// Constants
+const HONEYPOT_SELECTOR = '[data-honey], [name="honey"]';
+
 export class FormManager {
   constructor(selector, options = {}) {
     // Get form element
@@ -35,6 +38,7 @@ export class FormManager {
       warnOnUnsavedChanges: false, // Warn user before leaving page with unsaved changes
       submittingText: 'Processing...', // Text shown on submit button during submission
       submittedText: 'Processed!', // Text shown on submit button after submission (when allowResubmit: false)
+      inputGroup: null, // Filter getData() to only include fields with matching data-input-group (null = all fields)
       ...options,
     };
 
@@ -48,6 +52,7 @@ export class FormManager {
       validation: [],
       submit: [],
       statechange: [],
+      honeypot: [],
     };
 
     // Field errors (populated during validation)
@@ -297,6 +302,21 @@ export class FormManager {
     }
     /* @dev-only:end */
 
+    // 0. Check honeypot fields first (bot detection)
+    if (this._isHoneypotFilled()) {
+      /* @dev-only:start */
+      {
+        console.log('[Form-manager] Honeypot triggered - rejecting submission');
+      }
+      /* @dev-only:end */
+
+      // Emit honeypot event for tracking
+      this._emit('honeypot', { data });
+
+      this.showError('Something went wrong. Please try again.');
+      return false;
+    }
+
     // Create setError helper for custom validation
     const setError = (fieldName, message) => {
       this._fieldErrors[fieldName] = message;
@@ -712,30 +732,68 @@ export class FormManager {
 
   /**
    * Collect form data as plain object (supports dot notation for nested fields)
+   * Respects inputGroup filter when set - only includes fields matching the group
    */
   getData() {
-    const formData = new FormData(this.$form);
     const data = {};
 
-    // Count checkboxes per name to detect groups vs single
+    // Get all form fields
+    const $fields = this.$form.querySelectorAll('input, select, textarea');
+
+    // Count checkboxes per name to detect groups vs single (only for fields in group)
     const checkboxCounts = {};
-    this.$form.querySelectorAll('input[type="checkbox"]').forEach(($cb) => {
-      checkboxCounts[$cb.name] = (checkboxCounts[$cb.name] || 0) + 1;
+    $fields.forEach(($field) => {
+      if ($field.type === 'checkbox' && this._isFieldInGroup($field)) {
+        checkboxCounts[$field.name] = (checkboxCounts[$field.name] || 0) + 1;
+      }
     });
 
-    for (const [key, value] of formData.entries()) {
+    // Process non-checkbox fields
+    $fields.forEach(($field) => {
+      const name = $field.name;
+
+      // Skip fields without name
+      if (!name) {
+        return;
+      }
+
+      // Skip if field is not in current input group
+      if (!this._isFieldInGroup($field)) {
+        return;
+      }
+
+      // Skip honeypot fields (should never be in form data)
+      if ($field.matches(HONEYPOT_SELECTOR)) {
+        return;
+      }
+
       // Skip checkboxes - we handle them separately
-      if (checkboxCounts[key]) {
-        continue;
+      if ($field.type === 'checkbox') {
+        return;
       }
-      this._setNested(data, key, value);
-    }
+
+      // Skip radio buttons that aren't checked
+      if ($field.type === 'radio' && !$field.checked) {
+        return;
+      }
+
+      this._setNested(data, name, $field.value);
+    });
 
     // Handle checkboxes
     const processedGroups = new Set();
-    this.$form.querySelectorAll('input[type="checkbox"]').forEach(($cb) => {
+    $fields.forEach(($cb) => {
+      if ($cb.type !== 'checkbox') {
+        return;
+      }
+
       const name = $cb.name;
 
+      // Skip if field is not in current input group
+      if (!this._isFieldInGroup($cb)) {
+        return;
+      }
+
       // Single checkbox: true/false
       if (checkboxCounts[name] === 1) {
         this._setNested(data, name, $cb.checked);
@@ -750,7 +808,10 @@ export class FormManager {
 
       const values = {};
       this.$form.querySelectorAll(`input[type="checkbox"][name="${name}"]`).forEach(($groupCb) => {
-        values[$groupCb.value] = $groupCb.checked;
+        // Only include checkboxes that are in the group
+        if (this._isFieldInGroup($groupCb)) {
+          values[$groupCb.value] = $groupCb.checked;
+        }
       });
       this._setNested(data, name, values);
     });
@@ -806,6 +867,83 @@ export class FormManager {
     return this._isDirty;
   }
 
+  /**
+   * Set the input group filter for getData()
+   * When set, getData() only returns fields matching the group (via data-input-group attribute)
+   * Fields without data-input-group or with empty value are considered "global" and always included
+   *
+   * @param {string|string[]|null} group - Group name(s) to filter by (e.g., 'url', ['url', 'wifi']), or null to disable filtering
+   * @returns {FormManager} - Returns this for chaining
+   */
+  setInputGroup(group) {
+    // Normalize to array or null
+    if (group === null || group === undefined || group === '') {
+      this.config.inputGroup = null;
+    } else if (Array.isArray(group)) {
+      this.config.inputGroup = group.map((g) => g.toLowerCase());
+    } else {
+      this.config.inputGroup = [group.toLowerCase()];
+    }
+
+    /* @dev-only:start */
+    {
+      console.log('[Form-manager] setInputGroup:', this.config.inputGroup);
+    }
+    /* @dev-only:end */
+
+    return this;
+  }
+
+  /**
+   * Get the current input group filter
+   * @returns {string[]|null}
+   */
+  getInputGroup() {
+    return this.config.inputGroup;
+  }
+
+  /**
+   * Check if any honeypot field has been filled (bot detection)
+   * Honeypot fields are hidden from users but bots fill them automatically
+   * @returns {boolean} - true if a honeypot field has a value (bot detected)
+   */
+  _isHoneypotFilled() {
+    const $honeypots = this.$form.querySelectorAll(HONEYPOT_SELECTOR);
+
+    for (const $field of $honeypots) {
+      if ($field.value && $field.value.trim() !== '') {
+        return true;
+      }
+    }
+
+    return false;
+  }
+
+  /**
+   * Check if a field should be included based on input group filter
+   * @param {HTMLElement} $field - The field element to check
+   * @returns {boolean}
+   */
+  _isFieldInGroup($field) {
+    const allowedGroups = this.config.inputGroup;
+
+    // No filter set - include all fields
+    if (!allowedGroups) {
+      return true;
+    }
+
+    // Get field's group attribute
+    const fieldGroup = $field.getAttribute('data-input-group');
+
+    // No group attribute or empty = global field, always include
+    if (!fieldGroup || fieldGroup.trim() === '') {
+      return true;
+    }
+
+    // Check if field's group is in allowed groups
+    return allowedGroups.includes(fieldGroup.toLowerCase());
+  }
+
   /**
    * Set form data from a nested object (supports dot notation field names)
    */

package/dist/assets/js/pages/contact/index.js

@@ -32,18 +32,16 @@ function setupForm() {
     resetOnSuccess: true,
   });
 
+  // Track honeypot triggers (spam detection)
+  formManager.on('honeypot', () => {
+    trackContactSpam();
+  });
+
   formManager.on('submit', async ({ data }) => {
     const slapformId = webManager.config.brand.contact['slapform-form-id'];
 
     console.log('Contact form submission:', data);
 
-    // Check honeypot fields (anti-spam)
-    if (data.url_check || data.slap_honey) {
-      console.warn('Honeypot field filled - potential spam');
-      trackContactSpam();
-      return;
-    }
-
     // Check if slapformId is missing
     if (!slapformId) {
       webManager.sentry().captureException(new Error('Contact form is not configured - missing slapform ID'));

package/dist/assets/js/pages/test/libraries/form-manager/index.js

@@ -21,6 +21,7 @@ export default (Manager) => {
     initTestFormValidation();
     initTestFormContact();
     initTestFormManual();
+    initTestFormGroups();
 
     // Resolve after initialization
     return resolve();
@@ -192,3 +193,55 @@ function initTestFormManual() {
     formManager.ready();
   }, 2000);
 }
+
+// Test 5: Input Groups
+function initTestFormGroups() {
+  const formManager = new FormManager('#test-form-groups');
+  const $status = document.getElementById('groups-status');
+  const $filter = document.getElementById('groups-filter');
+  const $output = document.getElementById('groups-output');
+  const $filterBtns = document.querySelectorAll('.groups-filter-btn');
+
+  formManager.on('statechange', ({ state }) => {
+    $status.textContent = `Status: ${state}`;
+  });
+
+  // Filter button click handler
+  $filterBtns.forEach(($btn) => {
+    $btn.addEventListener('click', () => {
+      // Update active state
+      $filterBtns.forEach(($b) => $b.classList.remove('active'));
+      $btn.classList.add('active');
+
+      // Set the input group filter (parse data-group as JSON array or single string)
+      const groupAttr = $btn.dataset.group;
+      let group = null;
+      if (groupAttr) {
+        try {
+          group = JSON.parse(groupAttr);
+        } catch {
+          group = groupAttr; // Single string value
+        }
+      }
+      formManager.setInputGroup(group);
+
+      // Update filter display
+      const currentGroup = formManager.getInputGroup();
+      $filter.textContent = currentGroup
+        ? `Filter: ${JSON.stringify(currentGroup)}`
+        : 'Filter: none (all fields)';
+
+      console.log('[Test 5] Input group set to:', currentGroup);
+    });
+  });
+
+  formManager.on('submit', async ({ data }) => {
+    console.log('[Test 5] getData() result:', data);
+
+    // Show the filtered data
+    $output.textContent = JSON.stringify(data, null, 2);
+
+    // Don't actually submit - just show the data
+    formManager.showSuccess('getData() returned ' + Object.keys(data).length + ' top-level keys');
+  });
+}

package/dist/defaults/dist/_includes/core/foot.html

@@ -70,7 +70,7 @@
             <span class="text-muted">
               •
             </span>
-            <small class="ms-2 text-muted"><strong class="text-body">10k+</strong> happy subscribers</small>
+            <small class="ms-2 text-muted"><strong class="text-body">Join 10k+</strong> happy subscribers!</small>
           </div>
 
           <!-- Trust indicators -->

package/dist/defaults/dist/_layouts/themes/classy/frontend/pages/contact.html

@@ -203,9 +203,9 @@ faqs:
                 </div>
               </div>
 
-              <!-- Honeypot field -->
+              <!-- Honeypot field (bot detection) -->
               <div class="form-group mb-3" style="display: none;" aria-hidden="true">
-                <input type="text" class="form-control" id="url_check" name="url_check" placeholder="URL Check" tabindex="-1" autocomplete="off">
+                <input type="text" class="form-control" name="honey" tabindex="-1" autocomplete="off">
               </div>
 
               <div class="mb-4">
@@ -238,11 +238,6 @@ faqs:
                 <div class="invalid-feedback"></div>
               </div>
 
-              <!-- Honeypot field -->
-              <div class="form-group mb-3 position-absolute" style="opacity: 0; height: 0;" aria-hidden="true">
-                <input type="text" class="form-control" id="slap_honey" name="slap_honey" placeholder="Website" tabindex="-1" autocomplete="off">
-              </div>
-
               <div class="mb-4">
                 <label for="message" class="form-label fw-semibold">Message <span class="text-danger">*</span></label>
                 <textarea class="form-control form-control-lg" id="message" name="message" rows="3"

package/dist/defaults/dist/_layouts/themes/classy/frontend/pages/index.html

@@ -36,7 +36,7 @@ hero:
     href: "/dashboard"
     class: "btn-light"
   secondary_button:
-    text: "Explore Solutions"
+    text: "See Pricing"
     icon: "book-open"
     href: "/pricing"
     class: "btn-outline-light"

package/dist/defaults/dist/pages/test/libraries/form-manager.html

@@ -77,6 +77,12 @@ sitemap: false
                   <input type="checkbox" class="form-check-input" id="main-subscribe" name="settings.subscribe" disabled>
                   <label class="form-check-label" for="main-subscribe">settings.subscribe (single checkbox)</label>
                 </div>
+                <!-- Honeypot field for bot detection (fill to trigger rejection) -->
+                <div class="mb-3">
+                  <label for="main-honey" class="form-label">honey <span class="badge bg-warning text-dark">Honeypot</span></label>
+                  <input type="text" class="form-control" id="main-honey" name="honey" data-honey placeholder="Fill to trigger bot rejection" autocomplete="off" tabindex="-1" disabled>
+                  <small class="text-muted">Hidden in production; fill here to test rejection</small>
+                </div>
               </div>
             </div>
             <div class="d-flex gap-2">
@@ -177,5 +183,78 @@ sitemap: false
       </div>
     </div>
 
+    <!-- Test 5: Input Groups -->
+    <div class="col-lg-8">
+      <div class="card">
+        <div class="card-header">
+          <h5 class="mb-0">Test 5: Input Groups</h5>
+          <small class="text-muted">setInputGroup() filters getData() - fields without data-input-group are global</small>
+        </div>
+        <div class="card-body">
+          <form id="test-form-groups">
+            <div class="row">
+              <!-- Global settings (no data-input-group = always included) -->
+              <div class="col-md-4">
+                <h6 class="text-muted mb-3">Global Settings <span class="badge bg-secondary">Always included</span></h6>
+                <div class="mb-3">
+                  <label for="groups-name" class="form-label">settings.name</label>
+                  <input type="text" class="form-control" id="groups-name" name="settings.name" value="My Project" disabled>
+                </div>
+                <div class="mb-3">
+                  <label for="groups-theme" class="form-label">settings.theme</label>
+                  <select class="form-select" id="groups-theme" name="settings.theme" disabled>
+                    <option value="light">Light</option>
+                    <option value="dark" selected>Dark</option>
+                  </select>
+                </div>
+              </div>
+
+              <!-- Group A fields -->
+              <div class="col-md-4">
+                <h6 class="text-primary mb-3">Group A <span class="badge bg-primary">data-input-group="a"</span></h6>
+                <div class="mb-3">
+                  <label for="groups-a-url" class="form-label">options.url</label>
+                  <input type="url" class="form-control" id="groups-a-url" name="options.url" data-input-group="a" value="https://example.com" disabled>
+                </div>
+                <div class="mb-3">
+                  <label for="groups-a-title" class="form-label">options.title</label>
+                  <input type="text" class="form-control" id="groups-a-title" name="options.title" data-input-group="a" value="My Link" disabled>
+                </div>
+              </div>
+
+              <!-- Group B fields -->
+              <div class="col-md-4">
+                <h6 class="text-success mb-3">Group B <span class="badge bg-success">data-input-group="b"</span></h6>
+                <div class="mb-3">
+                  <label for="groups-b-ssid" class="form-label">options.ssid</label>
+                  <input type="text" class="form-control" id="groups-b-ssid" name="options.ssid" data-input-group="b" value="MyWiFi" disabled>
+                </div>
+                <div class="mb-3">
+                  <label for="groups-b-password" class="form-label">options.password</label>
+                  <input type="text" class="form-control" id="groups-b-password" name="options.password" data-input-group="b" value="secret123" disabled>
+                </div>
+              </div>
+            </div>
+
+            <div class="d-flex gap-2 flex-wrap align-items-center">
+              <span class="text-muted me-2">Select group:</span>
+              <button type="button" class="btn btn-outline-secondary btn-sm groups-filter-btn active" data-group="">All (no filter)</button>
+              <button type="button" class="btn btn-outline-primary btn-sm groups-filter-btn" data-group="a">Group A</button>
+              <button type="button" class="btn btn-outline-success btn-sm groups-filter-btn" data-group="b">Group B</button>
+              <button type="button" class="btn btn-outline-info btn-sm groups-filter-btn" data-group='["a", "b"]'>Both (a, b)</button>
+              <button type="submit" class="btn btn-primary btn-sm ms-auto" disabled>Get Data</button>
+            </div>
+          </form>
+          <div class="mt-3 d-flex gap-3">
+            <small class="text-muted" id="groups-status">Status: ready</small>
+            <small class="text-muted" id="groups-filter">Filter: none (all fields)</small>
+          </div>
+          <div class="mt-3">
+            <pre id="groups-output" class="bg-body-secondary p-2 rounded small" style="max-height: 200px; overflow: auto;">Click "Get Data" to see filtered results...</pre>
+          </div>
+        </div>
+      </div>
+    </div>
+
   </div>
 </div>

package/dist/defaults/dist/pages/test/translation/index.md

@@ -47,7 +47,7 @@ By vising {{ brand }}, you agree to comply.
 ## This is an input
 <div class="form-group">
   <label for="test-email" class="visually-hidden">Your email</label>
-  <input type="email" id="test-email" name="slap_honey" class="form-control" placeholder="Your Email">
+  <input type="email" id="test-email" name="email" class="form-control" placeholder="Your Email">
 </div>
 
 ## This button has a title