{"version":3,"file":"size-guide-DP_Aiylv.js","sources":["../../../app/javascript/entrypoints/js/product/size-guide.js"],"sourcesContent":["import gsap from \"gsap\";\n\nexport default class SizeGuide {\n  constructor() {\n    this.isOpen = false;\n    this.activeTab = 1;\n    this.buttons = Array.from(document.querySelectorAll(\"[data-js='product-size-guide']\"));\n    this.closeButton = document.querySelector(\"[data-js='size-guide__close']\");\n    this.container = document.querySelector(\n      \"[data-js='size-guide__container']\",\n    );\n    this.containerElement = document.querySelector(\n      \"[data-js='size-guide__element']\",\n    );\n    this.tab1 = document.querySelector(\"[data-js='size-guide__tab1']\");\n    this.tab1Element = document.querySelector(\n      \"[data-js='size-guide__tab1-element']\",\n    );\n    this.tab2 = document.querySelector(\"[data-js='size-guide__tab2']\");\n    this.tab2Element = document.querySelector(\n      \"[data-js='size-guide__tab2-element']\",\n    );\n    this.tab3 = document.querySelector(\"[data-js='size-guide__tab3']\");\n    this.tab3Element = document.querySelector(\n      \"[data-js='size-guide__tab3-element']\",\n    );\n  }\n\n  init() {\n    this.clickOutside();\n\n    this.buttons.forEach((button) => {\n      button.addEventListener(\"click\", () => {\n        this.isOpen ? this.close() : this.open();\n      });\n    });\n\n    this.closeButton.addEventListener(\"click\", () => {\n      this.close();\n    });\n\n    [this.tab1, this.tab2, this.tab3].forEach((tab, index) => {\n      tab.addEventListener(\"click\", () => {\n        this.changeTab(index + 1);\n      });\n    });\n  }\n\n  open() {\n    this.isOpen = true;\n    document.body.style.overflow = \"hidden\";\n    this.container.classList.remove(\"hidden\");\n\n    const tl = gsap.timeline({\n      defaults: {\n        duration: 0.2,\n        ease: \"power2.inOut\",\n      },\n    });\n\n    gsap.set([this.container], {\n      autoAlpha: 0,\n    });\n\n    gsap.set(this.containerElement, {\n      xPercent: 100,\n    });\n\n    tl.to(this.container, {\n      autoAlpha: 1,\n      display: \"flex\",\n    });\n\n    tl.to(this.containerElement, {\n      xPercent: 0,\n    });\n  }\n\n  close() {\n    this.isOpen = false;\n\n    const tl = gsap.timeline({\n      defaults: {\n        duration: 0.2,\n        ease: \"power2.inOut\",\n      },\n    });\n\n    tl.to(this.containerElement, {\n      xPercent: 100,\n    });\n\n    tl.to(this.container, {\n      autoAlpha: 0,\n      onComplete: () => {\n        this.container.classList.add(\"hidden\");\n        document.body.style.overflow = \"auto\";\n        this.resetTabs();\n      },\n    });\n  }\n\n  clickOutside() {\n    document.addEventListener(\"click\", (event) => {\n      if (\n        this.isOpen &&\n        !this.containerElement.contains(event.target) &&\n        !this.buttons.includes(event.target)\n      ) {\n        this.close();\n      }\n    });\n  }\n\n  changeTab(index) {\n    this.activeTab = index;\n    this.tab1.classList.remove(\"active\");\n    this.tab2.classList.remove(\"active\");\n    this.tab3.classList.remove(\"active\");\n\n    this.tab1Element.classList.add(\"hidden\");\n    this.tab2Element.classList.add(\"hidden\");\n    this.tab3Element.classList.add(\"hidden\");\n\n    if (index === 1) {\n      this.tab1.classList.add(\"active\");\n      this.tab1Element.classList.remove(\"hidden\");\n    } else if (index === 2) {\n      this.tab2.classList.add(\"active\");\n      this.tab2Element.classList.remove(\"hidden\");\n    } else if (index === 3) {\n      this.tab3.classList.add(\"active\");\n      this.tab3Element.classList.remove(\"hidden\");\n    }\n  }\n\n  resetTabs() {\n    this.activeTab = 1;\n    this.tab1.classList.add(\"active\");\n    this.tab2.classList.remove(\"active\");\n    this.tab3.classList.remove(\"active\");\n\n    this.tab1Element.classList.remove(\"hidden\");\n    this.tab2Element.classList.add(\"hidden\");\n    this.tab3Element.classList.add(\"hidden\");\n  }\n}\n"],"names":["SizeGuide","button","tab","index","tl","gsap","event"],"mappings":"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"}