well-petal 0.0.84 → 0.0.86
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 +14 -14
- package/package.json +1 -1
package/dist/petal.js
CHANGED
|
@@ -156,7 +156,7 @@ eval("\n\n/* istanbul ignore next */\nfunction styleTagTransform(css, styleElem
|
|
|
156
156
|
\*******************************/
|
|
157
157
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
158
158
|
|
|
159
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ animations: () => (/* binding */ animations),\n/* harmony export */ clearAnimationProperties: () => (/* binding */ clearAnimationProperties),\n/* harmony export */ getReverseAnimation: () => (/* binding */ getReverseAnimation),\n/* harmony export */ isValidAnimation: () => (/* binding */ isValidAnimation),\n/* harmony export */ reverseAnimationMap: () => (/* binding */ reverseAnimationMap)\n/* harmony export */ });\n/* harmony import */ var gsap__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! gsap */ \"./node_modules/gsap/index.js\");\n/**\n * Animation Configurations\n *\n * Centralized animation definitions used by all Petal modules.\n * Returns animation configs with 'from' and 'to' states for GSAP.\n */\nvar __rest = (undefined && undefined.__rest) || function (s, e) {\n var t = {};\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\n t[p] = s[p];\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\n for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\n if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))\n t[p[i]] = s[p[i]];\n }\n return t;\n};\n\n/**\n * Validates and parses modal animation string\n */\nfunction isValidAnimation(value) {\n const validTypes = [\"scale\", \"slide-up\", \"slide-down\", \"slide-left\", \"slide-right\", \"crop-up\", \"crop-down\", \"fade-in\", \"fade-out\"];\n return validTypes.includes(value);\n}\n/**\n * Unified animation system with configurable offsets, easing, and duration\n * - For modals: use \"100%\" offset for full viewport movements\n * - For dropdowns: use small pixel offsets (e.g., 25) for subtle movements\n * - Easing: GSAP easing function (default: \"power1.inOut\")\n * - Duration: Animation duration in seconds (default: 0.5)\n */\nconst animations = {\n scale: (options) => {\n const {
|
|
159
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ animations: () => (/* binding */ animations),\n/* harmony export */ clearAnimationProperties: () => (/* binding */ clearAnimationProperties),\n/* harmony export */ getReverseAnimation: () => (/* binding */ getReverseAnimation),\n/* harmony export */ isValidAnimation: () => (/* binding */ isValidAnimation),\n/* harmony export */ reverseAnimationMap: () => (/* binding */ reverseAnimationMap)\n/* harmony export */ });\n/* harmony import */ var gsap__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! gsap */ \"./node_modules/gsap/index.js\");\n/**\n * Animation Configurations\n *\n * Centralized animation definitions used by all Petal modules.\n * Returns animation configs with 'from' and 'to' states for GSAP.\n */\nvar __rest = (undefined && undefined.__rest) || function (s, e) {\n var t = {};\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\n t[p] = s[p];\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\n for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\n if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))\n t[p[i]] = s[p[i]];\n }\n return t;\n};\n\n/**\n * Validates and parses modal animation string\n */\nfunction isValidAnimation(value) {\n const validTypes = [\"scale\", \"slide-up\", \"slide-down\", \"slide-left\", \"slide-right\", \"crop-up\", \"crop-down\", \"fade-in\", \"fade-out\"];\n return validTypes.includes(value);\n}\n/**\n * Unified animation system with configurable offsets, easing, and duration\n * - For modals: use \"100%\" offset for full viewport movements\n * - For dropdowns: use small pixel offsets (e.g., 25) for subtle movements\n * - Easing: GSAP easing function (default: \"power1.inOut\")\n * - Duration: Animation duration in seconds (default: 0.5)\n */\nconst animations = {\n scale: (options) => {\n const { ease = \"power1.inOut\", duration = 0.5 } = options || {};\n // Scale animation always scales to 1, offset is not used\n return {\n from: { scale: 0, opacity: 0 },\n to: { scale: 1, opacity: 1, ease, duration },\n };\n },\n \"slide-up\": (options) => {\n const { offset = \"100%\", ease = \"power1.inOut\", duration = 0.5 } = options || {};\n return {\n from: { x: 0, y: offset, opacity: 0 },\n to: { x: 0, y: 0, opacity: 1, ease, duration },\n };\n },\n \"slide-down\": (options) => {\n const { offset = \"100%\", ease = \"power1.inOut\", duration = 0.5 } = options || {};\n return {\n from: { x: 0, y: typeof offset === \"number\" ? -offset : `-${offset}`, opacity: 0 },\n to: { x: 0, y: 0, opacity: 1, ease, duration },\n };\n },\n \"slide-left\": (options) => {\n const { offset = \"100%\", ease = \"power1.inOut\", duration = 0.5 } = options || {};\n return {\n from: { x: offset, y: 0, opacity: 0 },\n to: { x: 0, y: 0, opacity: 1, ease, duration },\n };\n },\n \"slide-right\": (options) => {\n const { offset = \"100%\", ease = \"power1.inOut\", duration = 0.5 } = options || {};\n return {\n from: { x: typeof offset === \"number\" ? -offset : `-${offset}`, y: 0, opacity: 0 },\n to: { x: 0, y: 0, opacity: 1, ease, duration },\n };\n },\n \"crop-up\": (options) => {\n const { ease = \"power1.inOut\", duration = 0.5 } = options || {};\n return {\n from: { \"clip-path\": \"inset(100% 0% 0% 0%)\" },\n to: { \"clip-path\": \"inset(0% 0% 0% 0%)\", ease, duration },\n };\n },\n \"crop-down\": (options) => {\n const { ease = \"power1.inOut\", duration = 0.5 } = options || {};\n return {\n from: { \"clip-path\": \"inset(0% 0% 100% 0%)\" },\n to: { \"clip-path\": \"inset(0% 0% 0% 0%)\", ease, duration },\n };\n },\n \"fade-in\": (options) => {\n const { offset = \"1\", ease = \"power1.inOut\", duration = 0.5 } = options || {};\n return {\n from: { opacity: 0 },\n to: { opacity: offset, ease, duration },\n };\n },\n \"fade-out\": (options) => {\n const { offset = \"1\", ease = \"power1.inOut\", duration = 0.5 } = options || {};\n return {\n from: { opacity: offset },\n to: { opacity: 0, ease, duration },\n };\n },\n};\n// Animation reversal map (for closing animations)\nconst reverseAnimationMap = {\n scale: \"scale\",\n \"slide-up\": \"slide-down\",\n \"slide-down\": \"slide-up\",\n \"slide-left\": \"slide-right\",\n \"slide-right\": \"slide-left\",\n \"crop-up\": \"crop-down\",\n \"crop-down\": \"crop-up\",\n \"fade-in\": \"fade-out\",\n \"fade-out\": \"fade-in\",\n};\n/**\n * Gets the reverse animation config by swapping from/to\n * Important: ease and duration must stay in the 'to' state, not be swapped\n */\nfunction getReverseAnimation(animationType, options) {\n const reverseType = reverseAnimationMap[animationType];\n const anim = animations[reverseType](options);\n // Extract ease and duration from 'to' before swapping\n const _a = anim.to, { ease, duration } = _a, toWithoutEasing = __rest(_a, [\"ease\", \"duration\"]);\n // Swap from and to, but keep ease and duration in the 'to' state\n return {\n from: toWithoutEasing,\n to: Object.assign(Object.assign({}, anim.from), { ease, duration }),\n };\n}\n/**\n * Clears all animation-related properties from an element\n * This ensures clean state when switching between different animation types\n *\n * Resets:\n * - Position transforms (x, y)\n * - Scale transforms\n * - Opacity\n * - Clip-path\n * - All transforms\n */\nfunction clearAnimationProperties(element) {\n // Use GSAP's clearProps to ensure all inline styles are removed\n gsap__WEBPACK_IMPORTED_MODULE_0__.gsap.set(element, { clearProps: \"x,y,scale,opacity,clip-path,transform\" });\n}\n\n\n//# sourceURL=webpack://petal/./src/lib/animations.ts?");
|
|
160
160
|
|
|
161
161
|
/***/ }),
|
|
162
162
|
|
|
@@ -166,7 +166,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
166
166
|
\*******************************/
|
|
167
167
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
168
168
|
|
|
169
|
-
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_DURATION: () => (/* binding */ ATTR_PETAL_ANIM_CLOSE_DURATION),\n/* harmony export */ ATTR_PETAL_ANIM_CLOSE_EASE: () => (/* binding */ ATTR_PETAL_ANIM_CLOSE_EASE),\n/* harmony export */ ATTR_PETAL_ANIM_CLOSE_MOBILE: () => (/* binding */ ATTR_PETAL_ANIM_CLOSE_MOBILE),\n/* harmony export */ ATTR_PETAL_ANIM_CLOSE_MOBILE_LANDSCAPE: () => (/* binding */ ATTR_PETAL_ANIM_CLOSE_MOBILE_LANDSCAPE),\n/* harmony export */ ATTR_PETAL_ANIM_CLOSE_SPEED: () => (/* binding */ ATTR_PETAL_ANIM_CLOSE_SPEED),\n/* harmony export */ ATTR_PETAL_ANIM_CLOSE_TABLET: () => (/* binding */ ATTR_PETAL_ANIM_CLOSE_TABLET),\n/* harmony export */ ATTR_PETAL_ANIM_OFFSET: () => (/* binding */ ATTR_PETAL_ANIM_OFFSET),\n/* harmony export */ ATTR_PETAL_ANIM_OFFSET_MOBILE: () => (/* binding */ ATTR_PETAL_ANIM_OFFSET_MOBILE),\n/* harmony export */ ATTR_PETAL_ANIM_OFFSET_MOBILE_LANDSCAPE: () => (/* binding */ ATTR_PETAL_ANIM_OFFSET_MOBILE_LANDSCAPE),\n/* harmony export */ ATTR_PETAL_ANIM_OFFSET_TABLET: () => (/* binding */ ATTR_PETAL_ANIM_OFFSET_TABLET),\n/* harmony export */ ATTR_PETAL_ANIM_OPEN: () => (/* binding */ ATTR_PETAL_ANIM_OPEN),\n/* harmony export */ ATTR_PETAL_ANIM_OPEN_DURATION: () => (/* binding */ ATTR_PETAL_ANIM_OPEN_DURATION),\n/* harmony export */ ATTR_PETAL_ANIM_OPEN_EASE: () => (/* binding */ ATTR_PETAL_ANIM_OPEN_EASE),\n/* harmony export */ ATTR_PETAL_ANIM_OPEN_MOBILE: () => (/* binding */ ATTR_PETAL_ANIM_OPEN_MOBILE),\n/* harmony export */ ATTR_PETAL_ANIM_OPEN_MOBILE_LANDSCAPE: () => (/* binding */ ATTR_PETAL_ANIM_OPEN_MOBILE_LANDSCAPE),\n/* harmony export */ ATTR_PETAL_ANIM_OPEN_SPEED: () => (/* binding */ ATTR_PETAL_ANIM_OPEN_SPEED),\n/* harmony export */ ATTR_PETAL_ANIM_OPEN_TABLET: () => (/* binding */ ATTR_PETAL_ANIM_OPEN_TABLET),\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_DEBUG: () => (/* binding */ ATTR_PETAL_DEBUG),\n/* harmony export */ ATTR_PETAL_DIALOG: () => (/* binding */ ATTR_PETAL_DIALOG),\n/* harmony export */ ATTR_PETAL_DISABLE_SCROLL_ON_OPEN: () => (/* binding */ ATTR_PETAL_DISABLE_SCROLL_ON_OPEN),\n/* harmony export */ ATTR_PETAL_DROPDOWN: () => (/* binding */ ATTR_PETAL_DROPDOWN),\n/* harmony export */ ATTR_PETAL_DROPDOWN_CLOSE_DELAY: () => (/* binding */ ATTR_PETAL_DROPDOWN_CLOSE_DELAY),\n/* harmony export */ ATTR_PETAL_DROPDOWN_EXPAND_MOBILE: () => (/* binding */ ATTR_PETAL_DROPDOWN_EXPAND_MOBILE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_EXPAND_MOBILE_LANDSCAPE: () => (/* binding */ ATTR_PETAL_DROPDOWN_EXPAND_MOBILE_LANDSCAPE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_EXPAND_TABLET: () => (/* binding */ ATTR_PETAL_DROPDOWN_EXPAND_TABLET),\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_SCROLL: () => (/* binding */ ATTR_PETAL_DROPDOWN_SCROLL),\n/* harmony export */ ATTR_PETAL_DROPDOWN_SHOW_DESKTOP: () => (/* binding */ ATTR_PETAL_DROPDOWN_SHOW_DESKTOP),\n/* harmony export */ ATTR_PETAL_DROPDOWN_SHOW_MOBILE: () => (/* binding */ ATTR_PETAL_DROPDOWN_SHOW_MOBILE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_SHOW_MOBILE_LANDSCAPE: () => (/* binding */ ATTR_PETAL_DROPDOWN_SHOW_MOBILE_LANDSCAPE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_SHOW_TABLET: () => (/* binding */ ATTR_PETAL_DROPDOWN_SHOW_TABLET),\n/* harmony export */ ATTR_PETAL_DROPDOWN_TOGGLE: () => (/* binding */ ATTR_PETAL_DROPDOWN_TOGGLE),\n/* harmony export */ ATTR_PETAL_ELEMENT: () => (/* binding */ ATTR_PETAL_ELEMENT),\n/* harmony export */ ATTR_PETAL_GROUP: () => (/* binding */ ATTR_PETAL_GROUP),\n/* harmony export */ ATTR_PETAL_MODAL: () => (/* binding */ ATTR_PETAL_MODAL),\n/* harmony export */ ATTR_PETAL_MODAL_TYPE: () => (/* binding */ ATTR_PETAL_MODAL_TYPE),\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_OVERLAY: () => (/* binding */ ATTR_PETAL_OVERLAY),\n/* harmony export */ ATTR_PETAL_OVERLAY_CLOSE: () => (/* binding */ ATTR_PETAL_OVERLAY_CLOSE),\n/* harmony export */ ATTR_PETAL_OVERLAY_OPACITY: () => (/* binding */ ATTR_PETAL_OVERLAY_OPACITY),\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_STATE: () => (/* binding */ ATTR_PETAL_STATE),\n/* harmony export */ ATTR_PETAL_TRIGGER_CLOSE: () => (/* binding */ ATTR_PETAL_TRIGGER_CLOSE),\n/* harmony export */ ATTR_PETAL_TRIGGER_OPEN: () => (/* binding */ ATTR_PETAL_TRIGGER_OPEN)\n/* harmony export */ });\n// BASE\nconst ATTR_PETAL_NAME = \"petal\";\nconst ATTR_PETAL_ELEMENT = \"petal-el\";\nconst ATTR_PETAL_GROUP = \"petal-group\"; // Group name for coordinated behavior across components\nconst ATTR_PETAL_STATE = \"petal-state\";\nconst ATTR_PETAL_DEBUG = \"petal-debug\"; // Enable debug console logging\n// BEHAVIOR\nconst ATTR_PETAL_SHOW_ONCE = \"petal-show-once\"; // Regardless of other settings, only show the modal once per user session\nconst ATTR_PETAL_SHOW_DELAY = \"petal-show-delay\"; // Time to wait before showing modal (in seconds)\nconst ATTR_PETAL_SESSION_TTL = \"petal-session-ttl\"; // Time to keep user session (in hours)\n// ANIMATIONS\nconst ATTR_PETAL_ANIM_OPEN = \"petal-anim-open\";\nconst ATTR_PETAL_ANIM_OPEN_TABLET = \"petal-anim-open-tablet\";\nconst ATTR_PETAL_ANIM_OPEN_MOBILE_LANDSCAPE = \"petal-anim-open-mobile-landscape\";\nconst ATTR_PETAL_ANIM_OPEN_MOBILE = \"petal-anim-open-mobile\";\nconst ATTR_PETAL_ANIM_OPEN_EASE = \"petal-anim-open-ease\";\nconst ATTR_PETAL_ANIM_OPEN_DURATION = \"petal-anim-open-duration\";\nconst ATTR_PETAL_ANIM_CLOSE = \"petal-anim-close\";\nconst ATTR_PETAL_ANIM_CLOSE_TABLET = \"petal-anim-close-tablet\";\nconst ATTR_PETAL_ANIM_CLOSE_MOBILE_LANDSCAPE = \"petal-anim-close-mobile-landscape\";\nconst ATTR_PETAL_ANIM_CLOSE_MOBILE = \"petal-anim-close-mobile\";\nconst ATTR_PETAL_ANIM_CLOSE_EASE = \"petal-anim-close-ease\";\nconst ATTR_PETAL_ANIM_CLOSE_DURATION = \"petal-anim-close-duration\";\nconst ATTR_PETAL_ANIM_OPEN_SPEED = \"petal-anim-open-speed\";\nconst ATTR_PETAL_ANIM_CLOSE_SPEED = \"petal-anim-close-speed\";\nconst ATTR_PETAL_ANIM_OFFSET = \"petal-anim-offset\";\nconst ATTR_PETAL_ANIM_OFFSET_TABLET = \"petal-anim-offset-tablet\";\nconst ATTR_PETAL_ANIM_OFFSET_MOBILE_LANDSCAPE = \"petal-anim-offset-mobile-landscape\";\nconst ATTR_PETAL_ANIM_OFFSET_MOBILE = \"petal-anim-offset-mobile\";\n/**-------------------------*\n * OVERLAY\n *--------------------------*/\nconst ATTR_PETAL_OVERLAY = \"overlay\";\nconst ATTR_PETAL_OVERLAY_OPACITY = \"petal-overlay-opacity\";\nconst ATTR_PETAL_OVERLAY_CLOSE = \"petal-overlay-close\";\n/**-------------------------*\n * OPEN & CLOSE\n *--------------------------*/\nconst ATTR_PETAL_TRIGGER_OPEN = \"trigger-open\";\nconst ATTR_PETAL_TRIGGER_CLOSE = \"trigger-close\";\n/**-------------------------*\n * MODAL\n *--------------------------*/\n// ELEMENTS\nconst ATTR_PETAL_MODAL = \"modal\";\nconst ATTR_PETAL_DIALOG = \"dialog\";\nconst ATTR_PETAL_MODAL_TYPE = \"petal-modal-type\";\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_SCROLL = \"dropdown-scroll\";\n// BEHAVIOR\nconst ATTR_PETAL_DISABLE_SCROLL_ON_OPEN = \"petal-disable-scroll-on-open\";\n// OPEN/CLOSE BEHAVIOR\nconst ATTR_PETAL_DROPDOWN_OPEN_DELAY = \"petal-dropdown-open-delay\";\nconst ATTR_PETAL_DROPDOWN_CLOSE_DELAY = \"petal-dropdown-close-delay\";\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\";\n// VISIBILITY\nconst ATTR_PETAL_DROPDOWN_SHOW_DESKTOP = \"petal-dropdown-show-desktop\";\nconst ATTR_PETAL_DROPDOWN_SHOW_TABLET = \"petal-dropdown-show-tablet\";\nconst ATTR_PETAL_DROPDOWN_SHOW_MOBILE_LANDSCAPE = \"petal-dropdown-show-mobile-landscape\";\nconst ATTR_PETAL_DROPDOWN_SHOW_MOBILE = \"petal-dropdown-show-mobile\";\n// EXPAND\nconst ATTR_PETAL_DROPDOWN_EXPAND_TABLET = \"petal-dropdown-expand-tablet\";\nconst ATTR_PETAL_DROPDOWN_EXPAND_MOBILE_LANDSCAPE = \"petal-dropdown-expand-mobile-landscape\";\nconst ATTR_PETAL_DROPDOWN_EXPAND_MOBILE = \"petal-dropdown-expand-mobile\";\n// ARIA ATTRIBUTES\nconst ARIA_EXPANDED = \"aria-expanded\";\n\n\n//# sourceURL=webpack://petal/./src/lib/attributes.ts?");
|
|
169
|
+
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_DURATION: () => (/* binding */ ATTR_PETAL_ANIM_CLOSE_DURATION),\n/* harmony export */ ATTR_PETAL_ANIM_CLOSE_EASE: () => (/* binding */ ATTR_PETAL_ANIM_CLOSE_EASE),\n/* harmony export */ ATTR_PETAL_ANIM_CLOSE_MOBILE: () => (/* binding */ ATTR_PETAL_ANIM_CLOSE_MOBILE),\n/* harmony export */ ATTR_PETAL_ANIM_CLOSE_MOBILE_LANDSCAPE: () => (/* binding */ ATTR_PETAL_ANIM_CLOSE_MOBILE_LANDSCAPE),\n/* harmony export */ ATTR_PETAL_ANIM_CLOSE_SPEED: () => (/* binding */ ATTR_PETAL_ANIM_CLOSE_SPEED),\n/* harmony export */ ATTR_PETAL_ANIM_CLOSE_TABLET: () => (/* binding */ ATTR_PETAL_ANIM_CLOSE_TABLET),\n/* harmony export */ ATTR_PETAL_ANIM_OFFSET: () => (/* binding */ ATTR_PETAL_ANIM_OFFSET),\n/* harmony export */ ATTR_PETAL_ANIM_OFFSET_MOBILE: () => (/* binding */ ATTR_PETAL_ANIM_OFFSET_MOBILE),\n/* harmony export */ ATTR_PETAL_ANIM_OFFSET_MOBILE_LANDSCAPE: () => (/* binding */ ATTR_PETAL_ANIM_OFFSET_MOBILE_LANDSCAPE),\n/* harmony export */ ATTR_PETAL_ANIM_OFFSET_TABLET: () => (/* binding */ ATTR_PETAL_ANIM_OFFSET_TABLET),\n/* harmony export */ ATTR_PETAL_ANIM_OPEN: () => (/* binding */ ATTR_PETAL_ANIM_OPEN),\n/* harmony export */ ATTR_PETAL_ANIM_OPEN_DURATION: () => (/* binding */ ATTR_PETAL_ANIM_OPEN_DURATION),\n/* harmony export */ ATTR_PETAL_ANIM_OPEN_EASE: () => (/* binding */ ATTR_PETAL_ANIM_OPEN_EASE),\n/* harmony export */ ATTR_PETAL_ANIM_OPEN_MOBILE: () => (/* binding */ ATTR_PETAL_ANIM_OPEN_MOBILE),\n/* harmony export */ ATTR_PETAL_ANIM_OPEN_MOBILE_LANDSCAPE: () => (/* binding */ ATTR_PETAL_ANIM_OPEN_MOBILE_LANDSCAPE),\n/* harmony export */ ATTR_PETAL_ANIM_OPEN_SPEED: () => (/* binding */ ATTR_PETAL_ANIM_OPEN_SPEED),\n/* harmony export */ ATTR_PETAL_ANIM_OPEN_TABLET: () => (/* binding */ ATTR_PETAL_ANIM_OPEN_TABLET),\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_DEBUG: () => (/* binding */ ATTR_PETAL_DEBUG),\n/* harmony export */ ATTR_PETAL_DIALOG: () => (/* binding */ ATTR_PETAL_DIALOG),\n/* harmony export */ ATTR_PETAL_DROPDOWN: () => (/* binding */ ATTR_PETAL_DROPDOWN),\n/* harmony export */ ATTR_PETAL_DROPDOWN_CLOSE_DELAY: () => (/* binding */ ATTR_PETAL_DROPDOWN_CLOSE_DELAY),\n/* harmony export */ ATTR_PETAL_DROPDOWN_EXPAND_MOBILE: () => (/* binding */ ATTR_PETAL_DROPDOWN_EXPAND_MOBILE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_EXPAND_MOBILE_LANDSCAPE: () => (/* binding */ ATTR_PETAL_DROPDOWN_EXPAND_MOBILE_LANDSCAPE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_EXPAND_TABLET: () => (/* binding */ ATTR_PETAL_DROPDOWN_EXPAND_TABLET),\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_SHOW_DESKTOP: () => (/* binding */ ATTR_PETAL_DROPDOWN_SHOW_DESKTOP),\n/* harmony export */ ATTR_PETAL_DROPDOWN_SHOW_MOBILE: () => (/* binding */ ATTR_PETAL_DROPDOWN_SHOW_MOBILE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_SHOW_MOBILE_LANDSCAPE: () => (/* binding */ ATTR_PETAL_DROPDOWN_SHOW_MOBILE_LANDSCAPE),\n/* harmony export */ ATTR_PETAL_DROPDOWN_SHOW_TABLET: () => (/* binding */ ATTR_PETAL_DROPDOWN_SHOW_TABLET),\n/* harmony export */ ATTR_PETAL_DROPDOWN_TOGGLE: () => (/* binding */ ATTR_PETAL_DROPDOWN_TOGGLE),\n/* harmony export */ ATTR_PETAL_ELEMENT: () => (/* binding */ ATTR_PETAL_ELEMENT),\n/* harmony export */ ATTR_PETAL_GROUP: () => (/* binding */ ATTR_PETAL_GROUP),\n/* harmony export */ ATTR_PETAL_LOCK_SCROLL_ON_OPEN: () => (/* binding */ ATTR_PETAL_LOCK_SCROLL_ON_OPEN),\n/* harmony export */ ATTR_PETAL_MODAL: () => (/* binding */ ATTR_PETAL_MODAL),\n/* harmony export */ ATTR_PETAL_MODAL_TYPE: () => (/* binding */ ATTR_PETAL_MODAL_TYPE),\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_OVERLAY: () => (/* binding */ ATTR_PETAL_OVERLAY),\n/* harmony export */ ATTR_PETAL_OVERLAY_CLOSE: () => (/* binding */ ATTR_PETAL_OVERLAY_CLOSE),\n/* harmony export */ ATTR_PETAL_OVERLAY_OPACITY: () => (/* binding */ ATTR_PETAL_OVERLAY_OPACITY),\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_STATE: () => (/* binding */ ATTR_PETAL_STATE),\n/* harmony export */ ATTR_PETAL_TRIGGER_CLOSE: () => (/* binding */ ATTR_PETAL_TRIGGER_CLOSE),\n/* harmony export */ ATTR_PETAL_TRIGGER_OPEN: () => (/* binding */ ATTR_PETAL_TRIGGER_OPEN)\n/* harmony export */ });\n// BASE\nconst ATTR_PETAL_NAME = \"petal\";\nconst ATTR_PETAL_ELEMENT = \"petal-el\";\nconst ATTR_PETAL_GROUP = \"petal-group\"; // Group name for coordinated behavior across components\nconst ATTR_PETAL_STATE = \"petal-state\";\nconst ATTR_PETAL_DEBUG = \"petal-debug\"; // Enable debug console logging\n// BEHAVIOR\nconst ATTR_PETAL_SHOW_ONCE = \"petal-show-once\"; // Regardless of other settings, only show the modal once per user session\nconst ATTR_PETAL_SHOW_DELAY = \"petal-show-delay\"; // Time to wait before showing modal (in seconds)\nconst ATTR_PETAL_SESSION_TTL = \"petal-session-ttl\"; // Time to keep user session (in hours)\n// ANIMATIONS\nconst ATTR_PETAL_ANIM_OPEN = \"petal-anim-open\";\nconst ATTR_PETAL_ANIM_OPEN_TABLET = \"petal-anim-open-tablet\";\nconst ATTR_PETAL_ANIM_OPEN_MOBILE_LANDSCAPE = \"petal-anim-open-mobile-landscape\";\nconst ATTR_PETAL_ANIM_OPEN_MOBILE = \"petal-anim-open-mobile\";\nconst ATTR_PETAL_ANIM_OPEN_EASE = \"petal-anim-open-ease\";\nconst ATTR_PETAL_ANIM_OPEN_DURATION = \"petal-anim-open-duration\";\nconst ATTR_PETAL_ANIM_CLOSE = \"petal-anim-close\";\nconst ATTR_PETAL_ANIM_CLOSE_TABLET = \"petal-anim-close-tablet\";\nconst ATTR_PETAL_ANIM_CLOSE_MOBILE_LANDSCAPE = \"petal-anim-close-mobile-landscape\";\nconst ATTR_PETAL_ANIM_CLOSE_MOBILE = \"petal-anim-close-mobile\";\nconst ATTR_PETAL_ANIM_CLOSE_EASE = \"petal-anim-close-ease\";\nconst ATTR_PETAL_ANIM_CLOSE_DURATION = \"petal-anim-close-duration\";\nconst ATTR_PETAL_ANIM_OPEN_SPEED = \"petal-anim-open-speed\";\nconst ATTR_PETAL_ANIM_CLOSE_SPEED = \"petal-anim-close-speed\";\nconst ATTR_PETAL_ANIM_OFFSET = \"petal-anim-offset\";\nconst ATTR_PETAL_ANIM_OFFSET_TABLET = \"petal-anim-offset-tablet\";\nconst ATTR_PETAL_ANIM_OFFSET_MOBILE_LANDSCAPE = \"petal-anim-offset-mobile-landscape\";\nconst ATTR_PETAL_ANIM_OFFSET_MOBILE = \"petal-anim-offset-mobile\";\n/**-------------------------*\n * OVERLAY\n *--------------------------*/\nconst ATTR_PETAL_OVERLAY = \"overlay\";\nconst ATTR_PETAL_OVERLAY_OPACITY = \"petal-overlay-opacity\";\nconst ATTR_PETAL_OVERLAY_CLOSE = \"petal-overlay-close\";\n/**-------------------------*\n * OPEN & CLOSE\n *--------------------------*/\nconst ATTR_PETAL_TRIGGER_OPEN = \"trigger-open\";\nconst ATTR_PETAL_TRIGGER_CLOSE = \"trigger-close\";\n/**-------------------------*\n * MODAL\n *--------------------------*/\n// ELEMENTS\nconst ATTR_PETAL_MODAL = \"modal\";\nconst ATTR_PETAL_DIALOG = \"dialog\";\nconst ATTR_PETAL_MODAL_TYPE = \"petal-modal-type\";\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\";\n// BEHAVIOR\nconst ATTR_PETAL_LOCK_SCROLL_ON_OPEN = \"petal-lock-scroll-on-open\";\n// OPEN/CLOSE BEHAVIOR\nconst ATTR_PETAL_DROPDOWN_OPEN_DELAY = \"petal-dropdown-open-delay\";\nconst ATTR_PETAL_DROPDOWN_CLOSE_DELAY = \"petal-dropdown-close-delay\";\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\";\n// VISIBILITY\nconst ATTR_PETAL_DROPDOWN_SHOW_DESKTOP = \"petal-dropdown-show-desktop\";\nconst ATTR_PETAL_DROPDOWN_SHOW_TABLET = \"petal-dropdown-show-tablet\";\nconst ATTR_PETAL_DROPDOWN_SHOW_MOBILE_LANDSCAPE = \"petal-dropdown-show-mobile-landscape\";\nconst ATTR_PETAL_DROPDOWN_SHOW_MOBILE = \"petal-dropdown-show-mobile\";\n// EXPAND\nconst ATTR_PETAL_DROPDOWN_EXPAND_TABLET = \"petal-dropdown-expand-tablet\";\nconst ATTR_PETAL_DROPDOWN_EXPAND_MOBILE_LANDSCAPE = \"petal-dropdown-expand-mobile-landscape\";\nconst ATTR_PETAL_DROPDOWN_EXPAND_MOBILE = \"petal-dropdown-expand-mobile\";\n// ARIA ATTRIBUTES\nconst ARIA_EXPANDED = \"aria-expanded\";\n\n\n//# sourceURL=webpack://petal/./src/lib/attributes.ts?");
|
|
170
170
|
|
|
171
171
|
/***/ }),
|
|
172
172
|
|
|
@@ -176,7 +176,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
176
176
|
\**************************/
|
|
177
177
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
178
178
|
|
|
179
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ debug: () => (/* binding */ debug)\n/* harmony export */ });\n/**\n * Debug Helper Module\n *\n * Provides debug logging functionality with module prefixes.\n */\n/**\n * Debug logging function\n * Logs a message with a flower emoji prefix and module name if debug mode is enabled\n *\n * @param debug - Configuration object with debug flag\n * @param module - Module name to display in brackets\n * @param log - Log message to display\n */\nfunction debug(debug, module, log) {\n if (!debug)\n return;\n console.log(`🌸 [${module}] ${log}`);\n}\n\n\n//# sourceURL=webpack://petal/./src/lib/debug.ts?");
|
|
179
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ debug: () => (/* binding */ debug),\n/* harmony export */ debugElements: () => (/* binding */ debugElements)\n/* harmony export */ });\n/**\n * Debug Helper Module\n *\n * Provides debug logging functionality with module prefixes.\n */\n/**\n * Debug logging function\n * Logs a message with a flower emoji prefix and module name if debug mode is enabled\n *\n * @param debug - Configuration object with debug flag\n * @param module - Module name to display in brackets\n * @param log - Log message to display\n */\nfunction debug(debug, module, log) {\n if (!debug)\n return;\n console.log(`🌸 [${module}] ${log}`);\n}\nfunction debugElements(debug, module, name, elements) {\n if (!debug)\n return;\n const length = elements instanceof NodeList ? elements.length : elements ? 1 : 0;\n console.log(`🌸 [${module}] Found ${length} ${name}(s)`);\n if (length > 0)\n console.log(elements);\n}\n\n\n//# sourceURL=webpack://petal/./src/lib/debug.ts?");
|
|
180
180
|
|
|
181
181
|
/***/ }),
|
|
182
182
|
|
|
@@ -216,7 +216,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
216
216
|
\*********************************************/
|
|
217
217
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
218
218
|
|
|
219
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ logConfig: () => (/* binding */ logConfig),\n/* harmony export */ parseBannerConfig: () => (/* binding */ parseBannerConfig)\n/* harmony export */ });\n/* harmony import */ var _lib_attributes__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../lib/attributes */ \"./src/lib/attributes.ts\");\n\nfunction parseBannerConfig(banner) {\n const allowClose = banner.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_ALLOW_CLOSE) !== \"false\";\n const sessionTTLMinutes = parseFloat(banner.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_SESSION_TTL) || \"30\");\n return {\n allowClose,\n sessionTTLMinutes,\n };\n}\nfunction logConfig(config) {\n console.log(\"Banner - Configuration:\", {\n allowClose: config.allowClose,\n sessionTTLMinutes: config.sessionTTLMinutes,\n });\n}\n\n\n//# sourceURL=webpack://petal/./src/modules/banner/banner-config.ts?");
|
|
219
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ logConfig: () => (/* binding */ logConfig),\n/* harmony export */ parseBannerConfig: () => (/* binding */ parseBannerConfig)\n/* harmony export */ });\n/* harmony import */ var _lib_attributes__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../lib/attributes */ \"./src/lib/attributes.ts\");\n\nfunction parseBannerConfig(banner) {\n const allowClose = banner.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_ALLOW_CLOSE) !== \"false\";\n const debug = banner.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DEBUG) === \"true\";\n const sessionTTLMinutes = parseFloat(banner.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_SESSION_TTL) || \"30\");\n return {\n allowClose,\n debug,\n sessionTTLMinutes,\n };\n}\nfunction logConfig(config) {\n console.log(\"Banner - Configuration:\", {\n allowClose: config.allowClose,\n sessionTTLMinutes: config.sessionTTLMinutes,\n });\n}\n\n\n//# sourceURL=webpack://petal/./src/modules/banner/banner-config.ts?");
|
|
220
220
|
|
|
221
221
|
/***/ }),
|
|
222
222
|
|
|
@@ -226,7 +226,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
226
226
|
\**************************************/
|
|
227
227
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
228
228
|
|
|
229
|
-
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
|
|
229
|
+
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_debug__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../lib/debug */ \"./src/lib/debug.ts\");\n/* harmony import */ var _lib_attributes__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../lib/attributes */ \"./src/lib/attributes.ts\");\n/* harmony import */ var _lib_helpers__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../lib/helpers */ \"./src/lib/helpers.ts\");\n/* harmony import */ var _lib_memory__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../lib/memory */ \"./src/lib/memory.ts\");\n/* harmony import */ var _banner_config__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./banner-config */ \"./src/modules/banner/banner-config.ts\");\n\n\n\n\n\nfunction initializeBanner() {\n const banners = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_2__.getAllPetalElementsOfType)(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_BANNER);\n banners.forEach((banner) => {\n const name = banner.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_NAME);\n if (!name) {\n console.warn(\"Banner element is missing a name attribute. Each banner must have a unique name to function properly.\");\n return;\n }\n // Get the banner config\n const config = (0,_banner_config__WEBPACK_IMPORTED_MODULE_4__.parseBannerConfig)(banner);\n (0,_lib_debug__WEBPACK_IMPORTED_MODULE_0__.debug)(config.debug, \"BANNER\", \"Banner Configuration:\");\n if (config.debug)\n console.log(config);\n // ELEMENTS\n const closeButtons = banner.querySelectorAll(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_ELEMENT}=\"${_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_BANNER_CLOSE}\"]`);\n (0,_lib_debug__WEBPACK_IMPORTED_MODULE_0__.debugElements)(config.debug, \"BANNER\", \"close button\", closeButtons);\n // If banner doesn't allow close, hide close buttons and clear any stored memory\n if (!config.allowClose) {\n closeButtons.forEach((closeButton) => {\n closeButton.style.display = \"none\";\n });\n (0,_lib_memory__WEBPACK_IMPORTED_MODULE_3__.clearClosedState)(\"banner\", name);\n }\n // If allowClose is true, check if banner was previously closed and set up event listeners on close buttons\n if (config.allowClose) {\n // Check if banner was closed and session is still valid (only if allowClose is true)\n if ((0,_lib_memory__WEBPACK_IMPORTED_MODULE_3__.checkClosedState)(\"banner\", name, config.sessionTTLMinutes)) {\n // If closed and session valid, hide the banner\n banner.classList.add(\"petal-hide-banner\");\n }\n // Set up the close button\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_3__.storeClosedState)(\"banner\", name);\n });\n });\n }\n });\n}\n\n\n//# sourceURL=webpack://petal/./src/modules/banner/banner.ts?");
|
|
230
230
|
|
|
231
231
|
/***/ }),
|
|
232
232
|
|
|
@@ -236,7 +236,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
236
236
|
\***************************************************/
|
|
237
237
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
238
238
|
|
|
239
|
-
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/**\n * Animates dropdown opening with GSAP\n */\nfunction animateOpen(elements, currentAnim, currentOffset, config, index) {\n
|
|
239
|
+
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/**\n * Animates dropdown opening with GSAP\n */\nfunction animateOpen(elements, currentAnim, currentOffset, config, index) {\n const { dropdown, toggle, menu, drawer, overlay } = elements;\n // Build animation options with easing and duration\n const animOptions = {\n offset: currentOffset,\n ease: config.animOpenEase || undefined,\n duration: config.animOpenSpeed,\n };\n const anim = _lib_animations__WEBPACK_IMPORTED_MODULE_0__.animations[currentAnim](animOptions);\n // Create GSAP timeline\n const tl = gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.timeline();\n // CRITICAL: Set drawer position BEFORE making menu visible to avoid flash\n gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.set(drawer, anim.from);\n // Now make elements visible\n gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.set(menu, { display: \"flex\", visibility: \"visible\" });\n if (overlay) {\n gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.set(overlay, { display: \"flex\", visibility: \"visible\", opacity: 1 });\n }\n // Animate the drawer\n tl.to(drawer, anim.to);\n // Update ARIA and state\n toggle.setAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ARIA_EXPANDED, \"true\");\n dropdown.setAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_STATE, \"open\");\n return tl;\n}\n/**\n * Animates dropdown closing with GSAP\n */\nfunction animateClose(elements, currentOpenAnim, currentCloseAnim, currentOffset, config, index) {\n const { dropdown, toggle, menu, drawer, overlay } = elements;\n // Build animation options with easing and duration\n const animOptions = {\n offset: currentOffset,\n ease: config.animCloseEase || undefined,\n duration: config.animCloseSpeed,\n };\n // Use explicit close animation if provided, otherwise reverse the open animation\n const anim = currentCloseAnim ? (0,_lib_animations__WEBPACK_IMPORTED_MODULE_0__.getReverseAnimation)(currentCloseAnim, animOptions) : (0,_lib_animations__WEBPACK_IMPORTED_MODULE_0__.getReverseAnimation)(currentOpenAnim, animOptions);\n // Create GSAP timeline\n const tl = gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.timeline({\n onComplete: () => {\n // Update ARIA and state after animation completes\n toggle.setAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ARIA_EXPANDED, \"false\");\n dropdown.setAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_STATE, \"closed\");\n // Clear all animation properties to ensure clean state for next open\n (0,_lib_animations__WEBPACK_IMPORTED_MODULE_0__.clearAnimationProperties)(drawer);\n // Set display to none and visibility to hidden after animation completes\n gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.set(menu, { display: \"none\", visibility: \"hidden\" });\n if (overlay) {\n gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.set(overlay, { display: \"none\", visibility: \"hidden\" });\n }\n },\n });\n // Animate the drawer (duration and ease are now in anim.to)\n tl.fromTo(drawer, anim.from, anim.to);\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(drawer, currentAnim, currentOffset) {\n // For initialization, we only need the offset (duration and easing don't apply)\n const anim = _lib_animations__WEBPACK_IMPORTED_MODULE_0__.animations[currentAnim]({ offset: currentOffset });\n gsap__WEBPACK_IMPORTED_MODULE_2__.gsap.set(drawer, anim.from);\n}\n\n\n//# sourceURL=webpack://petal/./src/modules/dropdown/dropdown-animator.ts?");
|
|
240
240
|
|
|
241
241
|
/***/ }),
|
|
242
242
|
|
|
@@ -246,7 +246,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
246
246
|
\*************************************************/
|
|
247
247
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
248
248
|
|
|
249
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ getCurrentCloseAnimation: () => (/* binding */ getCurrentCloseAnimation),\n/* harmony export */ getCurrentOffset: () => (/* binding */ getCurrentOffset),\n/* harmony export */ getCurrentOpenAnimation: () => (/* binding */ getCurrentOpenAnimation),\n/* harmony export */ getCurrentOpenOnHover: () => (/* binding */ getCurrentOpenOnHover),\n/* harmony export */ getCurrentShowState: () => (/* binding */ getCurrentShowState),\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_GROUP) || null;\n // Debug mode\n const debug = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DEBUG) === \"true\";\n // Check if device has mouse capability (pointer device)\n const hasMouse = window.matchMedia(\"(pointer: fine)\").matches;\n // Scroll lock\n const disableScrollOnOpen = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DISABLE_SCROLL_ON_OPEN) === \"true\";\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 // Show on breakpoints configuration (defaults to true)\n const showDesktopAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_SHOW_DESKTOP);\n const showTabletAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_SHOW_TABLET);\n const showMobileLandscapeAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_SHOW_MOBILE_LANDSCAPE);\n const showMobileAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_SHOW_MOBILE);\n const showDesktop = showDesktopAttr === null ? true : showDesktopAttr === \"true\";\n const showTablet = parseBooleanOrNull(showTabletAttr);\n const showMobileLandscape = parseBooleanOrNull(showMobileLandscapeAttr);\n const showMobile = parseBooleanOrNull(showMobileAttr);\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 // Open animation configuration with cascading defaults\n const animOpen = (dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OPEN) || \"slide-down\");\n const animOpenTablet = (dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OPEN_TABLET) || animOpen);\n const animOpenMobileLandscape = (dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OPEN_MOBILE_LANDSCAPE) || animOpenTablet);\n const animOpenMobile = (dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OPEN_MOBILE) || animOpenMobileLandscape);\n // Close animation configuration (nullable - will use reverse of open if not set)\n const animCloseAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_CLOSE);\n const animClose = animCloseAttr ? animCloseAttr : null;\n const animCloseTabletAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_CLOSE_TABLET);\n const animCloseTablet = animCloseTabletAttr ? animCloseTabletAttr : null;\n const animCloseMobileLandscapeAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_CLOSE_MOBILE_LANDSCAPE);\n const animCloseMobileLandscape = animCloseMobileLandscapeAttr ? animCloseMobileLandscapeAttr : null;\n const animCloseMobileAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_CLOSE_MOBILE);\n const animCloseMobile = animCloseMobileAttr ? animCloseMobileAttr : null;\n // Animation speed configuration (in milliseconds, converted to seconds for GSAP)\n // Priority: ATTR_PETAL_ANIM_OPEN_DURATION > ATTR_PETAL_ANIM_OPEN_SPEED > default\n const animOpenDurationAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OPEN_DURATION);\n const animOpenSpeedAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OPEN_SPEED);\n const animOpenSpeed = animOpenDurationAttr\n ? parseFloat(animOpenDurationAttr)\n : animOpenSpeedAttr\n ? parseInt(animOpenSpeedAttr) / 1000\n : 0.5;\n const animCloseDurationAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_CLOSE_DURATION);\n const animCloseSpeedAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_CLOSE_SPEED);\n const animCloseSpeed = animCloseDurationAttr\n ? parseFloat(animCloseDurationAttr)\n : animCloseSpeedAttr\n ? parseInt(animCloseSpeedAttr) / 1000\n : 0.3;\n // Animation easing configuration\n const animOpenEase = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OPEN_EASE) || null;\n const animCloseEase = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_CLOSE_EASE) || null;\n // Animation offset configuration (in pixels or percentage) with breakpoints\n const animOffsetRaw = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OFFSET) || \"25\";\n const animOffset = parseOffset(animOffsetRaw);\n const animOffsetTablet = parseOffset(dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OFFSET_TABLET) || animOffsetRaw);\n const animOffsetMobileLandscape = parseOffset(dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OFFSET_MOBILE_LANDSCAPE) || dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OFFSET_TABLET) || animOffsetRaw);\n const animOffsetMobile = parseOffset(dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OFFSET_MOBILE) ||\n dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OFFSET_MOBILE_LANDSCAPE) ||\n dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OFFSET_TABLET) ||\n animOffsetRaw);\n return {\n group,\n debug,\n hasMouse,\n disableScrollOnOpen,\n openOnHoverDesktop,\n openOnHoverTablet,\n openOnHoverMobileLandscape,\n openOnHoverMobile,\n showDesktop,\n showTablet,\n showMobileLandscape,\n showMobile,\n openDelay,\n closeDelay,\n animOpen,\n animOpenTablet,\n animOpenMobileLandscape,\n animOpenMobile,\n animClose,\n animCloseTablet,\n animCloseMobileLandscape,\n animCloseMobile,\n animOpenSpeed,\n animCloseSpeed,\n animOpenEase,\n animCloseEase,\n animOffset,\n animOffsetTablet,\n animOffsetMobileLandscape,\n animOffsetMobile,\n };\n}\n/**\n * Get current open animation based on screen width\n */\nfunction getCurrentOpenAnimation(config) {\n const width = window.innerWidth;\n if (width <= 479)\n return config.animOpenMobile;\n if (width <= 767)\n return config.animOpenMobileLandscape;\n if (width <= 991)\n return config.animOpenTablet;\n return config.animOpen;\n}\n/**\n * Get current close animation based on screen width\n * Returns null if no explicit close animation is set (will use reverse of open)\n */\nfunction getCurrentCloseAnimation(config) {\n const width = window.innerWidth;\n if (width <= 479)\n return config.animCloseMobile;\n if (width <= 767)\n return config.animCloseMobileLandscape;\n if (width <= 991)\n return config.animCloseTablet;\n return config.animClose;\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 OR on desktop (width > 991)\n // This ensures hover works on desktop even if pointer detection is uncertain\n return shouldHover && (config.hasMouse || width > 991);\n}\n/**\n * Get current show state based on screen width\n */\nfunction getCurrentShowState(config) {\n const width = window.innerWidth;\n let shouldShow = config.showDesktop;\n if (width <= 479 && config.showMobile !== null) {\n shouldShow = config.showMobile;\n }\n else if (width <= 767 && config.showMobileLandscape !== null) {\n shouldShow = config.showMobileLandscape;\n }\n else if (width <= 991 && config.showTablet !== null) {\n shouldShow = config.showTablet;\n }\n return shouldShow;\n}\n/**\n * Log configuration for debugging\n */\nfunction logConfig(index, config) {\n if (!config.debug)\n return;\n console.log(`Dropdown ${index + 1} - Config:`, {\n group: config.group,\n debug: config.debug,\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 showDesktop: config.showDesktop,\n showTablet: config.showTablet,\n showMobileLandscape: config.showMobileLandscape,\n showMobile: config.showMobile,\n shouldShow: getCurrentShowState(config),\n openDelay: config.openDelay,\n closeDelay: config.closeDelay,\n animOpen: config.animOpen,\n animOpenTablet: config.animOpenTablet,\n animOpenMobileLandscape: config.animOpenMobileLandscape,\n animOpenMobile: config.animOpenMobile,\n animClose: config.animClose,\n animCloseTablet: config.animCloseTablet,\n animCloseMobileLandscape: config.animCloseMobileLandscape,\n animCloseMobile: config.animCloseMobile,\n animOpenSpeed: `${config.animOpenSpeed}s`,\n animCloseSpeed: `${config.animCloseSpeed}s`,\n animOpenEase: config.animOpenEase,\n animCloseEase: config.animCloseEase,\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?");
|
|
249
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ getCurrentCloseAnimation: () => (/* binding */ getCurrentCloseAnimation),\n/* harmony export */ getCurrentOffset: () => (/* binding */ getCurrentOffset),\n/* harmony export */ getCurrentOpenAnimation: () => (/* binding */ getCurrentOpenAnimation),\n/* harmony export */ getCurrentOpenOnHover: () => (/* binding */ getCurrentOpenOnHover),\n/* harmony export */ getCurrentShowState: () => (/* binding */ getCurrentShowState),\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_GROUP) || null;\n // Debug mode\n const debug = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DEBUG) === \"true\";\n // Check if device has mouse capability (pointer device)\n const hasMouse = window.matchMedia(\"(pointer: fine)\").matches;\n // Scroll lock\n const disableScrollOnOpen = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_LOCK_SCROLL_ON_OPEN) === \"true\";\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 // Show on breakpoints configuration (defaults to true)\n const showDesktopAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_SHOW_DESKTOP);\n const showTabletAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_SHOW_TABLET);\n const showMobileLandscapeAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_SHOW_MOBILE_LANDSCAPE);\n const showMobileAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_SHOW_MOBILE);\n const showDesktop = showDesktopAttr === null ? true : showDesktopAttr === \"true\";\n const showTablet = parseBooleanOrNull(showTabletAttr);\n const showMobileLandscape = parseBooleanOrNull(showMobileLandscapeAttr);\n const showMobile = parseBooleanOrNull(showMobileAttr);\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 // Open animation configuration with cascading defaults\n const animOpen = (dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OPEN) || \"slide-down\");\n const animOpenTablet = (dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OPEN_TABLET) || animOpen);\n const animOpenMobileLandscape = (dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OPEN_MOBILE_LANDSCAPE) || animOpenTablet);\n const animOpenMobile = (dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OPEN_MOBILE) || animOpenMobileLandscape);\n // Close animation configuration (nullable - will use reverse of open if not set)\n const animCloseAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_CLOSE);\n const animClose = animCloseAttr ? animCloseAttr : null;\n const animCloseTabletAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_CLOSE_TABLET);\n const animCloseTablet = animCloseTabletAttr ? animCloseTabletAttr : null;\n const animCloseMobileLandscapeAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_CLOSE_MOBILE_LANDSCAPE);\n const animCloseMobileLandscape = animCloseMobileLandscapeAttr ? animCloseMobileLandscapeAttr : null;\n const animCloseMobileAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_CLOSE_MOBILE);\n const animCloseMobile = animCloseMobileAttr ? animCloseMobileAttr : null;\n // Animation speed configuration (in milliseconds, converted to seconds for GSAP)\n // Priority: ATTR_PETAL_ANIM_OPEN_DURATION > ATTR_PETAL_ANIM_OPEN_SPEED > default\n const animOpenDurationAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OPEN_DURATION);\n const animOpenSpeedAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OPEN_SPEED);\n const animOpenSpeed = animOpenDurationAttr ? parseFloat(animOpenDurationAttr) : animOpenSpeedAttr ? parseInt(animOpenSpeedAttr) / 1000 : 0.5;\n const animCloseDurationAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_CLOSE_DURATION);\n const animCloseSpeedAttr = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_CLOSE_SPEED);\n const animCloseSpeed = animCloseDurationAttr ? parseFloat(animCloseDurationAttr) : animCloseSpeedAttr ? parseInt(animCloseSpeedAttr) / 1000 : 0.3;\n // Animation easing configuration\n const animOpenEase = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OPEN_EASE) || null;\n const animCloseEase = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_CLOSE_EASE) || null;\n // Animation offset configuration (in pixels or percentage) with breakpoints\n const animOffsetRaw = dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OFFSET) || \"25\";\n const animOffset = parseOffset(animOffsetRaw);\n const animOffsetTablet = parseOffset(dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OFFSET_TABLET) || animOffsetRaw);\n const animOffsetMobileLandscape = parseOffset(dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OFFSET_MOBILE_LANDSCAPE) || dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OFFSET_TABLET) || animOffsetRaw);\n const animOffsetMobile = parseOffset(dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OFFSET_MOBILE) || dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OFFSET_MOBILE_LANDSCAPE) || dropdown.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_ANIM_OFFSET_TABLET) || animOffsetRaw);\n return {\n group,\n debug,\n hasMouse,\n disableScrollOnOpen,\n openOnHoverDesktop,\n openOnHoverTablet,\n openOnHoverMobileLandscape,\n openOnHoverMobile,\n showDesktop,\n showTablet,\n showMobileLandscape,\n showMobile,\n openDelay,\n closeDelay,\n animOpen,\n animOpenTablet,\n animOpenMobileLandscape,\n animOpenMobile,\n animClose,\n animCloseTablet,\n animCloseMobileLandscape,\n animCloseMobile,\n animOpenSpeed,\n animCloseSpeed,\n animOpenEase,\n animCloseEase,\n animOffset,\n animOffsetTablet,\n animOffsetMobileLandscape,\n animOffsetMobile,\n };\n}\n/**\n * Get current open animation based on screen width\n */\nfunction getCurrentOpenAnimation(config) {\n const width = window.innerWidth;\n if (width <= 479)\n return config.animOpenMobile;\n if (width <= 767)\n return config.animOpenMobileLandscape;\n if (width <= 991)\n return config.animOpenTablet;\n return config.animOpen;\n}\n/**\n * Get current close animation based on screen width\n * Returns null if no explicit close animation is set (will use reverse of open)\n */\nfunction getCurrentCloseAnimation(config) {\n const width = window.innerWidth;\n if (width <= 479)\n return config.animCloseMobile;\n if (width <= 767)\n return config.animCloseMobileLandscape;\n if (width <= 991)\n return config.animCloseTablet;\n return config.animClose;\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 OR on desktop (width > 991)\n // This ensures hover works on desktop even if pointer detection is uncertain\n return shouldHover && (config.hasMouse || width > 991);\n}\n/**\n * Get current show state based on screen width\n */\nfunction getCurrentShowState(config) {\n const width = window.innerWidth;\n let shouldShow = config.showDesktop;\n if (width <= 479 && config.showMobile !== null) {\n shouldShow = config.showMobile;\n }\n else if (width <= 767 && config.showMobileLandscape !== null) {\n shouldShow = config.showMobileLandscape;\n }\n else if (width <= 991 && config.showTablet !== null) {\n shouldShow = config.showTablet;\n }\n return shouldShow;\n}\n/**\n * Log configuration for debugging\n */\nfunction logConfig(index, config) {\n if (!config.debug)\n return;\n console.log(`Dropdown ${index + 1} - Config:`, {\n group: config.group,\n debug: config.debug,\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 showDesktop: config.showDesktop,\n showTablet: config.showTablet,\n showMobileLandscape: config.showMobileLandscape,\n showMobile: config.showMobile,\n shouldShow: getCurrentShowState(config),\n openDelay: config.openDelay,\n closeDelay: config.closeDelay,\n animOpen: config.animOpen,\n animOpenTablet: config.animOpenTablet,\n animOpenMobileLandscape: config.animOpenMobileLandscape,\n animOpenMobile: config.animOpenMobile,\n animClose: config.animClose,\n animCloseTablet: config.animCloseTablet,\n animCloseMobileLandscape: config.animCloseMobileLandscape,\n animCloseMobile: config.animCloseMobile,\n animOpenSpeed: `${config.animOpenSpeed}s`,\n animCloseSpeed: `${config.animCloseSpeed}s`,\n animOpenEase: config.animOpenEase,\n animCloseEase: config.animCloseEase,\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?");
|
|
250
250
|
|
|
251
251
|
/***/ }),
|
|
252
252
|
|
|
@@ -256,7 +256,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
256
256
|
\*****************************************************/
|
|
257
257
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
258
258
|
|
|
259
|
-
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/* harmony import */ var _lib_scroll_lock__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../lib/scroll-lock */ \"./src/lib/scroll-lock.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\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 * - Closes other dropdowns in same group before opening\n * - Animates using GSAP timeline\n */\n this.open = () => {\n if (this.config.debug)\n console.log(`Dropdown ${this.index + 1} - openDropdown() called`);\n // Cancel any pending close\n if (this.timeoutId) {\n if (this.config.debug)\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 close other dropdowns in the group first\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_GROUP}='${this.config.group}']`);\n if (this.config.debug)\n console.log(`Dropdown ${this.index + 1} - Found ${groupDropdowns.length} dropdowns in group '${this.config.group}'`);\n // Close all other dropdowns in this group\n Array.from(groupDropdowns).forEach((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 if (ddToggle && ddToggle !== this.elements.toggle && ddToggle.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ARIA_EXPANDED) === \"true\") {\n // Trigger close on the other dropdown by dispatching a mouseleave event\n dd.dispatchEvent(new MouseEvent('mouseleave', { bubbles: true, cancelable: true }));\n // Calculate total time needed: close delay + close animation duration\n const closeDelay = parseInt(dd.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_CLOSE_DELAY) || \"200\", 10);\n // Get the close animation duration from the dropdown's config\n // Parse the close speed attribute (in ms, needs conversion to seconds)\n const closeSpeedAttr = dd.getAttribute('petal-anim-close-speed');\n const closeDurationAttr = dd.getAttribute('petal-anim-close-duration');\n const closeAnimDuration = closeDurationAttr\n ? parseFloat(closeDurationAttr) * 1000 // duration is in seconds\n : closeSpeedAttr\n ? parseInt(closeSpeedAttr) // speed is in milliseconds\n : 300; // default 300ms\n // Total time = close delay + close animation duration\n const totalCloseTime = closeDelay + closeAnimDuration;\n groupCoordinationDelay = Math.max(groupCoordinationDelay, totalCloseTime);\n if (this.config.debug)\n console.log(`Dropdown ${this.index + 1} - Closing another dropdown in group, total coordination delay: ${totalCloseTime}ms (closeDelay: ${closeDelay}ms + animDuration: ${closeAnimDuration}ms)`);\n }\n });\n }\n // Perform the actual open (immediately or delayed)\n const performOpen = () => {\n const currentAnim = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentOpenAnimation)(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 // Lock scroll if configured\n if (this.config.disableScrollOnOpen) {\n (0,_lib_scroll_lock__WEBPACK_IMPORTED_MODULE_3__.lockScroll)();\n if (this.config.debug)\n console.log(`Dropdown ${this.index + 1} - Scroll locked`);\n }\n };\n // Use the greater of openDelay or groupCoordinationDelay\n const totalDelay = Math.max(this.config.openDelay, groupCoordinationDelay);\n if (this.config.debug)\n console.log(`Dropdown ${this.index + 1} - Total delay: ${totalDelay}ms (openDelay: ${this.config.openDelay}ms, groupCoordination: ${groupCoordinationDelay}ms)`);\n if (totalDelay > 0) {\n if (this.config.debug)\n console.log(`Dropdown ${this.index + 1} - Scheduling open in ${totalDelay}ms`);\n setTimeout(performOpen, totalDelay);\n }\n else {\n if (this.config.debug)\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 if (this.config.debug)\n console.log(`Dropdown ${this.index + 1} - closeDropdown() called`);\n // Cancel any pending close\n if (this.timeoutId) {\n if (this.config.debug)\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 currentOpenAnim = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentOpenAnimation)(this.config);\n const currentCloseAnim = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentCloseAnimation)(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, currentOpenAnim, currentCloseAnim, currentOffset, this.config, this.index);\n this.isOpen = false;\n // Unlock scroll if configured\n if (this.config.disableScrollOnOpen) {\n (0,_lib_scroll_lock__WEBPACK_IMPORTED_MODULE_3__.unlockScroll)();\n if (this.config.debug)\n console.log(`Dropdown ${this.index + 1} - Scroll unlocked`);\n }\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 if (this.config.debug)\n console.log(`Dropdown ${this.index + 1} - closeDropdownWithDelay() called with delay: ${this.config.closeDelay}ms`);\n if (this.config.closeDelay > 0) {\n if (this.config.debug)\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 if (this.config.debug)\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 // Update show state and visibility on resize\n this.updateShowState();\n };\n this.openOnHover = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentOpenOnHover)(config);\n this.shouldShow = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentShowState)(config);\n this.updateVisibility();\n }\n /**\n * Initialize drawer to starting position\n */\n initializeDrawer() {\n const currentAnim = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentOpenAnimation)(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.drawer, currentAnim, currentOffset);\n }\n /**\n * Update visibility based on current show state\n */\n updateVisibility() {\n const { menu } = this.elements;\n if (this.shouldShow) {\n // Show menu\n menu.style.removeProperty('display');\n if (this.config.debug)\n console.log(`Dropdown ${this.index + 1} - Showing menu`);\n }\n else {\n // Hide menu and close if open\n if (this.isOpen) {\n this.close();\n }\n menu.style.display = 'none';\n if (this.config.debug)\n console.log(`Dropdown ${this.index + 1} - Hiding menu`);\n }\n }\n /**\n * Update show state based on current breakpoint\n */\n updateShowState() {\n const newShouldShow = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentShowState)(this.config);\n const changed = newShouldShow !== this.shouldShow;\n if (changed) {\n this.shouldShow = newShouldShow;\n this.updateVisibility();\n if (this.config.debug)\n console.log(`Dropdown ${this.index + 1} - Show state changed to: ${this.shouldShow}`);\n }\n return changed;\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 * Get current should show state\n */\n getShouldShow() {\n return this.shouldShow;\n }\n}\n\n\n//# sourceURL=webpack://petal/./src/modules/dropdown/dropdown-controller.ts?");
|
|
259
|
+
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/* harmony import */ var _lib_scroll_lock__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../lib/scroll-lock */ \"./src/lib/scroll-lock.ts\");\n/* harmony import */ var _lib_debug__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../lib/debug */ \"./src/lib/debug.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\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 * - Closes other dropdowns in same group before opening\n * - Animates using GSAP timeline\n */\n this.open = () => {\n (0,_lib_debug__WEBPACK_IMPORTED_MODULE_4__.debug)(this.config.debug, \"Dropdown\", `Dropdown ${this.index + 1} - openDropdown() called`);\n // Cancel any pending close\n if (this.timeoutId) {\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 close other dropdowns in the group first\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_GROUP}='${this.config.group}']`);\n // Close all other dropdowns in this group\n Array.from(groupDropdowns).forEach((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 if (ddToggle && ddToggle !== this.elements.toggle && ddToggle.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ARIA_EXPANDED) === \"true\") {\n // Trigger close on the other dropdown by dispatching a mouseleave event\n dd.dispatchEvent(new MouseEvent(\"mouseleave\", { bubbles: true, cancelable: true }));\n // Calculate total time needed: close delay + close animation duration\n const closeDelay = parseInt(dd.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_CLOSE_DELAY) || \"200\", 10);\n // Get the close animation duration from the dropdown's config\n // Parse the close speed attribute (in ms, needs conversion to seconds)\n const closeSpeedAttr = dd.getAttribute(\"petal-anim-close-speed\");\n const closeDurationAttr = dd.getAttribute(\"petal-anim-close-duration\");\n const closeAnimDuration = closeDurationAttr\n ? parseFloat(closeDurationAttr) * 1000 // duration is in seconds\n : closeSpeedAttr\n ? parseInt(closeSpeedAttr) // speed is in milliseconds\n : 300; // default 300ms\n // Total time = close delay + close animation duration\n const totalCloseTime = closeDelay + closeAnimDuration;\n groupCoordinationDelay = Math.max(groupCoordinationDelay, totalCloseTime);\n }\n });\n }\n // Perform the actual open (immediately or delayed)\n const performOpen = () => {\n const currentAnim = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentOpenAnimation)(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 // Lock scroll if configured\n if (this.config.disableScrollOnOpen) {\n (0,_lib_scroll_lock__WEBPACK_IMPORTED_MODULE_3__.lockScroll)();\n }\n };\n // Use the greater of openDelay or groupCoordinationDelay\n const totalDelay = Math.max(this.config.openDelay, groupCoordinationDelay);\n if (totalDelay > 0) {\n setTimeout(performOpen, totalDelay);\n }\n else {\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 (0,_lib_debug__WEBPACK_IMPORTED_MODULE_4__.debug)(this.config.debug, \"Dropdown\", `Dropdown ${this.index + 1} - closeDropdown() called`);\n // Cancel any pending close\n if (this.timeoutId) {\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 currentOpenAnim = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentOpenAnimation)(this.config);\n const currentCloseAnim = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentCloseAnimation)(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, currentOpenAnim, currentCloseAnim, currentOffset, this.config, this.index);\n this.isOpen = false;\n // Unlock scroll if configured\n if (this.config.disableScrollOnOpen) {\n (0,_lib_scroll_lock__WEBPACK_IMPORTED_MODULE_3__.unlockScroll)();\n }\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 if (this.config.closeDelay > 0) {\n this.timeoutId = window.setTimeout(this.close, this.config.closeDelay);\n }\n else {\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 // Update show state and visibility on resize\n this.updateShowState();\n };\n this.openOnHover = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentOpenOnHover)(config);\n this.shouldShow = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentShowState)(config);\n this.updateVisibility();\n }\n /**\n * Initialize drawer to starting position\n */\n initializeDrawer() {\n const currentAnim = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentOpenAnimation)(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.drawer, currentAnim, currentOffset);\n }\n /**\n * Update visibility based on current show state\n */\n updateVisibility() {\n const { menu } = this.elements;\n if (this.shouldShow) {\n // Show menu\n menu.style.removeProperty(\"display\");\n }\n else {\n // Hide menu and close if open\n if (this.isOpen) {\n this.close();\n }\n menu.style.display = \"none\";\n }\n }\n /**\n * Update show state based on current breakpoint\n */\n updateShowState() {\n const newShouldShow = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.getCurrentShowState)(this.config);\n const changed = newShouldShow !== this.shouldShow;\n if (changed) {\n this.shouldShow = newShouldShow;\n this.updateVisibility();\n }\n return changed;\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 * Get current should show state\n */\n getShouldShow() {\n return this.shouldShow;\n }\n}\n\n\n//# sourceURL=webpack://petal/./src/modules/dropdown/dropdown-controller.ts?");
|
|
260
260
|
|
|
261
261
|
/***/ }),
|
|
262
262
|
|
|
@@ -276,7 +276,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
276
276
|
\******************************************/
|
|
277
277
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
278
278
|
|
|
279
|
-
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/* harmony import */ var _lib_helpers__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../lib/helpers */ \"./src/lib/helpers.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-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 */\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 dropdowns.forEach((dropdown, index) => {\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 // 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 = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_3__.findPetalElementByNameOrInParent)(dropdown, petalName, _lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_TOGGLE);\n const menu = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_3__.findPetalElementByNameOrInParent)(dropdown, petalName, _lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_MENU);\n const drawer = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_3__.findPetalElementByNameOrInParent)(dropdown, petalName, _lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_MENU_BOX);\n const overlay = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_3__.findPetalElementByNameOrInParent)(dropdown, petalName, _lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_OVERLAY);\n const close = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_3__.findPetalElementByNameOrInParent)(dropdown, petalName, _lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_TRIGGER_CLOSE);\n // Validate required elements\n if (!toggle || !menu || !drawer) {\n return;\n }\n // ===========================\n // Configuration\n // ===========================\n const config = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.parseDropdownConfig)(dropdown);\n if (config.debug) {\n console.log(`\\n=== Initializing Dropdown ${index + 1} ===`);\n if (petalName) {\n console.log(`Dropdown ${index + 1} - Name: \"${petalName}\"`);\n }\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 drawer:`, drawer);\n console.log(`Dropdown ${index + 1} - Found overlay:`, overlay);\n console.log(`Dropdown ${index + 1} - Found close:`, close);\n }\n (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.logConfig)(index, config);\n // ===========================\n // Controller Setup\n // ===========================\n const elements = { dropdown, toggle, menu, drawer, 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 dropdown is closed\n toggle.setAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ARIA_EXPANDED, \"false\");\n dropdown.setAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_STATE, \"closed\");\n // Initialize drawer to its animation's starting position\n controller.initializeDrawer();\n // Event listener references with console logging\n const mouseEnterHandler = () => {\n if (config.debug)\n console.log(`Dropdown ${index + 1} - MOUSEENTER event triggered`);\n controller.open();\n };\n const mouseLeaveHandler = () => {\n if (config.debug)\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 if (config.debug)\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 if (config.debug)\n console.log(`Dropdown ${index + 1} - Attaching hover event listeners`);\n dropdown.addEventListener(\"mouseenter\", mouseEnterHandler);\n dropdown.addEventListener(\"mouseleave\", mouseLeaveHandler);\n }\n else {\n if (config.debug)\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 if (config.debug)\n console.log(`Dropdown ${index + 1} - Attaching hover event listeners`);\n dropdown.addEventListener(\"mouseenter\", mouseEnterHandler);\n dropdown.addEventListener(\"mouseleave\", mouseLeaveHandler);\n }\n else {\n if (config.debug)\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 if (config.debug)\n console.log(`Dropdown ${index + 1} - Attaching click listener to close element`);\n close.addEventListener(\"click\", controller.close);\n }\n if (config.debug)\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?");
|
|
279
|
+
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/* harmony import */ var _lib_helpers__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../lib/helpers */ \"./src/lib/helpers.ts\");\n/* harmony import */ var _lib_debug__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../lib/debug */ \"./src/lib/debug.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-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 */\n\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 dropdowns.forEach((dropdown, index) => {\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 // 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 = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_3__.findPetalElementByNameOrInParent)(dropdown, petalName, _lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_TOGGLE);\n const menu = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_3__.findPetalElementByNameOrInParent)(dropdown, petalName, _lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_MENU);\n const drawer = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_3__.findPetalElementByNameOrInParent)(dropdown, petalName, _lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DROPDOWN_MENU_BOX);\n const overlay = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_3__.findPetalElementByNameOrInParent)(dropdown, petalName, _lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_OVERLAY);\n const close = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_3__.findPetalElementByNameOrInParent)(dropdown, petalName, _lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_TRIGGER_CLOSE);\n // Validate required elements\n if (!toggle || !menu || !drawer) {\n return;\n }\n // ===========================\n // Configuration\n // ===========================\n const config = (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.parseDropdownConfig)(dropdown);\n if (config.debug) {\n console.log(`\\n=== Initializing Dropdown ${index + 1} ===`);\n if (petalName) {\n console.log(`Dropdown ${index + 1} - Name: \"${petalName}\"`);\n }\n (0,_lib_debug__WEBPACK_IMPORTED_MODULE_4__.debugElements)(config.debug, \"DROPDOWN\", \"toggle\", toggle);\n (0,_lib_debug__WEBPACK_IMPORTED_MODULE_4__.debugElements)(config.debug, \"DROPDOWN\", \"menu\", menu);\n (0,_lib_debug__WEBPACK_IMPORTED_MODULE_4__.debugElements)(config.debug, \"DROPDOWN\", \"drawer\", drawer);\n (0,_lib_debug__WEBPACK_IMPORTED_MODULE_4__.debugElements)(config.debug, \"DROPDOWN\", \"overlay\", overlay);\n (0,_lib_debug__WEBPACK_IMPORTED_MODULE_4__.debugElements)(config.debug, \"DROPDOWN\", \"close\", close);\n }\n (0,_dropdown_config__WEBPACK_IMPORTED_MODULE_1__.logConfig)(index, config);\n // ===========================\n // Controller Setup\n // ===========================\n const elements = { dropdown, toggle, menu, drawer, 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 dropdown is closed\n toggle.setAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ARIA_EXPANDED, \"false\");\n dropdown.setAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_STATE, \"closed\");\n // Initialize drawer to its animation's starting position\n controller.initializeDrawer();\n // Event listener references\n const mouseEnterHandler = () => {\n controller.open();\n };\n const mouseLeaveHandler = () => {\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 (0,_lib_debug__WEBPACK_IMPORTED_MODULE_4__.debug)(config.debug, \"DROPDOWN\", `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 dropdown.addEventListener(\"mouseenter\", mouseEnterHandler);\n dropdown.addEventListener(\"mouseleave\", mouseLeaveHandler);\n }\n else {\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 dropdown.addEventListener(\"mouseenter\", mouseEnterHandler);\n dropdown.addEventListener(\"mouseleave\", mouseLeaveHandler);\n }\n else {\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 close.addEventListener(\"click\", controller.close);\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?");
|
|
280
280
|
|
|
281
281
|
/***/ }),
|
|
282
282
|
|
|
@@ -296,7 +296,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
296
296
|
\*******************************************/
|
|
297
297
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
298
298
|
|
|
299
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ logConfig: () => (/* binding */ logConfig),\n/* harmony export */ parseModalConfig: () => (/* binding */ parseModalConfig)\n/* harmony export */ });\n/* harmony import */ var _lib_attributes__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../lib/attributes */ \"./src/lib/attributes.ts\");\n/**\n * Modal Configuration Module\n *\n * Handles parsing modal configuration from HTML attributes.\n */\n\n/**\n * Parses modal configuration from HTML element attributes\n */\nfunction parseModalConfig(modal) {\n const name = modal.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_NAME) || \"unknown\";\n const debug = modal.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DEBUG) === \"true\";\n const maskOpacity = parseFloat(modal.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_OVERLAY_OPACITY) || \"0.15\");\n const typeAttr = modal.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_MODAL_TYPE);\n const type = isValidModalType(typeAttr) ? typeAttr : \"center\";\n return {\n name,\n debug,\n maskOpacity,\n type,\n };\n}\n/**\n * Type guard to validate modal type\n */\nfunction isValidModalType(value) {\n return value === \"center\" || value === \"left\" || value === \"right\" || value === \"top\" || value === \"bottom\";\n}\n/**\n * Log configuration for debugging\n */\nfunction logConfig(config) {\n if (!config.debug)\n return;\n console.log(
|
|
299
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ logConfig: () => (/* binding */ logConfig),\n/* harmony export */ parseModalConfig: () => (/* binding */ parseModalConfig)\n/* harmony export */ });\n/* harmony import */ var _lib_attributes__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../lib/attributes */ \"./src/lib/attributes.ts\");\n/**\n * Modal Configuration Module\n *\n * Handles parsing modal configuration from HTML attributes.\n */\n\n/**\n * Parses modal configuration from HTML element attributes\n */\nfunction parseModalConfig(modal) {\n const name = modal.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_NAME) || \"unknown\";\n const debug = modal.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DEBUG) === \"true\";\n const maskOpacity = parseFloat(modal.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_OVERLAY_OPACITY) || \"0.15\");\n const typeAttr = modal.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_MODAL_TYPE);\n const type = isValidModalType(typeAttr) ? typeAttr : \"center\";\n const lockScrollOnOpen = modal.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_LOCK_SCROLL_ON_OPEN) !== \"false\"; // Default to true\n return {\n name,\n debug,\n maskOpacity,\n type,\n lockScrollOnOpen,\n };\n}\n/**\n * Type guard to validate modal type\n */\nfunction isValidModalType(value) {\n return value === \"center\" || value === \"left\" || value === \"right\" || value === \"top\" || value === \"bottom\";\n}\n/**\n * Log configuration for debugging\n */\nfunction logConfig(config) {\n if (!config.debug)\n return;\n console.log(config);\n}\n\n\n//# sourceURL=webpack://petal/./src/modules/modal/modal-config.ts?");
|
|
300
300
|
|
|
301
301
|
/***/ }),
|
|
302
302
|
|
|
@@ -306,7 +306,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
306
306
|
\***********************************************/
|
|
307
307
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
308
308
|
|
|
309
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ ModalController: () => (/* binding */ ModalController)\n/* harmony export */ });\n/* harmony import */ var _lib_memory__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../lib/memory */ \"./src/lib/memory.ts\");\n/* harmony import */ var _video__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../video */ \"./src/video.ts\");\n/* harmony import */ var
|
|
309
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ ModalController: () => (/* binding */ ModalController)\n/* harmony export */ });\n/* harmony import */ var _lib_memory__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../lib/memory */ \"./src/lib/memory.ts\");\n/* harmony import */ var _video__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../video */ \"./src/video.ts\");\n/* harmony import */ var _lib_scroll_lock__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../lib/scroll-lock */ \"./src/lib/scroll-lock.ts\");\n/* harmony import */ var _modal_animator__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./modal-animator */ \"./src/modules/modal/modal-animator.ts\");\n/**\n * Modal Controller Module\n *\n * Manages modal state and orchestrates opening/closing logic with animations.\n */\n\n\n\n\nclass ModalController {\n constructor(elements, config) {\n this.elements = elements;\n this.config = config;\n this.currentTimeline = null;\n /**\n * Opens the modal using GSAP\n */\n this.open = () => {\n // Kill any existing timeline\n if (this.currentTimeline) {\n this.currentTimeline.kill();\n this.currentTimeline = null;\n }\n // Lock scroll if configured\n if (this.config.lockScrollOnOpen) {\n (0,_lib_scroll_lock__WEBPACK_IMPORTED_MODULE_2__.lockScroll)();\n if (this.config.debug)\n console.log(`[DEBUG] Modal \"${this.config.name}\" - Locked scroll`);\n }\n this.currentTimeline = (0,_modal_animator__WEBPACK_IMPORTED_MODULE_3__.animateOpen)(this.elements, this.config);\n };\n /**\n * Closes the modal using GSAP\n */\n this.close = () => {\n // Kill any existing timeline\n if (this.currentTimeline) {\n this.currentTimeline.kill();\n this.currentTimeline = null;\n }\n // Unlock scroll if configured\n if (this.config.lockScrollOnOpen) {\n (0,_lib_scroll_lock__WEBPACK_IMPORTED_MODULE_2__.unlockScroll)();\n if (this.config.debug)\n console.log(`[DEBUG] Modal \"${this.config.name}\" - Unlocked scroll`);\n }\n // Pause any videos inside the modal\n (0,_video__WEBPACK_IMPORTED_MODULE_1__.pauseVideo)(this.elements.modal);\n if (this.config.debug)\n console.log(`[DEBUG] Modal \"${this.config.name}\" - Paused any videos`);\n // Store modal closed state\n (0,_lib_memory__WEBPACK_IMPORTED_MODULE_0__.storeClosedState)(\"modal\", this.config.name);\n if (this.config.debug)\n console.log(`[DEBUG] Modal \"${this.config.name}\" - Stored closed state in session`);\n this.currentTimeline = (0,_modal_animator__WEBPACK_IMPORTED_MODULE_3__.animateClose)(this.elements, this.config);\n };\n }\n}\n\n\n//# sourceURL=webpack://petal/./src/modules/modal/modal-controller.ts?");
|
|
310
310
|
|
|
311
311
|
/***/ }),
|
|
312
312
|
|
|
@@ -316,7 +316,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
316
316
|
\************************************/
|
|
317
317
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
318
318
|
|
|
319
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ initializeAllModals: () => (/* binding */ initializeAllModals)\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 _modal_config__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./modal-config */ \"./src/modules/modal/modal-config.ts\");\n/* harmony import */ var _modal_controller__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./modal-controller */ \"./src/modules/modal/modal-controller.ts\");\n/* harmony import */ var _modal_animator__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./modal-animator */ \"./src/modules/modal/modal-animator.ts\");\n/**\n * Modal Component\n *\n * Handles interactive modal dialogs with support for:\n * - GSAP animations\n * - Optional overlay with configurable opacity\n * - Video pause on close\n * - Session state storage\n * - Open/close triggers\n * - Overlay click-to-close\n *\n * HTML Attributes (defined in attributes.ts):\n * - petal-el=\"modal\" - Container element (required)\n * - petal-el=\"dialog\" - Dialog content (required)\n * - petal-el=\"overlay\" - Background overlay (optional)\n * - petal=\"name\" - Modal identifier (optional)\n * - petal-el=\"open\" - Open trigger (requires petal=\"name\" on trigger if outside modal)\n * - petal-el=\"trigger-close\" - Close trigger (auto-detects parent modal if no name)\n * - petal-overlay-close=\"true\" - Enable overlay click-to-close (default: true)\n * - petal-overlay-opacity=\"0.15\" - Overlay opacity (default: 0.15)\n * - petal-modal-type=\"center|left|right|top|bottom\" - Modal position type (default: center)\n * - petal-debug=\"true\" - Enable debug logging\n */\n\n\n\n\n\n/**\n * Initialize all modals on the page\n */\nfunction initializeAllModals() {\n const modals = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_1__.getAllPetalElementsOfType)(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_MODAL);\n
|
|
319
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ initializeAllModals: () => (/* binding */ initializeAllModals)\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 _modal_config__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./modal-config */ \"./src/modules/modal/modal-config.ts\");\n/* harmony import */ var _modal_controller__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./modal-controller */ \"./src/modules/modal/modal-controller.ts\");\n/* harmony import */ var _modal_animator__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./modal-animator */ \"./src/modules/modal/modal-animator.ts\");\n/* harmony import */ var _lib_debug__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../lib/debug */ \"./src/lib/debug.ts\");\n/**\n * Modal Component\n *\n * Handles interactive modal dialogs with support for:\n * - GSAP animations\n * - Optional overlay with configurable opacity\n * - Video pause on close\n * - Session state storage\n * - Open/close triggers\n * - Overlay click-to-close\n *\n * HTML Attributes (defined in attributes.ts):\n * - petal-el=\"modal\" - Container element (required)\n * - petal-el=\"dialog\" - Dialog content (required)\n * - petal-el=\"overlay\" - Background overlay (optional)\n * - petal=\"name\" - Modal identifier (optional)\n * - petal-el=\"open\" - Open trigger (requires petal=\"name\" on trigger if outside modal)\n * - petal-el=\"trigger-close\" - Close trigger (auto-detects parent modal if no name)\n * - petal-overlay-close=\"true\" - Enable overlay click-to-close (default: true)\n * - petal-overlay-opacity=\"0.15\" - Overlay opacity (default: 0.15)\n * - petal-modal-type=\"center|left|right|top|bottom\" - Modal position type (default: center)\n * - petal-debug=\"true\" - Enable debug logging\n */\n\n\n\n\n\n\n/**\n * Initialize all modals on the page\n */\nfunction initializeAllModals() {\n const modals = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_1__.getAllPetalElementsOfType)(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_MODAL);\n modals.forEach((modal, index) => {\n // ===========================\n // Configuration\n // ===========================\n const name = modal.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_NAME) || null;\n const config = (0,_modal_config__WEBPACK_IMPORTED_MODULE_2__.parseModalConfig)(modal);\n (0,_lib_debug__WEBPACK_IMPORTED_MODULE_5__.debug)(config.debug, \"MODAL\", `Processing ${name} (${index + 1}/${modals.length})`);\n (0,_modal_config__WEBPACK_IMPORTED_MODULE_2__.logConfig)(config);\n // ===========================\n // Element References\n // ===========================\n const overlay = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_1__.findPetalElementByNameOrInParent)(modal, name, _lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_OVERLAY);\n const dialog = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_1__.findPetalElementByNameOrInParent)(modal, name, _lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_DIALOG);\n const openTriggers = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_1__.findPetalElementsByNameOrInParent)(modal, name, _lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_TRIGGER_OPEN);\n const closeTriggers = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_1__.findPetalElementsByNameOrInParent)(modal, name, _lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_TRIGGER_CLOSE);\n (0,_lib_debug__WEBPACK_IMPORTED_MODULE_5__.debugElements)(config.debug, \"MODAL\", \"overlay\", overlay);\n (0,_lib_debug__WEBPACK_IMPORTED_MODULE_5__.debugElements)(config.debug, \"MODAL\", \"open trigger\", openTriggers);\n (0,_lib_debug__WEBPACK_IMPORTED_MODULE_5__.debugElements)(config.debug, \"MODAL\", \"close trigger\", closeTriggers);\n if (!dialog) {\n console.warn(`⚠️ [MODAL] Skipping modal \"${name}\" - missing dialog`);\n return;\n }\n // ===========================\n // Initialization\n // ===========================\n const elements = {\n modal: modal,\n dialog,\n mask: overlay,\n };\n // Create a single controller instance for this modal\n const controller = new _modal_controller__WEBPACK_IMPORTED_MODULE_3__.ModalController(elements, config);\n // Initialize Open Triggers\n openTriggers === null || openTriggers === void 0 ? void 0 : openTriggers.forEach((trigger, triggerIndex) => {\n trigger.addEventListener(\"click\", () => {\n controller.open();\n });\n });\n // Initialize Close Triggers\n closeTriggers === null || closeTriggers === void 0 ? void 0 : closeTriggers.forEach((trigger, triggerIndex) => {\n trigger.addEventListener(\"click\", () => {\n controller.close();\n });\n });\n // Find and attach close triggers without names (that are children of this modal)\n if (!name) {\n const allCloseTriggers = [...Array.from((0,_lib_helpers__WEBPACK_IMPORTED_MODULE_1__.getAllPetalElementsOfType)(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_TRIGGER_CLOSE))];\n allCloseTriggers.forEach((trigger) => {\n // Check if this close trigger doesn't have a name and is a child of this modal\n const triggerName = trigger.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_NAME);\n if (!triggerName) {\n const parentModal = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_1__.findClosestPetalParent)(trigger, _lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_MODAL);\n if (parentModal === modal) {\n trigger.addEventListener(\"click\", () => {\n controller.close();\n });\n }\n }\n });\n }\n // Initialize Overlay Close Trigger\n const overlayCloseAttr = modal.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_0__.ATTR_PETAL_OVERLAY_CLOSE);\n const overlayClose = overlayCloseAttr === null ? true : overlayCloseAttr === \"true\";\n if (overlay && overlayClose) {\n overlay.addEventListener(\"click\", () => {\n controller.close();\n });\n }\n (0,_modal_animator__WEBPACK_IMPORTED_MODULE_4__.initializeElements)(elements, config);\n });\n}\n\n\n//# sourceURL=webpack://petal/./src/modules/modal/modal.ts?");
|
|
320
320
|
|
|
321
321
|
/***/ }),
|
|
322
322
|
|
|
@@ -326,7 +326,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
326
326
|
\****************************************/
|
|
327
327
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
328
328
|
|
|
329
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ cleanupOverlays: () => (/* binding */ cleanupOverlays),\n/* harmony export */ initializeOverlays: () => (/* binding */ initializeOverlays)\n/* harmony export */ });\n/* harmony import */ var
|
|
329
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ cleanupOverlays: () => (/* binding */ cleanupOverlays),\n/* harmony export */ initializeOverlays: () => (/* binding */ initializeOverlays)\n/* harmony export */ });\n/* harmony import */ var _lib_debug__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../lib/debug */ \"./src/lib/debug.ts\");\n/* harmony import */ var _lib_attributes__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../lib/attributes */ \"./src/lib/attributes.ts\");\n/* harmony import */ var _lib_helpers__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../lib/helpers */ \"./src/lib/helpers.ts\");\n/* harmony import */ var gsap__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! gsap */ \"./node_modules/gsap/index.js\");\n/**\n * Overlay Component\n *\n * Handles overlays that respond to petal-state changes in grouped elements.\n * Overlays can be controlled by:\n * 1. petal-group attribute - Shows when any element with matching group has petal-state='active'|'open'\n * 2. petal name attribute - Shows when any element with matching name has petal-state='active'|'open'\n * 3. Parent element - Shows when parent element has petal-state='active'|'open'\n *\n * HTML Attributes:\n * - petal-el=\"overlay\" - The overlay element (required)\n * - petal-group=\"groupName\" - Group name to watch for active/open state (optional)\n * - petal=\"name\" - Name to watch for active/open state (optional, fallback if no group)\n *\n * Priority order: group > name > parent\n */\n\n\n\n\nconst overlayControllers = [];\n/**\n * Check if any element in a group has petal-state='active' or 'open'\n */\nfunction hasActiveElementInGroup(group) {\n const elements = document.querySelectorAll(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_GROUP}=\"${group}\"]`);\n return Array.from(elements).some((el) => {\n const state = el.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_STATE);\n return state === \"active\" || state === \"open\";\n });\n}\n/**\n * Check if any element with a name has petal-state='active' or 'open'\n */\nfunction hasActiveElementWithName(name) {\n const elements = document.querySelectorAll(`[${_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_NAME}=\"${name}\"]`);\n return Array.from(elements).some((el) => {\n const state = el.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_STATE);\n return state === \"active\" || state === \"open\";\n });\n}\n/**\n * Check if parent element has petal-state='active' or 'open'\n */\nfunction hasActiveParent(overlay) {\n const parent = overlay.parentElement;\n if (!parent)\n return false;\n const state = parent.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_STATE);\n return state === \"active\" || state === \"open\";\n}\n/**\n * Update overlay visibility based on active states\n */\nfunction updateOverlayVisibility(controller) {\n const { overlay, group, name, maxOpacity } = controller;\n let shouldShow = false;\n // Priority 1: Check group\n if (group) {\n shouldShow = hasActiveElementInGroup(group);\n }\n // Priority 2: Check name\n else if (name) {\n shouldShow = hasActiveElementWithName(name);\n }\n // Priority 3: Check parent\n else {\n shouldShow = hasActiveParent(overlay);\n }\n // Kill any existing animation\n if (controller.currentTimeline) {\n controller.currentTimeline.kill();\n controller.currentTimeline = null;\n }\n // Animate overlay\n if (shouldShow) {\n // Show and fade in\n const tl = gsap__WEBPACK_IMPORTED_MODULE_3__.gsap.timeline();\n tl.set(overlay, { display: \"flex\" });\n tl.to(overlay, { opacity: maxOpacity, duration: 0.3 });\n controller.currentTimeline = tl;\n }\n else {\n // Fade out and hide\n const tl = gsap__WEBPACK_IMPORTED_MODULE_3__.gsap.timeline({\n onComplete: () => {\n gsap__WEBPACK_IMPORTED_MODULE_3__.gsap.set(overlay, { display: \"none\" });\n },\n });\n tl.to(overlay, { opacity: 0, duration: 0.3 });\n controller.currentTimeline = tl;\n }\n}\n/**\n * Initialize a single overlay\n */\nfunction initializeOverlay(overlay) {\n const group = overlay.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_GROUP);\n const name = overlay.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_NAME);\n // Skip if this overlay is controlled by modal/dropdown\n // (i.e., it has a parent that's a modal or dropdown)\n const parentModal = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_2__.findClosestPetalParent)(overlay, \"modal\");\n const parentDropdown = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_2__.findClosestPetalParent)(overlay, \"dropdown\");\n // If overlay has a group or name attribute, it uses the new system\n // Otherwise, let modal/dropdown handle it\n if (!group && !name && (parentModal || parentDropdown)) {\n return null;\n }\n // Get max opacity from attribute (default to 1)\n const maxOpacity = parseFloat(overlay.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_OVERLAY_OPACITY) || \"1\");\n // Create controller\n const controller = {\n overlay,\n group,\n name,\n maxOpacity,\n observer: null, // Set below\n currentTimeline: null,\n cleanup: () => { },\n };\n // Set initial state\n gsap__WEBPACK_IMPORTED_MODULE_3__.gsap.set(overlay, { opacity: 0, display: \"none\" });\n // Set initial visibility\n updateOverlayVisibility(controller);\n // Watch for attribute changes on all relevant elements\n const observer = new MutationObserver((mutations) => {\n // Check if any mutation affects petal-state\n const stateChanged = mutations.some((mutation) => {\n if (mutation.type === \"attributes\" && mutation.attributeName === _lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_STATE) {\n const target = mutation.target;\n // Check if this element is in our group or has our name\n if (group && target.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_GROUP) === group)\n return true;\n if (name && target.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_NAME) === name)\n return true;\n if (!group && !name && target === overlay.parentElement)\n return true;\n return false;\n }\n return false;\n });\n if (stateChanged) {\n updateOverlayVisibility(controller);\n }\n });\n // Observe attribute changes on document body\n observer.observe(document.body, {\n attributes: true,\n attributeFilter: [_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_STATE],\n subtree: true,\n });\n controller.observer = observer;\n controller.cleanup = () => {\n observer.disconnect();\n };\n return controller;\n}\n/**\n * Initialize all overlays on the page\n */\nfunction initializeOverlays() {\n const overlays = (0,_lib_helpers__WEBPACK_IMPORTED_MODULE_2__.getAllPetalElementsOfType)(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_OVERLAY);\n overlays.forEach((overlay, index) => {\n const group = overlay.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_GROUP);\n const name = overlay.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_NAME);\n const d = overlay.getAttribute(_lib_attributes__WEBPACK_IMPORTED_MODULE_1__.ATTR_PETAL_DEBUG) === \"true\";\n (0,_lib_debug__WEBPACK_IMPORTED_MODULE_0__.debug)(d, \"OVERLAY\", `Overlay ${index + 1} - Group: \"${group}\", Name: \"${name}\"`);\n const controller = initializeOverlay(overlay);\n if (controller) {\n overlayControllers.push(controller);\n }\n else {\n }\n });\n}\n/**\n * Cleanup all overlay controllers\n */\nfunction cleanupOverlays() {\n overlayControllers.forEach((controller) => controller.cleanup());\n overlayControllers.length = 0;\n}\n\n\n//# sourceURL=webpack://petal/./src/modules/overlay/overlay.ts?");
|
|
330
330
|
|
|
331
331
|
/***/ }),
|
|
332
332
|
|
|
@@ -346,7 +346,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
|
|
|
346
346
|
\**********************/
|
|
347
347
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
348
348
|
|
|
349
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _modules_modal_modal__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./modules/modal/modal */ \"./src/modules/modal/modal.ts\");\n/* harmony import */ var _modules_banner_banner__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./modules/banner/banner */ \"./src/modules/banner/banner.ts\");\n/* harmony import */ var _modules_dropdown_dropdown__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./modules/dropdown/dropdown */ \"./src/modules/dropdown/dropdown.ts\");\n/* harmony import */ var _modules_overlay_overlay__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./modules/overlay/overlay */ \"./src/modules/overlay/overlay.ts\");\n/* harmony import */ var _petal_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./petal.css */ \"./src/petal.css\");\n/* harmony import */ var _modules_dropdown_dropdown_css__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./modules/dropdown/dropdown.css */ \"./src/modules/dropdown/dropdown.css\");\n\n\n\n\n\n\nconsole.log(`🌸 Hello from Wellflow Petal v${\"0.0.
|
|
349
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _modules_modal_modal__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./modules/modal/modal */ \"./src/modules/modal/modal.ts\");\n/* harmony import */ var _modules_banner_banner__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./modules/banner/banner */ \"./src/modules/banner/banner.ts\");\n/* harmony import */ var _modules_dropdown_dropdown__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./modules/dropdown/dropdown */ \"./src/modules/dropdown/dropdown.ts\");\n/* harmony import */ var _modules_overlay_overlay__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./modules/overlay/overlay */ \"./src/modules/overlay/overlay.ts\");\n/* harmony import */ var _petal_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./petal.css */ \"./src/petal.css\");\n/* harmony import */ var _modules_dropdown_dropdown_css__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./modules/dropdown/dropdown.css */ \"./src/modules/dropdown/dropdown.css\");\n\n\n\n\n\n\nconsole.log(`🌸 Hello from Wellflow Petal v${\"0.0.86\"}`);\n(0,_modules_modal_modal__WEBPACK_IMPORTED_MODULE_0__.initializeAllModals)();\n(0,_modules_banner_banner__WEBPACK_IMPORTED_MODULE_1__.initializeBanner)();\n(0,_modules_dropdown_dropdown__WEBPACK_IMPORTED_MODULE_2__.initializeDropdowns)();\n(0,_modules_overlay_overlay__WEBPACK_IMPORTED_MODULE_3__.initializeOverlays)();\n\n\n//# sourceURL=webpack://petal/./src/petal.ts?");
|
|
350
350
|
|
|
351
351
|
/***/ }),
|
|
352
352
|
|