donghy 0.0.1

package/dist/esm/components/entry/upload/Upload.module.css

@@ -0,0 +1,150 @@
+.wrapper {
+  display: inline-block;
+}
+
+.hiddenInput {
+  display: none;
+}
+
+.button {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--nv-space-sm, 8px);
+  border: 1px dashed var(--nv-color-border, #d9d9d9);
+  border-radius: var(--nv-radius-lg, 8px);
+  background: var(--nv-color-bg, #ffffff);
+  color: var(--nv-color-text-secondary, rgba(0, 0, 0, 0.65));
+  font-family: inherit;
+  cursor: pointer;
+  transition: all var(--nv-motion-fast, 0.15s) ease;
+}
+
+.button:hover:not(:disabled) {
+  border-color: var(--nv-color-primary, #6c5ce7);
+  color: var(--nv-color-primary, #6c5ce7);
+}
+
+.button[data-disabled] {
+  cursor: not-allowed;
+  opacity: 0.65;
+}
+
+.button[data-size="small"] {
+  padding: var(--nv-space-xs, 4px) var(--nv-space-md, 12px);
+  font-size: var(--nv-font-size-xs, 12px);
+}
+
+.button[data-size="middle"] {
+  padding: var(--nv-space-sm, 8px) var(--nv-space-lg, 16px);
+  font-size: var(--nv-font-size-md, 14px);
+}
+
+.button[data-size="large"] {
+  padding: var(--nv-space-md, 12px) var(--nv-space-xl, 20px);
+  font-size: var(--nv-font-size-lg, 16px);
+}
+
+.icon {
+  font-size: 1.2em;
+}
+
+.dragZone {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: var(--nv-space-sm, 8px);
+  padding: var(--nv-space-xl, 24px);
+  border: 1px dashed var(--nv-color-border, #d9d9d9);
+  border-radius: var(--nv-radius-lg, 8px);
+  background: var(--nv-color-bg, #ffffff);
+  cursor: pointer;
+  transition: all var(--nv-motion-fast, 0.15s) ease;
+}
+
+.dragZone:hover:not([data-disabled]) {
+  border-color: var(--nv-color-primary, #6c5ce7);
+}
+
+.dragZone[data-drag-over] {
+  border-color: var(--nv-color-primary, #6c5ce7);
+  background: var(--nv-color-primary-bg, #f0edff);
+}
+
+.dragZone[data-disabled] {
+  cursor: not-allowed;
+  opacity: 0.65;
+}
+
+.dragIcon {
+  font-size: 32px;
+}
+
+.dragText {
+  font-size: var(--nv-font-size-md, 14px);
+  color: var(--nv-color-text-secondary, rgba(0, 0, 0, 0.65));
+}
+
+.link {
+  color: var(--nv-color-primary, #6c5ce7);
+  text-decoration: underline;
+}
+
+.fileList {
+  margin-top: var(--nv-space-md, 12px);
+}
+
+.fileItem {
+  display: flex;
+  align-items: center;
+  gap: var(--nv-space-sm, 8px);
+  padding: var(--nv-space-sm, 8px);
+  border: 1px solid var(--nv-color-border, #d9d9d9);
+  border-radius: var(--nv-radius-md, 6px);
+  margin-bottom: var(--nv-space-xxs, 2px);
+  transition: background var(--nv-motion-fast, 0.15s) ease;
+}
+
+.fileItem:hover {
+  background: var(--nv-color-bg-secondary, #f5f5f5);
+}
+
+.fileIcon {
+  font-size: 16px;
+}
+
+.fileName {
+  flex: 1;
+  font-size: var(--nv-font-size-sm, 13px);
+  color: var(--nv-color-text, rgba(0, 0, 0, 0.88));
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.filePercent {
+  font-size: var(--nv-font-size-xs, 12px);
+  color: var(--nv-color-text-tertiary, rgba(0, 0, 0, 0.45));
+}
+
+.removeBtn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 20px;
+  height: 20px;
+  border: none;
+  background: transparent;
+  color: var(--nv-color-text-tertiary, rgba(0, 0, 0, 0.45));
+  cursor: pointer;
+  border-radius: 50%;
+  font-size: 16px;
+  padding: 0;
+  transition: all var(--nv-motion-fast, 0.15s) ease;
+}
+
+.removeBtn:hover {
+  background: var(--nv-color-error, #ff4d4f);
+  color: white;
+}

package/dist/esm/components/entry/upload/index.js

@@ -0,0 +1 @@
+export { Upload } from "./Upload";

package/dist/esm/components/feedback/alert/Alert.js

@@ -0,0 +1,152 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import React, { forwardRef, useState } from 'react';
+import styles from "./Alert.module.css";
+
+/** 警告提示类型 */
+
+/** 警告提示尺寸 */
+
+/** 警告提示组件属性 */
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var DEFAULT_ICONS = {
+  success: /*#__PURE__*/_jsx("svg", {
+    viewBox: "0 0 24 24",
+    width: "1em",
+    height: "1em",
+    fill: "currentColor",
+    children: /*#__PURE__*/_jsx("path", {
+      d: "M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z"
+    })
+  }),
+  info: /*#__PURE__*/_jsx("svg", {
+    viewBox: "0 0 24 24",
+    width: "1em",
+    height: "1em",
+    fill: "currentColor",
+    children: /*#__PURE__*/_jsx("path", {
+      d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"
+    })
+  }),
+  warning: /*#__PURE__*/_jsx("svg", {
+    viewBox: "0 0 24 24",
+    width: "1em",
+    height: "1em",
+    fill: "currentColor",
+    children: /*#__PURE__*/_jsx("path", {
+      d: "M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z"
+    })
+  }),
+  error: /*#__PURE__*/_jsx("svg", {
+    viewBox: "0 0 24 24",
+    width: "1em",
+    height: "1em",
+    fill: "currentColor",
+    children: /*#__PURE__*/_jsx("path", {
+      d: "M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z"
+    })
+  })
+};
+var Alert = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var _ref$type = _ref.type,
+    type = _ref$type === void 0 ? 'info' : _ref$type,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'middle' : _ref$size,
+    title = _ref.title,
+    description = _ref.description,
+    _ref$showIcon = _ref.showIcon,
+    showIcon = _ref$showIcon === void 0 ? false : _ref$showIcon,
+    icon = _ref.icon,
+    _ref$closable = _ref.closable,
+    closable = _ref$closable === void 0 ? false : _ref$closable,
+    closeIcon = _ref.closeIcon,
+    action = _ref.action,
+    _ref$banner = _ref.banner,
+    banner = _ref$banner === void 0 ? false : _ref$banner,
+    onClose = _ref.onClose,
+    afterClose = _ref.afterClose,
+    className = _ref.className,
+    style = _ref.style;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    closed = _useState2[0],
+    setClosed = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    closing = _useState4[0],
+    setClosing = _useState4[1];
+  if (closed) {
+    return null;
+  }
+  var shouldShowIcon = showIcon || banner;
+  var handleClose = function handleClose(e) {
+    onClose === null || onClose === void 0 || onClose(e);
+    setClosing(true);
+    setTimeout(function () {
+      setClosed(true);
+      afterClose === null || afterClose === void 0 || afterClose();
+    }, 200);
+  };
+  var rootClass = [styles.root, closing ? styles.closing : '', className].filter(Boolean).join(' ');
+  var dataAttrs = {
+    'data-type': type,
+    'data-size': size,
+    'data-banner': banner || undefined,
+    'data-closable': closable || undefined,
+    'data-show-icon': shouldShowIcon || undefined
+  };
+  var iconEl = shouldShowIcon ? /*#__PURE__*/_jsx("span", {
+    className: styles.icon,
+    children: icon !== null && icon !== void 0 ? icon : DEFAULT_ICONS[type]
+  }) : null;
+  var closeBtn = closable ? /*#__PURE__*/_jsx("button", {
+    type: "button",
+    className: styles.close,
+    onClick: handleClose,
+    "aria-label": "Close",
+    children: closeIcon !== null && closeIcon !== void 0 ? closeIcon : /*#__PURE__*/_jsx("svg", {
+      viewBox: "0 0 24 24",
+      width: "1em",
+      height: "1em",
+      fill: "currentColor",
+      children: /*#__PURE__*/_jsx("path", {
+        d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z"
+      })
+    })
+  }) : null;
+  return /*#__PURE__*/_jsxs("div", _objectSpread(_objectSpread({
+    ref: ref,
+    className: rootClass,
+    style: style,
+    role: "alert",
+    "aria-live": "assertive"
+  }, dataAttrs), {}, {
+    children: [iconEl, /*#__PURE__*/_jsxs("div", {
+      className: styles.content,
+      children: [title && /*#__PURE__*/_jsx("div", {
+        className: styles.title,
+        children: title
+      }), description && /*#__PURE__*/_jsx("div", {
+        className: styles.description,
+        children: description
+      })]
+    }), action && /*#__PURE__*/_jsx("div", {
+      className: styles.action,
+      children: action
+    }), closeBtn]
+  }));
+});
+Alert.displayName = 'Alert';
+export default Alert;
+export { Alert };

package/dist/esm/components/feedback/alert/Alert.module.css

@@ -0,0 +1,131 @@
+.root {
+  display: flex;
+  align-items: flex-start;
+  gap: var(--nv-space-sm, 8px);
+  border-radius: var(--nv-radius-lg, 8px);
+  border: 1px solid;
+  padding: var(--_padding);
+  font-size: var(--nv-font-size-md, 14px);
+  line-height: var(--nv-line-height-md, 22px);
+  transition: opacity var(--nv-motion-normal, 200ms) var(--nv-motion-ease-in-out, cubic-bezier(0.65, 0, 0.35, 1)),
+              transform var(--nv-motion-normal, 200ms) var(--nv-motion-ease-in-out, cubic-bezier(0.65, 0, 0.35, 1));
+}
+
+.root[data-type="success"] {
+  background: var(--nv-color-success-bg, #F6FFED);
+  border-color: var(--nv-color-success-border, #B7EB8F);
+  color: var(--nv-color-success, #52C41A);
+}
+
+.root[data-type="info"] {
+  background: var(--nv-color-info-bg, #E6F4FF);
+  border-color: var(--nv-color-info-border, #91CAFF);
+  color: var(--nv-color-info, #4096FF);
+}
+
+.root[data-type="warning"] {
+  background: var(--nv-color-warning-bg, #FFFBE6);
+  border-color: var(--nv-color-warning-border, #FFE58F);
+  color: var(--nv-color-warning, #FAAD14);
+}
+
+.root[data-type="error"] {
+  background: var(--nv-color-error-bg, #FFF2F0);
+  border-color: var(--nv-color-error-border, #FFCCC7);
+  color: var(--nv-color-error, #FF4D4F);
+}
+
+.root[data-banner] {
+  border-radius: 0;
+  border-inline: none;
+}
+
+.root[data-size="small"] {
+  --_padding: 8px 12px;
+  --_icon-size: 16px;
+}
+
+.root[data-size="middle"] {
+  --_padding: 12px 16px;
+  --_icon-size: 20px;
+}
+
+.root[data-size="large"] {
+  --_padding: 16px 24px;
+  --_icon-size: 24px;
+}
+
+.icon {
+  display: inline-flex;
+  font-size: var(--_icon-size);
+  line-height: 1;
+  flex-shrink: 0;
+  margin-top: 1px;
+}
+
+.root[data-type="success"] .icon {
+  color: var(--nv-color-success, #52C41A);
+}
+
+.root[data-type="info"] .icon {
+  color: var(--nv-color-info, #4096FF);
+}
+
+.root[data-type="warning"] .icon {
+  color: var(--nv-color-warning, #FAAD14);
+}
+
+.root[data-type="error"] .icon {
+  color: var(--nv-color-error, #FF4D4F);
+}
+
+.content {
+  flex: 1;
+  min-width: 0;
+}
+
+.title {
+  font-weight: var(--nv-font-weight-medium, 500);
+  font-size: var(--nv-font-size-md, 14px);
+  line-height: var(--nv-line-height-md, 22px);
+  color: var(--nv-color-text, rgba(0, 0, 0, 0.88));
+}
+
+.description {
+  font-size: var(--nv-font-size-sm, 13px);
+  line-height: var(--nv-line-height-sm, 22px);
+  color: var(--nv-color-text-secondary, rgba(0, 0, 0, 0.65));
+  margin-top: var(--nv-space-xs, 4px);
+}
+
+.close {
+  cursor: pointer;
+  background: none;
+  border: none;
+  font-size: 14px;
+  color: var(--nv-color-text-tertiary, rgba(0, 0, 0, 0.45));
+  padding: 0;
+  line-height: 1;
+  flex-shrink: 0;
+  margin-top: 2px;
+  transition: color var(--nv-motion-fast, 100ms);
+}
+
+.close:hover {
+  color: var(--nv-color-text-secondary, rgba(0, 0, 0, 0.65));
+}
+
+.action {
+  flex-shrink: 0;
+  margin-left: var(--nv-space-sm, 8px);
+}
+
+.root[data-closable] .content {
+  padding-right: var(--nv-space-sm, 8px);
+}
+
+.closing {
+  opacity: 0;
+  transform: scaleY(0.9);
+  transform-origin: top;
+}

package/dist/esm/components/feedback/alert/index.js

@@ -0,0 +1 @@
+export { Alert } from "./Alert";

package/dist/esm/components/feedback/drawer/Drawer.js

@@ -0,0 +1,190 @@
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import React, { forwardRef, useEffect, useCallback, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
+import { useEscapeKey } from "../../shared/hooks/useEscapeKey";
+import styles from "./Drawer.module.css";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+var SIZE_MAP = {
+  small: 378,
+  middle: 480,
+  large: 736
+};
+var Drawer = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var _SIZE_MAP$size;
+  var _ref$open = _ref.open,
+    open = _ref$open === void 0 ? false : _ref$open,
+    title = _ref.title,
+    footer = _ref.footer,
+    _ref$placement = _ref.placement,
+    placement = _ref$placement === void 0 ? 'right' : _ref$placement,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'middle' : _ref$size,
+    width = _ref.width,
+    height = _ref.height,
+    _ref$closable = _ref.closable,
+    closable = _ref$closable === void 0 ? true : _ref$closable,
+    closeIcon = _ref.closeIcon,
+    _ref$mask = _ref.mask,
+    mask = _ref$mask === void 0 ? true : _ref$mask,
+    _ref$maskClosable = _ref.maskClosable,
+    maskClosable = _ref$maskClosable === void 0 ? true : _ref$maskClosable,
+    _ref$keyboard = _ref.keyboard,
+    keyboard = _ref$keyboard === void 0 ? true : _ref$keyboard,
+    _ref$loading = _ref.loading,
+    loading = _ref$loading === void 0 ? false : _ref$loading,
+    extra = _ref.extra,
+    _ref$destroyOnClose = _ref.destroyOnClose,
+    destroyOnClose = _ref$destroyOnClose === void 0 ? false : _ref$destroyOnClose,
+    _ref$forceRender = _ref.forceRender,
+    forceRender = _ref$forceRender === void 0 ? false : _ref$forceRender,
+    _ref$push = _ref.push,
+    push = _ref$push === void 0 ? false : _ref$push,
+    getContainer = _ref.getContainer,
+    zIndex = _ref.zIndex,
+    onClose = _ref.onClose,
+    afterOpenChange = _ref.afterOpenChange,
+    className = _ref.className,
+    style = _ref.style,
+    children = _ref.children;
+  var prevOpenRef = useRef(open);
+  var _useState = useState(open || forceRender),
+    _useState2 = _slicedToArray(_useState, 2),
+    rendered = _useState2[0],
+    setRendered = _useState2[1];
+  var resolvedSize = (_SIZE_MAP$size = SIZE_MAP[size]) !== null && _SIZE_MAP$size !== void 0 ? _SIZE_MAP$size : 480;
+  var isHorizontal = placement === 'left' || placement === 'right';
+  var customDimension = isHorizontal ? width : height;
+  var dimensionValue = customDimension !== undefined ? typeof customDimension === 'number' ? "".concat(customDimension, "px") : customDimension : "".concat(resolvedSize, "px");
+  var pushDistance = function () {
+    if (!push) return 0;
+    if (_typeof(push) === 'object') {
+      var _push$distance;
+      var d = (_push$distance = push.distance) !== null && _push$distance !== void 0 ? _push$distance : 180;
+      return typeof d === 'number' ? d : parseInt(String(d), 10) || 180;
+    }
+    return 180;
+  }();
+  useEffect(function () {
+    if (open) {
+      setRendered(true);
+    }
+  }, [open]);
+  useEffect(function () {
+    if (!open && destroyOnClose) {
+      setRendered(false);
+    }
+  }, [open, destroyOnClose]);
+  useEffect(function () {
+    if (prevOpenRef.current !== open) {
+      afterOpenChange === null || afterOpenChange === void 0 || afterOpenChange(open);
+      prevOpenRef.current = open;
+    }
+  }, [open, afterOpenChange]);
+  useEscapeKey(function () {
+    return onClose === null || onClose === void 0 ? void 0 : onClose({});
+  }, keyboard && open);
+  var handleMaskClick = useCallback(function (e) {
+    if (maskClosable && e.target === e.currentTarget) {
+      onClose === null || onClose === void 0 || onClose(e);
+    }
+  }, [maskClosable, onClose]);
+  var handleClose = useCallback(function (e) {
+    onClose === null || onClose === void 0 || onClose(e);
+  }, [onClose]);
+  var container = function () {
+    if (getContainer === false) return null;
+    if (getContainer === undefined) return document.body;
+    if (typeof getContainer === 'function') return getContainer();
+    return getContainer;
+  }();
+  var pushOffset = function () {
+    if (!pushDistance || !open) return {};
+    switch (placement) {
+      case 'right':
+        return {
+          transform: "translateX(-".concat(pushDistance, "px)")
+        };
+      case 'left':
+        return {
+          transform: "translateX(".concat(pushDistance, "px)")
+        };
+      case 'top':
+        return {
+          transform: "translateY(".concat(pushDistance, "px)")
+        };
+      case 'bottom':
+        return {
+          transform: "translateY(-".concat(pushDistance, "px)")
+        };
+      default:
+        return {};
+    }
+  }();
+  var wrapperStyle = _objectSpread(_objectSpread({
+    '--_drawer-size': dimensionValue
+  }, zIndex !== undefined ? {
+    zIndex: zIndex
+  } : {}), style);
+  if (!rendered && !open) return null;
+  var node = /*#__PURE__*/_jsxs(_Fragment, {
+    children: [mask && /*#__PURE__*/_jsx("div", {
+      className: styles.mask,
+      "data-open": open || undefined,
+      onClick: handleMaskClick
+    }), /*#__PURE__*/_jsx("div", {
+      ref: ref,
+      className: [styles.wrapper, className].filter(Boolean).join(' '),
+      style: wrapperStyle,
+      "data-open": open || undefined,
+      "data-placement": placement,
+      role: "dialog",
+      "aria-modal": "true",
+      children: /*#__PURE__*/_jsxs("div", {
+        className: styles.panel,
+        style: pushOffset,
+        children: [(title || closable || extra) && /*#__PURE__*/_jsxs("div", {
+          className: styles.header,
+          children: [title && /*#__PURE__*/_jsx("div", {
+            className: styles.title,
+            children: title
+          }), extra && /*#__PURE__*/_jsx("div", {
+            className: styles.extra,
+            children: extra
+          }), closable && /*#__PURE__*/_jsx("button", {
+            className: styles.close,
+            onClick: handleClose,
+            type: "button",
+            "data-drawer-close": true,
+            children: closeIcon !== null && closeIcon !== void 0 ? closeIcon : '✕'
+          })]
+        }), /*#__PURE__*/_jsx("div", {
+          className: styles.body,
+          children: loading ? /*#__PURE__*/_jsx("div", {
+            "data-drawer-loading": true
+          }) : children
+        }), footer !== undefined && footer !== null && /*#__PURE__*/_jsx("div", {
+          className: styles.footer,
+          children: footer
+        })]
+      })
+    })]
+  });
+  if (container === null) return node;
+  return /*#__PURE__*/createPortal(node, container);
+});
+Drawer.displayName = 'Drawer';
+export { Drawer };
+export default Drawer;