npm - @salla.sa/twilight-components - Versions diffs - 2.14.405 → 2.14.406 - Mend

@@ -206,8 +206,12 @@ const SallaProductOptions = /*@__PURE__*/ proxyCustomElement(class SallaProductO
         const requiredElements = this.host.querySelectorAll('[required]');
         let pass = true;
         for (let i = 0; i < requiredElements.length; i++) {
+            const el = requiredElements[i];
+            if (el.disabled || el.closest('.hidden')) {
+                continue;
+            }
             //if there is only one invalid option, return false
-            if ('reportValidity' in requiredElements[i] && !requiredElements[i].reportValidity()) {
+            if ('reportValidity' in el && !el.reportValidity()) {
                 pass = false;
             }
         }
@@ -330,6 +334,13 @@ const SallaProductOptions = /*@__PURE__*/ proxyCustomElement(class SallaProductO
             }
             return opt;
         });
+        this.pruneInvisibleConditionalSelections();
+        this.setSelectedSkus();
+        requestAnimationFrame(() => {
+            this.optionsData
+                ?.filter(o => o.type === DisplayType.MULTIPLE_OPTIONS && o.required)
+                .forEach(o => this.handleRequiredMultipleOptions(o));
+        });
         // Emit the event only if fireChangeEvent is true
         if (fireChangeEvent) {
             this.changed.emit(data);
@@ -349,9 +360,60 @@ const SallaProductOptions = /*@__PURE__*/ proxyCustomElement(class SallaProductO
             return;
         }
         const optionContainer = this.host.querySelector(`[data-option-id="${option.id}"]`);
+        if (!optionContainer) {
+            return;
+        }
         const hasChecked = optionContainer.querySelectorAll('input:checked').length;
         optionContainer.querySelectorAll('input').forEach(input => input.toggleAttribute('required', !hasChecked));
     }
+    pruneInvisibleConditionalSelections() {
+        const passes = Math.max(1, this.optionsData.length);
+        for (let p = 0; p < passes; p++) {
+            let clearedSomething = false;
+            for (const opt of this.optionsData) {
+                const vc = opt.visibility_condition;
+                if (!vc) {
+                    continue;
+                }
+                const selectedAtParent = this.selectedOptions
+                    .filter(s => s.option_id === vc.option)
+                    .map(s => String(s.id));
+                const targetSelected = selectedAtParent.includes(String(vc.value));
+                const shouldShow = vc.operator === '=' ? targetSelected : !targetSelected;
+                if (shouldShow) {
+                    continue;
+                }
+                if (this.clearStaleOption(opt.id)) {
+                    clearedSomething = true;
+                }
+            }
+            if (!clearedSomething) {
+                break;
+            }
+        }
+    }
+    clearStaleOption(optionId) {
+        const opt = this.optionsData.find(o => o.id === optionId);
+        if (!opt) {
+            return false;
+        }
+        const beforeLen = this.selectedOptions.length;
+        this.selectedOptions = this.selectedOptions.filter(s => s.option_id !== optionId);
+        const removedFromSelected = this.selectedOptions.length !== beforeLen;
+        const hasValue = opt.value != null && String(opt.value).length > 0;
+        const hadSelectedDetail = opt.details?.some(d => d.is_selected) ?? false;
+        if (!removedFromSelected && !hasValue && !hadSelectedDetail) {
+            return false;
+        }
+        this.optionsData = this.optionsData.map(o => o.id !== optionId
+            ? o
+            : {
+                ...o,
+                value: undefined,
+                details: o.details?.map(d => ({ ...d, is_selected: false })) ?? o.details,
+            });
+        return true;
+    }
     getLatLng(value, type) {
         return value
             ? value.split(',')[type === 'lat' ? 0 : 1]

@@ -16,15 +16,27 @@ const SallaConditionalFields = /*@__PURE__*/ proxyCustomElement(class SallaCondi
         });
     }
     disableInputs(field) {
-        field.querySelectorAll('[name]').forEach((input) => {
+        field.querySelectorAll('[name]').forEach((node) => {
+            const input = node;
             input.setAttribute('disabled', '');
             input.removeAttribute('required');
-            if (input?.tagName?.toLowerCase() === 'select') {
+            if (input instanceof HTMLSelectElement) {
                 input.value = '';
+                return;
+            }
+            if (input instanceof HTMLTextAreaElement) {
+                input.value = '';
+                return;
             }
-            if (['checkbox'].includes(input.getAttribute('type')) && input.hasOwnProperty('checked')) {
-                // @ts-ignore
-                input.checked = false;
+            if (input instanceof HTMLInputElement) {
+                const t = (input.type || 'text').toLowerCase();
+                if (t === 'checkbox' || t === 'radio') {
+                    input.checked = false;
+                    return;
+                }
+                if (['text', 'search', 'number', 'tel', 'url', 'email'].includes(t)) {
+                    input.value = '';
+                }
             }
         });
     }
@@ -118,7 +130,7 @@ const SallaConditionalFields = /*@__PURE__*/ proxyCustomElement(class SallaCondi
         });
     }
     render() {
-        return (h(Host, { key: 'eb080f6f4321fbdfdb8a1aca7a8c7d877de54cca' }, h("slot", { key: 'b898259ac1a7fc5a89844f9228bd0f4a3f86d867' })));
+        return (h(Host, { key: 'a7314ccb4aaccc58db6c24db7a0f57e53087fdac' }, h("slot", { key: '0f192d2fd0670c8ba0e3d94dc84fed81123373b2' })));
     }
     get host() { return this; }
 }, [4, "salla-conditional-fields", undefined, [[0, "change", "changeHandler"], [0, "input", "changeHandler"]]]);

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { d as getDefaultExportFromCjs } from './index-CtedSqt5.js';
+import { d as getDefaultExportFromCjs } from './index-BJ31ZN0M.js';
 function _mergeNamespaces(n, m) {
     m.forEach(function (e) {

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { d as getDefaultExportFromCjs } from './index-CtedSqt5.js';
+import { d as getDefaultExportFromCjs } from './index-BJ31ZN0M.js';
 function _mergeNamespaces(n, m) {
   m.forEach(function (e) {

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { d as getDefaultExportFromCjs } from './index-CtedSqt5.js';
+import { d as getDefaultExportFromCjs } from './index-BJ31ZN0M.js';
 function _mergeNamespaces(n, m) {
     m.forEach(function (e) {

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { d as getDefaultExportFromCjs } from './index-CtedSqt5.js';
+import { d as getDefaultExportFromCjs } from './index-BJ31ZN0M.js';
 function _mergeNamespaces(n, m) {
     m.forEach(function (e) {

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { h } from './index-CtedSqt5.js';
+import { h } from './index-BJ31ZN0M.js';
 function nearestLowerMultiple(number, multipleOf = window.matchMedia('(min-width: 768px)').matches ? 3 : 2) {
     return number < multipleOf ? number : number - (number % multipleOf);

@salla.sa/twilight-components 2.14.405 → 2.14.406