@vuu-ui/vuu-layout 0.8.32 → 0.8.33
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/index.js +132 -19
- package/package.json +11 -16
- package/types/index.d.ts +1 -1
- package/types/layout-header/Header.d.ts +1 -1
- package/types/layout-reducer/layoutTypes.d.ts +1 -1
- package/types/layout-view/index.d.ts +2 -4
- package/types/layout-view/useView.d.ts +2 -2
- package/types/{layout-view → layout-view-actions}/ViewContext.d.ts +1 -1
- package/types/layout-view-actions/index.d.ts +2 -0
- package/LICENSE +0 -201
- package/README.md +0 -1
- package/cjs/index.js.map +0 -7
- package/esm/index.js +0 -20
- package/esm/index.js.map +0 -7
- package/index.css +0 -2
- package/index.css.map +0 -7
- /package/types/{layout-view → layout-view-actions}/useViewActionDispatcher.d.ts +0 -0
package/esm/index.js
DELETED
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import{partition as Co}from"@vuu-ui/vuu-utils";import qn from"clsx";var Ro={},Eo={},ae={};function H(e){return Ro[e]===!0}function Jn(e){return Eo[e]===!0}var Do=e=>H(e)||Jn(e);function I(e,t,o="component"){ae[e]=t,o==="container"?Ro[e]=!0:o==="view"&&(Eo[e]=!0)}import{Button as So,useControlled as Yn}from"@salt-ds/core";import To from"clsx";import{useCallback as Zn}from"react";import{jsx as Ee,jsxs as jn}from"react/jsx-runtime";var ee="vuuDrawer",Po=e=>typeof e=="string"?e:e+"px",Xn=(e,t,o)=>{let r=t!==void 0,n=o!==void 0;if(!(!e&&!n&&!r))return!n&&!r?e:{...e,"--drawer-size":r?Po(t):void 0,"--drawer-peek-size":n?Po(o):void 0}},Lo=({children:e,className:t,clickToOpen:o,defaultOpen:r,sizeOpen:n,sizeClosed:a,style:i,open:s,position:l="left",inline:c,onClick:u,peekaboo:d=!1,toggleButton:p,...m})=>{let[h,g]=Yn({controlled:s,default:r!=null?r:!1,name:"Drawer",state:"open"});console.log(`Drawer sizeOpen ${n} sizeClosed ${a}`);let y=To(ee,t,`${ee}-${l}`,{[`${ee}-open`]:h,[`${ee}-inline`]:c,[`${ee}-over`]:!c,[`${ee}-peekaboo`]:d}),f=Zn(()=>{g(!h)},[h,g]),x=Xn(i,n,a),R=o?f:u,w=()=>Ee("div",{className:To("vuuToggleButton-container"),children:h?Ee(So,{"aria-label":"close",onClick:f,"data-icon":"close",variant:"secondary"}):Ee(So,{"aria-label":"open",onClick:f,"data-icon":"close",variant:"secondary"})});return jn("div",{...m,className:y,onClick:R,style:x,children:[p=="start"?w():null,Ee("div",{className:`${ee}-liner`,children:Ee("div",{className:`${ee}-content`,children:e})}),p=="end"?w():null]})};Lo.displayName="Drawer";var vt=Lo;import{jsx as ti,jsxs as oi}from"react/jsx-runtime";var Qn=e=>e.type===vt,Kn=({props:{position:e="left"}})=>e.match(/top|bottom/),wt=e=>{let{children:t,className:o,id:r,style:n}=e,a="vuuDockLayout",[i,s]=Co(t,Qn),[l,c]=Co(i,Kn),u=l.length===0?"horizontal":c.length===0?"vertical":"both",d=qn(a,o,`${a}-${u}`);return oi("div",{className:d,id:r,style:n,children:[i,ti("div",{className:`${a}-content`,children:s})]})};wt.displayName="DockLayout";var ei=wt;I("DockLayout",wt,"container");import{forwardRef as ri}from"react";import{jsx as ii}from"react/jsx-runtime";var Rt=ri(function({resizeable:t,...o},r){return ii("div",{...o,className:"Component",ref:r})});Rt.displayName="Component";var ni=Rt;I("Component",Rt);import te,{isValidElement as ko}from"react";var ai={},P=(e,t)=>{var r;let o=D(e);return(r=o[t])!=null?r:o[`data-${t}`]},D=e=>(e==null?void 0:e.props)||e||ai,Mo=e=>{let t=D(e);if(t.children){let{children:[o,...r]}=t;return r.length>0&&console.warn(`getChild expected a single child, found ${r.length+1}`),o}};function T(e){var t;if(e){let o=e.type;if(typeof o=="function"||typeof o=="object"){let r=o.displayName||o.name||((t=o.type)==null?void 0:t.name);if(typeof r=="string")return r}if(typeof e.type=="string")return e.type;if(e.constructor)return e.constructor.displayName;throw Error("typeOf unable to determine type of element")}}var cc=(e,t)=>T(e)===t,uc=e=>e!==void 0&&"type"in e;var si=e=>{let t=e.lastIndexOf(".");return t===-1?e:e.slice(0,t)},Ao=e=>te.isValidElement(e.props.children)?[e.props.children]:e.props.children,Et=(e,t="")=>{let[o,...r]=t.split(".");if(o!=null&&o.startsWith("#")){let n=Dt(e,o.slice(1),!0);if(n&&r.length)return Et(n,r.join("."))}else if(o==="ACTIVE_CHILD"){let{active:n}=D(e),a=Ao(e),{path:i}=D(a[n]);return i}return""},li=(e,t="")=>{let[o,...r]=t.split(".");if(o!=null&&o.startsWith("#")){let n=Io(e,o.slice(1),!0);if(n&&r.length)return li(n,r.join("."))}else if(o==="ACTIVE_CHILD"){let{children:n,props:a}=e,{active:i}=a;if(typeof i=="number"&&(n!=null&&n[i]))return n[i]}};function Y(e,t){let{"data-path":o,path:r=o}=D(e);return t==="0"||t===r?null:B(e,si(t),!0)}function Q(e,t){let{children:o,...r}=D(e);if(t(r))return e;if(te.Children.count(o)>0){let n=te.isValidElement(o)?[o]:o;for(let a of n){let i=Q(a,t);if(i)return i}}}function ci(e,t){if(t===e)return null;let{path:o,children:r}=D(e),{idx:n,finalStep:a}=Z(o,P(t,"path"));return a?e:r===void 0||r[n]===void 0?null:ci(r[n],t)}var ui=(e,t)=>{if(te.isValidElement(e)&&t==0)return e;if(Array.isArray(e))return e[t]};function zo(e,t){let o=t.split("."),r=[e];for(let n=0;n<o.length;n++){let a=parseInt(o[n]),i=r[a];if(n===o.length-1)return i;r=Ao(i)}}var Dt=(e,t,o=!0)=>{let{children:r,id:n}=e.props;if(n===t)return e;if(te.Children.count(r)>0){let a=ko(r)?[r]:r;for(let i of a)if(ko(i)){let s=Dt(i,t,!1);if(s)return s}}if(o===!0)throw Error(`pathUtils.findTargetById id #${t} not found in source`)},Io=(e,t,o=!0)=>{let{children:r,id:n}=e;if(n===t)return e;if(Array.isArray(r)&&r.length>0){for(let a of r)if(a!==null&&typeof a=="object"){let i=Io(a,t,!1);if(i)return i}}if(o===!0)throw Error(`pathUtils.findTargetJSONById id #${t} not found in source`)};function B(e,t,o=!1){if(t.startsWith("#"))return Dt(e,t.slice(1),o);let{"data-path":r,path:n=r}=D(e);if(t.indexOf(n)!==0)throw Error(`pathUtils.followPath path ${t} is not within source path ${n}`);let a=t.slice(n.length+1);if(a==="")return e;let i=e,s=a.split(".");for(let l=0;l<s.length;l++){if(te.Children.count(i.props.children)===0){let c=`element at 0.${s.slice(0,l).join(".")} has no children, so cannot fulfill rest of path ${s.slice(l).join(".")}`;if(o)throw Error(c);console.warn(c);return}if(i=ui(i.props.children,parseInt(s[l])),i===void 0){let c=`model at 0.${s.slice(0,l).join(".")} has no children that fulfill next step of path ${s.slice(l).join(".")}`;if(o)throw Error(c);console.warn(c)}}return i}function yc(e,t){let o=Y(e,t),r=t.split(".").map(n=>parseInt(n,10));if(o){let n=r.pop(),{children:a}=o.props;if(a.length-1>n)return Ve(a[n+1]);{let i=r.pop(),s=Y(e,P(o,"path"));if(s&&typeof i=="number"&&(r=s.props.path.split(".").map(l=>parseInt(l,10)),s.props.children.length-1>i)){let l=s.props.children[i+1];return H(T(l))?Ve(l):l}}}return Ve(e)}function bc(e,t){let o=t.split(".").map(a=>parseInt(a,10)),r=o.pop(),n=Y(e,t);if(n!=null&&typeof r=="number"){let{children:a}=n.props;if(r>0)return _e(a[r-1]);for(;o.length>1;)if(r=o.pop(),n=Y(e,P(n,"path")),r>0){let i=n.props.children[r-1];return H(T(i))?_e(i):i}}return _e(e)}function Ve(e){if(H(T(e))){let{children:t}=e.props||e;return Ve(t[0])}return e}function _e(e){if(H(T(e))){let{children:t}=e.props||e;return _e(t[t.length-1])}return e}function Z(e,t,o=!1){if(e===t)return{idx:-1,finalStep:!0};let r=`${e}.`;if(!t.startsWith(r))throw Error("pathUtils nextStep has strayed from the path");let n=o?0:1,a=t.replace(r,"").split(".").map(i=>parseInt(i,10));return{idx:a[0],finalStep:a.length===n}}function O(e,t,o){if(P(e,"path")===t)return e;let r=[];te.Children.forEach(e.props.children,(a,i)=>{P(a,"path")?r.push(O(a,`${t}.${i}`)):r.push(a)});let n=e.props["data-path"]?"data-path":"path";return te.cloneElement(e,{[n]:t,...o},r)}function vc(e,t){typeof e=="function"?e(t):e&&(e.current=t)}var St=e=>{if(typeof e!="number")throw Error(`"no support yet for flex value ${e}`);return{flexBasis:0,flexGrow:1,flexShrink:1}};import{boxContainsPoint as Ge}from"@vuu-ui/vuu-utils";var le={north:1,east:2,south:4,west:8,header:16,centre:32,absolute:64},De={AFTER:"after",BEFORE:"before"},_=Object.freeze({North:se("north"),East:se("east"),South:se("south"),West:se("west"),Header:se("header"),Centre:se("centre"),Absolute:se("absolute")});function se(e){return Object.freeze({offset:e==="north"||e==="west"?0:e==="south"||e==="east"?1:NaN,valueOf:function(){return le[e]},toString:function(){return e},North:e==="north",South:e==="south",East:e==="east",West:e==="west",Header:e==="header",Centre:e==="centre",NorthOrSouth:e==="north"||e==="south",EastOrWest:e==="east"||e==="west",NorthOrWest:e==="north"||e==="west",SouthOrEast:e==="east"||e==="south",Absolute:e==="absolute"})}var Bo=_.North,Oo=_.South,Tt=_.East,Pt=_.West,pi=_.Header,di=_.Centre,he=class{static measure(t,o=[]){let r={};return hi(t,r,o),r}static allBoxesContainingPoint(t,o,r,n,a){return $o(t,o,r,n,a).reverse()}};function Lt(e,t,o,r=30){let n=o.right-o.left,a=o.bottom-o.top,i=e-o.left,s=t-o.top,l=0;return i<r&&(l+=8),i>n-r&&(l+=2),s<r&&(l+=1),s>a-r&&(l+=4),{pctX:i/n,pctY:s/a,closeToTheEdge:l}}function Ct(e,t,o,r){let{BEFORE:n,AFTER:a}=De,{pctX:i,pctY:s,closeToTheEdge:l}=Lt(e,t,o),c,u;if(r==="row")c=i<.5?Pt:Tt;else if(o.header&&Ge(o.header,e,t))if(c=pi,o.Stack){let d=o.Stack.length;if(d===0)u={index:-1,left:o.left,positionRelativeToTab:a,width:0};else{let p=o.Stack.find(({left:m,right:h})=>e>=m&&e<=h);if(p){let m=p.right-p.left;u={index:o.Stack.indexOf(p),left:p.left,positionRelativeToTab:(e-p.left)/m<.5?n:a,width:m}}else u={left:o.Stack[d-1].right,width:0,index:d,positionRelativeToTab:a}}}else if(o.header.titleWidth){let d=o.header.titleWidth;u={index:-1,left:o.left,positionRelativeToTab:(e-o.left)/d<.5?n:a,width:d}}else u={left:o.left,width:0,positionRelativeToTab:n,index:-1};else c=mi(e,t,o,i,s);return{position:c,x:e,y:t,closeToTheEdge:l,tab:u}}function mi(e,t,o,r,n){let a=fi(o,.2);if(Ge(a,e,t))return di;switch(`${n<.5?"north":"south"}${r<.5?"west":"east"}`){case"northwest":return r>n?Bo:Pt;case"northeast":return 1-r>n?Bo:Tt;case"southeast":return r>n?Tt:Oo;case"southwest":return 1-r>n?Pt:Oo;default:}}function fi({right:e,left:t,top:o,bottom:r},n){let a=(1-n)/2,i=(e-t)*a,s=(r-o)*a;return{left:t+i,top:o+s,right:e-i,bottom:r-s}}function hi(e,t,o){let{id:r,"data-path":n,path:a=n}=D(e),i=T(e);if(r&&a){let[s,l]=Ho(e);No(e,s,l,t),H(i)&&Fo(e,t,o)}}function No(e,t,o,r){let{"data-path":n,path:a=n,header:i}=D(e);r[a]=t;let s=T(e);if(i||s==="Stack"){let l=s==="Stack"?".vuuTabstrip":".vuuHeader",c=o.querySelector(l);if(c){let{top:u,left:d,right:p,bottom:m}=c.getBoundingClientRect();if(r[a].header={top:Math.round(u),left:Math.round(d),right:Math.round(p),bottom:Math.round(m)},s==="Stack")r[a].Stack=Array.from(c.querySelectorAll(".vuuTab")).map(h=>h.getBoundingClientRect()).map(({left:h,right:g})=>({left:h,right:g}));else{let h=c.querySelector('[class^="vuuHeader-title"]'),{header:g}=r[a];h&&g&&(g.titleWidth=h.clientWidth)}}}return r[a]}function Fo(e,t,o,r=0,n=0,a=0,i=0){let{children:s,"data-path":l,path:c=l,style:u,active:d=0}=D(e),p=T(e),m=p==="Flexbox",h=p==="Stack",g=m&&u.flexDirection==="column",y=m&&u.flexDirection==="row",x=(h?s.filter((w,E)=>E===d):s.filter(gi)).map(w=>{let[E,b]=Ho(w);return[{...E,top:E.top-a,right:E.right+n,bottom:E.bottom+i,left:E.left-r},b,w]}),R=x.map(([w,E,b],v,S)=>{let C,L,M,z,A,k,G=S.length-1;y?(A=v===0?0:w.left-S[v-1][0].right,k=v===G?0:S[v+1][0].left-w.right,C=v===0||A===0?0:A,L=v===G||k===0?0:k-k/2,w.left-=C,w.right+=L,M=a,z=i):g&&(A=v===0?0:w.top-S[v-1][0].bottom,k=v===G?0:S[v+1][0].top-w.bottom,M=v===0||A===0?0:A,z=v===G||k===0?0:k-k/2,w.top-=M,w.bottom+=z,C=r,L=n);let W=No(b,w,E,t),ne=T(b);return H(ne)&&Fo(b,t,o,C,L,M,z),W});x.length&&(t[c].children=R)}function gi(e){let{id:t}=D(e),o=document.getElementById(t);return o?o.dataset.dragging!=="true":(console.warn(`BoxModel: no element found with id #${t}`),!1)}function Ho(e){let{id:t}=D(e);if(t===void 0)throw Error("`BoxModel.measureComponentElement, component has no id");let o=document.getElementById(t);if(!o)throw Error("BoxModel.measureComponentElement, no DOM element found for component");let{top:r,left:n,right:a,bottom:i,height:s,width:l}=o.getBoundingClientRect(),c,u=T(e);if(H(u)){let d=o.scrollHeight;d>s&&(c={id:t,scrollHeight:d,scrollTop:o.scrollTop})}return[{top:Math.round(r),left:Math.round(n),right:Math.round(a),bottom:Math.round(i),height:Math.round(s),width:Math.round(l),scrolling:c},o,e]}function $o(e,t,o,r,n,a=[]){let{children:i,"data-path":s,path:l=s}=D(e),c=T(e),u=t[l];if(!Ge(u,o,r))return a;if(n&&n.length){if(n.includes(l))a.push(e);else if(!n.some(d=>d.startsWith(l)))return a}else a.push(e);if(!H(c)||u.header&&Ge(u.header,o,r))return a;u.scrolling&&yi(u,o,r);for(let d=0;d<i.length;d++){if(c==="Stack"&&e.props.active!==d)continue;let p=$o(i[d],t,o,r,n);if(p.length)return a.concat(p)}return a}function yi({top:e,bottom:t,scrolling:o},r,n){if(o){let{id:a,scrollTop:i,scrollHeight:s}=o,l=t-e;if(i===0&&t-n<50){let c=s-l;document.getElementById(a).scrollTo({left:0,top:c,behavior:"smooth"}),o.scrollTop=c}else if(i>0&&n-e<50)document.getElementById(a).scrollTo({left:0,top:0,behavior:"smooth"}),o.scrollTop=0;else return!1}else return!1}var bi=.4,We=class{constructor(t,o,r,n,a){this.init(t,o,r,n,a)}init(t,o,r,n,a){let{left:i,top:s}=n,{pctX:l,pctY:c}=Lt(o,r,n),u=bi,d=l*n.width,p=n.width-d,m=c*n.height,h=n.height-m,g=n.width*u,y=n.height*u,f=1-u,x=d*f,R=m*f,w=p*f,E=h*f;this.intrinsicSize=a,this.constraint={zone:{x:{lo:t.left,hi:t.right},y:{lo:t.top,hi:t.bottom}},pos:{x:{lo:t.left-x,hi:t.right-n.width+w},y:{lo:t.top-R,hi:t.bottom-n.height+E}},mouse:{x:{lo:t.left+g*l,hi:t.right-g*(1-l)},y:{lo:t.top+y*c,hi:t.bottom-y*(1-c)}}},this.x={pos:i,lo:!1,hi:!1,mousePos:o,mousePct:l},this.y={pos:s,lo:!1,hi:!1,mousePos:r,mousePct:c}}outOfBounds(){return this.x.lo||this.x.hi||this.y.lo||this.y.hi}inBounds(){return!this.outOfBounds()}dropX(){return this.dropXY("x")}dropY(){return this.dropXY("y")}hasIntrinsicSize(){var t,o;return((t=this==null?void 0:this.intrinsicSize)==null?void 0:t.height)&&((o=this==null?void 0:this.intrinsicSize)==null?void 0:o.width)}update(t,o){let r=this[t],n=this.constraint.mouse[t],a=this.constraint.pos[t],i=r.pos,s=o-r.mousePos;return s<0?r.lo||(o<n.lo?(r.lo=!0,r.pos=a.lo):r.hi?o<n.hi&&(r.hi=!1,r.pos+=s):r.pos+=s):s>0&&(r.hi||(o>n.hi?(r.hi=!0,r.pos=a.hi):r.lo?o>n.lo&&(r.lo=!1,r.pos+=s):r.pos+=s)),r.mousePos=o,i!==r.pos}dropXY(t){let o=this[t],r=this.constraint.zone[t];return o.lo?Math.max(r.lo,o.mousePos):o.hi?Math.min(o.mousePos,Math.round(r.hi)-1):o.mousePos}};var Ac=e=>e.pos.tab&&T(e.component)==="Stack"&&e.pos.position.Header,{north:xi,south:vi,east:wi,west:Ri}=le,Ei=wi+Ri,Di=xi+vi,ge=class e{constructor({component:t,pos:o,clientRect:r,nextDropTarget:n}){this.component=t,this.pos=o,this.clientRect=r,this.nextDropTarget=n,this.active=!1,this.dropRect=void 0}targetTabPos(t){let{left:o,width:r,positionRelativeToTab:n}=t;return n===De.BEFORE?o:o+r}getTargetDropOutline(t,o){if(this.pos.tab)return this.getDropTabOutline(t,this.pos.tab);if(o&&o.hasIntrinsicSize())return this.getIntrinsicDropRect(o);{let[r,n,a,i]=this.getDropRectOutline(t,o);return{l:r,t:n,r:a,b:i}}}getDropTabOutline(t,o){var f,x;let{clientRect:{top:r,left:n,right:a,bottom:i,header:s}}=this,c=Math.round(t/2)+0,u=Math.round(r),d=Math.round(n+c),p=Math.round(a-c),m=Math.round(i-c),h=this.targetTabPos(o),g=60,y=((f=s==null?void 0:s.bottom)!=null?f:0)-((x=s==null?void 0:s.top)!=null?x:0);return{l:d,t:u,r:p,b:m,tabLeft:h,tabWidth:g,tabHeight:y}}getIntrinsicDropRect(t){var g,y,f,x;let{pos:o,clientRect:r}=this,{x:n,y:a}=t,i=(y=(g=t.intrinsicSize)==null?void 0:g.height)!=null?y:0,s=(x=(f=t.intrinsicSize)==null?void 0:f.height)!=null?x:0;i&&i>r.height?(console.log("DropTarget: we're going to blow the gaff"),i=r.height):s&&s>r.width&&(console.log("DropTarget: we're going to blow the gaff"),s=r.width);let l=Math.min(r.right-s,Math.max(r.left,Math.round(o.x-n.mousePct*s))),c=Math.min(r.bottom-i,Math.max(r.top,Math.round(o.y-a.mousePct*i))),[u,d,p,m]=this.dropRect=[l,c,l+s,c+i],h=o.position.EastOrWest?[u,r.top,u,r.bottom,p,r.top,p,r.bottom]:[r.left,d,r.right,d,r.left,m,r.right,m];return{l:u,r:p,t:d,b:m,guideLines:h}}getDropRectOutline(t,o){var x,R,w;let{pos:r,clientRect:n}=this,{width:a,height:i,position:s}=r,{width:l,height:c}=(x=o==null?void 0:o.intrinsicSize)!=null?x:{},u=(R=c!=null?c:i)!=null?R:0,d=(w=l!=null?l:a)!=null?w:0;this.dropRect=void 0;let{top:p,left:m,right:h,bottom:g}=n,f=Math.round(t/2)+0;switch(s){case _.North:case _.Header:{let E=Math.round((g-p)/2),b=u?Math.min(E,Math.round(u)):E;return d&&m+d<h?[m+f,p+f,m+d-f,p+f+b]:[m+f,p+f,h-f,p+f+b]}case _.West:{let E=Math.round((h-m)/2),b=d?Math.min(E,Math.round(d)):E;return u&&p+u<g?[m+f,p+f,m-f+b,p+u+f]:[m+f,p+f,m-f+b,g-f]}case _.East:{let E=Math.round((h-m)/2),b=d?Math.min(E,Math.round(d)):E;return u&&p+u<g?[h-f-b,p+f,h-f,p+u+f]:[h-f-b,p+f,h-f,g-f]}case _.South:{let E=Math.round((g-p)/2),b=u?Math.min(E,Math.round(u)):E;return d&&m+d<h?[m+f,g-f-b,m+d-f,g-f]:[m+f,g-f-b,h-f,g-f]}case _.Centre:return[m+f,p+f,h-f,g-f];default:return console.warn(`DropTarget does not recognize position ${s}`),null}}activate(){return this.active=!0,this}toArray(){let t=this,o=[t];for(;t=t.nextDropTarget;)o.push(t);return o}static getActiveDropTarget(t){return t===null?null:t!=null&&t.active?t:e.getActiveDropTarget(t.nextDropTarget)}};function Mt(e,t,o,r,n,a){var l;let i=null,s=he.allBoxesContainingPoint(o,r,e,t,a);if(s.length){let[c,...u]=s,{"data-path":d,path:p=d,"data-row-placeholder":m}=D(c),h=r[p],y=Ct(e,t,h,n&&m?"row":void 0),f=r[p],x=([R,...w])=>{var E,b;if((E=y.position)!=null&&E.Header||y.closeToTheEdge){let v=Si(R,y,f,r,e,t);if(v){let[S,C]=v;return new ge({component:R,pos:S,clientRect:C,nextDropTarget:(b=x(w))!=null?b:null})}else if(w.length)return x(w)}};i=new ge({component:c,pos:y,clientRect:h,nextDropTarget:(l=x(u))!=null?l:null}).activate()}return i}function Si(e,{closeToTheEdge:t,position:o},r,n,a,i){if(!e||e.type==="DraggableLayout")return;let s=n[e.props.path],l=t&le.north,c=t&le.east,u=t&le.south,d=t&le.west,p=(l||o.Header)&&Math.round(r.top)===Math.round(s.top),m=c&&Math.round(r.right)===Math.round(s.right),h=u&&Math.round(r.bottom)===Math.round(s.bottom),g=d&&Math.round(r.left)===Math.round(s.left);if(p||m||h||g){let{"data-path":y,path:f=y}=e.props,x=n[f],R=Ct(a,i,x);if((Ti(e)||Vo(e))&&t&Ei)return R.width=120,[R,x];if((Pi(e)||Vo(e))&&(o.Header||t&Di))return R.height=120,[R,x]}}function Vo(e){return T(e)==="Stack"}function Ti(e){return T(e)==="Flexbox"&&e.props.style.flexDirection==="column"}function Pi(e){return T(e)==="Flexbox"&&e.props.style.flexDirection==="row"}import{PopupService as At}from"@vuu-ui/vuu-popups";import Li from"clsx";import{jsx as _o}from"react/jsx-runtime";function Go(e,t=0,o=0){let{pos:r,clientRect:n}=e,a=20;return r.position.West?[n.left-o+a,r.y-t,"left"]:r.position.South?[r.x-o,n.bottom-t-a,"bottom"]:r.position.East?[n.right-o-a,r.y-t,"right"]:[r.x-o,n.top-t+a,"top"]}var kt="vuuDropMenu",Wo=({className:e,dropTarget:t,onHover:o,orientation:r})=>{let n=t.toArray();return _o("div",{className:Li(kt,e,`${kt}-${r}`),onMouseLeave:()=>o(null),children:n.map((a,i)=>_o("div",{className:`${kt}-item`,"data-icon":i===0?"column-2A":"column-2B",onMouseEnter:()=>o(a)},i))})};import{jsx as Bi}from"react/jsx-runtime";var zt=!1,Se=null,X=null,Ci=e=>Se=e,Mi=([e,t])=>`M${e},${t}`,ki=([e,t])=>`L${e},${t}`,Uo=([e,...t])=>`${Mi(e)} ${t.map(ki)}Z`,Ai=e=>{if(e){let[t,o,r,n,a,i,s,l]=e;return`M${t},${o} L${r},${n} M${a},${i} L${s},${l}`}else return""};function zi(){if(document.getElementById("hw-drag-canvas")===null){let e=document.getElementById("root"),t=document.createElement("div");t.id="hw-drag-canvas",t.innerHTML=`
|
|
2
|
-
<svg width="100%" height="100%">
|
|
3
|
-
<path id="hw-drop-guides" />
|
|
4
|
-
<path
|
|
5
|
-
id="vuu-drop-outline"
|
|
6
|
-
d="M300,132 L380,132 L380,100 L460,100 L460,132, L550,132 L550,350 L300,350z">
|
|
7
|
-
<animate
|
|
8
|
-
attributeName="d"
|
|
9
|
-
id="hw-drop-outline-animate"
|
|
10
|
-
begin="indefinite"
|
|
11
|
-
dur="300ms"
|
|
12
|
-
fill="freeze"
|
|
13
|
-
to="M255,33 L255,33,L255,1,L315,1,L315,1,L794,1,L794,164,L255,164Z"
|
|
14
|
-
/>
|
|
15
|
-
</path>
|
|
16
|
-
</svg>
|
|
17
|
-
`,document.body.insertBefore(t,e)}}var Te=class{constructor(){this.currentPath=null;this.tabMode=null;zi()}prepare(t,o="full-view"){document.body.classList.add("drawing"),this.currentPath=null,this.tabMode=o;let r=this.getPoints(0,0,0,0),n=Uo(r),a=document.getElementById("vuu-drop-outline");a==null||a.setAttribute("d",n),this.currentPath=n}clear(){Se=null,Ue(),document.body.classList.remove("drawing"),At.hidePopup()}get hoverDropTarget(){return Se}getPoints(t,o,r,n,a=0,i=0,s=0){let l=this.tabMode==="tab-only";if(i===0)return[[t,o+s],[t,o+s],[t,o],[t+i,o],[t+i,o],[t+r,o],[t+r,o+n],[t,o+n]];if(l){let c=a;return[[c,o],[c,o],[c+i,o],[c+i,o],[c+i,o+s],[c+i,o+s],[c,o+s],[c,o+s]]}else return a===0?[[t,o+s],[t,o+s],[t,o],[t+i,o],[t+i,o+s],[t+r,o+s],[t+r,o+n],[t,o+n]]:[[t,o+s],[t+a,o+s],[t+a,o],[t+a,o],[t+a,o+s],[t+r,o+s],[t+r,o+n],[t,o+n]]}draw(t,o){let n=zt;if(Se!==null)this.drawTarget(Se);else if(zt=t.nextDropTarget!=null,t.pos.tab?Ii(t):X&&Ue(),this.drawTarget(t,o),zt){let[a,i,s]=Go(t);{let l=Bi(Wo,{dropTarget:t,onHover:Ci,orientation:s});At.showPopup({left:a,top:i,component:l})}}else At.hidePopup()}drawTarget(t,o){let n=t.getTargetDropOutline(6,o);if(n){let{l:a,t:i,r:s,b:l,tabLeft:c,tabWidth:u,tabHeight:d,guideLines:p}=n,m=s-a,h=l-i;if(this.currentPath){let R=document.getElementById("vuu-drop-outline");R==null||R.setAttribute("d",this.currentPath)}let g=this.getPoints(a,i,m,h,c,u,d),y=Uo(g),f=document.getElementById("hw-drop-outline-animate");f==null||f.setAttribute("to",y),f==null||f.beginElement(),this.currentPath=y;let x=document.getElementById("hw-drop-guides");x==null||x.setAttribute("d",Ai(p))}}},Jo="transition:margin-left .4s ease-out;margin-left: 63px",Yo="transition:margin-left .4s ease-out;margin-left: 0px";function Ii(e){var s,l;let{AFTER:t,BEFORE:o}=De,{clientRect:{Stack:r},pos:{tab:n}}=e,{id:a}=e.component.props,i=null;if(r&&n&&n.positionRelativeToTab!==t){let c=n.positionRelativeToTab===o?1:2,u=`:scope .hwTabstrip > .hwTabstrip-inner > .hwTab:nth-child(${n.index+c})`;i=(s=document.getElementById(a))==null?void 0:s.querySelector(u),i?(X===null||X!==i)&&(i.style.cssText=Jo,X&&(X.style.cssText=Yo),X=i):Ue()}else(n==null?void 0:n.positionRelativeToTab)===o?X===null&&(i=(l=document.getElementById(a))==null?void 0:l.querySelector(".vuuHeader-title"),i.style.cssText=Jo,X=i):Ue()}function Ue(){X&&(X.style.cssText=Yo,X=null)}var K,Pe,oe,Xo,jo,ce,Je,ue=null,Bt,qo,Ze,Qo,It,Ye=null,Oi=3,Xe=new Te,Zo=.4;function Ni(e,t){return t?B(e,t):Q(e,o=>o.dropTarget)}var Ot={handleMousedown(e,t,o={}){K=t,qo=o,Xo=e.clientX,jo=e.clientY,It=o.dragThreshold===void 0?Oi:o.dragThreshold,It===0?K(e,0,0):(window.addEventListener("mousemove",je,!1),window.addEventListener("mouseup",qe,!1),Ye=window.setTimeout(()=>{window.removeEventListener("mousemove",je,!1),window.removeEventListener("mouseup",qe,!1),K==null||K(e,0,0)},500)),e.preventDefault()},initDrag(e,t,{top:o,left:r,right:n,bottom:a},i,s,l,c){return{drag:Pe,drop:oe}=s,Fi(e,t,{top:o,left:r,right:n,bottom:a},i,l,c)}};function je(e){let r=e.clientX-Xo,n=e.clientY-jo;Math.max(Math.abs(r),Math.abs(n))>It&&(window.removeEventListener("mousemove",je,!1),window.removeEventListener("mouseup",qe,!1),K==null||K(e,r,n),K=null)}function qe(){Ye&&(window.clearTimeout(Ye),Ye=null),window.removeEventListener("mousemove",je,!1),window.removeEventListener("mouseup",qe,!1)}function Fi(e,t,o,r,n,a){ce=Ni(e,t);let{"data-path":i,path:s=i}=D(ce);a&&(Bt=a.map(p=>Q(e,m=>m.id===p)).map(p=>p.props.path)),Ze=he.measure(ce,a);let l=Ze[s];Je=new We(l,r.x,r.y,o,n);let c=Math.round(Je.x.mousePct*100),u=Math.round(Je.y.mousePct*100);return window.addEventListener("mousemove",Ko,!1),window.addEventListener("mouseup",tr,!1),window.addEventListener("keydown",er,!1),Qo=!1,Xe.prepare(o,"tab-only"),qo.DoNotTransform?"transform:none":`transform:scale(${Zo},${Zo});transform-origin:${c}% ${u}%;`}function Ko(e){let t=e.clientX,o=e.clientY,r=Je,n=ue,a,i,s;r.update("x",t)&&(i=r.x.pos),r.update("y",o)&&(s=r.y.pos),i===void 0&&s===void 0||Pe==null||Pe(i,s),!(Qo||ce===void 0)&&(r.inBounds()?a=Mt(t,o,ce,Ze,r.hasIntrinsicSize(),Bt):a=Mt(r.dropX(),r.dropY(),ce,Ze),n&&(a==null||a.box!==n.box)&&(ue=null),a&&(Xe.draw(a,r),ue=a))}function er(e){e.key==="Escape"&&(ue=null,or())}function tr(){or()}function or(){if(ue){let e=Xe.hoverDropTarget||ge.getActiveDropTarget(ue);oe==null||oe(e),ue=null}else oe==null||oe();Pe=null,oe=null,ce=void 0,Xe.clear(),Bt=void 0,window.removeEventListener("mousemove",Ko,!1),window.removeEventListener("mouseup",tr,!1),window.removeEventListener("keydown",er,!1)}import Hi from"clsx";import{forwardRef as $i}from"react";import{jsx as Vi}from"react/jsx-runtime";var rr=$i(function({children:t,className:o,dropTarget:r,resizeable:n,...a},i){let s=Hi("DraggableLayout",o);return Vi("div",{className:s,ref:i,...a,children:t})}),nr="DraggableLayout";rr.displayName=nr;I(nr,rr,"container");import{useForkRef as Ns}from"@salt-ds/core";import Fs from"clsx";import{forwardRef as Hs}from"react";import{getUniqueId as Ms}from"@vuu-ui/vuu-utils";import $e,{useCallback as mt,useMemo as vn,useRef as ft,useState as ks}from"react";import ys from"clsx";import{Button as ms}from"@salt-ds/core";import{useMemo as fs,useState as hs}from"react";import{useCallback as Ie,useState as Oa}from"react";import{useCallback as Zt,useContext as Xt,useEffect as Aa,useRef as $r,useState as za}from"react";import{uuid as ir}from"@vuu-ui/vuu-utils";import ar from"react";var _i={"data-placeholder":!0,"data-resizeable":!0},Qe={},re="auto",Nt={flexBasis:0,flexGrow:1,flexShrink:1,height:re,width:re},sr={height:"width",width:"height"},lr=(e="row")=>e==="row"?["width","height","column"]:["height","width","row"],Gi=e=>typeof e=="string"&&e.endsWith("%"),U=e=>{let{style:{width:t=re,height:o=re}=Qe}=e.props,r=typeof o=="number",n=typeof t=="number";return r&&n?{height:o,width:t}:r?{height:o}:n?{width:t}:void 0};function Ft(e,t,o){let r=sr[t],{style:{[r]:n=re,...a}=Qe}=e.props;return o&&o[t]?{...a,...Nt,flexBasis:o[t],flexGrow:0,flexShrink:0}:{...a,...Nt,[r]:n}}function cr(e){let{style:{flex:t,flexGrow:o,flexShrink:r,flexBasis:n}=Qe}=e.props;return typeof t=="number"||n===0&&o===1&&r===1?!0:typeof n!="number"}function Ht(e,t,o){let r=sr[t],{style:{[t]:n=re,[r]:a=re,...i}=Qe}=e.props;return n!==re?Gi(n)?{flexBasis:0,flexGrow:1,flexShrink:1,[t]:void 0,[r]:a}:{flexBasis:n,flexGrow:0,flexShrink:0,[t]:n,[r]:a}:o&&o[t]?{...i,...Nt,flexBasis:o[t],flexGrow:0,flexShrink:0}:{...i,[r]:a}}function Le(e,t,o,r,n){let a=[],i=0,s;if(r&&n){let u,[d,p,m,h]=n;[u,s]=t==="column"?[p-r.top,r.bottom-h]:[d-r.left,r.right-m],u&&a.push(j(`${o}.${i++}`,u,{flexGrow:0,flexShrink:0}))}else s=!0;let{version:l=0,style:c}=D(e);return a.push(O(e,`${o}.${i++}`,{version:l+1,style:{...c,flexBasis:"auto",flexGrow:0,flexShrink:0}})),s&&a.push(j(`${o}.${i++}`,0,void 0,{[`data-${t}-placeholder`]:!0})),$t(t,{resizeable:!1,style:{flexBasis:"auto"}},a,o)}var Wi=(e,t)=>{if(!t)return e===0?1:0};function $t(e,t,o,r){let n=ir(),{flexFill:a,style:i,resizeable:s=!0}=t,{flexBasis:l=a?void 0:"auto"}=i,c=Wi(l,a);return ar.createElement(ae.Flexbox,{id:n,key:n,path:r,flexFill:a,style:{...i,flexDirection:e,flexBasis:l,flexGrow:c,flexShrink:c},resizeable:s},o)}var Ui={flexGrow:1,flexShrink:1};function j(e,t,o,r){let n=ir();return ar.createElement("div",{..._i,...r,"data-path":e,id:n,key:n,style:{...Ui,...o,flexBasis:t}})}import Jt from"react";import{uuid as br}from"@vuu-ui/vuu-utils";import ke from"react";import{uuid as mr}from"@vuu-ui/vuu-utils";import Ce,{cloneElement as Ji}from"react";import{useCallback as ye}from"react";var $=new Map,J=new Map,ur=e=>$.get(e),pr=e=>$.has(e),dr=(e,t)=>$.set(e,t),be=()=>{let e=ye((i,s)=>{let l=J.get(i);if(l)return s!==void 0&&l[s]!==void 0?l[s]:s!==void 0?void 0:l},[]),t=ye((i,s,l)=>{if(s===void 0)J.set(i,l);else if(J.has(i)){let c=J.get(i);J.set(i,{...c,[s]:l})}else J.set(i,{[s]:l})},[]),o=ye((i,s)=>{if(J.has(i)){if(s===void 0)J.delete(i);else if(J.get(i)[s]){let{[s]:c,...u}=J.get(i);Object.keys(u).length>0?J.set(i,u):J.delete(i)}}},[]),r=ye((i,s)=>{let l=$.get(i);if(l)return s!==void 0?l[s]:l},[]),n=ye((i,s,l)=>{if(s===void 0)$.set(i,l);else if($.has(i)){let c=$.get(i);$.set(i,{...c,[s]:l})}else $.set(i,{[s]:l})},[]),a=ye((i,s)=>{if($.has(i)){if(s===void 0)$.delete(i);else if($.get(i)[s]){let{[s]:c,...u}=$.get(i);Object.keys(u).length>0?$.set(i,u):$.delete(i)}}},[]);return{loadSessionState:e,loadState:r,saveSessionState:t,saveState:n,purgeState:a,purgeSessionState:o}};var fr=e=>e.flexDirection==="column"?["height","width"]:["width","height"],Yi={},Me=(e,t="0")=>{let[o,r]=Ke(T(e),e.props,t);return Ce.cloneElement(e,o,r)},_t=(e,t)=>{let o=T(e),[r,n]=Ke(o,e.props,"0",void 0,t);return Ji(e,r,n)},Iu=(e,t,o)=>{let[r,n]=Ke(e,t,"0",void 0,o);return{...t,...r,type:e,children:n}};function Zi(e,t,o="0",r=null,n){var g,y;let{active:a=0,"data-path":i,path:s=i,id:l,style:c}=D(n),u=T(n)===e&&o===s,d=u?l:(g=t.id)!=null?g:mr(),p=e==="Stack"?(y=t.active)!=null?y:a:void 0,m=d,h=u?c:ji(e,t,r);return Do(e)?{id:d,key:m,path:o,style:h,type:e,active:p}:{id:d,key:m,style:h,"data-path":o}}function Ke(e,t,o,r=null,n){var c,u;let a=Zi(e,t,o,r,n);if(t.layout&&!n)return[a,[pe(t.layout,`${o}.0`)]];let i=(u=n==null?void 0:n.children)!=null?u:(c=n==null?void 0:n.props)==null?void 0:c.children,l=t.dropTarget&&i?i:Xi(e,t.children,o,i);return[a,l]}function Xi(e,t,o="0",r){let n=Array.isArray(t)?t:Ce.isValidElement(t)?[t]:[];return H(e)?n.map((a,i)=>{let s=T(a),l=T(r==null?void 0:r[i]);if(!l||s===l){let[c,u]=Ke(s,a.props,`${o}.${i}`,e,r==null?void 0:r[i]);return Ce.cloneElement(a,c,u)}return r==null?void 0:r[i]}):t}var ji=(e,t,o)=>{let{style:r=Yi}=t;if(e==="Flexbox"&&(r={flexDirection:t.column?"column":"row",...r,display:"flex"}),r.flex){let{flex:n,...a}=r;r={...a,...St(typeof n=="number"?n:0)}}else o==="Stack"?r={...r,...St(1)}:o==="Flexbox"&&(r.width||r.height)&&r.flexBasis===void 0&&(r={...r,flexBasis:"auto",flexGrow:0,flexShrink:0});return r};function pe({id:e=mr(),type:t,children:o,props:r,state:n},a){let i=t.match(/^[a-z]/)?t:ae[t];if(i===void 0)throw Error(`layoutUtils unable to create component from JSON, unknown type ${t}`);return n&&dr(e,n),Ce.createElement(i,{id:e,...r,key:e,path:a},o?o.map((s,l)=>pe(s,`${a}.${l}`)):void 0)}function hr(e){return gr(e)}function gr(e){let t=T(e),{id:o,children:r,type:n,...a}=D(e),i=pr(o)?ur(o):void 0;return{id:o,type:t,props:qi(a),state:i,children:Ce.Children.map(r,gr)}}function qi(e){if(e){let{path:t,...o}=e,r={};for(let[n,a]of Object.entries(o))r[n]=Vt(a);return r}}function Vt(e){if(typeof e=="string"||typeof e=="number"||typeof e=="boolean")return e;if(Array.isArray(e))return e.map(Vt);if(typeof e=="object"&&e!==null){let t={};for(let[o,r]of Object.entries(e))t[o]=Vt(r);return t}}var yr=(e,t,o)=>{if(t&&o){let r=Y(o,t);if(r){let{id:n}=D(r),a=T(r);return{parentContainerId:n,parentContainerType:a}}return{parentContainerType:"Stack",parentContainerId:"blah"}}},xe=(e,t,o=[])=>{var n,a,i;let r=(i=(n=e.props)==null?void 0:n.title)!=null?i:(a=e.props)==null?void 0:a["data-tab-title"];if(r)return r;{let s=t;do r=`Tab ${++s}`;while(o.includes(r));return r}};function xr(e,t){var i;let o=e.props.children,r=o.length,{index:n=-1,positionRelativeToTab:a="after"}=t.tab||{};return n===-1||n>=r?[o[r-1],"after"]:[(i=o[n])!=null?i:null,a]}function et(e,t,o){let{active:r,children:n=[],path:a}=D(e),i=P(t,"path"),{idx:s,finalStep:l}=Z(a,i,!0),[c,u]=l?ea(e,n,o):[r,n==null?void 0:n.map((p,m)=>m===s?et(p,t,o):p)],d=T(e)==="Stack"?Array.isArray(c)?c[0]:c:r;return ke.cloneElement(e,{active:d},u)}var Qi=(e,t,o,r)=>e==="Stack"?xe(t,o,r):void 0,Ki=e=>e.map(t=>t.props.title);function ea(e,t,o){let r=P(e,"path"),n=t==null?void 0:t.length,{id:a=br(),title:i=Qi(T(e),o,n!=null?n:0,Ki(t))}=D(o);return n?[n,t.concat(O(o,`${r}.${n}`,{id:a,key:a,title:i}))]:[0,[O(o,`${r}.0`,{id:a,title:i})]]}function tt(e,t,o,r,n,a,i){let{active:s,children:l,path:c}=D(e),u=P(t,"path"),{idx:d,finalStep:p}=Z(c,u),[m,h]=p?ta(e,l,d,o,r,n,a,i):[s,l.map((y,f)=>f===d?tt(y,t,o,r,n,a,i):y)],g=T(e)==="Stack"?m:s;return ke.cloneElement(e,{active:g},h)}function ta(e,t,o,r,n,a,i,s){let l=U(r);return l!=null&&l.width&&(l!=null&&l.height)?ra(e,t,o,r,n,i,s):vr(e,t,o,r,n,(a==null?void 0:a.width)||(a==null?void 0:a.height),i)}var oa=(e,t,{top:o,right:r,bottom:n,left:a},[i,s,l,c])=>{if(e==="column"&&t==="before")return s-o;if(e==="column")return n-c;if(e==="row"&&t==="before")return i-a;if(e==="row")return r-l};function ra(e,t,o,r,n,a,i){let{style:{flexDirection:s}}=D(e),[l,c,u]=lr(s),{[c]:d,[l]:p}=U(r),m=P(t[o],"path"),h=oa(s,n,a,i),[g,y]=d<a[c]?[Le(r,u,m,a,i),p]:[r,void 0],f=h?j(m,h,{flexGrow:0,flexShrink:0}):void 0;return d>a[c]&&(t=t.map(x=>{if(P(x,"placeholder"))return x;{let{[c]:R}=U(x);return R&&R<d?Le(x,u,P(x,"path")):x}})),vr(e,t,o,g,n,y,a,f)}function vr(e,t,o,r,n,a,i,s){let l=P(e,"path"),c=0,u=!t||t.length===0?[r]:t.reduce((d,p,m)=>{if(o===m){let[h,g]=na(e,p,r,i);n==="before"?s?d.push(s,g,h):d.push(g,h):s?d.push(h,g,s):d.push(h,g),c=d.indexOf(g)}else d.push(p);return d},[]).map((d,p)=>p<c?d:O(d,`${l}.${p}`));return[c,u]}function na(e,t,o,r){let n=br(),{version:a=0}=D(o);if(a+=1,T(e)==="Flexbox"){let[i]=fr(e.props.style),s=6,l={[i]:(r[i]-s)/2},c=Ht(t,i,l),u=Ht(o,i,l);return[ke.cloneElement(t,{style:c}),ke.cloneElement(o,{id:n,version:a,style:u})]}else{let{style:{left:i,top:s,flex:l,...c}={left:void 0,top:void 0,flex:void 0}}=D(o);return[t,ke.cloneElement(o,{id:n,version:a,style:{...c,flex:"1 1 0px"}})]}}import{cloneElement as sa}from"react";import ot from"react";var ve={ADD:"add",BLUR:"blur",BLUR_SPLITTER:"blur-splitter",DRAG_START:"drag-start",DRAG_STARTED:"drag-started",DRAG_DROP:"drag-drop",FOCUS:"focus",FOCUS_SPLITTER:"focus-splitter",INITIALIZE:"initialize",LAYOUT_RESIZE:"layout-resize",MAXIMIZE:"maximize",MINIMIZE:"minimize",REMOVE:"remove",REPLACE:"replace",RESTORE:"restore",SAVE:"save",SET_TITLE:"set-title",SPLITTER_RESIZE:"splitter-resize",SWITCH_TAB:"switch-tab",TEAR_OUT:"tear-out"};function wr(e,{target:t,replacement:o}){return Gt(e,t,o)}function Gt(e,t,o){let r=P(t,"path"),n=P(t,"resizeable"),{style:a}=D(t),i=Me(ot.cloneElement(o,{resizeable:n,style:{...a,...o.props.style}}),r);return V(e,t,i)}function V(e,t,o,r){if(e===t)return o;let{idx:n,finalStep:a}=Z(P(e,"path"),P(t,"path")),i=e.props.children.slice();return a?r?r===ve.MINIMIZE?i[n]=ia(e,i[n]):r===ve.RESTORE&&(i[n]=aa(i[n])):i[n]=o:i[n]=V(i[n],t,o,r),ot.cloneElement(e,void 0,i)}function ia(e,t){let{style:o}=D(e),{style:r}=D(t),{width:n,height:a,flexBasis:i,flexShrink:s,flexGrow:l,...c}=r,u={width:n,height:a,flexBasis:i,flexShrink:s,flexGrow:l},d={...c,flexBasis:0,flexGrow:0,flexShrink:0},p=o.flexDirection==="row"?"vertical":o.flexDirection==="column"?"horizontal":!1;return p?ot.cloneElement(t,{collapsed:p,restoreStyle:u,style:d}):t}function aa(e){let{style:t,restoreStyle:o}=D(e),{flexBasis:r,flexShrink:n,flexGrow:a,...i}=t,s={...i,...o};return ot.cloneElement(e,{collapsed:!1,style:s,restoreStyle:void 0})}function Rr(e,{fromIndex:t,path:o,toIndex:r}){let n=B(e,o,!0),{children:a}=D(n),i=la(a,t,r),s=sa(n,void 0,i);return V(e,n,s)}function la(e,t,o){let r=e.slice(),[n]=r.splice(t,1);return o===-1?r.concat(n):(r.splice(o,0,n),r)}var N={ADD:"add",DRAG_START:"drag-start",DRAG_DROP:"drag-drop",LAYOUT_RESIZE:"layout-resize",MAXIMIZE:"maximize",MINIMIZE:"minimize",MOVE_CHILD:"move-child",QUERY:"query",REMOVE:"remove",REPLACE:"replace",RESTORE:"restore",SAVE:"save",SET_PROP:"set-prop",SET_PROPS:"set-props",SET_TITLE:"set-title",SPLITTER_RESIZE:"splitter-resize",SWITCH_TAB:"switch-tab",TEAROUT:"tearout"},ip=e=>["switch-active-layout","open-layout","close-layout","rename-layout"].includes(e),ap=e=>["switch-active-tab","edit-feature-title","save-feature-props","remove-component","resize-component","drag-drop-operation"].includes(e);import de from"react";function Wt(e,{path:t}){let o=B(e,t),r=Y(e,t);if(r===null)return e;let{children:n}=D(r);if(n.length>1&&T(r)!=="Stack"&&Dr(n,t)){let{style:{flexBasis:a,display:i,flexDirection:s,...l}}=D(r),c=P(r,"path"),u=V(e,r,j(c,a,l));for(;(r=Y(u,c))&&P(r,"path")!=="0";){let{children:d}=D(r);if(Dr(d)){c=P(r,"path");let{style:{flexBasis:p,display:m,flexDirection:h,...g}}=D(r);u=V(e,r,j(c,p,g))}else if(da(d))u=Pr(e,r);else break}return u}return Sr(e,o)}function Sr(e,t){let o=D(e),{children:r,path:n,preserve:a}=o,{active:i,id:s}=o,{idx:l,finalStep:c}=Z(n,P(t,"path")),u=T(e),d=r.slice();if(c){if(d.splice(l,1),i!==void 0&&i>=l&&(i=Math.max(0,i-1)),d.length===0&&a&&u==="Stack"){let{path:p,style:{flexBasis:m}}=D(t),h=s==="main-tabs"?pe({props:{style:{flexGrow:1,flexShrink:1,flexBasis:m},title:"Tab 1"},type:"Placeholder"},p):j(p,m);d.push(h)}else if(d.length===1&&!a&&n!=="0"&&u.match(/Flexbox|Stack/))return ca(e,d[0]);!d.some(ua)&&d.some(Tr)&&(d=pa(d))}else d[l]=Sr(d[l],t);return d=d.map((p,m)=>O(p,`${n}.${m}`)),de.cloneElement(e,{active:i},d)}function ca(e,t){let o=T(e),{path:r,style:{flexBasis:n,flexGrow:a,flexShrink:i,width:s,height:l}}=D(e),c=O(t,r);if(r==="0")c=de.cloneElement(c,{style:{...t.props.style,width:s,height:l}});else if(o==="Flexbox"){let u=e.props.style.flexDirection==="column"?"height":"width",{style:{[u]:d,...p}}=c.props;c=de.cloneElement(c,{flexFill:void 0,style:{...p,flexGrow:a,flexShrink:i,flexBasis:n,width:s,height:l}})}return c}var ua=e=>e.props.style.flexGrow>0,Tr=e=>{let{width:t,height:o,flexGrow:r}=e.props.style;return r===0&&typeof t!="number"&&typeof o!="number"},pa=e=>e.map(t=>Tr(t)?de.cloneElement(t,{style:{...t.props.style,flexGrow:1}}):t),da=e=>{if(e&&e.length>0){let t=P(e[0],"placeholder"),o=!1;for(let r=1;r<e.length;r++){if(o=P(e[r],"placeholder"),t&&o)return!0;t=o}}},Pr=(e,t)=>{let{children:o,path:r}=D(e),{idx:n,finalStep:a}=Z(r,P(t,"path")),i=o.slice();return a?i[n]=ma(t):i[n]=Pr(i[n],t),i=i.map((s,l)=>O(s,`${r}.${l}`)),de.cloneElement(e,void 0,i)},ma=e=>{let{children:t}=D(e),o=[],r=[];for(let a=0;a<t.length;a++)P(t[a],"placeholder")?r.push(t[a]):(r.length===1?o.push(r.pop()):r.length>0&&(o.push(Er(r)),r.length=0),o.push(t[a]));r.length===1?o.push(r.pop()):r.length>0&&o.push(Er(r));let n=P(e,"path");return de.cloneElement(e,void 0,o.map((a,i)=>O(a,`${n}.${i}`)))},Er=([e,...t])=>{let o=P(e,"style"),{flexBasis:r,flexGrow:n,flexShrink:a}=o;for(let{props:{style:i}}of t)r+=i.flexBasis,n=Math.max(n,i.flexGrow),a=Math.max(a,i.flexShrink);return de.cloneElement(e,{style:{...o,flexBasis:r,flexGrow:n,flexShrink:a}})},Dr=(e,t)=>e.every(o=>P(o,"placeholder")||t&&P(o,"path")===t);import Ut from"react";function Lr(e,{path:t,size:o}){let r=B(e,t,!0),{style:n}=D(r),a={...n,width:o},i=Ut.cloneElement(r,{style:a});return V(e,r,i)}function Cr(e,{path:t,sizes:o}){let r=B(e,t,!0),{children:n,style:a}=D(r),i=a.flexDirection==="column"?"height":"width",s=fa(n,o,i),l=Ut.cloneElement(r,void 0,s);return V(e,r,l)}function fa(e,t,o){return e.map((r,n)=>{let{style:{[o]:a,flexBasis:i}}=D(r),s=t[n],{currentSize:l,flexBasis:c}=s,d=l!==void 0?s.currentSize:c;return d===void 0||a===d||i===d?r:Ut.cloneElement(r,{style:ha(r.props.style,o,d)})})}function ha(e,t,o){let r=typeof e[t]=="number",{flexShrink:n=1,flexGrow:a=1}=e;return{...e,[t]:r?o:"auto",flexBasis:r?"auto":o,flexShrink:n,flexGrow:a}}import{uuid as ga}from"@vuu-ui/vuu-utils";import rt from"react";var Mr=e=>{let[t]=T(e);return t===t.toLowerCase()};function Ae(e,t,o,r,n,a){let{children:i,path:s}=D(e),l=P(t,"path"),{idx:c,finalStep:u}=Z(s,l),d=u?ya(e,i,t,o,r,n,a):i.map((p,m)=>m===c?Ae(p,t,o,r,n,a):p);return rt.cloneElement(e,void 0,d)}function ya(e,t,o,r,n,a,i){let s=U(r);if(s!=null&&s.width&&(s!=null&&s.height)){if(a===void 0||i===void 0)throw Error("wrap-layout-element, updateChildren clientRect and dropRect must both be available");return xa(t,o,r,n,a,i)}return ba(e,t,o,r,n)}function ba(e,t,o,r,n){var v;let{version:a=0}=D(r),{path:i,title:s}=D(o),{type:l,flexDirection:c,showTabs:u}=Ar(n),[d,p,m]=va(l,o,r,c,n),h=kr(n),g=h?1:0,y={resizeable:!0,style:m,version:a+1},x={[Mr(o)?"data-resizeable":"resizeable"]:!0,style:p},R=l==="Stack"?{showTabs:u}:void 0,w=l==="Flexbox"?{splitterSize:(v=T(e)==="Flexbox"&&e.props.splitterSize)!=null?v:void 0}:void 0,E=ga(),b=rt.createElement(ae[l],{active:g,id:E,key:E,path:P(o,"path"),flexFill:P(o,"flexFill"),...w,...R,style:d,title:s,resizeable:P(o,"resizeable")},h?[O(o,`${i}.0`,x),Me(rt.cloneElement(r,y),`${i}.1`)]:[Me(rt.cloneElement(r,y),`${i}.0`),O(o,`${i}.1`,x)]);return t.map(S=>S===o?b:S)}function xa(e,t,o,r,n,a){let{flexDirection:i}=Ar(r),s=i==="column"?"row":"column",l=kr(r),[c,u,d,p]=a,[m,h]=i==="column"?[u-n.top,n.bottom-p]:[c-n.left,n.right-d],g=P(t,"path"),y=0,f=Mr(t)?"data-resizeable":"resizeable",x=[];m&&x.push(l?O(t,`${g}.${y++}`,{[f]:!0,style:{flexBasis:m,flexGrow:1,flexShrink:1}}):j(`${g}.${y++}`,m,{flexGrow:0,flexShrink:0})),x.push(Le(o,s,`${g}.${y++}`,n,a)),h&&x.push(l?j(`${g}.${y++}`,0):O(t,`${g}.${y++}`,{[f]:!0,style:{flexBasis:0,flexGrow:1,flexShrink:1}}));let R=$t(i,t.props,x,g);return e.map(w=>w===t?R:w)}function va(e,t,o,r,n){let a={...t.props.style,flexDirection:r},i=e==="Flexbox"&&r==="column"?"height":"width",s=Ft(o,i,n),l=Ft(t,i);return[a,l,s]}var kr=e=>{var t;return e.position.SouthOrEast?!0:((t=e==null?void 0:e.tab)==null?void 0:t.positionRelativeToTab)==="before"?!1:!!e.position.Header};function Ar(e){return e.position.Header?{type:"Stack",flexDirection:"column",showTabs:!0}:{type:"Flexbox",flexDirection:e.position.EastOrWest?"row":"column"}}var Nr=(e,t)=>{switch(t.type){case N.ADD:return Sa(e,t);case N.DRAG_DROP:return Da(e,t);case N.MAXIMIZE:return Ea(e,t);case N.REMOVE:return Wt(e,t);case N.REPLACE:return wr(e,t);case N.SET_PROP:return zr(e,t);case N.SET_PROPS:return Ra(e,t);case N.SET_TITLE:return zr(e,{type:"set-prop",path:t.path,propName:"title",propValue:t.title});case N.SPLITTER_RESIZE:return Cr(e,t);case N.LAYOUT_RESIZE:return Lr(e,t);case N.SWITCH_TAB:return wa(e,t);case N.MOVE_CHILD:return Rr(e,t);default:return e}},wa=(e,{path:t,nextIdx:o})=>{let r=B(e,t,!0),n=Jt.cloneElement(r,{active:o});return V(e,r,n)},zr=(e,{path:t,propName:o,propValue:r})=>{let n=B(e,t,!0),a=Jt.cloneElement(n,{[o]:r});return V(e,n,a)},Ra=(e,{path:t,props:o})=>{let r=B(e,t,!0),n=Jt.cloneElement(r,o);return V(e,r,n)},Ea=(e,{path:t,type:o})=>{if(t){let r=B(e,t,!0);return V(e,r,r,o)}else return e},Da=(e,t)=>{var h,g;let{draggedReactElement:o,dragInstructions:r,dropTarget:n}=t,a=n.component,{pos:i}=n,s=((h=i==null?void 0:i.position)==null?void 0:h.Header)&&T(a)==="Stack",{id:l,version:c}=D(o),u=U(o),d;if(s){let[y,f]=xr(a,i);y===void 0?d=et(e,a,o):d=tt(e,y,o,f)}else!u&&((g=i==null?void 0:i.position)!=null&&g.Centre)?d=Gt(e,a,o):d=Ta(e,n,o);if(r.DoNotRemove)return d;let p=Q(d,y=>y.id===l&&y.version===c),m=P(p,"path");return Wt(d,{path:m,type:"remove"})},Sa=(e,{path:t,component:o})=>et(e,B(e,t),o),Ta=(e,t,o)=>{let{component:r,pos:n,clientRect:a,dropRect:i}=t,s=r,l=P(s,"path");if(l==="0.0")return Ae(e,s,o,n);let c=Y(e,l);if(Ir(n,c)){let u=n.position.SouthOrEast?"after":"before";return tt(e,s,o,u,n,a,i)}if(!Ir(n,c))return Ae(e,s,o,n,a,i);if(H(T(c)))return Ae(e,s,o,n);throw Error(`no support right now for position = ${n.position}`)},Ir=(e,t)=>e.position.Centre?Or(t)||Br(t):e.position.NorthOrSouth?Br(t):e.position.EastOrWest?Or(t):!1,Br=e=>T(e)==="Flexbox"&&e.props.style.flexDirection==="column",Or=e=>T(e)==="Flexbox"&&e.props.style.flexDirection!=="column";import{createContext as Pa}from"react";var La=e=>console.log(`dispatch ${e.type}, have you forgotten to provide a LayoutProvider ?`),ze=Pa({dispatchLayoutProvider:La,version:-1});import{useCallback as nt,useRef as Yt}from"react";var Ca={},Fr=[0,0],Ma=(e,t,o)=>{let r=document.createElement("div");r.className="vuuSimpleDraggableWrapper",r.classList.add("vuuSimpleDraggableWrapper","salt-theme","salt-density-medium"),r.dataset.dragging="true";let n=o!=null?o:document.createElement("div");n.id=t,r.appendChild(n),document.body.appendChild(r);let a=`top:${e.top}px;left:${e.left}px;width:${e.width}px;height:${e.height}px;`;return[r,a,e.left,e.top]},ka=e=>{let{offsetParent:t}=e;if(t===null)return Fr;{let{left:o,top:r}=t.getBoundingClientRect();return[o,r]}},Hr=(e,t,o)=>{let r=Yt(),n=Yt(),a=Yt(),i=nt((u,d)=>{if(n.current&&a.current){let{dragOffsets:[p,m],targetPosition:h}=n.current,g=typeof u=="number"?u-p:h.left,y=typeof d=="number"?d-m:h.top;(g!==h.left||y!==h.top)&&(n.current.targetPosition.left=g,n.current.targetPosition.top=y,a.current.style.top=y+"px",a.current.style.left=g+"px")}},[]),s=nt(u=>{if(n.current){let{dragInstructions:d,payload:p,originalCSS:m}=n.current;u&&t({type:"drag-drop",draggedReactElement:p,dragInstructions:d,dropTarget:u}),a.current&&(!u&&d.DriftHomeIfNoDropTarget?(console.log("drift back to start"),document.body.removeChild(a.current)):d.RemoveDraggableOnDragEnd?document.body.removeChild(a.current):(a.current.style.cssText=m,delete a.current.dataset.dragging)),r.current=void 0,n.current=void 0,a.current=void 0}},[t]),l=nt(u=>{if(r.current){let{payload:d,dragContainerPath:p,dragElement:m,dragRect:h,instructions:g=Ca,path:y}=r.current,{current:f}=e,x={x:u.clientX,y:u.clientY},R=d!=null?d:B(f,y,!0),{id:w}=R.props,E=U(R),b="",v="",S="",C=-1,L=-1,M=Fr,z=document.getElementById(w);if(z===null)[z,v,C,L]=Ma(h,w,m);else{M=ka(z);let[A,k]=M,{width:G,height:W,left:ne,top:ie}=z.getBoundingClientRect();C=ne-A,L=ie-k,v=`width:${G}px;height:${W}px;left:${C}px;top:${L}px;z-index: 100;background-color:#ccc;opacity: 0.6;`,z.dataset.dragging="true",b=z.style.cssText}S=Ot.initDrag(e.current,p,h,x,{drag:i,drop:s},E),z.style.cssText=v+S,a.current=z,n.current={payload:R,originalCSS:b,dragRect:h,dragOffsets:M,dragInstructions:g,targetPosition:{left:C,top:L}}}},[i,s,e]);return nt(u=>{let{evt:d,...p}=u;r.current={...p,dragContainerPath:Et(e.current,o)},Ot.handleMousedown(d,l,p.instructions)},[l,o,e])};import{jsx as Wr}from"react/jsx-runtime";var Vr=e=>e.dropTarget,Ia=e=>["drag-drop","remove","set-title","splitter-resize","switch-tab"].includes(e.type),_r=e=>{switch(e.type){case"switch-tab":return e.id==="main-tabs"?"switch-active-layout":"switch-active-tab";case"save":return"save-feature-props";case"drag-drop":return"drag-drop-operation";case"remove":return"remove-component";case"splitter-resize":return"resize-component";case"set-title":return"edit-feature-title";default:throw Error("unknown layout action")}},Sd=()=>{let e=Ba();return Wr("div",{children:`Context: ${e} `})},Td=e=>{let{children:t,createNewChild:o,pathToDropTarget:r,layout:n,onLayoutChange:a}=e,i=$r(void 0),s=$r(t),[,l]=za(null),c=Zt((m,h)=>{if(a){let g=Q(m,Vr)||i.current,f=T(g)==="DraggableLayout"?D(g).children[0]:g,x=hr(f);a(x,h)}},[a]),u=Zt((m,h=!1)=>{let g=Nr(i.current,m);g!==i.current&&(i.current=g,l({}),!h&&Ia(m)&&c(g,_r(m)))},[l,c]),d=Zt(m=>{switch(m.type){case"drag-start":{p(m);break}case"save":{c(i.current,_r(m));break}case"query":if(m.query==="PARENT_CONTAINER")return yr(m.query,m.path,i.current);break;default:{u(m);break}}},[u,c]),p=Hr(i,d,r);return Aa(()=>{if(n){let m=Q(i.current,Vr);if(m){let h=Mo(m),g=pe(n,`${m.props.path}.0`),y=h?{type:N.REPLACE,target:h,replacement:g}:{type:N.ADD,path:m.props.path,component:g};u(y,!0)}else if(n.id===P(i.current,"id")){let h=pe(n,"0"),g={type:N.REPLACE,target:i.current,replacement:h};u(g,!0)}}},[u,n]),i.current===void 0?i.current=_t(t):t!==s.current&&(i.current=_t(t,i.current),s.current=t),Wr(ze.Provider,{value:{createNewChild:o,dispatchLayoutProvider:d,version:0},children:i.current})},q=()=>{let{dispatchLayoutProvider:e}=Xt(ze);return e},Gr=()=>{let{createNewChild:e}=Xt(ze);return e},Ba=()=>{let{version:e}=Xt(ze);return e};var it=(e,t,o,r)=>{var y;let{loadSessionState:n,purgeSessionState:a,purgeState:i,saveSessionState:s}=be(),[l,c]=Oa((y=n(e,"contributions"))!=null?y:[]),u=q(),d=Ie((f,x)=>{let R=l.concat([{location:f,content:x}]);s(e,"contributions",R),c(R)},[l,e,s]),p=Ie(()=>{a(e,"contributions"),c([])},[e,a]),m=Ie(()=>{let f=n(e,"data-source");f&&f.unsubscribe(),a(e),i(e),u({type:"remove",path:o})},[u,e,n,a,i,o]),h=Ie(async(f,x,R)=>{var E;f.stopPropagation();let w=(E=t.current)==null?void 0:E.getBoundingClientRect();return new Promise((b,v)=>{u({type:"drag-start",evt:f,path:x===void 0?o:`${o}.${x}`,dragRect:w,preDragActivity:R,dropTargets:r,resolveDragStart:b,rejectDragStart:v})})},[t,u,o,r]);return[Ie(async(f,x)=>{var w;let{type:R}=f;switch(R){case"maximize":case"minimize":case"restore":return u({type:R,path:(w=f.path)!=null?w:o});case"remove":return m();case"mousedown":return h(x,f.index,f.preDragActivity);case"add-toolbar-contribution":return d(f.location,f.content);case"remove-toolbar-contribution":return p();case"query":return u({type:R,path:f.path,query:f.query});default:return}},[u,o,m,h,d,p]),l]};import{useId as ns}from"@vuu-ui/vuu-utils";import{useForkRef as is}from"@salt-ds/core";import as from"clsx";import to,{forwardRef as ss,useCallback as ls,useMemo as cs,useRef as pn,useState as us}from"react";import{EditableLabel as Na,IconButton as Fa}from"@vuu-ui/vuu-ui-controls";import{default as Ha,default as $a}from"clsx";import{cloneElement as Ur,useRef as Va,useState as Jr}from"react";import{jsx as Be}from"react/jsx-runtime";var jt="vuuHeader",Yr=({className:e,contributions:t,collapsed:o,closeable:r,onEditTitle:n,orientation:a="horizontal",style:i,title:s="Untitled"})=>{let l=Va(null),[c,u]=Jr(s),[d,p]=Jr(!1),m=Zr(),h=L=>m==null?void 0:m({type:"remove"},L),g=()=>{var L;(L=l.current)==null||L.focus()},y=L=>{L.stopPropagation()},x=Ha(jt,e,`${jt}-${o||a}`),R=()=>{p(!0)},w=L=>{L.key==="Enter"&&p(!0)},E=(L="",M="",z=!0,A=!1)=>{var k;p(!1),A?u(L):M!==L&&(u(M),n==null||n(M)),z===!1&&((k=l.current)==null||k.focus())},b=L=>{m==null||m({type:"mousedown"},L)},v=[],S=[],C=[];return t==null||t.forEach((L,M)=>{switch(L.location){case"pre-title":v.push(Ur(L.content,{key:M}));break;default:S.push(Ur(L.content,{key:M}))}}),s&&v.push(Be(Na,{className:`${jt}-title`,editing:d,value:c,onChange:u,onMouseDownCapture:g,onEnterEditMode:R,onExitEditMode:E,onKeyDown:w,ref:l,tabIndex:0},"title")),r&&C.push(Be(Fa,{icon:"close",onClick:h,onMouseDown:y,variant:"secondary"},"close")),S.length>0&&v.push(Be("div",{className:"vuuTooltrayProxy","data-align":"end",children:S},"contributions")),C.length>0&&v.push(Be("div",{className:"vuuTooltrayProxy","data-align":"end",children:C},"actions")),Be("div",{className:$a("vuuToolbarProxy",x),style:i,onMouseDown:b,children:v})};import{useCallback as me,useMemo as Xr}from"react";var jr=({id:e,rootRef:t,path:o,dropTargets:r,title:n})=>{let a=q(),{loadState:i,loadSessionState:s,purgeState:l,saveState:c,saveSessionState:u}=be(),[d,p]=it(e,t,o,r),m=Xr(()=>{var b;return(b=i("view-title"))!=null?b:n},[i,n]),h=me(b=>{o&&a({type:"set-title",path:o,title:b})},[a,o]),g=Xr(()=>i(e),[e,i]),y=me(b=>i(e,b),[e,i]),f=me(b=>{l(e,b),a({type:"save"})},[e,a,l]),x=me((b,v)=>{c(e,v,b),a({type:"save"})},[e,a,c]),R=me(b=>s(e,b),[e,s]),w=me((b,v)=>u(e,v,b),[e,u]),E=me(({type:b,...v})=>{let{[b]:S}=v;x(S,b)},[x]);return{contributions:p,dispatchViewAction:d,load:y,loadSession:R,onConfigChange:E,onEditTitle:h,purge:f,restoredState:g,save:x,saveSession:w,title:m}};import{useCallback as on,useEffect as Ya,useRef as Kt,useState as Za}from"react";import{useCallback as _a,useLayoutEffect as qr,useRef as Ga}from"react";var Kr=["height","width"],nm=["height"],im=["width"],fe=new WeakMap,en=(e,t,o)=>{switch(o){case"height":return t.height;case"scrollHeight":return e.scrollHeight;case"scrollWidth":return e.scrollWidth;case"width":return t.width;default:return 0}},Qr=new ResizeObserver(e=>{for(let t of e){let{target:o,contentRect:r}=t,n=fe.get(o);if(n){let{onResize:a,measurements:i}=n,s=!1;for(let[l,c]of Object.entries(i)){let u=en(o,r,l);u!==c&&(s=!0,i[l]=u)}s&&a&&a(i)}}});function at(e,t,o,r=!1){let n=Ga(t),a=_a(i=>{let s=i.getBoundingClientRect();return n.current.reduce((l,c)=>(l[c]=en(i,s,c),l),{})},[]);qr(()=>{let i=e.current,s=!1;async function l(){fe.set(i,{measurements:{}}),s=!1;let{fonts:c}=document;if(c&&await c.ready,!s){let u=fe.get(i);if(u){let d=a(i);u.measurements=d,Qr.observe(i),r&&o(d)}}}if(i){if(fe.has(i))throw Error("useResizeObserver attemping to observe same element twice");l()}return()=>{i&&fe.has(i)&&(Qr.unobserve(i),fe.delete(i),s=!0)}},[e,a,r,o]),qr(()=>{let i=e.current,s=fe.get(i);if(s){if(n.current!==t){n.current=t;let l=a(i);s.measurements=l}s.onResize=o}},[t,a,e,o])}function Wa(e,t){let o=document.body.querySelector(`.${e}`),r={get:function(n,a){let i=n.getPropertyValue(`--${e}-breakpoint-${a}`);return i?parseInt(i):void 0}};return o?new Proxy(getComputedStyle(o),r):t!=null?t:{}}var Ua=([,e],[,t])=>t-e,Qt=e=>Object.entries(e).sort(Ua).map(([t,o],r,n)=>[t,o,r<n.length-1?n[r+1][1]:9999]),qt=null,Ja=(e="salt")=>{let{xs:t,sm:o,md:r,lg:n,xl:a}=Wa(e);return Qt({xs:t,sm:o,md:r,lg:n,xl:a})},tn=e=>(qt===null&&(qt=Ja(e)),qt);var Xa=[],rn=({breakPoints:e,smallerThan:t},o)=>{let[r,n]=Za(t?!1:"lg"),a=Kt(document.body),i=Kt(e?Qt(e):tn()),s=Kt("lg"),l=on(u=>{if(i.current){for(let[d,p]of i.current)if(u>=p)return d}},[i]),c=on(u=>{if(t){let d=i.current.find(([p])=>p===t);if(d){let[,,p]=d;return u<p}}else return l(u);return u},[t,l]);return at(o||a,i.current?["width"]:Xa,({width:u})=>{let d=c(u);d!==s.current&&(s.current=d,n(d))},!0),Ya(()=>{let u=o||a;if(u.current){let d=s.current;if(i.current){let{clientWidth:p}=u.current,m=c(p);s.current=m,m!==d&&n(m)}}},[n,c,o]),r};var nn="data-collapsible",ja={[nn]:!0,"data-pad-start":!0,"data-pad-end":!0},qa=e=>{var t;return(t=ja[e])!=null?t:!1},Qa=e=>e===nn,Ka={dynamic:"dynamic",instant:"instant",true:"instant"},es=e=>{var t;return(t=Ka[e])!=null?t:"none"},fm=e=>Object.keys(e).reduce((t,o)=>{let[r,n]=t;if(qa(o)){let a=Qa(o)?es(e[o]):e[o];r[o]=a,n[o]=void 0}return t},[{},{}]);import{useCallback as an,useRef as sn}from"react";var ts=[],ln=({mainRef:e,resize:t="responsive",rootRef:o})=>{let r=t==="defer",n=sn({}),a=sn(),i=an(()=>{e.current&&(e.current.style.height=n.current.height+"px",e.current.style.width=n.current.width+"px"),a.current=void 0},[e]),s=an(({height:l,width:c})=>{n.current.height=l,n.current.width=c,a.current!==null&&clearTimeout(a.current),a.current=window.setTimeout(i,40)},[i]);at(o,r?Kr:ts,s,r)};import os,{useContext as cn}from"react";var rs={dispatch:null},st=os.createContext(rs),Zr=()=>{var t;let e=cn(st);return(t=e==null?void 0:e.dispatch)!=null?t:null},un=()=>cn(st);import{jsx as eo,jsxs as ds}from"react/jsx-runtime";var Oe="vuuView",ps=(e,t)=>e&&t?{...e,...t}:e||t,dn=ss(function(t,o){let{Header:r=Yr,children:n,className:a,collapsed:i,closeable:s,"data-path":l,"data-resizeable":c,dropTargets:u,expanded:d,flexFill:p,id:m,header:h,orientation:g="horizontal",path:y=l,resize:f="responsive",resizeable:x=c,tearOut:R,style:w={},title:E,...b}=t,v=ns(m),S=pn(null),C=pn(null),[L,M]=us(),{contributions:z,dispatchViewAction:A,load:k,loadSession:G,onConfigChange:W,onEditTitle:ne,purge:ie,restoredState:bo,save:xo,saveSession:vo,title:xt}=jr({id:v,rootRef:S,path:y,dropTargets:u,title:E});ln({mainRef:C,resize:f,rootRef:S});let wo=ls(Un=>{M(Un)},[]),_n=()=>to.isValidElement(n)&&(bo||L)?to.cloneElement(n,ps(bo,L)):n,Gn=cs(()=>({dispatch:A,id:v,path:y,title:xt,load:k,loadSession:G,onConfigChange:W,purge:ie,save:xo,saveSession:vo,setComponentProps:wo}),[A,v,k,G,W,y,ie,xo,vo,wo,xt]),Wn=typeof h=="object"?h:{};return eo("div",{...b,className:as(Oe,a,{[`${Oe}-collapsed`]:i,[`${Oe}-expanded`]:d,[`${Oe}-resize-defer`]:f==="defer"}),"data-resizeable":x,id:v,ref:is(o,S),style:w,tabIndex:-1,children:ds(st.Provider,{value:Gn,children:[h?eo(r,{...Wn,collapsed:i,contributions:z,expanded:d,closeable:s,onEditTitle:ne,orientation:g,tearOut:R,title:xt}):null,eo("div",{className:`${Oe}-main`,ref:C,children:_n()})]})})});dn.displayName="View";var we=to.memo(dn);we.displayName="View";I("View",we,"view");import{Fragment as gs,jsx as oo,jsxs as mn}from"react/jsx-runtime";var lt="vuuLayoutStartPanel",fn=e=>{let{dispatch:t,path:o}=un(),[r,n]=hs();return fs(()=>{t==null||t({type:"query",path:o,query:"PARENT_CONTAINER"}).then(i=>{(i==null?void 0:i.parentContainerId)==="main-tabs"?n("initial"):n("nested")})},[t,o]),r===void 0?null:mn("div",{...e,className:lt,children:[r==="initial"?mn(gs,{children:[oo("header",{className:`${lt}-title`,children:"Start by adding a table"}),oo("div",{className:`${lt}-text`,children:"To add a table, drag any of the Vuu Tables to this area or click the button below"})]}):null,oo(ms,{className:`${lt}-addButton`,"data-icon":"add",variant:"cta"})]})};import{Fragment as vs,jsx as ct}from"react/jsx-runtime";var bs="vuuPlaceholder",xs=({showStartMenu:e=!0})=>ct(vs,{children:e?ct(fn,{}):null}),Re=({className:e,showStartMenu:t,...o})=>{let r=ys(bs,e);return ct(we,{...o,className:r,"data-placeholder":!0,resizeable:!0,children:ct(xs,{showStartMenu:t})})};Re.displayName="Placeholder";I("Placeholder",Re);import ws from"clsx";import Rs,{useCallback as Ne,useRef as ut,useState as Es}from"react";import{jsx as hn}from"react/jsx-runtime";var pt="vuuSplitter",gn=Rs.memo(function({column:t,index:o,onDrag:r,onDragEnd:n,onDragStart:a,style:i}){let s=ut(),l=ut(null),c=ut(0),[u,d]=Es(!1),p=Ne(({key:b,shiftKey:v})=>{let S=v?10:1;t&&b==="ArrowDown"?r(o,S):t&&b==="ArrowUp"||!t&&b==="ArrowLeft"?r(o,-S):!t&&b==="ArrowRight"&&r(o,S)},[t,o,r]),m=Ne(b=>{let{key:v}=b;(t&&(v==="ArrowUp"||v==="ArrowDown")||!t&&(v==="ArrowLeft"||v==="ArrowRight"))&&(a(o),p(b),h.current=p)},[t,p,o,a]),h=ut(m),g=b=>h.current(b),y=Ne(b=>{s.current=!0;let v=b[t?"clientY":"clientX"],S=v-c.current;v&&v!==c.current&&r(o,S),c.current=v},[t,o,r]),f=Ne(()=>{var b;window.removeEventListener("mousemove",y,!1),window.removeEventListener("mouseup",f,!1),n(),d(!1),(b=l.current)==null||b.focus()},[y,n,d]),x=Ne(b=>{c.current=t?b.clientY:b.clientX,a(o),window.addEventListener("mousemove",y,!1),window.addEventListener("mouseup",f,!1),b.preventDefault(),d(!0)},[t,y,f,o,a,d]),R=()=>{var b;s.current?s.current=!1:(b=l.current)==null||b.focus()},w=()=>{h.current=m},E=ws(pt,{[`${pt}-active`]:u,[`${pt}-column`]:t});return hn("div",{className:E,"data-splitter":!0,ref:l,role:"separator",style:i,onBlur:w,onClick:R,onKeyDown:g,onMouseDown:x,tabIndex:0,children:hn("div",{className:`${pt}-grab-zone`})})});var Ds={},Fe=1,He=2,Ss=e=>typeof e.intrinsicSize=="number",Ts=(e,t)=>{let o={};return e.forEach(r=>{o[r]=P(t,r)}),o},dt=(e,t,o)=>e.map((r,n)=>{var l;let a=P(r,"resizeable"),{[t]:i}=(l=U(r))!=null?l:Ds,s=cr(r);return o?{index:n,flexOpen:s,intrinsicSize:i,resizeable:a,...Ts(o,r)}:{index:n,flexOpen:s,intrinsicSize:i,resizeable:a}}),yn=e=>{let t=e.length,o=e.every(Ss),r=Array(t).fill(0);if(o&&t>0&&(r[0]=He,r[t-1]=He),t<2)return r;for(let n=0,a=0;n<t-1;n++)e[n].resizeable&&!a&&(a=Fe),r[n]+=a;for(let n=t-1;n>0&&(r[n]&Fe&&(r[n]-=Fe),!e[n].resizeable);n--);return r},bn=(e,t)=>{let o=Ls(e,t),r=Cs(e,t),n=o!==-1&&r!==-1?[o,r]:void 0,a=Ps(e,n);return[n,a]};function Ps(e,t){if(t){let o=[];for(let r=0;r<e.length;r++)e[r].flexOpen&&!t.includes(r)&&o.push(r);return o}}function Ls(e,t){let o=t,r=!1;for(;o>=1&&!r;)o=o-1,r=xn(e,o);return o}function Cs(e,t){let o=t,r=!1,n=e.length;for(;o<n-1&&!r;)o=o+1,r=xn(e,o);return o===n?-1:o}function xn(e,t){let{placeholder:o,splitter:r,resizeable:n,intrinsicSize:a}=e[t];return!!(!r&&!a&&(o||n))}var As=e=>!e.splitter&&!e.placeholder,Rn=({children:e,onSplitterMoved:t,style:o})=>{let r=ft(null),n=ft(),a=ft(),i=ft([]),[,s]=ks({}),l=y=>{a.current=y,s({})},c=(o==null?void 0:o.flexDirection)==="column",u=c?"height":"width",d=vn(()=>Array.isArray(e)?e:$e.isValidElement(e)?[e]:[],[e]),p=mt(y=>{let{current:f}=n;if(f){let[x,R]=bn(f,y);x&&(x.forEach(w=>{var b;let E=(b=r.current)==null?void 0:b.childNodes[w];if(E){let{size:v,minSize:S}=Os(E,u);f[w].currentSize=v,f[w].minSize=S}}),R&&R.forEach(w=>{var b;let E=(b=r.current)==null?void 0:b.childNodes[w];if(E){let{[u]:v}=E.getBoundingClientRect();f[w].flexBasis=v}}))}},[u]),m=mt((y,f)=>{a.current&&n.current&&l(Is(a.current,n.current,f,u))},[u]),h=mt(()=>{let y=n.current;y&&(t==null||t(y.filter(As))),y==null||y.forEach(f=>{f.currentSize=void 0,f.flexBasis=void 0,f.flexOpen=!1})},[t]),g=mt(y=>$e.createElement(gn,{column:c,index:y,key:`splitter-${y}`,onDrag:m,onDragEnd:h,onDragStart:p}),[m,h,p,c]);return vn(()=>{let[y,f]=zs(d,u,g,i.current);n.current=f,a.current=y},[d,g,u]),{content:a.current||[],rootRef:r}};function zs(e,t,o,r){let n=dt(e,t),a=yn(n),i=[],s=[];for(let l=0;l<e.length;l++){let c=e[l];if(l===0&&a[l]&He&&(i.push(wn(l)),s.push({placeholder:!0,shim:!0})),c.key==null){let u=r[l]||(r[l]=Ms());i.push($e.cloneElement(c,{key:u}))}else i.push(c);s.push(n[l]),l>0&&a[l]&He?(i.push(wn(l)),s.push({placeholder:!0})):a[l]&Fe&&(i.push(o(i.length)),s.push({splitter:!0}))}return[i,s]}function Is(e,t,o,r){return Bs(t,o)?e.map((a,i)=>{let s=t[i],{currentSize:l,flexOpen:c,flexBasis:u}=s,d=l!==void 0;if(d||c){let{flexBasis:p}=a.props.style||{},m=d?s.currentSize:u;return m!==p?$e.cloneElement(a,{style:{...a.props.style,flexBasis:m,[r]:"auto"}}):a}else return a}):e}function Bs(e,t){let o=[];e.forEach((u,d)=>{u.currentSize!==void 0&&o.push(d)});let r=t<0?o[0]:o[1],{currentSize:n=0,minSize:a=0}=e[r];if(n===a)return!1;if(Math.abs(t)>n-a){let u=t<0?-1:1;t=Math.max(0,n-a)*u}let i=e[o[0]],{currentSize:s=0}=i;i.currentSize=s+t;let l=e[o[1]],{currentSize:c=0}=l;return l.currentSize=c-t,!0}function wn(e){return $e.createElement(Re,{shim:e===0,key:`placeholder-${e}`})}function Os(e,t){let{[t]:o}=e.getBoundingClientRect(),n=getComputedStyle(e).getPropertyValue(`min-${t}`),a=n.endsWith("px")?parseInt(n,10):0;return{size:o,minSize:a}}import{jsx as $s}from"react/jsx-runtime";var ro="hwFlexbox",En=Hs(function(t,o){let{breakPoints:r,children:n,column:a,className:i,flexFill:s,gap:l,fullPage:c,id:u,onSplitterMoved:d,resizeable:p,row:m,spacing:h,splitterSize:g,style:y,...f}=t,{content:x,rootRef:R}=Rn({children:n,onSplitterMoved:d,style:y}),w=Fs(ro,i,{[`${ro}-column`]:a,[`${ro}-row`]:m,"flex-fill":s,"full-page":c});return $s("div",{...f,className:w,"data-resizeable":p||void 0,id:u,ref:Ns(R,o),style:{...y,gap:l,"--spacing":h},children:x})});En.displayName="Flexbox";var no=En;import{useCallback as Vs}from"react";import{jsx as _s}from"react/jsx-runtime";var Dn=function(t){let{path:o}=t,r=q(),n=Vs(a=>{r({type:ve.SPLITTER_RESIZE,path:o,sizes:a})},[r,o]);return _s(no,{...t,onSplitterMoved:n})};Dn.displayName="Flexbox";I("Flexbox",Dn,"container");import{asReactElements as Xs}from"@vuu-ui/vuu-utils";import{useForkRef as js}from"@salt-ds/core";import qs from"clsx";import{forwardRef as Qs,useMemo as Ks}from"react";import{getUniqueId as Gs}from"@vuu-ui/vuu-utils";import{cloneElement as Ws,isValidElement as Us,useCallback as Js,useMemo as Sn,useRef as io}from"react";var Ys=["xs","sm","md","lg","xl"],Zs=12,Tn=({children:e,cols:t,style:o})=>{let r=io(null),n=io(null),a=io(),i=t!=null?t:Zs,l=(o==null?void 0:o.flexDirection)==="column"?"height":"width",c=Sn(()=>Array.isArray(e)?e:Us(e)?[e]:[],[e]),u=Js((d,p)=>{let m=dt(d,p,Ys),h=[],g=[];for(let y=0;y<d.length;y++){let f=d[y],{style:{flex:x,...R}}=f.props;h.push(Ws(f,{key:Gs(),style:{...R,"--parent-col-count":i}})),g.push(m[y])}return[h,g]},[i]);return Sn(()=>{let[d,p]=u(c,l);n.current=p,a.current=d},[u,c,l]),{cols:i,content:a.current,rootRef:r}};import{jsx as el}from"react/jsx-runtime";var ht="hwFluidGrid",ao=Qs(function(t,o){let{breakPoints:r,children:n,column:a,cols:i=12,className:s,flexFill:l,gap:c=3,fullPage:u,id:d,onSplitterMoved:p,resizeable:m,row:h,showGrid:g,spacing:y,splitterSize:f,style:x,...R}=t,w=Ks(()=>Xs(n),[n]),{cols:E,content:b,rootRef:v}=Tn({children:w,cols:i,style:x}),S=rn({breakPoints:r},v),C=qs(ht,s,{[`${ht}-column`]:a,[`${ht}-row`]:h,[`${ht}-show-grid`]:g,"flex-fill":l,"full-page":u}),L={...x,"--spacing":y,"--grid-col-count":E,"--grid-gap":c};return el("div",{...R,className:C,"data-breakpoint":S,"data-cols":E,"data-resizeable":m||void 0,id:d,ref:js(v,o),style:L,children:b})});ao.displayName="FluidGrid";import{jsx as tl}from"react/jsx-runtime";var Pn=function(t){return tl(ao,{...t})};Pn.displayName="FluidGrid";I("FluidGrid",Pn,"container");import{uuid as ol}from"@vuu-ui/vuu-utils";import{List as rl,ListItem as nl}from"@vuu-ui/vuu-ui-controls";import Ln from"clsx";import{cloneElement as il,memo as al}from"react";import{jsx as so}from"react/jsx-runtime";var sl=e=>{let t=e.cloneNode(!0);return t.id="",delete t.dataset.idx,t},Cn=al(({className:e,children:t,idx:o,resizeable:r,header:n,closeable:a,...i})=>so(nl,{className:Ln("vuuPaletteItem",e),"data-draggable":!0,"data-icon":"draggable",...i}));Cn.displayName="PaletteItem";var ll=({ListProps:e,ViewProps:t,children:o,className:r,itemHeight:n=41,orientation:a="horizontal",...i})=>{let s=q(),l="vuuPalette";function c(u){var L,M;let p=u.target.closest(".vuuPaletteItem"),m=parseInt((M=(L=p.dataset)==null?void 0:L.index)!=null?M:"-1"),{props:{caption:h,children:g,template:y,...f}}=o[m],{ViewProps:x}=g.props,{height:R,left:w,top:E,width:b}=p.getBoundingClientRect(),v=ol(),C=y?g:so(we,{...t,...{id:v,key:v},...f,...x,title:f.label,children:g});s({dragRect:{left:w,top:E,right:w+b,bottom:E+150,width:b,height:R},dragElement:sl(p),evt:u.nativeEvent,instructions:{DoNotRemove:!0,DoNotTransform:!0,DriftHomeIfNoDropTarget:!0,RemoveDraggableOnDragEnd:!0,dragThreshold:10},path:"*",payload:C,type:"drag-start"})}return so(rl,{...e,...i,className:Ln(l,r,`${l}-${a}`),itemHeight:n,selected:null,children:o.map((u,d)=>u.type===Cn?il(u,{key:d,onMouseDown:c}):u)})};I("Palette",ll,"view");import{Tab as cl,Tabstrip as ul}from"@vuu-ui/vuu-ui-controls";import{useId as pl}from"@vuu-ui/vuu-utils";import Mn from"clsx";import uo,{forwardRef as dl,useCallback as ml,useRef as fl}from"react";import{jsx as co,jsxs as bl}from"react/jsx-runtime";var lo="vuuTabs",hl=()=>{},gl=e=>{let t=[];return uo.Children.forEach(e,o=>{uo.isValidElement(o)?t.push(o):console.warn("Stack has unexpected child element type")}),t},yl={allowAddTab:!1,allowCloseTab:!1,allowRenameTab:!1},po=dl(function({TabstripProps:t=yl,active:o=0,children:r,className:n,getTabIcon:a=hl,getTabLabel:i=xe,id:s,keyBoardActivation:l="manual",onAddTab:c,onMoveTab:u,onTabClose:d,onTabEdit:p,onTabSelectionChanged:m,showTabs:h="top",style:g},y){var z;let f=pl(s),x=fl([]),{allowCloseTab:R,allowRenameTab:w,className:E}=t,b=ml((A,k,G,W)=>{p==null||p(W,k)},[p]),v=()=>{var A;return uo.isValidElement(r)?r:Array.isArray(r)&&(A=r[o])!=null?A:null},S=()=>gl(r).map((A,k)=>{let{closeable:G=R,id:W=`${f}-${k}`,"data-tab-location":ne}=A.props,ie=i(A,k,x.current);return x.current.push(ie),co(cl,{ariaControls:W,"data-icon":a(A,k),id:`${W}-tab`,index:k,label:ie,location:ne,closeable:G,editable:w},W)}),C=v(),L=h==="left"||h==="right",M=L?"vertical":"horizontal";return bl("div",{className:Mn(lo,n,{[`${lo}-horizontal`]:L}),style:g,id:f,ref:y,children:[h?co(ul,{...t,activeTabIndex:(z=t==null?void 0:t.activeTabIndex)!=null?z:C===null?-1:o,allowDragDrop:t.allowDragDrop!==!1,animateSelectionThumb:!0,className:Mn("vuuTabHeader",E),"aria-label":"data tabs",keyBoardActivation:l,onActiveChange:m,onAddTab:c,onCloseTab:d,onExitEditMode:b,onMoveTab:u,orientation:M,children:S()}):null,co("div",{"aria-labelledby":`${f}-${o}`,className:`${lo}-tabPanel`,role:"tabpanel",children:C})]})});po.displayName="Stack";import{useId as xl}from"@vuu-ui/vuu-utils";import vl,{useCallback as mo,useRef as wl}from"react";import{jsx as An}from"react/jsx-runtime";var Rl=()=>An(Re,{resizeable:!0,style:{flexGrow:1,flexShrink:0,flexBasis:0}}),kn=e=>{var E;let t=wl(null),o=q(),{loadState:r}=be(),{createNewChild:n,id:a,onTabSelectionChanged:i,path:s,...l}=e,{children:c}=e,u=xl(a),[d]=it(u,t,s),p=Gr(),m=(E=n!=null?n:p)!=null?E:Rl,h=b=>{s&&(o({type:"switch-tab",id:u,path:s,nextIdx:b}),i==null||i(b))},g=mo(b=>{if(Array.isArray(c)){let{props:{"data-path":v,path:S=v}}=c[b];o({type:"remove",path:S})}},[c,o]),y=mo(()=>{if(s){let b=vl.Children.count(c),v=m(b);o({type:"add",path:s,component:v})}},[c,m,o,s]),f=mo((b,v)=>{s&&o({fromIndex:b,toIndex:v,path:s,type:"move-child"})},[o,s]);return An(po,{...l,id:u,getTabLabel:(b,v,S)=>{let{id:C,title:L}=b.props;return r(C,"view-title")||L||xe(b,v,S)},onMouseDown:async(b,v)=>{let S;await d({type:"mousedown",index:v,preDragActivity:async()=>new Promise(M=>{console.log("preDragActivity: Ok, gonna release the drag"),S=M})},b)&&(S==null||S(void 0))},onMoveTab:f,onAddTab:y,onTabClose:g,onTabEdit:(b,v)=>{o({type:"set-title",path:`${s}.${b}`,title:v})},onTabSelectionChanged:h,ref:t})};kn.displayName="Stack";I("Stack",kn,"container");import zn,{useState as In}from"react";import{jsx as fo,jsxs as Bn}from"react/jsx-runtime";var pg=({children:e})=>{let[o,r]=In(e),[n,a]=In(e),i=l=>{let c=zo(o,l);a(c)},s=(l,c)=>{console.log(`change ${l} -> ${c}`);let u=zn.cloneElement(n,{style:{...n.props.style,[l]:c}});a(u),r(zn.cloneElement(o,{},u))};return Bn("div",{"data-design-mode":"false",children:[o,fo("br",{}),Bn("div",{style:{display:"flex"},children:[fo(On,{height:300,managedStyle:n.props.style,width:300,onChange:s,style:void 0}),fo(Nn,{layout:o,onSelect:i,style:{width:300,height:300,backgroundColor:"#ccc"}})]})]})};import{FormField as gt,Input as yt}from"@salt-ds/core";import{jsx as F,jsxs as go}from"react/jsx-runtime";var yo={},El={margin:{top:"marginTop",right:"marginRight",bottom:"marginBottom",left:"marginLeft"},border:{top:"borderTopWidth",right:"borderRightWidth",bottom:"borderBottomWidth",left:"borderLeftWidth"},padding:{top:"paddingTop",right:"paddingRight",bottom:"paddingBottom",left:"paddingLeft"}},ho=({feature:e,children:t,style:o,onChange:r})=>go("div",{className:`LayoutBox layout-${e} layout-outer`,children:[go("div",{className:"layout-top",children:[F("span",{className:"layout-title",children:e}),F(gt,{className:"layout-input",style:{width:30},children:F(yt,{value:o.top,onChange:(n,a)=>r(e,"top",a)})})]}),go("div",{className:"layout-inner",children:[F("div",{className:"layout-left",children:F(gt,{className:"layout-input",style:{width:30},children:F(yt,{value:o.left,onChange:(n,a)=>r(e,"left",a)})})}),t,F("div",{className:"layout-right",children:F(gt,{className:"layout-input",style:{width:30},children:F(yt,{value:o.right,onChange:(n,a)=>r(e,"right",a)})})})]}),F("div",{className:"layout-bottom",children:F(gt,{className:"layout-input",style:{width:30},children:F(yt,{value:o.bottom,onChange:(n,a)=>r(e,"bottom",a)})})})]}),bg={margin:!0,marginTop:!0,marginRight:!0,marginBottom:!0,marginLeft:!0},xg={padding:!0,paddingTop:!0,paddingRight:!0,paddingBottom:!0,paddingLeft:!0},vg={border:!0,borderColor:!0,borderWidth:!0,borderTopWidth:!0,borderRightWidth:!0,borderBottomWidth:!0,borderLeftWidth:!0},bt="(\\d+)(?:px)?",Dl=`^(?:${bt}(?:\\s${bt}(?:\\s${bt}(?:\\s${bt})?)?)?)$`,Fn=new RegExp(Dl),Sl=/^(?:(\d+)(?:px)\ssolid\s([a-zA-Z,0-9().]+))$/,On=({height:e,managedStyle:t,onChange:o,style:r,width:n})=>{let a=Hn(t),i=(R,w,E)=>{let b=parseInt(E||"0",10),v=El[R][w];o(v,b)},{marginTop:s=0,marginRight:l=0,marginBottom:c=0,marginLeft:u=0}=a,{borderTopWidth:d=0,borderRightWidth:p=0,borderBottomWidth:m=0,borderLeftWidth:h=0}=a,{paddingTop:g=0,paddingRight:y=0,paddingBottom:f=0,paddingLeft:x=0}=a;return F("div",{className:"LayoutConfigurator",style:{width:n,height:e,...r},children:F(ho,{feature:"margin",style:{top:s,right:l,bottom:c,left:u},onChange:i,children:F(ho,{feature:"border",style:{top:d,right:p,bottom:m,left:h},onChange:i,children:F(ho,{feature:"padding",style:{top:g,right:y,bottom:f,left:x},onChange:i,children:F("div",{className:"layout-content"})})})})})};function wg(e=yo,t=yo){let{margin:o,marginTop:r,marginRight:n,marginBottom:a,marginLeft:i,padding:s,paddingTop:l,paddingRight:c,paddingBottom:u,paddingLeft:d,...p}=e;if(typeof o=="number")p.marginTop=p.marginRight=p.marginBottom=p.marginLeft=o;else if(typeof o=="string"){let m=Fn.exec(o);if(m===null)console.error(`Invalid css value for margin '${o}'`);else{let[,h,g,y,f]=m,x=h&&g&&y;x&&f?(p.marginTop=parseInt(h,10),p.marginRight=parseInt(g,10),p.marginBottom=parseInt(y,10),p.marginLeft=parseInt(f,10)):x?(p.marginTop=parseInt(h,10),p.marginRight=p.marginLeft=parseInt(g,10),p.marginBottom=parseInt(y,10)):h&&g?(p.marginTop=p.marginBottom=parseInt(h,10),p.marginRight=p.marginLeft=parseInt(g,10)):p.marginTop=p.marginRight=p.marginBottom=p.marginLeft=parseInt(h,10)}}if(typeof r=="number"&&(p.marginTop=r),typeof n=="number"&&(p.marginRight=n),typeof a=="number"&&(p.marginBottom=a),typeof i=="number"&&(p.marginLeft=i),typeof s=="number")p.paddingTop=p.paddingRight=p.paddingBottom=p.paddingLeft=s;else if(typeof s=="string"){let m=Fn.exec(s);if(m===null)console.error(`Invalid css value for padding '${s}'`);else{let[,h,g,y,f]=m,x=h&&g&&y;x&&f?(p.paddingTop=parseInt(h,10),p.paddingRight=parseInt(g,10),p.paddingBottom=parseInt(y,10),p.paddingLeft=parseInt(f,10)):x?(p.paddingTop=parseInt(h,10),p.paddingRight=p.paddingLeft=parseInt(g,10),p.paddingBottom=parseInt(y,10)):h&&g?(p.paddingTop=p.paddingBottom=parseInt(h,10),p.paddingRight=p.paddingLeft=parseInt(g,10)):p.paddingTop=p.paddingRight=p.paddingBottom=p.paddinggLeft=parseInt(h,10)}}return typeof l=="number"&&(p.paddingTop=l),typeof c=="number"&&(p.paddingRight=c),typeof u=="number"&&(p.paddingBottom=u),typeof d=="number"&&(p.paddingLeft=d),Hn(p,t)}function Hn(e=yo){let t={...e},o,{border:r,borderWidth:n,borderTopWidth:a,borderRightWidth:i,borderBottomWidth:s,borderLeftWidth:l,borderColor:c,margin:u,marginTop:d,marginRight:p,marginBottom:m,marginLeft:h,padding:g,paddingTop:y,paddingRight:f,paddingBottom:x,paddingLeft:R,...w}=t,E={},b={};if(typeof u=="number"&&(t.marginTop=t.marginRight=t.marginBottom=t.marginLeft=u,E={marginTop:u,marginRight:u,marginBottom:u,marginLeft:u}),typeof g=="number"&&(t.paddingTop=t.paddingRight=t.paddingBottom=t.paddingLeft=g,b={paddingTop:g,paddingRight:g,paddingBottom:g,paddingLeft:g}),r||n||a||i||s||l){typeof r=="string"&&(o=Sl.exec(r))&&([,n,c]=o,n=parseInt(n,10)),n&&(a=a===void 0?n:a,i=i===void 0?n:i,s=s===void 0?n:s,l=l===void 0?n:l),c=c||"black";let v=`
|
|
18
|
-
${c} ${l||0}px ${a||0}px 0 0 inset,
|
|
19
|
-
${c} ${-i||0}px ${-s||0}px 0 0 inset`;return{...w,...E,...b,borderTopWidth:a,borderRightWidth:i,borderBottomWidth:s,borderLeftWidth:l,borderColor:c,borderStyle:"solid",boxShadow:v}}else return t}import Tl from"react";import Pl from"clsx";import{Tree as Ll}from"@vuu-ui/vuu-ui-controls";import{jsx as $n}from"react/jsx-runtime";var Cl="hwLayoutTreeViewer",Vn=(e,t="0")=>({label:T(e),path:t,childNodes:Tl.Children.map(e.props.children,(o,r)=>Vn(o,t?`${t}.${r}`:`${r}`))}),Nn=({layout:e,onSelect:t,style:o})=>{let r=[Vn(e)],n=(a,[{path:i}])=>{t(i)};return $n("div",{className:Pl(Cl),style:o,children:$n(Ll,{source:r,groupSelection:"single",onSelectionChange:n})})};export{ve as Action,vg as BORDER_STYLES,ni as Component,ae as ComponentRegistry,pg as ConfigWrapper,ei as DockLayout,Ot as Draggable,rr as DraggableLayout,vt as Drawer,Wo as DropMenu,ge as DropTarget,no as Flexbox,Dn as FlexboxLayout,ao as FluidGrid,Pn as FluidGridLayout,Yr as Header,nm as HeightOnly,N as LayoutActionType,On as LayoutConfigurator,Td as LayoutProvider,ze as LayoutProviderContext,Sd as LayoutProviderVersion,Nn as LayoutTreeViewer,bg as MARGIN_STYLES,xg as PADDING_STYLES,ll as Palette,Cn as PaletteItem,Re as Placeholder,po as Stack,kn as StackLayout,we as View,st as ViewContext,Kr as WidthHeight,im as WidthOnly,wg as XXXnormalizeStyles,Iu as applyLayout,Me as applyLayoutProps,gr as componentToJson,Go as computeMenuPosition,ci as containerOf,$t as createFlexbox,j as createPlaceHolder,St as expandFlex,fm as extractResponsiveProps,Q as findTarget,B as followPath,zo as followPathToComponent,Y as followPathToParent,ui as getChild,Mo as getChildProp,xe as getDefaultTabLabel,lr as getFlexDimensions,Ht as getFlexOrIntrinsicStyle,Ft as getFlexStyle,U as getIntrinsicSize,fr as getManagedDimension,ur as getPersistentState,P as getProp,D as getProps,pr as hasPersistentState,cr as hasUnboundedFlexStyle,Mt as identifyDropTarget,ip as isApplicationLevelChange,H as isContainer,Do as isLayoutComponent,uc as isLayoutJSON,ap as isLayoutLevelChange,qa as isResponsiveAttribute,Ac as isTabstrip,cc as isTypeOf,Jn as isView,pe as layoutFromJson,yr as layoutQuery,Nr as layoutReducer,hr as layoutToJSON,yc as nextLeaf,Z as nextStep,bc as previousLeaf,_t as processLayoutElement,I as registerComponent,O as resetPath,Qr as resizeObserver,li as resolveJSONPath,Et as resolvePath,qi as serializeProps,dr as setPersistentState,vc as setRef,T as typeOf,rn as useBreakpoints,Gr as useLayoutCreateNewChild,q as useLayoutProviderDispatch,Ba as useLayoutProviderVersion,be as usePersistentState,at as useResizeObserver,it as useViewActionDispatcher,un as useViewContext,Zr as useViewDispatch,Le as wrapIntrinsicSizeComponentWithFlexbox};
|
|
20
|
-
//# sourceMappingURL=index.js.map
|