@purpurds/drawer 8.12.1 → 8.13.0

package/dist/styles.css

@@ -1 +1 @@
-._purpur-drawer-content_71yig_1{bottom:0;height:95.5vh;height:95.5dvh;max-width:100%;position:absolute;width:100%;transform:translateY(var(--purpur-drawer-swipe-move-y))}@media(prefers-reduced-motion:no-preference){._purpur-drawer-content_71yig_1:not([data-swipe=move]){transition:transform var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}._purpur-drawer-content_71yig_1[data-state=open]{animation:_slideUp_71yig_1 var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}._purpur-drawer-content_71yig_1[data-state=closed]{animation:_slideDown_71yig_1 var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}}._purpur-drawer-content--left_71yig_21{left:0}._purpur-drawer-content--right_71yig_24{right:0}._purpur-drawer-content--fit-to-content_71yig_27{display:flex;flex-direction:column;height:auto;max-height:95.5vh;max-height:95.5dvh}@media screen and (min-width:600px){._purpur-drawer-content_71yig_1{height:100vh;height:100dvh;max-width:calc(30rem * var(--purpur-rescale));top:0}._purpur-drawer-content--fit-to-content_71yig_27{max-height:100vh;max-height:100dvh}}@media screen and (min-width:600px)and (prefers-reduced-motion:no-preference){._purpur-drawer-content--right_71yig_24[data-state=open]{animation:_slideInRight_71yig_1 var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}._purpur-drawer-content--left_71yig_21[data-state=open]{animation:_slideInLeft_71yig_1 var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}._purpur-drawer-content--right_71yig_24[data-state=closed]{animation:_slideOutRight_71yig_1 var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}._purpur-drawer-content--left_71yig_21[data-state=closed]{animation:_slideOutLeft_71yig_1 var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}}._purpur-drawer-content_71yig_1:focus{outline:none}._purpur-drawer-content__content-container_71yig_63{display:flex;flex-direction:column;gap:var(--purpur-spacing-400)}._purpur-drawer-content__description_71yig_68{color:var(--purpur-color-text-default);display:block;font-family:var(--purpur-typography-family-default);font-size:var(--purpur-typography-scale-100);font-weight:var(--purpur-typography-weight-normal);-webkit-hyphens:none;hyphens:none;line-height:var(--purpur-typography-line-height-loose);margin:0}._purpur-drawer-overlay_71yig_79{background:var(--purpur-color-overlay-default);inset:0;position:fixed}@media(prefers-reduced-motion:no-preference){._purpur-drawer-overlay_71yig_79{transition:opacity var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}._purpur-drawer-overlay_71yig_79[data-state=open]{animation:_fadeIn_71yig_1 var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}._purpur-drawer-overlay_71yig_79[data-state=closed]{animation:_fadeOut_71yig_1 var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}}@keyframes _fadeIn_71yig_1{0%{opacity:0}to{opacity:1}}@keyframes _fadeOut_71yig_1{0%{opacity:1}to{opacity:0}}@keyframes _slideInRight_71yig_1{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes _slideOutRight_71yig_1{0%{transform:translate(0)}to{transform:translate(100%)}}@keyframes _slideInLeft_71yig_1{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes _slideOutLeft_71yig_1{0%{transform:translate(0)}to{transform:translate(-100%)}}@keyframes _slideUp_71yig_1{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes _slideDown_71yig_1{0%{transform:translateY(var(--purpur-drawer-swipe-end-y))}to{transform:translateY(100%)}}._purpur-drawer-container--header_1bcla_1{border-bottom:var(--purpur-border-width-xs) solid var(--purpur-color-border-weak)}._purpur-drawer-container--body_1bcla_4{padding:var(--purpur-spacing-300) var(--purpur-spacing-page-padding-sm) 0}@media screen and (min-width:600px){._purpur-drawer-container--body_1bcla_4{padding:var(--purpur-spacing-400) var(--purpur-spacing-300) 0}}._purpur-drawer-container--body_1bcla_4._purpur-drawer-container--sticky_1bcla_12{padding:var(--purpur-spacing-300) var(--purpur-spacing-page-padding-sm)}@media screen and (min-width:600px){._purpur-drawer-container--body_1bcla_4._purpur-drawer-container--sticky_1bcla_12{padding:var(--purpur-spacing-400) var(--purpur-spacing-300)}}._purpur-drawer-container--footer_1bcla_20{padding:0 var(--purpur-spacing-page-padding-sm) var(--purpur-spacing-200)}@media screen and (min-width:600px){._purpur-drawer-container--footer_1bcla_20{padding:0 var(--purpur-spacing-300) var(--purpur-spacing-200)}}._purpur-drawer-container--footer_1bcla_20._purpur-drawer-container--sticky_1bcla_12{border-top:var(--purpur-border-width-xs) solid var(--purpur-color-border-weak);padding:var(--purpur-spacing-200) var(--purpur-spacing-page-padding-sm)}@media screen and (min-width:600px){._purpur-drawer-container--footer_1bcla_20._purpur-drawer-container--sticky_1bcla_12{padding:var(--purpur-spacing-200) var(--purpur-spacing-300)}}._purpur-drawer-frame_1didd_1{background-color:var(--purpur-color-background-primary);border-top-left-radius:var(--purpur-border-radius-lg);border-top-right-radius:var(--purpur-border-radius-lg);box-shadow:var(--purpur-shadow-lg);display:flex;flex-direction:column;height:100%;position:relative}._purpur-drawer-frame--without-back-button_1didd_11 ._purpur-drawer-frame__header_1didd_11{padding:var(--purpur-spacing-300) calc(56 * var(--purpur-spacing-10)) var(--purpur-spacing-150) var(--purpur-spacing-200)}._purpur-drawer-frame--with-back-button_1didd_14 ._purpur-drawer-frame__header_1didd_11{padding:calc(14 * var(--purpur-spacing-10)) var(--purpur-spacing-200) var(--purpur-spacing-150)}@media screen and (min-width:600px){._purpur-drawer-frame--left_1didd_18{border-bottom-right-radius:var(--purpur-border-radius-lg);border-top-left-radius:0}._purpur-drawer-frame--right_1didd_22{border-bottom-left-radius:var(--purpur-border-radius-lg);border-top-right-radius:0}._purpur-drawer-frame--without-back-button_1didd_11 ._purpur-drawer-frame__header_1didd_11{padding:var(--purpur-spacing-300) calc(64 * var(--purpur-spacing-10)) var(--purpur-spacing-200) var(--purpur-spacing-300)}._purpur-drawer-frame--with-back-button_1didd_14 ._purpur-drawer-frame__header_1didd_11{padding:calc(14 * var(--purpur-spacing-10)) var(--purpur-spacing-300) var(--purpur-spacing-200)}}._purpur-drawer-frame--sticky-footer_1didd_33{gap:0}._purpur-drawer-frame__header_1didd_11{flex:0 0 auto}._purpur-drawer-frame__body_1didd_39{flex:1 1 auto;overflow:hidden}._purpur-drawer-frame--fit-to-content_1didd_43{flex:1 1 auto;height:auto;overflow:hidden}._purpur-drawer-frame--fit-to-content_1didd_43 ._purpur-drawer-frame__body_1didd_39{display:flex;flex-direction:column}._purpur-drawer-frame__footer_1didd_52{flex:0 0 auto}._purpur-drawer-frame__content-container_1didd_55{display:flex;flex-direction:column;gap:var(--purpur-spacing-400)}._purpur-drawer-frame__content-container--no-footer_1didd_60{margin-bottom:var(--purpur-spacing-400)}._purpur-drawer-handle_3n0ew_1{align-items:center;display:flex;height:var(--purpur-spacing-250);justify-content:center;position:absolute;top:0;width:100%}@media screen and (min-width:600px){._purpur-drawer-handle_3n0ew_1{display:none}}._purpur-drawer-handle_3n0ew_1:before{content:"";background:var(--purpur-color-border-weak);border-radius:var(--purpur-border-radius-full);height:var(--purpur-spacing-50);width:var(--purpur-spacing-600)}._purpur-drawer-header_1iujy_1{min-height:calc(1.25*clamp(var(--purpur-typography-scale-200),3cqw,var(--purpur-typography-scale-400)))}._purpur-drawer-header__row_1iujy_4{display:flex}._purpur-drawer-header__row--with-back-button_1iujy_7{margin-bottom:var(--purpur-spacing-100)}._purpur-drawer-header__left_1iujy_10{flex:1 1 auto}._purpur-drawer-header__right_1iujy_13{flex:0 0 auto}._purpur-drawer-header_1iujy_1 ._purpur-drawer-header__close-button_1iujy_16{position:absolute;top:calc(14 * var(--purpur-spacing-10));right:calc(6 * var(--purpur-spacing-10));padding:calc(10 * var(--purpur-spacing-10))}@media screen and (min-width:600px){._purpur-drawer-header_1iujy_1 ._purpur-drawer-header__close-button_1iujy_16{right:calc(14 * var(--purpur-spacing-10))}}._purpur-drawer-header__back-button--only-icon_1iujy_27{margin-left:calc(-1 * var(--purpur-spacing-100))}._purpur-drawer-scroll-area__root_1hyos_1{height:100%}._purpur-drawer-scroll-area__root--fit-to-content_1hyos_4{display:flex;flex-direction:column;height:auto;overflow:hidden}._purpur-drawer-scroll-area__viewport_1hyos_10{position:relative;height:100%}._purpur-drawer-scroll-area__scrollbar_1hyos_14{display:flex;-webkit-user-select:none;user-select:none;touch-action:none;padding:var(--purpur-spacing-25);background:var(--purpur-color-functional-white);transition:background var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out);width:var(--purpur-spacing-100)}._purpur-drawer-scroll-area__thumb_1hyos_25{background:var(--purpur-color-gray-200);border-radius:var(--purpur-spacing-200);flex:1;position:relative}._purpur-drawer-scroll-area__thumb_1hyos_25:before{content:"";height:100%;left:50%;min-height:var(--purpur-spacing-300);min-width:var(--purpur-spacing-300);position:absolute;top:50%;transform:translate(-50%,-50%);width:100%}
+._purpur-drawer-content_71yig_1{bottom:0;height:95.5vh;height:95.5dvh;max-width:100%;position:absolute;width:100%;transform:translateY(var(--purpur-drawer-swipe-move-y))}@media (prefers-reduced-motion: no-preference){._purpur-drawer-content_71yig_1:not([data-swipe=move]){transition:transform var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}._purpur-drawer-content_71yig_1[data-state=open]{animation:_slideUp_71yig_1 var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}._purpur-drawer-content_71yig_1[data-state=closed]{animation:_slideDown_71yig_1 var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}}._purpur-drawer-content--left_71yig_21{left:0}._purpur-drawer-content--right_71yig_24{right:0}._purpur-drawer-content--fit-to-content_71yig_27{display:flex;flex-direction:column;height:auto;max-height:95.5vh;max-height:95.5dvh}@media screen and (min-width: 600px){._purpur-drawer-content_71yig_1{height:100vh;height:100dvh;max-width:calc(30rem * var(--purpur-rescale));top:0}._purpur-drawer-content--fit-to-content_71yig_27{max-height:100vh;max-height:100dvh}}@media screen and (min-width: 600px) and (prefers-reduced-motion: no-preference){._purpur-drawer-content--right_71yig_24[data-state=open]{animation:_slideInRight_71yig_1 var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}._purpur-drawer-content--left_71yig_21[data-state=open]{animation:_slideInLeft_71yig_1 var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}._purpur-drawer-content--right_71yig_24[data-state=closed]{animation:_slideOutRight_71yig_1 var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}._purpur-drawer-content--left_71yig_21[data-state=closed]{animation:_slideOutLeft_71yig_1 var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}}._purpur-drawer-content_71yig_1:focus{outline:none}._purpur-drawer-content__content-container_71yig_63{display:flex;flex-direction:column;gap:var(--purpur-spacing-400)}._purpur-drawer-content__description_71yig_68{color:var(--purpur-color-text-default);display:block;font-family:var(--purpur-typography-family-default);font-size:var(--purpur-typography-scale-100);font-weight:var(--purpur-typography-weight-normal);-webkit-hyphens:none;hyphens:none;line-height:var(--purpur-typography-line-height-loose);margin:0}._purpur-drawer-overlay_71yig_79{background:var(--purpur-color-overlay-default);inset:0;position:fixed}@media (prefers-reduced-motion: no-preference){._purpur-drawer-overlay_71yig_79{transition:opacity var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}._purpur-drawer-overlay_71yig_79[data-state=open]{animation:_fadeIn_71yig_1 var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}._purpur-drawer-overlay_71yig_79[data-state=closed]{animation:_fadeOut_71yig_1 var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}}@keyframes _fadeIn_71yig_1{0%{opacity:0}to{opacity:1}}@keyframes _fadeOut_71yig_1{0%{opacity:1}to{opacity:0}}@keyframes _slideInRight_71yig_1{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes _slideOutRight_71yig_1{0%{transform:translate(0)}to{transform:translate(100%)}}@keyframes _slideInLeft_71yig_1{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes _slideOutLeft_71yig_1{0%{transform:translate(0)}to{transform:translate(-100%)}}@keyframes _slideUp_71yig_1{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes _slideDown_71yig_1{0%{transform:translateY(var(--purpur-drawer-swipe-end-y))}to{transform:translateY(100%)}}._purpur-drawer-container--header_1bcla_1{border-bottom:var(--purpur-border-width-xs) solid var(--purpur-color-border-weak)}._purpur-drawer-container--body_1bcla_4{padding:var(--purpur-spacing-300) var(--purpur-spacing-page-padding-sm) 0}@media screen and (min-width: 600px){._purpur-drawer-container--body_1bcla_4{padding:var(--purpur-spacing-400) var(--purpur-spacing-300) 0}}._purpur-drawer-container--body_1bcla_4._purpur-drawer-container--sticky_1bcla_12{padding:var(--purpur-spacing-300) var(--purpur-spacing-page-padding-sm)}@media screen and (min-width: 600px){._purpur-drawer-container--body_1bcla_4._purpur-drawer-container--sticky_1bcla_12{padding:var(--purpur-spacing-400) var(--purpur-spacing-300)}}._purpur-drawer-container--footer_1bcla_20{padding:0 var(--purpur-spacing-page-padding-sm) var(--purpur-spacing-200)}@media screen and (min-width: 600px){._purpur-drawer-container--footer_1bcla_20{padding:0 var(--purpur-spacing-300) var(--purpur-spacing-200)}}._purpur-drawer-container--footer_1bcla_20._purpur-drawer-container--sticky_1bcla_12{border-top:var(--purpur-border-width-xs) solid var(--purpur-color-border-weak);padding:var(--purpur-spacing-200) var(--purpur-spacing-page-padding-sm)}@media screen and (min-width: 600px){._purpur-drawer-container--footer_1bcla_20._purpur-drawer-container--sticky_1bcla_12{padding:var(--purpur-spacing-200) var(--purpur-spacing-300)}}._purpur-drawer-frame_1didd_1{background-color:var(--purpur-color-background-primary);border-top-left-radius:var(--purpur-border-radius-lg);border-top-right-radius:var(--purpur-border-radius-lg);box-shadow:var(--purpur-shadow-lg);display:flex;flex-direction:column;height:100%;position:relative}._purpur-drawer-frame--without-back-button_1didd_11 ._purpur-drawer-frame__header_1didd_11{padding:var(--purpur-spacing-300) calc(56 * var(--purpur-spacing-10)) var(--purpur-spacing-150) var(--purpur-spacing-200)}._purpur-drawer-frame--with-back-button_1didd_14 ._purpur-drawer-frame__header_1didd_11{padding:calc(14 * var(--purpur-spacing-10)) var(--purpur-spacing-200) var(--purpur-spacing-150)}@media screen and (min-width: 600px){._purpur-drawer-frame--left_1didd_18{border-bottom-right-radius:var(--purpur-border-radius-lg);border-top-left-radius:0}._purpur-drawer-frame--right_1didd_22{border-bottom-left-radius:var(--purpur-border-radius-lg);border-top-right-radius:0}._purpur-drawer-frame--without-back-button_1didd_11 ._purpur-drawer-frame__header_1didd_11{padding:var(--purpur-spacing-300) calc(64 * var(--purpur-spacing-10)) var(--purpur-spacing-200) var(--purpur-spacing-300)}._purpur-drawer-frame--with-back-button_1didd_14 ._purpur-drawer-frame__header_1didd_11{padding:calc(14 * var(--purpur-spacing-10)) var(--purpur-spacing-300) var(--purpur-spacing-200)}}._purpur-drawer-frame--sticky-footer_1didd_33{gap:0}._purpur-drawer-frame__header_1didd_11{flex:0 0 auto}._purpur-drawer-frame__body_1didd_39{flex:1 1 auto;overflow:hidden}._purpur-drawer-frame--fit-to-content_1didd_43{flex:1 1 auto;height:auto;overflow:hidden}._purpur-drawer-frame--fit-to-content_1didd_43 ._purpur-drawer-frame__body_1didd_39{display:flex;flex-direction:column}._purpur-drawer-frame__footer_1didd_52{flex:0 0 auto}._purpur-drawer-frame__content-container_1didd_55{display:flex;flex-direction:column;gap:var(--purpur-spacing-400)}._purpur-drawer-frame__content-container--no-footer_1didd_60{margin-bottom:var(--purpur-spacing-400)}._purpur-drawer-handle_3n0ew_1{align-items:center;display:flex;height:var(--purpur-spacing-250);justify-content:center;position:absolute;top:0;width:100%}@media screen and (min-width: 600px){._purpur-drawer-handle_3n0ew_1{display:none}}._purpur-drawer-handle_3n0ew_1:before{content:"";background:var(--purpur-color-border-weak);border-radius:var(--purpur-border-radius-full);height:var(--purpur-spacing-50);width:var(--purpur-spacing-600)}._purpur-drawer-header_1iujy_1{min-height:calc(1.25*clamp(var(--purpur-typography-scale-200),3cqw,var(--purpur-typography-scale-400)))}._purpur-drawer-header__row_1iujy_4{display:flex}._purpur-drawer-header__row--with-back-button_1iujy_7{margin-bottom:var(--purpur-spacing-100)}._purpur-drawer-header__left_1iujy_10{flex:1 1 auto}._purpur-drawer-header__right_1iujy_13{flex:0 0 auto}._purpur-drawer-header_1iujy_1 ._purpur-drawer-header__close-button_1iujy_16{position:absolute;top:calc(14 * var(--purpur-spacing-10));right:calc(6 * var(--purpur-spacing-10));padding:calc(10 * var(--purpur-spacing-10))}@media screen and (min-width: 600px){._purpur-drawer-header_1iujy_1 ._purpur-drawer-header__close-button_1iujy_16{right:calc(14 * var(--purpur-spacing-10))}}._purpur-drawer-header__back-button--only-icon_1iujy_27{margin-left:calc(-1 * var(--purpur-spacing-100))}._purpur-drawer-scroll-area__root_1hyos_1{height:100%}._purpur-drawer-scroll-area__root--fit-to-content_1hyos_4{display:flex;flex-direction:column;height:auto;overflow:hidden}._purpur-drawer-scroll-area__viewport_1hyos_10{position:relative;height:100%}._purpur-drawer-scroll-area__scrollbar_1hyos_14{display:flex;-webkit-user-select:none;user-select:none;touch-action:none;padding:var(--purpur-spacing-25);background:var(--purpur-color-functional-white);transition:background var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out);width:var(--purpur-spacing-100)}._purpur-drawer-scroll-area__thumb_1hyos_25{background:var(--purpur-color-gray-200);border-radius:var(--purpur-spacing-200);flex:1;position:relative}._purpur-drawer-scroll-area__thumb_1hyos_25:before{content:"";height:100%;left:50%;min-height:var(--purpur-spacing-300);min-width:var(--purpur-spacing-300);position:absolute;top:50%;transform:translate(-50%,-50%);width:100%}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@purpurds/drawer",
-  "version": "8.12.1",
+  "version": "8.13.0",
   "license": "AGPL-3.0-only",
   "main": "./dist/drawer.cjs.js",
   "types": "./dist/drawer.d.ts",
@@ -18,16 +18,16 @@
     "@radix-ui/react-dialog": "~1.1.6",
     "@radix-ui/react-scroll-area": "~1.2.3",
     "classnames": "~2.5.1",
-    "@purpurds/button": "8.12.1",
-    "@purpurds/icon": "8.12.1",
-    "@purpurds/heading": "8.12.1",
-    "@purpurds/common-types": "8.12.1",
-    "@purpurds/paragraph": "8.12.1",
-    "@purpurds/tokens": "8.12.1",
-    "@purpurds/visually-hidden": "8.12.1"
+    "@purpurds/common-types": "8.13.0",
+    "@purpurds/button": "8.13.0",
+    "@purpurds/heading": "8.13.0",
+    "@purpurds/icon": "8.13.0",
+    "@purpurds/paragraph": "8.13.0",
+    "@purpurds/tokens": "8.13.0",
+    "@purpurds/visually-hidden": "8.13.0"
   },
   "devDependencies": {
-    "@storybook/react-vite": "^10.0.8",
+    "@storybook/react-vite": "10.1.11",
     "@testing-library/dom": "~10.4.1",
     "@testing-library/jest-dom": "~6.9.1",
     "@testing-library/react": "~16.3.0",
@@ -35,13 +35,13 @@
     "@types/node": "22.17",
     "@types/react-dom": "^19.2.3",
     "@types/react": "^19.2.6",
-    "eslint": "9.39.1",
+    "eslint": "9.39.2",
     "jsdom": "~27.2.0",
     "lint-staged": "16.2.6",
     "prettier": "~2.8.8",
     "react-dom": "^19.2.1",
     "react": "^19.2.1",
-    "storybook": "^10.0.8",
+    "storybook": "10.1.11",
     "typescript": "^5.9.3",
     "vite": "^7.2.2",
     "vitest": "^4.0.10",