You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
InternshipProject/node_modules/antd/lib/drawer/index.js

313 lines
11 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var React = _interopRequireWildcard(require("react"));
var _rcDrawer = _interopRequireDefault(require("rc-drawer"));
var _CloseOutlined = _interopRequireDefault(require("@ant-design/icons/CloseOutlined"));
var _classnames = _interopRequireDefault(require("classnames"));
var _configProvider = require("../config-provider");
var _type = require("../_util/type");
var _useForceUpdate = _interopRequireDefault(require("../_util/hooks/useForceUpdate"));
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
var __rest = void 0 && (void 0).__rest || function (s, e) {
var t = {};
for (var p in s) {
if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
}
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
}
return t;
};
var DrawerContext = /*#__PURE__*/React.createContext(null);
var PlacementTypes = (0, _type.tuple)('top', 'right', 'bottom', 'left');
var SizeTypes = (0, _type.tuple)('default', 'large');
var defaultPushState = {
distance: 180
};
var Drawer = /*#__PURE__*/React.forwardRef(function (_a, ref) {
var width = _a.width,
height = _a.height,
_a$size = _a.size,
size = _a$size === void 0 ? 'default' : _a$size,
_a$closable = _a.closable,
closable = _a$closable === void 0 ? true : _a$closable,
_a$placement = _a.placement,
placement = _a$placement === void 0 ? 'right' : _a$placement,
_a$maskClosable = _a.maskClosable,
maskClosable = _a$maskClosable === void 0 ? true : _a$maskClosable,
_a$mask = _a.mask,
mask = _a$mask === void 0 ? true : _a$mask,
_a$level = _a.level,
level = _a$level === void 0 ? null : _a$level,
_a$keyboard = _a.keyboard,
keyboard = _a$keyboard === void 0 ? true : _a$keyboard,
_a$push = _a.push,
_push = _a$push === void 0 ? defaultPushState : _a$push,
_a$closeIcon = _a.closeIcon,
closeIcon = _a$closeIcon === void 0 ? /*#__PURE__*/React.createElement(_CloseOutlined["default"], null) : _a$closeIcon,
bodyStyle = _a.bodyStyle,
drawerStyle = _a.drawerStyle,
prefixCls = _a.prefixCls,
className = _a.className,
direction = _a.direction,
visible = _a.visible,
children = _a.children,
zIndex = _a.zIndex,
destroyOnClose = _a.destroyOnClose,
style = _a.style,
title = _a.title,
headerStyle = _a.headerStyle,
onClose = _a.onClose,
footer = _a.footer,
footerStyle = _a.footerStyle,
extra = _a.extra,
rest = __rest(_a, ["width", "height", "size", "closable", "placement", "maskClosable", "mask", "level", "keyboard", "push", "closeIcon", "bodyStyle", "drawerStyle", "prefixCls", "className", "direction", "visible", "children", "zIndex", "destroyOnClose", "style", "title", "headerStyle", "onClose", "footer", "footerStyle", "extra"]);
var forceUpdate = (0, _useForceUpdate["default"])();
var _React$useState = React.useState(false),
_React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
internalPush = _React$useState2[0],
setPush = _React$useState2[1];
var parentDrawer = React.useContext(DrawerContext);
var destroyClose = React.useRef(false);
React.useEffect(function () {
// fix: delete drawer in child and re-render, no push started.
// <Drawer>{show && <Drawer />}</Drawer>
if (visible && parentDrawer) {
parentDrawer.push();
}
return function () {
if (parentDrawer) {
parentDrawer.pull(); // parentDrawer = null;
}
};
}, []);
React.useEffect(function () {
if (parentDrawer) {
if (visible) {
parentDrawer.push();
} else {
parentDrawer.pull();
}
}
}, [visible]);
var operations = React.useMemo(function () {
return {
push: function push() {
if (_push) {
setPush(true);
}
},
pull: function pull() {
if (_push) {
setPush(false);
}
}
};
}, [_push]);
React.useImperativeHandle(ref, function () {
return operations;
}, [operations]);
var isDestroyOnClose = destroyOnClose && !visible;
var onDestroyTransitionEnd = function onDestroyTransitionEnd() {
if (!isDestroyOnClose) {
return;
}
if (!visible) {
destroyClose.current = true;
forceUpdate();
}
};
var getOffsetStyle = function getOffsetStyle() {
// https://github.com/ant-design/ant-design/issues/24287
if (!visible && !mask) {
return {};
}
var offsetStyle = {};
if (placement === 'left' || placement === 'right') {
var defaultWidth = size === 'large' ? 736 : 378;
offsetStyle.width = typeof width === 'undefined' ? defaultWidth : width;
} else {
var defaultHeight = size === 'large' ? 736 : 378;
offsetStyle.height = typeof height === 'undefined' ? defaultHeight : height;
}
return offsetStyle;
};
var getRcDrawerStyle = function getRcDrawerStyle() {
// get drawer push width or height
var getPushTransform = function getPushTransform(_placement) {
var distance;
if (typeof _push === 'boolean') {
distance = _push ? defaultPushState.distance : 0;
} else {
distance = _push.distance;
}
distance = parseFloat(String(distance || 0));
if (_placement === 'left' || _placement === 'right') {
return "translateX(".concat(_placement === 'left' ? distance : -distance, "px)");
}
if (_placement === 'top' || _placement === 'bottom') {
return "translateY(".concat(_placement === 'top' ? distance : -distance, "px)");
}
}; // 当无 mask 时,将 width 应用到外层容器上
// 解决 https://github.com/ant-design/ant-design/issues/12401 的问题
var offsetStyle = mask ? {} : getOffsetStyle();
return (0, _extends2["default"])((0, _extends2["default"])({
zIndex: zIndex,
transform: internalPush ? getPushTransform(placement) : undefined
}, offsetStyle), style);
};
var closeIconNode = closable && /*#__PURE__*/React.createElement("button", {
type: "button",
onClick: onClose,
"aria-label": "Close",
className: "".concat(prefixCls, "-close")
}, closeIcon);
function renderHeader() {
if (!title && !closable) {
return null;
}
return /*#__PURE__*/React.createElement("div", {
className: (0, _classnames["default"])("".concat(prefixCls, "-header"), (0, _defineProperty2["default"])({}, "".concat(prefixCls, "-header-close-only"), closable && !title && !extra)),
style: headerStyle
}, /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-header-title")
}, closeIconNode, title && /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-title")
}, title)), extra && /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-extra")
}, extra));
}
function renderFooter() {
if (!footer) {
return null;
}
var footerClassName = "".concat(prefixCls, "-footer");
return /*#__PURE__*/React.createElement("div", {
className: footerClassName,
style: footerStyle
}, footer);
} // render drawer body dom
var renderBody = function renderBody() {
if (destroyClose.current && !visible) {
return null;
}
destroyClose.current = false;
var containerStyle = {};
if (isDestroyOnClose) {
// Increase the opacity transition, delete children after closing.
containerStyle.opacity = 0;
containerStyle.transition = 'opacity .3s';
}
return /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-wrapper-body"),
style: (0, _extends2["default"])((0, _extends2["default"])({}, containerStyle), drawerStyle),
onTransitionEnd: onDestroyTransitionEnd
}, renderHeader(), /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-body"),
style: bodyStyle
}, children), renderFooter());
};
var drawerClassName = (0, _classnames["default"])((0, _defineProperty2["default"])({
'no-mask': !mask
}, "".concat(prefixCls, "-rtl"), direction === 'rtl'), className);
var offsetStyle = mask ? getOffsetStyle() : {};
return /*#__PURE__*/React.createElement(DrawerContext.Provider, {
value: operations
}, /*#__PURE__*/React.createElement(_rcDrawer["default"], (0, _extends2["default"])({
handler: false
}, (0, _extends2["default"])({
placement: placement,
prefixCls: prefixCls,
maskClosable: maskClosable,
level: level,
keyboard: keyboard,
children: children,
onClose: onClose
}, rest), offsetStyle, {
open: visible,
showMask: mask,
style: getRcDrawerStyle(),
className: drawerClassName
}), renderBody()));
});
Drawer.displayName = 'Drawer';
var DrawerWrapper = /*#__PURE__*/React.forwardRef(function (props, ref) {
var customizePrefixCls = props.prefixCls,
customizeGetContainer = props.getContainer;
var _React$useContext = React.useContext(_configProvider.ConfigContext),
getPopupContainer = _React$useContext.getPopupContainer,
getPrefixCls = _React$useContext.getPrefixCls,
direction = _React$useContext.direction;
var prefixCls = getPrefixCls('drawer', customizePrefixCls);
var getContainer = // 有可能为 false所以不能直接判断
customizeGetContainer === undefined && getPopupContainer ? function () {
return getPopupContainer(document.body);
} : customizeGetContainer;
return /*#__PURE__*/React.createElement(Drawer, (0, _extends2["default"])({}, props, {
ref: ref,
prefixCls: prefixCls,
getContainer: getContainer,
direction: direction
}));
});
DrawerWrapper.displayName = 'DrawerWrapper';
var _default = DrawerWrapper;
exports["default"] = _default;