@chief-editor/runtime/es/util/layout.js

React Runtime for Flow Editor

import{NodeType}from"@chief-editor/base";export function getBrickLayout(t,e,r){if(!t)return{};var i=t.width,o=t.height;if(e===NodeType.LAYER)return getLayerBrickStyle(t);var a={};return null!=t.width&&(a.width=i+"px"),null!=t.height&&(a.height=o+"px"),r&&Object.assign(a,{flexGrow:0,flexShrink:0}),a}export function getLayerBrickStyle(t){var e=t.width,r=t.height,i=t.horizontal,o=void 0===i?"left":i,a=t.vertical,n=void 0===a?"top":a,s=t.rotate,h=t.skewX,c=void 0===h?0:h,d=t.skewY,l=void 0===d?0:d,f=t.scaleX,g=void 0===f?1:f,p=t.scaleY,v=void 0===p?1:p,m={width:e+"px",height:r+"px",position:"absolute"};return"dock"===o?Object.assign(m,{left:0,right:0,width:void 0}):"center"===o?Object.assign(m,{left:"50%",transform:"translateX(-50%)"}):m[o]=(t[o]||0)+"px","dock"===n?Object.assign(m,{top:0,bottom:0,height:void 0}):"center"===n?Object.assign(m,{top:"50%",transform:"translateY(-50%)"}):m[n]=(t[n]||0)+"px","center"===o&&"center"===n&&(m.transform="translate(-50%, -50%)"),s&&(m.transform=(m.transform||"")+" rotate("+s+"deg)"),m.transform=(m.transform||"")+" skew("+c+"deg, "+l+") scale("+g+", "+v+")",m}