well-petal 0.0.60 → 0.0.62

package/dist/petal.js

@@ -26,7 +26,7 @@ return /******/ (() => { // webpackBootstrap
   \********************************************************************/
 /***/ ((module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/noSourceMaps.js */ \"./node_modules/css-loader/dist/runtime/noSourceMaps.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);\n// Imports\n\n\nvar ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `/* ===========================\n   Dropdown Core Styles\n   =========================== */\n\n/* Default CSS variable values */\n[petal-el=\"dropdown\"] {\n  --dropdown-open-duration: 0.5s;\n  --dropdown-close-duration: 0.3s;\n}\n\n/* ===========================\n   Dropdown Animations\n   =========================== */\n\n/* Dropdown Menu: Initial (Closed) State - Hidden and prevent interaction */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"] {\n  visibility: hidden;\n  pointer-events: none;\n}\n\n/* Dropdown Menu: Open State - Visible and allow interaction */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"].w--open {\n  visibility: visible;\n  pointer-events: auto;\n}\n\n/* Dropdown Drawer: Initial (Closed) State - Common Styles */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-drawer\"] {\n  visibility: hidden;\n  opacity: 0;\n  transition:\n    transform var(--dropdown-close-duration, 0.3s) ease,\n    opacity var(--dropdown-close-duration, 0.3s) ease,\n    visibility 0s var(--dropdown-close-duration, 0.3s);\n}\n\n/* Dropdown Drawer: Open State - Common Styles */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"].w--open [petal-el=\"dropdown-drawer\"] {\n  visibility: visible;\n  opacity: 1;\n  transition:\n    transform var(--dropdown-open-duration, 0.5s) ease,\n    opacity var(--dropdown-open-duration, 0.5s) ease,\n    visibility 0s;\n}\n\n/* Animation: Slide Down (Default) */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-down\"] [petal-el=\"dropdown-drawer\"] {\n  transform: translateY(-10px);\n  transform-origin: top;\n}\n\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-down\"].w--open [petal-el=\"dropdown-drawer\"] {\n  transform: translateY(0);\n}\n\n/* Animation: Slide Up */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-up\"] [petal-el=\"dropdown-drawer\"] {\n  transform: translateY(10px);\n  transform-origin: bottom;\n}\n\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-up\"].w--open [petal-el=\"dropdown-drawer\"] {\n  transform: translateY(0);\n}\n\n/* Animation: Slide Left */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-left\"] [petal-el=\"dropdown-drawer\"] {\n  transform: translateX(10px);\n}\n\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-left\"].w--open [petal-el=\"dropdown-drawer\"] {\n  transform: translateX(0);\n}\n\n/* Animation: Slide Right */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-right\"] [petal-el=\"dropdown-drawer\"] {\n  transform: translateX(-10px);\n}\n\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-right\"].w--open [petal-el=\"dropdown-drawer\"] {\n  transform: translateX(0);\n}\n\n/* ===========================\n   Tablet Animations (max-width: 991px)\n   =========================== */\n\n@media screen and (max-width: 991px) {\n  /* Animation: Slide Down */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-down\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(-10px);\n    transform-origin: top;\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-down\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(0);\n  }\n\n  /* Animation: Slide Up */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-up\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(10px);\n    transform-origin: bottom;\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-up\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(0);\n  }\n\n  /* Animation: Slide Left */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-left\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(10px);\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-left\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(0);\n  }\n\n  /* Animation: Slide Right */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-right\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(-10px);\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-right\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(0);\n  }\n}\n\n/* ===========================\n   Mobile Landscape Animations (max-width: 767px)\n   =========================== */\n\n@media screen and (max-width: 767px) {\n  /* Animation: Slide Down */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-down\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(-10px);\n    transform-origin: top;\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-down\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(0);\n  }\n\n  /* Animation: Slide Up */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-up\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(10px);\n    transform-origin: bottom;\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-up\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(0);\n  }\n\n  /* Animation: Slide Left */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-left\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(10px);\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-left\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(0);\n  }\n\n  /* Animation: Slide Right */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-right\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(-10px);\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-right\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(0);\n  }\n}\n\n/* ===========================\n   Mobile Animations (max-width: 479px)\n   =========================== */\n\n@media screen and (max-width: 479px) {\n  /* Animation: Slide Down */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-down\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(-10px);\n    transform-origin: top;\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-down\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(0);\n  }\n\n  /* Animation: Slide Up */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-up\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(10px);\n    transform-origin: bottom;\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-up\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(0);\n  }\n\n  /* Animation: Slide Left */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-left\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(10px);\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-left\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(0);\n  }\n\n  /* Animation: Slide Right */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-right\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(-10px);\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-right\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(0);\n  }\n}\n\n/* ===========================\n   Dropdown Backdrop\n   =========================== */\n\n[petal-el=\"dropdown-backdrop\"] {\n  opacity: 0;\n  transition: opacity var(--dropdown-close-duration, 0.3s) ease;\n}\n\nbody:has([petal-el=\"dropdown\"] > [petal-el=\"dropdown-toggle\"][aria-expanded=\"true\"]) [petal-el=\"dropdown-backdrop\"] {\n  opacity: 1;\n  transition: opacity var(--dropdown-open-duration, 0.5s) ease;\n}\n\n/* ===========================\n   Desktop Styles (Default - applies to all screen sizes first)\n   =========================== */\n\n/* All dropdowns get standard desktop behavior by default */\n[petal-el=\"dropdown\"] {\n  width: auto;\n}\n\n[petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"] {\n  position: absolute;\n  z-index: 1000;\n}\n\n[petal-el=\"dropdown-scroll\"] {\n  overflow-x: hidden;\n  overflow-y: auto !important;\n}\n\n/* ===========================\n   Mobile Styles (Override on small containers)\n   =========================== */\n\n@media screen and (max-width: 991px) {\n  /* Hide dropdown toggle permanently on mobile ONLY when petal-dropdown-open-on-mobile is true */\n  [petal-el=\"dropdown\"][petal-dropdown-open-on-tablet=\"true\"] [petal-el=\"dropdown-toggle\"] {\n    display: none !important;\n  }\n\n  /* Make dropdown menu static positioning on mobile */\n  [petal-el=\"dropdown\"][petal-dropdown-open-on-tablet=\"true\"] [petal-el=\"dropdown-menu\"] {\n    position: static !important;\n  }\n\n  /* Unset all styles on dropdown-drawer on mobile ONLY when petal-dropdown-open-on-mobile is true */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"][petal-dropdown-open-on-tablet=\"true\"] [petal-el=\"dropdown-drawer\"] {\n    all: unset !important;\n    display: block !important;\n  }\n\n  /* Hide dropdown background on mobile ONLY when petal-dropdown-open-on-mobile is true */\n  [petal-el=\"dropdown\"][petal-dropdown-open-on-tablet=\"true\"] [petal-el=\"dropdown-background\"] {\n    display: none;\n  }\n}\n\n@media screen and (max-width: 767px) {\n  /* Hide dropdown toggle permanently on mobile ONLY when petal-dropdown-open-on-mobile is true */\n  [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile-landscape=\"true\"] [petal-el=\"dropdown-toggle\"] {\n    display: none !important;\n  }\n\n  /* Make dropdown menu static positioning on mobile */\n  [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile-landscape=\"true\"] [petal-el=\"dropdown-menu\"] {\n    position: static !important;\n  }\n\n  /* Unset all styles on dropdown-drawer on mobile ONLY when petal-dropdown-open-on-mobile is true */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile-landscape=\"true\"] [petal-el=\"dropdown-drawer\"] {\n    all: unset !important;\n    display: block !important;\n  }\n\n  /* Hide dropdown background on mobile ONLY when petal-dropdown-open-on-mobile is true */\n  [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile-landscape=\"true\"] [petal-el=\"dropdown-background\"] {\n    display: none;\n  }\n}\n\n@media screen and (max-width: 479px) {\n  /* Hide dropdown toggle permanently on mobile ONLY when petal-dropdown-open-on-mobile is true */\n  [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile=\"true\"] [petal-el=\"dropdown-toggle\"] {\n    display: none !important;\n  }\n\n  /* Make dropdown menu static positioning on mobile */\n  [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile=\"true\"] [petal-el=\"dropdown-menu\"] {\n    position: static !important;\n  }\n\n  /* Unset all styles on dropdown-drawer on mobile ONLY when petal-dropdown-open-on-mobile is true */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile=\"true\"] [petal-el=\"dropdown-drawer\"] {\n    all: unset !important;\n    display: block !important;\n  }\n\n  /* Hide dropdown background on mobile ONLY when petal-dropdown-open-on-mobile is true */\n  [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile=\"true\"] [petal-el=\"dropdown-background\"] {\n    display: none;\n  }\n}\n`, \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://petal/./src/lib/dropdown.css?./node_modules/css-loader/dist/cjs.js");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/noSourceMaps.js */ \"./node_modules/css-loader/dist/runtime/noSourceMaps.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);\n// Imports\n\n\nvar ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `/* ===========================\n   Dropdown Core Styles\n   =========================== */\n\n/* Default CSS variable values */\n[petal-el=\"dropdown\"] {\n  --dropdown-open-duration: 0.5s;\n  --dropdown-close-duration: 0.3s;\n}\n\n/* ===========================\n   Dropdown Animations\n   =========================== */\n\n/* Dropdown Menu: Initial (Closed) State - Hidden and prevent interaction */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"] {\n  visibility: hidden;\n  pointer-events: none;\n}\n\n/* Dropdown Menu: Open State - Visible and allow interaction */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"].w--open {\n  visibility: visible;\n  pointer-events: auto;\n}\n\n/* Dropdown Drawer: Initial (Closed) State - Common Styles */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-drawer\"] {\n  visibility: hidden;\n  opacity: 0;\n  transition:\n    transform var(--dropdown-close-duration, 0.3s) ease,\n    opacity var(--dropdown-close-duration, 0.3s) ease,\n    visibility 0s var(--dropdown-close-duration, 0.3s);\n}\n\n/* Dropdown Drawer: Open State - Common Styles */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"].w--open [petal-el=\"dropdown-drawer\"] {\n  visibility: visible;\n  opacity: 1;\n  transition:\n    transform var(--dropdown-open-duration, 0.5s) ease,\n    opacity var(--dropdown-open-duration, 0.5s) ease,\n    visibility 0s;\n}\n\n/* Animation: Slide Down (Default) */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-down\"] [petal-el=\"dropdown-drawer\"] {\n  transform: translateY(-10px);\n  transform-origin: top;\n}\n\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-down\"].w--open [petal-el=\"dropdown-drawer\"] {\n  transform: translateY(0);\n}\n\n/* Animation: Slide Up */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-up\"] [petal-el=\"dropdown-drawer\"] {\n  transform: translateY(10px);\n  transform-origin: bottom;\n}\n\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-up\"].w--open [petal-el=\"dropdown-drawer\"] {\n  transform: translateY(0);\n}\n\n/* Animation: Slide Left */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-left\"] [petal-el=\"dropdown-drawer\"] {\n  transform: translateX(10px);\n}\n\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-left\"].w--open [petal-el=\"dropdown-drawer\"] {\n  transform: translateX(0);\n}\n\n/* Animation: Slide Right */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-right\"] [petal-el=\"dropdown-drawer\"] {\n  transform: translateX(-10px);\n}\n\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-right\"].w--open [petal-el=\"dropdown-drawer\"] {\n  transform: translateX(0);\n}\n\n/* ===========================\n   Tablet Animations (max-width: 991px)\n   =========================== */\n\n@media screen and (max-width: 991px) {\n  /* Animation: Slide Down */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-down\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(-10px);\n    transform-origin: top;\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-down\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(0);\n  }\n\n  /* Animation: Slide Up */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-up\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(10px);\n    transform-origin: bottom;\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-up\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(0);\n  }\n\n  /* Animation: Slide Left */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-left\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(10px);\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-left\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(0);\n  }\n\n  /* Animation: Slide Right */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-right\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(-10px);\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-right\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(0);\n  }\n}\n\n/* ===========================\n   Mobile Landscape Animations (max-width: 767px)\n   =========================== */\n\n@media screen and (max-width: 767px) {\n  /* Animation: Slide Down */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-down\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(-10px);\n    transform-origin: top;\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-down\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(0);\n  }\n\n  /* Animation: Slide Up */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-up\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(10px);\n    transform-origin: bottom;\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-up\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(0);\n  }\n\n  /* Animation: Slide Left */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-left\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(10px);\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-left\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(0);\n  }\n\n  /* Animation: Slide Right */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-right\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(-10px);\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-right\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(0);\n  }\n}\n\n/* ===========================\n   Mobile Animations (max-width: 479px)\n   =========================== */\n\n@media screen and (max-width: 479px) {\n  /* Animation: Slide Down */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-down\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(-10px);\n    transform-origin: top;\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-down\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(0);\n  }\n\n  /* Animation: Slide Up */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-up\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(10px);\n    transform-origin: bottom;\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-up\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateY(0);\n  }\n\n  /* Animation: Slide Left */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-left\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(10px);\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-left\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(0);\n  }\n\n  /* Animation: Slide Right */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-right\"] [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(-10px);\n  }\n\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-right\"].w--open [petal-el=\"dropdown-drawer\"] {\n    transform: translateX(0);\n  }\n}\n\n/* ===========================\n   Dropdown Backdrop\n   =========================== */\n\n[petal-el=\"dropdown-backdrop\"] {\n  opacity: 0;\n  transition: opacity var(--dropdown-close-duration, 0.3s) ease;\n}\n\nbody:has([petal-el=\"dropdown\"] > [petal-el=\"dropdown-toggle\"][aria-expanded=\"true\"]) [petal-el=\"dropdown-backdrop\"] {\n  opacity: 1;\n  transition: opacity var(--dropdown-open-duration, 0.5s) ease;\n}\n\n/* ===========================\n   Mobile Styles (Override on small containers)\n   =========================== */\n\n@media screen and (max-width: 991px) {\n  /* Hide dropdown toggle permanently on mobile ONLY when petal-dropdown-open-on-mobile is true */\n  [petal-el=\"dropdown\"][petal-dropdown-open-on-tablet=\"true\"] [petal-el=\"dropdown-toggle\"] {\n    display: none !important;\n  }\n\n  /* Make dropdown menu static positioning on mobile */\n  [petal-el=\"dropdown\"][petal-dropdown-open-on-tablet=\"true\"] [petal-el=\"dropdown-menu\"] {\n    position: static !important;\n  }\n\n  /* Unset all styles on dropdown-drawer on mobile ONLY when petal-dropdown-open-on-mobile is true */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"][petal-dropdown-open-on-tablet=\"true\"] [petal-el=\"dropdown-drawer\"] {\n    all: unset !important;\n    display: block !important;\n  }\n\n  /* Hide dropdown background on mobile ONLY when petal-dropdown-open-on-mobile is true */\n  [petal-el=\"dropdown\"][petal-dropdown-open-on-tablet=\"true\"] [petal-el=\"dropdown-background\"] {\n    display: none;\n  }\n}\n\n@media screen and (max-width: 767px) {\n  /* Hide dropdown toggle permanently on mobile ONLY when petal-dropdown-open-on-mobile is true */\n  [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile-landscape=\"true\"] [petal-el=\"dropdown-toggle\"] {\n    display: none !important;\n  }\n\n  /* Make dropdown menu static positioning on mobile */\n  [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile-landscape=\"true\"] [petal-el=\"dropdown-menu\"] {\n    position: static !important;\n  }\n\n  /* Unset all styles on dropdown-drawer on mobile ONLY when petal-dropdown-open-on-mobile is true */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile-landscape=\"true\"] [petal-el=\"dropdown-drawer\"] {\n    all: unset !important;\n    display: block !important;\n  }\n\n  /* Hide dropdown background on mobile ONLY when petal-dropdown-open-on-mobile is true */\n  [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile-landscape=\"true\"] [petal-el=\"dropdown-background\"] {\n    display: none;\n  }\n}\n\n@media screen and (max-width: 479px) {\n  /* Hide dropdown toggle permanently on mobile ONLY when petal-dropdown-open-on-mobile is true */\n  [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile=\"true\"] [petal-el=\"dropdown-toggle\"] {\n    display: none !important;\n  }\n\n  /* Make dropdown menu static positioning on mobile */\n  [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile=\"true\"] [petal-el=\"dropdown-menu\"] {\n    position: static !important;\n  }\n\n  /* Unset all styles on dropdown-drawer on mobile ONLY when petal-dropdown-open-on-mobile is true */\n  html:not(.wf-design-mode) [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile=\"true\"] [petal-el=\"dropdown-drawer\"] {\n    all: unset !important;\n    display: block !important;\n  }\n\n  /* Hide dropdown background on mobile ONLY when petal-dropdown-open-on-mobile is true */\n  [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile=\"true\"] [petal-el=\"dropdown-background\"] {\n    display: none;\n  }\n}\n`, \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://petal/./src/lib/dropdown.css?./node_modules/css-loader/dist/cjs.js");
 
 /***/ }),
 
@@ -160,16 +160,6 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 
 /***/ }),
 
-/***/ "./src/banner.ts":
-/*!***********************!*\
-  !*** ./src/banner.ts ***!
-  \***********************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   initializeBanner: () => (/* binding */ initializeBanner)\n/* harmony export */ });\n/* harmony import */ var _lib_attributes__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./lib/attributes */ \"./src/lib/attributes.ts\");\n/* harmony import */ var _lib_helpers__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./lib/helpers */ \"./src/lib/helpers.ts\");\n/* harmony import */ var _lib_memory__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./lib/memory */ \"./src/lib/memory.ts\");\n\n\n\nfunction initializeBanner() {\n    const banners = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_1__.getAllPetalElementsOfType)(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_BANNER);\n    console.log(`🌸 Detected ${banners.length} banner(s)`);\n    banners.forEach((banner) => {\n        const name = banner.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_NAME);\n        // Check if this banner is allowed to be closed\n        const allowClose = banner.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_ALLOW_CLOSE) !== \"false\";\n        console.log(allowClose);\n        const closeButtons = banner.querySelectorAll(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ELEMENT}=\"${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_BANNER_CLOSE}\"]`);\n        // Get session TTL in minutes (default: 30 minutes)\n        const sessionTTLMinutes = parseFloat(banner.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_SESSION_TTL) || \"30\");\n        if (!name)\n            return;\n        console.log(`  → Banner: \"${name}\"`);\n        // If banner doesn't allow close, hide close buttons and clear any stored memory\n        if (!allowClose) {\n            console.log(`    - Closing disabled for this banner`);\n            closeButtons.forEach((closeButton) => {\n                closeButton.style.display = \"none\";\n            });\n            (0,_lib_memory__WEBPACK_IMPORTED_MODULE_2__.clearClosedState)(\"banner\", name);\n        }\n        // Check if banner was closed and session is still valid (only if allowClose is true)\n        if (allowClose && (0,_lib_memory__WEBPACK_IMPORTED_MODULE_2__.checkClosedState)(\"banner\", name, sessionTTLMinutes)) {\n            // If closed and session valid, hide the banner\n            banner.classList.add(\"petal-hide-banner\");\n        }\n        // Add click event listeners to close buttons (only if allowClose is true)\n        if (allowClose) {\n            closeButtons.forEach((closeButton) => {\n                closeButton.addEventListener(\"click\", () => {\n                    // Hide the banner\n                    banner.classList.add(\"petal-hide-banner\");\n                    // Store closed state in sessionStorage with timestamp\n                    (0,_lib_memory__WEBPACK_IMPORTED_MODULE_2__.storeClosedState)(\"banner\", name);\n                });\n            });\n        }\n    });\n}\n\n\n//# sourceURL=webpack://petal/./src/banner.ts?");
-
-/***/ }),
-
 /***/ "./src/lib/animations.ts":
 /*!*******************************!*\
   !*** ./src/lib/animations.ts ***!
@@ -220,16 +210,6 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 
 /***/ }),
 
-/***/ "./src/lib/dropdown.ts":
-/*!*****************************!*\
-  !*** ./src/lib/dropdown.ts ***!
-  \*****************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   initializeDropdowns: () => (/* binding */ initializeDropdowns)\n/* harmony export */ });\n/* harmony import */ var gsap__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! gsap */ \"./node_modules/gsap/index.js\");\n/* harmony import */ var _animations__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./animations */ \"./src/lib/animations.ts\");\n/* harmony import */ var _attributes__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./attributes */ \"./src/lib/attributes.ts\");\n/**\n * Dropdown Component\n *\n * Handles interactive dropdown menus with support for:\n * - Click or hover-based opening\n * - Customizable close delays\n * - Grouped dropdown coordination\n * - CSS-based animations\n * - Accessibility (aria-expanded)\n *\n * HTML Attributes (defined in attributes.ts):\n * - petal-el=\"dropdown\" - Container element\n * - petal-el=\"dropdown-toggle\" - Clickable/hoverable trigger\n * - petal-el=\"dropdown-menu\" - Menu content\n * - petal-el=\"dropdown-drawer\" - Menu inner box\n * - petal-el=\"dropdown-overlay\" (optional) - Background overlay\n * - petal-el=\"dropdown-close\" (optional) - Clickable element that closes the dropdown\n * - petal-dropdown-group=\"name\" (optional) - Group name for coordinated animations\n * - petal-dropdown-open-on-hover=\"true\" (optional) - Use hover instead of click\n * - petal-dropdown-open-delay=\"ms\" (optional) - Open delay in milliseconds (default: 200)\n * - petal-dropdown-close-delay=\"ms\" (optional) - Close delay in milliseconds (default: 200)\n * - petal-dropdown-anim=\"slide-down|slide-up|slide-left|slide-right\" (optional) - Desktop animation (default: slide-down)\n * - petal-dropdown-anim-tablet=\"slide-down|slide-up|slide-left|slide-right\" (optional) - Tablet animation (inherits from petal-dropdown-anim)\n * - petal-dropdown-anim-mobile-landscape=\"slide-down|slide-up|slide-left|slide-right\" (optional) - Mobile landscape animation (inherits from petal-dropdown-anim-tablet)\n * - petal-dropdown-anim-mobile=\"slide-down|slide-up|slide-left|slide-right\" (optional) - Mobile animation (inherits from petal-dropdown-anim-mobile-landscape)\n * - petal-dropdown-anim-open-speed=\"ms\" (optional) - Animation speed when opening in milliseconds (default: 500)\n * - petal-dropdown-anim-close-speed=\"ms\" (optional) - Animation speed when closing in milliseconds (default: 300)\n */\n\n\n\nconst animationOpenMap = {\n    \"slide-down\": _animations__WEBPACK_IMPORTED_MODULE_0__.animateDropdownOpenSlideDown,\n    \"slide-up\": _animations__WEBPACK_IMPORTED_MODULE_0__.animateDropdownOpenSlideUp,\n    \"slide-left\": _animations__WEBPACK_IMPORTED_MODULE_0__.animateDropdownOpenSlideLeft,\n    \"slide-right\": _animations__WEBPACK_IMPORTED_MODULE_0__.animateDropdownOpenSlideRight,\n};\nconst animationCloseMap = {\n    \"slide-down\": _animations__WEBPACK_IMPORTED_MODULE_0__.animateDropdownCloseSlideDown,\n    \"slide-up\": _animations__WEBPACK_IMPORTED_MODULE_0__.animateDropdownCloseSlideUp,\n    \"slide-left\": _animations__WEBPACK_IMPORTED_MODULE_0__.animateDropdownCloseSlideLeft,\n    \"slide-right\": _animations__WEBPACK_IMPORTED_MODULE_0__.animateDropdownCloseSlideRight,\n};\nfunction initializeDropdowns() {\n    const init = () => {\n        console.log(\"Dropdown script loaded\");\n        const dropdowns = document.querySelectorAll(`[${_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_ELEMENT}='${_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN}']`);\n        console.log(`Found ${dropdowns.length} dropdown(s)`);\n        dropdowns.forEach((dropdown, index) => {\n            console.log(`\\n=== Initializing Dropdown ${index + 1} ===`);\n            // ===========================\n            // Element References\n            // ===========================\n            const toggle = dropdown.querySelector(`[${_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_ELEMENT}='${_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_TOGGLE}']`);\n            const menu = dropdown.querySelector(`[${_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_ELEMENT}='${_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_MENU}']`);\n            const overlay = dropdown.querySelector(`[${_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_ELEMENT}='${_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_OVERLAY}']`);\n            const close = dropdown.querySelector(`[${_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_ELEMENT}='${_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_CLOSE}']`);\n            console.log(`Dropdown ${index + 1} - Found toggle:`, toggle);\n            console.log(`Dropdown ${index + 1} - Found menu:`, menu);\n            console.log(`Dropdown ${index + 1} - Found overlay:`, overlay);\n            console.log(`Dropdown ${index + 1} - Found close:`, close);\n            // ===========================\n            // Configuration\n            // ===========================\n            const group = dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_GROUP) || null;\n            // Check if device has mouse capability (pointer device)\n            const hasMouse = window.matchMedia(\"(pointer: fine)\").matches;\n            // Open-on-hover configuration with breakpoints\n            const openOnHoverDesktopAttr = dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER);\n            const openOnHoverTabletAttr = dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_TABLET);\n            const openOnHoverMobileLandscapeAttr = dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_MOBILE_LANDSCAPE);\n            const openOnHoverMobileAttr = dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_MOBILE);\n            // Helper to get current open-on-hover setting based on screen size\n            const getCurrentOpenOnHover = () => {\n                const width = window.innerWidth;\n                let shouldHover = openOnHoverDesktopAttr === \"true\";\n                if (width <= 479 && openOnHoverMobileAttr !== null) {\n                    shouldHover = openOnHoverMobileAttr === \"true\";\n                }\n                else if (width <= 767 && openOnHoverMobileLandscapeAttr !== null) {\n                    shouldHover = openOnHoverMobileLandscapeAttr === \"true\";\n                }\n                else if (width <= 991 && openOnHoverTabletAttr !== null) {\n                    shouldHover = openOnHoverTabletAttr === \"true\";\n                }\n                // Only enable hover if device has mouse\n                return shouldHover && hasMouse;\n            };\n            let openOnHover = getCurrentOpenOnHover();\n            const openDelay = parseInt(dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_OPEN_DELAY) || \"200\");\n            const closeDelay = parseInt(dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_CLOSE_DELAY) || \"200\");\n            // Animation configuration\n            const anim = dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_ANIM) || \"slide-down\";\n            const animTablet = dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_ANIM_TABLET) || anim;\n            const animMobileLandscape = dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_ANIM_MOBILE_LANDSCAPE) || animTablet;\n            const animMobile = dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_ANIM_MOBILE) || animMobileLandscape;\n            // Animation speed configuration (in milliseconds, converted to seconds for GSAP)\n            const animOpenSpeed = parseInt(dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_ANIM_OPEN_SPEED) || \"500\") / 1000;\n            const animCloseSpeed = parseInt(dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_ANIM_CLOSE_SPEED) || \"300\") / 1000;\n            // Animation offset configuration (in pixels or percentage) with breakpoints\n            const parseOffset = (value) => {\n                // If it contains %, return as string\n                if (value.includes(\"%\")) {\n                    return value;\n                }\n                // Otherwise parse as number\n                return parseInt(value);\n            };\n            const animOffsetRaw = dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_ANIM_OFFSET) || \"25\";\n            const animOffset = parseOffset(animOffsetRaw);\n            const animOffsetTablet = parseOffset(dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_ANIM_OFFSET_TABLET) || animOffsetRaw);\n            const animOffsetMobileLandscape = parseOffset(dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_ANIM_OFFSET_MOBILE_LANDSCAPE) || dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_ANIM_OFFSET_TABLET) || animOffsetRaw);\n            const animOffsetMobile = parseOffset(dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_ANIM_OFFSET_MOBILE) ||\n                dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_ANIM_OFFSET_MOBILE_LANDSCAPE) ||\n                dropdown.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_ANIM_OFFSET_TABLET) ||\n                animOffsetRaw);\n            console.log(`Dropdown ${index + 1} - Config:`, {\n                group,\n                hasMouse,\n                openOnHoverDesktopAttr,\n                openOnHoverTabletAttr,\n                openOnHoverMobileLandscapeAttr,\n                openOnHoverMobileAttr,\n                openOnHover,\n                openDelay,\n                closeDelay,\n                anim,\n                animTablet,\n                animMobileLandscape,\n                animMobile,\n                animOpenSpeed: `${animOpenSpeed}s`,\n                animCloseSpeed: `${animCloseSpeed}s`,\n                animOffset: `${animOffset}px`,\n                animOffsetTablet: `${animOffsetTablet}px`,\n                animOffsetMobileLandscape: `${animOffsetMobileLandscape}px`,\n                animOffsetMobile: `${animOffsetMobile}px`,\n            });\n            // Helper function to get the current animation offset based on screen size\n            const getCurrentOffset = () => {\n                const width = window.innerWidth;\n                if (width <= 479)\n                    return animOffsetMobile;\n                if (width <= 767)\n                    return animOffsetMobileLandscape;\n                if (width <= 991)\n                    return animOffsetTablet;\n                return animOffset;\n            };\n            // Helper function to get the current animation type based on screen size\n            const getCurrentAnimation = () => {\n                const width = window.innerWidth;\n                if (width <= 479)\n                    return animMobile;\n                if (width <= 767)\n                    return animMobileLandscape;\n                if (width <= 991)\n                    return animTablet;\n                return anim;\n            };\n            // Validate required elements\n            if (!toggle || !menu) {\n                console.warn(`Dropdown ${index + 1} - Missing toggle or menu, skipping`);\n                return;\n            }\n            // ===========================\n            // State Management\n            // ===========================\n            let isOpen = false;\n            let timeoutId = null;\n            let currentTimeline = null;\n            // ===========================\n            // Core Functions\n            // ===========================\n            /**\n             * Opens the dropdown menu using GSAP\n             * - Cancels any pending close timeout\n             * - Delays opening if specified or if another dropdown in same group is open\n             * - Animates using GSAP timeline\n             */\n            const openDropdown = () => {\n                console.log(`Dropdown ${index + 1} - openDropdown() called`);\n                // Cancel any pending close\n                if (timeoutId) {\n                    console.log(`Dropdown ${index + 1} - Cancelling pending close timeout`);\n                    clearTimeout(timeoutId);\n                    timeoutId = null;\n                }\n                // Kill any existing timeline\n                if (currentTimeline) {\n                    currentTimeline.kill();\n                    currentTimeline = null;\n                }\n                // Check if we need to delay opening (group coordination)\n                let groupCoordinationDelay = 0;\n                if (group) {\n                    const groupDropdowns = document.querySelectorAll(`[${_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_ELEMENT}='${_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN}'][${_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_GROUP}='${group}']`);\n                    console.log(`Dropdown ${index + 1} - Found ${groupDropdowns.length} dropdowns in group '${group}'`);\n                    // Find the currently open dropdown in this group\n                    const openDropdownInGroup = Array.from(groupDropdowns).find((dd) => {\n                        const ddToggle = dd.querySelector(`[${_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_ELEMENT}='${_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_TOGGLE}']`);\n                        return ddToggle && ddToggle !== toggle && ddToggle.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ARIA_EXPANDED) === \"true\";\n                    });\n                    // If another is open, get its close delay attribute for coordination\n                    if (openDropdownInGroup) {\n                        groupCoordinationDelay = parseInt(openDropdownInGroup.getAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DROPDOWN_CLOSE_DELAY) || \"0\", 10);\n                        console.log(`Dropdown ${index + 1} - Another dropdown in group is open, coordinating with delay: ${groupCoordinationDelay}ms`);\n                    }\n                }\n                // Perform the actual open (immediately or delayed)\n                const performOpen = () => {\n                    console.log(`Dropdown ${index + 1} - performOpen() executing with GSAP`);\n                    // Get the appropriate animation based on screen size\n                    const currentAnim = getCurrentAnimation();\n                    const currentOffset = getCurrentOffset();\n                    const animFunc = animationOpenMap[currentAnim];\n                    const anim = animFunc(currentOffset);\n                    // Create GSAP timeline\n                    const tl = gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.timeline();\n                    currentTimeline = tl;\n                    // Find the drawer element to animate\n                    const drawer = menu.querySelector(`[${_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_ELEMENT}='dropdown-drawer']`);\n                    // Set menu to visible with flex display\n                    tl.set(menu, { display: \"flex\", visibility: \"visible\" });\n                    // Set overlay to flex and visible if it exists\n                    if (overlay) {\n                        tl.set(overlay, { display: \"flex\", visibility: \"visible\" }, \"<\");\n                    }\n                    // Animate the drawer\n                    if (drawer) {\n                        anim.to.duration = animOpenSpeed;\n                        tl.fromTo(drawer, anim.from, anim.to, \"<\");\n                    }\n                    // Update ARIA and state\n                    toggle.setAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ARIA_EXPANDED, \"true\");\n                    menu.classList.add(_attributes__WEBPACK_IMPORTED_MODULE_1__.CLASS_DROPDOWN_OPEN);\n                    if (overlay) {\n                        tl.to(overlay, { opacity: 1, duration: animOpenSpeed }, \"<\");\n                    }\n                    isOpen = true;\n                };\n                // Use the greater of openDelay or groupCoordinationDelay\n                const totalDelay = Math.max(openDelay, groupCoordinationDelay);\n                console.log(`Dropdown ${index + 1} - Total delay: ${totalDelay}ms (openDelay: ${openDelay}ms, groupCoordination: ${groupCoordinationDelay}ms)`);\n                if (totalDelay > 0) {\n                    console.log(`Dropdown ${index + 1} - Scheduling open in ${totalDelay}ms`);\n                    setTimeout(performOpen, totalDelay);\n                }\n                else {\n                    console.log(`Dropdown ${index + 1} - Opening immediately`);\n                    performOpen();\n                }\n            };\n            /**\n             * Closes the dropdown menu using GSAP\n             * - Cancels any pending close timeout\n             * - Animates using GSAP timeline\n             * - Sets visibility to hidden after animation completes\n             */\n            const closeDropdown = () => {\n                console.log(`Dropdown ${index + 1} - closeDropdown() called`);\n                // Cancel any pending close\n                if (timeoutId) {\n                    console.log(`Dropdown ${index + 1} - Cancelling existing timeout`);\n                    clearTimeout(timeoutId);\n                    timeoutId = null;\n                }\n                // Kill any existing timeline\n                if (currentTimeline) {\n                    currentTimeline.kill();\n                    currentTimeline = null;\n                }\n                console.log(`Dropdown ${index + 1} - closeDropdown() executing with GSAP`);\n                // Get the appropriate animation based on screen size\n                const currentAnim = getCurrentAnimation();\n                const currentOffset = getCurrentOffset();\n                const animFunc = animationCloseMap[currentAnim];\n                const anim = animFunc(currentOffset);\n                // Create GSAP timeline\n                const tl = gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.timeline({\n                    onComplete: () => {\n                        // Set visibility to hidden after animation completes\n                        gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.set(menu, { visibility: \"hidden\" });\n                        if (overlay) {\n                            gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.set(overlay, { display: \"none\", visibility: \"hidden\" });\n                        }\n                    },\n                });\n                currentTimeline = tl;\n                // Find the drawer element to animate\n                const drawer = menu.querySelector(`[${_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_ELEMENT}='dropdown-drawer']`);\n                // Animate the drawer\n                if (drawer) {\n                    anim.to.duration = animCloseSpeed;\n                    tl.fromTo(drawer, anim.from, anim.to);\n                }\n                // Update ARIA and state\n                toggle.setAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ARIA_EXPANDED, \"false\");\n                menu.classList.remove(_attributes__WEBPACK_IMPORTED_MODULE_1__.CLASS_DROPDOWN_OPEN);\n                if (overlay) {\n                    tl.to(overlay, { opacity: 0, duration: animCloseSpeed }, \"<\");\n                }\n                isOpen = false;\n            };\n            /**\n             * Closes the dropdown with an optional delay\n             * - Uses petal-dropdown-delay attribute value\n             * - Stores timeout ID for potential cancellation\n             */\n            const closeDropdownWithDelay = () => {\n                console.log(`Dropdown ${index + 1} - closeDropdownWithDelay() called with delay: ${closeDelay}ms`);\n                if (closeDelay > 0) {\n                    console.log(`Dropdown ${index + 1} - Scheduling close in ${closeDelay}ms`);\n                    timeoutId = window.setTimeout(closeDropdown, closeDelay);\n                }\n                else {\n                    console.log(`Dropdown ${index + 1} - Closing immediately (no delay)`);\n                    closeDropdown();\n                }\n            };\n            /**\n             * Toggles the dropdown between open and closed states\n             * - Used for click-based dropdowns\n             */\n            const toggleDropdown = () => {\n                if (isOpen) {\n                    closeDropdown();\n                }\n                else {\n                    openDropdown();\n                }\n            };\n            /**\n             * Handles clicks outside the dropdown\n             * - Only active for click-based dropdowns\n             * - Closes dropdown if click is outside both toggle and menu\n             */\n            const handleOutsideClick = (event) => {\n                if (!isOpen)\n                    return;\n                const clickedInsideDropdown = dropdown.contains(event.target);\n                if (!clickedInsideDropdown) {\n                    closeDropdown();\n                }\n            };\n            // ===========================\n            // Initialization\n            // ===========================\n            // Set initial aria-expanded state and ensure menu is closed\n            toggle.setAttribute(_attributes__WEBPACK_IMPORTED_MODULE_1__.ARIA_EXPANDED, \"false\");\n            menu.classList.remove(_attributes__WEBPACK_IMPORTED_MODULE_1__.CLASS_DROPDOWN_OPEN);\n            // Initialize drawer to its animation's starting position\n            const drawer = menu.querySelector(`[${_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_ELEMENT}='dropdown-drawer']`);\n            if (drawer) {\n                const currentAnim = getCurrentAnimation();\n                const currentOffset = getCurrentOffset();\n                const animFunc = animationOpenMap[currentAnim];\n                const anim = animFunc(currentOffset);\n                gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.set(drawer, anim.from);\n            }\n            // Event listener references for cleanup\n            const mouseEnterHandler = () => {\n                console.log(`Dropdown ${index + 1} - MOUSEENTER event triggered`);\n                openDropdown();\n            };\n            const mouseLeaveHandler = () => {\n                console.log(`Dropdown ${index + 1} - MOUSELEAVE event triggered`);\n                closeDropdownWithDelay();\n            };\n            // Function to attach/detach event listeners based on hover mode\n            const updateEventListeners = () => {\n                const shouldUseHover = getCurrentOpenOnHover();\n                // If mode changed, update listeners\n                if (shouldUseHover !== openOnHover) {\n                    console.log(`Dropdown ${index + 1} - Switching interaction mode to ${shouldUseHover ? \"hover\" : \"click\"}`);\n                    // Remove old listeners\n                    if (openOnHover) {\n                        dropdown.removeEventListener(\"mouseenter\", mouseEnterHandler);\n                        dropdown.removeEventListener(\"mouseleave\", mouseLeaveHandler);\n                    }\n                    else {\n                        toggle.removeEventListener(\"click\", toggleDropdown);\n                        document.removeEventListener(\"click\", handleOutsideClick);\n                    }\n                    // Update mode\n                    openOnHover = shouldUseHover;\n                    // Attach new listeners\n                    if (openOnHover) {\n                        console.log(`Dropdown ${index + 1} - Attaching hover event listeners`);\n                        dropdown.addEventListener(\"mouseenter\", mouseEnterHandler);\n                        dropdown.addEventListener(\"mouseleave\", mouseLeaveHandler);\n                    }\n                    else {\n                        console.log(`Dropdown ${index + 1} - Attaching click event listeners`);\n                        toggle.addEventListener(\"click\", toggleDropdown);\n                        document.addEventListener(\"click\", handleOutsideClick);\n                    }\n                }\n            };\n            // Reinitialize drawer position on window resize and update event listeners\n            const handleResize = () => {\n                if (!isOpen && drawer) {\n                    const currentAnim = getCurrentAnimation();\n                    const currentOffset = getCurrentOffset();\n                    const animFunc = animationOpenMap[currentAnim];\n                    const anim = animFunc(currentOffset);\n                    gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.set(drawer, anim.from);\n                }\n                // Update event listeners based on new screen size\n                updateEventListeners();\n            };\n            window.addEventListener(\"resize\", handleResize);\n            // Initial event listener setup\n            if (openOnHover) {\n                console.log(`Dropdown ${index + 1} - Attaching hover event listeners`);\n                dropdown.addEventListener(\"mouseenter\", mouseEnterHandler);\n                dropdown.addEventListener(\"mouseleave\", mouseLeaveHandler);\n            }\n            else {\n                console.log(`Dropdown ${index + 1} - Attaching click event listeners`);\n                toggle.addEventListener(\"click\", toggleDropdown);\n                document.addEventListener(\"click\", handleOutsideClick);\n            }\n            // Attach click listener to dropdown-close element (if it exists)\n            if (close) {\n                console.log(`Dropdown ${index + 1} - Attaching click listener to close element`);\n                close.addEventListener(\"click\", closeDropdown);\n            }\n            console.log(`Dropdown ${index + 1} - Initialization complete\\n`);\n        });\n    };\n    // Run immediately if DOM is ready, otherwise wait for DOMContentLoaded\n    if (document.readyState === \"loading\") {\n        document.addEventListener(\"DOMContentLoaded\", init);\n    }\n    else {\n        init();\n    }\n}\n\n\n//# sourceURL=webpack://petal/./src/lib/dropdown.ts?");
-
-/***/ }),
-
 /***/ "./src/lib/helpers.ts":
 /*!****************************!*\
   !*** ./src/lib/helpers.ts ***!
@@ -250,6 +230,66 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 
 /***/ }),
 
+/***/ "./src/modules/banner/banner.ts":
+/*!**************************************!*\
+  !*** ./src/modules/banner/banner.ts ***!
+  \**************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   initializeBanner: () => (/* binding */ initializeBanner)\n/* harmony export */ });\n/* harmony import */ var _lib_attributes__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../lib/attributes */ \"./src/lib/attributes.ts\");\n/* harmony import */ var _lib_helpers__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../lib/helpers */ \"./src/lib/helpers.ts\");\n/* harmony import */ var _lib_memory__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../lib/memory */ \"./src/lib/memory.ts\");\n\n\n\nfunction initializeBanner() {\n    const banners = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_1__.getAllPetalElementsOfType)(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_BANNER);\n    console.log(`🌸 Detected ${banners.length} banner(s)`);\n    banners.forEach((banner) => {\n        const name = banner.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_NAME);\n        // Check if this banner is allowed to be closed\n        const allowClose = banner.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_ALLOW_CLOSE) !== \"false\";\n        console.log(allowClose);\n        const closeButtons = banner.querySelectorAll(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ELEMENT}=\"${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_BANNER_CLOSE}\"]`);\n        // Get session TTL in minutes (default: 30 minutes)\n        const sessionTTLMinutes = parseFloat(banner.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_SESSION_TTL) || \"30\");\n        if (!name)\n            return;\n        console.log(`  → Banner: \"${name}\"`);\n        // If banner doesn't allow close, hide close buttons and clear any stored memory\n        if (!allowClose) {\n            console.log(`    - Closing disabled for this banner`);\n            closeButtons.forEach((closeButton) => {\n                closeButton.style.display = \"none\";\n            });\n            (0,_lib_memory__WEBPACK_IMPORTED_MODULE_2__.clearClosedState)(\"banner\", name);\n        }\n        // Check if banner was closed and session is still valid (only if allowClose is true)\n        if (allowClose && (0,_lib_memory__WEBPACK_IMPORTED_MODULE_2__.checkClosedState)(\"banner\", name, sessionTTLMinutes)) {\n            // If closed and session valid, hide the banner\n            banner.classList.add(\"petal-hide-banner\");\n        }\n        // Add click event listeners to close buttons (only if allowClose is true)\n        if (allowClose) {\n            closeButtons.forEach((closeButton) => {\n                closeButton.addEventListener(\"click\", () => {\n                    // Hide the banner\n                    banner.classList.add(\"petal-hide-banner\");\n                    // Store closed state in sessionStorage with timestamp\n                    (0,_lib_memory__WEBPACK_IMPORTED_MODULE_2__.storeClosedState)(\"banner\", name);\n                });\n            });\n        }\n    });\n}\n\n\n//# sourceURL=webpack://petal/./src/modules/banner/banner.ts?");
+
+/***/ }),
+
+/***/ "./src/modules/dropdown/dropdown-animator.ts":
+/*!***************************************************!*\
+  !*** ./src/modules/dropdown/dropdown-animator.ts ***!
+  \***************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   animateClose: () => (/* binding */ animateClose),\n/* harmony export */   animateOpen: () => (/* binding */ animateOpen),\n/* harmony export */   initializeDrawerPosition: () => (/* binding */ initializeDrawerPosition)\n/* harmony export */ });\n/* harmony import */ var gsap__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! gsap */ \"./node_modules/gsap/index.js\");\n/* harmony import */ var _lib_animations__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../lib/animations */ \"./src/lib/animations.ts\");\n/* harmony import */ var _lib_attributes__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../lib/attributes */ \"./src/lib/attributes.ts\");\n/**\n * Dropdown Animator Module\n *\n * Handles GSAP animations for dropdown menus including:\n * - Opening/closing animations\n * - Overlay fade transitions\n * - Timeline management\n */\n\n\n\n// Animation mapping\nconst animationOpenMap = {\n    \"slide-down\": _lib_animations__WEBPACK_IMPORTED_MODULE_0__.animateDropdownOpenSlideDown,\n    \"slide-up\": _lib_animations__WEBPACK_IMPORTED_MODULE_0__.animateDropdownOpenSlideUp,\n    \"slide-left\": _lib_animations__WEBPACK_IMPORTED_MODULE_0__.animateDropdownOpenSlideLeft,\n    \"slide-right\": _lib_animations__WEBPACK_IMPORTED_MODULE_0__.animateDropdownOpenSlideRight,\n};\nconst animationCloseMap = {\n    \"slide-down\": _lib_animations__WEBPACK_IMPORTED_MODULE_0__.animateDropdownCloseSlideDown,\n    \"slide-up\": _lib_animations__WEBPACK_IMPORTED_MODULE_0__.animateDropdownCloseSlideUp,\n    \"slide-left\": _lib_animations__WEBPACK_IMPORTED_MODULE_0__.animateDropdownCloseSlideLeft,\n    \"slide-right\": _lib_animations__WEBPACK_IMPORTED_MODULE_0__.animateDropdownCloseSlideRight,\n};\n/**\n * Animates dropdown opening with GSAP\n */\nfunction animateOpen(elements, currentAnim, currentOffset, config, index) {\n    console.log(`Dropdown ${index + 1} - performOpen() executing with GSAP`);\n    const { toggle, menu, overlay } = elements;\n    const animFunc = animationOpenMap[currentAnim];\n    const anim = animFunc(currentOffset);\n    // Create GSAP timeline\n    const tl = gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.timeline();\n    // Find the drawer element to animate\n    const drawer = menu.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_ELEMENT}='dropdown-drawer']`);\n    // Set menu to visible with flex display\n    tl.set(menu, { display: \"flex\", visibility: \"visible\" });\n    // Set overlay to flex and visible if it exists\n    if (overlay) {\n        tl.set(overlay, { display: \"flex\", visibility: \"visible\" }, \"<\");\n    }\n    // Animate the drawer\n    if (drawer) {\n        anim.to.duration = config.animOpenSpeed;\n        tl.fromTo(drawer, anim.from, anim.to, \"<\");\n    }\n    // Update ARIA and state\n    toggle.setAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ARIA_EXPANDED, \"true\");\n    menu.classList.add(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.CLASS_DROPDOWN_OPEN);\n    // Fade in overlay\n    if (overlay) {\n        tl.to(overlay, { opacity: 1, duration: config.animOpenSpeed }, \"<\");\n    }\n    return tl;\n}\n/**\n * Animates dropdown closing with GSAP\n */\nfunction animateClose(elements, currentAnim, currentOffset, config, index) {\n    console.log(`Dropdown ${index + 1} - closeDropdown() executing with GSAP`);\n    const { toggle, menu, overlay } = elements;\n    const animFunc = animationCloseMap[currentAnim];\n    const anim = animFunc(currentOffset);\n    // Create GSAP timeline\n    const tl = gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.timeline({\n        onComplete: () => {\n            // Set visibility to hidden after animation completes\n            gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.set(menu, { visibility: \"hidden\" });\n            if (overlay) {\n                gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.set(overlay, { display: \"none\", visibility: \"hidden\" });\n            }\n        },\n    });\n    // Find the drawer element to animate\n    const drawer = menu.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_ELEMENT}='dropdown-drawer']`);\n    // Animate the drawer\n    if (drawer) {\n        anim.to.duration = config.animCloseSpeed;\n        tl.fromTo(drawer, anim.from, anim.to);\n    }\n    // Update ARIA and state\n    toggle.setAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ARIA_EXPANDED, \"false\");\n    menu.classList.remove(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.CLASS_DROPDOWN_OPEN);\n    // Fade out overlay\n    if (overlay) {\n        tl.to(overlay, { opacity: 0, duration: config.animCloseSpeed }, \"<\");\n    }\n    return tl;\n}\n/**\n * Initialize drawer to its animation's starting position\n */\nfunction initializeDrawerPosition(menu, currentAnim, currentOffset) {\n    const drawer = menu.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_ELEMENT}='dropdown-drawer']`);\n    if (drawer) {\n        const animFunc = animationOpenMap[currentAnim];\n        const anim = animFunc(currentOffset);\n        gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.set(drawer, anim.from);\n    }\n}\n\n\n//# sourceURL=webpack://petal/./src/modules/dropdown/dropdown-animator.ts?");
+
+/***/ }),
+
+/***/ "./src/modules/dropdown/dropdown-config.ts":
+/*!*************************************************!*\
+  !*** ./src/modules/dropdown/dropdown-config.ts ***!
+  \*************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   getCurrentAnimation: () => (/* binding */ getCurrentAnimation),\n/* harmony export */   getCurrentOffset: () => (/* binding */ getCurrentOffset),\n/* harmony export */   getCurrentOpenOnHover: () => (/* binding */ getCurrentOpenOnHover),\n/* harmony export */   logConfig: () => (/* binding */ logConfig),\n/* harmony export */   parseDropdownConfig: () => (/* binding */ parseDropdownConfig)\n/* harmony export */ });\n/* harmony import */ var _lib_attributes__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../lib/attributes */ \"./src/lib/attributes.ts\");\n/**\n * Dropdown Configuration Module\n *\n * Handles parsing and managing dropdown configuration from HTML attributes\n * including animations, delays, offsets, and responsive breakpoints.\n */\n\n/**\n * Parse offset value from attribute string\n * Returns number for pixel values, string for percentage values\n */\nfunction parseOffset(value) {\n    if (value.includes(\"%\")) {\n        return value;\n    }\n    return parseInt(value);\n}\n/**\n * Parse boolean attribute value with null for unspecified\n */\nfunction parseBooleanOrNull(value) {\n    if (value === null)\n        return null;\n    return value === \"true\";\n}\n/**\n * Parses dropdown configuration from HTML element attributes\n */\nfunction parseDropdownConfig(dropdown) {\n    // Group coordination\n    const group = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_GROUP) || null;\n    // Check if device has mouse capability (pointer device)\n    const hasMouse = window.matchMedia(\"(pointer: fine)\").matches;\n    // Open-on-hover configuration with breakpoints\n    const openOnHoverDesktopAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER);\n    const openOnHoverTabletAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_TABLET);\n    const openOnHoverMobileLandscapeAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_MOBILE_LANDSCAPE);\n    const openOnHoverMobileAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_MOBILE);\n    const openOnHoverDesktop = openOnHoverDesktopAttr === \"true\";\n    const openOnHoverTablet = parseBooleanOrNull(openOnHoverTabletAttr);\n    const openOnHoverMobileLandscape = parseBooleanOrNull(openOnHoverMobileLandscapeAttr);\n    const openOnHoverMobile = parseBooleanOrNull(openOnHoverMobileAttr);\n    // Delays\n    const openDelay = parseInt(dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_OPEN_DELAY) || \"200\");\n    const closeDelay = parseInt(dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_CLOSE_DELAY) || \"200\");\n    // Animation configuration\n    const anim = (dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_ANIM) || \"slide-down\");\n    const animTablet = (dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_ANIM_TABLET) || anim);\n    const animMobileLandscape = (dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_ANIM_MOBILE_LANDSCAPE) || animTablet);\n    const animMobile = (dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_ANIM_MOBILE) || animMobileLandscape);\n    // Animation speed configuration (in milliseconds, converted to seconds for GSAP)\n    const animOpenSpeed = parseInt(dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_ANIM_OPEN_SPEED) || \"500\") / 1000;\n    const animCloseSpeed = parseInt(dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_ANIM_CLOSE_SPEED) || \"300\") / 1000;\n    // Animation offset configuration (in pixels or percentage) with breakpoints\n    const animOffsetRaw = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_ANIM_OFFSET) || \"25\";\n    const animOffset = parseOffset(animOffsetRaw);\n    const animOffsetTablet = parseOffset(dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_ANIM_OFFSET_TABLET) || animOffsetRaw);\n    const animOffsetMobileLandscape = parseOffset(dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_ANIM_OFFSET_MOBILE_LANDSCAPE) || dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_ANIM_OFFSET_TABLET) || animOffsetRaw);\n    const animOffsetMobile = parseOffset(dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_ANIM_OFFSET_MOBILE) ||\n        dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_ANIM_OFFSET_MOBILE_LANDSCAPE) ||\n        dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_ANIM_OFFSET_TABLET) ||\n        animOffsetRaw);\n    return {\n        group,\n        hasMouse,\n        openOnHoverDesktop,\n        openOnHoverTablet,\n        openOnHoverMobileLandscape,\n        openOnHoverMobile,\n        openDelay,\n        closeDelay,\n        anim,\n        animTablet,\n        animMobileLandscape,\n        animMobile,\n        animOpenSpeed,\n        animCloseSpeed,\n        animOffset,\n        animOffsetTablet,\n        animOffsetMobileLandscape,\n        animOffsetMobile,\n    };\n}\n/**\n * Get current animation based on screen width\n */\nfunction getCurrentAnimation(config) {\n    const width = window.innerWidth;\n    if (width <= 479)\n        return config.animMobile;\n    if (width <= 767)\n        return config.animMobileLandscape;\n    if (width <= 991)\n        return config.animTablet;\n    return config.anim;\n}\n/**\n * Get current animation offset based on screen width\n */\nfunction getCurrentOffset(config) {\n    const width = window.innerWidth;\n    if (width <= 479)\n        return config.animOffsetMobile;\n    if (width <= 767)\n        return config.animOffsetMobileLandscape;\n    if (width <= 991)\n        return config.animOffsetTablet;\n    return config.animOffset;\n}\n/**\n * Get current open-on-hover setting based on screen width and device capability\n */\nfunction getCurrentOpenOnHover(config) {\n    const width = window.innerWidth;\n    let shouldHover = config.openOnHoverDesktop;\n    if (width <= 479 && config.openOnHoverMobile !== null) {\n        shouldHover = config.openOnHoverMobile;\n    }\n    else if (width <= 767 && config.openOnHoverMobileLandscape !== null) {\n        shouldHover = config.openOnHoverMobileLandscape;\n    }\n    else if (width <= 991 && config.openOnHoverTablet !== null) {\n        shouldHover = config.openOnHoverTablet;\n    }\n    // Only enable hover if device has mouse\n    return shouldHover && config.hasMouse;\n}\n/**\n * Log configuration for debugging\n */\nfunction logConfig(index, config) {\n    console.log(`Dropdown ${index + 1} - Config:`, {\n        group: config.group,\n        hasMouse: config.hasMouse,\n        openOnHoverDesktop: config.openOnHoverDesktop,\n        openOnHoverTablet: config.openOnHoverTablet,\n        openOnHoverMobileLandscape: config.openOnHoverMobileLandscape,\n        openOnHoverMobile: config.openOnHoverMobile,\n        openOnHover: getCurrentOpenOnHover(config),\n        openDelay: config.openDelay,\n        closeDelay: config.closeDelay,\n        anim: config.anim,\n        animTablet: config.animTablet,\n        animMobileLandscape: config.animMobileLandscape,\n        animMobile: config.animMobile,\n        animOpenSpeed: `${config.animOpenSpeed}s`,\n        animCloseSpeed: `${config.animCloseSpeed}s`,\n        animOffset: config.animOffset,\n        animOffsetTablet: config.animOffsetTablet,\n        animOffsetMobileLandscape: config.animOffsetMobileLandscape,\n        animOffsetMobile: config.animOffsetMobile,\n    });\n}\n\n\n//# sourceURL=webpack://petal/./src/modules/dropdown/dropdown-config.ts?");
+
+/***/ }),
+
+/***/ "./src/modules/dropdown/dropdown-controller.ts":
+/*!*****************************************************!*\
+  !*** ./src/modules/dropdown/dropdown-controller.ts ***!
+  \*****************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   DropdownController: () => (/* binding */ DropdownController)\n/* harmony export */ });\n/* harmony import */ var _lib_attributes__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../lib/attributes */ \"./src/lib/attributes.ts\");\n/* harmony import */ var _dropdown_config__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./dropdown-config */ \"./src/modules/dropdown/dropdown-config.ts\");\n/* harmony import */ var _dropdown_animator__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./dropdown-animator */ \"./src/modules/dropdown/dropdown-animator.ts\");\n/**\n * Dropdown Controller Module\n *\n * Manages dropdown state, event handlers, and group coordination.\n * Orchestrates opening/closing logic with animations.\n */\n\n\n\nclass DropdownController {\n    constructor(elements, config, index) {\n        this.elements = elements;\n        this.config = config;\n        this.index = index;\n        this.isOpen = false;\n        this.timeoutId = null;\n        this.currentTimeline = null;\n        /**\n         * Opens the dropdown menu using GSAP\n         * - Cancels any pending close timeout\n         * - Delays opening if specified or if another dropdown in same group is open\n         * - Animates using GSAP timeline\n         */\n        this.open = () => {\n            console.log(`Dropdown ${this.index + 1} - openDropdown() called`);\n            // Cancel any pending close\n            if (this.timeoutId) {\n                console.log(`Dropdown ${this.index + 1} - Cancelling pending close timeout`);\n                clearTimeout(this.timeoutId);\n                this.timeoutId = null;\n            }\n            // Kill any existing timeline\n            if (this.currentTimeline) {\n                this.currentTimeline.kill();\n                this.currentTimeline = null;\n            }\n            // Check if we need to delay opening (group coordination)\n            let groupCoordinationDelay = 0;\n            if (this.config.group) {\n                const groupDropdowns = document.querySelectorAll(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ELEMENT}='${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN}'][${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_GROUP}='${this.config.group}']`);\n                console.log(`Dropdown ${this.index + 1} - Found ${groupDropdowns.length} dropdowns in group '${this.config.group}'`);\n                // Find the currently open dropdown in this group\n                const openDropdownInGroup = Array.from(groupDropdowns).find((dd) => {\n                    const ddToggle = dd.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ELEMENT}='${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_TOGGLE}']`);\n                    return ddToggle && ddToggle !== this.elements.toggle && ddToggle.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ARIA_EXPANDED) === \"true\";\n                });\n                // If another is open, get its close delay attribute for coordination\n                if (openDropdownInGroup) {\n                    groupCoordinationDelay = parseInt(openDropdownInGroup.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_CLOSE_DELAY) || \"0\", 10);\n                    console.log(`Dropdown ${this.index + 1} - Another dropdown in group is open, coordinating with delay: ${groupCoordinationDelay}ms`);\n                }\n            }\n            // Perform the actual open (immediately or delayed)\n            const performOpen = () => {\n                const currentAnim = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentAnimation)(this.config);\n                const currentOffset = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentOffset)(this.config);\n                this.currentTimeline = (0,_dropdown_animator__WEBPACK_IMPORTED_MODULE_2__.animateOpen)(this.elements, currentAnim, currentOffset, this.config, this.index);\n                this.isOpen = true;\n            };\n            // Use the greater of openDelay or groupCoordinationDelay\n            const totalDelay = Math.max(this.config.openDelay, groupCoordinationDelay);\n            console.log(`Dropdown ${this.index + 1} - Total delay: ${totalDelay}ms (openDelay: ${this.config.openDelay}ms, groupCoordination: ${groupCoordinationDelay}ms)`);\n            if (totalDelay > 0) {\n                console.log(`Dropdown ${this.index + 1} - Scheduling open in ${totalDelay}ms`);\n                setTimeout(performOpen, totalDelay);\n            }\n            else {\n                console.log(`Dropdown ${this.index + 1} - Opening immediately`);\n                performOpen();\n            }\n        };\n        /**\n         * Closes the dropdown menu using GSAP\n         * - Cancels any pending close timeout\n         * - Animates using GSAP timeline\n         * - Sets visibility to hidden after animation completes\n         */\n        this.close = () => {\n            console.log(`Dropdown ${this.index + 1} - closeDropdown() called`);\n            // Cancel any pending close\n            if (this.timeoutId) {\n                console.log(`Dropdown ${this.index + 1} - Cancelling existing timeout`);\n                clearTimeout(this.timeoutId);\n                this.timeoutId = null;\n            }\n            // Kill any existing timeline\n            if (this.currentTimeline) {\n                this.currentTimeline.kill();\n                this.currentTimeline = null;\n            }\n            const currentAnim = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentAnimation)(this.config);\n            const currentOffset = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentOffset)(this.config);\n            this.currentTimeline = (0,_dropdown_animator__WEBPACK_IMPORTED_MODULE_2__.animateClose)(this.elements, currentAnim, currentOffset, this.config, this.index);\n            this.isOpen = false;\n        };\n        /**\n         * Closes the dropdown with an optional delay\n         * - Uses petal-dropdown-delay attribute value\n         * - Stores timeout ID for potential cancellation\n         */\n        this.closeWithDelay = () => {\n            console.log(`Dropdown ${this.index + 1} - closeDropdownWithDelay() called with delay: ${this.config.closeDelay}ms`);\n            if (this.config.closeDelay > 0) {\n                console.log(`Dropdown ${this.index + 1} - Scheduling close in ${this.config.closeDelay}ms`);\n                this.timeoutId = window.setTimeout(this.close, this.config.closeDelay);\n            }\n            else {\n                console.log(`Dropdown ${this.index + 1} - Closing immediately (no delay)`);\n                this.close();\n            }\n        };\n        /**\n         * Toggles the dropdown between open and closed states\n         * - Used for click-based dropdowns\n         */\n        this.toggle = () => {\n            if (this.isOpen) {\n                this.close();\n            }\n            else {\n                this.open();\n            }\n        };\n        /**\n         * Handles clicks outside the dropdown\n         * - Only active for click-based dropdowns\n         * - Closes dropdown if click is outside both toggle and menu\n         */\n        this.handleOutsideClick = (event, dropdown) => {\n            if (!this.isOpen)\n                return;\n            const clickedInsideDropdown = dropdown.contains(event.target);\n            if (!clickedInsideDropdown) {\n                this.close();\n            }\n        };\n        /**\n         * Handle resize event - reinitialize drawer position if closed\n         */\n        this.handleResize = () => {\n            if (!this.isOpen) {\n                this.initializeDrawer();\n            }\n        };\n        this.openOnHover = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentOpenOnHover)(config);\n    }\n    /**\n     * Initialize drawer to starting position\n     */\n    initializeDrawer() {\n        const currentAnim = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentAnimation)(this.config);\n        const currentOffset = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentOffset)(this.config);\n        (0,_dropdown_animator__WEBPACK_IMPORTED_MODULE_2__.initializeDrawerPosition)(this.elements.menu, currentAnim, currentOffset);\n    }\n    /**\n     * Update interaction mode based on current open-on-hover setting\n     */\n    updateOpenOnHover() {\n        const newOpenOnHover = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentOpenOnHover)(this.config);\n        const changed = newOpenOnHover !== this.openOnHover;\n        this.openOnHover = newOpenOnHover;\n        return changed;\n    }\n    /**\n     * Get current open-on-hover mode\n     */\n    getOpenOnHover() {\n        return this.openOnHover;\n    }\n}\n\n\n//# sourceURL=webpack://petal/./src/modules/dropdown/dropdown-controller.ts?");
+
+/***/ }),
+
+/***/ "./src/modules/dropdown/dropdown.ts":
+/*!******************************************!*\
+  !*** ./src/modules/dropdown/dropdown.ts ***!
+  \******************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   initializeDropdowns: () => (/* binding */ initializeDropdowns)\n/* harmony export */ });\n/* harmony import */ var _lib_attributes__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../lib/attributes */ \"./src/lib/attributes.ts\");\n/* harmony import */ var _dropdown_config__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./dropdown-config */ \"./src/modules/dropdown/dropdown-config.ts\");\n/* harmony import */ var _dropdown_controller__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./dropdown-controller */ \"./src/modules/dropdown/dropdown-controller.ts\");\n/**\n * Dropdown Component\n *\n * Handles interactive dropdown menus with support for:\n * - Click or hover-based opening\n * - Customizable close delays\n * - Grouped dropdown coordination\n * - CSS-based animations\n * - Accessibility (aria-expanded)\n *\n * HTML Attributes (defined in attributes.ts):\n * - petal-el=\"dropdown\" - Container element\n * - petal-el=\"dropdown-toggle\" - Clickable/hoverable trigger\n * - petal-el=\"dropdown-menu\" - Menu content\n * - petal-el=\"dropdown-drawer\" - Menu inner box\n * - petal-el=\"dropdown-overlay\" (optional) - Background overlay\n * - petal-el=\"dropdown-close\" (optional) - Clickable element that closes the dropdown\n * - petal-dropdown-group=\"name\" (optional) - Group name for coordinated animations\n * - petal-dropdown-open-on-hover=\"true\" (optional) - Use hover instead of click\n * - petal-dropdown-open-delay=\"ms\" (optional) - Open delay in milliseconds (default: 200)\n * - petal-dropdown-close-delay=\"ms\" (optional) - Close delay in milliseconds (default: 200)\n * - petal-dropdown-anim=\"slide-down|slide-up|slide-left|slide-right\" (optional) - Desktop animation (default: slide-down)\n * - petal-dropdown-anim-tablet=\"slide-down|slide-up|slide-left|slide-right\" (optional) - Tablet animation (inherits from petal-dropdown-anim)\n * - petal-dropdown-anim-mobile-landscape=\"slide-down|slide-up|slide-left|slide-right\" (optional) - Mobile landscape animation (inherits from petal-dropdown-anim-tablet)\n * - petal-dropdown-anim-mobile=\"slide-down|slide-up|slide-left|slide-right\" (optional) - Mobile animation (inherits from petal-dropdown-anim-mobile-landscape)\n * - petal-dropdown-anim-open-speed=\"ms\" (optional) - Animation speed when opening in milliseconds (default: 500)\n * - petal-dropdown-anim-close-speed=\"ms\" (optional) - Animation speed when closing in milliseconds (default: 300)\n */\n\n\n\nfunction initializeDropdowns() {\n    const init = () => {\n        const dropdowns = document.querySelectorAll(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ELEMENT}='${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN}']`);\n        console.log(`Found ${dropdowns.length} dropdown(s)`);\n        dropdowns.forEach((dropdown, index) => {\n            console.log(`\\n=== Initializing Dropdown ${index + 1} ===`);\n            // ===========================\n            // Element References\n            // ===========================\n            const toggle = dropdown.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ELEMENT}='${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_TOGGLE}']`);\n            const menu = dropdown.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ELEMENT}='${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_MENU}']`);\n            const overlay = dropdown.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ELEMENT}='${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_OVERLAY}']`);\n            const close = dropdown.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ELEMENT}='${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_CLOSE}']`);\n            console.log(`Dropdown ${index + 1} - Found toggle:`, toggle);\n            console.log(`Dropdown ${index + 1} - Found menu:`, menu);\n            console.log(`Dropdown ${index + 1} - Found overlay:`, overlay);\n            console.log(`Dropdown ${index + 1} - Found close:`, close);\n            // Validate required elements\n            if (!toggle || !menu) {\n                console.warn(`Dropdown ${index + 1} - Missing toggle or menu, skipping`);\n                return;\n            }\n            // ===========================\n            // Configuration\n            // ===========================\n            const config = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.parseDropdownConfig)(dropdown);\n            (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.logConfig)(index, config);\n            // ===========================\n            // Controller Setup\n            // ===========================\n            const elements = { toggle, menu, overlay };\n            const controller = new _dropdown_controller__WEBPACK_IMPORTED_MODULE_2__.DropdownController(elements, config, index);\n            // ===========================\n            // Initialization\n            // ===========================\n            // Set initial aria-expanded state and ensure menu is closed\n            toggle.setAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ARIA_EXPANDED, \"false\");\n            menu.classList.remove(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.CLASS_DROPDOWN_OPEN);\n            // Initialize drawer to its animation's starting position\n            controller.initializeDrawer();\n            // Event listener references with console logging\n            const mouseEnterHandler = () => {\n                console.log(`Dropdown ${index + 1} - MOUSEENTER event triggered`);\n                controller.open();\n            };\n            const mouseLeaveHandler = () => {\n                console.log(`Dropdown ${index + 1} - MOUSELEAVE event triggered`);\n                controller.closeWithDelay();\n            };\n            const clickOutsideHandler = (event) => {\n                controller.handleOutsideClick(event, dropdown);\n            };\n            // Function to attach/detach event listeners based on hover mode\n            const updateEventListeners = () => {\n                const previousMode = controller.getOpenOnHover();\n                const modeChanged = controller.updateOpenOnHover();\n                if (modeChanged) {\n                    const newMode = controller.getOpenOnHover();\n                    console.log(`Dropdown ${index + 1} - Switching interaction mode to ${newMode ? \"hover\" : \"click\"}`);\n                    // Remove old listeners\n                    if (previousMode) {\n                        dropdown.removeEventListener(\"mouseenter\", mouseEnterHandler);\n                        dropdown.removeEventListener(\"mouseleave\", mouseLeaveHandler);\n                    }\n                    else {\n                        toggle.removeEventListener(\"click\", controller.toggle);\n                        document.removeEventListener(\"click\", clickOutsideHandler);\n                    }\n                    // Attach new listeners\n                    if (newMode) {\n                        console.log(`Dropdown ${index + 1} - Attaching hover event listeners`);\n                        dropdown.addEventListener(\"mouseenter\", mouseEnterHandler);\n                        dropdown.addEventListener(\"mouseleave\", mouseLeaveHandler);\n                    }\n                    else {\n                        console.log(`Dropdown ${index + 1} - Attaching click event listeners`);\n                        toggle.addEventListener(\"click\", controller.toggle);\n                        document.addEventListener(\"click\", clickOutsideHandler);\n                    }\n                }\n            };\n            // Reinitialize drawer position on window resize and update event listeners\n            const handleResize = () => {\n                controller.handleResize();\n                updateEventListeners();\n            };\n            window.addEventListener(\"resize\", handleResize);\n            // Initial event listener setup\n            const initialOpenOnHover = controller.getOpenOnHover();\n            if (initialOpenOnHover) {\n                console.log(`Dropdown ${index + 1} - Attaching hover event listeners`);\n                dropdown.addEventListener(\"mouseenter\", mouseEnterHandler);\n                dropdown.addEventListener(\"mouseleave\", mouseLeaveHandler);\n            }\n            else {\n                console.log(`Dropdown ${index + 1} - Attaching click event listeners`);\n                toggle.addEventListener(\"click\", controller.toggle);\n                document.addEventListener(\"click\", clickOutsideHandler);\n            }\n            // Attach click listener to dropdown-close element (if it exists)\n            if (close) {\n                console.log(`Dropdown ${index + 1} - Attaching click listener to close element`);\n                close.addEventListener(\"click\", controller.close);\n            }\n            console.log(`Dropdown ${index + 1} - Initialization complete\\n`);\n        });\n    };\n    // Run immediately if DOM is ready, otherwise wait for DOMContentLoaded\n    if (document.readyState === \"loading\") {\n        document.addEventListener(\"DOMContentLoaded\", init);\n    }\n    else {\n        init();\n    }\n}\n\n\n//# sourceURL=webpack://petal/./src/modules/dropdown/dropdown.ts?");
+
+/***/ }),
+
+/***/ "./src/modules/popup/popup.ts":
+/*!************************************!*\
+  !*** ./src/modules/popup/popup.ts ***!
+  \************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   closePopup: () => (/* binding */ closePopup),\n/* harmony export */   findPetal: () => (/* binding */ findPetal),\n/* harmony export */   findPopupElement: () => (/* binding */ findPopupElement),\n/* harmony export */   forEachPopupTrigger: () => (/* binding */ forEachPopupTrigger),\n/* harmony export */   initializeAllPopups: () => (/* binding */ initializeAllPopups),\n/* harmony export */   initializePopupTriggers: () => (/* binding */ initializePopupTriggers),\n/* harmony export */   openPopup: () => (/* binding */ openPopup)\n/* harmony export */ });\n/* harmony import */ var gsap__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! gsap */ \"./node_modules/gsap/index.js\");\n/* harmony import */ var _animation__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../animation */ \"./src/animation.ts\");\n/* harmony import */ var _lib_console__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../lib/console */ \"./src/lib/console.ts\");\n/* harmony import */ var _lib_animations__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../lib/animations */ \"./src/lib/animations.ts\");\n/* harmony import */ var _lib_attributes__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../lib/attributes */ \"./src/lib/attributes.ts\");\n/* harmony import */ var _lib_helpers__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../lib/helpers */ \"./src/lib/helpers.ts\");\n/* harmony import */ var _lib_memory__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../lib/memory */ \"./src/lib/memory.ts\");\n/* harmony import */ var _video__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../video */ \"./src/video.ts\");\n\n\n\n\n\n\n\n\nfunction initializeAllPopups() {\n    const popups = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_4__.getAllPetalElementsOfType)(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_POPUP);\n    console.log(`🌸 Detected ${popups.length} popup(s)`);\n    popups.forEach((popup) => {\n        const popupElement = popup;\n        const name = popup.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_NAME) || \"unknown\";\n        console.log(`  → Popup: \"${name}\"`);\n        const mask = findPopupElement(popup, \"mask\");\n        const slot = findPopupElement(popup, \"slot\");\n        // Set slot opacity to 0\n        if (slot)\n            slot.style.opacity = \"0\";\n        // Set mask opacity to 0\n        if (mask)\n            mask.style.opacity = \"0\";\n        // Set popup display to none\n        popupElement.style.display = \"none\";\n    });\n}\nfunction openPopup(petal) {\n    const { name, popup, slot, mask } = petal;\n    const tl = gsap__WEBPACK_IMPORTED_MODULE_7__.gsap.timeline();\n    // Set Popup display to flex\n    tl.set(popup, { display: \"flex\" });\n    // Animate Mask open\n    const maskOpacity = parseFloat((mask === null || mask === void 0 ? void 0 : mask.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_MASK_OPACITY)) || \"0.15\");\n    tl.fromTo(mask, (0,_lib_animations__WEBPACK_IMPORTED_MODULE_2__.animateMaskOpen)(maskOpacity).from, (0,_lib_animations__WEBPACK_IMPORTED_MODULE_2__.animateMaskOpen)(maskOpacity).to, \"<\");\n    // Animate Slot Open\n    const anim = (0,_animation__WEBPACK_IMPORTED_MODULE_0__.getPopupGSAPAnimation)(popup, \"open\");\n    tl.set(slot, { clearProps: \"x,y,scale,transform\" });\n    tl.fromTo(slot, anim.from, anim.to);\n}\nfunction closePopup(petal) {\n    const { name, popup, slot, mask } = petal;\n    const tl = gsap__WEBPACK_IMPORTED_MODULE_7__.gsap.timeline();\n    // VIDEO: Pause any videos inside the popup\n    (0,_video__WEBPACK_IMPORTED_MODULE_6__.pauseVideo)(popup);\n    // SESSION: Store popup closed state\n    (0,_lib_memory__WEBPACK_IMPORTED_MODULE_5__.storeClosedState)(\"popup\", name);\n    // Animate the Slot Closed\n    const anim = (0,_animation__WEBPACK_IMPORTED_MODULE_0__.getPopupGSAPAnimation)(popup, \"close\");\n    tl.fromTo(slot, anim.from, anim.to);\n    // Animate Mask Closed\n    if (mask)\n        tl.to(mask, (0,_lib_animations__WEBPACK_IMPORTED_MODULE_2__.animateMaskClosed)(0).to, \"<\");\n    // Hide the Popup and clear transforms so they don't persist\n    tl.set(popup, { display: \"none\" });\n    tl.set(slot, { clearProps: \"x,y,scale,transform\" });\n}\nfunction initializePopupTriggers() {\n    // Initialize Popup Open Triggers\n    const openTriggers = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_4__.getAllPetalElementsOfType)(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_OPEN);\n    console.log(`🌸 Detected ${openTriggers.length} open trigger(s)`);\n    forEachPopupTrigger(openTriggers, (petal) => {\n        const { trigger } = petal;\n        console.log(`  → Open trigger for: \"${petal.name}\"`);\n        trigger.addEventListener(\"click\", () => openPopup(petal));\n    });\n    // Initialize Popup Close Triggers\n    const closeTriggers = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_4__.getAllPetalElementsOfType)(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_CLOSE);\n    console.log(`🌸 Detected ${closeTriggers.length} close trigger(s)`);\n    forEachPopupTrigger(closeTriggers, (petal) => {\n        const { trigger } = petal;\n        console.log(`  → Close trigger for: \"${petal.name}\"`);\n        trigger.addEventListener(\"click\", () => closePopup(petal));\n    });\n    // Initialize Mask Close Triggers (masks with petal-mask-close=\"true\")\n    const popups = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_4__.getAllPetalElementsOfType)(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_POPUP);\n    popups.forEach((popup) => {\n        const mask = findPopupElement(popup, \"mask\");\n        const maskClose = popup.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_MASK_CLOSE) === \"true\";\n        if (mask && maskClose) {\n            mask.addEventListener(\"click\", () => {\n                const slot = findPopupElement(popup, \"slot\");\n                const name = popup.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_NAME) || popup.id;\n                if (slot) {\n                    closePopup({ name, popup: popup, slot, mask, trigger: mask });\n                }\n            });\n        }\n    });\n}\nfunction findPetal(el) {\n    const popupName = el.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_NAME);\n    if (!popupName)\n        throw new _lib_console__WEBPACK_IMPORTED_MODULE_1__.MissingNameError(el);\n    const popup = document.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_NAME}='${popupName}'][${_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_ELEMENT}='${_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_POPUP}']`);\n    if (!popup)\n        throw new _lib_console__WEBPACK_IMPORTED_MODULE_1__.MissingPopupError(popupName, el);\n    return popup;\n}\nfunction findPopupElement(popup, attr) {\n    return popup.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_ELEMENT}='${attr}']`);\n}\n// Helper to iterate over triggers with error handling\nfunction forEachPopupTrigger(triggers, callback) {\n    triggers.forEach((trigger) => {\n        try {\n            const popup = findPetal(trigger);\n            const name = trigger.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_NAME) || \"unknown\";\n            const mask = popup.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_ELEMENT}='mask']`);\n            if (!mask)\n                throw new _lib_console__WEBPACK_IMPORTED_MODULE_1__.MissingMaskError(name, trigger);\n            const slot = popup.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_ELEMENT}='slot']`);\n            if (!slot)\n                throw new _lib_console__WEBPACK_IMPORTED_MODULE_1__.MissingSlotError(name, trigger);\n            callback({ name, trigger: trigger, popup, mask, slot });\n        }\n        catch (error) {\n            if (error instanceof _lib_console__WEBPACK_IMPORTED_MODULE_1__.PetalError) {\n                // Log and skip invalid triggers\n                console.error(`[${error.name}]:`, error.message, error.element);\n            }\n            else {\n                throw error; // Re-throw unexpected errors\n            }\n        }\n    });\n}\n\n\n//# sourceURL=webpack://petal/./src/modules/popup/popup.ts?");
+
+/***/ }),
+
 /***/ "./src/petal.css":
 /*!***********************!*\
   !*** ./src/petal.css ***!
@@ -266,17 +306,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \**********************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _popup__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./popup */ \"./src/popup.ts\");\n/* harmony import */ var _banner__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./banner */ \"./src/banner.ts\");\n/* harmony import */ var _lib_dropdown__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./lib/dropdown */ \"./src/lib/dropdown.ts\");\n/* harmony import */ var _petal_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./petal.css */ \"./src/petal.css\");\n/* harmony import */ var _lib_dropdown_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./lib/dropdown.css */ \"./src/lib/dropdown.css\");\n\n\n\n\n\nconsole.log(`🌸 Hello from Wellflow Petal v${\"0.0.60\"}`);\n(0,_popup__WEBPACK_IMPORTED_MODULE_0__.initializeAllPopups)();\n(0,_popup__WEBPACK_IMPORTED_MODULE_0__.initializePopupTriggers)();\n(0,_banner__WEBPACK_IMPORTED_MODULE_1__.initializeBanner)();\n(0,_lib_dropdown__WEBPACK_IMPORTED_MODULE_2__.initializeDropdowns)();\n\n\n//# sourceURL=webpack://petal/./src/petal.ts?");
-
-/***/ }),
-
-/***/ "./src/popup.ts":
-/*!**********************!*\
-  !*** ./src/popup.ts ***!
-  \**********************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   closePopup: () => (/* binding */ closePopup),\n/* harmony export */   findPetal: () => (/* binding */ findPetal),\n/* harmony export */   findPopupElement: () => (/* binding */ findPopupElement),\n/* harmony export */   forEachPopupTrigger: () => (/* binding */ forEachPopupTrigger),\n/* harmony export */   initializeAllPopups: () => (/* binding */ initializeAllPopups),\n/* harmony export */   initializePopupTriggers: () => (/* binding */ initializePopupTriggers),\n/* harmony export */   openPopup: () => (/* binding */ openPopup)\n/* harmony export */ });\n/* harmony import */ var gsap__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! gsap */ \"./node_modules/gsap/index.js\");\n/* harmony import */ var _animation__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./animation */ \"./src/animation.ts\");\n/* harmony import */ var _lib_console__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./lib/console */ \"./src/lib/console.ts\");\n/* harmony import */ var _lib_animations__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./lib/animations */ \"./src/lib/animations.ts\");\n/* harmony import */ var _lib_attributes__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./lib/attributes */ \"./src/lib/attributes.ts\");\n/* harmony import */ var _lib_helpers__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./lib/helpers */ \"./src/lib/helpers.ts\");\n/* harmony import */ var _lib_memory__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./lib/memory */ \"./src/lib/memory.ts\");\n/* harmony import */ var _video__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./video */ \"./src/video.ts\");\n\n\n\n\n\n\n\n\nfunction initializeAllPopups() {\n    const popups = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_4__.getAllPetalElementsOfType)(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_POPUP);\n    console.log(`🌸 Detected ${popups.length} popup(s)`);\n    popups.forEach((popup) => {\n        const popupElement = popup;\n        const name = popup.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_NAME) || \"unknown\";\n        console.log(`  → Popup: \"${name}\"`);\n        const mask = findPopupElement(popup, \"mask\");\n        const slot = findPopupElement(popup, \"slot\");\n        // Set slot opacity to 0\n        if (slot)\n            slot.style.opacity = \"0\";\n        // Set mask opacity to 0\n        if (mask)\n            mask.style.opacity = \"0\";\n        // Set popup display to none\n        popupElement.style.display = \"none\";\n    });\n}\nfunction openPopup(petal) {\n    const { name, popup, slot, mask } = petal;\n    const tl = gsap__WEBPACK_IMPORTED_MODULE_7__.gsap.timeline();\n    // Set Popup display to flex\n    tl.set(popup, { display: \"flex\" });\n    // Animate Mask open\n    const maskOpacity = parseFloat((mask === null || mask === void 0 ? void 0 : mask.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_MASK_OPACITY)) || \"0.15\");\n    tl.fromTo(mask, (0,_lib_animations__WEBPACK_IMPORTED_MODULE_2__.animateMaskOpen)(maskOpacity).from, (0,_lib_animations__WEBPACK_IMPORTED_MODULE_2__.animateMaskOpen)(maskOpacity).to, \"<\");\n    // Animate Slot Open\n    const anim = (0,_animation__WEBPACK_IMPORTED_MODULE_0__.getPopupGSAPAnimation)(popup, \"open\");\n    tl.set(slot, { clearProps: \"x,y,scale,transform\" });\n    tl.fromTo(slot, anim.from, anim.to);\n}\nfunction closePopup(petal) {\n    const { name, popup, slot, mask } = petal;\n    const tl = gsap__WEBPACK_IMPORTED_MODULE_7__.gsap.timeline();\n    // VIDEO: Pause any videos inside the popup\n    (0,_video__WEBPACK_IMPORTED_MODULE_6__.pauseVideo)(popup);\n    // SESSION: Store popup closed state\n    (0,_lib_memory__WEBPACK_IMPORTED_MODULE_5__.storeClosedState)(\"popup\", name);\n    // Animate the Slot Closed\n    const anim = (0,_animation__WEBPACK_IMPORTED_MODULE_0__.getPopupGSAPAnimation)(popup, \"close\");\n    tl.fromTo(slot, anim.from, anim.to);\n    // Animate Mask Closed\n    if (mask)\n        tl.to(mask, (0,_lib_animations__WEBPACK_IMPORTED_MODULE_2__.animateMaskClosed)(0).to, \"<\");\n    // Hide the Popup and clear transforms so they don't persist\n    tl.set(popup, { display: \"none\" });\n    tl.set(slot, { clearProps: \"x,y,scale,transform\" });\n}\nfunction initializePopupTriggers() {\n    // Initialize Popup Open Triggers\n    const openTriggers = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_4__.getAllPetalElementsOfType)(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_OPEN);\n    console.log(`🌸 Detected ${openTriggers.length} open trigger(s)`);\n    forEachPopupTrigger(openTriggers, (petal) => {\n        const { trigger } = petal;\n        console.log(`  → Open trigger for: \"${petal.name}\"`);\n        trigger.addEventListener(\"click\", () => openPopup(petal));\n    });\n    // Initialize Popup Close Triggers\n    const closeTriggers = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_4__.getAllPetalElementsOfType)(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_CLOSE);\n    console.log(`🌸 Detected ${closeTriggers.length} close trigger(s)`);\n    forEachPopupTrigger(closeTriggers, (petal) => {\n        const { trigger } = petal;\n        console.log(`  → Close trigger for: \"${petal.name}\"`);\n        trigger.addEventListener(\"click\", () => closePopup(petal));\n    });\n    // Initialize Mask Close Triggers (masks with petal-mask-close=\"true\")\n    const popups = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_4__.getAllPetalElementsOfType)(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_POPUP);\n    popups.forEach((popup) => {\n        const mask = findPopupElement(popup, \"mask\");\n        const maskClose = popup.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_MASK_CLOSE) === \"true\";\n        if (mask && maskClose) {\n            mask.addEventListener(\"click\", () => {\n                const slot = findPopupElement(popup, \"slot\");\n                const name = popup.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_NAME) || popup.id;\n                if (slot) {\n                    closePopup({ name, popup: popup, slot, mask, trigger: mask });\n                }\n            });\n        }\n    });\n}\nfunction findPetal(el) {\n    const popupName = el.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_NAME);\n    if (!popupName)\n        throw new _lib_console__WEBPACK_IMPORTED_MODULE_1__.MissingNameError(el);\n    const popup = document.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_NAME}='${popupName}'][${_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_ELEMENT}='${_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_POPUP}']`);\n    if (!popup)\n        throw new _lib_console__WEBPACK_IMPORTED_MODULE_1__.MissingPopupError(popupName, el);\n    return popup;\n}\nfunction findPopupElement(popup, attr) {\n    return popup.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_ELEMENT}='${attr}']`);\n}\n// Helper to iterate over triggers with error handling\nfunction forEachPopupTrigger(triggers, callback) {\n    triggers.forEach((trigger) => {\n        try {\n            const popup = findPetal(trigger);\n            const name = trigger.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_NAME) || \"unknown\";\n            const mask = popup.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_ELEMENT}='mask']`);\n            if (!mask)\n                throw new _lib_console__WEBPACK_IMPORTED_MODULE_1__.MissingMaskError(name, trigger);\n            const slot = popup.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_3__.ATTR_PETAL_ELEMENT}='slot']`);\n            if (!slot)\n                throw new _lib_console__WEBPACK_IMPORTED_MODULE_1__.MissingSlotError(name, trigger);\n            callback({ name, trigger: trigger, popup, mask, slot });\n        }\n        catch (error) {\n            if (error instanceof _lib_console__WEBPACK_IMPORTED_MODULE_1__.PetalError) {\n                // Log and skip invalid triggers\n                console.error(`[${error.name}]:`, error.message, error.element);\n            }\n            else {\n                throw error; // Re-throw unexpected errors\n            }\n        }\n    });\n}\n\n\n//# sourceURL=webpack://petal/./src/popup.ts?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _modules_popup_popup__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./modules/popup/popup */ \"./src/modules/popup/popup.ts\");\n/* harmony import */ var _modules_banner_banner__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./modules/banner/banner */ \"./src/modules/banner/banner.ts\");\n/* harmony import */ var _modules_dropdown_dropdown__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./modules/dropdown/dropdown */ \"./src/modules/dropdown/dropdown.ts\");\n/* harmony import */ var _petal_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./petal.css */ \"./src/petal.css\");\n/* harmony import */ var _lib_dropdown_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./lib/dropdown.css */ \"./src/lib/dropdown.css\");\n\n\n\n\n\nconsole.log(`🌸 Hello from Wellflow Petal v${\"0.0.62\"}`);\n(0,_modules_popup_popup__WEBPACK_IMPORTED_MODULE_0__.initializeAllPopups)();\n(0,_modules_popup_popup__WEBPACK_IMPORTED_MODULE_0__.initializePopupTriggers)();\n(0,_modules_banner_banner__WEBPACK_IMPORTED_MODULE_1__.initializeBanner)();\n(0,_modules_dropdown_dropdown__WEBPACK_IMPORTED_MODULE_2__.initializeDropdowns)();\n\n\n//# sourceURL=webpack://petal/./src/petal.ts?");
 
 /***/ }),
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "well-petal",
-  "version": "0.0.60",
+  "version": "0.0.62",
   "description": "Webflow Popups powered by attributes",
   "main": "dist/petal.js",
   "files": [