@dynamix-layout/solid 1.0.3 → 1.1.0
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/CHANGELOG.md +17 -0
- package/dist/index.cjs +1 -1
- package/dist/index.css +1 -1
- package/dist/index.es.js +566 -400
- package/dist/types/index.d.cts +31 -1
- package/dist/types/index.d.ts +31 -1
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,22 @@
|
|
|
1
1
|
# @dynamix-layout/solid
|
|
2
2
|
|
|
3
|
+
## 1.1.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#83](https://github.com/xcode-studio/dynamix-layout/pull/83) [`034fb0a`](https://github.com/xcode-studio/dynamix-layout/commit/034fb0afced4a7a1b4ca033cbf73771780f520d4) Thanks [@akash-aman](https://github.com/akash-aman)! - Maximize and fold tabsets (UI), on by default:
|
|
8
|
+
|
|
9
|
+
- Hover toolbar at the end of every tab bar with Maximize/Restore and Fold/Unfold buttons (accessible labels and tooltips), like LeetCode.
|
|
10
|
+
- Folded tabsets in side-by-side rows show their tab bar as a rotated vertical strip with the toolbar at the bottom; in stacked rows they shrink to their tab bar.
|
|
11
|
+
- Double-click a tab bar to maximize/restore; Alt/Option + `+` maximizes and Alt/Option + `-` folds the last touched tabset.
|
|
12
|
+
- New props: `enableMaximize`, `enableCollapse`, `enableDoubleClickMaximize`, `keyboardShortcuts`, and `TabsetToolbar` to replace the toolbar.
|
|
13
|
+
- Starting a drag while maximized restores the layout first; locked bonds next to folded tabsets ignore the pointer.
|
|
14
|
+
|
|
15
|
+
### Patch Changes
|
|
16
|
+
|
|
17
|
+
- Updated dependencies [[`4f01ca4`](https://github.com/xcode-studio/dynamix-layout/commit/4f01ca47e0ec6c28e68b157b2b2bed1522b92d0f)]:
|
|
18
|
+
- @dynamix-layout/core@1.2.0
|
|
19
|
+
|
|
3
20
|
## 1.0.3
|
|
4
21
|
|
|
5
22
|
### Patch Changes
|
package/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("solid-js/web"),l=require("@dynamix-layout/core"),b=require("solid-js");var N=n.template("<div>"),De=n.template("<div><div style=display:flex;align-items:center;gap:4px;height:100%>"),Ee=n.template('<svg xmlns=http://www.w3.org/2000/svg width=24 height=24 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round class="lucide lucide-grip-vertical size-2.5"><circle cx=9 cy=12 r=1></circle><circle cx=9 cy=5 r=1></circle><circle cx=9 cy=19 r=1></circle><circle cx=15 cy=12 r=1></circle><circle cx=15 cy=5 r=1></circle><circle cx=15 cy=19 r=1>'),Te=n.template('<svg xmlns=http://www.w3.org/2000/svg width=24 height=24 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round style=transform:rotate(90deg)><circle cx=9 cy=12 r=1></circle><circle cx=9 cy=5 r=1></circle><circle cx=9 cy=19 r=1></circle><circle cx=15 cy=12 r=1></circle><circle cx=15 cy=5 r=1></circle><circle cx=15 cy=19 r=1>');const Z=e=>(()=>{var o=N();return n.spread(o,n.mergeProps(e,{get class(){return`DefaultWrapTabLabel ${e.class||""}`},get"data-state"(){return e.active?"active":"inactive"},get style(){return{"align-self":"center",padding:"4px 6px","box-sizing":"border-box","font-size":"14px","border-radius":"4px",...e.style}}}),!1,!0),n.insert(o,()=>e.children),o})(),ee=e=>(()=>{var o=N();return n.spread(o,n.mergeProps(e,{get class(){return`DefaultWrapTabBody hide-scrollbar ${e.class||""}`},get style(){return{"box-sizing":"border-box",height:"100%",width:"100%",display:"grid",overflow:"auto","scrollbar-width":"none","-ms-overflow-style":"none",...e.style}}}),!1,!0),n.insert(o,()=>e.children),o})(),te=e=>(()=>{var o=N();return n.spread(o,n.mergeProps(e,{get class(){return`DefaultWrapTabHead hide-scrollbar ${e.class||""}`},get style(){return{display:"grid","grid-auto-flow":"column","justify-content":"start","align-items":"center",gap:"6px","padding-left":"8px",width:"100%","box-sizing":"border-box",height:"100%","place-items":"self-start",overflow:"auto","background-color":"#dfdfdf","scrollbar-width":"none","-ms-overflow-style":"none",...e.style}}}),!1,!0),n.insert(o,()=>e.children),o})(),re=e=>(()=>{var o=N();return n.spread(o,n.mergeProps(e,{get class(){return`DefaultWrapTabPanel ${e.class||""}`},get style(){return{display:"grid","align-items":"center","place-items":"self-start","box-sizing":"border-box",position:"absolute","border-radius":"8px",...e.style}}}),!1,!0),n.insert(o,()=>e.children),o})(),ne=e=>(()=>{var o=N();return n.spread(o,n.mergeProps(e,{get class(){return`DefaultHoverElement ${e.class||""}`},get style(){return{display:"flex","justify-content":"center","align-items":"center",opacity:.7,position:"absolute","box-sizing":"border-box","font-weight":"bold","pointer-events":"none","background-color":"rgba(0, 175, 249, 0.5)","border-radius":"10px",transition:"all 0.2s ease",border:"2px dashed rgb(0, 196, 42)",...e.style}}}),!1,!0),n.insert(o,()=>e.children),o})(),ae=e=>(()=>{var o=De(),p=o.firstChild;return n.spread(o,n.mergeProps(e,{get class(){return`DefaultSliderElement ${e.class||""}`},get style(){return{width:"100%",height:"100%",position:"absolute","box-sizing":"border-box","background-color":"white","z-index":9,cursor:"grab",...e.style}}}),!1,!0),n.insert(p,(()=>{var m=n.memo(()=>!e.direction);return()=>m()?Ee():Te()})()),n.insert(o,()=>e.children,null),n.effect(m=>n.setStyleProperty(p,"flex-direction",e.direction?"column":"row")),o})(),oe=e=>{const[o,p]=b.splitProps(e,["area","size","gap","class","style","children"]),m=b.createMemo(()=>{const d=o.size||{h:"20%",w:"6px"},v=o.gap||"0px",f={};return o.area==="left"?(Object.assign(f,{"border-top-right-radius":"16px","border-bottom-right-radius":"16px",height:d.h,left:v,width:d.w}),f.top=`calc(50% - ${d.h} / 2)`):o.area==="top"?(Object.assign(f,{"border-bottom-left-radius":"16px","border-bottom-right-radius":"16px",width:d.h,top:v,height:d.w}),f.left=`calc(50% - ${d.h} / 2)`):o.area==="right"?(Object.assign(f,{"border-top-left-radius":"16px","border-bottom-left-radius":"16px",height:d.h,right:v,width:d.w}),f.top=`calc(50% - ${d.h} / 2)`):o.area==="bottom"&&(Object.assign(f,{"border-top-left-radius":"16px","border-top-right-radius":"16px",width:d.h,bottom:v,height:d.w}),f.left=`calc(50% - ${d.h} / 2)`),f});return(()=>{var d=N();return n.spread(d,n.mergeProps(p,{get class(){return`RootSplitterHoverEl ${o.class||""}`},get style(){return{position:"absolute","z-index":-1,display:"none","box-sizing":"border-box","background-color":"#0081f9",cursor:"grab",...o.style,...m()}}}),!1,!0),n.insert(d,()=>o.children),d})()},ie=({tabOutput:e,rootId:o,layoutTree:p,updateJSON:m,dimensions:d,tabHeadHeight:v,enableTabbar:f,bondWidth:F,minTabHeight:O,minTabWidth:S,sliderUpdateTimeout:A,windowResizeTimeout:z,disableSliderTimeout:P,disableResizeTimeout:R})=>{const $=new Map,H=new Map,C=new Map,W=new Map,w={current:void 0},L=[],[_,j]=b.createSignal(p),[I,E]=b.createSignal(new Map),[q,k]=b.createSignal(new Map),[U,x]=b.createSignal(!1);let D=null;const[X,y]=b.createSignal(!1),i={src:void 0,des:void 0,area:void 0,drag:!1},a={sliderId:void 0,isSliding:!1},u=f?Math.max(O,v):O,g=new l.DynamixLayoutCore({tabs:e.keys,tree:_(),minW:S,minH:u,bond:F,uqid:o,tabsIds:e.name}),G=t=>{const r=new Map(t);E(r)},Q=t=>{const r=new Map(t);k(r)},M=()=>{const t=f?v:0;l.Node.cache.tabOpts.get().forEach((r,c)=>{const s=W.get(c);if(!s)return;const h=l.getTabBodyRect(r.nodDims,t);l.setElementRect(s,h),s.style.display=r.nodOpen&&h.h>0?"block":"none"})},le=l.Node.cache.nodOpts.onChange(t=>{t.forEach((r,c)=>{const s=C.get(c);s&&l.setElementRect(s,r.nodDims);const h=$.get(c);h&&f&&l.setElementRect(h,{...r.nodDims,h:v})})}),de=l.Node.cache.tabOpts.onChange(()=>M()),ce=l.Node.cache.bndOpts.onChange(t=>{t.forEach((r,c)=>{const s=H.get(c);s&&l.setElementRect(s,r.nodDims)})}),Y=l.createFrameScheduler(({id:t,point:r})=>g.updateSlider(t,r,P,A)),V=t=>{const r=a.sliderId;!a.isSliding||!r||Y.schedule({id:r,point:{x:t.clientX,y:t.clientY}})},B=t=>{if(!a.isSliding)return;Y.flush();const r=t.currentTarget;a.isSliding=!1,a.sliderId=void 0,x(!1),m&&m(l.DynamixLayoutCore._root.toJSON()),r.releasePointerCapture(t.pointerId),r.removeEventListener("pointermove",V),r.removeEventListener("pointerup",B),r.removeEventListener("pointercancel",B)},ue=t=>{t.preventDefault();const r=t.currentTarget;a.isSliding=!0,a.sliderId=r.id,x(!0),r.setPointerCapture(t.pointerId),r.addEventListener("pointermove",V),r.addEventListener("pointerup",B),r.addEventListener("pointercancel",B)};let J={};const ge=(t,r,c)=>{if(!w.current||!i||!c)return null;const s=l.getTabsetDropPreview(c.getBoundingClientRect(),t,r);K(s),i.des=c,i.area=s.area},fe=t=>{t.preventDefault(),t.stopPropagation(),t.dataTransfer&&(t.dataTransfer.dropEffect="move");const r=t.currentTarget,c=Array.from(r.childNodes);if(!w.current||!i)return;const s=l.getNavbarDropPreview(r.getBoundingClientRect(),c.map(h=>h.getBoundingClientRect()),t.clientX,t.clientY);s&&(K(s),i.des=c[s.index],i.area=s.area)},me=t=>{t.preventDefault(),t.stopPropagation(),t.dataTransfer&&(t.dataTransfer.dropEffect="move");const r=t.currentTarget,{area:c,uid:s}=r.dataset;if(!c||!s||!w.current||!i)return;const h=c;i.des=r,i.area=h,K(l.getRootSplitPreview(d(),h))},K=t=>{const r=w.current;!r||l.isSameDropPreview(J,t)||(Object.assign(r.style,{left:`${t.left}px`,top:`${t.top}px`,width:`${t.width}px`,height:`${t.height}px`,display:"block",zIndex:"100"}),J=t)},he=t=>{if(t.stopPropagation(),x(!0),document.body.style.cursor="move",t.currentTarget){if(t.dataTransfer){t.dataTransfer.effectAllowed="move";const r=document.createElement("div");r.style.width="1px",r.style.height="1px",r.style.backgroundColor="transparent",r.style.position="absolute",r.style.top="-1000px",document.body.appendChild(r),t.dataTransfer.setDragImage(r,0,0),setTimeout(()=>{r.parentNode&&r.parentNode.removeChild(r)},0)}L.forEach(r=>{r&&(r.style.display="block",r.style.zIndex="99")}),C.forEach(r=>{r&&(r.style.display="block",r.style.zIndex="95")}),i.src=t.currentTarget,i.drag=!0}},be=t=>{if(t.preventDefault(),t.stopPropagation(),document.body.style.cursor="move",t.dataTransfer&&(t.dataTransfer.dropEffect="move"),!i?.src)return;const r=t.currentTarget,c=t.clientX,s=t.clientY;D&&cancelAnimationFrame(D),D=requestAnimationFrame(()=>{ge(c,s,r)})},ye=()=>{if(document.body.style.cursor="default",L.forEach(t=>{t&&(t.style.display="none",t.style.zIndex="-1")}),D&&(cancelAnimationFrame(D),D=null),w.current&&(w.current.style.display="none",w.current.style.zIndex="-1"),J={},i.drag=!1,!i?.src||!i?.des){i.area=void 0,i.src=void 0,i.des=void 0,x(!1);return}if(i.src===i.des){i.area=void 0,i.src=void 0,i.des=void 0,x(!1);return}if(i.src&&i.des){if(!i.area){console.warn("No area specified for drag and drop"),x(!1);return}if(!g.updateTree(i.src.dataset.uid,i.des.dataset.uid,i.area||"contain")){console.warn("Failed to update layout tree"),x(!1);return}requestAnimationFrame(()=>{G(l.Node.cache.nodOpts.get()),Q(l.Node.cache.bndOpts.get()),M(),m&&m(l.DynamixLayoutCore._root.toJSON())})}i.area=void 0,i.src=void 0,i.des=void 0,x(!1)},pe=t=>{t.preventDefault(),t.stopPropagation(),t.dataTransfer&&(t.dataTransfer.dropEffect="move")},ve=t=>{t.preventDefault(),t.stopPropagation()},xe=t=>{t.preventDefault(),t.stopPropagation(),t.dataTransfer&&t.dataTransfer.getData("text/plain")},we=t=>{const r=t.currentTarget,c=r.dataset.uid;if(!c)return;const s=l.Node.cache.mapElem.get(c);if(!(s instanceof l.Node)){console.warn(`Element with uid ${c} is not a Node instance`);return}if(!s||!s.host||!s.host.unId){console.warn(`Node with uid ${c} not found in mapNode`);return}if(s.host.open==s.name){console.warn(`Node ${s.name} is already open`);return}const h=l.Node.cache.nodOpts.get().get(s.host.unId);if(!h||h.nodOpen&&s?.open)return;s.host.open=s.name,h.nodOpen=s.name,h.nodKids?.forEach(T=>{T.nodOpen=T.nodName===s.name}),r?.parentElement?.childNodes?.forEach(T=>{T instanceof HTMLDivElement&&T.dataset.uid!==c?T.dataset.state="inactive":T.dataset.state="active"}),M()};return b.onMount(()=>{const t=c=>{g.updateDimension(d(),c,z)};t(!0);const r=()=>t(R??!1);window.addEventListener("resize",r),G(l.Node.cache.nodOpts.get()),Q(l.Node.cache.bndOpts.get()),M(),m&&m(l.DynamixLayoutCore._root.toJSON()),b.onCleanup(()=>{window.removeEventListener("resize",r),le(),ce(),de(),Y.cancel(),D&&cancelAnimationFrame(D)})}),{tabsets:I,sliders:q,tabsetsRef:$,panelsRef:C,tabsRef:W,slidersRef:H,layoutJSON:_,layoutInstance:g,hoverElementRef:w,rootSplitHoverEl:L,dragging:U,isUpdating:X,setIsUpdating:y,setDragging:x,setTabsets:E,setSliders:k,setLayoutJSON:j,onDragStart:he,onDragOver:be,onDragEnd:ye,onDragEnter:pe,onDragLeave:ve,onDrop:xe,onPointerDown:ue,updateActiveTab:we,handleRootSplit:me,handleNavbarDragOver:fe}};var Se=n.template("<div>"),$e=n.template('<div class="flex items-center justify-center h-full"><span class=text-gray-500>No content');const se=e=>{const o=[],p=new Map,m=new Map;for(const[d,v]of e){const f=crypto.randomUUID();o.push(d),p.set(d,{uqid:f,name:d,node:v}),m.set(d,f)}return{keys:o,maps:p,name:m}},Ce=e=>{const o=b.createMemo(()=>se(e.tabs));let p;const m=()=>{const y=p;if(!y)return{w:0,h:0,x:0,y:0};const i=y.getBoundingClientRect(),a=e.pad||{t:0,b:0,l:0,r:0};return{w:i.width-(a.l+a.r),h:i.height-(a.t+a.b),x:i.left+a.l,y:i.top+a.t}},{tabsetsRef:d,slidersRef:v,sliders:f,tabsets:F,hoverElementRef:O,onDragEnd:S,onDragOver:A,onDragStart:z,onDragEnter:P,onDragLeave:R,onDrop:$,dragging:H,panelsRef:C,onPointerDown:W,handleNavbarDragOver:w,updateActiveTab:L,rootSplitHoverEl:_,handleRootSplit:j,tabsRef:I,isUpdating:E}=ie({tabOutput:o(),rootId:e.rootId||"dynamix-layout-root",updateJSON:e.updateJSON,enableTabbar:e.enableTabbar===void 0?!0:e.enableTabbar,layoutTree:e.layoutTree,tabHeadHeight:e.tabHeadHeight||l.DynamixLayoutCore._minH,dimensions:m,sliderUpdateTimeout:e.sliderUpdateTimeout||2,windowResizeTimeout:e.windowResizeTimeout||2,bondWidth:e.bondWidth||l.DynamixLayoutCore._bond,minTabHeight:e.minTabHeight||l.DynamixLayoutCore._minH,minTabWidth:e.minTabWidth||l.DynamixLayoutCore._minW,disableSliderTimeout:e.disableSliderTimeout===void 0?!0:e.disableSliderTimeout,disableResizeTimeout:e.disableResizeTimeout===void 0?!0:e.disableResizeTimeout,hoverElementStyles:e.hoverElementStyles}),q=e.WrapTabPanel||re,k=e.WrapTabHead||te,U=e.WrapTabLabel||Z,x=e.WrapTabBody||ee,D=e.SliderElement||ae,X=e.HoverElement||ne;return(()=>{var y=Se(),i=p;return typeof i=="function"?n.use(i,y):p=y,n.spread(y,n.mergeProps({get id(){return e.rootId||"dynamix-layout-root"}},e,{get"data-testid"(){return e.rootId||"dynamix-layout-root"},get class(){return H()?"is-dragging":""},get style(){return{position:"relative",width:"100%",height:"100%",overflow:"hidden",...e.style}}}),!1,!0),n.insert(y,n.createComponent(b.For,{get each(){return Array.from(F().values())},children:a=>[n.createComponent(q,{ref:u=>{const g=a.uidNode;u?C.set(g,u):C.delete(g)},onDragEnd:S,onDragOver:A,onDragEnter:P,onDragLeave:R,onDrop:$,get"data-uid"(){return a.uidNode},get"data-type"(){return a.typNode},get class(){return"hide-scrollbar DefaultWrapTabPanel "+(e.tabPanelElementClass||"")},get style(){return{position:"absolute",...e.tabPanelElementStyles,width:`${a.nodDims.w}px`,height:`${a.nodDims.h}px`,left:`${a.nodDims.x}px`,top:`${a.nodDims.y}px`,"background-color":"transparent"}}}),n.createComponent(k,{get draggable(){return!E()},get"data-uid"(){return a.uidNode},"data-type":"tabset",onDragOver:w,onDragStart:z,onDragEnd:S,onDragEnter:P,onDragLeave:R,onDrop:$,ref:u=>{const g=a.uidNode;u?d.set(g,u):d.delete(g)},get class(){return"hide-scrollbar "+(e.tabHeadElementClass||"")},get style(){return{...e.tabHeadElementStyles,position:"absolute","z-index":99,width:`${a.nodDims.w}px`,height:`${e.tabHeadHeight||l.DynamixLayoutCore._minH}px`,left:`${a.nodDims.x}px`,top:`${a.nodDims.y}px`,cursor:E()?"wait":"pointer"}},get children(){return n.createComponent(b.For,{get each(){return a.nodKids},children:u=>n.createComponent(U,{get"data-uid"(){return u.uidNode},"data-type":"tab",onDragStart:z,onDragEnd:S,get draggable(){return!E()},get active(){return!!u.nodOpen},get class(){return"hide-scrollbar "+(e.tabLabelElementClass||"")},get style(){return{cursor:E()?"wait":"pointer",...e.tabLabelElementStyles}},onClick:L,get children(){return n.memo(()=>!!e.tabNames)()&&e.tabNames.get(u.nodName)||u.nodName}})})}})]}),null),n.insert(y,n.createComponent(b.For,{get each(){return o().keys},children:a=>{const u=o().maps.get(a)?.uqid;return n.createComponent(x,{id:u,draggable:!1,"data-uid":u,get class(){return"hide-scrollbar "+(e.tabBodyElementClass||"")},get style(){return{position:"absolute","z-index":90,"overscroll-behavior":"contain",...e.tabBodyElementStyles}},ref:g=>{u&&(g?I.set(u,g):I.delete(u))},get children(){return o().maps.get(a)?.node||$e()}})}}),null),n.insert(y,n.createComponent(b.For,{get each(){return Array.from(f().values())},children:a=>n.createComponent(D,{get id(){return a.uidNode},get"data-uid"(){return a.uidNode},get direction(){return a.nodeDir},onPointerDown:W,get class(){return"hide-scrollbar "+(e.sliderElementClass||"")},ref:u=>{const g=a.uidNode;u?v.set(g,u):v.delete(g)},get style(){return{width:`${a.nodDims.w}px`,height:`${a.nodDims.h}px`,left:`${a.nodDims.x}px`,top:`${a.nodDims.y}px`,cursor:a.nodeDir?"ns-resize":"ew-resize",...e.sliderElementStyles}}})}),null),n.insert(y,n.createComponent(X,{get class(){return"hide-scrollbar "+(e.hoverElementClass||"")},get style(){return{...e.hoverElementStyles}},ref:a=>O.current=a}),null),n.insert(y,n.createComponent(b.For,{each:["left","right","top","bottom"],children:(a,u)=>n.createComponent(oe,{onDragOver:j,onDragEnd:S,onDragEnter:P,onDragLeave:R,onDrop:$,get"data-uid"(){return e.rootId||"dynamix-layout-root"},"data-area":a,get class(){return"hide-scrollbar "+(e.RootSplitterHoverElClass||"")},ref:g=>{g&&(_[u()]=g)},get style(){return{...e.RootSplitterHoverElStyles}},area:a,size:{h:"25%",w:"8px"}})}),null),y})()};exports.DefaultHoverElement=ne;exports.DefaultSliderElement=ae;exports.DefaultWrapTabBody=ee;exports.DefaultWrapTabHead=te;exports.DefaultWrapTabLabel=Z;exports.DefaultWrapTabPanel=re;exports.DynamixLayout=Ce;exports.RootSplitterHoverEl=oe;exports.getTabOutput=se;exports.useDynamixLayout=ie;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("solid-js/web"),d=require("@dynamix-layout/core"),x=require("solid-js");var O=n.template("<div>"),He=n.template("<div><div style=display:flex;align-items:center;gap:4px;height:100%>"),Oe=n.template('<svg xmlns=http://www.w3.org/2000/svg width=24 height=24 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round class="lucide lucide-grip-vertical size-2.5"><circle cx=9 cy=12 r=1></circle><circle cx=9 cy=5 r=1></circle><circle cx=9 cy=19 r=1></circle><circle cx=15 cy=12 r=1></circle><circle cx=15 cy=5 r=1></circle><circle cx=15 cy=19 r=1>'),Ie=n.template('<svg xmlns=http://www.w3.org/2000/svg width=24 height=24 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round style=transform:rotate(90deg)><circle cx=9 cy=12 r=1></circle><circle cx=9 cy=5 r=1></circle><circle cx=9 cy=19 r=1></circle><circle cx=15 cy=12 r=1></circle><circle cx=15 cy=5 r=1></circle><circle cx=15 cy=19 r=1>'),_e=n.template('<svg xmlns=http://www.w3.org/2000/svg width=14 height=14 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round aria-hidden=true><path>'),We=n.template("<div class=DefaultTabsetToolbar>"),ue=n.template("<button type=button class=DefaultTabsetToolbarButton>");const me=e=>(()=>{var o=O();return n.spread(o,n.mergeProps(e,{get class(){return`DefaultWrapTabLabel ${e.class||""}`},get"data-state"(){return e.active?"active":"inactive"},get style(){return{"align-self":"center",padding:"4px 6px","box-sizing":"border-box","font-size":"14px","border-radius":"4px",...e.style}}}),!1,!0),n.insert(o,()=>e.children),o})(),fe=e=>(()=>{var o=O();return n.spread(o,n.mergeProps(e,{get class(){return`DefaultWrapTabBody hide-scrollbar ${e.class||""}`},get style(){return{"box-sizing":"border-box",height:"100%",width:"100%",display:"grid",overflow:"auto","scrollbar-width":"none","-ms-overflow-style":"none",...e.style}}}),!1,!0),n.insert(o,()=>e.children),o})(),be=e=>(()=>{var o=O();return n.spread(o,n.mergeProps(e,{get class(){return`DefaultWrapTabHead hide-scrollbar ${e.class||""}`},get style(){return{display:"grid","grid-auto-flow":"column","justify-content":"start","align-items":"center",gap:"6px","padding-left":"8px",width:"100%","box-sizing":"border-box",height:"100%","place-items":"self-start",overflow:"auto","background-color":"#dfdfdf","scrollbar-width":"none","-ms-overflow-style":"none",...e.style}}}),!1,!0),n.insert(o,()=>e.children),o})(),he=e=>(()=>{var o=O();return n.spread(o,n.mergeProps(e,{get class(){return`DefaultWrapTabPanel ${e.class||""}`},get style(){return{display:"grid","align-items":"center","place-items":"self-start","box-sizing":"border-box",position:"absolute","border-radius":"8px",...e.style}}}),!1,!0),n.insert(o,()=>e.children),o})(),ve=e=>(()=>{var o=O();return n.spread(o,n.mergeProps(e,{get class(){return`DefaultHoverElement ${e.class||""}`},get style(){return{display:"flex","justify-content":"center","align-items":"center",opacity:.7,position:"absolute","box-sizing":"border-box","font-weight":"bold","pointer-events":"none","background-color":"rgba(0, 175, 249, 0.5)","border-radius":"10px",transition:"all 0.2s ease",border:"2px dashed rgb(0, 196, 42)",...e.style}}}),!1,!0),n.insert(o,()=>e.children),o})(),ye=e=>(()=>{var o=He(),v=o.firstChild;return n.spread(o,n.mergeProps(e,{get class(){return`DefaultSliderElement ${e.class||""}`},get style(){return{width:"100%",height:"100%",position:"absolute","box-sizing":"border-box","background-color":"white","z-index":9,cursor:"grab",...e.style}}}),!1,!0),n.insert(v,(()=>{var u=n.memo(()=>!e.direction);return()=>u()?Oe():Ie()})()),n.insert(o,()=>e.children,null),n.effect(u=>n.setStyleProperty(v,"flex-direction",e.direction?"column":"row")),o})(),pe=e=>{const[o,v]=x.splitProps(e,["area","size","gap","class","style","children"]),u=x.createMemo(()=>{const i=o.size||{h:"20%",w:"6px"},m=o.gap||"0px",g={};return o.area==="left"?(Object.assign(g,{"border-top-right-radius":"16px","border-bottom-right-radius":"16px",height:i.h,left:m,width:i.w}),g.top=`calc(50% - ${i.h} / 2)`):o.area==="top"?(Object.assign(g,{"border-bottom-left-radius":"16px","border-bottom-right-radius":"16px",width:i.h,top:m,height:i.w}),g.left=`calc(50% - ${i.h} / 2)`):o.area==="right"?(Object.assign(g,{"border-top-left-radius":"16px","border-bottom-left-radius":"16px",height:i.h,right:m,width:i.w}),g.top=`calc(50% - ${i.h} / 2)`):o.area==="bottom"&&(Object.assign(g,{"border-top-left-radius":"16px","border-top-right-radius":"16px",width:i.h,bottom:m,height:i.w}),g.left=`calc(50% - ${i.h} / 2)`),g});return(()=>{var i=O();return n.spread(i,n.mergeProps(v,{get class(){return`RootSplitterHoverEl ${o.class||""}`},get style(){return{position:"absolute","z-index":-1,display:"none","box-sizing":"border-box","background-color":"#0081f9",cursor:"grab",...o.style,...u()}}}),!1,!0),n.insert(i,()=>o.children),i})()},ge=e=>(()=>{var o=_e(),v=o.firstChild;return n.effect(u=>{var i=e.rotate?{transform:`rotate(${e.rotate}deg)`}:{},m=e.path;return u.e=n.style(o,i,u.e),m!==u.t&&n.setAttribute(v,"d",u.t=m),u},{e:void 0,t:void 0}),o})(),Ae="M8 3H5a2 2 0 0 0-2 2v3M21 8V5a2 2 0 0 0-2-2h-3M3 16v3a2 2 0 0 0 2 2h3M16 21h3a2 2 0 0 0 2-2v-3",Fe="M8 3v3a2 2 0 0 1-2 2H3M21 8h-3a2 2 0 0 1-2-2V3M3 16h3a2 2 0 0 1 2 2v3M16 21v-3a2 2 0 0 1 2-2h3",Be="m15 18-6-6 6-6",xe=e=>{const o=()=>(e.rowIsHorizontal?0:90)+(e.folded?180:0),v=()=>e.rotated?-90:0;let u;return x.onMount(()=>{const i=u?.parentElement;if(!u||!i)return;const m=()=>{u.style.transform=`translateX(${i.scrollLeft}px)`};m(),i.addEventListener("scroll",m,{passive:!0}),x.onCleanup(()=>i.removeEventListener("scroll",m))}),(()=>{var i=We();i.$$dblclick=g=>g.stopPropagation();var m=u;return typeof m=="function"?n.use(m,i):u=i,n.insert(i,(()=>{var g=n.memo(()=>!!e.showMaximize);return()=>g()&&(()=>{var p=ue();return p.$$click=()=>e.onToggleMaximize(),n.insert(p,n.createComponent(ge,{get path(){return e.maximized?Fe:Ae},get rotate(){return v()}})),n.effect(b=>{var T=e.maximized?"Restore":"Maximize",N=e.maximized,S=e.maximized?"Restore (⌥ +)":"Maximize (⌥ +)";return T!==b.e&&n.setAttribute(p,"aria-label",b.e=T),N!==b.t&&n.setAttribute(p,"aria-pressed",b.t=N),S!==b.a&&n.setAttribute(p,"title",b.a=S),b},{e:void 0,t:void 0,a:void 0}),p})()})(),null),n.insert(i,(()=>{var g=n.memo(()=>!!e.showFold);return()=>g()&&(()=>{var p=ue();return p.$$click=()=>e.onToggleFold(),n.insert(p,n.createComponent(ge,{path:Be,get rotate(){return o()+v()}})),n.effect(b=>{var T=e.folded?"Unfold":"Fold",N=!e.folded,S=e.folded?"Unfold (⌥ -)":"Fold (⌥ -)";return T!==b.e&&n.setAttribute(p,"aria-label",b.e=T),N!==b.t&&n.setAttribute(p,"aria-expanded",b.t=N),S!==b.a&&n.setAttribute(p,"title",b.a=S),b},{e:void 0,t:void 0,a:void 0}),p})()})(),null),i})()};n.delegateEvents(["dblclick","click"]);const we=({tabOutput:e,rootId:o,layoutTree:v,updateJSON:u,dimensions:i,tabHeadHeight:m,enableTabbar:g,bondWidth:p,minTabHeight:b,minTabWidth:T,sliderUpdateTimeout:N,windowResizeTimeout:S,disableSliderTimeout:I,disableResizeTimeout:_,keyboardShortcuts:W=!0,enableDoubleClickMaximize:Q=!0})=>{const A=new Map,X=new Map,F=new Map,V=new Map,E={current:void 0},B=[],[j,H]=x.createSignal(v),[ee,Y]=x.createSignal(new Map),[te,J]=x.createSignal(new Map),[re,C]=x.createSignal(!1);let $=null;const[ne,ae]=x.createSignal(!1),l={src:void 0,des:void 0,area:void 0,drag:!1},M={sliderId:void 0,isSliding:!1},Z=g?Math.max(b,m):b,z=new d.DynamixLayoutCore({tabs:e.keys,tree:j(),minW:T,minH:Z,bond:p,uqid:o,tabsIds:e.name,collapsedSize:g?m:Z}),q=t=>{const r=new Map(t);Y(r)},U=t=>{const r=new Map(t);J(r)},y=()=>{const t=g?m:0;d.Node.cache.tabOpts.get().forEach((r,c)=>{const s=V.get(c);if(!s)return;const f=d.getTabBodyRect(r.nodDims,t);d.setElementRect(s,f);const ce=r.nodOpen&&!r.nodFold&&!r.nodHidden&&f.h>0;s.style.display=ce?"block":"none"})},R=d.Node.cache.nodOpts.onChange(t=>{t.forEach((r,c)=>{const s=F.get(c);s&&d.setElementRect(s,r.nodDims);const f=A.get(c);f&&g&&(f.toggleAttribute("data-dx-hidden",!!r.nodHidden),d.placeTabbar(f,d.getTabbarPlacement(r,m)))})}),a=d.Node.cache.tabOpts.onChange(()=>y()),h=d.Node.cache.bndOpts.onChange(t=>{t.forEach((r,c)=>{const s=X.get(c);s&&(d.setElementRect(s,r.nodDims),s.toggleAttribute("data-dx-hidden",!!r.nodHidden),s.style.pointerEvents=r.nodLocked?"none":"")})}),w=d.createFrameScheduler(({id:t,point:r})=>z.updateSlider(t,r,I,N)),K=t=>{const r=M.sliderId;!M.isSliding||!r||w.schedule({id:r,point:{x:t.clientX,y:t.clientY}})},P=t=>{if(!M.isSliding)return;w.flush();const r=t.currentTarget;M.isSliding=!1,M.sliderId=void 0,C(!1),u&&u(d.DynamixLayoutCore._root.toJSON()),r.releasePointerCapture(t.pointerId),r.removeEventListener("pointermove",K),r.removeEventListener("pointerup",P),r.removeEventListener("pointercancel",P)},D=t=>{t.preventDefault();const r=t.currentTarget;M.isSliding=!0,M.sliderId=r.id,C(!0),r.setPointerCapture(t.pointerId),r.addEventListener("pointermove",K),r.addEventListener("pointerup",P),r.addEventListener("pointercancel",P)};let L={};const De=(t,r,c)=>{if(!E.current||!l||!c)return null;const s=d.getTabsetDropPreview(c.getBoundingClientRect(),t,r);G(s),l.des=c,l.area=s.area},Ee=t=>{t.preventDefault(),t.stopPropagation(),t.dataTransfer&&(t.dataTransfer.dropEffect="move");const r=t.currentTarget;if(r.hasAttribute("data-rotated")){if(!E.current||!l)return;const f=r.getBoundingClientRect();G({area:"contain",left:f.left,top:f.top,width:f.width,height:f.height}),l.des=r,l.area="contain";return}const c=Array.from(r.querySelectorAll(':scope > [data-type="tab"]'));if(!E.current||!l)return;const s=d.getNavbarDropPreview(r.getBoundingClientRect(),c.map(f=>f.getBoundingClientRect()),t.clientX,t.clientY);s&&(G(s),l.des=c[s.index],l.area=s.area)},Ce=t=>{t.preventDefault(),t.stopPropagation(),t.dataTransfer&&(t.dataTransfer.dropEffect="move");const r=t.currentTarget,{area:c,uid:s}=r.dataset;if(!c||!s||!E.current||!l)return;const f=c;l.des=r,l.area=f,G(d.getRootSplitPreview(i(),f))},G=t=>{const r=E.current;!r||d.isSameDropPreview(L,t)||(Object.assign(r.style,{left:`${t.left}px`,top:`${t.top}px`,width:`${t.width}px`,height:`${t.height}px`,display:"block",zIndex:"100"}),L=t)};let oe=null;const ie=()=>{q(d.Node.cache.nodOpts.get()),U(d.Node.cache.bndOpts.get()),y(),u&&u(d.DynamixLayoutCore._root.toJSON())},le=t=>{z.toggleMaximize(t)&&ie()},se=t=>{z.toggleCollapse(t)&&ie()},Se=t=>{const r=t.target.closest("[data-uid]"),c=r?.dataset.uid?d.Node.cache.mapElem.get(r.dataset.uid):void 0;c instanceof d.Node&&(c.type==="tabset"?oe=c.unId:c.type==="tab"&&c.host&&(oe=c.host.unId))},$e=t=>{const r=t.currentTarget.dataset.uid;Q&&r&&le(r)},de=t=>{if(!W||!t.altKey||t.ctrlKey||t.metaKey)return;const r=oe??z.maximizedId;r&&(t.code==="Equal"||t.code==="NumpadAdd"?(t.preventDefault(),le(r)):(t.code==="Minus"||t.code==="NumpadSubtract")&&(t.preventDefault(),se(r)))},ze=t=>{if(t.stopPropagation(),z.restore()&&ie(),C(!0),document.body.style.cursor="move",t.currentTarget){if(t.dataTransfer){t.dataTransfer.effectAllowed="move";const r=document.createElement("div");r.style.width="1px",r.style.height="1px",r.style.backgroundColor="transparent",r.style.position="absolute",r.style.top="-1000px",document.body.appendChild(r),t.dataTransfer.setDragImage(r,0,0),setTimeout(()=>{r.parentNode&&r.parentNode.removeChild(r)},0)}B.forEach(r=>{r&&(r.style.display="block",r.style.zIndex="99")}),F.forEach(r=>{r&&(r.style.display="block",r.style.zIndex="95")}),l.src=t.currentTarget,l.drag=!0}},Ne=t=>{if(t.preventDefault(),t.stopPropagation(),document.body.style.cursor="move",t.dataTransfer&&(t.dataTransfer.dropEffect="move"),!l?.src)return;const r=t.currentTarget,c=t.clientX,s=t.clientY;$&&cancelAnimationFrame($),$=requestAnimationFrame(()=>{De(c,s,r)})},Me=()=>{if(document.body.style.cursor="default",B.forEach(t=>{t&&(t.style.display="none",t.style.zIndex="-1")}),$&&(cancelAnimationFrame($),$=null),E.current&&(E.current.style.display="none",E.current.style.zIndex="-1"),L={},l.drag=!1,!l?.src||!l?.des){l.area=void 0,l.src=void 0,l.des=void 0,C(!1);return}if(l.src===l.des){l.area=void 0,l.src=void 0,l.des=void 0,C(!1);return}if(l.src&&l.des){if(!l.area){console.warn("No area specified for drag and drop"),C(!1);return}if(!z.updateTree(l.src.dataset.uid,l.des.dataset.uid,l.area||"contain")){console.warn("Failed to update layout tree"),C(!1);return}requestAnimationFrame(()=>{q(d.Node.cache.nodOpts.get()),U(d.Node.cache.bndOpts.get()),y(),u&&u(d.DynamixLayoutCore._root.toJSON())})}l.area=void 0,l.src=void 0,l.des=void 0,C(!1)},Re=t=>{t.preventDefault(),t.stopPropagation(),t.dataTransfer&&(t.dataTransfer.dropEffect="move")},Le=t=>{t.preventDefault(),t.stopPropagation()},Pe=t=>{t.preventDefault(),t.stopPropagation(),t.dataTransfer&&t.dataTransfer.getData("text/plain")},ke=t=>{const r=t.currentTarget,c=r.dataset.uid;if(!c)return;const s=d.Node.cache.mapElem.get(c);if(!(s instanceof d.Node)){console.warn(`Element with uid ${c} is not a Node instance`);return}if(!s||!s.host||!s.host.unId){console.warn(`Node with uid ${c} not found in mapNode`);return}if(s.host.open==s.name){console.warn(`Node ${s.name} is already open`);return}const f=d.Node.cache.nodOpts.get().get(s.host.unId);if(!f||f.nodOpen&&s?.open)return;s.host.open=s.name,f.nodOpen=s.name,f.nodKids?.forEach(k=>{k.nodOpen=k.nodName===s.name}),r?.parentElement?.childNodes?.forEach(k=>{k instanceof HTMLDivElement&&k.dataset.uid!==c?k.dataset.state="inactive":k.dataset.state="active"}),y()};return x.onMount(()=>{const t=c=>{z.updateDimension(i(),c,S)};t(!0);const r=()=>t(_??!1);window.addEventListener("resize",r),window.addEventListener("keydown",de),q(d.Node.cache.nodOpts.get()),U(d.Node.cache.bndOpts.get()),y(),u&&u(d.DynamixLayoutCore._root.toJSON()),x.onCleanup(()=>{window.removeEventListener("resize",r),window.removeEventListener("keydown",de),R(),h(),a(),w.cancel(),$&&cancelAnimationFrame($)})}),{tabsets:ee,sliders:te,tabsetsRef:A,panelsRef:F,tabsRef:V,slidersRef:X,layoutJSON:j,layoutInstance:z,hoverElementRef:E,rootSplitHoverEl:B,dragging:re,isUpdating:ne,setIsUpdating:ae,setDragging:C,setTabsets:Y,setSliders:J,setLayoutJSON:H,onDragStart:ze,onDragOver:Ne,onDragEnd:Me,onDragEnter:Re,onDragLeave:Le,onDrop:Pe,onPointerDown:D,updateActiveTab:ke,handleRootSplit:Ce,handleNavbarDragOver:Ee,toggleMaximize:le,toggleCollapse:se,onRootPointerDown:Se,onTabbarDoubleClick:$e}};var je=n.template("<div>"),qe=n.template('<div class="flex items-center justify-center h-full"><span class=text-gray-500>No content');const Te=e=>{const o=[],v=new Map,u=new Map;for(const[i,m]of e){const g=crypto.randomUUID();o.push(i),v.set(i,{uqid:g,name:i,node:m}),u.set(i,g)}return{keys:o,maps:v,name:u}},Ue=e=>{const o=x.createMemo(()=>Te(e.tabs));let v;const u=()=>{const y=v;if(!y)return{w:0,h:0,x:0,y:0};const R=y.getBoundingClientRect(),a=e.pad||{t:0,b:0,l:0,r:0};return{w:R.width-(a.l+a.r),h:R.height-(a.t+a.b),x:R.left+a.l,y:R.top+a.t}},{tabsetsRef:i,slidersRef:m,sliders:g,tabsets:p,hoverElementRef:b,onDragEnd:T,onDragOver:N,onDragStart:S,onDragEnter:I,onDragLeave:_,onDrop:W,dragging:Q,panelsRef:A,onPointerDown:X,handleNavbarDragOver:F,updateActiveTab:V,rootSplitHoverEl:E,handleRootSplit:B,tabsRef:j,isUpdating:H,toggleMaximize:ee,toggleCollapse:Y,onRootPointerDown:te,onTabbarDoubleClick:J}=we({tabOutput:o(),rootId:e.rootId||"dynamix-layout-root",updateJSON:e.updateJSON,enableTabbar:e.enableTabbar===void 0?!0:e.enableTabbar,layoutTree:e.layoutTree,tabHeadHeight:e.tabHeadHeight||d.DynamixLayoutCore._minH,dimensions:u,sliderUpdateTimeout:e.sliderUpdateTimeout||2,windowResizeTimeout:e.windowResizeTimeout||2,bondWidth:e.bondWidth||d.DynamixLayoutCore._bond,minTabHeight:e.minTabHeight||d.DynamixLayoutCore._minH,minTabWidth:e.minTabWidth||d.DynamixLayoutCore._minW,disableSliderTimeout:e.disableSliderTimeout===void 0?!0:e.disableSliderTimeout,disableResizeTimeout:e.disableResizeTimeout===void 0?!0:e.disableResizeTimeout,hoverElementStyles:e.hoverElementStyles,keyboardShortcuts:e.keyboardShortcuts??!0,enableDoubleClickMaximize:e.enableDoubleClickMaximize??!0}),re=e.WrapTabPanel||he,C=e.WrapTabHead||be,$=e.WrapTabLabel||me,ne=e.WrapTabBody||fe,ae=e.SliderElement||ye,l=e.HoverElement||ve,M=e.TabsetToolbar||xe,Z=e.tabHeadHeight||d.DynamixLayoutCore._minH,z=e.enableTabbar??!0,q=e.enableMaximize??!0,U=(e.enableCollapse??!0)&&z;return(()=>{var y=je(),R=v;return typeof R=="function"?n.use(R,y):v=y,n.spread(y,n.mergeProps({get id(){return e.rootId||"dynamix-layout-root"}},e,{get"data-testid"(){return e.rootId||"dynamix-layout-root"},get class(){return Q()?"is-dragging":""},onPointerDown:te,get style(){return{position:"relative",width:"100%",height:"100%",overflow:"hidden",...e.style}}}),!1,!0),n.insert(y,n.createComponent(x.For,{get each(){return Array.from(p().values())},children:a=>{const h=d.getTabbarPlacement(a,Z),w=q&&!!a.nodMaximizable,K=U&&!!a.nodFoldable&&!a.nodMaxd,P=w||K;return[n.createComponent(re,{ref:D=>{const L=a.uidNode;D?A.set(L,D):A.delete(L)},onDragEnd:T,onDragOver:N,onDragEnter:I,onDragLeave:_,onDrop:W,get"data-uid"(){return a.uidNode},get"data-type"(){return a.typNode},get class(){return"hide-scrollbar DefaultWrapTabPanel "+(e.tabPanelElementClass||"")},get style(){return{position:"absolute",...e.tabPanelElementStyles,width:`${a.nodDims.w}px`,height:`${a.nodDims.h}px`,left:`${a.nodDims.x}px`,top:`${a.nodDims.y}px`,"background-color":"transparent"}}}),n.createComponent(C,{get draggable(){return!H()},get"data-uid"(){return a.uidNode},"data-type":"tabset","data-tabbar":"",get"data-folded"(){return a.nodFold?"":void 0},get"data-maximized"(){return a.nodMaxd?"":void 0},get"data-dx-hidden"(){return a.nodHidden?"":void 0},get"data-rotated"(){return h.rotated?"":void 0},onDblClick:J,onDragOver:F,onDragStart:S,onDragEnd:T,onDragEnter:I,onDragLeave:_,onDrop:W,ref:D=>{const L=a.uidNode;D?i.set(L,D):i.delete(L)},get class(){return"hide-scrollbar "+(e.tabHeadElementClass||"")},get style(){return{...e.tabHeadElementStyles,position:"absolute","z-index":99,width:`${h.rect.w}px`,height:`${h.rect.h}px`,left:`${h.rect.x}px`,top:`${h.rect.y}px`,"transform-origin":"0 0",...h.rotated?{transform:"rotate(90deg)"}:{},...P?{"padding-right":"64px"}:{},cursor:H()?"wait":"pointer"}},get children(){return[n.createComponent(x.For,{get each(){return a.nodKids},children:D=>n.createComponent($,{get"data-uid"(){return D.uidNode},"data-type":"tab",onDragStart:S,onDragEnd:T,get draggable(){return!H()},get active(){return!!D.nodOpen},get class(){return"hide-scrollbar "+(e.tabLabelElementClass||"")},get style(){return{cursor:H()?"wait":"pointer",...e.tabLabelElementStyles}},onClick:V,get children(){return n.memo(()=>!!e.tabNames)()&&e.tabNames.get(D.nodName)||D.nodName}})}),n.memo(()=>P&&n.createComponent(M,{get maximized(){return!!a.nodMaxd},get folded(){return!!a.nodFold},get rotated(){return h.rotated},get rowIsHorizontal(){return a.nodeDir===!1},showMaximize:w,showFold:K,onToggleMaximize:()=>ee(a.uidNode),onToggleFold:()=>Y(a.uidNode)}))]}})]}}),null),n.insert(y,n.createComponent(x.For,{get each(){return o().keys},children:a=>{const h=o().maps.get(a)?.uqid;return n.createComponent(ne,{id:h,draggable:!1,"data-uid":h,get class(){return"hide-scrollbar "+(e.tabBodyElementClass||"")},get style(){return{position:"absolute","z-index":90,"overscroll-behavior":"contain",...e.tabBodyElementStyles}},ref:w=>{h&&(w?j.set(h,w):j.delete(h))},get children(){return o().maps.get(a)?.node||qe()}})}}),null),n.insert(y,n.createComponent(x.For,{get each(){return Array.from(g().values())},children:a=>n.createComponent(ae,{get id(){return a.uidNode},get"data-uid"(){return a.uidNode},get"data-dx-hidden"(){return a.nodHidden?"":void 0},get direction(){return a.nodeDir},onPointerDown:X,get class(){return"hide-scrollbar "+(e.sliderElementClass||"")},ref:h=>{const w=a.uidNode;h?m.set(w,h):m.delete(w)},get style(){return{width:`${a.nodDims.w}px`,height:`${a.nodDims.h}px`,left:`${a.nodDims.x}px`,top:`${a.nodDims.y}px`,cursor:a.nodeDir?"ns-resize":"ew-resize",...a.nodLocked?{"pointer-events":"none"}:{},...e.sliderElementStyles}}})}),null),n.insert(y,n.createComponent(l,{get class(){return"hide-scrollbar "+(e.hoverElementClass||"")},get style(){return{...e.hoverElementStyles}},ref:a=>b.current=a}),null),n.insert(y,n.createComponent(x.For,{each:["left","right","top","bottom"],children:(a,h)=>n.createComponent(pe,{onDragOver:B,onDragEnd:T,onDragEnter:I,onDragLeave:_,onDrop:W,get"data-uid"(){return e.rootId||"dynamix-layout-root"},"data-area":a,get class(){return"hide-scrollbar "+(e.RootSplitterHoverElClass||"")},ref:w=>{w&&(E[h()]=w)},get style(){return{...e.RootSplitterHoverElStyles}},area:a,size:{h:"25%",w:"8px"}})}),null),y})()};exports.DefaultHoverElement=ve;exports.DefaultSliderElement=ye;exports.DefaultTabsetToolbar=xe;exports.DefaultWrapTabBody=fe;exports.DefaultWrapTabHead=be;exports.DefaultWrapTabLabel=me;exports.DefaultWrapTabPanel=he;exports.DynamixLayout=Ue;exports.RootSplitterHoverEl=pe;exports.getTabOutput=Te;exports.useDynamixLayout=we;
|
package/dist/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.DefaultWrapTabLabel[data-state=active]{background-color:#fff;font-family:Poppins,sans-serif}.DefaultWrapTabLabel[data-state=inactive]{background-color:#dfdfdf;font-family:Poppins,sans-serif}.hide-scrollbar::-webkit-scrollbar{display:none}.is-dragging .DefaultWrapTabBody>*{pointer-events:none}
|
|
1
|
+
.DefaultWrapTabLabel[data-state=active]{background-color:#fff;font-family:Poppins,sans-serif}.DefaultWrapTabLabel[data-state=inactive]{background-color:#dfdfdf;font-family:Poppins,sans-serif}.hide-scrollbar::-webkit-scrollbar{display:none}.is-dragging .DefaultWrapTabBody>*{pointer-events:none}.DefaultTabsetToolbar{position:absolute;top:0;right:6px;height:100%;display:flex;align-items:center;gap:2px;padding-left:6px;background:inherit;opacity:0;transition:opacity .15s ease}[data-tabbar]:hover .DefaultTabsetToolbar,[data-tabbar][data-folded] .DefaultTabsetToolbar,.DefaultTabsetToolbar:focus-within{opacity:1}@media(hover:none){.DefaultTabsetToolbar{opacity:1}}.DefaultTabsetToolbarButton{display:grid;place-items:center;width:24px;height:24px;padding:0;border:0;border-radius:4px;background:transparent;color:inherit;cursor:pointer}.DefaultTabsetToolbarButton:hover,.DefaultTabsetToolbarButton:focus-visible{background-color:#00000014}[data-dx-hidden]{display:none!important}
|