react-panel-layout 0.2.0 → 0.4.1

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.
@@ -22,87 +22,93 @@ export declare const CSS_VAR_PREFIX = "rpl";
22
22
  /**
23
23
  * Tab colors - used in TabBar component
24
24
  */
25
- export declare const COLOR_TAB_FG = "var(--rpl-color-tab-fg)";
26
- export declare const COLOR_TAB_ACTIVE_BG = "var(--rpl-color-tab-active-bg)";
27
- export declare const COLOR_TABBAR_BG = "var(--rpl-color-tabbar-bg)";
25
+ export declare const COLOR_TAB_FG = "var(--rpl-color-tab-fg, #d5d7de)";
26
+ export declare const COLOR_TAB_ACTIVE_BG = "var(--rpl-color-tab-active-bg, #2b2d35)";
27
+ export declare const COLOR_TABBAR_BG = "var(--rpl-color-tabbar-bg, #1e1f24)";
28
28
  /**
29
29
  * Panel colors - used in panel layouts
30
30
  */
31
- export declare const COLOR_PANEL_BORDER = "var(--rpl-color-panel-border)";
32
- export declare const COLOR_PANEL_BG = "var(--rpl-color-panel-bg)";
31
+ export declare const COLOR_PANEL_BORDER = "var(--rpl-color-panel-border, rgba(0, 0, 0, 0.3))";
32
+ export declare const COLOR_PANEL_BG = "var(--rpl-color-panel-bg, #0b0b0c)";
33
33
  /**
34
34
  * Primary color - used for resize handles, highlights
35
35
  */
36
- export declare const COLOR_PRIMARY = "var(--rpl-color-primary)";
37
- export declare const COLOR_RESIZE_HANDLE_IDLE = "var(--rpl-color-resize-handle-idle)";
38
- export declare const COLOR_RESIZE_HANDLE_HOVER = "var(--rpl-color-resize-handle-hover)";
39
- export declare const COLOR_RESIZE_HANDLE_ACTIVE = "var(--rpl-color-resize-handle-active)";
36
+ export declare const COLOR_PRIMARY = "var(--rpl-color-primary, #2196f3)";
37
+ export declare const COLOR_RESIZE_HANDLE_IDLE = "var(--rpl-color-resize-handle-idle, rgba(255, 255, 255, 0.12))";
38
+ export declare const COLOR_RESIZE_HANDLE_HOVER = "var(--rpl-color-resize-handle-hover, rgba(33, 150, 243, 0.35))";
39
+ export declare const COLOR_RESIZE_HANDLE_ACTIVE = "var(--rpl-color-resize-handle-active, rgba(33, 150, 243, 0.55))";
40
40
  /**
41
41
  * Drop suggestion overlay colors
42
42
  */
43
- export declare const COLOR_DROP_SUGGEST_BORDER = "var(--rpl-color-drop-suggest-border)";
44
- export declare const COLOR_DROP_SUGGEST_BG = "var(--rpl-color-drop-suggest-bg)";
43
+ export declare const COLOR_DROP_SUGGEST_BORDER = "var(--rpl-color-drop-suggest-border, rgba(90, 150, 255, 0.9))";
44
+ export declare const COLOR_DROP_SUGGEST_BG = "var(--rpl-color-drop-suggest-bg, rgba(90, 150, 255, 0.15))";
45
45
  /**
46
46
  * Tab drag overlay colors
47
47
  */
48
- export declare const COLOR_TABDRAG_BG = "var(--rpl-color-tabdrag-bg)";
49
- export declare const COLOR_TABDRAG_FG = "var(--rpl-color-tabdrag-fg)";
50
- export declare const COLOR_TABDRAG_BORDER = "var(--rpl-color-tabdrag-border)";
51
- export declare const COLOR_TABDRAG_SHADOW = "var(--rpl-color-tabdrag-shadow)";
48
+ export declare const COLOR_TABDRAG_BG = "var(--rpl-color-tabdrag-bg, rgba(34, 36, 42, 0.95))";
49
+ export declare const COLOR_TABDRAG_FG = "var(--rpl-color-tabdrag-fg, #e9ebf0)";
50
+ export declare const COLOR_TABDRAG_BORDER = "var(--rpl-color-tabdrag-border, rgba(120, 160, 255, 0.6))";
51
+ export declare const COLOR_TABDRAG_SHADOW = "var(--rpl-color-tabdrag-shadow, 0 6px 20px rgba(0, 0, 0, 0.35))";
52
52
  /**
53
53
  * Insert guide colors
54
54
  */
55
- export declare const COLOR_INSERT_GUIDE = "var(--rpl-color-insert-guide)";
56
- export declare const COLOR_INSERT_GUIDE_SHADOW = "var(--rpl-color-insert-guide-shadow)";
55
+ export declare const COLOR_INSERT_GUIDE = "var(--rpl-color-insert-guide, rgba(120, 160, 255, 0.95))";
56
+ export declare const COLOR_INSERT_GUIDE_SHADOW = "var(--rpl-color-insert-guide-shadow, 0 0 0 2px rgba(120, 160, 255, 0.2))";
57
57
  /**
58
58
  * Node editor / floating panel colors
59
59
  * These are used by Drawer and FloatingPanelFrame components
60
60
  */
61
- export declare const COLOR_NODE_EDITOR_SURFACE = "var(--rpl-color-surface)";
62
- export declare const COLOR_NODE_EDITOR_SURFACE_2 = "var(--rpl-color-surface-2)";
63
- export declare const COLOR_NODE_EDITOR_BORDER = "var(--rpl-color-border)";
64
- export declare const COLOR_NODE_EDITOR_MUTED_FG = "var(--rpl-color-muted-fg)";
65
- export declare const COLOR_NODE_EDITOR_CARD_SHADOW = "var(--rpl-shadow-card)";
61
+ export declare const COLOR_NODE_EDITOR_SURFACE = "var(--rpl-color-surface, #fff)";
62
+ export declare const COLOR_NODE_EDITOR_SURFACE_2 = "var(--rpl-color-surface-2, #fafafa)";
63
+ export declare const COLOR_NODE_EDITOR_BORDER = "var(--rpl-color-border, #e5e7eb)";
64
+ export declare const COLOR_NODE_EDITOR_MUTED_FG = "var(--rpl-color-muted-fg, #6b7280)";
65
+ export declare const COLOR_NODE_EDITOR_CARD_SHADOW = "var(--rpl-shadow-card, 0 2px 10px rgba(0, 0, 0, 0.08))";
66
+ export declare const COLOR_DRAWER_BACKDROP = "var(--rpl-color-drawer-backdrop, rgba(0, 0, 0, 0.5))";
67
+ /**
68
+ * Drawer transitions
69
+ */
70
+ export declare const DRAWER_TRANSITION_DURATION = "var(--rpl-drawer-transition-duration, 220ms)";
71
+ export declare const DRAWER_TRANSITION_EASING = "var(--rpl-drawer-transition-easing, cubic-bezier(0.22, 1, 0.36, 1))";
66
72
  /**
67
73
  * Tab sizing
68
74
  */
69
- export declare const SIZE_TAB_FONT = "var(--rpl-size-tab-font)";
70
- export declare const SPACE_TAB_PADDING_Y = "var(--rpl-space-tab-padding-y)";
71
- export declare const SPACE_TAB_PADDING_X = "var(--rpl-space-tab-padding-x)";
75
+ export declare const SIZE_TAB_FONT = "var(--rpl-size-tab-font, 12px)";
76
+ export declare const SPACE_TAB_PADDING_Y = "var(--rpl-space-tab-padding-y, 4px)";
77
+ export declare const SPACE_TAB_PADDING_X = "var(--rpl-space-tab-padding-x, 8px)";
72
78
  /**
73
79
  * Tabbar spacing
74
80
  */
75
- export declare const SPACE_TABBAR_GAP = "var(--rpl-space-tabbar-gap)";
76
- export declare const SPACE_TABBAR_PADDING_Y = "var(--rpl-space-tabbar-padding-y)";
77
- export declare const SPACE_TABBAR_PADDING_X = "var(--rpl-space-tabbar-padding-x)";
81
+ export declare const SPACE_TABBAR_GAP = "var(--rpl-space-tabbar-gap, 6px)";
82
+ export declare const SPACE_TABBAR_PADDING_Y = "var(--rpl-space-tabbar-padding-y, 4px)";
83
+ export declare const SPACE_TABBAR_PADDING_X = "var(--rpl-space-tabbar-padding-x, 6px)";
78
84
  /**
79
85
  * Border radius (decorative, using CSS variables)
80
86
  */
81
- export declare const RADIUS_TAB = "var(--rpl-radius-tab)";
82
- export declare const RADIUS_SUGGEST = "var(--rpl-radius-suggest)";
87
+ export declare const RADIUS_TAB = "var(--rpl-radius-tab, 4px)";
88
+ export declare const RADIUS_SUGGEST = "var(--rpl-radius-suggest, 6px)";
83
89
  /**
84
90
  * Border widths
85
91
  */
86
- export declare const SIZE_SUGGEST_BORDER = "var(--rpl-size-suggest-border)";
92
+ export declare const SIZE_SUGGEST_BORDER = "var(--rpl-size-suggest-border, 2px)";
87
93
  /**
88
94
  * Handle thicknesses
89
95
  * Note: SIZE_GRID_HANDLE_THICKNESS is kept as number for JavaScript calculations
90
96
  */
91
97
  export declare const SIZE_GRID_HANDLE_THICKNESS = 4;
92
- export declare const SIZE_RESIZE_HANDLE_THICKNESS = "var(--rpl-size-resize-handle-thickness)";
93
- export declare const SIZE_SPLIT_HANDLE_THICKNESS = "var(--rpl-size-split-handle-thickness)";
98
+ export declare const SIZE_RESIZE_HANDLE_THICKNESS = "var(--rpl-size-resize-handle-thickness, 4px)";
99
+ export declare const SIZE_SPLIT_HANDLE_THICKNESS = "var(--rpl-size-split-handle-thickness, 6px)";
94
100
  /**
95
101
  * Drop suggest padding
96
102
  */
97
- export declare const SPACE_DROP_SUGGEST_PADDING = "var(--rpl-space-drop-suggest-padding)";
98
- export declare const Z_OVERLAY = "var(--rpl-z-overlay)";
99
- export declare const Z_TABDRAG_OVERLAY = "var(--rpl-z-tabdrag-overlay)";
100
- export declare const Z_DIALOG_OVERLAY = "var(--rpl-z-dialog-overlay)";
103
+ export declare const SPACE_DROP_SUGGEST_PADDING = "var(--rpl-space-drop-suggest-padding, 6px)";
104
+ export declare const Z_OVERLAY = "var(--rpl-z-overlay, 9998)";
105
+ export declare const Z_TABDRAG_OVERLAY = "var(--rpl-z-tabdrag-overlay, 9999)";
106
+ export declare const Z_DIALOG_OVERLAY = "var(--rpl-z-dialog-overlay, 10000)";
101
107
  /**
102
108
  * Resize Handle
103
109
  */
104
- export declare const RESIZE_HANDLE_THICKNESS = "var(--rpl-size-resize-handle-thickness)";
105
- export declare const RESIZE_HANDLE_Z_INDEX = "var(--rpl-z-resize-handle)";
110
+ export declare const RESIZE_HANDLE_THICKNESS = "var(--rpl-size-resize-handle-thickness, 4px)";
111
+ export declare const RESIZE_HANDLE_Z_INDEX = "var(--rpl-z-resize-handle, 1000)";
106
112
  /**
107
113
  * Grid Track Resize Handle
108
114
  */
@@ -110,72 +116,72 @@ export declare const GRID_HANDLE_THICKNESS = 4;
110
116
  /**
111
117
  * Grid Layer Resize Handles
112
118
  */
113
- export declare const GRID_LAYER_CORNER_HIT_SIZE = "var(--rpl-size-grid-layer-corner-hit)";
114
- export declare const GRID_LAYER_EDGE_HIT_THICKNESS = "var(--rpl-size-grid-layer-edge-hit-thickness)";
119
+ export declare const GRID_LAYER_CORNER_HIT_SIZE = "var(--rpl-size-grid-layer-corner-hit, 14px)";
120
+ export declare const GRID_LAYER_EDGE_HIT_THICKNESS = "var(--rpl-size-grid-layer-edge-hit-thickness, 12px)";
115
121
  /**
116
122
  * Drop Suggest Overlay
117
123
  */
118
- export declare const DROP_SUGGEST_Z_INDEX = "var(--rpl-z-overlay)";
119
- export declare const DROP_SUGGEST_BORDER_WIDTH = "var(--rpl-size-suggest-border)";
120
- export declare const DROP_SUGGEST_BORDER_RADIUS = "var(--rpl-radius-suggest)";
121
- export declare const DROP_SUGGEST_BORDER_COLOR = "var(--rpl-color-drop-suggest-border)";
122
- export declare const DROP_SUGGEST_BG_COLOR = "var(--rpl-color-drop-suggest-bg)";
123
- export declare const DROP_SUGGEST_PADDING = "var(--rpl-space-drop-suggest-padding)";
124
+ export declare const DROP_SUGGEST_Z_INDEX = "var(--rpl-z-overlay, 9998)";
125
+ export declare const DROP_SUGGEST_BORDER_WIDTH = "var(--rpl-size-suggest-border, 2px)";
126
+ export declare const DROP_SUGGEST_BORDER_RADIUS = "var(--rpl-radius-suggest, 6px)";
127
+ export declare const DROP_SUGGEST_BORDER_COLOR = "var(--rpl-color-drop-suggest-border, rgba(90, 150, 255, 0.9))";
128
+ export declare const DROP_SUGGEST_BG_COLOR = "var(--rpl-color-drop-suggest-bg, rgba(90, 150, 255, 0.15))";
129
+ export declare const DROP_SUGGEST_PADDING = "var(--rpl-space-drop-suggest-padding, 6px)";
124
130
  export declare const DROP_SUGGEST_PADDING_PX = 6;
125
131
  /**
126
132
  * Tab Drag Overlay
127
133
  */
128
- export declare const TAB_DRAG_OVERLAY_Z_INDEX = "var(--rpl-z-tabdrag-overlay)";
129
- export declare const TAB_DRAG_PREVIEW_OFFSET_X = "var(--rpl-space-tab-drag-preview-offset-x)";
130
- export declare const TAB_DRAG_PREVIEW_OFFSET_Y = "var(--rpl-space-tab-drag-preview-offset-y)";
131
- export declare const TAB_DRAG_PREVIEW_BORDER_RADIUS = "var(--rpl-radius-tab-drag-preview)";
132
- export declare const TAB_DRAG_PREVIEW_PADDING_Y = "var(--rpl-space-tab-drag-preview-padding-y)";
133
- export declare const TAB_DRAG_PREVIEW_PADDING_X = "var(--rpl-space-tab-drag-preview-padding-x)";
134
- export declare const TAB_DRAG_PREVIEW_FONT_SIZE = "var(--rpl-size-tab-drag-preview-font)";
135
- export declare const TAB_DRAG_INSERT_GUIDE_WIDTH = "var(--rpl-size-tab-drag-insert-guide-width)";
136
- export declare const TAB_DRAG_INSERT_GUIDE_BORDER_RADIUS = "var(--rpl-radius-tab-drag-insert-guide)";
137
- export declare const TAB_DRAG_PREVIEW_BG_COLOR = "var(--rpl-color-tabdrag-bg)";
138
- export declare const TAB_DRAG_PREVIEW_FG_COLOR = "var(--rpl-color-tabdrag-fg)";
139
- export declare const TAB_DRAG_PREVIEW_BORDER_COLOR = "var(--rpl-color-tabdrag-border)";
140
- export declare const TAB_DRAG_PREVIEW_SHADOW = "var(--rpl-color-tabdrag-shadow)";
141
- export declare const TAB_DRAG_INSERT_GUIDE_COLOR = "var(--rpl-color-insert-guide)";
142
- export declare const TAB_DRAG_INSERT_GUIDE_SHADOW = "var(--rpl-color-insert-guide-shadow)";
134
+ export declare const TAB_DRAG_OVERLAY_Z_INDEX = "var(--rpl-z-tabdrag-overlay, 9999)";
135
+ export declare const TAB_DRAG_PREVIEW_OFFSET_X = "var(--rpl-space-tab-drag-preview-offset-x, 12px)";
136
+ export declare const TAB_DRAG_PREVIEW_OFFSET_Y = "var(--rpl-space-tab-drag-preview-offset-y, 12px)";
137
+ export declare const TAB_DRAG_PREVIEW_BORDER_RADIUS = "var(--rpl-radius-tab-drag-preview, 6px)";
138
+ export declare const TAB_DRAG_PREVIEW_PADDING_Y = "var(--rpl-space-tab-drag-preview-padding-y, 4px)";
139
+ export declare const TAB_DRAG_PREVIEW_PADDING_X = "var(--rpl-space-tab-drag-preview-padding-x, 8px)";
140
+ export declare const TAB_DRAG_PREVIEW_FONT_SIZE = "var(--rpl-size-tab-drag-preview-font, 12px)";
141
+ export declare const TAB_DRAG_INSERT_GUIDE_WIDTH = "var(--rpl-size-tab-drag-insert-guide-width, 2px)";
142
+ export declare const TAB_DRAG_INSERT_GUIDE_BORDER_RADIUS = "var(--rpl-radius-tab-drag-insert-guide, 1px)";
143
+ export declare const TAB_DRAG_PREVIEW_BG_COLOR = "var(--rpl-color-tabdrag-bg, rgba(34, 36, 42, 0.95))";
144
+ export declare const TAB_DRAG_PREVIEW_FG_COLOR = "var(--rpl-color-tabdrag-fg, #e9ebf0)";
145
+ export declare const TAB_DRAG_PREVIEW_BORDER_COLOR = "var(--rpl-color-tabdrag-border, rgba(120, 160, 255, 0.6))";
146
+ export declare const TAB_DRAG_PREVIEW_SHADOW = "var(--rpl-color-tabdrag-shadow, 0 6px 20px rgba(0, 0, 0, 0.35))";
147
+ export declare const TAB_DRAG_INSERT_GUIDE_COLOR = "var(--rpl-color-insert-guide, rgba(120, 160, 255, 0.95))";
148
+ export declare const TAB_DRAG_INSERT_GUIDE_SHADOW = "var(--rpl-color-insert-guide-shadow, 0 0 0 2px rgba(120, 160, 255, 0.2))";
143
149
  /**
144
150
  * Dialog Overlay
145
151
  */
146
- export declare const DIALOG_OVERLAY_Z_INDEX = "var(--rpl-z-dialog-overlay)";
152
+ export declare const DIALOG_OVERLAY_Z_INDEX = "var(--rpl-z-dialog-overlay, 10000)";
147
153
  /**
148
154
  * Floating Panel Frame
149
155
  */
150
- export declare const FLOATING_PANEL_BORDER_RADIUS = "var(--rpl-radius-floating-panel)";
151
- export declare const FLOATING_PANEL_GAP = "var(--rpl-space-floating-panel-gap)";
152
- export declare const FLOATING_PANEL_HEADER_PADDING_Y = "var(--rpl-space-floating-panel-header-padding-y)";
153
- export declare const FLOATING_PANEL_HEADER_PADDING_X = "var(--rpl-space-floating-panel-header-padding-x)";
154
- export declare const FLOATING_PANEL_CONTENT_PADDING = "var(--rpl-space-floating-panel-content-padding)";
155
- export declare const FLOATING_PANEL_META_FONT_SIZE = "var(--rpl-size-floating-panel-meta-font)";
156
- export declare const FLOATING_PANEL_CONTROLS_GAP = "var(--rpl-space-floating-panel-controls-gap)";
157
- export declare const FLOATING_PANEL_SURFACE_COLOR = "var(--rpl-color-surface)";
158
- export declare const FLOATING_PANEL_SURFACE_2_COLOR = "var(--rpl-color-surface-2)";
159
- export declare const FLOATING_PANEL_BORDER_COLOR = "var(--rpl-color-border)";
160
- export declare const FLOATING_PANEL_MUTED_FG_COLOR = "var(--rpl-color-muted-fg)";
161
- export declare const FLOATING_PANEL_SHADOW = "var(--rpl-shadow-card)";
156
+ export declare const FLOATING_PANEL_BORDER_RADIUS = "var(--rpl-radius-floating-panel, 8px)";
157
+ export declare const FLOATING_PANEL_GAP = "var(--rpl-space-floating-panel-gap, 8px)";
158
+ export declare const FLOATING_PANEL_HEADER_PADDING_Y = "var(--rpl-space-floating-panel-header-padding-y, 8px)";
159
+ export declare const FLOATING_PANEL_HEADER_PADDING_X = "var(--rpl-space-floating-panel-header-padding-x, 12px)";
160
+ export declare const FLOATING_PANEL_CONTENT_PADDING = "var(--rpl-space-floating-panel-content-padding, 12px)";
161
+ export declare const FLOATING_PANEL_META_FONT_SIZE = "var(--rpl-size-floating-panel-meta-font, 12px)";
162
+ export declare const FLOATING_PANEL_CONTROLS_GAP = "var(--rpl-space-floating-panel-controls-gap, 6px)";
163
+ export declare const FLOATING_PANEL_SURFACE_COLOR = "var(--rpl-color-surface, #fff)";
164
+ export declare const FLOATING_PANEL_SURFACE_2_COLOR = "var(--rpl-color-surface-2, #fafafa)";
165
+ export declare const FLOATING_PANEL_BORDER_COLOR = "var(--rpl-color-border, #e5e7eb)";
166
+ export declare const FLOATING_PANEL_MUTED_FG_COLOR = "var(--rpl-color-muted-fg, #6b7280)";
167
+ export declare const FLOATING_PANEL_SHADOW = "var(--rpl-shadow-card, 0 2px 10px rgba(0, 0, 0, 0.08))";
162
168
  /**
163
169
  * Drawer
164
170
  */
165
- export declare const DRAWER_HEADER_PADDING_Y = "var(--rpl-space-drawer-header-padding-y)";
166
- export declare const DRAWER_HEADER_PADDING_X = "var(--rpl-space-drawer-header-padding-x)";
167
- export declare const DRAWER_HEADER_GAP = "var(--rpl-space-drawer-header-gap)";
168
- export declare const DRAWER_CONTENT_PADDING = "var(--rpl-space-drawer-content-padding)";
169
- export declare const DRAWER_CLOSE_BUTTON_FONT_SIZE = "var(--rpl-size-drawer-close-button-font)";
170
- export declare const DRAWER_SURFACE_COLOR = "var(--rpl-color-surface)";
171
- export declare const DRAWER_BORDER_COLOR = "var(--rpl-color-border)";
172
- export declare const DRAWER_SHADOW = "var(--rpl-shadow-card)";
171
+ export declare const DRAWER_HEADER_PADDING_Y = "var(--rpl-space-drawer-header-padding-y, 10px)";
172
+ export declare const DRAWER_HEADER_PADDING_X = "var(--rpl-space-drawer-header-padding-x, 12px)";
173
+ export declare const DRAWER_HEADER_GAP = "var(--rpl-space-drawer-header-gap, 8px)";
174
+ export declare const DRAWER_CONTENT_PADDING = "var(--rpl-space-drawer-content-padding, 12px)";
175
+ export declare const DRAWER_CLOSE_BUTTON_FONT_SIZE = "var(--rpl-size-drawer-close-button-font, 18px)";
176
+ export declare const DRAWER_SURFACE_COLOR = "var(--rpl-color-surface, #fff)";
177
+ export declare const DRAWER_BORDER_COLOR = "var(--rpl-color-border, #e5e7eb)";
178
+ export declare const DRAWER_SHADOW = "var(--rpl-shadow-card, 0 2px 10px rgba(0, 0, 0, 0.08))";
173
179
  /**
174
180
  * Split Handles
175
181
  */
176
- export declare const SPLIT_HANDLE_THICKNESS = "var(--rpl-size-split-handle-thickness)";
182
+ export declare const SPLIT_HANDLE_THICKNESS = "var(--rpl-size-split-handle-thickness, 6px)";
177
183
  /**
178
184
  * HorizontalDivider
179
185
  */
180
- export declare const HORIZONTAL_DIVIDER_WIDTH = "var(--rpl-size-horizontal-divider-width)";
181
- export declare const HORIZONTAL_DIVIDER_HIT_AREA_OFFSET = "var(--rpl-space-horizontal-divider-hit-area-offset)";
186
+ export declare const HORIZONTAL_DIVIDER_WIDTH = "var(--rpl-size-horizontal-divider-width, 4px)";
187
+ export declare const HORIZONTAL_DIVIDER_HIT_AREA_OFFSET = "var(--rpl-space-horizontal-divider-hit-area-offset, 4px)";
package/dist/floating.cjs CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),N=require("react"),o=require("./styles-BMEhL6I0.cjs");function A(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const l=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,l.get?l:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const a=A(N),g={display:"flex",flexDirection:"column",borderRadius:o.FLOATING_PANEL_BORDER_RADIUS,border:`1px solid ${o.FLOATING_PANEL_BORDER_COLOR}`,background:o.FLOATING_PANEL_SURFACE_COLOR,overflow:"hidden",boxShadow:o.FLOATING_PANEL_SHADOW},u={display:"flex",alignItems:"center",gap:o.FLOATING_PANEL_GAP,padding:`${o.FLOATING_PANEL_HEADER_PADDING_Y} ${o.FLOATING_PANEL_HEADER_PADDING_X}`,borderBottom:`1px solid ${o.FLOATING_PANEL_BORDER_COLOR}`,background:o.FLOATING_PANEL_SURFACE_2_COLOR},O={fontWeight:600},m={marginLeft:"auto",color:o.FLOATING_PANEL_MUTED_FG_COLOR,fontSize:o.FLOATING_PANEL_META_FONT_SIZE},y={display:"flex",alignItems:"center",gap:o.FLOATING_PANEL_CONTROLS_GAP},L={padding:o.FLOATING_PANEL_CONTENT_PADDING,overflow:"auto"},r=a.forwardRef(function({style:t,...n},l){const i=a.useMemo(()=>({...g,...t}),[t]);return s.jsx("div",{ref:l,style:i,...n})}),c=({style:e,...t})=>{const n=a.useMemo(()=>({...u,...e}),[e]);return s.jsx("div",{style:n,...t})},d=({style:e,...t})=>{const n=a.useMemo(()=>({...O,...e}),[e]);return s.jsx("span",{style:n,...t})},_=({style:e,...t})=>{const n=a.useMemo(()=>({...m,...e}),[e]);return s.jsx("span",{style:n,...t})},F=({style:e,...t})=>{const n=a.useMemo(()=>({...y,...e}),[e]);return s.jsx("div",{style:n,...t})},P=a.forwardRef(function({style:t,...n},l){const i=a.useMemo(()=>({...L,...t}),[t]);return s.jsx("div",{ref:l,style:i,...n})});r.displayName="FloatingPanelFrame";c.displayName="FloatingPanelHeader";d.displayName="FloatingPanelTitle";_.displayName="FloatingPanelMeta";F.displayName="FloatingPanelControls";P.displayName="FloatingPanelContent";exports.FloatingPanelContent=P;exports.FloatingPanelControls=F;exports.FloatingPanelFrame=r;exports.FloatingPanelHeader=c;exports.FloatingPanelMeta=_;exports.FloatingPanelTitle=d;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("./FloatingPanelFrame-Cu50Y9xg.cjs");exports.FloatingPanelContent=a.FloatingPanelContent;exports.FloatingPanelControls=a.FloatingPanelControls;exports.FloatingPanelFrame=a.FloatingPanelFrame;exports.FloatingPanelHeader=a.FloatingPanelHeader;exports.FloatingPanelMeta=a.FloatingPanelMeta;exports.FloatingPanelTitle=a.FloatingPanelTitle;
2
2
  //# sourceMappingURL=floating.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"floating.cjs","sources":["../src/components/paneling/FloatingPanelFrame.tsx"],"sourcesContent":["/**\n * @file Shared floating panel frame components for reusable overlay styling\n */\nimport * as React from \"react\";\nimport {\n FLOATING_PANEL_BORDER_RADIUS,\n FLOATING_PANEL_GAP,\n FLOATING_PANEL_HEADER_PADDING_Y,\n FLOATING_PANEL_HEADER_PADDING_X,\n FLOATING_PANEL_CONTENT_PADDING,\n FLOATING_PANEL_META_FONT_SIZE,\n FLOATING_PANEL_CONTROLS_GAP,\n FLOATING_PANEL_SURFACE_COLOR,\n FLOATING_PANEL_SURFACE_2_COLOR,\n FLOATING_PANEL_BORDER_COLOR,\n FLOATING_PANEL_MUTED_FG_COLOR,\n FLOATING_PANEL_SHADOW,\n} from \"../../constants/styles\";\n\nconst frameStyle: React.CSSProperties = {\n display: \"flex\",\n flexDirection: \"column\",\n borderRadius: FLOATING_PANEL_BORDER_RADIUS,\n border: `1px solid ${FLOATING_PANEL_BORDER_COLOR}`,\n background: FLOATING_PANEL_SURFACE_COLOR,\n overflow: \"hidden\",\n boxShadow: FLOATING_PANEL_SHADOW,\n};\n\nconst headerStyle: React.CSSProperties = {\n display: \"flex\",\n alignItems: \"center\",\n gap: FLOATING_PANEL_GAP,\n padding: `${FLOATING_PANEL_HEADER_PADDING_Y} ${FLOATING_PANEL_HEADER_PADDING_X}`,\n borderBottom: `1px solid ${FLOATING_PANEL_BORDER_COLOR}`,\n background: FLOATING_PANEL_SURFACE_2_COLOR,\n};\n\nconst titleStyle: React.CSSProperties = {\n fontWeight: 600,\n};\n\nconst metaStyle: React.CSSProperties = {\n marginLeft: \"auto\",\n color: FLOATING_PANEL_MUTED_FG_COLOR,\n fontSize: FLOATING_PANEL_META_FONT_SIZE,\n};\n\nconst controlsStyle: React.CSSProperties = {\n display: \"flex\",\n alignItems: \"center\",\n gap: FLOATING_PANEL_CONTROLS_GAP,\n};\n\nconst contentStyle: React.CSSProperties = {\n padding: FLOATING_PANEL_CONTENT_PADDING,\n overflow: \"auto\",\n};\n\nexport type FloatingPanelFrameProps = Omit<React.HTMLAttributes<HTMLDivElement>, \"className\" | \"style\"> & {\n style?: React.CSSProperties;\n};\n\nexport const FloatingPanelFrame = React.forwardRef<HTMLDivElement, FloatingPanelFrameProps>(function FloatingPanelFrame(\n { style: propStyle, ...props },\n ref,\n) {\n const combinedStyle = React.useMemo(() => ({ ...frameStyle, ...propStyle }), [propStyle]);\n return <div ref={ref} style={combinedStyle} {...props} />;\n});\n\nexport type FloatingPanelHeaderProps = Omit<React.HTMLAttributes<HTMLDivElement>, \"className\" | \"style\"> & {\n style?: React.CSSProperties;\n};\n\nexport const FloatingPanelHeader: React.FC<FloatingPanelHeaderProps> = ({ style: propStyle, ...props }) => {\n const combinedStyle = React.useMemo(() => ({ ...headerStyle, ...propStyle }), [propStyle]);\n return <div style={combinedStyle} {...props} />;\n};\n\nexport type FloatingPanelTitleProps = Omit<React.HTMLAttributes<HTMLSpanElement>, \"className\" | \"style\"> & {\n style?: React.CSSProperties;\n};\n\nexport const FloatingPanelTitle: React.FC<FloatingPanelTitleProps> = ({ style: propStyle, ...props }) => {\n const combinedStyle = React.useMemo(() => ({ ...titleStyle, ...propStyle }), [propStyle]);\n return <span style={combinedStyle} {...props} />;\n};\n\nexport type FloatingPanelMetaProps = Omit<React.HTMLAttributes<HTMLSpanElement>, \"className\" | \"style\"> & {\n style?: React.CSSProperties;\n};\n\nexport const FloatingPanelMeta: React.FC<FloatingPanelMetaProps> = ({ style: propStyle, ...props }) => {\n const combinedStyle = React.useMemo(() => ({ ...metaStyle, ...propStyle }), [propStyle]);\n return <span style={combinedStyle} {...props} />;\n};\n\nexport type FloatingPanelControlsProps = Omit<React.HTMLAttributes<HTMLDivElement>, \"className\" | \"style\"> & {\n style?: React.CSSProperties;\n};\n\nexport const FloatingPanelControls: React.FC<FloatingPanelControlsProps> = ({ style: propStyle, ...props }) => {\n const combinedStyle = React.useMemo(() => ({ ...controlsStyle, ...propStyle }), [propStyle]);\n return <div style={combinedStyle} {...props} />;\n};\n\nexport type FloatingPanelContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, \"className\" | \"style\"> & {\n style?: React.CSSProperties;\n};\n\nexport const FloatingPanelContent = React.forwardRef<HTMLDivElement, FloatingPanelContentProps>(\n function FloatingPanelContent({ style: propStyle, ...props }, ref) {\n const combinedStyle = React.useMemo(() => ({ ...contentStyle, ...propStyle }), [propStyle]);\n return <div ref={ref} style={combinedStyle} {...props} />;\n },\n);\n\nFloatingPanelFrame.displayName = \"FloatingPanelFrame\";\nFloatingPanelHeader.displayName = \"FloatingPanelHeader\";\nFloatingPanelTitle.displayName = \"FloatingPanelTitle\";\nFloatingPanelMeta.displayName = \"FloatingPanelMeta\";\nFloatingPanelControls.displayName = \"FloatingPanelControls\";\nFloatingPanelContent.displayName = \"FloatingPanelContent\";\n\n"],"names":["frameStyle","FLOATING_PANEL_BORDER_RADIUS","FLOATING_PANEL_BORDER_COLOR","FLOATING_PANEL_SURFACE_COLOR","FLOATING_PANEL_SHADOW","headerStyle","FLOATING_PANEL_GAP","FLOATING_PANEL_HEADER_PADDING_Y","FLOATING_PANEL_HEADER_PADDING_X","FLOATING_PANEL_SURFACE_2_COLOR","titleStyle","metaStyle","FLOATING_PANEL_MUTED_FG_COLOR","FLOATING_PANEL_META_FONT_SIZE","controlsStyle","FLOATING_PANEL_CONTROLS_GAP","contentStyle","FLOATING_PANEL_CONTENT_PADDING","FloatingPanelFrame","React","propStyle","props","ref","combinedStyle","FloatingPanelHeader","jsx","FloatingPanelTitle","FloatingPanelMeta","FloatingPanelControls","FloatingPanelContent"],"mappings":"qcAmBMA,EAAkC,CACtC,QAAS,OACT,cAAe,SACf,aAAcC,EAAAA,6BACd,OAAQ,aAAaC,EAAAA,2BAA2B,GAChD,WAAYC,EAAAA,6BACZ,SAAU,SACV,UAAWC,EAAAA,qBACb,EAEMC,EAAmC,CACvC,QAAS,OACT,WAAY,SACZ,IAAKC,EAAAA,mBACL,QAAS,GAAGC,EAAAA,+BAA+B,IAAIC,EAAAA,+BAA+B,GAC9E,aAAc,aAAaN,EAAAA,2BAA2B,GACtD,WAAYO,EAAAA,8BACd,EAEMC,EAAkC,CACtC,WAAY,GACd,EAEMC,EAAiC,CACrC,WAAY,OACZ,MAAOC,EAAAA,8BACP,SAAUC,EAAAA,6BACZ,EAEMC,EAAqC,CACzC,QAAS,OACT,WAAY,SACZ,IAAKC,EAAAA,2BACP,EAEMC,EAAoC,CACxC,QAASC,EAAAA,+BACT,SAAU,MACZ,EAMaC,EAAqBC,EAAM,WAAoD,SAC1F,CAAE,MAAOC,EAAW,GAAGC,CAAA,EACvBC,EACA,CACA,MAAMC,EAAgBJ,EAAM,QAAQ,KAAO,CAAE,GAAGnB,EAAY,GAAGoB,CAAA,GAAc,CAACA,CAAS,CAAC,EACxF,aAAQ,MAAA,CAAI,IAAAE,EAAU,MAAOC,EAAgB,GAAGF,EAAO,CACzD,CAAC,EAMYG,EAA0D,CAAC,CAAE,MAAOJ,EAAW,GAAGC,KAAY,CACzG,MAAME,EAAgBJ,EAAM,QAAQ,KAAO,CAAE,GAAGd,EAAa,GAAGe,CAAA,GAAc,CAACA,CAAS,CAAC,EACzF,OAAOK,EAAAA,IAAC,MAAA,CAAI,MAAOF,EAAgB,GAAGF,EAAO,CAC/C,EAMaK,EAAwD,CAAC,CAAE,MAAON,EAAW,GAAGC,KAAY,CACvG,MAAME,EAAgBJ,EAAM,QAAQ,KAAO,CAAE,GAAGT,EAAY,GAAGU,CAAA,GAAc,CAACA,CAAS,CAAC,EACxF,OAAOK,EAAAA,IAAC,OAAA,CAAK,MAAOF,EAAgB,GAAGF,EAAO,CAChD,EAMaM,EAAsD,CAAC,CAAE,MAAOP,EAAW,GAAGC,KAAY,CACrG,MAAME,EAAgBJ,EAAM,QAAQ,KAAO,CAAE,GAAGR,EAAW,GAAGS,CAAA,GAAc,CAACA,CAAS,CAAC,EACvF,OAAOK,EAAAA,IAAC,OAAA,CAAK,MAAOF,EAAgB,GAAGF,EAAO,CAChD,EAMaO,EAA8D,CAAC,CAAE,MAAOR,EAAW,GAAGC,KAAY,CAC7G,MAAME,EAAgBJ,EAAM,QAAQ,KAAO,CAAE,GAAGL,EAAe,GAAGM,CAAA,GAAc,CAACA,CAAS,CAAC,EAC3F,OAAOK,EAAAA,IAAC,MAAA,CAAI,MAAOF,EAAgB,GAAGF,EAAO,CAC/C,EAMaQ,EAAuBV,EAAM,WACxC,SAA8B,CAAE,MAAOC,EAAW,GAAGC,CAAA,EAASC,EAAK,CACjE,MAAMC,EAAgBJ,EAAM,QAAQ,KAAO,CAAE,GAAGH,EAAc,GAAGI,CAAA,GAAc,CAACA,CAAS,CAAC,EAC1F,aAAQ,MAAA,CAAI,IAAAE,EAAU,MAAOC,EAAgB,GAAGF,EAAO,CACzD,CACF,EAEAH,EAAmB,YAAc,qBACjCM,EAAoB,YAAc,sBAClCE,EAAmB,YAAc,qBACjCC,EAAkB,YAAc,oBAChCC,EAAsB,YAAc,wBACpCC,EAAqB,YAAc"}
1
+ {"version":3,"file":"floating.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
package/dist/floating.js CHANGED
@@ -1,67 +1,10 @@
1
- import { jsx as o } from "react/jsx-runtime";
2
- import * as a from "react";
3
- import { F as r, z as d, A as i, B as _, E as N, I as A, J as c, K as m, L as F, M as L, N as P, O } from "./styles-BnvLfp6e.js";
4
- const y = {
5
- display: "flex",
6
- flexDirection: "column",
7
- borderRadius: _,
8
- border: `1px solid ${i}`,
9
- background: d,
10
- overflow: "hidden",
11
- boxShadow: r
12
- }, E = {
13
- display: "flex",
14
- alignItems: "center",
15
- gap: m,
16
- padding: `${A} ${c}`,
17
- borderBottom: `1px solid ${i}`,
18
- background: N
19
- }, g = {
20
- fontWeight: 600
21
- }, u = {
22
- marginLeft: "auto",
23
- color: L,
24
- fontSize: F
25
- }, I = {
26
- display: "flex",
27
- alignItems: "center",
28
- gap: P
29
- }, T = {
30
- padding: O,
31
- overflow: "auto"
32
- }, f = a.forwardRef(function({ style: t, ...n }, l) {
33
- const s = a.useMemo(() => ({ ...y, ...t }), [t]);
34
- return /* @__PURE__ */ o("div", { ref: l, style: s, ...n });
35
- }), G = ({ style: e, ...t }) => {
36
- const n = a.useMemo(() => ({ ...E, ...e }), [e]);
37
- return /* @__PURE__ */ o("div", { style: n, ...t });
38
- }, R = ({ style: e, ...t }) => {
39
- const n = a.useMemo(() => ({ ...g, ...e }), [e]);
40
- return /* @__PURE__ */ o("span", { style: n, ...t });
41
- }, D = ({ style: e, ...t }) => {
42
- const n = a.useMemo(() => ({ ...u, ...e }), [e]);
43
- return /* @__PURE__ */ o("span", { style: n, ...t });
44
- }, S = ({ style: e, ...t }) => {
45
- const n = a.useMemo(() => ({ ...I, ...e }), [e]);
46
- return /* @__PURE__ */ o("div", { style: n, ...t });
47
- }, C = a.forwardRef(
48
- function({ style: t, ...n }, l) {
49
- const s = a.useMemo(() => ({ ...T, ...t }), [t]);
50
- return /* @__PURE__ */ o("div", { ref: l, style: s, ...n });
51
- }
52
- );
53
- f.displayName = "FloatingPanelFrame";
54
- G.displayName = "FloatingPanelHeader";
55
- R.displayName = "FloatingPanelTitle";
56
- D.displayName = "FloatingPanelMeta";
57
- S.displayName = "FloatingPanelControls";
58
- C.displayName = "FloatingPanelContent";
1
+ import { e, d as l, F as t, a as o, c as F, b as i } from "./FloatingPanelFrame-BeP9z8EI.js";
59
2
  export {
60
- C as FloatingPanelContent,
61
- S as FloatingPanelControls,
62
- f as FloatingPanelFrame,
63
- G as FloatingPanelHeader,
64
- D as FloatingPanelMeta,
65
- R as FloatingPanelTitle
3
+ e as FloatingPanelContent,
4
+ l as FloatingPanelControls,
5
+ t as FloatingPanelFrame,
6
+ o as FloatingPanelHeader,
7
+ F as FloatingPanelMeta,
8
+ i as FloatingPanelTitle
66
9
  };
67
10
  //# sourceMappingURL=floating.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"floating.js","sources":["../src/components/paneling/FloatingPanelFrame.tsx"],"sourcesContent":["/**\n * @file Shared floating panel frame components for reusable overlay styling\n */\nimport * as React from \"react\";\nimport {\n FLOATING_PANEL_BORDER_RADIUS,\n FLOATING_PANEL_GAP,\n FLOATING_PANEL_HEADER_PADDING_Y,\n FLOATING_PANEL_HEADER_PADDING_X,\n FLOATING_PANEL_CONTENT_PADDING,\n FLOATING_PANEL_META_FONT_SIZE,\n FLOATING_PANEL_CONTROLS_GAP,\n FLOATING_PANEL_SURFACE_COLOR,\n FLOATING_PANEL_SURFACE_2_COLOR,\n FLOATING_PANEL_BORDER_COLOR,\n FLOATING_PANEL_MUTED_FG_COLOR,\n FLOATING_PANEL_SHADOW,\n} from \"../../constants/styles\";\n\nconst frameStyle: React.CSSProperties = {\n display: \"flex\",\n flexDirection: \"column\",\n borderRadius: FLOATING_PANEL_BORDER_RADIUS,\n border: `1px solid ${FLOATING_PANEL_BORDER_COLOR}`,\n background: FLOATING_PANEL_SURFACE_COLOR,\n overflow: \"hidden\",\n boxShadow: FLOATING_PANEL_SHADOW,\n};\n\nconst headerStyle: React.CSSProperties = {\n display: \"flex\",\n alignItems: \"center\",\n gap: FLOATING_PANEL_GAP,\n padding: `${FLOATING_PANEL_HEADER_PADDING_Y} ${FLOATING_PANEL_HEADER_PADDING_X}`,\n borderBottom: `1px solid ${FLOATING_PANEL_BORDER_COLOR}`,\n background: FLOATING_PANEL_SURFACE_2_COLOR,\n};\n\nconst titleStyle: React.CSSProperties = {\n fontWeight: 600,\n};\n\nconst metaStyle: React.CSSProperties = {\n marginLeft: \"auto\",\n color: FLOATING_PANEL_MUTED_FG_COLOR,\n fontSize: FLOATING_PANEL_META_FONT_SIZE,\n};\n\nconst controlsStyle: React.CSSProperties = {\n display: \"flex\",\n alignItems: \"center\",\n gap: FLOATING_PANEL_CONTROLS_GAP,\n};\n\nconst contentStyle: React.CSSProperties = {\n padding: FLOATING_PANEL_CONTENT_PADDING,\n overflow: \"auto\",\n};\n\nexport type FloatingPanelFrameProps = Omit<React.HTMLAttributes<HTMLDivElement>, \"className\" | \"style\"> & {\n style?: React.CSSProperties;\n};\n\nexport const FloatingPanelFrame = React.forwardRef<HTMLDivElement, FloatingPanelFrameProps>(function FloatingPanelFrame(\n { style: propStyle, ...props },\n ref,\n) {\n const combinedStyle = React.useMemo(() => ({ ...frameStyle, ...propStyle }), [propStyle]);\n return <div ref={ref} style={combinedStyle} {...props} />;\n});\n\nexport type FloatingPanelHeaderProps = Omit<React.HTMLAttributes<HTMLDivElement>, \"className\" | \"style\"> & {\n style?: React.CSSProperties;\n};\n\nexport const FloatingPanelHeader: React.FC<FloatingPanelHeaderProps> = ({ style: propStyle, ...props }) => {\n const combinedStyle = React.useMemo(() => ({ ...headerStyle, ...propStyle }), [propStyle]);\n return <div style={combinedStyle} {...props} />;\n};\n\nexport type FloatingPanelTitleProps = Omit<React.HTMLAttributes<HTMLSpanElement>, \"className\" | \"style\"> & {\n style?: React.CSSProperties;\n};\n\nexport const FloatingPanelTitle: React.FC<FloatingPanelTitleProps> = ({ style: propStyle, ...props }) => {\n const combinedStyle = React.useMemo(() => ({ ...titleStyle, ...propStyle }), [propStyle]);\n return <span style={combinedStyle} {...props} />;\n};\n\nexport type FloatingPanelMetaProps = Omit<React.HTMLAttributes<HTMLSpanElement>, \"className\" | \"style\"> & {\n style?: React.CSSProperties;\n};\n\nexport const FloatingPanelMeta: React.FC<FloatingPanelMetaProps> = ({ style: propStyle, ...props }) => {\n const combinedStyle = React.useMemo(() => ({ ...metaStyle, ...propStyle }), [propStyle]);\n return <span style={combinedStyle} {...props} />;\n};\n\nexport type FloatingPanelControlsProps = Omit<React.HTMLAttributes<HTMLDivElement>, \"className\" | \"style\"> & {\n style?: React.CSSProperties;\n};\n\nexport const FloatingPanelControls: React.FC<FloatingPanelControlsProps> = ({ style: propStyle, ...props }) => {\n const combinedStyle = React.useMemo(() => ({ ...controlsStyle, ...propStyle }), [propStyle]);\n return <div style={combinedStyle} {...props} />;\n};\n\nexport type FloatingPanelContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, \"className\" | \"style\"> & {\n style?: React.CSSProperties;\n};\n\nexport const FloatingPanelContent = React.forwardRef<HTMLDivElement, FloatingPanelContentProps>(\n function FloatingPanelContent({ style: propStyle, ...props }, ref) {\n const combinedStyle = React.useMemo(() => ({ ...contentStyle, ...propStyle }), [propStyle]);\n return <div ref={ref} style={combinedStyle} {...props} />;\n },\n);\n\nFloatingPanelFrame.displayName = \"FloatingPanelFrame\";\nFloatingPanelHeader.displayName = \"FloatingPanelHeader\";\nFloatingPanelTitle.displayName = \"FloatingPanelTitle\";\nFloatingPanelMeta.displayName = \"FloatingPanelMeta\";\nFloatingPanelControls.displayName = \"FloatingPanelControls\";\nFloatingPanelContent.displayName = \"FloatingPanelContent\";\n\n"],"names":["frameStyle","FLOATING_PANEL_BORDER_RADIUS","FLOATING_PANEL_BORDER_COLOR","FLOATING_PANEL_SURFACE_COLOR","FLOATING_PANEL_SHADOW","headerStyle","FLOATING_PANEL_GAP","FLOATING_PANEL_HEADER_PADDING_Y","FLOATING_PANEL_HEADER_PADDING_X","FLOATING_PANEL_SURFACE_2_COLOR","titleStyle","metaStyle","FLOATING_PANEL_MUTED_FG_COLOR","FLOATING_PANEL_META_FONT_SIZE","controlsStyle","FLOATING_PANEL_CONTROLS_GAP","contentStyle","FLOATING_PANEL_CONTENT_PADDING","FloatingPanelFrame","React","propStyle","props","ref","combinedStyle","FloatingPanelHeader","jsx","FloatingPanelTitle","FloatingPanelMeta","FloatingPanelControls","FloatingPanelContent"],"mappings":";;;AAmBA,MAAMA,IAAkC;AAAA,EACtC,SAAS;AAAA,EACT,eAAe;AAAA,EACf,cAAcC;AAAA,EACd,QAAQ,aAAaC,CAA2B;AAAA,EAChD,YAAYC;AAAA,EACZ,UAAU;AAAA,EACV,WAAWC;AACb,GAEMC,IAAmC;AAAA,EACvC,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,KAAKC;AAAA,EACL,SAAS,GAAGC,CAA+B,IAAIC,CAA+B;AAAA,EAC9E,cAAc,aAAaN,CAA2B;AAAA,EACtD,YAAYO;AACd,GAEMC,IAAkC;AAAA,EACtC,YAAY;AACd,GAEMC,IAAiC;AAAA,EACrC,YAAY;AAAA,EACZ,OAAOC;AAAA,EACP,UAAUC;AACZ,GAEMC,IAAqC;AAAA,EACzC,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,KAAKC;AACP,GAEMC,IAAoC;AAAA,EACxC,SAASC;AAAA,EACT,UAAU;AACZ,GAMaC,IAAqBC,EAAM,WAAoD,SAC1F,EAAE,OAAOC,GAAW,GAAGC,EAAA,GACvBC,GACA;AACA,QAAMC,IAAgBJ,EAAM,QAAQ,OAAO,EAAE,GAAGnB,GAAY,GAAGoB,EAAA,IAAc,CAACA,CAAS,CAAC;AACxF,2BAAQ,OAAA,EAAI,KAAAE,GAAU,OAAOC,GAAgB,GAAGF,GAAO;AACzD,CAAC,GAMYG,IAA0D,CAAC,EAAE,OAAOJ,GAAW,GAAGC,QAAY;AACzG,QAAME,IAAgBJ,EAAM,QAAQ,OAAO,EAAE,GAAGd,GAAa,GAAGe,EAAA,IAAc,CAACA,CAAS,CAAC;AACzF,SAAO,gBAAAK,EAAC,OAAA,EAAI,OAAOF,GAAgB,GAAGF,GAAO;AAC/C,GAMaK,IAAwD,CAAC,EAAE,OAAON,GAAW,GAAGC,QAAY;AACvG,QAAME,IAAgBJ,EAAM,QAAQ,OAAO,EAAE,GAAGT,GAAY,GAAGU,EAAA,IAAc,CAACA,CAAS,CAAC;AACxF,SAAO,gBAAAK,EAAC,QAAA,EAAK,OAAOF,GAAgB,GAAGF,GAAO;AAChD,GAMaM,IAAsD,CAAC,EAAE,OAAOP,GAAW,GAAGC,QAAY;AACrG,QAAME,IAAgBJ,EAAM,QAAQ,OAAO,EAAE,GAAGR,GAAW,GAAGS,EAAA,IAAc,CAACA,CAAS,CAAC;AACvF,SAAO,gBAAAK,EAAC,QAAA,EAAK,OAAOF,GAAgB,GAAGF,GAAO;AAChD,GAMaO,IAA8D,CAAC,EAAE,OAAOR,GAAW,GAAGC,QAAY;AAC7G,QAAME,IAAgBJ,EAAM,QAAQ,OAAO,EAAE,GAAGL,GAAe,GAAGM,EAAA,IAAc,CAACA,CAAS,CAAC;AAC3F,SAAO,gBAAAK,EAAC,OAAA,EAAI,OAAOF,GAAgB,GAAGF,GAAO;AAC/C,GAMaQ,IAAuBV,EAAM;AAAA,EACxC,SAA8B,EAAE,OAAOC,GAAW,GAAGC,EAAA,GAASC,GAAK;AACjE,UAAMC,IAAgBJ,EAAM,QAAQ,OAAO,EAAE,GAAGH,GAAc,GAAGI,EAAA,IAAc,CAACA,CAAS,CAAC;AAC1F,6BAAQ,OAAA,EAAI,KAAAE,GAAU,OAAOC,GAAgB,GAAGF,GAAO;AAAA,EACzD;AACF;AAEAH,EAAmB,cAAc;AACjCM,EAAoB,cAAc;AAClCE,EAAmB,cAAc;AACjCC,EAAkB,cAAc;AAChCC,EAAsB,cAAc;AACpCC,EAAqB,cAAc;"}
1
+ {"version":3,"file":"floating.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -0,0 +1,21 @@
1
+ /**
2
+ * @file Generic transition state management with animation support.
3
+ */
4
+ import * as React from "react";
5
+ export type TransitionMode = "none" | "css";
6
+ export type TransitionOptions = {
7
+ mode?: TransitionMode;
8
+ element?: React.RefObject<HTMLElement>;
9
+ duration?: number;
10
+ };
11
+ export type UseTransitionStateOptions = {
12
+ onOpen?: (id: string) => void;
13
+ onClose?: (id: string) => void;
14
+ onTransitionEnd?: (id: string, isOpen: boolean) => void;
15
+ };
16
+ export declare const runTransition: (update: () => void, mode: TransitionMode, el: HTMLElement | null | undefined, duration: number) => Promise<void>;
17
+ export declare const useTransitionState: (options?: UseTransitionStateOptions) => {
18
+ state: (id: string) => boolean;
19
+ open: (id: string, opts?: TransitionOptions) => Promise<void>;
20
+ close: (id: string, opts?: TransitionOptions) => Promise<void>;
21
+ };
package/dist/index.cjs CHANGED
@@ -1,3 +1,3 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S=require("./GridLayout-Dx3Qofl0.cjs"),f=require("react/jsx-runtime"),Tt=require("react"),C=require("./styles-BMEhL6I0.cjs");function Gt(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const r in t)if(r!=="default"){const n=Object.getOwnPropertyDescriptor(t,r);Object.defineProperty(e,r,n.get?n:{enumerable:!0,get:()=>t[r]})}}return e.default=t,Object.freeze(e)}const l=Gt(Tt),St=t=>{const e=t==="drag"?C.COLOR_RESIZE_HANDLE_ACTIVE:t==="hover"?C.COLOR_RESIZE_HANDLE_HOVER:C.COLOR_RESIZE_HANDLE_IDLE;return{width:C.HORIZONTAL_DIVIDER_WIDTH,cursor:"col-resize",position:"relative",userSelect:"none",backgroundColor:e}},Et=({onResize:t,component:e,element:r})=>{const{ref:n,isDragging:o,onPointerDown:s}=S.useResizeDrag({axis:"x",onResize:t}),[a,i]=l.useState(!1),c={ref:n,style:St(o?"drag":a?"hover":"idle"),role:"separator","aria-orientation":"vertical","data-dragging":o?"true":void 0,onPointerDown:s,onPointerEnter:()=>i(!0),onPointerLeave:()=>i(!1)};return r?l.cloneElement(r,c):e?f.jsx(e,{...c}):f.jsx("div",{...c})},Rt=()=>{const{layerId:t}=S.useLayerInstance(),{getLayerHandleProps:e}=S.useGridLayoutContext();return l.useMemo(()=>e(t),[e,t])},it=l.createContext(null),Pt=()=>{const t=l.useContext(it);if(!t)throw new Error("useKeybindings must be used within KeybindingsProvider");return t},Ct=t=>{const e=[];t.metaKey&&e.push("Mod"),t.ctrlKey&&e.push("Ctrl"),t.altKey&&e.push("Alt"),t.shiftKey&&e.push("Shift");const r=t.key.length===1?t.key.toUpperCase():t.key;return e.push(r),e.join("-")},Dt=({children:t,configure:e})=>{const r=l.useRef({}),n=l.useCallback((a,i)=>{r.current={...r.current,[a]:i}},[]),o=l.useCallback(a=>{const i={...r.current};delete i[a],r.current=i},[]);l.useEffect(()=>{const a=i=>{const c=Ct(i),u=r.current[c];u&&u(i)};return window.addEventListener("keydown",a),()=>{window.removeEventListener("keydown",a)}},[]);const s=l.useMemo(()=>({register:n,unregister:o}),[n,o]);return l.useEffect(()=>{e&&e(s)},[s,e]),f.jsx(it.Provider,{value:s,children:t})},jt=(t,e)=>{t.register("Mod-\\",r=>{r.preventDefault(),e.splitFocused("vertical")}),t.register("Mod-Shift-\\",r=>{r.preventDefault(),e.splitFocused("horizontal")});for(const r of[1,2,3,4,5,6,7,8,9])t.register(`Mod-${String(r)}`,n=>{n.preventDefault(),e.focusGroupIndex(r)});t.register("Alt-ArrowRight",r=>{r.preventDefault(),e.focusNextGroup()}),t.register("Alt-ArrowLeft",r=>{r.preventDefault(),e.focusPrevGroup()})},At=t=>t.type==="group",at=(t,e={x:0,y:0,w:100,h:100})=>{const r=new Map,n=(o,s)=>{if(At(o)){r.set(o.groupId,s);return}if(o.direction==="vertical"){const c=s.w*o.ratio,u=s.w-c;n(o.a,{x:s.x,y:s.y,w:c,h:s.h}),n(o.b,{x:s.x+c,y:s.y,w:u,h:s.h});return}const a=s.h*o.ratio,i=s.h-a;n(o.a,{x:s.x,y:s.y,w:s.w,h:a}),n(o.b,{x:s.x,y:s.y+a,w:s.w,h:i})};return n(t,e),r},_t=(t,e)=>{const r=at(t.tree),n={areas:[["root"]],rows:[{size:"1fr"}],columns:[{size:"1fr"}],gap:"0px",style:{position:"relative"}},o=Array.from(r.entries()).map(([s,a])=>{const i={position:"absolute",left:`${a.x}%`,top:`${a.y}%`,width:`${a.w}%`,height:`${a.h}%`,overflow:"hidden",display:"flex",flexDirection:"column"};return{id:s,positionMode:"absolute",style:i,component:e(s)}});return{config:n,layers:o}},kt=(t,e,r)=>{const n=at(t.tree),o=Array.from(new Set(Array.from(n.values()).flatMap(m=>[m.x,m.x+m.w]))).sort((m,x)=>m-x),s=Array.from(new Set(Array.from(n.values()).flatMap(m=>[m.y,m.y+m.h]))).sort((m,x)=>m-x),a=o.slice(1).map((m,x)=>`${m-o[x]}fr`),i=s.slice(1).map((m,x)=>`${m-s[x]}fr`),c=a.map(m=>({size:m,resizable:r})),u=i.map(m=>({size:m,resizable:r})),d=(m,x,b,w)=>{for(const[g,I]of n.entries())if(m>=I.x&&x<=I.x+I.w&&b>=I.y&&w<=I.y+I.h)return g;return"."},h=[];for(let m=0;m<s.length-1;m+=1){const x=[];for(let b=0;b<o.length-1;b+=1)x.push(d(o[b],o[b+1],s[m],s[m+1]));h.push(x)}const v={areas:h,rows:u,columns:c,gap:"0px"},y=Array.from(n.keys()).map(m=>({id:m,gridArea:m,component:e(m)}));return{config:v,layers:y}},ct=l.createContext(null),Ot=()=>{const t=l.useContext(ct);if(!t)throw new Error("usePanelRenderContext must be used within PanelRenderProvider");return t},Mt=({value:t,children:e})=>f.jsx(ct.Provider,{value:t,children:e}),ut=l.createContext(null),lt=()=>{const t=l.useContext(ut);if(!t)throw new Error("useDomRegistry must be used within DomRegistryProvider");return t},Nt=({children:t})=>{const e=l.useRef(new Map),r=l.useCallback(c=>{const u=e.current.get(c);if(u)return u;const d={group:null,tabbar:null,content:null};return e.current.set(c,d),d},[]),n=l.useCallback((c,u)=>{const d=r(c);if(d.group=u,u===null){const h=e.current.get(c);(h?h.tabbar===null&&h.content===null:!1)&&e.current.delete(c)}},[r]),o=l.useCallback((c,u)=>{const d=r(c);if(d.tabbar=u,u===null){const h=e.current.get(c);(h?h.group===null&&h.content===null:!1)&&e.current.delete(c)}},[r]),s=l.useCallback((c,u)=>{const d=r(c);if(d.content=u,u===null){const h=e.current.get(c);(h?h.group===null&&h.tabbar===null:!1)&&e.current.delete(c)}},[r]),a=l.useCallback(()=>e.current,[]),i=l.useMemo(()=>({setGroupEl:n,setTabbarEl:o,setContentEl:s,getAll:a}),[n,o,s,a]);return f.jsx(ut.Provider,{value:i,children:t})},Lt={display:"flex",flexDirection:"column",width:"100%",height:"100%"},Bt={flex:"1 1 auto",minWidth:0,minHeight:0,position:"relative",overflow:"hidden"};function Ht(t,e,r,n){return t?l.cloneElement(t,r,n):e?f.jsx(e,{...r,children:n}):f.jsx("div",{...r,children:n})}function $t(t,e,r,n){return t?l.cloneElement(t,r,n):e?f.jsx(e,{...r,children:n}):f.jsx("div",{...r,children:n})}const zt=({group:t,tabbar:e,content:r,onContentPointerDown:n,groupRef:o,contentRef:s,component:a,element:i,contentComponent:c,contentElement:u})=>{const d={ref:o,style:Lt,"data-group-id":t.id},v=Ht(u,c,{ref:s,style:Bt,"data-dnd-zone":"content",onPointerDown:n},r),y=f.jsxs(f.Fragment,{children:[e,v]});return $t(i,a,d,y)},dt=l.memo(zt,(t,e)=>t.group.id!==e.group.id||t.group.activeTabId!==e.group.activeTabId||t.group.tabs.length!==e.group.tabs.length?!1:t.group.tabs===e.group.tabs);dt.displayName="PanelGroupView";const V=(t,e,r)=>{const n=t.left,o=t.top,s=t.width,a=t.height,i=e-n,c=r-o,u=s/3,d=a/3;return i>u&&i<s-u&&c>d&&c<a-d?"center":i<c&&i<s-i&&c<a-c?"left":s-i<c&&s-i<i&&c<a-c?"right":c<i&&c<a-c&&i<s-i?"top":"bottom"};function _(t,e){if(!e){const n=(()=>({type:t}));return Object.defineProperty(n,"type",{value:t,writable:!1,enumerable:!0}),n}const r=((...n)=>{const o=e(...n);return typeof o>"u"?{type:t}:{type:t,payload:o}});return Object.defineProperty(r,"type",{value:t,writable:!1,enumerable:!0}),r}const Xt=(t,e)=>{const r={};return Object.keys(t).forEach(n=>{const o=t[n];r[n]=((...s)=>{const a=o(...s);return e(a),a})}),r},pt=(t,e)=>{const r={};return Object.keys(e).forEach(n=>{const o=e[n];if(!o)return;const s=t[n];if(!s)throw new Error(`Missing action creator for key "${String(n)}"`);r[s.type]=o}),r},ft={phase:{kind:"idle"},suggest:null,pointer:null,tabbarHover:null,draggingTabElement:null},A={startContent:_("START_CONTENT",t=>t),startTab:_("START_TAB",t=>t),setSuggest:_("SET_SUGGEST",t=>t),setPointer:_("SET_POINTER",t=>t),setTabbarHover:_("SET_TABBAR_HOVER",t=>t),reset:_("RESET")},Ft=pt(A,{startContent:(t,e)=>({phase:{kind:"content",startX:e.payload.x,startY:e.payload.y,fromGroupId:e.payload.groupId,tabId:e.payload.tabId,cache:e.payload.cache},suggest:null,pointer:null,tabbarHover:null,draggingTabElement:null}),startTab:(t,e)=>({phase:{kind:"tab",startX:e.payload.x,startY:e.payload.y,fromGroupId:e.payload.groupId,tabId:e.payload.tabId,cache:e.payload.cache},suggest:null,pointer:null,tabbarHover:null,draggingTabElement:e.payload.element}),setSuggest:(t,e)=>({...t,suggest:e.payload}),setPointer:(t,e)=>({...t,pointer:e.payload}),setTabbarHover:(t,e)=>({...t,tabbarHover:e.payload}),reset:()=>ft}),Yt=(t,e)=>{const r=Ft[e.type];return r?r(t,e,void 0):t},bt=l.createContext(null),U=()=>{const t=l.useContext(bt);if(!t)throw new Error("usePanelInteractions must be used within InteractionsProvider");return t},Vt=({containerRef:t,dragThresholdPx:e,onCommitContentDrop:r,onCommitTabDrop:n,isContentZoneAllowed:o,children:s})=>{const[a,i]=l.useReducer(Yt,ft),c=lt(),u=l.useCallback(()=>{const b=Array.from(c.getAll().entries()),w=b.map(([p,T])=>({gid:p,el:T.content??T.group})).filter(p=>!!p.el).map(p=>({...p,rect:p.el.getBoundingClientRect()})),g=b.map(([p,T])=>({gid:p,el:T.tabbar})).filter(p=>!!p.el).map(p=>({...p,rect:p.el.getBoundingClientRect()})),I=b.map(([p,T])=>({gid:p,el:T.content??T.group})).filter(p=>!!p.el).map(p=>({...p,rect:p.el.getBoundingClientRect()}));return{groups:w,tabbars:g,contents:I}},[c]),d=S.useEffectEvent(b=>{if(!t.current)return;const g=b.clientX,I=b.clientY,p=a.phase;if(p.kind==="idle")return;const T=Math.abs(g-p.startX),R=Math.abs(I-p.startY);if(T<e&&R<e){a.phase.kind==="content"&&i(A.setSuggest(null)),i(A.setPointer(null)),i(A.setTabbarHover(null));return}if(i(A.setPointer({x:g,y:I})),p.kind==="content"){const E=p.cache.groups.find(({rect:G})=>g>=G.left&&g<=G.right&&I>=G.top&&I<=G.bottom);if(!E){i(A.setSuggest(null));return}const D=V(E.rect,g,I);if(o&&!o({targetGroupId:E.gid,zone:D})){i(A.setSuggest(null));return}i(A.setSuggest({rect:E.rect,zone:D}));return}if(p.kind==="tab"){const E=p.cache.tabbars.find(({rect:P})=>g>=P.left&&g<=P.right&&I>=P.top&&I<=P.bottom);if(E){const k=Array.from(E.el.querySelectorAll("[role='tab']")).map(H=>H.getBoundingClientRect()),j=k.map(H=>H.left+H.width/2),M=j.findIndex(H=>g<H),N=M===-1?j.length:M,yt=k.length===0?E.rect.left+8:N===0?k[0].left:N===k.length?k[k.length-1].right:(k[N-1].right+k[N].left)/2;i(A.setTabbarHover({groupId:E.gid,index:N,rect:E.rect,insertX:yt}))}else i(A.setTabbarHover(null));const D=p.cache.contents.find(({rect:P})=>g>=P.left&&g<=P.right&&I>=P.top&&I<=P.bottom);if(!D){i(A.setSuggest(null));return}const G=V(D.rect,g,I);if(o&&!o({targetGroupId:D.gid,zone:G})){i(A.setSuggest(null));return}i(A.setSuggest({rect:D.rect,zone:G}))}}),h=S.useEffectEvent(b=>{const w=t.current,g=a;if(i(A.reset()),!w)return;const I=b.clientX,p=b.clientY;if(g.phase.kind==="idle")return;const T=Math.abs(I-g.phase.startX),R=Math.abs(p-g.phase.startY);if(!(T<e&&R<e)){if(g.phase.kind==="content"){const E=g.phase.cache.groups.find(({rect:P})=>I>=P.left&&I<=P.right&&p>=P.top&&p<=P.bottom);if(!E)return;const D=E.gid??null;if(!D)return;const G=V(E.rect,I,p);if(o&&!o({targetGroupId:D,zone:G}))return;r({fromGroupId:g.phase.fromGroupId,tabId:g.phase.tabId,targetGroupId:D,zone:G});return}if(g.phase.kind==="tab"){const E=g.phase.cache.tabbars.find(({rect:G})=>I>=G.left&&I<=G.right&&p>=G.top&&p<=G.bottom);if(E){const G=E.gid;if(!G)return;const k=Array.from(E.el.querySelectorAll("[role='tab']")).map(N=>{const Z=N.getBoundingClientRect();return Z.left+Z.width/2}),j=k.findIndex(N=>I<N),M=j===-1?k.length:j;n({fromGroupId:g.phase.fromGroupId,tabId:g.phase.tabId,targetGroupId:G,targetIndex:M});return}const D=g.phase.cache.contents.find(({rect:G})=>I>=G.left&&I<=G.right&&p>=G.top&&p<=G.bottom);if(D){const G=D.gid??null;if(!G)return;const P=V(D.rect,I,p);if(o&&!o({targetGroupId:G,zone:P}))return;r({fromGroupId:g.phase.fromGroupId,tabId:g.phase.tabId,targetGroupId:G,zone:P})}}}}),v=S.useEffectEvent(()=>{i(A.reset())});l.useEffect(()=>{if(a.phase.kind!=="idle")return window.addEventListener("pointermove",d),window.addEventListener("pointerup",h,{once:!0}),window.addEventListener("pointercancel",v,{once:!0}),()=>{window.removeEventListener("pointermove",d),window.removeEventListener("pointerup",h),window.removeEventListener("pointercancel",v)}},[a.phase.kind]);const y=l.useCallback((b,w,g)=>{if(g.button!==0)return;g.currentTarget.setPointerCapture(g.pointerId);const I=u();i(A.startContent({x:g.clientX,y:g.clientY,groupId:b,tabId:w,cache:I}))},[u]),m=l.useCallback((b,w,g)=>{if(g.button!==0)return;const I=g.currentTarget;I&&I.setPointerCapture(g.pointerId);const p=u();i(A.startTab({x:g.clientX,y:g.clientY,groupId:w,tabId:b,cache:p,element:I}))},[u]),x=l.useMemo(()=>({suggest:a.suggest,isTabDragging:a.phase.kind==="tab",draggingTabId:a.phase.kind==="tab"?a.phase.tabId:null,dragPointer:a.pointer,tabbarHover:a.tabbarHover,draggingTabElement:a.draggingTabElement,onStartContentDrag:y,onStartTabDrag:m}),[a.suggest,a.pointer,a.tabbarHover,a.phase,a.draggingTabElement,y,m]);return f.jsx(bt.Provider,{value:x,children:s})},et={display:"inline-flex",alignItems:"center",userSelect:"none"},qt=({groupId:t,tab:e,active:r,dragging:n,onClickTab:o,onStartDrag:s,onCloseTab:a,tabComponent:i,tabElement:c,onDoubleClick:u})=>{const d=l.useEffectEvent(()=>{o(e.id)}),h=l.useEffectEvent(x=>{s&&x.button===0&&s(e.id,t,x)}),v=()=>{const x=!!a;return f.jsx(l.Activity,{mode:x?"visible":"hidden",children:f.jsx("button",{type:"button","aria-label":`Close tab ${e.title}`,onClick:b=>{a&&(b.stopPropagation(),a(t,e.id))},style:{marginLeft:6},tabIndex:x?void 0:-1,disabled:!x,"aria-hidden":x?void 0:!0,children:"×"})})},y={role:"tab","aria-selected":r,tabIndex:r?0:-1,style:et,onClick:d,onPointerDown:h,onDoubleClick:u,"data-tab-id":e.id,"data-active":r?"true":"false","data-dragging":n?"true":"false",children:f.jsxs(f.Fragment,{children:[f.jsx("span",{children:e.title}),v()]})},m={type:"button",role:"tab","aria-selected":r,tabIndex:r?0:-1,style:et,onClick:()=>{o(e.id)},onPointerDown:x=>{s&&x.button===0&&s(e.id,t,x)},onDoubleClick:u,children:f.jsx("span",{children:e.title})};return c?c(m):i?f.jsx(i,{...m}):f.jsx("div",{...y})},Kt={display:"flex",alignItems:"center"},Ut={flex:"1 1 auto",alignSelf:"stretch"},Wt=({group:t,onClickTab:e,onStartDrag:r,rootRef:n,component:o,element:s,tabComponent:a,tabElement:i,onAddTab:c,onCloseTab:u,doubleClickToAdd:d})=>{const{isTabDragging:h,draggingTabId:v}=U(),y=l.useRef(null),m=l.useCallback(p=>{if(y.current=p,!!n){if(typeof n=="function"){n(p);return}try{n.current=p}catch{}}},[n]),x=l.useEffectEvent(p=>{const T=y.current??p.currentTarget;if(!T)return;const R=Array.from(T.querySelectorAll('[role="tab"]'));if(R.length===0)return;const E=j=>{const M=Math.max(0,Math.min(j,R.length-1)),N=R[M];N&&N.focus()},D=document.activeElement,G=D?R.indexOf(D):R.findIndex(j=>j.getAttribute("data-tab-id")===t.activeTabId);if(p.key==="ArrowRight"){p.preventDefault();const j=G>=0?G+1:0;E(j>=R.length?0:j);return}if(p.key==="ArrowLeft"){p.preventDefault();const j=G>=0?G-1:R.length-1;E(j<0?R.length-1:j);return}if(p.key==="Home"){p.preventDefault(),E(0);return}if(p.key==="End"){p.preventDefault(),E(R.length-1);return}if(p.key==="Enter"||p.key===" "){p.preventDefault();const M=(G>=0?R[G]:null)?.getAttribute("data-tab-id")??null;M&&e(M);return}if(p.key==="Delete"||p.key==="Backspace"){if(u){p.preventDefault();const M=(G>=0?R[G]:null)?.getAttribute("data-tab-id")??null;M&&u(t.id,M)}return}const P=(p.ctrlKey?1:0)+(p.metaKey?1:0)>0,k=typeof p.key=="string"?p.key.toLowerCase():"";if(P&&k==="t"){c&&(p.preventDefault(),c(t.id));return}});l.useEffect(()=>{const p=y.current;if(!p)return;const T=p.querySelector(`[role="tab"][data-tab-id="${t.activeTabId}"]`);if(T===document.activeElement)return;!p.contains(document.activeElement)&&T&&T.focus()},[t.activeTabId]);const b={style:Kt,role:"tablist","data-tabbar":"true","data-group-id":t.id,"data-dragging":h?"true":"false",onKeyDown:x},w=S.useElementComponentWrapper({element:s,component:o}),g=()=>c?f.jsx("button",{type:"button","aria-label":"Add tab",onClick:()=>{c(t.id)},children:"+"}):null,I=l.useCallback(()=>{d&&c&&c(t.id)},[d,c,t.id]);return f.jsxs(w,{...b,ref:m,onDoubleClick:I,children:[t.tabs.map((p,T)=>f.jsx(qt,{groupId:t.id,tab:p,active:t.activeTabId===p.id,dragging:v===p.id,onClickTab:e,onStartDrag:r,onCloseTab:u,tabComponent:a,tabElement:i,onDoubleClick:R=>R.stopPropagation()},`${t.id}:${p.id}:${T}`)),f.jsx("span",{style:Ut}),g()]})},Zt=({id:t,TabBarComponent:e,PanelGroupComponent:r})=>{const{getGroup:n,getGroupContent:o,onClickTab:s,onAddTab:a,onCloseTab:i,onStartContentDrag:c,onStartTabDrag:u,doubleClickToAdd:d}=Ot(),{setGroupEl:h,setTabbarEl:v,setContentEl:y}=lt(),m=l.useCallback(T=>{h(t,T)},[t,h]),x=l.useCallback(T=>{y(t,T)},[t,y]),b=l.useCallback(T=>{v(t,T)},[t,v]),w=n(t);if(!w)return null;const g=o(t),I=e??Wt,p=r??(T=>f.jsx(dt,{...T}));return f.jsx(p,{group:w,tabbar:f.jsx(I,{rootRef:b,group:w,onClickTab:T=>s(t,T),onAddTab:a,onCloseTab:i,onStartDrag:(T,R,E)=>u(T,R,E),doubleClickToAdd:d}),content:g,groupRef:m,contentRef:x,onContentPointerDown:T=>c(t,T)})},Jt=(t,e)=>{const r=new Array(16);for(let n=0;n<4;n++)for(let o=0;o<4;o++)r[n*4+o]=t[0+o]*e[n*4+0]+t[4+o]*e[n*4+1]+t[8+o]*e[n*4+2]+t[12+o]*e[n*4+3];return r},q=t=>{if(t.length!==16)throw new Error("Matrix must have exactly 16 values");const e=Object.freeze([...t]),r=n=>{const o=Jt(e,n);return q(o)};return Object.freeze({translate:(n=0,o=0,s=0)=>r([1,0,0,0,0,1,0,0,0,0,1,0,n,o,s,1]),translate3d:(n,o,s)=>r([1,0,0,0,0,1,0,0,0,0,1,0,n,o,s,1]),translateX:n=>r([1,0,0,0,0,1,0,0,0,0,1,0,n,0,0,1]),translateY:n=>r([1,0,0,0,0,1,0,0,0,0,1,0,0,n,0,1]),translateZ:n=>r([1,0,0,0,0,1,0,0,0,0,1,0,0,0,n,1]),scale:(n=1,o=1,s=1)=>r([n,0,0,0,0,o,0,0,0,0,s,0,0,0,0,1]),scale3d:(n,o,s)=>r([n,0,0,0,0,o,0,0,0,0,s,0,0,0,0,1]),scaleX:n=>r([n,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1]),scaleY:n=>r([1,0,0,0,0,n,0,0,0,0,1,0,0,0,0,1]),scaleZ:n=>r([1,0,0,0,0,1,0,0,0,0,n,0,0,0,0,1]),rotateX:n=>{const o=Math.cos(n),s=Math.sin(n);return r([1,0,0,0,0,o,s,0,0,-s,o,0,0,0,0,1])},rotateY:n=>{const o=Math.cos(n),s=Math.sin(n);return r([o,0,-s,0,0,1,0,0,s,0,o,0,0,0,0,1])},rotateZ:n=>{const o=Math.cos(n),s=Math.sin(n);return r([o,s,0,0,-s,o,0,0,0,0,1,0,0,0,0,1])},rotate:(n,o,s,a)=>{const i=Math.sqrt(o*o+s*s+a*a);if(i===0)return q(e);o/=i,s/=i,a/=i;const c=Math.cos(n),u=Math.sin(n),d=1-c;return r([d*o*o+c,d*o*s+u*a,d*o*a-u*s,0,d*o*s-u*a,d*s*s+c,d*s*a+u*o,0,d*o*a+u*s,d*s*a-u*o,d*a*a+c,0,0,0,0,1])},rotate3d:(n,o,s,a)=>{const i=Math.sqrt(n*n+o*o+s*s);if(i===0)return q(e);n/=i,o/=i,s/=i;const c=Math.cos(a),u=Math.sin(a),d=1-c;return r([d*n*n+c,d*n*o+u*s,d*n*s-u*o,0,d*n*o-u*s,d*o*o+c,d*o*s+u*n,0,d*n*s+u*o,d*o*s-u*n,d*s*s+c,0,0,0,0,1])},skew:(n=0,o=0)=>{const s=Math.tan(n),a=Math.tan(o);return r([1,a,0,0,s,1,0,0,0,0,1,0,0,0,0,1])},skewX:n=>{const o=Math.tan(n);return r([1,0,0,0,o,1,0,0,0,0,1,0,0,0,0,1])},skewY:n=>{const o=Math.tan(n);return r([1,o,0,0,0,1,0,0,0,0,1,0,0,0,0,1])},perspective:n=>{if(n===0)throw new Error("Perspective distance cannot be zero");return r([1,0,0,0,0,1,0,0,0,0,1,-1/n,0,0,0,1])},toCSS:()=>`matrix3d(${e.join(", ")})`,toArray:()=>e,toString:()=>[`[${e[0]}, ${e[4]}, ${e[8]}, ${e[12]}]`,`[${e[1]}, ${e[5]}, ${e[9]}, ${e[13]}]`,`[${e[2]}, ${e[6]}, ${e[10]}, ${e[14]}]`,`[${e[3]}, ${e[7]}, ${e[11]}, ${e[15]}]`].join(`
2
- `)})},Qt=()=>q([1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1]),te={position:"fixed",inset:0,pointerEvents:"none",zIndex:C.DROP_SUGGEST_Z_INDEX},ee={position:"absolute",border:`${C.DROP_SUGGEST_BORDER_WIDTH} dashed ${C.DROP_SUGGEST_BORDER_COLOR}`,background:C.DROP_SUGGEST_BG_COLOR,borderRadius:C.DROP_SUGGEST_BORDER_RADIUS,transformOrigin:"top left"},L=(t,e)=>e<=0?0:S.clampNumber(t/e,0),re=(t,e,r)=>{const{width:n,height:o}=t,s=r/2,a=n>0?n:1,i=o>0?o:1,c={translateX:r,translateY:r,scaleX:L(S.clampNumber(n-r*2,0),a),scaleY:L(S.clampNumber(o-r*2,0),i)},u={translateX:r,translateY:r,scaleX:L(S.clampNumber(n/2-r*1.5,0),a),scaleY:L(S.clampNumber(o-r*2,0),i)},d={translateX:n/2+s,translateY:r,scaleX:L(S.clampNumber(n/2-r*1.5,0),a),scaleY:L(S.clampNumber(o-r*2,0),i)},h={translateX:r,translateY:r,scaleX:L(S.clampNumber(n-r*2,0),a),scaleY:L(S.clampNumber(o/2-r*1.5,0),i)},v={translateX:r,translateY:o/2+s,scaleX:L(S.clampNumber(n-r*2,0),a),scaleY:L(S.clampNumber(o/2-r*1.5,0),i)},y={center:c,left:u,right:d,top:h,bottom:v},{translateX:m,translateY:x,scaleX:b,scaleY:w}=y[e];return Qt().translate(m,x,0).scale(b,w,1).toCSS()},ne=(t,e)=>{const r=C.DROP_SUGGEST_PADDING_PX;return{...ee,left:t.left,top:t.top,width:t.width,height:t.height,transform:re(t,e,r)}},oe=({suggest:t})=>{if(!t)return null;const{rect:e,zone:r}=t,n=ne(e,r);return f.jsx("div",{style:te,children:f.jsx("div",{style:n})})},se=typeof window<"u"&&typeof document<"u",ie=t=>{const[e,r]=l.useState(null),[n,o]=l.useState(null);return S.useIsomorphicLayoutEffect(()=>{if(!se||!t){r(null),o(null);return}const s=t.getBoundingClientRect();r({width:s.width,height:s.height}),o(t.outerHTML)},[t]),{html:n,size:e}},ae={position:"fixed",inset:0,pointerEvents:"none",zIndex:C.TAB_DRAG_OVERLAY_Z_INDEX},ce={position:"absolute",width:C.TAB_DRAG_INSERT_GUIDE_WIDTH,borderRadius:C.TAB_DRAG_INSERT_GUIDE_BORDER_RADIUS,background:C.TAB_DRAG_INSERT_GUIDE_COLOR,boxShadow:C.TAB_DRAG_INSERT_GUIDE_SHADOW},ue=()=>{const{isTabDragging:t,draggingTabId:e,dragPointer:r,tabbarHover:n,draggingTabElement:o}=U(),{html:s,size:a}=ie(o),i=r!==null&&e!==null,c=l.useMemo(()=>{if(!(!i||!r))return{position:"absolute",left:r.x,top:r.y,transform:`translate(${C.TAB_DRAG_PREVIEW_OFFSET_X}, ${C.TAB_DRAG_PREVIEW_OFFSET_Y})`,pointerEvents:"none"}},[i,r]),u=l.useMemo(()=>{if(!(!c||!o))return a?{...c,width:a.width,height:a.height}:c},[c,o,a]),d=l.useMemo(()=>{if(n)return{...ce,left:n.insertX,top:n.rect.top+4,height:Math.max(0,n.rect.height-8)}},[n]);return t?f.jsxs("div",{style:ae,children:[f.jsx(l.Activity,{mode:u?"visible":"hidden",children:f.jsx("div",{style:u,children:f.jsx("div",{style:{width:"100%",height:"100%",pointerEvents:"none"},dangerouslySetInnerHTML:{__html:s??""}})})}),f.jsx(l.Activity,{mode:d?"visible":"hidden",children:f.jsx("div",{style:d})})]}):null},O=t=>t.type==="group",X=(t,e=[])=>{if(O(t))return[...e,t.groupId];const r=X(t.a,e);return X(t.b,r)},W=(t,e)=>e.reduce((r,n)=>O(r)?r:r[n],t),F=(t,e,r)=>{if(e.length===0)return r;const[n,...o]=e;return O(t)?t:n==="a"?{...t,a:F(t.a,o,r)}:{...t,b:F(t.b,o,r)}},K=(t,e,r=[])=>{if(O(t))return t.groupId===e?{splitPath:null,side:null}:null;if(O(t.a)&&t.a.groupId===e)return{splitPath:r,side:"a"};if(O(t.b)&&t.b.groupId===e)return{splitPath:r,side:"b"};const n=K(t.a,e,[...r,"a"]);return n||K(t.b,e,[...r,"b"])},gt=(t,e,r,n)=>{const o=n(),s=K(t,e),a={type:"split",direction:r,ratio:.5,a:{type:"group",groupId:e},b:{type:"group",groupId:o}};if(!s||s.splitPath===null)return{tree:a,newGroupId:o};const i=s.splitPath,c=W(t,i);if(O(c))return{tree:a,newGroupId:o};const u=s.side==="a"?{...c,a}:{...c,b:a};return{tree:F(t,i,u),newGroupId:o}},le=(t,e)=>{const r=K(t,e);if(!r||r.splitPath===null)return{tree:t,survivorGroupId:e};const n=r.splitPath,o=W(t,n);if(O(o))return{tree:t,survivorGroupId:e};const s=r.side==="a"?o.b:o.a,a=F(t,n,s),i=O(s)?s.groupId:X(s)[0]??null;return{tree:a,survivorGroupId:i}},de=(t,e,r)=>{const n=W(t,e);if(O(n))return t;const o={...n,ratio:S.clampNumber(r,.05,.95)};return F(t,e,o)},J=t=>{if(Object.keys(t.groups).filter(o=>t.groups[o].tabIds.length===0).length===0)return t;const n=(o,s)=>{const a=o.groups[s];if(!a||a.tabs.length>0||Object.keys(o.groups).length<=1)return o;const{tree:c,survivorGroupId:u}=le(o.tree,s),{[s]:d,...h}=o.groups,v=X(c),y=o.focusedGroupId===s?u??v[0]??null:o.focusedGroupId;return{...o,tree:c,groups:h,groupOrder:v,focusedGroupId:y}};return t.groupOrder.reduce((o,s)=>n(o,s),t)},pe=t=>({id:t,tabIds:[],tabs:[],activeTabId:null}),rt=(t,e,r,n)=>{const o={...t.groups},s=o[e];if(!s)throw new Error(`Group ${e} does not exist.`);const a={...t.panels,[r.id]:r},i=[...s.tabIds,r.id],c=n?r.id:s.activeTabId??r.id,u=i.map(h=>a[h]),d={...s,tabIds:i,tabs:u,activeTabId:c};return o[e]=d,{...t,panels:a,groups:o}},fe=(t,e,r)=>{const n={...t.groups},o=n[e];if(!o)throw new Error(`Group ${e} does not exist.`);const s=o.tabIds.filter(c=>c!==r),a=s.map(c=>t.panels[c]),i=o.activeTabId===r?s[0]??null:o.activeTabId;return n[e]={...o,tabIds:s,tabs:a,activeTabId:i},{...t,groups:n}},nt=(t,e,r,n,o)=>{const s=t.groups[e],a=t.groups[r];if(!s||!a)throw new Error("moveTab: source or target group is missing.");const i={...t.groups},c=s.tabIds.filter(h=>h!==n),u=[...a.tabIds.filter(h=>h!==n),n],d=s.activeTabId===n?c[0]??null:s.activeTabId;return i[e]={...s,tabIds:c,tabs:c.map(h=>t.panels[h]),activeTabId:d},i[r]={...a,tabIds:u,tabs:u.map(h=>t.panels[h]),activeTabId:n},{...t,groups:i}},ht=(t,e,r)=>{const n=t.groups[e];if(!n)throw new Error(`setActiveTab: group ${e} not found.`);if(!n.tabIds.some(s=>s===r))throw new Error(`setActiveTab: tab ${r} not found in group ${e}.`);const o={...t.groups,[e]:{...n,activeTabId:r}};return{...t,groups:o,focusedGroupId:e}},ot=(t,e,r,n,o)=>{const s=t.groups[e];if(!s)throw new Error(`addTabToGroupAtIndex: group ${e} not found.`);const a={...t.panels,[r.id]:r},i=s.tabIds.slice(),c=Math.max(0,Math.min(n,i.length));i.splice(c,0,r.id);const u=i.map(v=>a[v]),d=o?r.id:s.activeTabId??r.id,h={...t.groups,[e]:{...s,tabIds:i,tabs:u,activeTabId:d}};return{...t,panels:a,groups:h}},B=(t,e)=>{if(!t.groups[e])throw new Error(`setFocusedGroup: group ${e} not found.`);return{...t,focusedGroupId:e}},be=(t,e)=>{const r=e-1,n=t.groupOrder[r];return n?B(t,n):t},ge=t=>{const e=t.groupOrder,r=t.focusedGroupId;if(!r){const s=e[0];return s?B(t,s):t}const n=e.indexOf(r),o=e[(n+1)%e.length];return B(t,o)},he=t=>{const e=t.groupOrder,r=t.focusedGroupId;if(!r){const s=e[e.length-1];return s?B(t,s):t}const n=e.indexOf(r),o=e[(n-1+e.length)%e.length];return B(t,o)},mt=(t,e,r,n)=>{const{tree:o,newGroupId:s}=gt(t.tree,e,r,n),a={...t.groups,[s]:pe(s)},i=X(o);return{...t,tree:o,groups:a,groupOrder:i,focusedGroupId:s}},me=t=>{const r={type:"group",groupId:"g_1"},n=Object.fromEntries(t.map(i=>[i.id,i])),s={g_1:{id:"g_1",tabIds:t.map(i=>i.id),tabs:t,activeTabId:t[0]?.id??null}};return{tree:r,panels:n,groups:s,groupOrder:["g_1"],focusedGroupId:"g_1"}},ve=l.createContext(null),Ie=({value:t,children:e})=>f.jsx(ve.Provider,{value:t,children:e}),vt=l.createContext(null),xe=()=>{const t=l.useContext(vt);if(!t)throw new Error("useTree must be used within TreeProvider");return t},we=({value:t,children:e})=>f.jsx(vt.Provider,{value:t,children:e}),ye=l.createContext(null),Te=({value:t,children:e})=>f.jsx(ye.Provider,{value:t,children:e}),$=t=>{const e=S.toFiniteNumberOr(t,Number.POSITIVE_INFINITY);return S.clampNumber(e,1)},Ge=t=>typeof t=="object"&&t!==null,Se=t=>Ge(t)?"rows"in t?!0:"cols"in t:!1,It=t=>{if(!t)return{rows:Number.POSITIVE_INFINITY,cols:Number.POSITIVE_INFINITY};if(typeof t=="number"){const r=$(t);return{rows:r,cols:r}}if(Se(t))return{rows:$(t.rows),cols:$(t.cols)};const e=t;return{rows:$(e.maxHorizontal),cols:$(e.maxVertical)}},Q=t=>{if(O(t))return{horizontal:1,vertical:1};const e=Q(t.a),r=Q(t.b);return t.direction==="horizontal"?{horizontal:e.horizontal+r.horizontal,vertical:Math.max(e.vertical,r.vertical)}:{horizontal:Math.max(e.horizontal,r.horizontal),vertical:e.vertical+r.vertical}},Ee=(t,e,r)=>{const{tree:n}=gt(t,e,r,()=>"__preview__");return n},tt=(t,e,r,n)=>{if(!Number.isFinite(n.rows)&&!Number.isFinite(n.cols))return!0;const o=Ee(t,e,r),s=Q(o);return!(s.horizontal>n.rows||s.vertical>n.cols)},xt={splitFocused:_("panelState/splitFocused",t=>({direction:t})),focusGroupIndex:_("panelState/focusGroupIndex",t=>({index1Based:t})),focusNextGroup:_("panelState/focusNextGroup"),focusPrevGroup:_("panelState/focusPrevGroup"),setActiveTab:_("panelState/setActiveTab",(t,e)=>({groupId:t,tabId:e})),addTab:_("panelState/addTab",t=>t),addNewTab:_("panelState/addNewTab",t=>t),removeTab:_("panelState/removeTab",(t,e)=>({groupId:t,tabId:e})),contentDrop:_("panelState/contentDrop",t=>t),tabDrop:_("panelState/tabDrop",t=>t),adjustSplitRatio:_("panelState/adjustSplitRatio",t=>t)},Re=(t,e,r)=>{const n=t.groups[e.fromGroupId],o=t.groups[e.targetGroupId];if(!n||!o||!n.tabs.find(h=>h.id===e.tabId))return t;if(e.zone==="center"&&e.fromGroupId===e.targetGroupId)return ht(t,e.fromGroupId,e.tabId);if(e.zone==="center"){const h=nt(t,e.fromGroupId,e.targetGroupId,e.tabId);return B(h,e.targetGroupId)}const a=e.zone==="left"||e.zone==="right"?"vertical":"horizontal";if(!tt(t.tree,e.targetGroupId,a,r.splitLimits))return t;const i=r.createGroupId(),c=mt(t,e.targetGroupId,a,()=>i),u=e.zone==="left"||e.zone==="top"?e.targetGroupId:i,d=nt(c,e.fromGroupId,u,e.tabId);return B(d,u)},Pe=(t,e)=>{const r=t.groups[e.fromGroupId],n=t.groups[e.targetGroupId];if(!r||!n||!t.panels[e.tabId])return t;if(e.fromGroupId===e.targetGroupId){const v=r.tabIds.filter(w=>w!==e.tabId),y=Math.max(0,Math.min(e.targetIndex,v.length)),m=v.slice(0,y).concat([e.tabId],v.slice(y)),x=m.map(w=>t.panels[w]).filter(Boolean),b={...t.groups,[e.fromGroupId]:{...r,tabIds:m,tabs:x}};return{...t,groups:b}}const s={...t.groups},a=r.tabIds.filter(v=>v!==e.tabId),i=a.map(v=>t.panels[v]);s[e.fromGroupId]={...r,tabIds:a,tabs:i,activeTabId:r.activeTabId===e.tabId?i[0]?.id??null:r.activeTabId};const c=n.tabIds.filter(v=>v!==e.tabId),u=Math.max(0,Math.min(e.targetIndex,c.length)),d=c.slice(0,u).concat([e.tabId],c.slice(u)),h=d.map(v=>t.panels[v]).filter(Boolean);return s[e.targetGroupId]={...n,tabIds:d,tabs:h,activeTabId:e.tabId},{...t,groups:s,focusedGroupId:e.targetGroupId}},Ce=pt(xt,{splitFocused:(t,e,r)=>{const n=t.focusedGroupId??t.groupOrder[0]??null;return!n||!tt(t.tree,n,e.payload.direction,r.splitLimits)?t:mt(t,n,e.payload.direction,r.createGroupId)},focusGroupIndex:(t,e)=>be(t,e.payload.index1Based),focusNextGroup:t=>ge(t),focusPrevGroup:t=>he(t),setActiveTab:(t,e)=>ht(t,e.payload.groupId,e.payload.tabId),addTab:(t,e)=>{const{groupId:r,tab:n,index:o,makeActive:s}=e.payload;return typeof o=="number"?ot(t,r,n,o,s??!0):rt(t,r,n,s??!0)},addNewTab:(t,e,r)=>{if(!r.createPanelId)throw new Error("addNewTab requires PanelSystemProvider.createPanelId");const o={id:r.createPanelId(),title:e.payload.title,render:()=>e.payload.title},{groupId:s,index:a,makeActive:i}=e.payload;return typeof a=="number"?ot(t,s,o,a,i??!0):rt(t,s,o,i??!0)},removeTab:(t,e)=>fe(t,e.payload.groupId,e.payload.tabId),contentDrop:(t,e,r)=>Re(t,e.payload,r),tabDrop:(t,e)=>Pe(t,e.payload),adjustSplitRatio:(t,e)=>{const r=W(t.tree,e.payload.path);if(O(r))return t;const n=de(t.tree,e.payload.path,r.ratio+e.payload.deltaRatio);return{...t,tree:n}}}),st=(t,e,r)=>{const n=Ce[e.type];if(!n)return t;const o=n(t,e,r);return J(o)},wt=l.createContext(null),Y=()=>{const t=l.useContext(wt);if(!t)throw new Error("usePanelSystem must be used within PanelSystemProvider");return t},De=({initialState:t,createGroupId:e,createPanelId:r,state:n,onStateChange:o,splitLimits:s,children:a})=>{const i=l.useMemo(()=>J(t),[t]),c=l.useMemo(()=>It(s),[s]),u=l.useRef({createGroupId:e,splitLimits:c,createPanelId:r});u.current.createGroupId=e,u.current.splitLimits=c,u.current.createPanelId=r;const[d,h]=l.useReducer((T,R)=>st(T,R,u.current),i),v=l.useMemo(()=>n?J(n):d,[n,d]),y=l.useRef(v);y.current=v;const m=n!==void 0,x=l.useCallback(T=>{if(m){const R=st(y.current,T,u.current);o?.(R);return}h(T)},[m,o,h]),b=l.useMemo(()=>Xt(xt,x),[x]),w=l.useMemo(()=>({setActiveTab:b.setActiveTab,tabDrop:b.tabDrop}),[b]),g=l.useMemo(()=>({adjustSplitRatio:b.adjustSplitRatio}),[b]),I=l.useMemo(()=>({focusGroupIndex:b.focusGroupIndex,focusNextGroup:b.focusNextGroup,focusPrevGroup:b.focusPrevGroup}),[b]),p=l.useMemo(()=>({state:v,dispatch:x,actions:b}),[v,x,b]);return f.jsx(wt.Provider,{value:p,children:f.jsx(Ie,{value:w,children:f.jsx(we,{value:g,children:f.jsx(Te,{value:I,children:a})})})})},je=()=>{const{actions:t}=Y();return l.useMemo(()=>({splitFocused:e=>{t.splitFocused(e)},focusGroupIndex:e=>{t.focusGroupIndex(e)},focusNextGroup:()=>{t.focusNextGroup()},focusPrevGroup:()=>{t.focusPrevGroup()},closeFocusedGroup:()=>{}}),[t])},Ae=()=>{const{actions:t}=Y(),e=l.useCallback(({fromGroupId:n,tabId:o,targetGroupId:s,zone:a})=>{t.contentDrop({fromGroupId:n,tabId:o,targetGroupId:s,zone:a})},[t]),r=l.useCallback(({fromGroupId:n,tabId:o,targetGroupId:s,targetIndex:a})=>{t.tabDrop({fromGroupId:n,tabId:o,targetGroupId:s,targetIndex:a})},[t]);return{onCommitContentDrop:e,onCommitTabDrop:r}},_e=()=>{const t=Pt(),e=je();return l.useEffect(()=>{jt(t,e)},[t,e]),null},ke=({children:t,emptyContentComponent:e,doubleClickToAdd:r})=>{const n=U(),{state:o,actions:s}=Y(),a=l.useCallback(()=>l.createElement("div",{style:{color:"#888",fontSize:12,padding:12}},"No tabs"),[]),i=e??a,c=l.useCallback(b=>{const w=o.groups[b];if(!w)return null;const g=w.tabIds.map(I=>o.panels[I]).filter(Boolean);return{...w,tabs:g}},[o.groups,o.panels]),u=l.useCallback(b=>{const w=o.groups[b];if(!w)return f.jsx(i,{});const g=w.activeTabId;if(!g)return f.jsx(i,{});const I=o.panels[g];return I?I.render():f.jsx(i,{})},[o.groups,o.panels,i]),d=l.useCallback((b,w)=>{s.setActiveTab(b,w)},[s]),h=l.useCallback(b=>{s.addNewTab({groupId:b,title:"New Tab",makeActive:!0})},[s]),v=l.useCallback((b,w)=>{s.removeTab(b,w)},[s]),y=l.useCallback((b,w,g)=>{s.setActiveTab(w,b),n.onStartTabDrag(b,w,g)},[s,n]),m=l.useCallback((b,w)=>{const g=o.groups[b];!g||!g.activeTabId||n.onStartContentDrag(b,g.activeTabId,w)},[o.groups,n]),x=l.useMemo(()=>({getGroup:c,getGroupContent:u,onClickTab:d,onAddTab:h,onCloseTab:v,onStartTabDrag:y,onStartContentDrag:m,doubleClickToAdd:r}),[c,u,d,h,v,y,m,r]);return f.jsx(Mt,{value:x,children:t})},z=(t,e,r,n)=>{if(O(t))return n;const o=t.direction,s=o==="vertical"?r.x+r.w*t.ratio:r.y+r.h*t.ratio;if(n.push({path:e,direction:o,parentRect:r,linePos:s}),o==="vertical"){const c=r.w*t.ratio,u=r.w-c;return z(t.a,[...e,"a"],{x:r.x,y:r.y,w:c,h:r.h},n),z(t.b,[...e,"b"],{x:r.x+c,y:r.y,w:u,h:r.h},n),n}const a=r.h*t.ratio,i=r.h-a;return z(t.a,[...e,"a"],{x:r.x,y:r.y,w:r.w,h:a},n),z(t.b,[...e,"b"],{x:r.x,y:r.y+a,w:r.w,h:i},n),n},Oe=({containerRef:t})=>{const{state:e}=Y(),{adjustSplitRatio:r}=xe(),n=l.useMemo(()=>z(e.tree,[],{x:0,y:0,w:100,h:100},[]),[e.tree]),[o,s]=l.useState(null);if(l.useLayoutEffect(()=>{const i=t.current;if(!i)return;const c=()=>{const y=i.getBoundingClientRect();s({left:y.left,top:y.top,width:y.width,height:y.height})};c();function u(){try{const y=window.ResizeObserver;return typeof y=="function"?y:null}catch{return null}}const d=u(),h=d?new d(()=>c()):null;h&&h.observe(i);const v=()=>c();return window.addEventListener("scroll",v,!0),()=>{window.removeEventListener("scroll",v,!0),h&&h.disconnect()}},[t,e.tree]),!o)return null;const a=(i,c)=>{const u={left:o.left+o.width*i.parentRect.x/100,top:o.top+o.height*i.parentRect.y/100,width:o.width*i.parentRect.w/100,height:o.height*i.parentRect.h/100},d=C.SPLIT_HANDLE_THICKNESS;if(i.direction==="vertical"){const m=u.left+u.width*(i.linePos-i.parentRect.x)/i.parentRect.w,x={position:"fixed",left:`calc(${Math.round(m)}px - ${d} / 2)`,top:Math.round(u.top),width:d,height:Math.round(u.height),cursor:"col-resize",pointerEvents:"auto"},b=w=>{const g=o.width*i.parentRect.w/100,I=g===0?0:w/g;r({path:i.path,deltaRatio:I})};return f.jsx("div",{style:x,children:f.jsx(S.ResizeHandle,{direction:"vertical",onResize:b})},`split-${c}`)}const h=u.top+u.height*(i.linePos-i.parentRect.y)/i.parentRect.h,v={position:"fixed",left:Math.round(u.left),top:`calc(${Math.round(h)}px - ${d} / 2)`,width:Math.round(u.width),height:d,cursor:"row-resize",pointerEvents:"auto"},y=m=>{const x=o.height*i.parentRect.h/100,b=x===0?0:m/x;r({path:i.path,deltaRatio:b})};return f.jsx("div",{style:v,children:f.jsx(S.ResizeHandle,{direction:"horizontal",onResize:y})},`split-${c}`)};return f.jsx("div",{style:{position:"fixed",inset:0,pointerEvents:"none"},children:n.map((i,c)=>a(i,c))})},Me={position:"relative",display:"flex",width:"100%",height:"100%"},Ne=({state:t,layoutMode:e,gridTracksInteractive:r,view:n,tabBarComponent:o,panelGroupComponent:s})=>{const a=c=>{if(n){const u=n;return f.jsx(u,{groupId:c})}return f.jsx(Zt,{id:c,TabBarComponent:o,PanelGroupComponent:s})};if(e==="grid"){const c=kt(t,a,!!r);return f.jsx(S.GridLayout,{config:c.config,layers:c.layers})}const i=_t(t,a);return f.jsx(S.GridLayout,{config:i.config,layers:i.layers})},Le=({containerRef:t,layoutMode:e,gridTracksInteractive:r,dragThresholdPx:n,view:o,style:s,className:a,tabBarComponent:i,panelGroupComponent:c,splitLimits:u,emptyContentComponent:d,doubleClickToAdd:h})=>{const{state:v}=Y(),{onCommitContentDrop:y,onCommitTabDrop:m}=Ae(),x=l.useMemo(()=>({...Me,...s}),[s]),b=l.useCallback(({targetGroupId:w,zone:g})=>{if(g==="center")return!0;const I=g==="left"||g==="right"?"vertical":"horizontal";return tt(v.tree,w,I,u)},[v.tree,u]);return f.jsx(Nt,{children:f.jsxs(Vt,{containerRef:t,dragThresholdPx:n,onCommitContentDrop:y,onCommitTabDrop:m,isContentZoneAllowed:b,children:[f.jsx(ke,{emptyContentComponent:d,doubleClickToAdd:h,children:f.jsx("div",{ref:t,className:a,style:x,children:f.jsx(Ne,{state:v,layoutMode:e,gridTracksInteractive:r,view:o,tabBarComponent:i,panelGroupComponent:c})})}),f.jsx(Oe,{containerRef:t}),f.jsx(Be,{})]})})},Be=()=>{const t=U();return f.jsxs(f.Fragment,{children:[f.jsx(oe,{suggest:t.suggest}),f.jsx(ue,{})]})},He=({initialState:t,createGroupId:e,createPanelId:r,layoutMode:n,gridTracksInteractive:o,dragThresholdPx:s,view:a,emptyContentComponent:i,state:c,onStateChange:u,className:d,style:h,tabBarComponent:v,panelGroupComponent:y,splitLimits:m,doubleClickToAdd:x})=>{if(!t)throw new Error("PanelSystem requires initialState.");if(!e)throw new Error("PanelSystem requires explicit createGroupId function.");if(!n)throw new Error("PanelSystem requires explicit layoutMode ('absolute' | 'grid').");if(n==="grid"&&o===void 0)throw new Error("PanelSystem(layoutMode='grid') requires explicit 'gridTracksInteractive' flag.");if(s===void 0)throw new Error("PanelSystem requires explicit 'dragThresholdPx' value.");const b=l.useRef(null),w=l.useMemo(()=>It(m),[m]);return f.jsx(De,{initialState:t,createGroupId:e,createPanelId:r,state:c,onStateChange:u,splitLimits:m,children:f.jsxs(Dt,{children:[f.jsx(_e,{}),f.jsx(Le,{containerRef:b,layoutMode:n,gridTracksInteractive:o,dragThresholdPx:s,view:a,style:h,className:d,tabBarComponent:v,panelGroupComponent:y,splitLimits:w,emptyContentComponent:i,doubleClickToAdd:x})]})})};exports.Drawer=S.Drawer;exports.DrawerLayers=S.DrawerLayers;exports.GridLayout=S.GridLayout;exports.ResizeHandle=S.ResizeHandle;exports.CSS_VAR_PREFIX=C.CSS_VAR_PREFIX;exports.HorizontalDivider=Et;exports.PanelSystem=He;exports.buildInitialState=me;exports.useLayerDragHandle=Rt;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const G=require("./GridLayout-CwuQEP7k.cjs"),f=require("react/jsx-runtime"),Tt=require("react"),C=require("./FloatingPanelFrame-Cu50Y9xg.cjs");function St(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const r in t)if(r!=="default"){const n=Object.getOwnPropertyDescriptor(t,r);Object.defineProperty(e,r,n.get?n:{enumerable:!0,get:()=>t[r]})}}return e.default=t,Object.freeze(e)}const l=St(Tt),Gt=t=>{const e=t==="drag"?C.COLOR_RESIZE_HANDLE_ACTIVE:t==="hover"?C.COLOR_RESIZE_HANDLE_HOVER:C.COLOR_RESIZE_HANDLE_IDLE;return{width:C.HORIZONTAL_DIVIDER_WIDTH,cursor:"col-resize",position:"relative",userSelect:"none",backgroundColor:e}},Et=({onResize:t,component:e,element:r})=>{const{ref:n,isDragging:o,onPointerDown:s}=G.useResizeDrag({axis:"x",onResize:t}),[a,i]=l.useState(!1),c={ref:n,style:Gt(o?"drag":a?"hover":"idle"),role:"separator","aria-orientation":"vertical","data-dragging":o?"true":void 0,onPointerDown:s,onPointerEnter:()=>i(!0),onPointerLeave:()=>i(!1)};return r?l.cloneElement(r,c):e?f.jsx(e,{...c}):f.jsx("div",{...c})},Rt=()=>{const{layerId:t}=G.useLayerInstance(),{getLayerHandleProps:e}=G.useGridLayoutContext();return l.useMemo(()=>e(t),[e,t])},it=l.createContext(null),Pt=()=>{const t=l.useContext(it);if(!t)throw new Error("useKeybindings must be used within KeybindingsProvider");return t},Ct=t=>{const e=[];t.metaKey&&e.push("Mod"),t.ctrlKey&&e.push("Ctrl"),t.altKey&&e.push("Alt"),t.shiftKey&&e.push("Shift");const r=t.key.length===1?t.key.toUpperCase():t.key;return e.push(r),e.join("-")},Dt=({children:t,configure:e})=>{const r=l.useRef({}),n=l.useCallback((a,i)=>{r.current={...r.current,[a]:i}},[]),o=l.useCallback(a=>{const i={...r.current};delete i[a],r.current=i},[]);l.useEffect(()=>{const a=i=>{const c=Ct(i),u=r.current[c];u&&u(i)};return window.addEventListener("keydown",a),()=>{window.removeEventListener("keydown",a)}},[]);const s=l.useMemo(()=>({register:n,unregister:o}),[n,o]);return l.useEffect(()=>{e&&e(s)},[s,e]),f.jsx(it.Provider,{value:s,children:t})},jt=(t,e)=>{t.register("Mod-\\",r=>{r.preventDefault(),e.splitFocused("vertical")}),t.register("Mod-Shift-\\",r=>{r.preventDefault(),e.splitFocused("horizontal")});for(const r of[1,2,3,4,5,6,7,8,9])t.register(`Mod-${String(r)}`,n=>{n.preventDefault(),e.focusGroupIndex(r)});t.register("Alt-ArrowRight",r=>{r.preventDefault(),e.focusNextGroup()}),t.register("Alt-ArrowLeft",r=>{r.preventDefault(),e.focusPrevGroup()})},At=t=>t.type==="group",at=(t,e={x:0,y:0,w:100,h:100})=>{const r=new Map,n=(o,s)=>{if(At(o)){r.set(o.groupId,s);return}if(o.direction==="vertical"){const c=s.w*o.ratio,u=s.w-c;n(o.a,{x:s.x,y:s.y,w:c,h:s.h}),n(o.b,{x:s.x+c,y:s.y,w:u,h:s.h});return}const a=s.h*o.ratio,i=s.h-a;n(o.a,{x:s.x,y:s.y,w:s.w,h:a}),n(o.b,{x:s.x,y:s.y+a,w:s.w,h:i})};return n(t,e),r},_t=(t,e)=>{const r=at(t.tree),n={areas:[["root"]],rows:[{size:"1fr"}],columns:[{size:"1fr"}],gap:"0px",style:{position:"relative"}},o=Array.from(r.entries()).map(([s,a])=>{const i={position:"absolute",left:`${a.x}%`,top:`${a.y}%`,width:`${a.w}%`,height:`${a.h}%`,overflow:"hidden",display:"flex",flexDirection:"column"};return{id:s,positionMode:"absolute",style:i,component:e(s)}});return{config:n,layers:o}},kt=(t,e,r)=>{const n=at(t.tree),o=Array.from(new Set(Array.from(n.values()).flatMap(m=>[m.x,m.x+m.w]))).sort((m,x)=>m-x),s=Array.from(new Set(Array.from(n.values()).flatMap(m=>[m.y,m.y+m.h]))).sort((m,x)=>m-x),a=o.slice(1).map((m,x)=>`${m-o[x]}fr`),i=s.slice(1).map((m,x)=>`${m-s[x]}fr`),c=a.map(m=>({size:m,resizable:r})),u=i.map(m=>({size:m,resizable:r})),d=(m,x,b,w)=>{for(const[g,I]of n.entries())if(m>=I.x&&x<=I.x+I.w&&b>=I.y&&w<=I.y+I.h)return g;return"."},h=[];for(let m=0;m<s.length-1;m+=1){const x=[];for(let b=0;b<o.length-1;b+=1)x.push(d(o[b],o[b+1],s[m],s[m+1]));h.push(x)}const v={areas:h,rows:u,columns:c,gap:"0px"},y=Array.from(n.keys()).map(m=>({id:m,gridArea:m,component:e(m)}));return{config:v,layers:y}},ct=l.createContext(null),Ot=()=>{const t=l.useContext(ct);if(!t)throw new Error("usePanelRenderContext must be used within PanelRenderProvider");return t},Mt=({value:t,children:e})=>f.jsx(ct.Provider,{value:t,children:e}),ut=l.createContext(null),lt=()=>{const t=l.useContext(ut);if(!t)throw new Error("useDomRegistry must be used within DomRegistryProvider");return t},Nt=({children:t})=>{const e=l.useRef(new Map),r=l.useCallback(c=>{const u=e.current.get(c);if(u)return u;const d={group:null,tabbar:null,content:null};return e.current.set(c,d),d},[]),n=l.useCallback((c,u)=>{const d=r(c);if(d.group=u,u===null){const h=e.current.get(c);(h?h.tabbar===null&&h.content===null:!1)&&e.current.delete(c)}},[r]),o=l.useCallback((c,u)=>{const d=r(c);if(d.tabbar=u,u===null){const h=e.current.get(c);(h?h.group===null&&h.content===null:!1)&&e.current.delete(c)}},[r]),s=l.useCallback((c,u)=>{const d=r(c);if(d.content=u,u===null){const h=e.current.get(c);(h?h.group===null&&h.tabbar===null:!1)&&e.current.delete(c)}},[r]),a=l.useCallback(()=>e.current,[]),i=l.useMemo(()=>({setGroupEl:n,setTabbarEl:o,setContentEl:s,getAll:a}),[n,o,s,a]);return f.jsx(ut.Provider,{value:i,children:t})},Lt={display:"flex",flexDirection:"column",width:"100%",height:"100%"},Bt={flex:"1 1 auto",minWidth:0,minHeight:0,position:"relative",overflow:"hidden"};function Ht(t,e,r,n){return t?l.cloneElement(t,r,n):e?f.jsx(e,{...r,children:n}):f.jsx("div",{...r,children:n})}function $t(t,e,r,n){return t?l.cloneElement(t,r,n):e?f.jsx(e,{...r,children:n}):f.jsx("div",{...r,children:n})}const zt=({group:t,tabbar:e,content:r,onContentPointerDown:n,groupRef:o,contentRef:s,component:a,element:i,contentComponent:c,contentElement:u})=>{const d={ref:o,style:Lt,"data-group-id":t.id},v=Ht(u,c,{ref:s,style:Bt,"data-dnd-zone":"content",onPointerDown:n},r),y=f.jsxs(f.Fragment,{children:[e,v]});return $t(i,a,d,y)},dt=l.memo(zt,(t,e)=>t.group.id!==e.group.id||t.group.activeTabId!==e.group.activeTabId||t.group.tabs.length!==e.group.tabs.length?!1:t.group.tabs===e.group.tabs);dt.displayName="PanelGroupView";const V=(t,e,r)=>{const n=t.left,o=t.top,s=t.width,a=t.height,i=e-n,c=r-o,u=s/3,d=a/3;return i>u&&i<s-u&&c>d&&c<a-d?"center":i<c&&i<s-i&&c<a-c?"left":s-i<c&&s-i<i&&c<a-c?"right":c<i&&c<a-c&&i<s-i?"top":"bottom"};function _(t,e){if(!e){const n=(()=>({type:t}));return Object.defineProperty(n,"type",{value:t,writable:!1,enumerable:!0}),n}const r=((...n)=>{const o=e(...n);return typeof o>"u"?{type:t}:{type:t,payload:o}});return Object.defineProperty(r,"type",{value:t,writable:!1,enumerable:!0}),r}const Xt=(t,e)=>{const r={};return Object.keys(t).forEach(n=>{const o=t[n];r[n]=((...s)=>{const a=o(...s);return e(a),a})}),r},pt=(t,e)=>{const r={};return Object.keys(e).forEach(n=>{const o=e[n];if(!o)return;const s=t[n];if(!s)throw new Error(`Missing action creator for key "${String(n)}"`);r[s.type]=o}),r},ft={phase:{kind:"idle"},suggest:null,pointer:null,tabbarHover:null,draggingTabElement:null},A={startContent:_("START_CONTENT",t=>t),startTab:_("START_TAB",t=>t),setSuggest:_("SET_SUGGEST",t=>t),setPointer:_("SET_POINTER",t=>t),setTabbarHover:_("SET_TABBAR_HOVER",t=>t),reset:_("RESET")},Ft=pt(A,{startContent:(t,e)=>({phase:{kind:"content",startX:e.payload.x,startY:e.payload.y,fromGroupId:e.payload.groupId,tabId:e.payload.tabId,cache:e.payload.cache},suggest:null,pointer:null,tabbarHover:null,draggingTabElement:null}),startTab:(t,e)=>({phase:{kind:"tab",startX:e.payload.x,startY:e.payload.y,fromGroupId:e.payload.groupId,tabId:e.payload.tabId,cache:e.payload.cache},suggest:null,pointer:null,tabbarHover:null,draggingTabElement:e.payload.element}),setSuggest:(t,e)=>({...t,suggest:e.payload}),setPointer:(t,e)=>({...t,pointer:e.payload}),setTabbarHover:(t,e)=>({...t,tabbarHover:e.payload}),reset:()=>ft}),Yt=(t,e)=>{const r=Ft[e.type];return r?r(t,e,void 0):t},bt=l.createContext(null),U=()=>{const t=l.useContext(bt);if(!t)throw new Error("usePanelInteractions must be used within InteractionsProvider");return t},Vt=({containerRef:t,dragThresholdPx:e,onCommitContentDrop:r,onCommitTabDrop:n,isContentZoneAllowed:o,children:s})=>{const[a,i]=l.useReducer(Yt,ft),c=lt(),u=l.useCallback(()=>{const b=Array.from(c.getAll().entries()),w=b.map(([p,T])=>({gid:p,el:T.content??T.group})).filter(p=>!!p.el).map(p=>({...p,rect:p.el.getBoundingClientRect()})),g=b.map(([p,T])=>({gid:p,el:T.tabbar})).filter(p=>!!p.el).map(p=>({...p,rect:p.el.getBoundingClientRect()})),I=b.map(([p,T])=>({gid:p,el:T.content??T.group})).filter(p=>!!p.el).map(p=>({...p,rect:p.el.getBoundingClientRect()}));return{groups:w,tabbars:g,contents:I}},[c]),d=G.useEffectEvent(b=>{if(!t.current)return;const g=b.clientX,I=b.clientY,p=a.phase;if(p.kind==="idle")return;const T=Math.abs(g-p.startX),R=Math.abs(I-p.startY);if(T<e&&R<e){a.phase.kind==="content"&&i(A.setSuggest(null)),i(A.setPointer(null)),i(A.setTabbarHover(null));return}if(i(A.setPointer({x:g,y:I})),p.kind==="content"){const E=p.cache.groups.find(({rect:S})=>g>=S.left&&g<=S.right&&I>=S.top&&I<=S.bottom);if(!E){i(A.setSuggest(null));return}const D=V(E.rect,g,I);if(o&&!o({targetGroupId:E.gid,zone:D})){i(A.setSuggest(null));return}i(A.setSuggest({rect:E.rect,zone:D}));return}if(p.kind==="tab"){const E=p.cache.tabbars.find(({rect:P})=>g>=P.left&&g<=P.right&&I>=P.top&&I<=P.bottom);if(E){const k=Array.from(E.el.querySelectorAll("[role='tab']")).map(H=>H.getBoundingClientRect()),j=k.map(H=>H.left+H.width/2),M=j.findIndex(H=>g<H),N=M===-1?j.length:M,yt=k.length===0?E.rect.left+8:N===0?k[0].left:N===k.length?k[k.length-1].right:(k[N-1].right+k[N].left)/2;i(A.setTabbarHover({groupId:E.gid,index:N,rect:E.rect,insertX:yt}))}else i(A.setTabbarHover(null));const D=p.cache.contents.find(({rect:P})=>g>=P.left&&g<=P.right&&I>=P.top&&I<=P.bottom);if(!D){i(A.setSuggest(null));return}const S=V(D.rect,g,I);if(o&&!o({targetGroupId:D.gid,zone:S})){i(A.setSuggest(null));return}i(A.setSuggest({rect:D.rect,zone:S}))}}),h=G.useEffectEvent(b=>{const w=t.current,g=a;if(i(A.reset()),!w)return;const I=b.clientX,p=b.clientY;if(g.phase.kind==="idle")return;const T=Math.abs(I-g.phase.startX),R=Math.abs(p-g.phase.startY);if(!(T<e&&R<e)){if(g.phase.kind==="content"){const E=g.phase.cache.groups.find(({rect:P})=>I>=P.left&&I<=P.right&&p>=P.top&&p<=P.bottom);if(!E)return;const D=E.gid??null;if(!D)return;const S=V(E.rect,I,p);if(o&&!o({targetGroupId:D,zone:S}))return;r({fromGroupId:g.phase.fromGroupId,tabId:g.phase.tabId,targetGroupId:D,zone:S});return}if(g.phase.kind==="tab"){const E=g.phase.cache.tabbars.find(({rect:S})=>I>=S.left&&I<=S.right&&p>=S.top&&p<=S.bottom);if(E){const S=E.gid;if(!S)return;const k=Array.from(E.el.querySelectorAll("[role='tab']")).map(N=>{const Z=N.getBoundingClientRect();return Z.left+Z.width/2}),j=k.findIndex(N=>I<N),M=j===-1?k.length:j;n({fromGroupId:g.phase.fromGroupId,tabId:g.phase.tabId,targetGroupId:S,targetIndex:M});return}const D=g.phase.cache.contents.find(({rect:S})=>I>=S.left&&I<=S.right&&p>=S.top&&p<=S.bottom);if(D){const S=D.gid??null;if(!S)return;const P=V(D.rect,I,p);if(o&&!o({targetGroupId:S,zone:P}))return;r({fromGroupId:g.phase.fromGroupId,tabId:g.phase.tabId,targetGroupId:S,zone:P})}}}}),v=G.useEffectEvent(()=>{i(A.reset())});l.useEffect(()=>{if(a.phase.kind!=="idle")return window.addEventListener("pointermove",d),window.addEventListener("pointerup",h,{once:!0}),window.addEventListener("pointercancel",v,{once:!0}),()=>{window.removeEventListener("pointermove",d),window.removeEventListener("pointerup",h),window.removeEventListener("pointercancel",v)}},[a.phase.kind]);const y=l.useCallback((b,w,g)=>{if(g.button!==0)return;g.currentTarget.setPointerCapture(g.pointerId);const I=u();i(A.startContent({x:g.clientX,y:g.clientY,groupId:b,tabId:w,cache:I}))},[u]),m=l.useCallback((b,w,g)=>{if(g.button!==0)return;const I=g.currentTarget;I&&I.setPointerCapture(g.pointerId);const p=u();i(A.startTab({x:g.clientX,y:g.clientY,groupId:w,tabId:b,cache:p,element:I}))},[u]),x=l.useMemo(()=>({suggest:a.suggest,isTabDragging:a.phase.kind==="tab",draggingTabId:a.phase.kind==="tab"?a.phase.tabId:null,dragPointer:a.pointer,tabbarHover:a.tabbarHover,draggingTabElement:a.draggingTabElement,onStartContentDrag:y,onStartTabDrag:m}),[a.suggest,a.pointer,a.tabbarHover,a.phase,a.draggingTabElement,y,m]);return f.jsx(bt.Provider,{value:x,children:s})},et={display:"inline-flex",alignItems:"center",userSelect:"none"},qt=({groupId:t,tab:e,active:r,dragging:n,onClickTab:o,onStartDrag:s,onCloseTab:a,tabComponent:i,tabElement:c,onDoubleClick:u})=>{const d=l.useEffectEvent(()=>{o(e.id)}),h=l.useEffectEvent(x=>{s&&x.button===0&&s(e.id,t,x)}),v=()=>{const x=!!a;return f.jsx(l.Activity,{mode:x?"visible":"hidden",children:f.jsx("button",{type:"button","aria-label":`Close tab ${e.title}`,onClick:b=>{a&&(b.stopPropagation(),a(t,e.id))},style:{marginLeft:6},tabIndex:x?void 0:-1,disabled:!x,"aria-hidden":x?void 0:!0,children:"×"})})},y={role:"tab","aria-selected":r,tabIndex:r?0:-1,style:et,onClick:d,onPointerDown:h,onDoubleClick:u,"data-tab-id":e.id,"data-active":r?"true":"false","data-dragging":n?"true":"false",children:f.jsxs(f.Fragment,{children:[f.jsx("span",{children:e.title}),v()]})},m={type:"button",role:"tab","aria-selected":r,tabIndex:r?0:-1,style:et,onClick:()=>{o(e.id)},onPointerDown:x=>{s&&x.button===0&&s(e.id,t,x)},onDoubleClick:u,children:f.jsx("span",{children:e.title})};return c?c(m):i?f.jsx(i,{...m}):f.jsx("div",{...y})},Kt={display:"flex",alignItems:"center"},Ut={flex:"1 1 auto",alignSelf:"stretch"},Wt=({group:t,onClickTab:e,onStartDrag:r,rootRef:n,component:o,element:s,tabComponent:a,tabElement:i,onAddTab:c,onCloseTab:u,doubleClickToAdd:d})=>{const{isTabDragging:h,draggingTabId:v}=U(),y=l.useRef(null),m=l.useCallback(p=>{if(y.current=p,!!n){if(typeof n=="function"){n(p);return}try{n.current=p}catch{}}},[n]),x=l.useEffectEvent(p=>{const T=y.current??p.currentTarget;if(!T)return;const R=Array.from(T.querySelectorAll('[role="tab"]'));if(R.length===0)return;const E=j=>{const M=Math.max(0,Math.min(j,R.length-1)),N=R[M];N&&N.focus()},D=document.activeElement,S=D?R.indexOf(D):R.findIndex(j=>j.getAttribute("data-tab-id")===t.activeTabId);if(p.key==="ArrowRight"){p.preventDefault();const j=S>=0?S+1:0;E(j>=R.length?0:j);return}if(p.key==="ArrowLeft"){p.preventDefault();const j=S>=0?S-1:R.length-1;E(j<0?R.length-1:j);return}if(p.key==="Home"){p.preventDefault(),E(0);return}if(p.key==="End"){p.preventDefault(),E(R.length-1);return}if(p.key==="Enter"||p.key===" "){p.preventDefault();const M=(S>=0?R[S]:null)?.getAttribute("data-tab-id")??null;M&&e(M);return}if(p.key==="Delete"||p.key==="Backspace"){if(u){p.preventDefault();const M=(S>=0?R[S]:null)?.getAttribute("data-tab-id")??null;M&&u(t.id,M)}return}const P=(p.ctrlKey?1:0)+(p.metaKey?1:0)>0,k=typeof p.key=="string"?p.key.toLowerCase():"";if(P&&k==="t"){c&&(p.preventDefault(),c(t.id));return}});l.useEffect(()=>{const p=y.current;if(!p)return;const T=p.querySelector(`[role="tab"][data-tab-id="${t.activeTabId}"]`);if(T===document.activeElement)return;!p.contains(document.activeElement)&&T&&T.focus()},[t.activeTabId]);const b={style:Kt,role:"tablist","data-tabbar":"true","data-group-id":t.id,"data-dragging":h?"true":"false",onKeyDown:x},w=G.useElementComponentWrapper({element:s,component:o}),g=()=>c?f.jsx("button",{type:"button","aria-label":"Add tab",onClick:()=>{c(t.id)},children:"+"}):null,I=l.useCallback(()=>{d&&c&&c(t.id)},[d,c,t.id]);return f.jsxs(w,{...b,ref:m,onDoubleClick:I,children:[t.tabs.map((p,T)=>f.jsx(qt,{groupId:t.id,tab:p,active:t.activeTabId===p.id,dragging:v===p.id,onClickTab:e,onStartDrag:r,onCloseTab:u,tabComponent:a,tabElement:i,onDoubleClick:R=>R.stopPropagation()},`${t.id}:${p.id}:${T}`)),f.jsx("span",{style:Ut}),g()]})},Zt=({id:t,TabBarComponent:e,PanelGroupComponent:r})=>{const{getGroup:n,getGroupContent:o,onClickTab:s,onAddTab:a,onCloseTab:i,onStartContentDrag:c,onStartTabDrag:u,doubleClickToAdd:d}=Ot(),{setGroupEl:h,setTabbarEl:v,setContentEl:y}=lt(),m=l.useCallback(T=>{h(t,T)},[t,h]),x=l.useCallback(T=>{y(t,T)},[t,y]),b=l.useCallback(T=>{v(t,T)},[t,v]),w=n(t);if(!w)return null;const g=o(t),I=e??Wt,p=r??(T=>f.jsx(dt,{...T}));return f.jsx(p,{group:w,tabbar:f.jsx(I,{rootRef:b,group:w,onClickTab:T=>s(t,T),onAddTab:a,onCloseTab:i,onStartDrag:(T,R,E)=>u(T,R,E),doubleClickToAdd:d}),content:g,groupRef:m,contentRef:x,onContentPointerDown:T=>c(t,T)})},Jt=(t,e)=>{const r=new Array(16);for(let n=0;n<4;n++)for(let o=0;o<4;o++)r[n*4+o]=t[0+o]*e[n*4+0]+t[4+o]*e[n*4+1]+t[8+o]*e[n*4+2]+t[12+o]*e[n*4+3];return r},q=t=>{if(t.length!==16)throw new Error("Matrix must have exactly 16 values");const e=Object.freeze([...t]),r=n=>{const o=Jt(e,n);return q(o)};return Object.freeze({translate:(n=0,o=0,s=0)=>r([1,0,0,0,0,1,0,0,0,0,1,0,n,o,s,1]),translate3d:(n,o,s)=>r([1,0,0,0,0,1,0,0,0,0,1,0,n,o,s,1]),translateX:n=>r([1,0,0,0,0,1,0,0,0,0,1,0,n,0,0,1]),translateY:n=>r([1,0,0,0,0,1,0,0,0,0,1,0,0,n,0,1]),translateZ:n=>r([1,0,0,0,0,1,0,0,0,0,1,0,0,0,n,1]),scale:(n=1,o=1,s=1)=>r([n,0,0,0,0,o,0,0,0,0,s,0,0,0,0,1]),scale3d:(n,o,s)=>r([n,0,0,0,0,o,0,0,0,0,s,0,0,0,0,1]),scaleX:n=>r([n,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1]),scaleY:n=>r([1,0,0,0,0,n,0,0,0,0,1,0,0,0,0,1]),scaleZ:n=>r([1,0,0,0,0,1,0,0,0,0,n,0,0,0,0,1]),rotateX:n=>{const o=Math.cos(n),s=Math.sin(n);return r([1,0,0,0,0,o,s,0,0,-s,o,0,0,0,0,1])},rotateY:n=>{const o=Math.cos(n),s=Math.sin(n);return r([o,0,-s,0,0,1,0,0,s,0,o,0,0,0,0,1])},rotateZ:n=>{const o=Math.cos(n),s=Math.sin(n);return r([o,s,0,0,-s,o,0,0,0,0,1,0,0,0,0,1])},rotate:(n,o,s,a)=>{const i=Math.sqrt(o*o+s*s+a*a);if(i===0)return q(e);o/=i,s/=i,a/=i;const c=Math.cos(n),u=Math.sin(n),d=1-c;return r([d*o*o+c,d*o*s+u*a,d*o*a-u*s,0,d*o*s-u*a,d*s*s+c,d*s*a+u*o,0,d*o*a+u*s,d*s*a-u*o,d*a*a+c,0,0,0,0,1])},rotate3d:(n,o,s,a)=>{const i=Math.sqrt(n*n+o*o+s*s);if(i===0)return q(e);n/=i,o/=i,s/=i;const c=Math.cos(a),u=Math.sin(a),d=1-c;return r([d*n*n+c,d*n*o+u*s,d*n*s-u*o,0,d*n*o-u*s,d*o*o+c,d*o*s+u*n,0,d*n*s+u*o,d*o*s-u*n,d*s*s+c,0,0,0,0,1])},skew:(n=0,o=0)=>{const s=Math.tan(n),a=Math.tan(o);return r([1,a,0,0,s,1,0,0,0,0,1,0,0,0,0,1])},skewX:n=>{const o=Math.tan(n);return r([1,0,0,0,o,1,0,0,0,0,1,0,0,0,0,1])},skewY:n=>{const o=Math.tan(n);return r([1,o,0,0,0,1,0,0,0,0,1,0,0,0,0,1])},perspective:n=>{if(n===0)throw new Error("Perspective distance cannot be zero");return r([1,0,0,0,0,1,0,0,0,0,1,-1/n,0,0,0,1])},toCSS:()=>`matrix3d(${e.join(", ")})`,toArray:()=>e,toString:()=>[`[${e[0]}, ${e[4]}, ${e[8]}, ${e[12]}]`,`[${e[1]}, ${e[5]}, ${e[9]}, ${e[13]}]`,`[${e[2]}, ${e[6]}, ${e[10]}, ${e[14]}]`,`[${e[3]}, ${e[7]}, ${e[11]}, ${e[15]}]`].join(`
2
+ `)})},Qt=()=>q([1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1]),te={position:"fixed",inset:0,pointerEvents:"none",zIndex:C.DROP_SUGGEST_Z_INDEX},ee={position:"absolute",border:`${C.DROP_SUGGEST_BORDER_WIDTH} dashed ${C.DROP_SUGGEST_BORDER_COLOR}`,background:C.DROP_SUGGEST_BG_COLOR,borderRadius:C.DROP_SUGGEST_BORDER_RADIUS,transformOrigin:"top left"},L=(t,e)=>e<=0?0:G.clampNumber(t/e,0),re=(t,e,r)=>{const{width:n,height:o}=t,s=r/2,a=n>0?n:1,i=o>0?o:1,c={translateX:r,translateY:r,scaleX:L(G.clampNumber(n-r*2,0),a),scaleY:L(G.clampNumber(o-r*2,0),i)},u={translateX:r,translateY:r,scaleX:L(G.clampNumber(n/2-r*1.5,0),a),scaleY:L(G.clampNumber(o-r*2,0),i)},d={translateX:n/2+s,translateY:r,scaleX:L(G.clampNumber(n/2-r*1.5,0),a),scaleY:L(G.clampNumber(o-r*2,0),i)},h={translateX:r,translateY:r,scaleX:L(G.clampNumber(n-r*2,0),a),scaleY:L(G.clampNumber(o/2-r*1.5,0),i)},v={translateX:r,translateY:o/2+s,scaleX:L(G.clampNumber(n-r*2,0),a),scaleY:L(G.clampNumber(o/2-r*1.5,0),i)},y={center:c,left:u,right:d,top:h,bottom:v},{translateX:m,translateY:x,scaleX:b,scaleY:w}=y[e];return Qt().translate(m,x,0).scale(b,w,1).toCSS()},ne=(t,e)=>{const r=C.DROP_SUGGEST_PADDING_PX;return{...ee,left:t.left,top:t.top,width:t.width,height:t.height,transform:re(t,e,r)}},oe=({suggest:t})=>{if(!t)return null;const{rect:e,zone:r}=t,n=ne(e,r);return f.jsx("div",{style:te,children:f.jsx("div",{style:n})})},se=typeof window<"u"&&typeof document<"u",ie=t=>{const[e,r]=l.useState(null),[n,o]=l.useState(null);return G.useIsomorphicLayoutEffect(()=>{if(!se||!t){r(null),o(null);return}const s=t.getBoundingClientRect();r({width:s.width,height:s.height}),o(t.outerHTML)},[t]),{html:n,size:e}},ae={position:"fixed",inset:0,pointerEvents:"none",zIndex:C.TAB_DRAG_OVERLAY_Z_INDEX},ce={position:"absolute",width:C.TAB_DRAG_INSERT_GUIDE_WIDTH,borderRadius:C.TAB_DRAG_INSERT_GUIDE_BORDER_RADIUS,background:C.TAB_DRAG_INSERT_GUIDE_COLOR,boxShadow:C.TAB_DRAG_INSERT_GUIDE_SHADOW},ue=()=>{const{isTabDragging:t,draggingTabId:e,dragPointer:r,tabbarHover:n,draggingTabElement:o}=U(),{html:s,size:a}=ie(o),i=r!==null&&e!==null,c=l.useMemo(()=>{if(!(!i||!r))return{position:"absolute",left:r.x,top:r.y,transform:`translate(${C.TAB_DRAG_PREVIEW_OFFSET_X}, ${C.TAB_DRAG_PREVIEW_OFFSET_Y})`,pointerEvents:"none"}},[i,r]),u=l.useMemo(()=>{if(!(!c||!o))return a?{...c,width:a.width,height:a.height}:c},[c,o,a]),d=l.useMemo(()=>{if(n)return{...ce,left:n.insertX,top:n.rect.top+4,height:Math.max(0,n.rect.height-8)}},[n]);return t?f.jsxs("div",{style:ae,children:[f.jsx(l.Activity,{mode:u?"visible":"hidden",children:f.jsx("div",{style:u,children:f.jsx("div",{style:{width:"100%",height:"100%",pointerEvents:"none"},dangerouslySetInnerHTML:{__html:s??""}})})}),f.jsx(l.Activity,{mode:d?"visible":"hidden",children:f.jsx("div",{style:d})})]}):null},O=t=>t.type==="group",X=(t,e=[])=>{if(O(t))return[...e,t.groupId];const r=X(t.a,e);return X(t.b,r)},W=(t,e)=>e.reduce((r,n)=>O(r)?r:r[n],t),F=(t,e,r)=>{if(e.length===0)return r;const[n,...o]=e;return O(t)?t:n==="a"?{...t,a:F(t.a,o,r)}:{...t,b:F(t.b,o,r)}},K=(t,e,r=[])=>{if(O(t))return t.groupId===e?{splitPath:null,side:null}:null;if(O(t.a)&&t.a.groupId===e)return{splitPath:r,side:"a"};if(O(t.b)&&t.b.groupId===e)return{splitPath:r,side:"b"};const n=K(t.a,e,[...r,"a"]);return n||K(t.b,e,[...r,"b"])},gt=(t,e,r,n)=>{const o=n(),s=K(t,e),a={type:"split",direction:r,ratio:.5,a:{type:"group",groupId:e},b:{type:"group",groupId:o}};if(!s||s.splitPath===null)return{tree:a,newGroupId:o};const i=s.splitPath,c=W(t,i);if(O(c))return{tree:a,newGroupId:o};const u=s.side==="a"?{...c,a}:{...c,b:a};return{tree:F(t,i,u),newGroupId:o}},le=(t,e)=>{const r=K(t,e);if(!r||r.splitPath===null)return{tree:t,survivorGroupId:e};const n=r.splitPath,o=W(t,n);if(O(o))return{tree:t,survivorGroupId:e};const s=r.side==="a"?o.b:o.a,a=F(t,n,s),i=O(s)?s.groupId:X(s)[0]??null;return{tree:a,survivorGroupId:i}},de=(t,e,r)=>{const n=W(t,e);if(O(n))return t;const o={...n,ratio:G.clampNumber(r,.05,.95)};return F(t,e,o)},J=t=>{if(Object.keys(t.groups).filter(o=>t.groups[o].tabIds.length===0).length===0)return t;const n=(o,s)=>{const a=o.groups[s];if(!a||a.tabs.length>0||Object.keys(o.groups).length<=1)return o;const{tree:c,survivorGroupId:u}=le(o.tree,s),{[s]:d,...h}=o.groups,v=X(c),y=o.focusedGroupId===s?u??v[0]??null:o.focusedGroupId;return{...o,tree:c,groups:h,groupOrder:v,focusedGroupId:y}};return t.groupOrder.reduce((o,s)=>n(o,s),t)},pe=t=>({id:t,tabIds:[],tabs:[],activeTabId:null}),rt=(t,e,r,n)=>{const o={...t.groups},s=o[e];if(!s)throw new Error(`Group ${e} does not exist.`);const a={...t.panels,[r.id]:r},i=[...s.tabIds,r.id],c=n?r.id:s.activeTabId??r.id,u=i.map(h=>a[h]),d={...s,tabIds:i,tabs:u,activeTabId:c};return o[e]=d,{...t,panels:a,groups:o}},fe=(t,e,r)=>{const n={...t.groups},o=n[e];if(!o)throw new Error(`Group ${e} does not exist.`);const s=o.tabIds.filter(c=>c!==r),a=s.map(c=>t.panels[c]),i=o.activeTabId===r?s[0]??null:o.activeTabId;return n[e]={...o,tabIds:s,tabs:a,activeTabId:i},{...t,groups:n}},nt=(t,e,r,n,o)=>{const s=t.groups[e],a=t.groups[r];if(!s||!a)throw new Error("moveTab: source or target group is missing.");const i={...t.groups},c=s.tabIds.filter(h=>h!==n),u=[...a.tabIds.filter(h=>h!==n),n],d=s.activeTabId===n?c[0]??null:s.activeTabId;return i[e]={...s,tabIds:c,tabs:c.map(h=>t.panels[h]),activeTabId:d},i[r]={...a,tabIds:u,tabs:u.map(h=>t.panels[h]),activeTabId:n},{...t,groups:i}},ht=(t,e,r)=>{const n=t.groups[e];if(!n)throw new Error(`setActiveTab: group ${e} not found.`);if(!n.tabIds.some(s=>s===r))throw new Error(`setActiveTab: tab ${r} not found in group ${e}.`);const o={...t.groups,[e]:{...n,activeTabId:r}};return{...t,groups:o,focusedGroupId:e}},ot=(t,e,r,n,o)=>{const s=t.groups[e];if(!s)throw new Error(`addTabToGroupAtIndex: group ${e} not found.`);const a={...t.panels,[r.id]:r},i=s.tabIds.slice(),c=Math.max(0,Math.min(n,i.length));i.splice(c,0,r.id);const u=i.map(v=>a[v]),d=o?r.id:s.activeTabId??r.id,h={...t.groups,[e]:{...s,tabIds:i,tabs:u,activeTabId:d}};return{...t,panels:a,groups:h}},B=(t,e)=>{if(!t.groups[e])throw new Error(`setFocusedGroup: group ${e} not found.`);return{...t,focusedGroupId:e}},be=(t,e)=>{const r=e-1,n=t.groupOrder[r];return n?B(t,n):t},ge=t=>{const e=t.groupOrder,r=t.focusedGroupId;if(!r){const s=e[0];return s?B(t,s):t}const n=e.indexOf(r),o=e[(n+1)%e.length];return B(t,o)},he=t=>{const e=t.groupOrder,r=t.focusedGroupId;if(!r){const s=e[e.length-1];return s?B(t,s):t}const n=e.indexOf(r),o=e[(n-1+e.length)%e.length];return B(t,o)},mt=(t,e,r,n)=>{const{tree:o,newGroupId:s}=gt(t.tree,e,r,n),a={...t.groups,[s]:pe(s)},i=X(o);return{...t,tree:o,groups:a,groupOrder:i,focusedGroupId:s}},me=t=>{const r={type:"group",groupId:"g_1"},n=Object.fromEntries(t.map(i=>[i.id,i])),s={g_1:{id:"g_1",tabIds:t.map(i=>i.id),tabs:t,activeTabId:t[0]?.id??null}};return{tree:r,panels:n,groups:s,groupOrder:["g_1"],focusedGroupId:"g_1"}},ve=l.createContext(null),Ie=({value:t,children:e})=>f.jsx(ve.Provider,{value:t,children:e}),vt=l.createContext(null),xe=()=>{const t=l.useContext(vt);if(!t)throw new Error("useTree must be used within TreeProvider");return t},we=({value:t,children:e})=>f.jsx(vt.Provider,{value:t,children:e}),ye=l.createContext(null),Te=({value:t,children:e})=>f.jsx(ye.Provider,{value:t,children:e}),$=t=>{const e=G.toFiniteNumberOr(t,Number.POSITIVE_INFINITY);return G.clampNumber(e,1)},Se=t=>typeof t=="object"&&t!==null,Ge=t=>Se(t)?"rows"in t?!0:"cols"in t:!1,It=t=>{if(!t)return{rows:Number.POSITIVE_INFINITY,cols:Number.POSITIVE_INFINITY};if(typeof t=="number"){const r=$(t);return{rows:r,cols:r}}if(Ge(t))return{rows:$(t.rows),cols:$(t.cols)};const e=t;return{rows:$(e.maxHorizontal),cols:$(e.maxVertical)}},Q=t=>{if(O(t))return{horizontal:1,vertical:1};const e=Q(t.a),r=Q(t.b);return t.direction==="horizontal"?{horizontal:e.horizontal+r.horizontal,vertical:Math.max(e.vertical,r.vertical)}:{horizontal:Math.max(e.horizontal,r.horizontal),vertical:e.vertical+r.vertical}},Ee=(t,e,r)=>{const{tree:n}=gt(t,e,r,()=>"__preview__");return n},tt=(t,e,r,n)=>{if(!Number.isFinite(n.rows)&&!Number.isFinite(n.cols))return!0;const o=Ee(t,e,r),s=Q(o);return!(s.horizontal>n.rows||s.vertical>n.cols)},xt={splitFocused:_("panelState/splitFocused",t=>({direction:t})),focusGroupIndex:_("panelState/focusGroupIndex",t=>({index1Based:t})),focusNextGroup:_("panelState/focusNextGroup"),focusPrevGroup:_("panelState/focusPrevGroup"),setActiveTab:_("panelState/setActiveTab",(t,e)=>({groupId:t,tabId:e})),addTab:_("panelState/addTab",t=>t),addNewTab:_("panelState/addNewTab",t=>t),removeTab:_("panelState/removeTab",(t,e)=>({groupId:t,tabId:e})),contentDrop:_("panelState/contentDrop",t=>t),tabDrop:_("panelState/tabDrop",t=>t),adjustSplitRatio:_("panelState/adjustSplitRatio",t=>t)},Re=(t,e,r)=>{const n=t.groups[e.fromGroupId],o=t.groups[e.targetGroupId];if(!n||!o||!n.tabs.find(h=>h.id===e.tabId))return t;if(e.zone==="center"&&e.fromGroupId===e.targetGroupId)return ht(t,e.fromGroupId,e.tabId);if(e.zone==="center"){const h=nt(t,e.fromGroupId,e.targetGroupId,e.tabId);return B(h,e.targetGroupId)}const a=e.zone==="left"||e.zone==="right"?"vertical":"horizontal";if(!tt(t.tree,e.targetGroupId,a,r.splitLimits))return t;const i=r.createGroupId(),c=mt(t,e.targetGroupId,a,()=>i),u=e.zone==="left"||e.zone==="top"?e.targetGroupId:i,d=nt(c,e.fromGroupId,u,e.tabId);return B(d,u)},Pe=(t,e)=>{const r=t.groups[e.fromGroupId],n=t.groups[e.targetGroupId];if(!r||!n||!t.panels[e.tabId])return t;if(e.fromGroupId===e.targetGroupId){const v=r.tabIds.filter(w=>w!==e.tabId),y=Math.max(0,Math.min(e.targetIndex,v.length)),m=v.slice(0,y).concat([e.tabId],v.slice(y)),x=m.map(w=>t.panels[w]).filter(Boolean),b={...t.groups,[e.fromGroupId]:{...r,tabIds:m,tabs:x}};return{...t,groups:b}}const s={...t.groups},a=r.tabIds.filter(v=>v!==e.tabId),i=a.map(v=>t.panels[v]);s[e.fromGroupId]={...r,tabIds:a,tabs:i,activeTabId:r.activeTabId===e.tabId?i[0]?.id??null:r.activeTabId};const c=n.tabIds.filter(v=>v!==e.tabId),u=Math.max(0,Math.min(e.targetIndex,c.length)),d=c.slice(0,u).concat([e.tabId],c.slice(u)),h=d.map(v=>t.panels[v]).filter(Boolean);return s[e.targetGroupId]={...n,tabIds:d,tabs:h,activeTabId:e.tabId},{...t,groups:s,focusedGroupId:e.targetGroupId}},Ce=pt(xt,{splitFocused:(t,e,r)=>{const n=t.focusedGroupId??t.groupOrder[0]??null;return!n||!tt(t.tree,n,e.payload.direction,r.splitLimits)?t:mt(t,n,e.payload.direction,r.createGroupId)},focusGroupIndex:(t,e)=>be(t,e.payload.index1Based),focusNextGroup:t=>ge(t),focusPrevGroup:t=>he(t),setActiveTab:(t,e)=>ht(t,e.payload.groupId,e.payload.tabId),addTab:(t,e)=>{const{groupId:r,tab:n,index:o,makeActive:s}=e.payload;return typeof o=="number"?ot(t,r,n,o,s??!0):rt(t,r,n,s??!0)},addNewTab:(t,e,r)=>{if(!r.createPanelId)throw new Error("addNewTab requires PanelSystemProvider.createPanelId");const o={id:r.createPanelId(),title:e.payload.title,render:()=>e.payload.title},{groupId:s,index:a,makeActive:i}=e.payload;return typeof a=="number"?ot(t,s,o,a,i??!0):rt(t,s,o,i??!0)},removeTab:(t,e)=>fe(t,e.payload.groupId,e.payload.tabId),contentDrop:(t,e,r)=>Re(t,e.payload,r),tabDrop:(t,e)=>Pe(t,e.payload),adjustSplitRatio:(t,e)=>{const r=W(t.tree,e.payload.path);if(O(r))return t;const n=de(t.tree,e.payload.path,r.ratio+e.payload.deltaRatio);return{...t,tree:n}}}),st=(t,e,r)=>{const n=Ce[e.type];if(!n)return t;const o=n(t,e,r);return J(o)},wt=l.createContext(null),Y=()=>{const t=l.useContext(wt);if(!t)throw new Error("usePanelSystem must be used within PanelSystemProvider");return t},De=({initialState:t,createGroupId:e,createPanelId:r,state:n,onStateChange:o,splitLimits:s,children:a})=>{const i=l.useMemo(()=>J(t),[t]),c=l.useMemo(()=>It(s),[s]),u=l.useRef({createGroupId:e,splitLimits:c,createPanelId:r});u.current.createGroupId=e,u.current.splitLimits=c,u.current.createPanelId=r;const[d,h]=l.useReducer((T,R)=>st(T,R,u.current),i),v=l.useMemo(()=>n?J(n):d,[n,d]),y=l.useRef(v);y.current=v;const m=n!==void 0,x=l.useCallback(T=>{if(m){const R=st(y.current,T,u.current);o?.(R);return}h(T)},[m,o,h]),b=l.useMemo(()=>Xt(xt,x),[x]),w=l.useMemo(()=>({setActiveTab:b.setActiveTab,tabDrop:b.tabDrop}),[b]),g=l.useMemo(()=>({adjustSplitRatio:b.adjustSplitRatio}),[b]),I=l.useMemo(()=>({focusGroupIndex:b.focusGroupIndex,focusNextGroup:b.focusNextGroup,focusPrevGroup:b.focusPrevGroup}),[b]),p=l.useMemo(()=>({state:v,dispatch:x,actions:b}),[v,x,b]);return f.jsx(wt.Provider,{value:p,children:f.jsx(Ie,{value:w,children:f.jsx(we,{value:g,children:f.jsx(Te,{value:I,children:a})})})})},je=()=>{const{actions:t}=Y();return l.useMemo(()=>({splitFocused:e=>{t.splitFocused(e)},focusGroupIndex:e=>{t.focusGroupIndex(e)},focusNextGroup:()=>{t.focusNextGroup()},focusPrevGroup:()=>{t.focusPrevGroup()},closeFocusedGroup:()=>{}}),[t])},Ae=()=>{const{actions:t}=Y(),e=l.useCallback(({fromGroupId:n,tabId:o,targetGroupId:s,zone:a})=>{t.contentDrop({fromGroupId:n,tabId:o,targetGroupId:s,zone:a})},[t]),r=l.useCallback(({fromGroupId:n,tabId:o,targetGroupId:s,targetIndex:a})=>{t.tabDrop({fromGroupId:n,tabId:o,targetGroupId:s,targetIndex:a})},[t]);return{onCommitContentDrop:e,onCommitTabDrop:r}},_e=()=>{const t=Pt(),e=je();return l.useEffect(()=>{jt(t,e)},[t,e]),null},ke=({children:t,emptyContentComponent:e,doubleClickToAdd:r})=>{const n=U(),{state:o,actions:s}=Y(),a=l.useCallback(()=>l.createElement("div",{style:{color:"#888",fontSize:12,padding:12}},"No tabs"),[]),i=e??a,c=l.useCallback(b=>{const w=o.groups[b];if(!w)return null;const g=w.tabIds.map(I=>o.panels[I]).filter(Boolean);return{...w,tabs:g}},[o.groups,o.panels]),u=l.useCallback(b=>{const w=o.groups[b];if(!w)return f.jsx(i,{});const g=w.activeTabId;if(!g)return f.jsx(i,{});const I=o.panels[g];return I?I.render():f.jsx(i,{})},[o.groups,o.panels,i]),d=l.useCallback((b,w)=>{s.setActiveTab(b,w)},[s]),h=l.useCallback(b=>{s.addNewTab({groupId:b,title:"New Tab",makeActive:!0})},[s]),v=l.useCallback((b,w)=>{s.removeTab(b,w)},[s]),y=l.useCallback((b,w,g)=>{s.setActiveTab(w,b),n.onStartTabDrag(b,w,g)},[s,n]),m=l.useCallback((b,w)=>{const g=o.groups[b];!g||!g.activeTabId||n.onStartContentDrag(b,g.activeTabId,w)},[o.groups,n]),x=l.useMemo(()=>({getGroup:c,getGroupContent:u,onClickTab:d,onAddTab:h,onCloseTab:v,onStartTabDrag:y,onStartContentDrag:m,doubleClickToAdd:r}),[c,u,d,h,v,y,m,r]);return f.jsx(Mt,{value:x,children:t})},z=(t,e,r,n)=>{if(O(t))return n;const o=t.direction,s=o==="vertical"?r.x+r.w*t.ratio:r.y+r.h*t.ratio;if(n.push({path:e,direction:o,parentRect:r,linePos:s}),o==="vertical"){const c=r.w*t.ratio,u=r.w-c;return z(t.a,[...e,"a"],{x:r.x,y:r.y,w:c,h:r.h},n),z(t.b,[...e,"b"],{x:r.x+c,y:r.y,w:u,h:r.h},n),n}const a=r.h*t.ratio,i=r.h-a;return z(t.a,[...e,"a"],{x:r.x,y:r.y,w:r.w,h:a},n),z(t.b,[...e,"b"],{x:r.x,y:r.y+a,w:r.w,h:i},n),n},Oe=({containerRef:t})=>{const{state:e}=Y(),{adjustSplitRatio:r}=xe(),n=l.useMemo(()=>z(e.tree,[],{x:0,y:0,w:100,h:100},[]),[e.tree]),[o,s]=l.useState(null);if(l.useLayoutEffect(()=>{const i=t.current;if(!i)return;const c=()=>{const y=i.getBoundingClientRect();s({left:y.left,top:y.top,width:y.width,height:y.height})};c();function u(){try{const y=window.ResizeObserver;return typeof y=="function"?y:null}catch{return null}}const d=u(),h=d?new d(()=>c()):null;h&&h.observe(i);const v=()=>c();return window.addEventListener("scroll",v,!0),()=>{window.removeEventListener("scroll",v,!0),h&&h.disconnect()}},[t,e.tree]),!o)return null;const a=(i,c)=>{const u={left:o.left+o.width*i.parentRect.x/100,top:o.top+o.height*i.parentRect.y/100,width:o.width*i.parentRect.w/100,height:o.height*i.parentRect.h/100},d=C.SPLIT_HANDLE_THICKNESS;if(i.direction==="vertical"){const m=u.left+u.width*(i.linePos-i.parentRect.x)/i.parentRect.w,x={position:"fixed",left:`calc(${Math.round(m)}px - ${d} / 2)`,top:Math.round(u.top),width:d,height:Math.round(u.height),cursor:"col-resize",pointerEvents:"auto"},b=w=>{const g=o.width*i.parentRect.w/100,I=g===0?0:w/g;r({path:i.path,deltaRatio:I})};return f.jsx("div",{style:x,children:f.jsx(G.ResizeHandle,{direction:"vertical",onResize:b})},`split-${c}`)}const h=u.top+u.height*(i.linePos-i.parentRect.y)/i.parentRect.h,v={position:"fixed",left:Math.round(u.left),top:`calc(${Math.round(h)}px - ${d} / 2)`,width:Math.round(u.width),height:d,cursor:"row-resize",pointerEvents:"auto"},y=m=>{const x=o.height*i.parentRect.h/100,b=x===0?0:m/x;r({path:i.path,deltaRatio:b})};return f.jsx("div",{style:v,children:f.jsx(G.ResizeHandle,{direction:"horizontal",onResize:y})},`split-${c}`)};return f.jsx("div",{style:{position:"fixed",inset:0,pointerEvents:"none"},children:n.map((i,c)=>a(i,c))})},Me={position:"relative",display:"flex",width:"100%",height:"100%"},Ne=({state:t,layoutMode:e,gridTracksInteractive:r,view:n,tabBarComponent:o,panelGroupComponent:s})=>{const a=c=>{if(n){const u=n;return f.jsx(u,{groupId:c})}return f.jsx(Zt,{id:c,TabBarComponent:o,PanelGroupComponent:s})};if(e==="grid"){const c=kt(t,a,!!r);return f.jsx(G.GridLayout,{config:c.config,layers:c.layers})}const i=_t(t,a);return f.jsx(G.GridLayout,{config:i.config,layers:i.layers})},Le=({containerRef:t,layoutMode:e,gridTracksInteractive:r,dragThresholdPx:n,view:o,style:s,className:a,tabBarComponent:i,panelGroupComponent:c,splitLimits:u,emptyContentComponent:d,doubleClickToAdd:h})=>{const{state:v}=Y(),{onCommitContentDrop:y,onCommitTabDrop:m}=Ae(),x=l.useMemo(()=>({...Me,...s}),[s]),b=l.useCallback(({targetGroupId:w,zone:g})=>{if(g==="center")return!0;const I=g==="left"||g==="right"?"vertical":"horizontal";return tt(v.tree,w,I,u)},[v.tree,u]);return f.jsx(Nt,{children:f.jsxs(Vt,{containerRef:t,dragThresholdPx:n,onCommitContentDrop:y,onCommitTabDrop:m,isContentZoneAllowed:b,children:[f.jsx(ke,{emptyContentComponent:d,doubleClickToAdd:h,children:f.jsx("div",{ref:t,className:a,style:x,children:f.jsx(Ne,{state:v,layoutMode:e,gridTracksInteractive:r,view:o,tabBarComponent:i,panelGroupComponent:c})})}),f.jsx(Oe,{containerRef:t}),f.jsx(Be,{})]})})},Be=()=>{const t=U();return f.jsxs(f.Fragment,{children:[f.jsx(oe,{suggest:t.suggest}),f.jsx(ue,{})]})},He=({initialState:t,createGroupId:e,createPanelId:r,layoutMode:n,gridTracksInteractive:o,dragThresholdPx:s,view:a,emptyContentComponent:i,state:c,onStateChange:u,className:d,style:h,tabBarComponent:v,panelGroupComponent:y,splitLimits:m,doubleClickToAdd:x})=>{if(!t)throw new Error("PanelSystem requires initialState.");if(!e)throw new Error("PanelSystem requires explicit createGroupId function.");if(!n)throw new Error("PanelSystem requires explicit layoutMode ('absolute' | 'grid').");if(n==="grid"&&o===void 0)throw new Error("PanelSystem(layoutMode='grid') requires explicit 'gridTracksInteractive' flag.");if(s===void 0)throw new Error("PanelSystem requires explicit 'dragThresholdPx' value.");const b=l.useRef(null),w=l.useMemo(()=>It(m),[m]);return f.jsx(De,{initialState:t,createGroupId:e,createPanelId:r,state:c,onStateChange:u,splitLimits:m,children:f.jsxs(Dt,{children:[f.jsx(_e,{}),f.jsx(Le,{containerRef:b,layoutMode:n,gridTracksInteractive:o,dragThresholdPx:s,view:a,style:h,className:d,tabBarComponent:v,panelGroupComponent:y,splitLimits:w,emptyContentComponent:i,doubleClickToAdd:x})]})})};exports.Drawer=G.Drawer;exports.DrawerLayers=G.DrawerLayers;exports.GridLayout=G.GridLayout;exports.ResizeHandle=G.ResizeHandle;exports.runTransition=G.runTransition;exports.useTransitionState=G.useTransitionState;exports.CSS_VAR_PREFIX=C.CSS_VAR_PREFIX;exports.HorizontalDivider=Et;exports.PanelSystem=He;exports.buildInitialState=me;exports.useLayerDragHandle=Rt;
3
3
  //# sourceMappingURL=index.cjs.map