@fangxinyan/lumina 0.1.5 → 0.1.6

package/dist/Drawer-IPGB4CXH.css

@@ -0,0 +1,101 @@
+/* ============ Drawer ============ */
+.drawer-overlay {
+  position: fixed;
+  inset: 0;
+  background: color-mix(in oklch, var(--bg-sunken) 50%, transparent);
+  backdrop-filter: blur(4px);
+  z-index: 150;
+  animation: fadeIn var(--dur) var(--ease);
+}
+.drawer-overlay.hidden {
+  display: none;
+}
+
+.drawer {
+  position: fixed;
+  background: var(--bg);
+  padding: var(--gap-5);
+  z-index: 151;
+  overflow-y: auto;
+  display: flex;
+  flex-direction: column;
+}
+.drawer.hidden {
+  display: none;
+}
+
+.drawer.right {
+  top: 0; right: 0; bottom: 0;
+  width: min(420px, 92vw);
+  animation: drawerInRight var(--dur-slow) var(--ease);
+  box-shadow: -24px 0 60px -20px rgba(40, 55, 80, 0.25);
+}
+.drawer.left {
+  top: 0; left: 0; bottom: 0;
+  width: min(420px, 92vw);
+  animation: drawerInLeft var(--dur-slow) var(--ease);
+  box-shadow: 24px 0 60px -20px rgba(40, 55, 80, 0.25);
+}
+.drawer.top {
+  top: 0; left: 0; right: 0;
+  height: min(320px, 80vh);
+  animation: drawerInTop var(--dur-slow) var(--ease);
+  box-shadow: 0 24px 60px -20px rgba(40, 55, 80, 0.25);
+}
+.drawer.bottom {
+  bottom: 0; left: 0; right: 0;
+  height: min(320px, 80vh);
+  animation: drawerInBottom var(--dur-slow) var(--ease);
+  box-shadow: 0 -24px 60px -20px rgba(40, 55, 80, 0.25);
+}
+
+@keyframes drawerInRight  { from { transform: translateX( 20px); opacity: 0; } }
+@keyframes drawerInLeft   { from { transform: translateX(-20px); opacity: 0; } }
+@keyframes drawerInTop    { from { transform: translateY(-20px); opacity: 0; } }
+@keyframes drawerInBottom { from { transform: translateY( 20px); opacity: 0; } }
+
+.drawer-head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--gap-3);
+  margin-bottom: var(--gap-4);
+  padding-bottom: var(--gap-4);
+  border-bottom: 1px solid var(--divider);
+}
+.drawer-head-right {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--gap-3);
+}
+.drawer-title {
+  font-size: 16px;
+  font-weight: 600;
+}
+.drawer-close {
+  width: 28px; height: 28px;
+  border: none;
+  background: transparent;
+  border-radius: var(--r-sm);
+  display: grid;
+  place-items: center;
+  color: var(--fg-subtle);
+  cursor: pointer;
+  transition: all var(--dur-fast) var(--ease);
+}
+.drawer-close:hover {
+  color: var(--fg);
+  background: var(--bg);
+  box-shadow: var(--neu-flat);
+}
+.drawer-body {
+  flex: 1;
+}
+.drawer-foot {
+  display: flex;
+  gap: 10px;
+  justify-content: flex-end;
+  margin-top: var(--gap-4);
+  padding-top: var(--gap-4);
+  border-top: 1px solid var(--divider);
+}

package/dist/Drawer.cjs

@@ -0,0 +1,13 @@
+'use strict';
+
+var chunkAEJJGUEN_cjs = require('./chunk-AEJJGUEN.cjs');
+require('./chunk-YVO7XO4W.cjs');
+
+
+
+Object.defineProperty(exports, "Drawer", {
+  enumerable: true,
+  get: function () { return chunkAEJJGUEN_cjs.Drawer; }
+});
+//# sourceMappingURL=Drawer.cjs.map
+//# sourceMappingURL=Drawer.cjs.map

package/dist/Drawer.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"Drawer.cjs"}

package/dist/Drawer.d.cts

@@ -0,0 +1,45 @@
+import * as React from 'react';
+
+interface DrawerProps {
+    /** Whether the drawer is visible. */
+    open: boolean;
+    /** Close callback (triggered by mask click / close button / Esc). */
+    onClose?: () => void;
+    /** Which edge the drawer slides from. */
+    placement?: "left" | "right" | "top" | "bottom";
+    /** Width (for left/right) or height (for top/bottom). Number → px. */
+    size?: number | string;
+    /** Header title. */
+    title?: React.ReactNode;
+    /** Extra content rendered to the right of the title (e.g. action buttons). */
+    extra?: React.ReactNode;
+    /** Footer content. */
+    footer?: React.ReactNode;
+    /** Drawer body. */
+    children?: React.ReactNode;
+    /** Render the mask overlay. Default true. Set `false` for a non-blocking drawer. */
+    mask?: boolean;
+    /** Close when clicking the mask. Default true. Ignored when `mask` is false. */
+    maskClosable?: boolean;
+    /** Close on Escape key. Default true. */
+    keyboard?: boolean;
+    /** Show the close (×) button in the header. Default true. */
+    closable?: boolean;
+    /** Override the close icon node. */
+    closeIcon?: React.ReactNode;
+    /**
+     * When true the drawer's children are unmounted every time it closes.
+     * Default `false` — children stay mounted across open/close cycles so
+     * internal state (form fields, scroll position) is preserved.
+     */
+    destroyOnClose?: boolean;
+    /** Fires after the open/close animation finishes. */
+    afterOpenChange?: (open: boolean) => void;
+    /** Stack index for nested drawers. */
+    zIndex?: number;
+    className?: string;
+}
+/** `Drawer` — slide-in panel from an edge. */
+declare const Drawer: React.FC<DrawerProps>;
+
+export { Drawer, type DrawerProps };

package/dist/Drawer.d.ts

@@ -0,0 +1,45 @@
+import * as React from 'react';
+
+interface DrawerProps {
+    /** Whether the drawer is visible. */
+    open: boolean;
+    /** Close callback (triggered by mask click / close button / Esc). */
+    onClose?: () => void;
+    /** Which edge the drawer slides from. */
+    placement?: "left" | "right" | "top" | "bottom";
+    /** Width (for left/right) or height (for top/bottom). Number → px. */
+    size?: number | string;
+    /** Header title. */
+    title?: React.ReactNode;
+    /** Extra content rendered to the right of the title (e.g. action buttons). */
+    extra?: React.ReactNode;
+    /** Footer content. */
+    footer?: React.ReactNode;
+    /** Drawer body. */
+    children?: React.ReactNode;
+    /** Render the mask overlay. Default true. Set `false` for a non-blocking drawer. */
+    mask?: boolean;
+    /** Close when clicking the mask. Default true. Ignored when `mask` is false. */
+    maskClosable?: boolean;
+    /** Close on Escape key. Default true. */
+    keyboard?: boolean;
+    /** Show the close (×) button in the header. Default true. */
+    closable?: boolean;
+    /** Override the close icon node. */
+    closeIcon?: React.ReactNode;
+    /**
+     * When true the drawer's children are unmounted every time it closes.
+     * Default `false` — children stay mounted across open/close cycles so
+     * internal state (form fields, scroll position) is preserved.
+     */
+    destroyOnClose?: boolean;
+    /** Fires after the open/close animation finishes. */
+    afterOpenChange?: (open: boolean) => void;
+    /** Stack index for nested drawers. */
+    zIndex?: number;
+    className?: string;
+}
+/** `Drawer` — slide-in panel from an edge. */
+declare const Drawer: React.FC<DrawerProps>;
+
+export { Drawer, type DrawerProps };

package/dist/Drawer.js

@@ -0,0 +1,4 @@
+export { Drawer } from './chunk-IWVKITPN.js';
+import './chunk-GEYMWUW6.js';
+//# sourceMappingURL=Drawer.js.map
+//# sourceMappingURL=Drawer.js.map

package/dist/Drawer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"Drawer.js"}

package/dist/Modal-N4YVLEWW.css

@@ -0,0 +1,72 @@
+/* ============ Modal ============ */
+.modal-overlay {
+  position: fixed;
+  inset: 0;
+  background: color-mix(in oklch, var(--bg-sunken) 60%, transparent);
+  backdrop-filter: blur(8px);
+  display: grid;
+  place-items: center;
+  z-index: 200;
+  animation: fadeIn var(--dur) var(--ease);
+}
+.modal-overlay.hidden {
+  display: none;
+}
+.modal {
+  background: var(--bg);
+  border-radius: var(--r-xl);
+  box-shadow: var(--neu-out-lg), 0 24px 60px -20px rgba(40, 55, 80, 0.3);
+  padding: var(--gap-6);
+  width: min(480px, 92vw);
+  animation: modalIn var(--dur-slow) var(--ease);
+  max-height: 86vh;
+  display: flex;
+  flex-direction: column;
+}
+@keyframes modalIn {
+  from { opacity: 0; transform: translateY(8px) scale(0.97); }
+}
+.modal-head {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: var(--gap-3);
+  margin-bottom: var(--gap-3);
+}
+.modal-titles {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+.modal-title { font-size: 17px; font-weight: 600; }
+.modal-desc  { font-size: 13px; color: var(--fg-muted); }
+.modal-body {
+  padding: var(--gap-3) 0;
+  color: var(--fg-muted);
+  font-size: 13px;
+  line-height: 1.6;
+  flex: 1;
+  overflow-y: auto;
+}
+.modal-foot {
+  display: flex;
+  gap: 10px;
+  justify-content: flex-end;
+  margin-top: var(--gap-4);
+}
+.modal-close {
+  width: 28px; height: 28px;
+  border: none;
+  background: transparent;
+  border-radius: var(--r-sm);
+  display: grid;
+  place-items: center;
+  color: var(--fg-subtle);
+  cursor: pointer;
+  transition: all var(--dur-fast) var(--ease);
+}
+.modal-close:hover {
+  color: var(--fg);
+  background: var(--bg);
+  box-shadow: var(--neu-flat);
+}

package/dist/Modal.cjs

@@ -1,18 +1,14 @@
 'use strict';
 
-var chunkKF4MCHZL_cjs = require('./chunk-KF4MCHZL.cjs');
+var chunkQQXIWOI3_cjs = require('./chunk-QQXIWOI3.cjs');
 require('./chunk-AAMYURWQ.cjs');
 require('./chunk-YVO7XO4W.cjs');
 
 
 
-Object.defineProperty(exports, "Drawer", {
-  enumerable: true,
-  get: function () { return chunkKF4MCHZL_cjs.Drawer; }
-});
 Object.defineProperty(exports, "Modal", {
   enumerable: true,
-  get: function () { return chunkKF4MCHZL_cjs.Modal; }
+  get: function () { return chunkQQXIWOI3_cjs.Modal; }
 });
 //# sourceMappingURL=Modal.cjs.map
 //# sourceMappingURL=Modal.cjs.map

package/dist/Modal.d.cts

@@ -1,27 +1,56 @@
 import * as React from 'react';
+import { ButtonProps } from './Button.cjs';
+import './Icon.cjs';
 
 interface ModalProps {
+    /** Whether the modal is visible. */
     open: boolean;
+    /** Fired by mask click / close button / Esc. Also the fallback for cancel. */
     onClose?: () => void;
+    /** Dedicated Cancel callback. Falls back to `onClose` when omitted. */
+    onCancel?: () => void;
+    /** Fired when the default OK button is clicked. */
+    onOk?: () => void;
     title?: React.ReactNode;
     description?: React.ReactNode;
+    /**
+     * Footer content. Pass `null` to hide the footer, or a custom node to
+     * replace the default OK / Cancel buttons.
+     */
     footer?: React.ReactNode;
     children?: React.ReactNode;
     width?: number | string;
+    /** Show the close (×) button. Default true. */
+    closable?: boolean;
+    /** Override the close icon node. */
+    closeIcon?: React.ReactNode;
     /** Close when clicking the mask. Default true. */
     maskClosable?: boolean;
     /** Close on Escape key. Default true. */
     escClosable?: boolean;
+    /** Label for the default OK button. */
+    okText?: React.ReactNode;
+    /** Label for the default Cancel button. */
+    cancelText?: React.ReactNode;
+    /** Extra props forwarded to the default OK button. */
+    okButtonProps?: Partial<ButtonProps>;
+    /** Extra props forwarded to the default Cancel button. */
+    cancelButtonProps?: Partial<ButtonProps>;
+    /** Show a spinner on the OK button (e.g. while an async submit is running). */
+    confirmLoading?: boolean;
+    /**
+     * When true the modal's children are unmounted every time it closes.
+     * Default `false` — children stay mounted so internal state survives
+     * reopens, matching antd's default.
+     */
+    destroyOnClose?: boolean;
+    /** Fires after the open/close animation finishes. */
+    afterOpenChange?: (open: boolean) => void;
+    /** Override the z-index of the overlay. */
+    zIndex?: number;
     className?: string;
 }
 /** `Modal` — centered dialog with mask. Renders into `document.body`. */
 declare const Modal: React.FC<ModalProps>;
-interface DrawerProps extends Omit<ModalProps, "width"> {
-    /** Edge the drawer slides from. */
-    placement?: "left" | "right" | "top" | "bottom";
-    size?: number | string;
-}
-/** `Drawer` — slide-in panel from an edge. */
-declare const Drawer: React.FC<DrawerProps>;
 
-export { Drawer, type DrawerProps, Modal, type ModalProps };
+export { Modal, type ModalProps };

package/dist/Modal.d.ts

@@ -1,27 +1,56 @@
 import * as React from 'react';
+import { ButtonProps } from './Button.js';
+import './Icon.js';
 
 interface ModalProps {
+    /** Whether the modal is visible. */
     open: boolean;
+    /** Fired by mask click / close button / Esc. Also the fallback for cancel. */
     onClose?: () => void;
+    /** Dedicated Cancel callback. Falls back to `onClose` when omitted. */
+    onCancel?: () => void;
+    /** Fired when the default OK button is clicked. */
+    onOk?: () => void;
     title?: React.ReactNode;
     description?: React.ReactNode;
+    /**
+     * Footer content. Pass `null` to hide the footer, or a custom node to
+     * replace the default OK / Cancel buttons.
+     */
     footer?: React.ReactNode;
     children?: React.ReactNode;
     width?: number | string;
+    /** Show the close (×) button. Default true. */
+    closable?: boolean;
+    /** Override the close icon node. */
+    closeIcon?: React.ReactNode;
     /** Close when clicking the mask. Default true. */
     maskClosable?: boolean;
     /** Close on Escape key. Default true. */
     escClosable?: boolean;
+    /** Label for the default OK button. */
+    okText?: React.ReactNode;
+    /** Label for the default Cancel button. */
+    cancelText?: React.ReactNode;
+    /** Extra props forwarded to the default OK button. */
+    okButtonProps?: Partial<ButtonProps>;
+    /** Extra props forwarded to the default Cancel button. */
+    cancelButtonProps?: Partial<ButtonProps>;
+    /** Show a spinner on the OK button (e.g. while an async submit is running). */
+    confirmLoading?: boolean;
+    /**
+     * When true the modal's children are unmounted every time it closes.
+     * Default `false` — children stay mounted so internal state survives
+     * reopens, matching antd's default.
+     */
+    destroyOnClose?: boolean;
+    /** Fires after the open/close animation finishes. */
+    afterOpenChange?: (open: boolean) => void;
+    /** Override the z-index of the overlay. */
+    zIndex?: number;
     className?: string;
 }
 /** `Modal` — centered dialog with mask. Renders into `document.body`. */
 declare const Modal: React.FC<ModalProps>;
-interface DrawerProps extends Omit<ModalProps, "width"> {
-    /** Edge the drawer slides from. */
-    placement?: "left" | "right" | "top" | "bottom";
-    size?: number | string;
-}
-/** `Drawer` — slide-in panel from an edge. */
-declare const Drawer: React.FC<DrawerProps>;
 
-export { Drawer, type DrawerProps, Modal, type ModalProps };
+export { Modal, type ModalProps };

package/dist/Modal.js

@@ -1,4 +1,4 @@
-export { Drawer, Modal } from './chunk-Q33V7MSK.js';
+export { Modal } from './chunk-OOBSH7EL.js';
 import './chunk-5EYI27B6.js';
 import './chunk-GEYMWUW6.js';
 //# sourceMappingURL=Modal.js.map

package/dist/chunk-AEJJGUEN.cjs

@@ -0,0 +1,127 @@
+'use strict';
+
+var chunkYVO7XO4W_cjs = require('./chunk-YVO7XO4W.cjs');
+require('./tokens-HWQ7KWPG.css');
+require('./shared-NJHRNLRH.css');
+require('./Drawer-IPGB4CXH.css');
+var React = require('react');
+var ReactDOM = require('react-dom');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var ReactDOM__default = /*#__PURE__*/_interopDefault(ReactDOM);
+
+var ANIM_MS = 280;
+var Drawer = ({
+  open,
+  onClose,
+  placement = "right",
+  size = 380,
+  title,
+  extra,
+  footer,
+  children,
+  mask = true,
+  maskClosable = true,
+  keyboard = true,
+  closable = true,
+  closeIcon,
+  destroyOnClose = false,
+  afterOpenChange,
+  zIndex,
+  className = ""
+}) => {
+  const [hasOpenedOnce, setHasOpenedOnce] = React__namespace.useState(open);
+  React__namespace.useEffect(() => {
+    if (open) setHasOpenedOnce(true);
+  }, [open]);
+  React__namespace.useEffect(() => {
+    if (!open || !keyboard) return;
+    const h = (e) => e.key === "Escape" && onClose?.();
+    window.addEventListener("keydown", h);
+    return () => window.removeEventListener("keydown", h);
+  }, [open, keyboard, onClose]);
+  const prevOpen = React__namespace.useRef(open);
+  React__namespace.useEffect(() => {
+    if (prevOpen.current !== open) {
+      prevOpen.current = open;
+      if (afterOpenChange) {
+        const id = window.setTimeout(() => afterOpenChange(open), ANIM_MS);
+        return () => window.clearTimeout(id);
+      }
+    }
+  }, [open, afterOpenChange]);
+  if (typeof document === "undefined") return null;
+  if (!hasOpenedOnce) return null;
+  if (!open && destroyOnClose) return null;
+  const isV = placement === "left" || placement === "right";
+  const style = isV ? { width: size } : { height: size };
+  if (zIndex != null) style.zIndex = zIndex;
+  return ReactDOM__default.default.createPortal(
+    /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      mask && /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: `drawer-overlay ${open ? "" : "hidden"}`,
+          style: zIndex != null ? { zIndex: zIndex - 1 } : void 0,
+          onClick: () => maskClosable && onClose?.()
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          className: `drawer ${placement} ${open ? "" : "hidden"} ${className}`,
+          style,
+          onClick: (e) => e.stopPropagation(),
+          role: "dialog",
+          "aria-hidden": !open,
+          children: [
+            (title || extra || closable) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "drawer-head", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "drawer-title", children: title }),
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "drawer-head-right", children: [
+                extra,
+                closable && /* @__PURE__ */ jsxRuntime.jsx(
+                  "button",
+                  {
+                    type: "button",
+                    className: "drawer-close",
+                    onClick: onClose,
+                    "aria-label": "Close",
+                    children: closeIcon ?? /* @__PURE__ */ jsxRuntime.jsx(chunkYVO7XO4W_cjs.Icon, { name: "x", size: 16 })
+                  }
+                )
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "drawer-body", children }),
+            footer && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "drawer-foot", children: footer })
+          ]
+        }
+      )
+    ] }),
+    document.body
+  );
+};
+
+exports.Drawer = Drawer;
+//# sourceMappingURL=chunk-AEJJGUEN.cjs.map
+//# sourceMappingURL=chunk-AEJJGUEN.cjs.map

package/dist/chunk-AEJJGUEN.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Drawer/Drawer.tsx"],"names":["React","ReactDOM","jsxs","Fragment","jsx","Icon"],"mappings":"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","file":"chunk-AEJJGUEN.cjs","sourcesContent":["import \"../../styles/tokens.css\";\nimport \"../../styles/shared.css\";\nimport \"./Drawer.css\";\nimport * as React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport { Icon } from \"../Icon\";\n\nexport interface DrawerProps {\n  /** Whether the drawer is visible. */\n  open: boolean;\n  /** Close callback (triggered by mask click / close button / Esc). */\n  onClose?: () => void;\n  /** Which edge the drawer slides from. */\n  placement?: \"left\" | \"right\" | \"top\" | \"bottom\";\n  /** Width (for left/right) or height (for top/bottom). Number → px. */\n  size?: number | string;\n  /** Header title. */\n  title?: React.ReactNode;\n  /** Extra content rendered to the right of the title (e.g. action buttons). */\n  extra?: React.ReactNode;\n  /** Footer content. */\n  footer?: React.ReactNode;\n  /** Drawer body. */\n  children?: React.ReactNode;\n  /** Render the mask overlay. Default true. Set `false` for a non-blocking drawer. */\n  mask?: boolean;\n  /** Close when clicking the mask. Default true. Ignored when `mask` is false. */\n  maskClosable?: boolean;\n  /** Close on Escape key. Default true. */\n  keyboard?: boolean;\n  /** Show the close (×) button in the header. Default true. */\n  closable?: boolean;\n  /** Override the close icon node. */\n  closeIcon?: React.ReactNode;\n  /**\n   * When true the drawer's children are unmounted every time it closes.\n   * Default `false` — children stay mounted across open/close cycles so\n   * internal state (form fields, scroll position) is preserved.\n   */\n  destroyOnClose?: boolean;\n  /** Fires after the open/close animation finishes. */\n  afterOpenChange?: (open: boolean) => void;\n  /** Stack index for nested drawers. */\n  zIndex?: number;\n  className?: string;\n}\n\nconst ANIM_MS = 280;\n\n/** `Drawer` — slide-in panel from an edge. */\nexport const Drawer: React.FC<DrawerProps> = ({\n  open,\n  onClose,\n  placement = \"right\",\n  size = 380,\n  title,\n  extra,\n  footer,\n  children,\n  mask = true,\n  maskClosable = true,\n  keyboard = true,\n  closable = true,\n  closeIcon,\n  destroyOnClose = false,\n  afterOpenChange,\n  zIndex,\n  className = \"\",\n}) => {\n  const [hasOpenedOnce, setHasOpenedOnce] = React.useState(open);\n  React.useEffect(() => {\n    if (open) setHasOpenedOnce(true);\n  }, [open]);\n\n  React.useEffect(() => {\n    if (!open || !keyboard) return;\n    const h = (e: KeyboardEvent) => e.key === \"Escape\" && onClose?.();\n    window.addEventListener(\"keydown\", h);\n    return () => window.removeEventListener(\"keydown\", h);\n  }, [open, keyboard, onClose]);\n\n  const prevOpen = React.useRef(open);\n  React.useEffect(() => {\n    if (prevOpen.current !== open) {\n      prevOpen.current = open;\n      if (afterOpenChange) {\n        const id = window.setTimeout(() => afterOpenChange(open), ANIM_MS);\n        return () => window.clearTimeout(id);\n      }\n    }\n  }, [open, afterOpenChange]);\n\n  if (typeof document === \"undefined\") return null;\n  if (!hasOpenedOnce) return null;\n  if (!open && destroyOnClose) return null;\n\n  const isV = placement === \"left\" || placement === \"right\";\n  const style: React.CSSProperties = isV ? { width: size } : { height: size };\n  if (zIndex != null) style.zIndex = zIndex;\n\n  return ReactDOM.createPortal(\n    <>\n      {mask && (\n        <div\n          className={`drawer-overlay ${open ? \"\" : \"hidden\"}`}\n          style={zIndex != null ? { zIndex: zIndex - 1 } : undefined}\n          onClick={() => maskClosable && onClose?.()}\n        />\n      )}\n      <div\n        className={`drawer ${placement} ${open ? \"\" : \"hidden\"} ${className}`}\n        style={style}\n        onClick={(e) => e.stopPropagation()}\n        role=\"dialog\"\n        aria-hidden={!open}\n      >\n        {(title || extra || closable) && (\n          <div className=\"drawer-head\">\n            <div className=\"drawer-title\">{title}</div>\n            <div className=\"drawer-head-right\">\n              {extra}\n              {closable && (\n                <button\n                  type=\"button\"\n                  className=\"drawer-close\"\n                  onClick={onClose}\n                  aria-label=\"Close\"\n                >\n                  {closeIcon ?? <Icon name=\"x\" size={16} />}\n                </button>\n              )}\n            </div>\n          </div>\n        )}\n        <div className=\"drawer-body\">{children}</div>\n        {footer && <div className=\"drawer-foot\">{footer}</div>}\n      </div>\n    </>,\n    document.body\n  );\n};\n"]}