@chief-editor/ui
Version:
UI Component for chief editor
1 lines • 3.16 kB
JavaScript
;var __assign=this&&this.__assign||function(){return(__assign=Object.assign||function(e){for(var r,t=1,o=arguments.length;t<o;t++)for(var s in r=arguments[t])Object.prototype.hasOwnProperty.call(r,s)&&(e[s]=r[s]);return e}).apply(this,arguments)},__rest=this&&this.__rest||function(e,r){var t={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var s=0;for(o=Object.getOwnPropertySymbols(e);s<o.length;s++)r.indexOf(o[s])<0&&Object.prototype.propertyIsEnumerable.call(e,o[s])&&(t[o[s]]=e[o[s]])}return t},__importStar=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var r={};if(null!=e)for(var t in e)Object.hasOwnProperty.call(e,t)&&(r[t]=e[t]);return r.default=e,r};Object.defineProperty(exports,"__esModule",{value:!0});var icons_1=require("@byte-design/icons"),animation_1=require("@rc-hooks/animation"),dialog_1=require("@rc-hooks/dialog"),util_1=require("@co-hooks/util"),use_1=require("@rc-hooks/use"),react_1=__importStar(require("react")),dom_1=require("@rc-hooks/dom"),hooks_1=require("../../hooks"),content_1=require("../content"),useDrawerPosition_1=require("./useDrawerPosition");function Drawer(e){var r=e.placement,t=e.show,o=e.closeable,s=e.maskClosable,a=void 0!==s&&s,n=e.mask,l=void 0===n||n,i=e.afterClose,c=e.onClose,u=e.destroyOnClose,_=e.header,d=e.footer,f=e.bodyStyle,h=e.className,m=e.width,p=e.height,k=e.children,w=e.wrapperStyle,y=__rest(e,["placement","show","closeable","maskClosable","mask","afterClose","onClose","destroyOnClose","header","footer","bodyStyle","className","width","height","children","wrapperStyle"]),g=react_1.useState(!1),b=g[0],v=g[1],C=react_1.useRef(null),S=react_1.useRef(null),O=dom_1.useLockScreen(),P=O.lockScreen,q=O.unlockScreen,x=useDrawerPosition_1.useDrawerPosition(r),j={horizontal:"dock"!==x.horizontal,vertical:"dock"!==x.vertical},D=hooks_1.usePrefixCls("drawer-body"),E=hooks_1.usePrefixCls("drawer-close-icon"),N=hooks_1.usePrefixCls("drawer-mask",{show:t&&b}),R=hooks_1.usePrefixCls("drawer",__assign({"no-mask":!l},j)),z=hooks_1.usePrefixCls("drawer-dialog",__assign(__assign({},j),{placement:r,show:t&&b})),M=use_1.useRefCallback((function(){return null==c?void 0:c("closeIcon")})),I=use_1.useRefCallback((function(){return a&&(null==c?void 0:c("mask"))}));return react_1.useEffect((function(){return t?P():q(),q}),[t]),animation_1.useCSSEnterLeave(C,{show:t,type:"transition",validTarget:S,validProperty:"transform",enter:{onStart:function(){t&&!b&&v(!0)}},leave:{onEnd:function(){b&&(v(!1),null==i||i())}}}),!u||b||t?react_1.default.createElement(dialog_1.RcDialog,__assign({},x,y,{show:!0,mask:l,onMaskClick:I,maskClassName:N,className:util_1.classnames(z,h),ref:C,wrapperStyle:__assign(__assign({},w),b||t?null:{display:"none"})}),!!o&&react_1.default.createElement(icons_1.Close,{className:E,onClick:M}),react_1.default.createElement(content_1.Content,{prefixCls:"drawer-content",className:R,style:{width:m,height:p},header:_,footer:d,enableSize:t,containerRef:S},react_1.default.createElement("div",{className:D,style:f},k))):null}exports.Drawer=Drawer;