12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182 |
- "use strict";
- "use client";
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
- var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
- Object.defineProperty(exports, "__esModule", {
- value: true
- });
- exports.default = void 0;
- var React = _interopRequireWildcard(require("react"));
- var _classnames = _interopRequireDefault(require("classnames"));
- var _useClosable = _interopRequireWildcard(require("../_util/hooks/useClosable"));
- var _context = require("../config-provider/context");
- var _skeleton = _interopRequireDefault(require("../skeleton"));
- const DrawerPanel = props => {
- var _a, _b;
- const {
- prefixCls,
- title,
- footer,
- extra,
- loading,
- onClose,
- headerStyle,
- bodyStyle,
- footerStyle,
- children,
- classNames: drawerClassNames,
- styles: drawerStyles
- } = props;
- const drawerContext = (0, _context.useComponentConfig)('drawer');
- const customCloseIconRender = React.useCallback(icon => (/*#__PURE__*/React.createElement("button", {
- type: "button",
- onClick: onClose,
- className: `${prefixCls}-close`
- }, icon)), [onClose]);
- const [mergedClosable, mergedCloseIcon] = (0, _useClosable.default)((0, _useClosable.pickClosable)(props), (0, _useClosable.pickClosable)(drawerContext), {
- closable: true,
- closeIconRender: customCloseIconRender
- });
- const headerNode = React.useMemo(() => {
- var _a, _b;
- if (!title && !mergedClosable) {
- return null;
- }
- return /*#__PURE__*/React.createElement("div", {
- style: Object.assign(Object.assign(Object.assign({}, (_a = drawerContext.styles) === null || _a === void 0 ? void 0 : _a.header), headerStyle), drawerStyles === null || drawerStyles === void 0 ? void 0 : drawerStyles.header),
- className: (0, _classnames.default)(`${prefixCls}-header`, {
- [`${prefixCls}-header-close-only`]: mergedClosable && !title && !extra
- }, (_b = drawerContext.classNames) === null || _b === void 0 ? void 0 : _b.header, drawerClassNames === null || drawerClassNames === void 0 ? void 0 : drawerClassNames.header)
- }, /*#__PURE__*/React.createElement("div", {
- className: `${prefixCls}-header-title`
- }, mergedCloseIcon, title && /*#__PURE__*/React.createElement("div", {
- className: `${prefixCls}-title`
- }, title)), extra && /*#__PURE__*/React.createElement("div", {
- className: `${prefixCls}-extra`
- }, extra));
- }, [mergedClosable, mergedCloseIcon, extra, headerStyle, prefixCls, title]);
- const footerNode = React.useMemo(() => {
- var _a, _b;
- if (!footer) {
- return null;
- }
- const footerClassName = `${prefixCls}-footer`;
- return /*#__PURE__*/React.createElement("div", {
- className: (0, _classnames.default)(footerClassName, (_a = drawerContext.classNames) === null || _a === void 0 ? void 0 : _a.footer, drawerClassNames === null || drawerClassNames === void 0 ? void 0 : drawerClassNames.footer),
- style: Object.assign(Object.assign(Object.assign({}, (_b = drawerContext.styles) === null || _b === void 0 ? void 0 : _b.footer), footerStyle), drawerStyles === null || drawerStyles === void 0 ? void 0 : drawerStyles.footer)
- }, footer);
- }, [footer, footerStyle, prefixCls]);
- return /*#__PURE__*/React.createElement(React.Fragment, null, headerNode, /*#__PURE__*/React.createElement("div", {
- className: (0, _classnames.default)(`${prefixCls}-body`, drawerClassNames === null || drawerClassNames === void 0 ? void 0 : drawerClassNames.body, (_a = drawerContext.classNames) === null || _a === void 0 ? void 0 : _a.body),
- style: Object.assign(Object.assign(Object.assign({}, (_b = drawerContext.styles) === null || _b === void 0 ? void 0 : _b.body), bodyStyle), drawerStyles === null || drawerStyles === void 0 ? void 0 : drawerStyles.body)
- }, loading ? (/*#__PURE__*/React.createElement(_skeleton.default, {
- active: true,
- title: false,
- paragraph: {
- rows: 5
- },
- className: `${prefixCls}-body-skeleton`
- })) : children), footerNode);
- };
- var _default = exports.default = DrawerPanel;
|