well-petal 0.0.60 → 0.0.61

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.
Files changed (2) hide show
  1. package/dist/petal.js +2 -2
  2. package/package.json +1 -1
package/dist/petal.js CHANGED
@@ -26,7 +26,7 @@ return /******/ (() => { // webpackBootstrap
26
26
  \********************************************************************/
27
27
  /***/ ((module, __webpack_exports__, __webpack_require__) => {
28
28
 
29
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/noSourceMaps.js */ \"./node_modules/css-loader/dist/runtime/noSourceMaps.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);\n// Imports\n\n\nvar ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `/* ===========================\n Dropdown Core Styles\n =========================== */\n\n/* Default CSS variable values */\n[petal-el=\"dropdown\"] {\n --dropdown-open-duration: 0.5s;\n --dropdown-close-duration: 0.3s;\n}\n\n/* ===========================\n Dropdown Animations\n =========================== */\n\n/* Dropdown Menu: Initial (Closed) State - Hidden and prevent interaction */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"] {\n visibility: hidden;\n pointer-events: none;\n}\n\n/* Dropdown Menu: Open State - Visible and allow interaction */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"].w--open {\n visibility: visible;\n pointer-events: auto;\n}\n\n/* Dropdown Drawer: Initial (Closed) State - Common Styles */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-drawer\"] {\n visibility: hidden;\n opacity: 0;\n transition:\n transform var(--dropdown-close-duration, 0.3s) ease,\n opacity var(--dropdown-close-duration, 0.3s) ease,\n visibility 0s var(--dropdown-close-duration, 0.3s);\n}\n\n/* Dropdown Drawer: Open State - Common Styles */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"].w--open [petal-el=\"dropdown-drawer\"] {\n visibility: visible;\n opacity: 1;\n transition:\n transform var(--dropdown-open-duration, 0.5s) ease,\n opacity var(--dropdown-open-duration, 0.5s) ease,\n visibility 0s;\n}\n\n/* Animation: Slide Down (Default) */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-down\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateY(-10px);\n transform-origin: top;\n}\n\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-down\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateY(0);\n}\n\n/* Animation: Slide Up */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-up\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateY(10px);\n transform-origin: bottom;\n}\n\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-up\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateY(0);\n}\n\n/* Animation: Slide Left */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-left\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateX(10px);\n}\n\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-left\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateX(0);\n}\n\n/* Animation: Slide Right */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-right\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateX(-10px);\n}\n\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-right\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateX(0);\n}\n\n/* ===========================\n Tablet Animations (max-width: 991px)\n =========================== */\n\n@media screen and (max-width: 991px) {\n /* Animation: Slide Down */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-down\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateY(-10px);\n transform-origin: top;\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-down\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateY(0);\n }\n\n /* Animation: Slide Up */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-up\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateY(10px);\n transform-origin: bottom;\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-up\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateY(0);\n }\n\n /* Animation: Slide Left */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-left\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateX(10px);\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-left\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateX(0);\n }\n\n /* Animation: Slide Right */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-right\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateX(-10px);\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-right\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateX(0);\n }\n}\n\n/* ===========================\n Mobile Landscape Animations (max-width: 767px)\n =========================== */\n\n@media screen and (max-width: 767px) {\n /* Animation: Slide Down */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-down\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateY(-10px);\n transform-origin: top;\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-down\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateY(0);\n }\n\n /* Animation: Slide Up */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-up\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateY(10px);\n transform-origin: bottom;\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-up\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateY(0);\n }\n\n /* Animation: Slide Left */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-left\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateX(10px);\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-left\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateX(0);\n }\n\n /* Animation: Slide Right */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-right\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateX(-10px);\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-right\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateX(0);\n }\n}\n\n/* ===========================\n Mobile Animations (max-width: 479px)\n =========================== */\n\n@media screen and (max-width: 479px) {\n /* Animation: Slide Down */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-down\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateY(-10px);\n transform-origin: top;\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-down\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateY(0);\n }\n\n /* Animation: Slide Up */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-up\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateY(10px);\n transform-origin: bottom;\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-up\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateY(0);\n }\n\n /* Animation: Slide Left */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-left\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateX(10px);\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-left\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateX(0);\n }\n\n /* Animation: Slide Right */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-right\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateX(-10px);\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-right\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateX(0);\n }\n}\n\n/* ===========================\n Dropdown Backdrop\n =========================== */\n\n[petal-el=\"dropdown-backdrop\"] {\n opacity: 0;\n transition: opacity var(--dropdown-close-duration, 0.3s) ease;\n}\n\nbody:has([petal-el=\"dropdown\"] > [petal-el=\"dropdown-toggle\"][aria-expanded=\"true\"]) [petal-el=\"dropdown-backdrop\"] {\n opacity: 1;\n transition: opacity var(--dropdown-open-duration, 0.5s) ease;\n}\n\n/* ===========================\n Desktop Styles (Default - applies to all screen sizes first)\n =========================== */\n\n/* All dropdowns get standard desktop behavior by default */\n[petal-el=\"dropdown\"] {\n width: auto;\n}\n\n[petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"] {\n position: absolute;\n z-index: 1000;\n}\n\n[petal-el=\"dropdown-scroll\"] {\n overflow-x: hidden;\n overflow-y: auto !important;\n}\n\n/* ===========================\n Mobile Styles (Override on small containers)\n =========================== */\n\n@media screen and (max-width: 991px) {\n /* Hide dropdown toggle permanently on mobile ONLY when petal-dropdown-open-on-mobile is true */\n [petal-el=\"dropdown\"][petal-dropdown-open-on-tablet=\"true\"] [petal-el=\"dropdown-toggle\"] {\n display: none !important;\n }\n\n /* Make dropdown menu static positioning on mobile */\n [petal-el=\"dropdown\"][petal-dropdown-open-on-tablet=\"true\"] [petal-el=\"dropdown-menu\"] {\n position: static !important;\n }\n\n /* Unset all styles on dropdown-drawer on mobile ONLY when petal-dropdown-open-on-mobile is true */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"][petal-dropdown-open-on-tablet=\"true\"] [petal-el=\"dropdown-drawer\"] {\n all: unset !important;\n display: block !important;\n }\n\n /* Hide dropdown background on mobile ONLY when petal-dropdown-open-on-mobile is true */\n [petal-el=\"dropdown\"][petal-dropdown-open-on-tablet=\"true\"] [petal-el=\"dropdown-background\"] {\n display: none;\n }\n}\n\n@media screen and (max-width: 767px) {\n /* Hide dropdown toggle permanently on mobile ONLY when petal-dropdown-open-on-mobile is true */\n [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile-landscape=\"true\"] [petal-el=\"dropdown-toggle\"] {\n display: none !important;\n }\n\n /* Make dropdown menu static positioning on mobile */\n [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile-landscape=\"true\"] [petal-el=\"dropdown-menu\"] {\n position: static !important;\n }\n\n /* Unset all styles on dropdown-drawer on mobile ONLY when petal-dropdown-open-on-mobile is true */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile-landscape=\"true\"] [petal-el=\"dropdown-drawer\"] {\n all: unset !important;\n display: block !important;\n }\n\n /* Hide dropdown background on mobile ONLY when petal-dropdown-open-on-mobile is true */\n [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile-landscape=\"true\"] [petal-el=\"dropdown-background\"] {\n display: none;\n }\n}\n\n@media screen and (max-width: 479px) {\n /* Hide dropdown toggle permanently on mobile ONLY when petal-dropdown-open-on-mobile is true */\n [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile=\"true\"] [petal-el=\"dropdown-toggle\"] {\n display: none !important;\n }\n\n /* Make dropdown menu static positioning on mobile */\n [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile=\"true\"] [petal-el=\"dropdown-menu\"] {\n position: static !important;\n }\n\n /* Unset all styles on dropdown-drawer on mobile ONLY when petal-dropdown-open-on-mobile is true */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile=\"true\"] [petal-el=\"dropdown-drawer\"] {\n all: unset !important;\n display: block !important;\n }\n\n /* Hide dropdown background on mobile ONLY when petal-dropdown-open-on-mobile is true */\n [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile=\"true\"] [petal-el=\"dropdown-background\"] {\n display: none;\n }\n}\n`, \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://petal/./src/lib/dropdown.css?./node_modules/css-loader/dist/cjs.js");
29
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/noSourceMaps.js */ \"./node_modules/css-loader/dist/runtime/noSourceMaps.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);\n// Imports\n\n\nvar ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `/* ===========================\n Dropdown Core Styles\n =========================== */\n\n/* Default CSS variable values */\n[petal-el=\"dropdown\"] {\n --dropdown-open-duration: 0.5s;\n --dropdown-close-duration: 0.3s;\n}\n\n/* ===========================\n Dropdown Animations\n =========================== */\n\n/* Dropdown Menu: Initial (Closed) State - Hidden and prevent interaction */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"] {\n visibility: hidden;\n pointer-events: none;\n}\n\n/* Dropdown Menu: Open State - Visible and allow interaction */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"].w--open {\n visibility: visible;\n pointer-events: auto;\n}\n\n/* Dropdown Drawer: Initial (Closed) State - Common Styles */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-drawer\"] {\n visibility: hidden;\n opacity: 0;\n transition:\n transform var(--dropdown-close-duration, 0.3s) ease,\n opacity var(--dropdown-close-duration, 0.3s) ease,\n visibility 0s var(--dropdown-close-duration, 0.3s);\n}\n\n/* Dropdown Drawer: Open State - Common Styles */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"].w--open [petal-el=\"dropdown-drawer\"] {\n visibility: visible;\n opacity: 1;\n transition:\n transform var(--dropdown-open-duration, 0.5s) ease,\n opacity var(--dropdown-open-duration, 0.5s) ease,\n visibility 0s;\n}\n\n/* Animation: Slide Down (Default) */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-down\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateY(-10px);\n transform-origin: top;\n}\n\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-down\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateY(0);\n}\n\n/* Animation: Slide Up */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-up\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateY(10px);\n transform-origin: bottom;\n}\n\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-up\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateY(0);\n}\n\n/* Animation: Slide Left */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-left\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateX(10px);\n}\n\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-left\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateX(0);\n}\n\n/* Animation: Slide Right */\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-right\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateX(-10px);\n}\n\nhtml:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim=\"slide-right\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateX(0);\n}\n\n/* ===========================\n Tablet Animations (max-width: 991px)\n =========================== */\n\n@media screen and (max-width: 991px) {\n /* Animation: Slide Down */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-down\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateY(-10px);\n transform-origin: top;\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-down\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateY(0);\n }\n\n /* Animation: Slide Up */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-up\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateY(10px);\n transform-origin: bottom;\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-up\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateY(0);\n }\n\n /* Animation: Slide Left */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-left\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateX(10px);\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-left\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateX(0);\n }\n\n /* Animation: Slide Right */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-right\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateX(-10px);\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-tablet=\"slide-right\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateX(0);\n }\n}\n\n/* ===========================\n Mobile Landscape Animations (max-width: 767px)\n =========================== */\n\n@media screen and (max-width: 767px) {\n /* Animation: Slide Down */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-down\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateY(-10px);\n transform-origin: top;\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-down\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateY(0);\n }\n\n /* Animation: Slide Up */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-up\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateY(10px);\n transform-origin: bottom;\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-up\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateY(0);\n }\n\n /* Animation: Slide Left */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-left\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateX(10px);\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-left\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateX(0);\n }\n\n /* Animation: Slide Right */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-right\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateX(-10px);\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile-landscape=\"slide-right\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateX(0);\n }\n}\n\n/* ===========================\n Mobile Animations (max-width: 479px)\n =========================== */\n\n@media screen and (max-width: 479px) {\n /* Animation: Slide Down */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-down\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateY(-10px);\n transform-origin: top;\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-down\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateY(0);\n }\n\n /* Animation: Slide Up */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-up\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateY(10px);\n transform-origin: bottom;\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-up\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateY(0);\n }\n\n /* Animation: Slide Left */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-left\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateX(10px);\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-left\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateX(0);\n }\n\n /* Animation: Slide Right */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-right\"] [petal-el=\"dropdown-drawer\"] {\n transform: translateX(-10px);\n }\n\n html:not(.wf-design-mode) [petal-el=\"dropdown\"] [petal-el=\"dropdown-menu\"][data-anim-mobile=\"slide-right\"].w--open [petal-el=\"dropdown-drawer\"] {\n transform: translateX(0);\n }\n}\n\n/* ===========================\n Dropdown Backdrop\n =========================== */\n\n[petal-el=\"dropdown-backdrop\"] {\n opacity: 0;\n transition: opacity var(--dropdown-close-duration, 0.3s) ease;\n}\n\nbody:has([petal-el=\"dropdown\"] > [petal-el=\"dropdown-toggle\"][aria-expanded=\"true\"]) [petal-el=\"dropdown-backdrop\"] {\n opacity: 1;\n transition: opacity var(--dropdown-open-duration, 0.5s) ease;\n}\n\n/* ===========================\n Mobile Styles (Override on small containers)\n =========================== */\n\n@media screen and (max-width: 991px) {\n /* Hide dropdown toggle permanently on mobile ONLY when petal-dropdown-open-on-mobile is true */\n [petal-el=\"dropdown\"][petal-dropdown-open-on-tablet=\"true\"] [petal-el=\"dropdown-toggle\"] {\n display: none !important;\n }\n\n /* Make dropdown menu static positioning on mobile */\n [petal-el=\"dropdown\"][petal-dropdown-open-on-tablet=\"true\"] [petal-el=\"dropdown-menu\"] {\n position: static !important;\n }\n\n /* Unset all styles on dropdown-drawer on mobile ONLY when petal-dropdown-open-on-mobile is true */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"][petal-dropdown-open-on-tablet=\"true\"] [petal-el=\"dropdown-drawer\"] {\n all: unset !important;\n display: block !important;\n }\n\n /* Hide dropdown background on mobile ONLY when petal-dropdown-open-on-mobile is true */\n [petal-el=\"dropdown\"][petal-dropdown-open-on-tablet=\"true\"] [petal-el=\"dropdown-background\"] {\n display: none;\n }\n}\n\n@media screen and (max-width: 767px) {\n /* Hide dropdown toggle permanently on mobile ONLY when petal-dropdown-open-on-mobile is true */\n [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile-landscape=\"true\"] [petal-el=\"dropdown-toggle\"] {\n display: none !important;\n }\n\n /* Make dropdown menu static positioning on mobile */\n [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile-landscape=\"true\"] [petal-el=\"dropdown-menu\"] {\n position: static !important;\n }\n\n /* Unset all styles on dropdown-drawer on mobile ONLY when petal-dropdown-open-on-mobile is true */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile-landscape=\"true\"] [petal-el=\"dropdown-drawer\"] {\n all: unset !important;\n display: block !important;\n }\n\n /* Hide dropdown background on mobile ONLY when petal-dropdown-open-on-mobile is true */\n [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile-landscape=\"true\"] [petal-el=\"dropdown-background\"] {\n display: none;\n }\n}\n\n@media screen and (max-width: 479px) {\n /* Hide dropdown toggle permanently on mobile ONLY when petal-dropdown-open-on-mobile is true */\n [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile=\"true\"] [petal-el=\"dropdown-toggle\"] {\n display: none !important;\n }\n\n /* Make dropdown menu static positioning on mobile */\n [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile=\"true\"] [petal-el=\"dropdown-menu\"] {\n position: static !important;\n }\n\n /* Unset all styles on dropdown-drawer on mobile ONLY when petal-dropdown-open-on-mobile is true */\n html:not(.wf-design-mode) [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile=\"true\"] [petal-el=\"dropdown-drawer\"] {\n all: unset !important;\n display: block !important;\n }\n\n /* Hide dropdown background on mobile ONLY when petal-dropdown-open-on-mobile is true */\n [petal-el=\"dropdown\"][petal-dropdown-open-on-mobile=\"true\"] [petal-el=\"dropdown-background\"] {\n display: none;\n }\n}\n`, \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://petal/./src/lib/dropdown.css?./node_modules/css-loader/dist/cjs.js");
30
30
 
31
31
  /***/ }),
32
32
 
@@ -266,7 +266,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
266
266
  \**********************/
267
267
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
268
268
 
269
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _popup__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./popup */ \"./src/popup.ts\");\n/* harmony import */ var _banner__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./banner */ \"./src/banner.ts\");\n/* harmony import */ var _lib_dropdown__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./lib/dropdown */ \"./src/lib/dropdown.ts\");\n/* harmony import */ var _petal_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./petal.css */ \"./src/petal.css\");\n/* harmony import */ var _lib_dropdown_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./lib/dropdown.css */ \"./src/lib/dropdown.css\");\n\n\n\n\n\nconsole.log(`🌸 Hello from Wellflow Petal v${\"0.0.60\"}`);\n(0,_popup__WEBPACK_IMPORTED_MODULE_0__.initializeAllPopups)();\n(0,_popup__WEBPACK_IMPORTED_MODULE_0__.initializePopupTriggers)();\n(0,_banner__WEBPACK_IMPORTED_MODULE_1__.initializeBanner)();\n(0,_lib_dropdown__WEBPACK_IMPORTED_MODULE_2__.initializeDropdowns)();\n\n\n//# sourceURL=webpack://petal/./src/petal.ts?");
269
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _popup__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./popup */ \"./src/popup.ts\");\n/* harmony import */ var _banner__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./banner */ \"./src/banner.ts\");\n/* harmony import */ var _lib_dropdown__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./lib/dropdown */ \"./src/lib/dropdown.ts\");\n/* harmony import */ var _petal_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./petal.css */ \"./src/petal.css\");\n/* harmony import */ var _lib_dropdown_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./lib/dropdown.css */ \"./src/lib/dropdown.css\");\n\n\n\n\n\nconsole.log(`🌸 Hello from Wellflow Petal v${\"0.0.61\"}`);\n(0,_popup__WEBPACK_IMPORTED_MODULE_0__.initializeAllPopups)();\n(0,_popup__WEBPACK_IMPORTED_MODULE_0__.initializePopupTriggers)();\n(0,_banner__WEBPACK_IMPORTED_MODULE_1__.initializeBanner)();\n(0,_lib_dropdown__WEBPACK_IMPORTED_MODULE_2__.initializeDropdowns)();\n\n\n//# sourceURL=webpack://petal/./src/petal.ts?");
270
270
 
271
271
  /***/ }),
272
272
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "well-petal",
3
- "version": "0.0.60",
3
+ "version": "0.0.61",
4
4
  "description": "Webflow Popups powered by attributes",
5
5
  "main": "dist/petal.js",
6
6
  "files": [