@chief-editor/ui/lib/components/content/index.js

UI Component for chief editor

"use strict";var __assign=this&&this.__assign||function(){return(__assign=Object.assign||function(e){for(var t,r=1,s=arguments.length;r<s;r++)for(var n in t=arguments[r])Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e}).apply(this,arguments)},__rest=this&&this.__rest||function(e,t){var r={};for(var s in e)Object.prototype.hasOwnProperty.call(e,s)&&t.indexOf(s)<0&&(r[s]=e[s]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(s=Object.getOwnPropertySymbols(e);n<s.length;n++)t.indexOf(s[n])<0&&Object.prototype.propertyIsEnumerable.call(e,s[n])&&(r[s[n]]=e[s[n]])}return r},__importStar=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)Object.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t.default=e,t};Object.defineProperty(exports,"__esModule",{value:!0});var dom_1=require("@rc-hooks/dom"),use_1=require("@rc-hooks/use"),util_1=require("@co-hooks/util"),react_1=__importStar(require("react")),hooks_1=require("../../hooks");exports.Content=function(e){var t=e.prefixCls,r=e.icon,s=e.className,n=e.header,o=e.footer,a=e.children,l=e.style,i=void 0===l?{}:l,u=e.width,c=e.enableSize,f=void 0!==c&&c,_=e.containerRef,h=void 0===_?null:_,d=__rest(e,["prefixCls","icon","className","header","footer","children","style","width","enableSize","containerRef"]),m=react_1.useRef(null),p=react_1.useRef(null),v=react_1.useRef(null),y=react_1.useRef(null),x=use_1.useUpdate(),k=use_1.useCombineRef(m,h),P=dom_1.useElementSize(m,(function(){return f}),x),C=dom_1.useElementSize(p,(function(){return f}),x),g=dom_1.useElementSize(v,(function(){return f}),x),w=dom_1.useElementSize(y,(function(){return f}),x),b=P.height-C.height-g.height,O=f&&b<w.height,E=util_1.classnames(hooks_1.usePrefixCls("content-container"),hooks_1.usePrefixCls(t+"-container"),s),S=util_1.classnames(hooks_1.usePrefixCls("content-inner"),hooks_1.usePrefixCls(t+"-inner",{"no-footer":!o,overflow:O})),N=util_1.classnames(hooks_1.usePrefixCls("content-icon-wrapper"),hooks_1.usePrefixCls(t+"-icon-wrapper")),j=util_1.classnames(hooks_1.usePrefixCls("content-inner-wrapper"),hooks_1.usePrefixCls(t+"-inner-wrapper")),R=util_1.classnames(hooks_1.usePrefixCls("content-header"),hooks_1.usePrefixCls(t+"-header",{overflow:O})),z=util_1.classnames(hooks_1.usePrefixCls("content-footer"),hooks_1.usePrefixCls(t+"-footer",{overflow:O})),q=react_1.useCallback((function(e){return r?react_1.default.createElement("div",{className:N},e):null}),[r]);return react_1.default.createElement("div",__assign({},d,{ref:k,className:E,style:__assign(__assign({},i),{width:null!=u?u:i.width})}),n?react_1.default.createElement("div",{ref:p,className:R},q(r),react_1.default.createElement("div",{className:j},"function"==typeof n?n():n)):null,react_1.default.createElement("div",{className:S,style:{height:f?b+"px":void 0}},q(!n&&r),react_1.default.createElement("div",{className:j,ref:y},"function"==typeof a?a():a)),o?react_1.default.createElement("div",{ref:v,className:z},q(),react_1.default.createElement("div",{className:j},"function"==typeof o?o():o)):null)};