@spark-ui/components 13.0.7 → 13.1.1

package/dist/drawer/index.mjs

@@ -1,56 +1,31 @@
-import {
-  IconButton
-} from "../chunk-DCXWGQVZ.mjs";
-import {
-  Icon
-} from "../chunk-UMUMFMFB.mjs";
-import "../chunk-2YM6GKWW.mjs";
-import "../chunk-GAK4SC2F.mjs";
-import "../chunk-KEGAAGJW.mjs";
-import "../chunk-6QCEPQ3U.mjs";
-
-// src/drawer/Drawer.tsx
-import { Dialog as RadixDrawer } from "radix-ui";
-
-// src/drawer/DrawerContext.tsx
-import { createContext, useContext } from "react";
-import { jsx } from "react/jsx-runtime";
-var DrawerContext = createContext(null);
-var DrawerProvider = ({
-  children: childrenProp,
-  withFade = false
-}) => {
-  return /* @__PURE__ */ jsx(
-    DrawerContext.Provider,
-    {
-      value: {
-        withFade
-      },
-      children: childrenProp
-    }
-  );
-};
-var useDrawer = () => {
-  const context = useContext(DrawerContext);
-  if (!context) {
-    throw Error("useDrawer must be used within a Drawer provider");
+import { jsx as t } from "react/jsx-runtime";
+import { createContext as C, useContext as k, useRef as T } from "react";
+import { R as B, C as O, a as P, D as F, O as I, P as R, T as $, b as H } from "../index-CYjGhVvU.mjs";
+import { useMergeRefs as S } from "@spark-ui/hooks/use-merge-refs";
+import { useScrollOverflow as E } from "@spark-ui/hooks/use-scroll-overflow";
+import { c as N, a as n } from "../index-BmAFn37q.mjs";
+import { Close as V } from "@spark-ui/icons/Close";
+import { I as j } from "../Icon-D1RueiPY.mjs";
+import { I as A } from "../IconButton-BY3gYXtU.mjs";
+const b = C(null), M = ({
+  children: e,
+  withFade: a = !1
+}) => /* @__PURE__ */ t(
+  b.Provider,
+  {
+    value: {
+      withFade: a
+    },
+    children: e
   }
-  return context;
-};
-
-// src/drawer/Drawer.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
-var Drawer = ({ children, withFade = false, ...rest }) => /* @__PURE__ */ jsx2(DrawerProvider, { withFade, children: /* @__PURE__ */ jsx2(RadixDrawer.Root, { ...rest, children }) });
-Drawer.displayName = "Drawer.Root";
-
-// src/drawer/DrawerBody.tsx
-import { useMergeRefs } from "@spark-ui/hooks/use-merge-refs";
-import { useScrollOverflow } from "@spark-ui/hooks/use-scroll-overflow";
-import { useRef } from "react";
-
-// src/drawer/DrawerBody.styles.ts
-import { cva } from "class-variance-authority";
-var drawerBodyStyles = cva(
+), q = () => {
+  const e = k(b);
+  if (!e)
+    throw Error("useDrawer must be used within a Drawer provider");
+  return e;
+}, v = ({ children: e, withFade: a = !1, ...r }) => /* @__PURE__ */ t(M, { withFade: a, children: /* @__PURE__ */ t(B, { ...r, children: e }) });
+v.displayName = "Drawer.Root";
+const G = N(
   ["grow", "overflow-y-auto", "outline-hidden", "focus-visible:u-outline"],
   {
     variants: {
@@ -60,84 +35,60 @@ var drawerBodyStyles = cva(
       }
     },
     defaultVariants: {
-      inset: false
+      inset: !1
     }
   }
-);
-
-// src/drawer/DrawerBody.tsx
-import { jsx as jsx3 } from "react/jsx-runtime";
-var DrawerBody = ({
-  children,
-  inset = false,
-  className,
-  ref: forwardedRef,
-  ...rest
+), c = ({
+  children: e,
+  inset: a = !1,
+  className: r,
+  ref: s,
+  ...i
 }) => {
-  const scrollAreaRef = useRef(null);
-  const ref = useMergeRefs(forwardedRef, scrollAreaRef);
-  const { withFade } = useDrawer();
-  const { overflow } = useScrollOverflow(scrollAreaRef);
-  return /* @__PURE__ */ jsx3(
+  const l = T(null), o = S(s, l), { withFade: d } = q(), { overflow: m } = E(l);
+  return /* @__PURE__ */ t(
     "div",
     {
       "data-spark-component": "drawer-body",
-      ref,
-      className: drawerBodyStyles({ inset, className }),
+      ref: o,
+      className: G({ inset: a, className: r }),
       style: {
-        ...withFade && {
+        ...d && {
           maskImage: "linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))",
-          maskSize: `100% calc(100% + ${overflow.top ? "0px" : "44px"} + ${overflow.bottom ? "0px" : "44px"})`,
-          maskPosition: `0 ${overflow.top ? "0px" : "-44px"}`
+          maskSize: `100% calc(100% + ${m.top ? "0px" : "44px"} + ${m.bottom ? "0px" : "44px"})`,
+          maskPosition: `0 ${m.top ? "0px" : "-44px"}`
         }
       },
-      ...rest,
-      children
+      ...i,
+      children: e
     }
   );
 };
-DrawerBody.displayName = "Drawer.Body";
-
-// src/drawer/DrawerCloseButton.tsx
-import { Close as CloseSVG } from "@spark-ui/icons/Close";
-import { cx } from "class-variance-authority";
-
-// src/drawer/DrawerClose.tsx
-import { Dialog as RadixDrawer2 } from "radix-ui";
-import { jsx as jsx4 } from "react/jsx-runtime";
-var DrawerClose = (props) => /* @__PURE__ */ jsx4(RadixDrawer2.Close, { "data-spark-component": "drawer-close", ...props });
-DrawerClose.displayName = "Drawer.Close";
-
-// src/drawer/DrawerCloseButton.tsx
-import { jsx as jsx5 } from "react/jsx-runtime";
-var DrawerCloseButton = ({
-  "aria-label": ariaLabel,
-  className,
-  size = "md",
-  intent = "neutral",
-  design = "ghost",
-  children = /* @__PURE__ */ jsx5(CloseSVG, {}),
-  ref,
-  ...rest
-}) => /* @__PURE__ */ jsx5(
-  DrawerClose,
+c.displayName = "Drawer.Body";
+const z = (e) => /* @__PURE__ */ t(O, { "data-spark-component": "drawer-close", ...e });
+z.displayName = "Drawer.Close";
+const p = ({
+  "aria-label": e,
+  className: a,
+  size: r = "md",
+  intent: s = "neutral",
+  design: i = "ghost",
+  children: l = /* @__PURE__ */ t(V, {}),
+  ref: o,
+  ...d
+}) => /* @__PURE__ */ t(
+  z,
   {
     "data-spark-component": "drawer-close-button",
-    ref,
-    className: cx(["absolute", "top-sm", "right-xl"], className),
-    asChild: true,
-    ...rest,
-    children: /* @__PURE__ */ jsx5(IconButton, { intent, size, design, "aria-label": ariaLabel, children: /* @__PURE__ */ jsx5(Icon, { children }) })
+    ref: o,
+    className: n(["absolute", "top-sm", "right-xl"], a),
+    asChild: !0,
+    ...d,
+    children: /* @__PURE__ */ t(A, { intent: s, size: r, design: i, "aria-label": e, children: /* @__PURE__ */ t(j, { children: l }) })
   }
 );
-DrawerCloseButton.displayName = "Drawer.CloseButton";
-
-// src/drawer/DrawerContent.tsx
-import { Dialog as RadixDrawer3 } from "radix-ui";
-
-// src/drawer/DrawerContent.styles.tsx
-import { cva as cva2 } from "class-variance-authority";
-var drawerContentStyles = cva2(
+p.displayName = "Drawer.CloseButton";
+const J = N(
   [
     "fixed z-modal flex flex-col bg-surface shadow-md",
     "data-[state=open]:animation-duration-400 data-[state=closed]:animation-duration-200"
@@ -223,152 +174,112 @@ var drawerContentStyles = cva2(
       size: "md"
     }
   }
-);
-
-// src/drawer/DrawerContent.tsx
-import { jsx as jsx6 } from "react/jsx-runtime";
-var DrawerContent = ({
-  className,
-  size = "md",
-  side = "right",
-  onInteractOutside,
-  ref,
-  ...rest
-}) => /* @__PURE__ */ jsx6(
-  RadixDrawer3.Content,
+), w = ({
+  className: e,
+  size: a = "md",
+  side: r = "right",
+  onInteractOutside: s,
+  ref: i,
+  ...l
+}) => /* @__PURE__ */ t(
+  P,
   {
     "data-spark-component": "drawer-content",
-    ref,
-    className: drawerContentStyles({
-      size,
-      side,
-      className
+    ref: i,
+    className: J({
+      size: a,
+      side: r,
+      className: e
     }),
-    onInteractOutside: (e) => {
-      const isForegroundElement = e.target.closest(".z-toast, .z-popover");
-      if (isForegroundElement) {
-        e.preventDefault();
-      }
-      onInteractOutside?.(e);
+    onInteractOutside: (o) => {
+      o.target.closest(".z-toast, .z-popover") && o.preventDefault(), s?.(o);
     },
-    ...rest
+    ...l
   }
 );
-DrawerContent.displayName = "Drawer.Content";
-
-// src/drawer/DrawerDescription.tsx
-import { Dialog as RadixDrawer4 } from "radix-ui";
-import { jsx as jsx7 } from "react/jsx-runtime";
-var DrawerDescription = (props) => /* @__PURE__ */ jsx7(RadixDrawer4.Description, { "data-spark-component": "drawer-description", ...props });
-DrawerDescription.displayName = "Drawer.Description";
-
-// src/drawer/DrawerFooter.tsx
-import { cx as cx2 } from "class-variance-authority";
-import { jsx as jsx8 } from "react/jsx-runtime";
-var DrawerFooter = ({ className, ref, ...rest }) => /* @__PURE__ */ jsx8(
+w.displayName = "Drawer.Content";
+const f = (e) => /* @__PURE__ */ t(F, { "data-spark-component": "drawer-description", ...e });
+f.displayName = "Drawer.Description";
+const u = ({ className: e, ref: a, ...r }) => /* @__PURE__ */ t(
   "footer",
   {
     "data-spark-component": "drawer-footer",
-    ref,
-    className: cx2(["px-xl", "py-lg"], className),
-    ...rest
+    ref: a,
+    className: n(["px-xl", "py-lg"], e),
+    ...r
   }
 );
-DrawerFooter.displayName = "Drawer.Footer";
-
-// src/drawer/DrawerHeader.tsx
-import { cx as cx3 } from "class-variance-authority";
-import { jsx as jsx9 } from "react/jsx-runtime";
-var DrawerHeader = ({
-  children,
-  className,
-  ref,
-  ...rest
-}) => /* @__PURE__ */ jsx9(
+u.displayName = "Drawer.Footer";
+const D = ({
+  children: e,
+  className: a,
+  ref: r,
+  ...s
+}) => /* @__PURE__ */ t(
   "header",
   {
     "data-spark-component": "drawer-header",
-    ref,
-    className: cx3(["px-xl", "py-lg"], className),
-    ...rest,
-    children
+    ref: r,
+    className: n(["px-xl", "py-lg"], a),
+    ...s,
+    children: e
   }
 );
-DrawerHeader.displayName = "Dialog.Header";
-
-// src/drawer/DrawerOverlay.tsx
-import { cx as cx4 } from "class-variance-authority";
-import { Dialog as RadixDrawer5 } from "radix-ui";
-import { jsx as jsx10 } from "react/jsx-runtime";
-var DrawerOverlay = ({ className, ref, ...rest }) => /* @__PURE__ */ jsx10(
-  RadixDrawer5.Overlay,
+D.displayName = "Dialog.Header";
+const y = ({ className: e, ref: a, ...r }) => /* @__PURE__ */ t(
+  I,
   {
     "data-spark-component": "drawer-overlay",
-    ref,
-    className: cx4(
+    ref: a,
+    className: n(
       ["fixed", "top-0", "left-0", "w-screen", "h-screen", "z-overlay"],
       ["bg-overlay/dim-1"],
       ["data-[state=open]:animate-fade-in"],
       ["data-[state=closed]:animate-fade-out"],
-      className
+      e
     ),
-    ...rest
+    ...r
   }
 );
-DrawerOverlay.displayName = "Drawer.Overlay";
-
-// src/drawer/DrawerPortal.tsx
-import { Dialog as RadixDrawer6 } from "radix-ui";
-import { jsx as jsx11 } from "react/jsx-runtime";
-var DrawerPortal = ({ children, ...rest }) => /* @__PURE__ */ jsx11(RadixDrawer6.Portal, { ...rest, children });
-DrawerPortal.displayName = "Drawer.Portal";
-
-// src/drawer/DrawerTitle.tsx
-import { cx as cx5 } from "class-variance-authority";
-import { Dialog as RadixDrawer7 } from "radix-ui";
-import { jsx as jsx12 } from "react/jsx-runtime";
-var DrawerTitle = ({ className, ref, ...others }) => /* @__PURE__ */ jsx12(
-  RadixDrawer7.Title,
+y.displayName = "Drawer.Overlay";
+const g = ({ children: e, ...a }) => /* @__PURE__ */ t(R, { ...a, children: e });
+g.displayName = "Drawer.Portal";
+const h = ({ className: e, ref: a, ...r }) => /* @__PURE__ */ t(
+  $,
   {
     "data-spark-component": "drawer-title",
-    ref,
-    className: cx5("text-headline-2 text-on-surface", className),
-    ...others
+    ref: a,
+    className: n("text-headline-2 text-on-surface", e),
+    ...r
   }
 );
-DrawerTitle.displayName = "Drawer.Title";
-
-// src/drawer/DrawerTrigger.tsx
-import { Dialog as RadixDrawer8 } from "radix-ui";
-import { jsx as jsx13 } from "react/jsx-runtime";
-var DrawerTrigger = (props) => /* @__PURE__ */ jsx13(RadixDrawer8.Trigger, { "data-spark-component": "drawer-trigger", ...props });
-DrawerTrigger.displayName = "Drawer.Trigger";
-
-// src/drawer/index.ts
-var Drawer2 = Object.assign(Drawer, {
-  Trigger: DrawerTrigger,
-  Portal: DrawerPortal,
-  Overlay: DrawerOverlay,
-  Content: DrawerContent,
-  Header: DrawerHeader,
-  Body: DrawerBody,
-  Footer: DrawerFooter,
-  CloseButton: DrawerCloseButton,
-  Title: DrawerTitle,
-  Description: DrawerDescription
+h.displayName = "Drawer.Title";
+const x = (e) => /* @__PURE__ */ t(H, { "data-spark-component": "drawer-trigger", ...e });
+x.displayName = "Drawer.Trigger";
+const K = Object.assign(v, {
+  Trigger: x,
+  Portal: g,
+  Overlay: y,
+  Content: w,
+  Header: D,
+  Body: c,
+  Footer: u,
+  CloseButton: p,
+  Title: h,
+  Description: f
 });
-Drawer2.displayName = "Drawer";
-DrawerTrigger.displayName = "Drawer.Trigger";
-DrawerPortal.displayName = "Drawer.Portal";
-DrawerOverlay.displayName = "Drawer.Overlay";
-DrawerContent.displayName = "Drawer.Content";
-DrawerHeader.displayName = "Drawer.Header";
-DrawerBody.displayName = "Drawer.Body";
-DrawerFooter.displayName = "Drawer.Footer";
-DrawerCloseButton.displayName = "Drawer.CloseButton";
-DrawerTitle.displayName = "Drawer.Title";
-DrawerDescription.displayName = "Drawer.Description";
+K.displayName = "Drawer";
+x.displayName = "Drawer.Trigger";
+g.displayName = "Drawer.Portal";
+y.displayName = "Drawer.Overlay";
+w.displayName = "Drawer.Content";
+D.displayName = "Drawer.Header";
+c.displayName = "Drawer.Body";
+u.displayName = "Drawer.Footer";
+p.displayName = "Drawer.CloseButton";
+h.displayName = "Drawer.Title";
+f.displayName = "Drawer.Description";
 export {
-  Drawer2 as Drawer
+  K as Drawer
 };
-//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.mjs.map

package/dist/drawer/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/drawer/Drawer.tsx","../../src/drawer/DrawerContext.tsx","../../src/drawer/DrawerBody.tsx","../../src/drawer/DrawerBody.styles.ts","../../src/drawer/DrawerCloseButton.tsx","../../src/drawer/DrawerClose.tsx","../../src/drawer/DrawerContent.tsx","../../src/drawer/DrawerContent.styles.tsx","../../src/drawer/DrawerDescription.tsx","../../src/drawer/DrawerFooter.tsx","../../src/drawer/DrawerHeader.tsx","../../src/drawer/DrawerOverlay.tsx","../../src/drawer/DrawerPortal.tsx","../../src/drawer/DrawerTitle.tsx","../../src/drawer/DrawerTrigger.tsx","../../src/drawer/index.ts"],"sourcesContent":["import { Dialog as RadixDrawer } from 'radix-ui'\nimport { type ReactElement, ReactNode } from 'react'\n\nimport { DrawerProvider } from './DrawerContext'\n\nexport interface DrawerProps {\n  /**\n   * Children of the component.\n   */\n  children?: RadixDrawer.DialogProps['children']\n  /**\n   * Specifies if the dialog is open or not.\n   */\n  open?: RadixDrawer.DialogProps['open']\n  /**\n   * Default open state.\n   */\n  defaultOpen?: RadixDrawer.DialogProps['defaultOpen']\n  /**\n   * Handler executed on every dialog open state change.\n   */\n  onOpenChange?: RadixDrawer.DialogProps['onOpenChange']\n  /**\n   * Specifies if the dialog is a modal.\n   */\n  modal?: RadixDrawer.DialogProps['modal']\n  /**\n   * Specifies if the drawer should have a fade animation on its body (in case it is scrollable).\n   */\n  withFade?: boolean\n}\n\nexport interface DialogProps {\n  children?: ReactNode\n  open?: boolean\n  defaultOpen?: boolean\n  onOpenChange?(open: boolean): void\n  modal?: boolean\n}\n\nexport const Drawer = ({ children, withFade = false, ...rest }: DrawerProps): ReactElement => (\n  <DrawerProvider withFade={withFade}>\n    <RadixDrawer.Root {...rest}>{children}</RadixDrawer.Root>\n  </DrawerProvider>\n)\n\nDrawer.displayName = 'Drawer.Root'\n","import { createContext, type ReactNode, useContext } from 'react'\n\nexport interface DrawerContextState {\n  withFade: boolean\n}\n\nconst DrawerContext = createContext<DrawerContextState | null>(null)\n\nexport const DrawerProvider = ({\n  children: childrenProp,\n  withFade = false,\n}: {\n  children: ReactNode\n  withFade?: boolean\n}) => {\n  return (\n    <DrawerContext.Provider\n      value={{\n        withFade,\n      }}\n    >\n      {childrenProp}\n    </DrawerContext.Provider>\n  )\n}\n\nexport const useDrawer = () => {\n  const context = useContext(DrawerContext)\n\n  if (!context) {\n    throw Error('useDrawer must be used within a Drawer provider')\n  }\n\n  return context\n}\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { type ReactNode, Ref, useRef } from 'react'\n\nimport { drawerBodyStyles, type DrawerBodyStylesProps } from './DrawerBody.styles'\nimport { useDrawer } from './DrawerContext'\n\nexport interface DrawerBodyProps extends DrawerBodyStylesProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const DrawerBody = ({\n  children,\n  inset = false,\n  className,\n  ref: forwardedRef,\n  ...rest\n}: DrawerBodyProps) => {\n  const scrollAreaRef = useRef<HTMLDivElement>(null)\n  const ref = useMergeRefs(forwardedRef, scrollAreaRef)\n\n  const { withFade } = useDrawer()\n\n  const { overflow } = useScrollOverflow(scrollAreaRef)\n\n  return (\n    <div\n      data-spark-component=\"drawer-body\"\n      ref={ref}\n      className={drawerBodyStyles({ inset, className })}\n      style={{\n        ...(withFade && {\n          maskImage:\n            'linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n          maskSize: `100% calc(100% + ${overflow.top ? '0px' : '44px'} + ${overflow.bottom ? '0px' : '44px'})`,\n          maskPosition: `0 ${overflow.top ? '0px' : '-44px'}`,\n        }),\n      }}\n      {...rest}\n    >\n      {children}\n    </div>\n  )\n}\n\nDrawerBody.displayName = 'Drawer.Body'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const drawerBodyStyles = cva(\n  ['grow', 'overflow-y-auto', 'outline-hidden', 'focus-visible:u-outline'],\n  {\n    variants: {\n      inset: {\n        true: '',\n        false: 'px-xl py-lg',\n      },\n    },\n    defaultVariants: {\n      inset: false,\n    },\n  }\n)\n\nexport type DrawerBodyStylesProps = VariantProps<typeof drawerBodyStyles>\n","import { Close as CloseSVG } from '@spark-ui/icons/Close'\nimport { cx } from 'class-variance-authority'\n\nimport { Icon } from '../icon'\nimport { IconButton, type IconButtonProps } from '../icon-button'\nimport { DrawerClose, type DrawerCloseProps } from './DrawerClose'\n\nexport type DrawerCloseButtonProps = DrawerCloseProps &\n  Pick<IconButtonProps, 'size' | 'intent' | 'design' | 'aria-label'>\n\nexport const DrawerCloseButton = ({\n  'aria-label': ariaLabel,\n  className,\n  size = 'md',\n  intent = 'neutral',\n  design = 'ghost',\n  children = <CloseSVG />,\n  ref,\n  ...rest\n}: DrawerCloseButtonProps) => (\n  <DrawerClose\n    data-spark-component=\"drawer-close-button\"\n    ref={ref}\n    className={cx(['absolute', 'top-sm', 'right-xl'], className)}\n    asChild\n    {...rest}\n  >\n    <IconButton intent={intent} size={size} design={design} aria-label={ariaLabel}>\n      <Icon>{children}</Icon>\n    </IconButton>\n  </DrawerClose>\n)\n\nDrawerCloseButton.displayName = 'Drawer.CloseButton'\n","import { Dialog as RadixDrawer } from 'radix-ui'\nimport { Ref } from 'react'\n\nexport type DrawerCloseProps = RadixDrawer.DialogCloseProps & {\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport const DrawerClose = (props: DrawerCloseProps) => (\n  <RadixDrawer.Close data-spark-component=\"drawer-close\" {...props} />\n)\n\nDrawerClose.displayName = 'Drawer.Close'\n","import { Dialog as RadixDrawer } from 'radix-ui'\nimport { Ref } from 'react'\n\nimport { drawerContentStyles, type DrawerContentStylesProps } from './DrawerContent.styles'\n\nexport type DrawerContentProps = RadixDrawer.DialogContentProps &\n  DrawerContentStylesProps & {\n    ref?: Ref<HTMLDivElement>\n  }\n\nexport const DrawerContent = ({\n  className,\n  size = 'md',\n  side = 'right',\n  onInteractOutside,\n  ref,\n  ...rest\n}: DrawerContentProps) => (\n  <RadixDrawer.Content\n    data-spark-component=\"drawer-content\"\n    ref={ref}\n    className={drawerContentStyles({\n      size,\n      side,\n      className,\n    })}\n    onInteractOutside={e => {\n      const isForegroundElement = (e.target as HTMLElement).closest('.z-toast, .z-popover')\n\n      /**\n       * The focus trap of the drawer applies `pointer-events-none` on the body of the page in the background, but\n       * some components with an higher z-index have `pointer-events-auto` applied on them to remain interactive and ignore the focust trap (ex: a Snackbar with actions).\n       *\n       * Clicking on the snackbar will be considered as an \"outside click\" and close the drawer. We want to prevent this.\n       */\n      if (isForegroundElement) {\n        e.preventDefault()\n      }\n\n      onInteractOutside?.(e)\n    }}\n    {...rest}\n  />\n)\n\nDrawerContent.displayName = 'Drawer.Content'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const drawerContentStyles = cva(\n  [\n    'fixed z-modal flex flex-col bg-surface shadow-md',\n    'data-[state=open]:animation-duration-400 data-[state=closed]:animation-duration-200',\n  ],\n  {\n    variants: {\n      size: {\n        sm: '',\n        md: '',\n        lg: '',\n        fluid: '',\n        fullscreen: 'h-screen w-screen',\n      },\n      side: {\n        right: [\n          'inset-y-0 right-0',\n          'data-[state=open]:animate-slide-in-right ',\n          'data-[state=closed]:animate-slide-out-right',\n        ],\n        left: [\n          'inset-y-0 left-0',\n          'data-[state=open]:animate-slide-in-left',\n          'data-[state=closed]:animate-slide-out-left',\n        ],\n        top: [\n          'top-0 left-0',\n          'w-screen',\n          'data-[state=open]:animate-slide-in-top',\n          'data-[state=closed]:animate-slide-out-top',\n        ],\n        bottom: [\n          'bottom-0 left-0',\n          'w-screen',\n          'data-[state=open]:animate-slide-in-bottom',\n          'data-[state=closed]:animate-slide-out-bottom',\n        ],\n      },\n    },\n    compoundVariants: [\n      {\n        side: ['right', 'left'],\n        size: 'sm',\n        class: ['w-sz-480', 'max-w-full'],\n      },\n      {\n        side: ['right', 'left'],\n        size: 'md',\n        class: ['w-sz-672', 'max-w-full'],\n      },\n      {\n        side: ['right', 'left'],\n        size: 'lg',\n        class: ['w-sz-864', 'max-w-full'],\n      },\n      {\n        side: ['left', 'right'],\n        size: 'fluid',\n        class: ['w-auto', 'max-w-full'],\n      },\n      {\n        side: ['top', 'bottom'],\n        size: 'sm',\n        class: ['h-sz-480', 'max-h-full'],\n      },\n      {\n        side: ['top', 'bottom'],\n        size: 'md',\n        class: ['h-sz-672', 'max-h-full'],\n      },\n      {\n        side: ['top', 'bottom'],\n        size: 'lg',\n        class: ['h-sz-864', 'max-h-full'],\n      },\n      {\n        side: ['top', 'bottom'],\n        size: 'fluid',\n        class: ['h-auto', 'max-h-full'],\n      },\n    ],\n    defaultVariants: {\n      side: 'right',\n      size: 'md',\n    },\n  }\n)\n\nexport type DrawerContentStylesProps = VariantProps<typeof drawerContentStyles>\n","import { Dialog as RadixDrawer } from 'radix-ui'\nimport { Ref } from 'react'\n\nexport type DrawerDescriptionProps = RadixDrawer.DialogDescriptionProps & {\n  ref?: Ref<HTMLParagraphElement>\n}\n\nexport const DrawerDescription = (props: DrawerDescriptionProps) => (\n  <RadixDrawer.Description data-spark-component=\"drawer-description\" {...props} />\n)\n\nDrawerDescription.displayName = 'Drawer.Description'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, type ReactElement, Ref } from 'react'\n\nexport type DrawerFooterProps = ComponentPropsWithoutRef<'footer'> & {\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const DrawerFooter = ({ className, ref, ...rest }: DrawerFooterProps): ReactElement => (\n  <footer\n    data-spark-component=\"drawer-footer\"\n    ref={ref}\n    className={cx(['px-xl', 'py-lg'], className)}\n    {...rest}\n  />\n)\n\nDrawerFooter.displayName = 'Drawer.Footer'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface DrawerHeaderProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const DrawerHeader = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: DrawerHeaderProps): ReactElement => (\n  <header\n    data-spark-component=\"drawer-header\"\n    ref={ref}\n    className={cx(['px-xl', 'py-lg'], className)}\n    {...rest}\n  >\n    {children}\n  </header>\n)\n\nDrawerHeader.displayName = 'Dialog.Header'\n","import { cx } from 'class-variance-authority'\nimport { Dialog as RadixDrawer } from 'radix-ui'\nimport { type ReactElement, Ref } from 'react'\n\nexport type DrawerOverlayProps = RadixDrawer.DialogOverlayProps & {\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const DrawerOverlay = ({ className, ref, ...rest }: DrawerOverlayProps): ReactElement => (\n  <RadixDrawer.Overlay\n    data-spark-component=\"drawer-overlay\"\n    ref={ref}\n    className={cx(\n      ['fixed', 'top-0', 'left-0', 'w-screen', 'h-screen', 'z-overlay'],\n      ['bg-overlay/dim-1'],\n      ['data-[state=open]:animate-fade-in'],\n      ['data-[state=closed]:animate-fade-out'],\n      className\n    )}\n    {...rest}\n  />\n)\n\nDrawerOverlay.displayName = 'Drawer.Overlay'\n","import { Dialog as RadixDrawer } from 'radix-ui'\nimport { type ReactElement } from 'react'\n\nexport type DrawerPortalProps = RadixDrawer.DialogPortalProps\n\nexport const DrawerPortal = ({ children, ...rest }: DrawerPortalProps): ReactElement => (\n  <RadixDrawer.Portal {...rest}>{children}</RadixDrawer.Portal>\n)\n\nDrawerPortal.displayName = 'Drawer.Portal'\n","import { cx } from 'class-variance-authority'\nimport { Dialog as RadixDrawer } from 'radix-ui'\nimport { Ref } from 'react'\n\nexport type DrawerTitleProps = RadixDrawer.DialogTitleProps & {\n  ref?: Ref<HTMLHeadingElement>\n}\n\nexport const DrawerTitle = ({ className, ref, ...others }: DrawerTitleProps) => (\n  <RadixDrawer.Title\n    data-spark-component=\"drawer-title\"\n    ref={ref}\n    className={cx('text-headline-2 text-on-surface', className)}\n    {...others}\n  />\n)\n\nDrawerTitle.displayName = 'Drawer.Title'\n","import { Dialog as RadixDrawer } from 'radix-ui'\nimport { type ReactElement, Ref } from 'react'\n\nexport interface DrawerTriggerProps extends RadixDrawer.DialogTriggerProps {\n  /**\n   * Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport const DrawerTrigger = (props: DrawerTriggerProps): ReactElement => (\n  <RadixDrawer.Trigger data-spark-component=\"drawer-trigger\" {...props} />\n)\n\nDrawerTrigger.displayName = 'Drawer.Trigger'\n","import { Drawer as Root } from './Drawer'\nimport { DrawerBody } from './DrawerBody'\nimport { DrawerCloseButton } from './DrawerCloseButton'\nimport { DrawerContent } from './DrawerContent'\nimport { DrawerDescription } from './DrawerDescription' // aria-describedby\nimport { DrawerFooter } from './DrawerFooter'\nimport { DrawerHeader } from './DrawerHeader'\nimport { DrawerOverlay } from './DrawerOverlay'\nimport { DrawerPortal } from './DrawerPortal'\nimport { DrawerTitle } from './DrawerTitle'\nimport { DrawerTrigger } from './DrawerTrigger'\n\nexport const Drawer: typeof Root & {\n  Trigger: typeof DrawerTrigger\n  Portal: typeof DrawerPortal\n  Overlay: typeof DrawerOverlay\n  Content: typeof DrawerContent\n  Header: typeof DrawerHeader\n  Body: typeof DrawerBody\n  Footer: typeof DrawerFooter\n  CloseButton: typeof DrawerCloseButton\n  Title: typeof DrawerTitle\n  Description: typeof DrawerDescription\n} = Object.assign(Root, {\n  Trigger: DrawerTrigger,\n  Portal: DrawerPortal,\n  Overlay: DrawerOverlay,\n  Content: DrawerContent,\n  Header: DrawerHeader,\n  Body: DrawerBody,\n  Footer: DrawerFooter,\n  CloseButton: DrawerCloseButton,\n  Title: DrawerTitle,\n  Description: DrawerDescription,\n})\n\nDrawer.displayName = 'Drawer'\nDrawerTrigger.displayName = 'Drawer.Trigger'\nDrawerPortal.displayName = 'Drawer.Portal'\nDrawerOverlay.displayName = 'Drawer.Overlay'\nDrawerContent.displayName = 'Drawer.Content'\nDrawerHeader.displayName = 'Drawer.Header'\nDrawerBody.displayName = 'Drawer.Body'\nDrawerFooter.displayName = 'Drawer.Footer'\nDrawerCloseButton.displayName = 'Drawer.CloseButton'\nDrawerTitle.displayName = 'Drawer.Title'\nDrawerDescription.displayName = 'Drawer.Description'\n\nexport { type DrawerProps } from './Drawer'\nexport { type DrawerContentProps } from './DrawerContent'\nexport { type DrawerHeaderProps } from './DrawerHeader'\nexport { type DrawerBodyProps } from './DrawerBody'\nexport { type DrawerFooterProps } from './DrawerFooter'\nexport { type DrawerTriggerProps } from './DrawerTrigger'\nexport { type DrawerOverlayProps } from './DrawerOverlay'\nexport { type DrawerPortalProps } from './DrawerPortal'\nexport { type DrawerTitleProps } from './DrawerTitle'\nexport { type DrawerDescriptionProps } from './DrawerDescription'\nexport { type DrawerCloseProps } from './DrawerClose'\nexport { type DrawerCloseButtonProps } from './DrawerCloseButton'\n"],"mappings":";;;;;;;;;;;;AAAA,SAAS,UAAU,mBAAmB;;;ACAtC,SAAS,eAA+B,kBAAkB;AAgBtD;AAVJ,IAAM,gBAAgB,cAAyC,IAAI;AAE5D,IAAM,iBAAiB,CAAC;AAAA,EAC7B,UAAU;AAAA,EACV,WAAW;AACb,MAGM;AACJ,SACE;AAAA,IAAC,cAAc;AAAA,IAAd;AAAA,MACC,OAAO;AAAA,QACL;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;AAEO,IAAM,YAAY,MAAM;AAC7B,QAAM,UAAU,WAAW,aAAa;AAExC,MAAI,CAAC,SAAS;AACZ,UAAM,MAAM,iDAAiD;AAAA,EAC/D;AAEA,SAAO;AACT;;;ADQI,gBAAAA,YAAA;AAFG,IAAM,SAAS,CAAC,EAAE,UAAU,WAAW,OAAO,GAAG,KAAK,MAC3D,gBAAAA,KAAC,kBAAe,UACd,0BAAAA,KAAC,YAAY,MAAZ,EAAkB,GAAG,MAAO,UAAS,GACxC;AAGF,OAAO,cAAc;;;AE9CrB,SAAS,oBAAoB;AAC7B,SAAS,yBAAyB;AAClC,SAA8B,cAAc;;;ACF5C,SAAS,WAAyB;AAE3B,IAAM,mBAAmB;AAAA,EAC9B,CAAC,QAAQ,mBAAmB,kBAAkB,yBAAyB;AAAA,EACvE;AAAA,IACE,UAAU;AAAA,MACR,OAAO;AAAA,QACL,MAAM;AAAA,QACN,OAAO;AAAA,MACT;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,OAAO;AAAA,IACT;AAAA,EACF;AACF;;;ADaI,gBAAAC,YAAA;AAfG,IAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA,KAAK;AAAA,EACL,GAAG;AACL,MAAuB;AACrB,QAAM,gBAAgB,OAAuB,IAAI;AACjD,QAAM,MAAM,aAAa,cAAc,aAAa;AAEpD,QAAM,EAAE,SAAS,IAAI,UAAU;AAE/B,QAAM,EAAE,SAAS,IAAI,kBAAkB,aAAa;AAEpD,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC,wBAAqB;AAAA,MACrB;AAAA,MACA,WAAW,iBAAiB,EAAE,OAAO,UAAU,CAAC;AAAA,MAChD,OAAO;AAAA,QACL,GAAI,YAAY;AAAA,UACd,WACE;AAAA,UACF,UAAU,oBAAoB,SAAS,MAAM,QAAQ,MAAM,MAAM,SAAS,SAAS,QAAQ,MAAM;AAAA,UACjG,cAAc,KAAK,SAAS,MAAM,QAAQ,OAAO;AAAA,QACnD;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;AAEA,WAAW,cAAc;;;AE/CzB,SAAS,SAAS,gBAAgB;AAClC,SAAS,UAAU;;;ACDnB,SAAS,UAAUC,oBAAmB;AAQpC,gBAAAC,YAAA;AADK,IAAM,cAAc,CAAC,UAC1B,gBAAAA,KAACD,aAAY,OAAZ,EAAkB,wBAAqB,gBAAgB,GAAG,OAAO;AAGpE,YAAY,cAAc;;;ADKb,gBAAAE,YAAA;AANN,IAAM,oBAAoB,CAAC;AAAA,EAChC,cAAc;AAAA,EACd;AAAA,EACA,OAAO;AAAA,EACP,SAAS;AAAA,EACT,SAAS;AAAA,EACT,WAAW,gBAAAA,KAAC,YAAS;AAAA,EACrB;AAAA,EACA,GAAG;AACL,MACE,gBAAAA;AAAA,EAAC;AAAA;AAAA,IACC,wBAAqB;AAAA,IACrB;AAAA,IACA,WAAW,GAAG,CAAC,YAAY,UAAU,UAAU,GAAG,SAAS;AAAA,IAC3D,SAAO;AAAA,IACN,GAAG;AAAA,IAEJ,0BAAAA,KAAC,cAAW,QAAgB,MAAY,QAAgB,cAAY,WAClE,0BAAAA,KAAC,QAAM,UAAS,GAClB;AAAA;AACF;AAGF,kBAAkB,cAAc;;;AEjChC,SAAS,UAAUC,oBAAmB;;;ACAtC,SAAS,OAAAC,YAAyB;AAE3B,IAAM,sBAAsBA;AAAA,EACjC;AAAA,IACE;AAAA,IACA;AAAA,EACF;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,OAAO;AAAA,QACP,YAAY;AAAA,MACd;AAAA,MACA,MAAM;AAAA,QACJ,OAAO;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA,MAAM;AAAA,UACJ;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA,KAAK;AAAA,UACH;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA,QAAQ;AAAA,UACN;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,IACA,kBAAkB;AAAA,MAChB;AAAA,QACE,MAAM,CAAC,SAAS,MAAM;AAAA,QACtB,MAAM;AAAA,QACN,OAAO,CAAC,YAAY,YAAY;AAAA,MAClC;AAAA,MACA;AAAA,QACE,MAAM,CAAC,SAAS,MAAM;AAAA,QACtB,MAAM;AAAA,QACN,OAAO,CAAC,YAAY,YAAY;AAAA,MAClC;AAAA,MACA;AAAA,QACE,MAAM,CAAC,SAAS,MAAM;AAAA,QACtB,MAAM;AAAA,QACN,OAAO,CAAC,YAAY,YAAY;AAAA,MAClC;AAAA,MACA;AAAA,QACE,MAAM,CAAC,QAAQ,OAAO;AAAA,QACtB,MAAM;AAAA,QACN,OAAO,CAAC,UAAU,YAAY;AAAA,MAChC;AAAA,MACA;AAAA,QACE,MAAM,CAAC,OAAO,QAAQ;AAAA,QACtB,MAAM;AAAA,QACN,OAAO,CAAC,YAAY,YAAY;AAAA,MAClC;AAAA,MACA;AAAA,QACE,MAAM,CAAC,OAAO,QAAQ;AAAA,QACtB,MAAM;AAAA,QACN,OAAO,CAAC,YAAY,YAAY;AAAA,MAClC;AAAA,MACA;AAAA,QACE,MAAM,CAAC,OAAO,QAAQ;AAAA,QACtB,MAAM;AAAA,QACN,OAAO,CAAC,YAAY,YAAY;AAAA,MAClC;AAAA,MACA;AAAA,QACE,MAAM,CAAC,OAAO,QAAQ;AAAA,QACtB,MAAM;AAAA,QACN,OAAO,CAAC,UAAU,YAAY;AAAA,MAChC;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,MAAM;AAAA,MACN,MAAM;AAAA,IACR;AAAA,EACF;AACF;;;ADtEE,gBAAAC,YAAA;AARK,IAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA,OAAO;AAAA,EACP,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA,GAAG;AACL,MACE,gBAAAA;AAAA,EAACC,aAAY;AAAA,EAAZ;AAAA,IACC,wBAAqB;AAAA,IACrB;AAAA,IACA,WAAW,oBAAoB;AAAA,MAC7B;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,IACD,mBAAmB,OAAK;AACtB,YAAM,sBAAuB,EAAE,OAAuB,QAAQ,sBAAsB;AAQpF,UAAI,qBAAqB;AACvB,UAAE,eAAe;AAAA,MACnB;AAEA,0BAAoB,CAAC;AAAA,IACvB;AAAA,IACC,GAAG;AAAA;AACN;AAGF,cAAc,cAAc;;;AE7C5B,SAAS,UAAUC,oBAAmB;AAQpC,gBAAAC,YAAA;AADK,IAAM,oBAAoB,CAAC,UAChC,gBAAAA,KAACD,aAAY,aAAZ,EAAwB,wBAAqB,sBAAsB,GAAG,OAAO;AAGhF,kBAAkB,cAAc;;;ACXhC,SAAS,MAAAE,WAAU;AAQjB,gBAAAC,YAAA;AADK,IAAM,eAAe,CAAC,EAAE,WAAW,KAAK,GAAG,KAAK,MACrD,gBAAAA;AAAA,EAAC;AAAA;AAAA,IACC,wBAAqB;AAAA,IACrB;AAAA,IACA,WAAWD,IAAG,CAAC,SAAS,OAAO,GAAG,SAAS;AAAA,IAC1C,GAAG;AAAA;AACN;AAGF,aAAa,cAAc;;;AChB3B,SAAS,MAAAE,WAAU;AAejB,gBAAAC,YAAA;AANK,IAAM,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MACE,gBAAAA;AAAA,EAAC;AAAA;AAAA,IACC,wBAAqB;AAAA,IACrB;AAAA,IACA,WAAWD,IAAG,CAAC,SAAS,OAAO,GAAG,SAAS;AAAA,IAC1C,GAAG;AAAA,IAEH;AAAA;AACH;AAGF,aAAa,cAAc;;;ACzB3B,SAAS,MAAAE,WAAU;AACnB,SAAS,UAAUC,oBAAmB;AAQpC,gBAAAC,aAAA;AADK,IAAM,gBAAgB,CAAC,EAAE,WAAW,KAAK,GAAG,KAAK,MACtD,gBAAAA;AAAA,EAACD,aAAY;AAAA,EAAZ;AAAA,IACC,wBAAqB;AAAA,IACrB;AAAA,IACA,WAAWD;AAAA,MACT,CAAC,SAAS,SAAS,UAAU,YAAY,YAAY,WAAW;AAAA,MAChE,CAAC,kBAAkB;AAAA,MACnB,CAAC,mCAAmC;AAAA,MACpC,CAAC,sCAAsC;AAAA,MACvC;AAAA,IACF;AAAA,IACC,GAAG;AAAA;AACN;AAGF,cAAc,cAAc;;;ACvB5B,SAAS,UAAUG,oBAAmB;AAMpC,gBAAAC,aAAA;AADK,IAAM,eAAe,CAAC,EAAE,UAAU,GAAG,KAAK,MAC/C,gBAAAA,MAACD,aAAY,QAAZ,EAAoB,GAAG,MAAO,UAAS;AAG1C,aAAa,cAAc;;;ACT3B,SAAS,MAAAE,WAAU;AACnB,SAAS,UAAUC,oBAAmB;AAQpC,gBAAAC,aAAA;AADK,IAAM,cAAc,CAAC,EAAE,WAAW,KAAK,GAAG,OAAO,MACtD,gBAAAA;AAAA,EAACD,aAAY;AAAA,EAAZ;AAAA,IACC,wBAAqB;AAAA,IACrB;AAAA,IACA,WAAWD,IAAG,mCAAmC,SAAS;AAAA,IACzD,GAAG;AAAA;AACN;AAGF,YAAY,cAAc;;;ACjB1B,SAAS,UAAUG,oBAAmB;AAYpC,gBAAAC,aAAA;AADK,IAAM,gBAAgB,CAAC,UAC5B,gBAAAA,MAACD,aAAY,SAAZ,EAAoB,wBAAqB,kBAAkB,GAAG,OAAO;AAGxE,cAAc,cAAc;;;ACHrB,IAAME,UAWT,OAAO,OAAO,QAAM;AAAA,EACtB,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,aAAa;AAAA,EACb,OAAO;AAAA,EACP,aAAa;AACf,CAAC;AAEDA,QAAO,cAAc;AACrB,cAAc,cAAc;AAC5B,aAAa,cAAc;AAC3B,cAAc,cAAc;AAC5B,cAAc,cAAc;AAC5B,aAAa,cAAc;AAC3B,WAAW,cAAc;AACzB,aAAa,cAAc;AAC3B,kBAAkB,cAAc;AAChC,YAAY,cAAc;AAC1B,kBAAkB,cAAc;","names":["jsx","jsx","RadixDrawer","jsx","jsx","RadixDrawer","cva","jsx","RadixDrawer","RadixDrawer","jsx","cx","jsx","cx","jsx","cx","RadixDrawer","jsx","RadixDrawer","jsx","cx","RadixDrawer","jsx","RadixDrawer","jsx","Drawer"]}
+{"version":3,"file":"index.mjs","sources":["../../src/drawer/DrawerContext.tsx","../../src/drawer/Drawer.tsx","../../src/drawer/DrawerBody.styles.ts","../../src/drawer/DrawerBody.tsx","../../src/drawer/DrawerClose.tsx","../../src/drawer/DrawerCloseButton.tsx","../../src/drawer/DrawerContent.styles.tsx","../../src/drawer/DrawerContent.tsx","../../src/drawer/DrawerDescription.tsx","../../src/drawer/DrawerFooter.tsx","../../src/drawer/DrawerHeader.tsx","../../src/drawer/DrawerOverlay.tsx","../../src/drawer/DrawerPortal.tsx","../../src/drawer/DrawerTitle.tsx","../../src/drawer/DrawerTrigger.tsx","../../src/drawer/index.ts"],"sourcesContent":["import { createContext, type ReactNode, useContext } from 'react'\n\nexport interface DrawerContextState {\n  withFade: boolean\n}\n\nconst DrawerContext = createContext<DrawerContextState | null>(null)\n\nexport const DrawerProvider = ({\n  children: childrenProp,\n  withFade = false,\n}: {\n  children: ReactNode\n  withFade?: boolean\n}) => {\n  return (\n    <DrawerContext.Provider\n      value={{\n        withFade,\n      }}\n    >\n      {childrenProp}\n    </DrawerContext.Provider>\n  )\n}\n\nexport const useDrawer = () => {\n  const context = useContext(DrawerContext)\n\n  if (!context) {\n    throw Error('useDrawer must be used within a Drawer provider')\n  }\n\n  return context\n}\n","import { Dialog as RadixDrawer } from 'radix-ui'\nimport { type ReactElement, ReactNode } from 'react'\n\nimport { DrawerProvider } from './DrawerContext'\n\nexport interface DrawerProps {\n  /**\n   * Children of the component.\n   */\n  children?: RadixDrawer.DialogProps['children']\n  /**\n   * Specifies if the dialog is open or not.\n   */\n  open?: RadixDrawer.DialogProps['open']\n  /**\n   * Default open state.\n   */\n  defaultOpen?: RadixDrawer.DialogProps['defaultOpen']\n  /**\n   * Handler executed on every dialog open state change.\n   */\n  onOpenChange?: RadixDrawer.DialogProps['onOpenChange']\n  /**\n   * Specifies if the dialog is a modal.\n   */\n  modal?: RadixDrawer.DialogProps['modal']\n  /**\n   * Specifies if the drawer should have a fade animation on its body (in case it is scrollable).\n   */\n  withFade?: boolean\n}\n\nexport interface DialogProps {\n  children?: ReactNode\n  open?: boolean\n  defaultOpen?: boolean\n  onOpenChange?(open: boolean): void\n  modal?: boolean\n}\n\nexport const Drawer = ({ children, withFade = false, ...rest }: DrawerProps): ReactElement => (\n  <DrawerProvider withFade={withFade}>\n    <RadixDrawer.Root {...rest}>{children}</RadixDrawer.Root>\n  </DrawerProvider>\n)\n\nDrawer.displayName = 'Drawer.Root'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const drawerBodyStyles = cva(\n  ['grow', 'overflow-y-auto', 'outline-hidden', 'focus-visible:u-outline'],\n  {\n    variants: {\n      inset: {\n        true: '',\n        false: 'px-xl py-lg',\n      },\n    },\n    defaultVariants: {\n      inset: false,\n    },\n  }\n)\n\nexport type DrawerBodyStylesProps = VariantProps<typeof drawerBodyStyles>\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { type ReactNode, Ref, useRef } from 'react'\n\nimport { drawerBodyStyles, type DrawerBodyStylesProps } from './DrawerBody.styles'\nimport { useDrawer } from './DrawerContext'\n\nexport interface DrawerBodyProps extends DrawerBodyStylesProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const DrawerBody = ({\n  children,\n  inset = false,\n  className,\n  ref: forwardedRef,\n  ...rest\n}: DrawerBodyProps) => {\n  const scrollAreaRef = useRef<HTMLDivElement>(null)\n  const ref = useMergeRefs(forwardedRef, scrollAreaRef)\n\n  const { withFade } = useDrawer()\n\n  const { overflow } = useScrollOverflow(scrollAreaRef)\n\n  return (\n    <div\n      data-spark-component=\"drawer-body\"\n      ref={ref}\n      className={drawerBodyStyles({ inset, className })}\n      style={{\n        ...(withFade && {\n          maskImage:\n            'linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n          maskSize: `100% calc(100% + ${overflow.top ? '0px' : '44px'} + ${overflow.bottom ? '0px' : '44px'})`,\n          maskPosition: `0 ${overflow.top ? '0px' : '-44px'}`,\n        }),\n      }}\n      {...rest}\n    >\n      {children}\n    </div>\n  )\n}\n\nDrawerBody.displayName = 'Drawer.Body'\n","import { Dialog as RadixDrawer } from 'radix-ui'\nimport { Ref } from 'react'\n\nexport type DrawerCloseProps = RadixDrawer.DialogCloseProps & {\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport const DrawerClose = (props: DrawerCloseProps) => (\n  <RadixDrawer.Close data-spark-component=\"drawer-close\" {...props} />\n)\n\nDrawerClose.displayName = 'Drawer.Close'\n","import { Close as CloseSVG } from '@spark-ui/icons/Close'\nimport { cx } from 'class-variance-authority'\n\nimport { Icon } from '../icon'\nimport { IconButton, type IconButtonProps } from '../icon-button'\nimport { DrawerClose, type DrawerCloseProps } from './DrawerClose'\n\nexport type DrawerCloseButtonProps = DrawerCloseProps &\n  Pick<IconButtonProps, 'size' | 'intent' | 'design' | 'aria-label'>\n\nexport const DrawerCloseButton = ({\n  'aria-label': ariaLabel,\n  className,\n  size = 'md',\n  intent = 'neutral',\n  design = 'ghost',\n  children = <CloseSVG />,\n  ref,\n  ...rest\n}: DrawerCloseButtonProps) => (\n  <DrawerClose\n    data-spark-component=\"drawer-close-button\"\n    ref={ref}\n    className={cx(['absolute', 'top-sm', 'right-xl'], className)}\n    asChild\n    {...rest}\n  >\n    <IconButton intent={intent} size={size} design={design} aria-label={ariaLabel}>\n      <Icon>{children}</Icon>\n    </IconButton>\n  </DrawerClose>\n)\n\nDrawerCloseButton.displayName = 'Drawer.CloseButton'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const drawerContentStyles = cva(\n  [\n    'fixed z-modal flex flex-col bg-surface shadow-md',\n    'data-[state=open]:animation-duration-400 data-[state=closed]:animation-duration-200',\n  ],\n  {\n    variants: {\n      size: {\n        sm: '',\n        md: '',\n        lg: '',\n        fluid: '',\n        fullscreen: 'h-screen w-screen',\n      },\n      side: {\n        right: [\n          'inset-y-0 right-0',\n          'data-[state=open]:animate-slide-in-right ',\n          'data-[state=closed]:animate-slide-out-right',\n        ],\n        left: [\n          'inset-y-0 left-0',\n          'data-[state=open]:animate-slide-in-left',\n          'data-[state=closed]:animate-slide-out-left',\n        ],\n        top: [\n          'top-0 left-0',\n          'w-screen',\n          'data-[state=open]:animate-slide-in-top',\n          'data-[state=closed]:animate-slide-out-top',\n        ],\n        bottom: [\n          'bottom-0 left-0',\n          'w-screen',\n          'data-[state=open]:animate-slide-in-bottom',\n          'data-[state=closed]:animate-slide-out-bottom',\n        ],\n      },\n    },\n    compoundVariants: [\n      {\n        side: ['right', 'left'],\n        size: 'sm',\n        class: ['w-sz-480', 'max-w-full'],\n      },\n      {\n        side: ['right', 'left'],\n        size: 'md',\n        class: ['w-sz-672', 'max-w-full'],\n      },\n      {\n        side: ['right', 'left'],\n        size: 'lg',\n        class: ['w-sz-864', 'max-w-full'],\n      },\n      {\n        side: ['left', 'right'],\n        size: 'fluid',\n        class: ['w-auto', 'max-w-full'],\n      },\n      {\n        side: ['top', 'bottom'],\n        size: 'sm',\n        class: ['h-sz-480', 'max-h-full'],\n      },\n      {\n        side: ['top', 'bottom'],\n        size: 'md',\n        class: ['h-sz-672', 'max-h-full'],\n      },\n      {\n        side: ['top', 'bottom'],\n        size: 'lg',\n        class: ['h-sz-864', 'max-h-full'],\n      },\n      {\n        side: ['top', 'bottom'],\n        size: 'fluid',\n        class: ['h-auto', 'max-h-full'],\n      },\n    ],\n    defaultVariants: {\n      side: 'right',\n      size: 'md',\n    },\n  }\n)\n\nexport type DrawerContentStylesProps = VariantProps<typeof drawerContentStyles>\n","import { Dialog as RadixDrawer } from 'radix-ui'\nimport { Ref } from 'react'\n\nimport { drawerContentStyles, type DrawerContentStylesProps } from './DrawerContent.styles'\n\nexport type DrawerContentProps = RadixDrawer.DialogContentProps &\n  DrawerContentStylesProps & {\n    ref?: Ref<HTMLDivElement>\n  }\n\nexport const DrawerContent = ({\n  className,\n  size = 'md',\n  side = 'right',\n  onInteractOutside,\n  ref,\n  ...rest\n}: DrawerContentProps) => (\n  <RadixDrawer.Content\n    data-spark-component=\"drawer-content\"\n    ref={ref}\n    className={drawerContentStyles({\n      size,\n      side,\n      className,\n    })}\n    onInteractOutside={e => {\n      const isForegroundElement = (e.target as HTMLElement).closest('.z-toast, .z-popover')\n\n      /**\n       * The focus trap of the drawer applies `pointer-events-none` on the body of the page in the background, but\n       * some components with an higher z-index have `pointer-events-auto` applied on them to remain interactive and ignore the focust trap (ex: a Snackbar with actions).\n       *\n       * Clicking on the snackbar will be considered as an \"outside click\" and close the drawer. We want to prevent this.\n       */\n      if (isForegroundElement) {\n        e.preventDefault()\n      }\n\n      onInteractOutside?.(e)\n    }}\n    {...rest}\n  />\n)\n\nDrawerContent.displayName = 'Drawer.Content'\n","import { Dialog as RadixDrawer } from 'radix-ui'\nimport { Ref } from 'react'\n\nexport type DrawerDescriptionProps = RadixDrawer.DialogDescriptionProps & {\n  ref?: Ref<HTMLParagraphElement>\n}\n\nexport const DrawerDescription = (props: DrawerDescriptionProps) => (\n  <RadixDrawer.Description data-spark-component=\"drawer-description\" {...props} />\n)\n\nDrawerDescription.displayName = 'Drawer.Description'\n","import { cx } from 'class-variance-authority'\nimport { ComponentPropsWithoutRef, type ReactElement, Ref } from 'react'\n\nexport type DrawerFooterProps = ComponentPropsWithoutRef<'footer'> & {\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const DrawerFooter = ({ className, ref, ...rest }: DrawerFooterProps): ReactElement => (\n  <footer\n    data-spark-component=\"drawer-footer\"\n    ref={ref}\n    className={cx(['px-xl', 'py-lg'], className)}\n    {...rest}\n  />\n)\n\nDrawerFooter.displayName = 'Drawer.Footer'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface DrawerHeaderProps {\n  children: ReactNode\n  className?: string\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const DrawerHeader = ({\n  children,\n  className,\n  ref,\n  ...rest\n}: DrawerHeaderProps): ReactElement => (\n  <header\n    data-spark-component=\"drawer-header\"\n    ref={ref}\n    className={cx(['px-xl', 'py-lg'], className)}\n    {...rest}\n  >\n    {children}\n  </header>\n)\n\nDrawerHeader.displayName = 'Dialog.Header'\n","import { cx } from 'class-variance-authority'\nimport { Dialog as RadixDrawer } from 'radix-ui'\nimport { type ReactElement, Ref } from 'react'\n\nexport type DrawerOverlayProps = RadixDrawer.DialogOverlayProps & {\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const DrawerOverlay = ({ className, ref, ...rest }: DrawerOverlayProps): ReactElement => (\n  <RadixDrawer.Overlay\n    data-spark-component=\"drawer-overlay\"\n    ref={ref}\n    className={cx(\n      ['fixed', 'top-0', 'left-0', 'w-screen', 'h-screen', 'z-overlay'],\n      ['bg-overlay/dim-1'],\n      ['data-[state=open]:animate-fade-in'],\n      ['data-[state=closed]:animate-fade-out'],\n      className\n    )}\n    {...rest}\n  />\n)\n\nDrawerOverlay.displayName = 'Drawer.Overlay'\n","import { Dialog as RadixDrawer } from 'radix-ui'\nimport { type ReactElement } from 'react'\n\nexport type DrawerPortalProps = RadixDrawer.DialogPortalProps\n\nexport const DrawerPortal = ({ children, ...rest }: DrawerPortalProps): ReactElement => (\n  <RadixDrawer.Portal {...rest}>{children}</RadixDrawer.Portal>\n)\n\nDrawerPortal.displayName = 'Drawer.Portal'\n","import { cx } from 'class-variance-authority'\nimport { Dialog as RadixDrawer } from 'radix-ui'\nimport { Ref } from 'react'\n\nexport type DrawerTitleProps = RadixDrawer.DialogTitleProps & {\n  ref?: Ref<HTMLHeadingElement>\n}\n\nexport const DrawerTitle = ({ className, ref, ...others }: DrawerTitleProps) => (\n  <RadixDrawer.Title\n    data-spark-component=\"drawer-title\"\n    ref={ref}\n    className={cx('text-headline-2 text-on-surface', className)}\n    {...others}\n  />\n)\n\nDrawerTitle.displayName = 'Drawer.Title'\n","import { Dialog as RadixDrawer } from 'radix-ui'\nimport { type ReactElement, Ref } from 'react'\n\nexport interface DrawerTriggerProps extends RadixDrawer.DialogTriggerProps {\n  /**\n   * Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.\n   */\n  asChild?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\nexport const DrawerTrigger = (props: DrawerTriggerProps): ReactElement => (\n  <RadixDrawer.Trigger data-spark-component=\"drawer-trigger\" {...props} />\n)\n\nDrawerTrigger.displayName = 'Drawer.Trigger'\n","import { Drawer as Root } from './Drawer'\nimport { DrawerBody } from './DrawerBody'\nimport { DrawerCloseButton } from './DrawerCloseButton'\nimport { DrawerContent } from './DrawerContent'\nimport { DrawerDescription } from './DrawerDescription' // aria-describedby\nimport { DrawerFooter } from './DrawerFooter'\nimport { DrawerHeader } from './DrawerHeader'\nimport { DrawerOverlay } from './DrawerOverlay'\nimport { DrawerPortal } from './DrawerPortal'\nimport { DrawerTitle } from './DrawerTitle'\nimport { DrawerTrigger } from './DrawerTrigger'\n\nexport const Drawer: typeof Root & {\n  Trigger: typeof DrawerTrigger\n  Portal: typeof DrawerPortal\n  Overlay: typeof DrawerOverlay\n  Content: typeof DrawerContent\n  Header: typeof DrawerHeader\n  Body: typeof DrawerBody\n  Footer: typeof DrawerFooter\n  CloseButton: typeof DrawerCloseButton\n  Title: typeof DrawerTitle\n  Description: typeof DrawerDescription\n} = Object.assign(Root, {\n  Trigger: DrawerTrigger,\n  Portal: DrawerPortal,\n  Overlay: DrawerOverlay,\n  Content: DrawerContent,\n  Header: DrawerHeader,\n  Body: DrawerBody,\n  Footer: DrawerFooter,\n  CloseButton: DrawerCloseButton,\n  Title: DrawerTitle,\n  Description: DrawerDescription,\n})\n\nDrawer.displayName = 'Drawer'\nDrawerTrigger.displayName = 'Drawer.Trigger'\nDrawerPortal.displayName = 'Drawer.Portal'\nDrawerOverlay.displayName = 'Drawer.Overlay'\nDrawerContent.displayName = 'Drawer.Content'\nDrawerHeader.displayName = 'Drawer.Header'\nDrawerBody.displayName = 'Drawer.Body'\nDrawerFooter.displayName = 'Drawer.Footer'\nDrawerCloseButton.displayName = 'Drawer.CloseButton'\nDrawerTitle.displayName = 'Drawer.Title'\nDrawerDescription.displayName = 'Drawer.Description'\n\nexport { type DrawerProps } from './Drawer'\nexport { type DrawerContentProps } from './DrawerContent'\nexport { type DrawerHeaderProps } from './DrawerHeader'\nexport { type DrawerBodyProps } from './DrawerBody'\nexport { type DrawerFooterProps } from './DrawerFooter'\nexport { type DrawerTriggerProps } from './DrawerTrigger'\nexport { type DrawerOverlayProps } from './DrawerOverlay'\nexport { type DrawerPortalProps } from './DrawerPortal'\nexport { type DrawerTitleProps } from './DrawerTitle'\nexport { type DrawerDescriptionProps } from './DrawerDescription'\nexport { type DrawerCloseProps } from './DrawerClose'\nexport { type DrawerCloseButtonProps } from './DrawerCloseButton'\n"],"names":["DrawerContext","createContext","DrawerProvider","childrenProp","withFade","jsx","useDrawer","context","useContext","Drawer","children","rest","RadixDrawer.Root","drawerBodyStyles","cva","DrawerBody","inset","className","forwardedRef","scrollAreaRef","useRef","ref","useMergeRefs","overflow","useScrollOverflow","DrawerClose","props","RadixDrawer.Close","DrawerCloseButton","ariaLabel","size","intent","design","CloseSVG","cx","IconButton","Icon","drawerContentStyles","DrawerContent","side","onInteractOutside","RadixDrawer.Content","e","DrawerDescription","RadixDrawer.Description","DrawerFooter","DrawerHeader","DrawerOverlay","RadixDrawer.Overlay","DrawerPortal","RadixDrawer.Portal","DrawerTitle","others","RadixDrawer.Title","DrawerTrigger","RadixDrawer.Trigger","Root"],"mappings":"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"}

package/dist/dropdown/Dropdown.d.ts

@@ -0,0 +1,6 @@
+import { DropdownContextProps } from './DropdownContext';
+export type DropdownProps = DropdownContextProps;
+export declare const Dropdown: {
+    ({ children, ...props }: DropdownProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/dropdown/DropdownContext.d.ts

@@ -0,0 +1,81 @@
+import { Dispatch, PropsWithChildren, SetStateAction } from 'react';
+import { DownshiftState, DropdownItem, ItemsMap } from './types';
+export interface DropdownContextState extends DownshiftState {
+    itemsMap: ItemsMap;
+    highlightedItem: DropdownItem | undefined;
+    hasPopover: boolean;
+    setHasPopover: Dispatch<SetStateAction<boolean>>;
+    multiple: boolean;
+    disabled: boolean;
+    readOnly: boolean;
+    state?: 'error' | 'alert' | 'success';
+    lastInteractionType: 'mouse' | 'keyboard';
+    setLastInteractionType: (type: 'mouse' | 'keyboard') => void;
+}
+export type DropdownContextCommonProps = PropsWithChildren<{
+    /**
+     * The controlled open state of the select. Must be used in conjunction with `onOpenChange`.
+     */
+    open?: boolean;
+    /**
+     * Event handler called when the open state of the select changes.
+     */
+    onOpenChange?: (isOpen: boolean) => void;
+    /**
+     * The open state of the select when it is initially rendered. Use when you do not need to control its open state.
+     */
+    defaultOpen?: boolean;
+    /**
+     * Use `state` prop to assign a specific state to the dropdown, choosing from: `error`, `alert` and `success`. By doing so, the outline styles will be updated.
+     */
+    state?: 'error' | 'alert' | 'success';
+    /**
+     * When true, prevents the user from interacting with the dropdown.
+     */
+    disabled?: boolean;
+    /**
+     * Sets the dropdown as interactive or not.
+     */
+    readOnly?: boolean;
+}>;
+interface DropdownPropsSingle {
+    /**
+     * Prop 'multiple' indicating whether multiple values are allowed.
+     */
+    multiple?: false;
+    /**
+     * The value of the select when initially rendered. Use when you do not need to control the state of the select.
+     */
+    defaultValue?: string;
+    /**
+     * The controlled value of the select. Should be used in conjunction with `onValueChange`.
+     */
+    value?: string;
+    /**
+     * Event handler called when the value changes.
+     */
+    onValueChange?: (value: string) => void;
+}
+interface DropdownPropsMultiple {
+    /**
+     * Prop 'multiple' indicating whether multiple values are allowed.
+     */
+    multiple: true;
+    /**
+     * The value of the select when initially rendered. Use when you do not need to control the state of the select.
+     */
+    defaultValue?: string[];
+    /**
+     * The controlled value of the select. Should be used in conjunction with `onValueChange`.
+     */
+    value?: string[];
+    /**
+     * Event handler called when the value changes.
+     */
+    onValueChange?: (value: string[]) => void;
+}
+export type DropdownContextProps = DropdownContextCommonProps & (DropdownPropsSingle | DropdownPropsMultiple);
+export declare const ID_PREFIX = ":dropdown";
+export declare const DropdownProvider: ({ children, defaultValue, value, onValueChange, open, onOpenChange, defaultOpen, multiple, disabled: disabledProp, readOnly: readOnlyProp, state: stateProp, }: DropdownContextProps) => import("react/jsx-runtime").JSX.Element;
+export declare const useDropdownContext: () => DropdownContextState;
+export {};