@easypost/easy-ui 1.0.0-alpha.111 → 1.0.0-alpha.113

package/DateRangePicker/index.js

@@ -19,10 +19,11 @@ var __spreadValues = (a, b) => {
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("../__chunks__/jsx-runtime-CH1d66I3.js");
 const React = require("react");
-const RangeCalendar = require("../__chunks__/RangeCalendar-Ckqj2J9L.js");
-const DatePickerBase = require("../__chunks__/DatePickerBase-DSPIErms.js");
-const CalendarBase = require("../__chunks__/CalendarBase-DHxad3N9.js");
+const RangeCalendar = require("../__chunks__/RangeCalendar-Do2nei5A.js");
+const DatePickerBase = require("../__chunks__/DatePickerBase-XoRply_u.js");
+const CalendarBase = require("../__chunks__/CalendarBase-Bx8bdXeT.js");
 const useFormValidation = require("../__chunks__/useFormValidation-joghLMcB.js");
 const Overlay = require("../__chunks__/Overlay-BNP_t3v4.js");
 const useControlledState = require("../__chunks__/useControlledState-CcM4H_K0.js");
@@ -445,15 +446,16 @@ function DateRangePicker(props) {
   const overlayProps = {
     dialogProps
   };
-  return React.createElement(DatePickerBase.DatePickerBase, {
+  return jsxRuntime.jsxRuntimeExports.jsx(DatePickerBase.DatePickerBase, {
     labelProps,
     triggerProps,
     overlayProps,
     state,
     label,
-    "aria-label": ariaLabel
-  }, React.createElement(RangeCalendar.RangeCalendar, __spreadProps(__spreadValues({}, calendarProps), {
-    isInvalid: false
-  })));
+    "aria-label": ariaLabel,
+    children: jsxRuntime.jsxRuntimeExports.jsx(RangeCalendar.RangeCalendar, __spreadProps(__spreadValues({}, calendarProps), {
+      isInvalid: false
+    }))
+  });
 }
 exports.DateRangePicker = DateRangePicker;

package/DateRangePicker/index.mjs

@@ -17,10 +17,11 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import { j as jsxRuntimeExports } from "../__chunks__/jsx-runtime-DTpFD6nx.mjs";
 import React__default, { useState, useMemo, useRef } from "react";
-import { R as RangeCalendar } from "../__chunks__/RangeCalendar-LPcJB19o.mjs";
-import { $ as $35a22f14a1f04b11$export$2440da353cedad43, a as $35a22f14a1f04b11$export$80ff8fc0ae339c13, b as $35a22f14a1f04b11$export$7e319ea407e63bc0, c as $35a22f14a1f04b11$export$c5221a78ef73c5e9, d as $3dfb0f96be0d6a08$export$4a931266a3838b86, e as $dfb4eba373ed9493$exports, f as $16f0b7bb276bc17e$export$300019f83c56d282, g as $16f0b7bb276bc17e$export$7b3062cd49e80452, D as DatePickerBase } from "../__chunks__/DatePickerBase-CFB0JDQA.mjs";
-import { m as $fb18d541ea1ad717$export$ad991b66133851cf, n as $11d87f3f76e88657$export$b21e0b124e224484, d as $11d87f3f76e88657$export$93522d1a439f3617 } from "../__chunks__/CalendarBase-Bn9o8BdD.mjs";
+import { R as RangeCalendar } from "../__chunks__/RangeCalendar-BSsmX9l4.mjs";
+import { $ as $35a22f14a1f04b11$export$2440da353cedad43, a as $35a22f14a1f04b11$export$80ff8fc0ae339c13, b as $35a22f14a1f04b11$export$7e319ea407e63bc0, c as $35a22f14a1f04b11$export$c5221a78ef73c5e9, d as $3dfb0f96be0d6a08$export$4a931266a3838b86, e as $dfb4eba373ed9493$exports, f as $16f0b7bb276bc17e$export$300019f83c56d282, g as $16f0b7bb276bc17e$export$7b3062cd49e80452, D as DatePickerBase } from "../__chunks__/DatePickerBase-C4PwUr9x.mjs";
+import { m as $fb18d541ea1ad717$export$ad991b66133851cf, n as $11d87f3f76e88657$export$b21e0b124e224484, d as $11d87f3f76e88657$export$93522d1a439f3617 } from "../__chunks__/CalendarBase-3a9i7QNo.mjs";
 import { $ as $e5be200c675c3b3a$export$fc1a364ae1f3ff10, b as $e5be200c675c3b3a$export$dad6ae84456c676a, c as $e5be200c675c3b3a$export$a763b9476acd3eb, d as $e5be200c675c3b3a$export$75ee7c75d68f5b0e } from "../__chunks__/useFormValidation-Bdyc51B-.mjs";
 import { a as $fc909762b330b746$export$61c6a8c84e605fb6 } from "../__chunks__/Overlay-Dkjxuk6V.mjs";
 import { $ as $458b0a5536c1a7cf$export$40bfa8c7b0832715 } from "../__chunks__/useControlledState-BPR3PrW4.mjs";
@@ -443,16 +444,17 @@ function DateRangePicker(props) {
   const overlayProps = {
     dialogProps
   };
-  return React__default.createElement(DatePickerBase, {
+  return jsxRuntimeExports.jsx(DatePickerBase, {
     labelProps,
     triggerProps,
     overlayProps,
     state,
     label,
-    "aria-label": ariaLabel
-  }, React__default.createElement(RangeCalendar, __spreadProps(__spreadValues({}, calendarProps), {
-    isInvalid: false
-  })));
+    "aria-label": ariaLabel,
+    children: jsxRuntimeExports.jsx(RangeCalendar, __spreadProps(__spreadValues({}, calendarProps), {
+      isInvalid: false
+    }))
+  });
 }
 export {
   DateRangePicker

package/Drawer/context.d.ts

@@ -5,8 +5,8 @@ export type DrawerContextType = {
     dialogProps: DOMAttributes<FocusableElement>;
     titleProps: DOMAttributes<FocusableElement>;
     isHeaderStuck: boolean;
-    bodyRef: RefObject<HTMLDivElement>;
-    headerInterceptorRef: RefObject<HTMLDivElement>;
+    bodyRef: RefObject<HTMLDivElement | null>;
+    headerInterceptorRef: RefObject<HTMLDivElement | null>;
 };
 type DrawerTriggerContextType = {
     isDismissable: boolean;

package/Drawer/context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../src/Drawer/context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,SAAS,EAA6B,MAAM,OAAO,CAAC;AAC5E,OAAO,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAC;AAEpD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,WAAW,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;IAC7C,UAAU,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;IAC5C,aAAa,EAAE,OAAO,CAAC;IACvB,OAAO,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IACnC,oBAAoB,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;CACjD,CAAC;AAEF,KAAK,wBAAwB,GAAG;IAC9B,aAAa,EAAE,OAAO,CAAC;IACvB,KAAK,EAAE,mBAAmB,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,aAAa,mDAAgD,CAAC;AAE3E,eAAO,MAAM,gBAAgB,yBAM5B,CAAC;AAEF,eAAO,MAAM,oBAAoB,0DACqB,CAAC;AAEvD,eAAO,MAAM,uBAAuB,gCAMnC,CAAC;AAEF,eAAO,MAAM,gBAAgB,2BAG5B,CAAC"}
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../src/Drawer/context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,SAAS,EAA6B,MAAM,OAAO,CAAC;AAC5E,OAAO,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAC;AAEpD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,WAAW,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;IAC7C,UAAU,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;IAC5C,aAAa,EAAE,OAAO,CAAC;IACvB,OAAO,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC1C,oBAAoB,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;CACxD,CAAC;AAEF,KAAK,wBAAwB,GAAG;IAC9B,aAAa,EAAE,OAAO,CAAC;IACvB,KAAK,EAAE,mBAAmB,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,aAAa,mDAAgD,CAAC;AAE3E,eAAO,MAAM,gBAAgB,yBAM5B,CAAC;AAEF,eAAO,MAAM,oBAAoB,0DACqB,CAAC;AAEvD,eAAO,MAAM,uBAAuB,gCAMnC,CAAC;AAEF,eAAO,MAAM,gBAAgB,2BAG5B,CAAC"}

package/Drawer/index.js

@@ -31,11 +31,12 @@ var __objRest = (source, exclude) => {
   return target;
 };
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("../__chunks__/jsx-runtime-CH1d66I3.js");
 const React = require("react");
 const utilities_css = require("../utilities/css.js");
 const utilities_useScrollbar = require("../utilities/useScrollbar.js");
-const Icon = require("../__chunks__/Icon-W8F9w-jS.js");
-const Text = require("../__chunks__/Text-CSESKR_s.js");
+const Icon = require("../__chunks__/Icon-BVa5ddiD.js");
+const Text = require("../__chunks__/Text-C4CEsglh.js");
 const useModalOverlay = require("../__chunks__/useModalOverlay-C4Gci3MA.js");
 const Overlay = require("../__chunks__/Overlay-BNP_t3v4.js");
 const CSSTransition = require("../__chunks__/CSSTransition-BXyX0mUc.js");
@@ -92,9 +93,10 @@ const styles = {
 };
 function DrawerBanner(props) {
   const className = utilities_css.classNames(styles.banner);
-  return React.createElement("div", {
-    className
-  }, props.children);
+  return jsxRuntime.jsxRuntimeExports.jsx("div", {
+    className,
+    children: props.children
+  });
 }
 const DrawerContext = React.createContext(null);
 const useDrawerContext = () => {
@@ -120,13 +122,14 @@ function DrawerBody(props) {
   const { children } = props;
   const drawerContext = useDrawerContext();
   utilities_useScrollbar.useScrollbar(drawerContext.bodyRef, "ezui-os-theme-drawer");
-  return React.createElement("div", {
+  return jsxRuntime.jsxRuntimeExports.jsxs("div", {
     className: styles.body,
-    ref: drawerContext.bodyRef
-  }, React.createElement("div", {
-    "data-intercept": "header",
-    ref: drawerContext.headerInterceptorRef
-  }), children);
+    ref: drawerContext.bodyRef,
+    children: [jsxRuntime.jsxRuntimeExports.jsx("div", {
+      "data-intercept": "header",
+      ref: drawerContext.headerInterceptorRef
+    }), children]
+  });
 }
 var __defProp2 = Object.defineProperty;
 var __getOwnPropSymbols2 = Object.getOwnPropertySymbols;
@@ -173,15 +176,17 @@ function DrawerCloseButton() {
   if (!drawerTriggerContext.isDismissable) {
     return null;
   }
-  return React.createElement("button", {
+  return jsxRuntime.jsxRuntimeExports.jsxs("button", {
     className: styles.closeButton,
-    onClick: handleClick
-  }, React.createElement(Text.Text, {
-    visuallyHidden: true
-  }, "Close drawer"), React.createElement(Icon.Icon, {
-    symbol: Cancel,
-    size: "md"
-  }));
+    onClick: handleClick,
+    children: [jsxRuntime.jsxRuntimeExports.jsx(Text.Text, {
+      visuallyHidden: true,
+      children: "Close drawer"
+    }), jsxRuntime.jsxRuntimeExports.jsx(Icon.Icon, {
+      symbol: Cancel,
+      size: "md"
+    })]
+  });
 }
 function DrawerUnderlay(props) {
   const _a = props, { state, children, setAnimationExited } = _a, overlayProps = __objRest(_a, ["state", "children", "setAnimationExited"]);
@@ -197,35 +202,42 @@ function DrawerUnderlay(props) {
       ref2.current.addEventListener("transitionend", done, false);
     }
   };
-  return React.createElement(Overlay.$337b884510726a0d$export$c6fdb837b070b4ff, null, React.createElement(CSSTransition.CSSTransition, {
-    in: state.isOpen,
-    appear: true,
-    onEntered: () => setAnimationExited(false),
-    onExited: () => setAnimationExited(true),
-    nodeRef: underlayBgRef,
-    addEndListener: createAnimationEndListener(underlayBgRef),
-    classNames: {
-      enter: styles.underlayBgEnter,
-      enterDone: styles.underlayBgEnterDone,
-      exit: styles.underlayBgExit
-    }
-  }, React.createElement("div", __spreadValues({
-    ref: underlayBgRef,
-    className: styles.underlayBg
-  }, underlayProps), React.createElement(CSSTransition.CSSTransition, {
-    in: state.isOpen,
-    appear: true,
-    nodeRef: ref,
-    addEndListener: createAnimationEndListener(ref),
-    classNames: {
-      appear: styles.underlayBoxAppear,
-      appearDone: styles.underlayBoxDone,
-      exit: styles.underlayBoxExit
-    }
-  }, React.createElement("div", __spreadProps(__spreadValues({}, modalProps), {
-    ref,
-    className: styles.underlayBox
-  }), children)))));
+  return jsxRuntime.jsxRuntimeExports.jsx(Overlay.$337b884510726a0d$export$c6fdb837b070b4ff, {
+    children: jsxRuntime.jsxRuntimeExports.jsx(CSSTransition.CSSTransition, {
+      in: state.isOpen,
+      appear: true,
+      onEntered: () => setAnimationExited(false),
+      onExited: () => setAnimationExited(true),
+      nodeRef: underlayBgRef,
+      addEndListener: createAnimationEndListener(underlayBgRef),
+      classNames: {
+        enter: styles.underlayBgEnter,
+        enterDone: styles.underlayBgEnterDone,
+        exit: styles.underlayBgExit
+      },
+      children: jsxRuntime.jsxRuntimeExports.jsx("div", __spreadProps(__spreadValues({
+        ref: underlayBgRef,
+        className: styles.underlayBg
+      }, underlayProps), {
+        children: jsxRuntime.jsxRuntimeExports.jsx(CSSTransition.CSSTransition, {
+          in: state.isOpen,
+          appear: true,
+          nodeRef: ref,
+          addEndListener: createAnimationEndListener(ref),
+          classNames: {
+            appear: styles.underlayBoxAppear,
+            appearDone: styles.underlayBoxDone,
+            exit: styles.underlayBoxExit
+          },
+          children: jsxRuntime.jsxRuntimeExports.jsx("div", __spreadProps(__spreadValues({}, modalProps), {
+            ref,
+            className: styles.underlayBox,
+            children
+          }))
+        })
+      }))
+    })
+  });
 }
 function DrawerContainer(props) {
   const { children, isDismissable = true, onDismiss = () => {
@@ -266,37 +278,42 @@ function DrawerContainer(props) {
       isDismissable
     };
   }, [state, isDismissable]);
-  return React.createElement(DrawerTriggerContext.Provider, {
-    value: context
-  }, (state.isOpen || !animationExited) && React.createElement(DrawerUnderlay, {
-    setAnimationExited,
-    state,
-    isDismissable
-  }, lastChild ? React.cloneElement(lastChild, overlayProps) : null));
+  return jsxRuntime.jsxRuntimeExports.jsx(DrawerTriggerContext.Provider, {
+    value: context,
+    children: (state.isOpen || !animationExited) && jsxRuntime.jsxRuntimeExports.jsx(DrawerUnderlay, {
+      setAnimationExited,
+      state,
+      isDismissable,
+      children: lastChild ? React.cloneElement(lastChild, overlayProps) : null
+    })
+  });
 }
 function DrawerBanneredContentArea(props) {
   const { children } = props;
-  return React.createElement("div", {
-    className: styles.banneredContentArea
-  }, children);
+  return jsxRuntime.jsxRuntimeExports.jsx("div", {
+    className: styles.banneredContentArea,
+    children
+  });
 }
 function DrawerStandaloneContentArea(props) {
   const { children } = props;
-  return React.createElement("div", {
-    className: styles.standaloneContentArea
-  }, children);
+  return jsxRuntime.jsxRuntimeExports.jsx("div", {
+    className: styles.standaloneContentArea,
+    children
+  });
 }
 function DrawerHeader(props) {
   const { children } = props;
   const drawerContext = useDrawerContext();
   const className = utilities_css.classNames(styles.header, drawerContext.isHeaderStuck && styles.stuck);
-  return React.createElement("div", {
-    className
-  }, children);
+  return jsxRuntime.jsxRuntimeExports.jsx("div", {
+    className,
+    children
+  });
 }
 function DrawerTitle(props) {
   const drawerContext = useDrawerContext();
-  return React.createElement(Text.Text, __spreadValues(__spreadValues({
+  return jsxRuntime.jsxRuntimeExports.jsx(Text.Text, __spreadValues(__spreadValues({
     variant: "heading3"
   }, drawerContext.titleProps), props));
 }
@@ -317,13 +334,15 @@ function DrawerTrigger(props) {
       isDismissable
     };
   }, [isDismissable, state]);
-  return React.createElement(DrawerTriggerContext.Provider, {
-    value: context
-  }, React.cloneElement(trigger, triggerProps), (state.isOpen || !animationExited) && React.createElement(DrawerUnderlay, __spreadProps(__spreadValues({
-    setAnimationExited
-  }, props), {
-    state
-  }), React.cloneElement(typeof modal === "function" ? modal(state.close) : modal, overlayProps)));
+  return jsxRuntime.jsxRuntimeExports.jsxs(DrawerTriggerContext.Provider, {
+    value: context,
+    children: [React.cloneElement(trigger, triggerProps), (state.isOpen || !animationExited) && jsxRuntime.jsxRuntimeExports.jsx(DrawerUnderlay, __spreadProps(__spreadValues({
+      setAnimationExited
+    }, props), {
+      state,
+      children: React.cloneElement(typeof modal === "function" ? modal(state.close) : modal, overlayProps)
+    }))]
+  });
 }
 function useIntersectionDetection(targetRef, scrollRef) {
   const [isStuck, setIsStuck] = React.useState(false);
@@ -362,12 +381,14 @@ function Drawer(props) {
     };
   }, [dialogProps, isHeaderStuck, titleProps]);
   const className = utilities_css.classNames(styles.Drawer);
-  return React.createElement(DrawerContext.Provider, {
-    value: context
-  }, React.createElement("div", __spreadProps(__spreadValues({}, dialogProps), {
-    className,
-    ref: dialogRef
-  }), children));
+  return jsxRuntime.jsxRuntimeExports.jsx(DrawerContext.Provider, {
+    value: context,
+    children: jsxRuntime.jsxRuntimeExports.jsx("div", __spreadProps(__spreadValues({}, dialogProps), {
+      className,
+      ref: dialogRef,
+      children
+    }))
+  });
 }
 Drawer.Trigger = DrawerTrigger;
 Drawer.Header = DrawerHeader;

package/Drawer/index.mjs

@@ -29,12 +29,13 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
+import { j as jsxRuntimeExports } from "../__chunks__/jsx-runtime-DTpFD6nx.mjs";
 import * as React from "react";
 import React__default, { createContext, useContext, useCallback, useState, useMemo, cloneElement, useEffect, useRef } from "react";
 import { classNames } from "../utilities/css.mjs";
 import { useScrollbar } from "../utilities/useScrollbar.mjs";
-import { I as Icon } from "../__chunks__/Icon-0SN9dbwU.mjs";
-import { T as Text } from "../__chunks__/Text-YOL3isF4.mjs";
+import { I as Icon } from "../__chunks__/Icon-DzTns8u5.mjs";
+import { T as Text } from "../__chunks__/Text-u9mYLeWj.mjs";
 import { $ as $8ac8429251c45e4b$export$dbc0f175b25fb0fb } from "../__chunks__/useModalOverlay-BmYXH7rq.mjs";
 import { d as $337b884510726a0d$export$c6fdb837b070b4ff, a as $fc909762b330b746$export$61c6a8c84e605fb6 } from "../__chunks__/Overlay-Dkjxuk6V.mjs";
 import { C as CSSTransition } from "../__chunks__/CSSTransition-C4FQrt4m.mjs";
@@ -74,9 +75,10 @@ const styles = {
 };
 function DrawerBanner(props) {
   const className = classNames(styles.banner);
-  return React__default.createElement("div", {
-    className
-  }, props.children);
+  return jsxRuntimeExports.jsx("div", {
+    className,
+    children: props.children
+  });
 }
 const DrawerContext = createContext(null);
 const useDrawerContext = () => {
@@ -102,13 +104,14 @@ function DrawerBody(props) {
   const { children } = props;
   const drawerContext = useDrawerContext();
   useScrollbar(drawerContext.bodyRef, "ezui-os-theme-drawer");
-  return React__default.createElement("div", {
+  return jsxRuntimeExports.jsxs("div", {
     className: styles.body,
-    ref: drawerContext.bodyRef
-  }, React__default.createElement("div", {
-    "data-intercept": "header",
-    ref: drawerContext.headerInterceptorRef
-  }), children);
+    ref: drawerContext.bodyRef,
+    children: [jsxRuntimeExports.jsx("div", {
+      "data-intercept": "header",
+      ref: drawerContext.headerInterceptorRef
+    }), children]
+  });
 }
 var __defProp2 = Object.defineProperty;
 var __getOwnPropSymbols2 = Object.getOwnPropertySymbols;
@@ -155,15 +158,17 @@ function DrawerCloseButton() {
   if (!drawerTriggerContext.isDismissable) {
     return null;
   }
-  return React__default.createElement("button", {
+  return jsxRuntimeExports.jsxs("button", {
     className: styles.closeButton,
-    onClick: handleClick
-  }, React__default.createElement(Text, {
-    visuallyHidden: true
-  }, "Close drawer"), React__default.createElement(Icon, {
-    symbol: Cancel,
-    size: "md"
-  }));
+    onClick: handleClick,
+    children: [jsxRuntimeExports.jsx(Text, {
+      visuallyHidden: true,
+      children: "Close drawer"
+    }), jsxRuntimeExports.jsx(Icon, {
+      symbol: Cancel,
+      size: "md"
+    })]
+  });
 }
 function DrawerUnderlay(props) {
   const _a = props, { state, children, setAnimationExited } = _a, overlayProps = __objRest(_a, ["state", "children", "setAnimationExited"]);
@@ -179,35 +184,42 @@ function DrawerUnderlay(props) {
       ref2.current.addEventListener("transitionend", done, false);
     }
   };
-  return React__default.createElement($337b884510726a0d$export$c6fdb837b070b4ff, null, React__default.createElement(CSSTransition, {
-    in: state.isOpen,
-    appear: true,
-    onEntered: () => setAnimationExited(false),
-    onExited: () => setAnimationExited(true),
-    nodeRef: underlayBgRef,
-    addEndListener: createAnimationEndListener(underlayBgRef),
-    classNames: {
-      enter: styles.underlayBgEnter,
-      enterDone: styles.underlayBgEnterDone,
-      exit: styles.underlayBgExit
-    }
-  }, React__default.createElement("div", __spreadValues({
-    ref: underlayBgRef,
-    className: styles.underlayBg
-  }, underlayProps), React__default.createElement(CSSTransition, {
-    in: state.isOpen,
-    appear: true,
-    nodeRef: ref,
-    addEndListener: createAnimationEndListener(ref),
-    classNames: {
-      appear: styles.underlayBoxAppear,
-      appearDone: styles.underlayBoxDone,
-      exit: styles.underlayBoxExit
-    }
-  }, React__default.createElement("div", __spreadProps(__spreadValues({}, modalProps), {
-    ref,
-    className: styles.underlayBox
-  }), children)))));
+  return jsxRuntimeExports.jsx($337b884510726a0d$export$c6fdb837b070b4ff, {
+    children: jsxRuntimeExports.jsx(CSSTransition, {
+      in: state.isOpen,
+      appear: true,
+      onEntered: () => setAnimationExited(false),
+      onExited: () => setAnimationExited(true),
+      nodeRef: underlayBgRef,
+      addEndListener: createAnimationEndListener(underlayBgRef),
+      classNames: {
+        enter: styles.underlayBgEnter,
+        enterDone: styles.underlayBgEnterDone,
+        exit: styles.underlayBgExit
+      },
+      children: jsxRuntimeExports.jsx("div", __spreadProps(__spreadValues({
+        ref: underlayBgRef,
+        className: styles.underlayBg
+      }, underlayProps), {
+        children: jsxRuntimeExports.jsx(CSSTransition, {
+          in: state.isOpen,
+          appear: true,
+          nodeRef: ref,
+          addEndListener: createAnimationEndListener(ref),
+          classNames: {
+            appear: styles.underlayBoxAppear,
+            appearDone: styles.underlayBoxDone,
+            exit: styles.underlayBoxExit
+          },
+          children: jsxRuntimeExports.jsx("div", __spreadProps(__spreadValues({}, modalProps), {
+            ref,
+            className: styles.underlayBox,
+            children
+          }))
+        })
+      }))
+    })
+  });
 }
 function DrawerContainer(props) {
   const { children, isDismissable = true, onDismiss = () => {
@@ -248,37 +260,42 @@ function DrawerContainer(props) {
       isDismissable
     };
   }, [state, isDismissable]);
-  return React__default.createElement(DrawerTriggerContext.Provider, {
-    value: context
-  }, (state.isOpen || !animationExited) && React__default.createElement(DrawerUnderlay, {
-    setAnimationExited,
-    state,
-    isDismissable
-  }, lastChild ? cloneElement(lastChild, overlayProps) : null));
+  return jsxRuntimeExports.jsx(DrawerTriggerContext.Provider, {
+    value: context,
+    children: (state.isOpen || !animationExited) && jsxRuntimeExports.jsx(DrawerUnderlay, {
+      setAnimationExited,
+      state,
+      isDismissable,
+      children: lastChild ? cloneElement(lastChild, overlayProps) : null
+    })
+  });
 }
 function DrawerBanneredContentArea(props) {
   const { children } = props;
-  return React__default.createElement("div", {
-    className: styles.banneredContentArea
-  }, children);
+  return jsxRuntimeExports.jsx("div", {
+    className: styles.banneredContentArea,
+    children
+  });
 }
 function DrawerStandaloneContentArea(props) {
   const { children } = props;
-  return React__default.createElement("div", {
-    className: styles.standaloneContentArea
-  }, children);
+  return jsxRuntimeExports.jsx("div", {
+    className: styles.standaloneContentArea,
+    children
+  });
 }
 function DrawerHeader(props) {
   const { children } = props;
   const drawerContext = useDrawerContext();
   const className = classNames(styles.header, drawerContext.isHeaderStuck && styles.stuck);
-  return React__default.createElement("div", {
-    className
-  }, children);
+  return jsxRuntimeExports.jsx("div", {
+    className,
+    children
+  });
 }
 function DrawerTitle(props) {
   const drawerContext = useDrawerContext();
-  return React__default.createElement(Text, __spreadValues(__spreadValues({
+  return jsxRuntimeExports.jsx(Text, __spreadValues(__spreadValues({
     variant: "heading3"
   }, drawerContext.titleProps), props));
 }
@@ -299,13 +316,15 @@ function DrawerTrigger(props) {
       isDismissable
     };
   }, [isDismissable, state]);
-  return React__default.createElement(DrawerTriggerContext.Provider, {
-    value: context
-  }, cloneElement(trigger, triggerProps), (state.isOpen || !animationExited) && React__default.createElement(DrawerUnderlay, __spreadProps(__spreadValues({
-    setAnimationExited
-  }, props), {
-    state
-  }), cloneElement(typeof modal === "function" ? modal(state.close) : modal, overlayProps)));
+  return jsxRuntimeExports.jsxs(DrawerTriggerContext.Provider, {
+    value: context,
+    children: [cloneElement(trigger, triggerProps), (state.isOpen || !animationExited) && jsxRuntimeExports.jsx(DrawerUnderlay, __spreadProps(__spreadValues({
+      setAnimationExited
+    }, props), {
+      state,
+      children: cloneElement(typeof modal === "function" ? modal(state.close) : modal, overlayProps)
+    }))]
+  });
 }
 function useIntersectionDetection(targetRef, scrollRef) {
   const [isStuck, setIsStuck] = useState(false);
@@ -344,12 +363,14 @@ function Drawer(props) {
     };
   }, [dialogProps, isHeaderStuck, titleProps]);
   const className = classNames(styles.Drawer);
-  return React__default.createElement(DrawerContext.Provider, {
-    value: context
-  }, React__default.createElement("div", __spreadProps(__spreadValues({}, dialogProps), {
-    className,
-    ref: dialogRef
-  }), children));
+  return jsxRuntimeExports.jsx(DrawerContext.Provider, {
+    value: context,
+    children: jsxRuntimeExports.jsx("div", __spreadProps(__spreadValues({}, dialogProps), {
+      className,
+      ref: dialogRef,
+      children
+    }))
+  });
 }
 Drawer.Trigger = DrawerTrigger;
 Drawer.Header = DrawerHeader;

package/Drawer/useIntersectionDetection.d.ts

@@ -6,5 +6,5 @@ import { RefObject } from "react";
  * @param scrollRef The scroll root to check against
  * @returns when element is intersecting
  */
-export declare function useIntersectionDetection(targetRef: RefObject<HTMLDivElement>, scrollRef: RefObject<HTMLDivElement>): boolean;
+export declare function useIntersectionDetection(targetRef: RefObject<HTMLDivElement | null>, scrollRef: RefObject<HTMLDivElement | null>): boolean;
 //# sourceMappingURL=useIntersectionDetection.d.ts.map

package/Drawer/useIntersectionDetection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useIntersectionDetection.d.ts","sourceRoot":"","sources":["../../src/Drawer/useIntersectionDetection.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAuB,MAAM,OAAO,CAAC;AAEvD;;;;;;GAMG;AACH,wBAAgB,wBAAwB,CACtC,SAAS,EAAE,SAAS,CAAC,cAAc,CAAC,EACpC,SAAS,EAAE,SAAS,CAAC,cAAc,CAAC,WAwBrC"}
+{"version":3,"file":"useIntersectionDetection.d.ts","sourceRoot":"","sources":["../../src/Drawer/useIntersectionDetection.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAuB,MAAM,OAAO,CAAC;AAEvD;;;;;;GAMG;AACH,wBAAgB,wBAAwB,CACtC,SAAS,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,EAC3C,SAAS,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,WAwB5C"}