@chief-editor/editor/es/components/BoardRender.js

FlowEditor Editor

var __assign=this&&this.__assign||function(){return(__assign=Object.assign||function(e){for(var t,o=1,r=arguments.length;o<r;o++)for(var s in t=arguments[o])Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s]);return e}).apply(this,arguments)};import{getElementPosition}from"@co-hooks/dom";import{classnames}from"@co-hooks/util";import{FloatType,NodeType}from"@chief-editor/base";import React,{memo,useEffect,useRef,useState}from"react";import{useEditorCls}from"../hooks/useEditorCls";import{useTemplate}from"../hooks/useTemplate";export var BoardRender=memo((function(e){var t,o=e.className,r=e.style,s=void 0===r?{}:r,a=e.boardId,i=e.type,n=e.floatType,c=e.children,d=e.node,l=useTemplate().getBoardByNode(d),u=useState(l.isActiveBoard()),m=u[0],f=u[1],p=useState(l.getNode().isEmpty()),g=p[0],h=p[1],v=useRef(null);useEffect((function(){return l.addListener("active-change",f),function(){l.removeListener("active-change")}}),[]),useEffect((function(){var e=function(){h(l.getNode().isEmpty())};return l.getNode().addListener("childChange",e),function(){return l.getNode().removeListener("childChange",e)}}),[l.getNode()]),useEffect((function(){var e=v.current;e&&l.setPosition(getElementPosition(e))}));var y=__assign({},s);i===NodeType.LAYER&&(y.position="relative",y.width="100%",y.height="100%"),i===NodeType.STREAM&&n!==FloatType.NONE&&Object.assign(y,{display:"flex",flexDirection:n===FloatType.RIGHT?"column-reverse":"column",justifyItems:"start"});var E=classnames(o,useEditorCls("board",((t={active:m})[n.toLowerCase()]=n!==FloatType.NONE,t[i.toLowerCase()]=!0,t.empty=g,t)));return React.createElement("div",{className:E,"data-board-id":l.id,id:m?"data-root-"+a:void 0,style:y,ref:v},c)}));