{"version":3,"file":"Dropdown-QPzYTVhV.js","sources":["../../app/Resources/js/modules/Dropdown.ts"],"sourcesContent":["import {\n  computePosition,\n  flip,\n  offset,\n  Placement,\n  shift,\n} from \"@floating-ui/dom\";\n\nconst Dropdown = (): void => {\n  const dropdownButtons: NodeListOf<HTMLButtonElement> =\n    document.querySelectorAll(\"[data-dropdown='button']\");\n\n  for (let i = 0; i < dropdownButtons.length; i++) {\n    const button = dropdownButtons[i];\n\n    if (button.dataset.dropdownTarget) {\n      const menu: HTMLElement | null = document.getElementById(\n        button.dataset?.dropdownTarget\n      );\n\n      if (menu) {\n        // place the menu at then end of the body to prevent any overflow cuts\n        document.body.appendChild(menu);\n\n        const update = () => {\n          const offsetX = menu.dataset.dropdownOffsetX\n            ? parseInt(menu.dataset.dropdownOffsetX)\n            : 0;\n          const offsetY = menu.dataset.dropdownOffsetY\n            ? parseInt(menu.dataset.dropdownOffsetY)\n            : 0;\n          computePosition(button, menu, {\n            placement: menu.dataset.dropdownPlacement as Placement,\n            middleware: [\n              offset({ mainAxis: offsetY, crossAxis: offsetX }),\n              flip(),\n              shift(),\n            ],\n          }).then(({ x, y }) => {\n            Object.assign(menu.style, {\n              left: `${x}px`,\n              top: `${y}px`,\n            });\n          });\n        };\n\n        const showMenu = () => {\n          menu.setAttribute(\"data-show\", \"\");\n          button.setAttribute(\"aria-expanded\", \"true\");\n          update();\n        };\n\n        const hideMenu = () => {\n          menu.removeAttribute(\"data-show\");\n          button.setAttribute(\"aria-expanded\", \"false\");\n        };\n\n        const dropdownToggle = () => {\n          const isExpanded = menu.hasAttribute(\"data-show\");\n\n          if (isExpanded) {\n            hideMenu();\n          } else {\n            showMenu();\n          }\n        };\n\n        // Toggle dropdown menu on button click event\n        button.addEventListener(\"click\", dropdownToggle);\n\n        // Toggle off when clicking outside of dropdown\n        document.addEventListener(\"click\", function (event) {\n          const isExpanded = menu.hasAttribute(\"data-show\");\n          const isClickOutside =\n            !menu.contains(event.target as Node) &&\n            !button.contains(event.target as Node);\n\n          if (isExpanded && isClickOutside) {\n            dropdownToggle();\n          }\n        });\n      }\n    }\n  }\n};\n\nexport default Dropdown;\n"],"names":["Dropdown","dropdownButtons","i","button","menu","_a","update","offsetX","offsetY","computePosition","offset","flip","shift","x","y","showMenu","hideMenu","dropdownToggle","event","isExpanded","isClickOutside"],"mappings":"+DAQA,MAAMA,EAAW,IAAY,OACrB,MAAAC,EACJ,SAAS,iBAAiB,0BAA0B,EAEtD,QAASC,EAAI,EAAGA,EAAID,EAAgB,OAAQC,IAAK,CACzC,MAAAC,EAASF,EAAgBC,CAAC,EAE5B,GAAAC,EAAO,QAAQ,eAAgB,CACjC,MAAMC,EAA2B,SAAS,gBACxCC,EAAAF,EAAO,UAAP,YAAAE,EAAgB,cAAA,EAGlB,GAAID,EAAM,CAEC,SAAA,KAAK,YAAYA,CAAI,EAE9B,MAAME,EAAS,IAAM,CACb,MAAAC,EAAUH,EAAK,QAAQ,gBACzB,SAASA,EAAK,QAAQ,eAAe,EACrC,EACEI,EAAUJ,EAAK,QAAQ,gBACzB,SAASA,EAAK,QAAQ,eAAe,EACrC,EACJK,EAAgBN,EAAQC,EAAM,CAC5B,UAAWA,EAAK,QAAQ,kBACxB,WAAY,CACVM,EAAO,CAAE,SAAUF,EAAS,UAAWD,EAAS,EAChDI,EAAK,EACLC,EAAM,CACR,CACD,CAAA,EAAE,KAAK,CAAC,CAAE,EAAAC,EAAG,EAAAC,KAAQ,CACb,OAAA,OAAOV,EAAK,MAAO,CACxB,KAAM,GAAGS,CAAC,KACV,IAAK,GAAGC,CAAC,IAAA,CACV,CAAA,CACF,CAAA,EAGGC,EAAW,IAAM,CAChBX,EAAA,aAAa,YAAa,EAAE,EAC1BD,EAAA,aAAa,gBAAiB,MAAM,EACpCG,GAAA,EAGHU,EAAW,IAAM,CACrBZ,EAAK,gBAAgB,WAAW,EACzBD,EAAA,aAAa,gBAAiB,OAAO,CAAA,EAGxCc,EAAiB,IAAM,CACRb,EAAK,aAAa,WAAW,EAGrCY,IAEAD,GACX,EAIKZ,EAAA,iBAAiB,QAASc,CAAc,EAGtC,SAAA,iBAAiB,QAAS,SAAUC,EAAO,CAC5C,MAAAC,EAAaf,EAAK,aAAa,WAAW,EAC1CgB,EACJ,CAAChB,EAAK,SAASc,EAAM,MAAc,GACnC,CAACf,EAAO,SAASe,EAAM,MAAc,EAEnCC,GAAcC,GACDH,GACjB,CACD,CACH,CACF,CACF,CACF"}