well-petal 0.0.61 → 0.0.63
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/petal.js +77 -47
- package/package.json +1 -1
package/dist/petal.js
CHANGED
|
@@ -20,13 +20,13 @@ return /******/ (() => { // webpackBootstrap
|
|
|
20
20
|
/******/ "use strict";
|
|
21
21
|
/******/ var __webpack_modules__ = ({
|
|
22
22
|
|
|
23
|
-
/***/ "./node_modules/css-loader/dist/cjs.js!./src/
|
|
24
|
-
|
|
25
|
-
!*** ./node_modules/css-loader/dist/cjs.js!./src/
|
|
26
|
-
|
|
23
|
+
/***/ "./node_modules/css-loader/dist/cjs.js!./src/modules/dropdown/dropdown.css":
|
|
24
|
+
/*!*********************************************************************************!*\
|
|
25
|
+
!*** ./node_modules/css-loader/dist/cjs.js!./src/modules/dropdown/dropdown.css ***!
|
|
26
|
+
\*********************************************************************************/
|
|
27
27
|
/***/ ((module, __webpack_exports__, __webpack_require__) => {
|
|
28
28
|
|
|
29
|
-
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");
|
|
29
|
+
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/modules/dropdown/dropdown.css?./node_modules/css-loader/dist/cjs.js");
|
|
30
30
|
|
|
31
31
|
/***/ }),
|
|
32
32
|
|
|
@@ -160,16 +160,6 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
160
160
|
|
|
161
161
|
/***/ }),
|
|
162
162
|
|
|
163
|
-
/***/ "./src/banner.ts":
|
|
164
|
-
/*!***********************!*\
|
|
165
|
-
!*** ./src/banner.ts ***!
|
|
166
|
-
\***********************/
|
|
167
|
-
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
168
|
-
|
|
169
|
-
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?");
|
|
170
|
-
|
|
171
|
-
/***/ }),
|
|
172
|
-
|
|
173
163
|
/***/ "./src/lib/animations.ts":
|
|
174
164
|
/*!*******************************!*\
|
|
175
165
|
!*** ./src/lib/animations.ts ***!
|
|
@@ -186,7 +176,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
186
176
|
\*******************************/
|
|
187
177
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
188
178
|
|
|
189
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ ARIA_EXPANDED: () => (/* binding */ ARIA_EXPANDED),\n/* harmony export */ ATTR_ALLOW_CLOSE: () => (/* binding */ ATTR_ALLOW_CLOSE),\n/* harmony export */ ATTR_PETAL_ANIM_CLOSE: () => (/* binding */ ATTR_PETAL_ANIM_CLOSE),\n/* harmony export */ ATTR_PETAL_ANIM_CLOSE_MOBILE: () => (/* binding */ ATTR_PETAL_ANIM_CLOSE_MOBILE),\n/* harmony export */ ATTR_PETAL_ANIM_OPEN: () => (/* binding */ ATTR_PETAL_ANIM_OPEN),\n/* harmony export */ ATTR_PETAL_ANIM_OPEN_MOBILE: () => (/* binding */ ATTR_PETAL_ANIM_OPEN_MOBILE),\n/* harmony export */ ATTR_PETAL_BANNER: () => (/* binding */ ATTR_PETAL_BANNER),\n/* harmony export */ ATTR_PETAL_BANNER_CLOSE: () => (/* binding */ ATTR_PETAL_BANNER_CLOSE),\n/* harmony export */ ATTR_PETAL_BANNER_CLOSED_CLASS: () => (/* binding */ ATTR_PETAL_BANNER_CLOSED_CLASS),\n/* harmony export */ ATTR_PETAL_CLOSE: () => (/* binding */ ATTR_PETAL_CLOSE),\n/* harmony export */ ATTR_PETAL_DROPDOWN: () => (/* binding */ ATTR_PETAL_DROPDOWN),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM_CLOSE_SPEED: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM_CLOSE_SPEED),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM_MOBILE: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM_MOBILE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM_MOBILE_LANDSCAPE: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM_MOBILE_LANDSCAPE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM_OFFSET: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM_OFFSET),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM_OFFSET_MOBILE: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM_OFFSET_MOBILE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM_OFFSET_MOBILE_LANDSCAPE: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM_OFFSET_MOBILE_LANDSCAPE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM_OFFSET_TABLET: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM_OFFSET_TABLET),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM_OPEN_SPEED: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM_OPEN_SPEED),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM_TABLET: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM_TABLET),\n/* harmony export */ ATTR_PETAL_DROPDOWN_BACKDROP: () => (/* binding */ ATTR_PETAL_DROPDOWN_BACKDROP),\n/* harmony export */ ATTR_PETAL_DROPDOWN_CLOSE: () => (/* binding */ ATTR_PETAL_DROPDOWN_CLOSE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_CLOSE_DELAY: () => (/* binding */ ATTR_PETAL_DROPDOWN_CLOSE_DELAY),\n/* harmony export */ ATTR_PETAL_DROPDOWN_GROUP: () => (/* binding */ ATTR_PETAL_DROPDOWN_GROUP),\n/* harmony export */ ATTR_PETAL_DROPDOWN_MENU: () => (/* binding */ ATTR_PETAL_DROPDOWN_MENU),\n/* harmony export */ ATTR_PETAL_DROPDOWN_MENU_BOX: () => (/* binding */ ATTR_PETAL_DROPDOWN_MENU_BOX),\n/* harmony export */ ATTR_PETAL_DROPDOWN_OPEN_DELAY: () => (/* binding */ ATTR_PETAL_DROPDOWN_OPEN_DELAY),\n/* harmony export */ ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER: () => (/* binding */ ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER),\n/* harmony export */ ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_MOBILE: () => (/* binding */ ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_MOBILE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_MOBILE_LANDSCAPE: () => (/* binding */ ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_MOBILE_LANDSCAPE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_TABLET: () => (/* binding */ ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_TABLET),\n/* harmony export */ ATTR_PETAL_DROPDOWN_OPEN_ON_MOBILE: () => (/* binding */ ATTR_PETAL_DROPDOWN_OPEN_ON_MOBILE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_OPEN_ON_MOBILE_LANDSCAPE: () => (/* binding */ ATTR_PETAL_DROPDOWN_OPEN_ON_MOBILE_LANDSCAPE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_OPEN_ON_TABLET: () => (/* binding */ ATTR_PETAL_DROPDOWN_OPEN_ON_TABLET),\n/* harmony export */ ATTR_PETAL_DROPDOWN_OVERLAY: () => (/* binding */ ATTR_PETAL_DROPDOWN_OVERLAY),\n/* harmony export */ ATTR_PETAL_DROPDOWN_SCROLL: () => (/* binding */ ATTR_PETAL_DROPDOWN_SCROLL),\n/* harmony export */ ATTR_PETAL_DROPDOWN_SHOW_MENU: () => (/* binding */ ATTR_PETAL_DROPDOWN_SHOW_MENU),\n/* harmony export */ ATTR_PETAL_DROPDOWN_TOGGLE: () => (/* binding */ ATTR_PETAL_DROPDOWN_TOGGLE),\n/* harmony export */ ATTR_PETAL_DURATION: () => (/* binding */ ATTR_PETAL_DURATION),\n/* harmony export */ ATTR_PETAL_ELEMENT: () => (/* binding */ ATTR_PETAL_ELEMENT),\n/* harmony export */ ATTR_PETAL_MASK: () => (/* binding */ ATTR_PETAL_MASK),\n/* harmony export */ ATTR_PETAL_MASK_CLOSE: () => (/* binding */ ATTR_PETAL_MASK_CLOSE),\n/* harmony export */ ATTR_PETAL_MASK_OPACITY: () => (/* binding */ ATTR_PETAL_MASK_OPACITY),\n/* harmony export */ ATTR_PETAL_NAME: () => (/* binding */ ATTR_PETAL_NAME),\n/* harmony export */ ATTR_PETAL_OPEN: () => (/* binding */ ATTR_PETAL_OPEN),\n/* harmony export */ ATTR_PETAL_POPUP: () => (/* binding */ ATTR_PETAL_POPUP),\n/* harmony export */ ATTR_PETAL_SESSION_TTL: () => (/* binding */ ATTR_PETAL_SESSION_TTL),\n/* harmony export */ ATTR_PETAL_SHOW_DELAY: () => (/* binding */ ATTR_PETAL_SHOW_DELAY),\n/* harmony export */ ATTR_PETAL_SHOW_ONCE: () => (/* binding */ ATTR_PETAL_SHOW_ONCE),\n/* harmony export */ ATTR_PETAL_SLOT: () => (/* binding */ ATTR_PETAL_SLOT),\n/* harmony export */ CLASS_DROPDOWN_OPEN: () => (/* binding */ CLASS_DROPDOWN_OPEN)\n/* harmony export */ });\n// BASE\nconst ATTR_PETAL_NAME = \"petal\";\nconst ATTR_PETAL_ELEMENT = \"petal-el\";\n// BEHAVIOR\nconst ATTR_PETAL_SHOW_ONCE = \"petal-show-once\"; // Regardless of other settings, only show the popup once per user session\nconst ATTR_PETAL_SHOW_DELAY = \"petal-show-delay\"; // Time to wait before showing popup (in seconds)\nconst ATTR_PETAL_SESSION_TTL = \"petal-session-ttl\"; // Time to keep user session (in hours)\n/**-------------------------*\n * POPUP\n *--------------------------*/\n// ELEMENTS\nconst ATTR_PETAL_POPUP = \"popup\";\nconst ATTR_PETAL_OPEN = \"open\";\nconst ATTR_PETAL_CLOSE = \"close\";\nconst ATTR_PETAL_MASK = \"mask\";\nconst ATTR_PETAL_SLOT = \"slot\";\n// MASK\nconst ATTR_PETAL_MASK_OPACITY = \"petal-mask-opacity\";\nconst ATTR_PETAL_MASK_CLOSE = \"petal-mask-close\";\n// ANIMATIONS\nconst ATTR_PETAL_ANIM_OPEN = \"petal-anim-open\";\nconst ATTR_PETAL_ANIM_CLOSE = \"petal-anim-close\";\nconst ATTR_PETAL_ANIM_OPEN_MOBILE = \"petal-anim-open-mobile\";\nconst ATTR_PETAL_ANIM_CLOSE_MOBILE = \"petal-anim-close-mobile\";\nconst ATTR_PETAL_DURATION = \"petal-duration\";\n/**-------------------------*\n *
|
|
179
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ ARIA_EXPANDED: () => (/* binding */ ARIA_EXPANDED),\n/* harmony export */ ATTR_ALLOW_CLOSE: () => (/* binding */ ATTR_ALLOW_CLOSE),\n/* harmony export */ ATTR_PETAL_ANIM_CLOSE: () => (/* binding */ ATTR_PETAL_ANIM_CLOSE),\n/* harmony export */ ATTR_PETAL_ANIM_CLOSE_MOBILE: () => (/* binding */ ATTR_PETAL_ANIM_CLOSE_MOBILE),\n/* harmony export */ ATTR_PETAL_ANIM_OPEN: () => (/* binding */ ATTR_PETAL_ANIM_OPEN),\n/* harmony export */ ATTR_PETAL_ANIM_OPEN_MOBILE: () => (/* binding */ ATTR_PETAL_ANIM_OPEN_MOBILE),\n/* harmony export */ ATTR_PETAL_BANNER: () => (/* binding */ ATTR_PETAL_BANNER),\n/* harmony export */ ATTR_PETAL_BANNER_CLOSE: () => (/* binding */ ATTR_PETAL_BANNER_CLOSE),\n/* harmony export */ ATTR_PETAL_BANNER_CLOSED_CLASS: () => (/* binding */ ATTR_PETAL_BANNER_CLOSED_CLASS),\n/* harmony export */ ATTR_PETAL_CLOSE: () => (/* binding */ ATTR_PETAL_CLOSE),\n/* harmony export */ ATTR_PETAL_DROPDOWN: () => (/* binding */ ATTR_PETAL_DROPDOWN),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM_CLOSE_SPEED: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM_CLOSE_SPEED),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM_MOBILE: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM_MOBILE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM_MOBILE_LANDSCAPE: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM_MOBILE_LANDSCAPE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM_OFFSET: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM_OFFSET),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM_OFFSET_MOBILE: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM_OFFSET_MOBILE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM_OFFSET_MOBILE_LANDSCAPE: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM_OFFSET_MOBILE_LANDSCAPE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM_OFFSET_TABLET: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM_OFFSET_TABLET),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM_OPEN_SPEED: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM_OPEN_SPEED),\n/* harmony export */ ATTR_PETAL_DROPDOWN_ANIM_TABLET: () => (/* binding */ ATTR_PETAL_DROPDOWN_ANIM_TABLET),\n/* harmony export */ ATTR_PETAL_DROPDOWN_BACKDROP: () => (/* binding */ ATTR_PETAL_DROPDOWN_BACKDROP),\n/* harmony export */ ATTR_PETAL_DROPDOWN_CLOSE: () => (/* binding */ ATTR_PETAL_DROPDOWN_CLOSE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_CLOSE_DELAY: () => (/* binding */ ATTR_PETAL_DROPDOWN_CLOSE_DELAY),\n/* harmony export */ ATTR_PETAL_DROPDOWN_GROUP: () => (/* binding */ ATTR_PETAL_DROPDOWN_GROUP),\n/* harmony export */ ATTR_PETAL_DROPDOWN_MENU: () => (/* binding */ ATTR_PETAL_DROPDOWN_MENU),\n/* harmony export */ ATTR_PETAL_DROPDOWN_MENU_BOX: () => (/* binding */ ATTR_PETAL_DROPDOWN_MENU_BOX),\n/* harmony export */ ATTR_PETAL_DROPDOWN_OPEN_DELAY: () => (/* binding */ ATTR_PETAL_DROPDOWN_OPEN_DELAY),\n/* harmony export */ ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER: () => (/* binding */ ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER),\n/* harmony export */ ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_MOBILE: () => (/* binding */ ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_MOBILE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_MOBILE_LANDSCAPE: () => (/* binding */ ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_MOBILE_LANDSCAPE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_TABLET: () => (/* binding */ ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_TABLET),\n/* harmony export */ ATTR_PETAL_DROPDOWN_OPEN_ON_MOBILE: () => (/* binding */ ATTR_PETAL_DROPDOWN_OPEN_ON_MOBILE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_OPEN_ON_MOBILE_LANDSCAPE: () => (/* binding */ ATTR_PETAL_DROPDOWN_OPEN_ON_MOBILE_LANDSCAPE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_OPEN_ON_TABLET: () => (/* binding */ ATTR_PETAL_DROPDOWN_OPEN_ON_TABLET),\n/* harmony export */ ATTR_PETAL_DROPDOWN_OVERLAY: () => (/* binding */ ATTR_PETAL_DROPDOWN_OVERLAY),\n/* harmony export */ ATTR_PETAL_DROPDOWN_SCROLL: () => (/* binding */ ATTR_PETAL_DROPDOWN_SCROLL),\n/* harmony export */ ATTR_PETAL_DROPDOWN_SHOW_MENU: () => (/* binding */ ATTR_PETAL_DROPDOWN_SHOW_MENU),\n/* harmony export */ ATTR_PETAL_DROPDOWN_TOGGLE: () => (/* binding */ ATTR_PETAL_DROPDOWN_TOGGLE),\n/* harmony export */ ATTR_PETAL_DURATION: () => (/* binding */ ATTR_PETAL_DURATION),\n/* harmony export */ ATTR_PETAL_ELEMENT: () => (/* binding */ ATTR_PETAL_ELEMENT),\n/* harmony export */ ATTR_PETAL_MASK: () => (/* binding */ ATTR_PETAL_MASK),\n/* harmony export */ ATTR_PETAL_MASK_CLOSE: () => (/* binding */ ATTR_PETAL_MASK_CLOSE),\n/* harmony export */ ATTR_PETAL_MASK_OPACITY: () => (/* binding */ ATTR_PETAL_MASK_OPACITY),\n/* harmony export */ ATTR_PETAL_NAME: () => (/* binding */ ATTR_PETAL_NAME),\n/* harmony export */ ATTR_PETAL_NAV: () => (/* binding */ ATTR_PETAL_NAV),\n/* harmony export */ ATTR_PETAL_NAV_SECONDARY: () => (/* binding */ ATTR_PETAL_NAV_SECONDARY),\n/* harmony export */ ATTR_PETAL_OPEN: () => (/* binding */ ATTR_PETAL_OPEN),\n/* harmony export */ ATTR_PETAL_POPUP: () => (/* binding */ ATTR_PETAL_POPUP),\n/* harmony export */ ATTR_PETAL_POSITION: () => (/* binding */ ATTR_PETAL_POSITION),\n/* harmony export */ ATTR_PETAL_SESSION_TTL: () => (/* binding */ ATTR_PETAL_SESSION_TTL),\n/* harmony export */ ATTR_PETAL_SHOW_DELAY: () => (/* binding */ ATTR_PETAL_SHOW_DELAY),\n/* harmony export */ ATTR_PETAL_SHOW_ONCE: () => (/* binding */ ATTR_PETAL_SHOW_ONCE),\n/* harmony export */ ATTR_PETAL_SLOT: () => (/* binding */ ATTR_PETAL_SLOT),\n/* harmony export */ CLASS_DROPDOWN_OPEN: () => (/* binding */ CLASS_DROPDOWN_OPEN)\n/* harmony export */ });\n// BASE\nconst ATTR_PETAL_NAME = \"petal\";\nconst ATTR_PETAL_ELEMENT = \"petal-el\";\n// BEHAVIOR\nconst ATTR_PETAL_SHOW_ONCE = \"petal-show-once\"; // Regardless of other settings, only show the popup once per user session\nconst ATTR_PETAL_SHOW_DELAY = \"petal-show-delay\"; // Time to wait before showing popup (in seconds)\nconst ATTR_PETAL_SESSION_TTL = \"petal-session-ttl\"; // Time to keep user session (in hours)\n/**-------------------------*\n * POPUP\n *--------------------------*/\n// ELEMENTS\nconst ATTR_PETAL_POPUP = \"popup\";\nconst ATTR_PETAL_OPEN = \"open\";\nconst ATTR_PETAL_CLOSE = \"close\";\nconst ATTR_PETAL_MASK = \"mask\";\nconst ATTR_PETAL_SLOT = \"slot\";\n// MASK\nconst ATTR_PETAL_MASK_OPACITY = \"petal-mask-opacity\";\nconst ATTR_PETAL_MASK_CLOSE = \"petal-mask-close\";\n// ANIMATIONS\nconst ATTR_PETAL_ANIM_OPEN = \"petal-anim-open\";\nconst ATTR_PETAL_ANIM_CLOSE = \"petal-anim-close\";\nconst ATTR_PETAL_ANIM_OPEN_MOBILE = \"petal-anim-open-mobile\";\nconst ATTR_PETAL_ANIM_CLOSE_MOBILE = \"petal-anim-close-mobile\";\nconst ATTR_PETAL_DURATION = \"petal-duration\";\n/**-------------------------*\n * NAV\n *--------------------------*/\n// ELEMENTS\nconst ATTR_PETAL_NAV = \"nav\";\nconst ATTR_PETAL_NAV_SECONDARY = \"nav-secondary\";\nconst ATTR_PETAL_BANNER = \"banner\";\nconst ATTR_PETAL_BANNER_CLOSE = \"banner-close\";\n// SETTINGS\nconst ATTR_ALLOW_CLOSE = \"petal-allow-close\";\nconst ATTR_PETAL_POSITION = \"petal-position\";\n// CSS\nconst ATTR_PETAL_BANNER_CLOSED_CLASS = \"petal-hide-nav-banner\";\n/**-------------------------*\n * DROPDOWN\n *--------------------------*/\n// ELEMENTS\nconst ATTR_PETAL_DROPDOWN = \"dropdown\";\nconst ATTR_PETAL_DROPDOWN_TOGGLE = \"dropdown-toggle\";\nconst ATTR_PETAL_DROPDOWN_MENU = \"dropdown-menu\";\nconst ATTR_PETAL_DROPDOWN_MENU_BOX = \"dropdown-drawer\";\nconst ATTR_PETAL_DROPDOWN_OVERLAY = \"dropdown-overlay\";\nconst ATTR_PETAL_DROPDOWN_CLOSE = \"dropdown-close\";\nconst ATTR_PETAL_DROPDOWN_SCROLL = \"dropdown-scroll\";\nconst ATTR_PETAL_DROPDOWN_BACKDROP = \"dropdown-backdrop\";\n// BEHAVIOR\nconst ATTR_PETAL_DROPDOWN_GROUP = \"petal-dropdown-group\";\nconst ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER = \"petal-dropdown-open-on-hover\";\nconst ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_TABLET = \"petal-dropdown-open-on-hover-tablet\";\nconst ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_MOBILE_LANDSCAPE = \"petal-dropdown-open-on-hover-mobile-landscape\";\nconst ATTR_PETAL_DROPDOWN_OPEN_ON_HOVER_MOBILE = \"petal-dropdown-open-on-hover-mobile\";\nconst ATTR_PETAL_DROPDOWN_OPEN_DELAY = \"petal-dropdown-open-delay\";\nconst ATTR_PETAL_DROPDOWN_CLOSE_DELAY = \"petal-dropdown-close-delay\";\nconst ATTR_PETAL_DROPDOWN_SHOW_MENU = \"petal-dropdown-show-menu\";\nconst ATTR_PETAL_DROPDOWN_OPEN_ON_MOBILE = \"petal-dropdown-open-on-mobile\";\nconst ATTR_PETAL_DROPDOWN_OPEN_ON_MOBILE_LANDSCAPE = \"petal-dropdown-open-on-mobile-landscape\";\nconst ATTR_PETAL_DROPDOWN_OPEN_ON_TABLET = \"petal-dropdown-open-on-tablet\";\n// ANIMATIONS\nconst ATTR_PETAL_DROPDOWN_ANIM = \"petal-dropdown-anim\";\nconst ATTR_PETAL_DROPDOWN_ANIM_TABLET = \"petal-dropdown-anim-tablet\";\nconst ATTR_PETAL_DROPDOWN_ANIM_MOBILE_LANDSCAPE = \"petal-dropdown-anim-mobile-landscape\";\nconst ATTR_PETAL_DROPDOWN_ANIM_MOBILE = \"petal-dropdown-anim-mobile\";\nconst ATTR_PETAL_DROPDOWN_ANIM_OPEN_SPEED = \"petal-dropdown-anim-open-speed\";\nconst ATTR_PETAL_DROPDOWN_ANIM_CLOSE_SPEED = \"petal-dropdown-anim-close-speed\";\nconst ATTR_PETAL_DROPDOWN_ANIM_OFFSET = \"petal-dropdown-anim-offset\";\nconst ATTR_PETAL_DROPDOWN_ANIM_OFFSET_TABLET = \"petal-dropdown-anim-offset-tablet\";\nconst ATTR_PETAL_DROPDOWN_ANIM_OFFSET_MOBILE_LANDSCAPE = \"petal-dropdown-anim-offset-mobile-landscape\";\nconst ATTR_PETAL_DROPDOWN_ANIM_OFFSET_MOBILE = \"petal-dropdown-anim-offset-mobile\";\n// CSS CLASSES\nconst CLASS_DROPDOWN_OPEN = \"w--open\";\n// ARIA ATTRIBUTES\nconst ARIA_EXPANDED = \"aria-expanded\";\n\n\n//# sourceURL=webpack://petal/./src/lib/attributes.ts?");
|
|
190
180
|
|
|
191
181
|
/***/ }),
|
|
192
182
|
|
|
@@ -210,26 +200,6 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
210
200
|
|
|
211
201
|
/***/ }),
|
|
212
202
|
|
|
213
|
-
/***/ "./src/lib/dropdown.css":
|
|
214
|
-
/*!******************************!*\
|
|
215
|
-
!*** ./src/lib/dropdown.css ***!
|
|
216
|
-
\******************************/
|
|
217
|
-
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
218
|
-
|
|
219
|
-
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_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! !../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js */ \"./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! !../../node_modules/style-loader/dist/runtime/styleDomAPI.js */ \"./node_modules/style-loader/dist/runtime/styleDomAPI.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! !../../node_modules/style-loader/dist/runtime/insertBySelector.js */ \"./node_modules/style-loader/dist/runtime/insertBySelector.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! !../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js */ \"./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! !../../node_modules/style-loader/dist/runtime/insertStyleElement.js */ \"./node_modules/style-loader/dist/runtime/insertStyleElement.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! !../../node_modules/style-loader/dist/runtime/styleTagTransform.js */ \"./node_modules/style-loader/dist/runtime/styleTagTransform.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5__);\n/* harmony import */ var _node_modules_css_loader_dist_cjs_js_dropdown_css__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! !!../../node_modules/css-loader/dist/cjs.js!./dropdown.css */ \"./node_modules/css-loader/dist/cjs.js!./src/lib/dropdown.css\");\n\n \n \n \n \n \n \n \n \n \n\nvar options = {};\n\noptions.styleTagTransform = (_node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5___default());\noptions.setAttributes = (_node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3___default());\noptions.insert = _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2___default().bind(null, \"head\");\noptions.domAPI = (_node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1___default());\noptions.insertStyleElement = (_node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4___default());\n\nvar update = _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0___default()(_node_modules_css_loader_dist_cjs_js_dropdown_css__WEBPACK_IMPORTED_MODULE_6__[\"default\"], options);\n\n\n\n\n /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_node_modules_css_loader_dist_cjs_js_dropdown_css__WEBPACK_IMPORTED_MODULE_6__[\"default\"] && _node_modules_css_loader_dist_cjs_js_dropdown_css__WEBPACK_IMPORTED_MODULE_6__[\"default\"].locals ? _node_modules_css_loader_dist_cjs_js_dropdown_css__WEBPACK_IMPORTED_MODULE_6__[\"default\"].locals : undefined);\n\n\n//# sourceURL=webpack://petal/./src/lib/dropdown.css?");
|
|
220
|
-
|
|
221
|
-
/***/ }),
|
|
222
|
-
|
|
223
|
-
/***/ "./src/lib/dropdown.ts":
|
|
224
|
-
/*!*****************************!*\
|
|
225
|
-
!*** ./src/lib/dropdown.ts ***!
|
|
226
|
-
\*****************************/
|
|
227
|
-
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
228
|
-
|
|
229
|
-
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?");
|
|
230
|
-
|
|
231
|
-
/***/ }),
|
|
232
|
-
|
|
233
203
|
/***/ "./src/lib/helpers.ts":
|
|
234
204
|
/*!****************************!*\
|
|
235
205
|
!*** ./src/lib/helpers.ts ***!
|
|
@@ -250,6 +220,76 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
250
220
|
|
|
251
221
|
/***/ }),
|
|
252
222
|
|
|
223
|
+
/***/ "./src/modules/dropdown/dropdown-animator.ts":
|
|
224
|
+
/*!***************************************************!*\
|
|
225
|
+
!*** ./src/modules/dropdown/dropdown-animator.ts ***!
|
|
226
|
+
\***************************************************/
|
|
227
|
+
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
228
|
+
|
|
229
|
+
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?");
|
|
230
|
+
|
|
231
|
+
/***/ }),
|
|
232
|
+
|
|
233
|
+
/***/ "./src/modules/dropdown/dropdown-config.ts":
|
|
234
|
+
/*!*************************************************!*\
|
|
235
|
+
!*** ./src/modules/dropdown/dropdown-config.ts ***!
|
|
236
|
+
\*************************************************/
|
|
237
|
+
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
238
|
+
|
|
239
|
+
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?");
|
|
240
|
+
|
|
241
|
+
/***/ }),
|
|
242
|
+
|
|
243
|
+
/***/ "./src/modules/dropdown/dropdown-controller.ts":
|
|
244
|
+
/*!*****************************************************!*\
|
|
245
|
+
!*** ./src/modules/dropdown/dropdown-controller.ts ***!
|
|
246
|
+
\*****************************************************/
|
|
247
|
+
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
248
|
+
|
|
249
|
+
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?");
|
|
250
|
+
|
|
251
|
+
/***/ }),
|
|
252
|
+
|
|
253
|
+
/***/ "./src/modules/dropdown/dropdown.css":
|
|
254
|
+
/*!*******************************************!*\
|
|
255
|
+
!*** ./src/modules/dropdown/dropdown.css ***!
|
|
256
|
+
\*******************************************/
|
|
257
|
+
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
258
|
+
|
|
259
|
+
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_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! !../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js */ \"./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! !../../../node_modules/style-loader/dist/runtime/styleDomAPI.js */ \"./node_modules/style-loader/dist/runtime/styleDomAPI.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! !../../../node_modules/style-loader/dist/runtime/insertBySelector.js */ \"./node_modules/style-loader/dist/runtime/insertBySelector.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! !../../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js */ \"./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! !../../../node_modules/style-loader/dist/runtime/insertStyleElement.js */ \"./node_modules/style-loader/dist/runtime/insertStyleElement.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! !../../../node_modules/style-loader/dist/runtime/styleTagTransform.js */ \"./node_modules/style-loader/dist/runtime/styleTagTransform.js\");\n/* harmony import */ var _node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5__);\n/* harmony import */ var _node_modules_css_loader_dist_cjs_js_dropdown_css__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! !!../../../node_modules/css-loader/dist/cjs.js!./dropdown.css */ \"./node_modules/css-loader/dist/cjs.js!./src/modules/dropdown/dropdown.css\");\n\n \n \n \n \n \n \n \n \n \n\nvar options = {};\n\noptions.styleTagTransform = (_node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5___default());\noptions.setAttributes = (_node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3___default());\noptions.insert = _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2___default().bind(null, \"head\");\noptions.domAPI = (_node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1___default());\noptions.insertStyleElement = (_node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4___default());\n\nvar update = _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0___default()(_node_modules_css_loader_dist_cjs_js_dropdown_css__WEBPACK_IMPORTED_MODULE_6__[\"default\"], options);\n\n\n\n\n /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_node_modules_css_loader_dist_cjs_js_dropdown_css__WEBPACK_IMPORTED_MODULE_6__[\"default\"] && _node_modules_css_loader_dist_cjs_js_dropdown_css__WEBPACK_IMPORTED_MODULE_6__[\"default\"].locals ? _node_modules_css_loader_dist_cjs_js_dropdown_css__WEBPACK_IMPORTED_MODULE_6__[\"default\"].locals : undefined);\n\n\n//# sourceURL=webpack://petal/./src/modules/dropdown/dropdown.css?");
|
|
260
|
+
|
|
261
|
+
/***/ }),
|
|
262
|
+
|
|
263
|
+
/***/ "./src/modules/dropdown/dropdown.ts":
|
|
264
|
+
/*!******************************************!*\
|
|
265
|
+
!*** ./src/modules/dropdown/dropdown.ts ***!
|
|
266
|
+
\******************************************/
|
|
267
|
+
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
268
|
+
|
|
269
|
+
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 * - Named element linking (petal=\"name\")\n *\n * HTML Attributes (defined in attributes.ts):\n * - petal=\"name\" (optional) - Links elements together by name. When set on a dropdown container,\n * all related elements (toggle, menu, overlay, close) must have the same petal=\"name\" attribute.\n * Elements are matched by both name and type before firing their behavior.\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 // Get the name attribute from the dropdown container\n const petalName = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_NAME);\n if (petalName) {\n console.log(`Dropdown ${index + 1} - Name: \"${petalName}\"`);\n }\n else {\n console.warn(`Dropdown ${index + 1} - WARNING: No petal name attribute found. Elements will be searched within dropdown container only.`);\n }\n // Build selectors that match elements by both name and type\n const buildSelector = (elementType) => {\n if (petalName) {\n return `[${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_NAME}='${petalName}'][${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ELEMENT}='${elementType}']`;\n }\n return `[${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ELEMENT}='${elementType}']`;\n };\n const toggle = petalName\n ? document.querySelector(buildSelector(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_TOGGLE))\n : dropdown.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ELEMENT}='${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_TOGGLE}']`);\n const menu = petalName\n ? document.querySelector(buildSelector(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_MENU))\n : dropdown.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ELEMENT}='${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_MENU}']`);\n const overlay = petalName\n ? document.querySelector(buildSelector(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_OVERLAY))\n : dropdown.querySelector(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ELEMENT}='${_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_OVERLAY}']`);\n const close = petalName\n ? document.querySelector(buildSelector(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_CLOSE))\n : 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?");
|
|
270
|
+
|
|
271
|
+
/***/ }),
|
|
272
|
+
|
|
273
|
+
/***/ "./src/modules/nav/banner.ts":
|
|
274
|
+
/*!***********************************!*\
|
|
275
|
+
!*** ./src/modules/nav/banner.ts ***!
|
|
276
|
+
\***********************************/
|
|
277
|
+
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
278
|
+
|
|
279
|
+
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/nav/banner.ts?");
|
|
280
|
+
|
|
281
|
+
/***/ }),
|
|
282
|
+
|
|
283
|
+
/***/ "./src/modules/popup/popup.ts":
|
|
284
|
+
/*!************************************!*\
|
|
285
|
+
!*** ./src/modules/popup/popup.ts ***!
|
|
286
|
+
\************************************/
|
|
287
|
+
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
288
|
+
|
|
289
|
+
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?");
|
|
290
|
+
|
|
291
|
+
/***/ }),
|
|
292
|
+
|
|
253
293
|
/***/ "./src/petal.css":
|
|
254
294
|
/*!***********************!*\
|
|
255
295
|
!*** ./src/petal.css ***!
|
|
@@ -266,17 +306,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
266
306
|
\**********************/
|
|
267
307
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
268
308
|
|
|
269
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var
|
|
270
|
-
|
|
271
|
-
/***/ }),
|
|
272
|
-
|
|
273
|
-
/***/ "./src/popup.ts":
|
|
274
|
-
/*!**********************!*\
|
|
275
|
-
!*** ./src/popup.ts ***!
|
|
276
|
-
\**********************/
|
|
277
|
-
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
278
|
-
|
|
279
|
-
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?");
|
|
309
|
+
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_nav_banner__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./modules/nav/banner */ \"./src/modules/nav/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 _modules_dropdown_dropdown_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./modules/dropdown/dropdown.css */ \"./src/modules/dropdown/dropdown.css\");\n\n\n\n\n\nconsole.log(`🌸 Hello from Wellflow Petal v${\"0.0.63\"}`);\n(0,_modules_popup_popup__WEBPACK_IMPORTED_MODULE_0__.initializeAllPopups)();\n(0,_modules_popup_popup__WEBPACK_IMPORTED_MODULE_0__.initializePopupTriggers)();\n(0,_modules_nav_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?");
|
|
280
310
|
|
|
281
311
|
/***/ }),
|
|
282
312
|
|