{
  "version": 3,
  "sources": ["/cdn/shop/t/89/assets/variant-selects.js?cachebust=1786936058193"],
  "sourcesContent": ["if (!customElements.get('variant-selects')) {\n  customElements.define(\n    'variant-selects',\n    class VariantSelects extends HTMLElement {\n      constructor() {\n        super();\n        this._autoSelecting = false;\n        this._mutationObserver = null;\n        this._debounceTimer = null;\n      }\n\n      get selectedOptionValues() {\n        return Array.from(this.querySelectorAll('select option[selected], fieldset input:checked')).map(\n          ({ dataset }) => dataset.optionValueId\n        );\n      }\n\n      getInputForEventTarget(target) {\n        return target.tagName === 'SELECT' ? target.selectedOptions[0] : target;\n      }\n\n      connectedCallback() {\n        this.addEventListener('change', (event) => {\n          const target = this.getInputForEventTarget(event.target);\n\n          this.updateSelectedSwatchValue(event);\n\n          FoxTheme.pubsub.publish(FoxTheme.pubsub.PUB_SUB_EVENTS.optionValueSelectionChange, {\n            data: {\n              event,\n              target,\n              selectedOptionValues: this.selectedOptionValues,\n            },\n          });\n        });\n\n        const trySubscribe = () => {\n          try {\n            const evs = FoxTheme?.pubsub?.PUB_SUB_EVENTS || {};\n            const possibleEvents = ['variantChange', 'variantUpdated', 'variantUpdatedEvent', 'variant:update'];\n\n            possibleEvents.forEach((evName) => {\n              if (evs[evName]) {\n                FoxTheme.pubsub.subscribe(evs[evName], () => {\n                  console.debug(`[variant-selects] received pubsub event ${evs[evName]}, calling autoSelectAvailableOptions`);\n                  this.debouncedAutoSelect();\n                });\n              }\n            });\n\n            if (evs.variantChange) {\n              FoxTheme.pubsub.subscribe(evs.variantChange, () => this.debouncedAutoSelect());\n            }\n            if (evs.variantUpdated) {\n              FoxTheme.pubsub.subscribe(evs.variantUpdated, () => this.debouncedAutoSelect());\n            }\n          } catch (err) {\n            console.warn('[variant-selects] cannot subscribe to FoxTheme pubsub events', err);\n          }\n        };\n\n        trySubscribe();\n\n        this._mutationObserver = new MutationObserver((mutations) => {\n          if (this._debounceTimer) clearTimeout(this._debounceTimer);\n          this._debounceTimer = setTimeout(() => {\n            console.debug('[variant-selects] mutation observed, calling autoSelectAvailableOptions');\n            this.debouncedAutoSelect();\n          }, 60);\n        });\n\n        this._mutationObserver.observe(this, {\n          childList: true,\n          subtree: true,\n          attributes: true,\n          attributeFilter: ['class', 'selected', 'disabled', 'data-option-swatch-value', 'data-option-value-id'],\n        });\n\n        window.requestAnimationFrame(() => this.debouncedAutoSelect());\n      }\n\n      disconnectedCallback() {\n        if (this._mutationObserver) this._mutationObserver.disconnect();\n        if (this._debounceTimer) clearTimeout(this._debounceTimer);\n      }\n\n      updateSelectedSwatchValue({ target }) {\n        const { value, tagName } = target;\n\n        if (tagName === 'SELECT' && target.selectedOptions.length) {\n          Array.from(target.options)\n            .find((option) => option.getAttribute('selected'))\n            ?.removeAttribute('selected');\n\n          target.selectedOptions[0].setAttribute('selected', 'selected');\n\n          const swatchValue = target.selectedOptions[0].dataset.optionSwatchValue;\n          const selectedDropdownSwatchValue = target\n            .closest('.product-form__input')\n            .querySelector('[data-selected-value] > .swatch');\n\n          if (!selectedDropdownSwatchValue) return;\n\n          if (swatchValue) {\n            selectedDropdownSwatchValue.style.setProperty('--swatch--background', swatchValue);\n            selectedDropdownSwatchValue.classList.remove('swatch--unavailable');\n          } else {\n            selectedDropdownSwatchValue.style.setProperty('--swatch--background', 'unset');\n            selectedDropdownSwatchValue.classList.add('swatch--unavailable');\n          }\n\n          selectedDropdownSwatchValue.style.setProperty(\n            '--swatch-focal-point',\n            target.selectedOptions[0].dataset.optionSwatchFocalPoint || 'unset'\n          );\n        } else if (tagName === 'INPUT' && target.type === 'radio') {\n          const selectedSwatchValue = target.closest(`.product-form__input`).querySelector('[data-selected-value]');\n          if (selectedSwatchValue) selectedSwatchValue.innerHTML = value;\n        }\n      }\n\n      debouncedAutoSelect() {\n        if (this._debounceTimer) clearTimeout(this._debounceTimer);\n        this._debounceTimer = setTimeout(() => {\n          this.autoSelectAvailableOptions();\n        }, 80); // 80ms th\u01B0\u1EDDng \u0111\u1EE7 cho theme c\u1EADp nh\u1EADt xong\n      }\n\n      autoSelectAvailableOptions() {\n        if (this._autoSelecting) {\n          console.debug('[variant-selects] already auto-selecting, skip');\n          return;\n        }\n        this._autoSelecting = true;\n        try {\n          const groups = this.querySelectorAll('.product-form__input');\n\n          groups.forEach((group) => {\n            // RADIO SWATCHES / BUTTONS\n            // Unavailable values are now hidden from the DOM entirely (rather than\n            // rendered-but-disabled), so any radio still present is available by\n            // definition. The real signal that the previous selection went stale is\n            // that nothing in the group carries the server-rendered `checked`\n            // attribute anymore -- i.e. the value the URL/form still thinks is\n            // selected was dropped from this render because it's no longer valid\n            // for the current combination.\n            const radios = Array.from(group.querySelectorAll('input[type=\"radio\"][data-option-value-id]'));\n            if (radios.length) {\n              const hasServerChecked = radios.some((r) => r.hasAttribute('checked'));\n              if (!hasServerChecked) {\n                const firstAvailable = radios[0];\n                if (firstAvailable) {\n                  console.debug('[variant-selects] selecting radio', firstAvailable.dataset.optionValueId);\n                  firstAvailable.checked = true;\n                  firstAvailable.dispatchEvent(new Event('change', { bubbles: true }));\n                }\n              }\n            }\n\n            const select = group.querySelector('select');\n            if (select && select.options.length) {\n              // Same reasoning as radios above: with unavailable option values\n              // hidden rather than disabled, a `<select>` whose server-selected\n              // value was dropped from the list silently falls back to\n              // selectedIndex 0 without firing a `change` event, leaving the\n              // site's tracked \"current variant\" stale (and stuck showing\n              // \"Unavailable\"). Detect that by checking whether any option still\n              // carries the server-rendered `selected` attribute; if not, select\n              // the first available option ourselves and fire `change` so the\n              // page re-fetches against the real, valid selection.\n              //\n              // NOTE: we deliberately do NOT compare select.value against the\n              // target value before deciding whether to dispatch. When the\n              // browser silently defaults an empty select to its first option,\n              // select.value already equals options[0].value -- an equality\n              // check here would (and did) skip the dispatch entirely, leaving\n              // the rest of the page never told the selection settled. The\n              // `selected` attribute (not `.value`) is the real signal that a\n              // correction is still needed.\n              const hasServerSelected = Array.from(select.options).some((o) => o.hasAttribute('selected'));\n              if (!hasServerSelected) {\n                const firstAvailable = select.options[0];\n                if (firstAvailable) {\n                  console.debug('[variant-selects] selecting select option', firstAvailable.value);\n                  select.value = firstAvailable.value;\n                  Array.from(select.options).forEach((o) => o.removeAttribute && o.removeAttribute('selected'));\n                  firstAvailable.setAttribute && firstAvailable.setAttribute('selected', 'selected');\n                  select.dispatchEvent(new InputEvent('change', { bubbles: true }));\n                }\n              }\n            }\n          });\n        } catch (err) {\n          console.error('[variant-selects] autoSelectAvailableOptions error', err);\n        } finally {\n          setTimeout(() => {\n            this._autoSelecting = false;\n          }, 50);\n        }\n      }\n    }\n  );\n}\n"],
  "mappings": "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",
  "names": []
}