UNPKG

@chief-editor/editor

Version:

FlowEditor Editor

1 lines 2.06 kB
"use strict";var __assign=this&&this.__assign||function(){return(__assign=Object.assign||function(e){for(var t,r=1,i=arguments.length;r<i;r++)for(var s in t=arguments[r])Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s]);return e}).apply(this,arguments)},__rest=this&&this.__rest||function(e,t){var r={};for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&t.indexOf(i)<0&&(r[i]=e[i]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var s=0;for(i=Object.getOwnPropertySymbols(e);s<i.length;s++)t.indexOf(i[s])<0&&Object.prototype.propertyIsEnumerable.call(e,i[s])&&(r[i[s]]=e[i[s]])}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 util_1=require("@co-hooks/util"),runtime_1=require("@chief-editor/runtime"),dom_1=require("@rc-hooks/dom"),react_1=__importStar(require("react")),use_1=require("@rc-hooks/use"),useEditor_1=require("../hooks/useEditor"),useEditorCls_1=require("../hooks/useEditorCls"),template_1=require("../context/template");exports.EditorTemplateRender=react_1.memo((function(e){var t=e.templateId,r=e.className,i=e.children,s=__rest(e,["templateId","className","children"]),o=useEditor_1.useEditor().getTemplate(t),a=react_1.useRef(null),n=use_1.useUpdate(),u=util_1.classnames(r,useEditorCls_1.useEditorCls("template")),l=useEditorCls_1.useEditorCls("template-root"),c=dom_1.useElementPosition(a,(function(){return o.isActiveTemplate()}),(function(e){o.setPosition(e)}),{});return o.setPosition(c),react_1.useEffect((function(){return o.addListener("active-change",n),function(){o.removeListener("active-change",n)}}),[]),react_1.default.createElement(template_1.TemplateContext.Provider,{value:o},react_1.default.createElement("div",__assign({},s,{className:u,"data-template-id":t,ref:a}),react_1.default.createElement(runtime_1.RuntimeDispatcher,{node:o.getNode(),className:l,style:{width:"100%",height:"100%"}})),i)}));