well-petal 0.0.85 → 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 +4 -4
- 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
|
|
|
@@ -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(config);\n}\n\n\n//# sourceURL=webpack://petal/./src/modules/modal/modal-config.ts?");
|
|
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
|
|
|
@@ -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
|
|