@zag-js/splitter 1.38.2 → 1.39.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.
Files changed (52) hide show
  1. package/dist/chunk-QZ7TP4HQ.mjs +7 -0
  2. package/dist/index.d.mts +1 -0
  3. package/dist/index.d.ts +1 -0
  4. package/dist/index.js +4 -1
  5. package/dist/index.mjs +5 -1
  6. package/dist/splitter.anatomy.mjs +2 -0
  7. package/dist/splitter.connect.d.mts +1 -0
  8. package/dist/splitter.connect.d.ts +1 -0
  9. package/dist/splitter.connect.js +7 -3
  10. package/dist/splitter.connect.mjs +9 -3
  11. package/dist/splitter.dom.d.mts +1 -0
  12. package/dist/splitter.dom.d.ts +1 -0
  13. package/dist/splitter.dom.mjs +2 -0
  14. package/dist/splitter.machine.d.mts +1 -0
  15. package/dist/splitter.machine.d.ts +1 -0
  16. package/dist/splitter.machine.js +53 -0
  17. package/dist/splitter.machine.mjs +56 -1
  18. package/dist/splitter.props.d.mts +1 -0
  19. package/dist/splitter.props.d.ts +1 -0
  20. package/dist/splitter.props.js +2 -1
  21. package/dist/splitter.props.mjs +4 -1
  22. package/dist/splitter.types.d.mts +6 -0
  23. package/dist/splitter.types.d.ts +6 -0
  24. package/dist/utils/aria.d.mts +1 -0
  25. package/dist/utils/aria.d.ts +1 -0
  26. package/dist/utils/aria.mjs +2 -0
  27. package/dist/utils/fuzzy.mjs +2 -0
  28. package/dist/utils/intersects.d.mts +6 -0
  29. package/dist/utils/intersects.d.ts +6 -0
  30. package/dist/utils/intersects.js +40 -0
  31. package/dist/utils/intersects.mjs +16 -0
  32. package/dist/utils/panel.d.mts +1 -0
  33. package/dist/utils/panel.d.ts +1 -0
  34. package/dist/utils/panel.mjs +2 -0
  35. package/dist/utils/registry.d.mts +64 -0
  36. package/dist/utils/registry.d.ts +64 -0
  37. package/dist/utils/registry.js +206 -0
  38. package/dist/utils/registry.mjs +182 -0
  39. package/dist/utils/resize-by-delta.d.mts +1 -0
  40. package/dist/utils/resize-by-delta.d.ts +1 -0
  41. package/dist/utils/resize-by-delta.mjs +2 -0
  42. package/dist/utils/resize-panel.d.mts +1 -0
  43. package/dist/utils/resize-panel.d.ts +1 -0
  44. package/dist/utils/resize-panel.mjs +2 -0
  45. package/dist/utils/stacking-order.d.mts +9 -0
  46. package/dist/utils/stacking-order.d.ts +9 -0
  47. package/dist/utils/stacking-order.js +99 -0
  48. package/dist/utils/stacking-order.mjs +76 -0
  49. package/dist/utils/validate-sizes.d.mts +1 -0
  50. package/dist/utils/validate-sizes.d.ts +1 -0
  51. package/dist/utils/validate-sizes.mjs +2 -0
  52. package/package.json +6 -6
@@ -0,0 +1,7 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
+ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
4
+
5
+ export {
6
+ __publicField
7
+ };
package/dist/index.d.mts CHANGED
@@ -4,6 +4,7 @@ export { machine } from './splitter.machine.mjs';
4
4
  export { panelProps, props, resizeTriggerProps, splitPanelProps, splitProps, splitResizeTriggerProps } from './splitter.props.mjs';
5
5
  export { SplitterApi as Api, CursorState, DragState, ElementIds, ExpandCollapseDetails, SplitterItem as Item, KeyboardState, SplitterMachine as Machine, PanelData, PanelId, PanelItem, PanelProps, SplitterProps as Props, ResizeDetails, ResizeEndDetails, ResizeEvent, ResizeTriggerId, ResizeTriggerItem, ResizeTriggerProps, ResizeTriggerState, SplitterService as Service } from './splitter.types.mjs';
6
6
  export { getPanelLayout as layout } from './utils/panel.mjs';
7
+ export { HitAreaMargins, SplitterRegistry, SplitterRegistryOptions, registry } from './utils/registry.mjs';
7
8
  import '@zag-js/anatomy';
8
9
  import '@zag-js/types';
9
10
  import '@zag-js/core';
package/dist/index.d.ts CHANGED
@@ -4,6 +4,7 @@ export { machine } from './splitter.machine.js';
4
4
  export { panelProps, props, resizeTriggerProps, splitPanelProps, splitProps, splitResizeTriggerProps } from './splitter.props.js';
5
5
  export { SplitterApi as Api, CursorState, DragState, ElementIds, ExpandCollapseDetails, SplitterItem as Item, KeyboardState, SplitterMachine as Machine, PanelData, PanelId, PanelItem, PanelProps, SplitterProps as Props, ResizeDetails, ResizeEndDetails, ResizeEvent, ResizeTriggerId, ResizeTriggerItem, ResizeTriggerProps, ResizeTriggerState, SplitterService as Service } from './splitter.types.js';
6
6
  export { getPanelLayout as layout } from './utils/panel.js';
7
+ export { HitAreaMargins, SplitterRegistry, SplitterRegistryOptions, registry } from './utils/registry.js';
7
8
  import '@zag-js/anatomy';
8
9
  import '@zag-js/types';
9
10
  import '@zag-js/core';
package/dist/index.js CHANGED
@@ -24,7 +24,8 @@ __export(index_exports, {
24
24
  anatomy: () => import_splitter.anatomy,
25
25
  connect: () => import_splitter2.connect,
26
26
  layout: () => import_panel.getPanelLayout,
27
- machine: () => import_splitter3.machine
27
+ machine: () => import_splitter3.machine,
28
+ registry: () => import_registry.registry
28
29
  });
29
30
  module.exports = __toCommonJS(index_exports);
30
31
  var import_splitter = require("./splitter.anatomy.js");
@@ -32,11 +33,13 @@ var import_splitter2 = require("./splitter.connect.js");
32
33
  var import_splitter3 = require("./splitter.machine.js");
33
34
  __reExport(index_exports, require("./splitter.props.js"), module.exports);
34
35
  var import_panel = require("./utils/panel.js");
36
+ var import_registry = require("./utils/registry.js");
35
37
  // Annotate the CommonJS export names for ESM import in node:
36
38
  0 && (module.exports = {
37
39
  anatomy,
38
40
  connect,
39
41
  layout,
40
42
  machine,
43
+ registry,
41
44
  ...require("./splitter.props.js")
42
45
  });
package/dist/index.mjs CHANGED
@@ -1,12 +1,16 @@
1
+ import "./chunk-QZ7TP4HQ.mjs";
2
+
1
3
  // src/index.ts
2
4
  import { anatomy } from "./splitter.anatomy.mjs";
3
5
  import { connect } from "./splitter.connect.mjs";
4
6
  import { machine } from "./splitter.machine.mjs";
5
7
  export * from "./splitter.props.mjs";
6
8
  import { getPanelLayout } from "./utils/panel.mjs";
9
+ import { registry } from "./utils/registry.mjs";
7
10
  export {
8
11
  anatomy,
9
12
  connect,
10
13
  getPanelLayout as layout,
11
- machine
14
+ machine,
15
+ registry
12
16
  };
@@ -1,3 +1,5 @@
1
+ import "./chunk-QZ7TP4HQ.mjs";
2
+
1
3
  // src/splitter.anatomy.ts
2
4
  import { createAnatomy } from "@zag-js/anatomy";
3
5
  var anatomy = createAnatomy("splitter").parts("root", "panel", "resizeTrigger", "resizeTriggerIndicator");
@@ -1,6 +1,7 @@
1
1
  import { PropTypes, NormalizeProps } from '@zag-js/types';
2
2
  import { SplitterService, SplitterApi } from './splitter.types.mjs';
3
3
  import '@zag-js/core';
4
+ import './utils/registry.mjs';
4
5
 
5
6
  declare function connect<T extends PropTypes>(service: SplitterService, normalize: NormalizeProps<T>): SplitterApi<T>;
6
7
 
@@ -1,6 +1,7 @@
1
1
  import { PropTypes, NormalizeProps } from '@zag-js/types';
2
2
  import { SplitterService, SplitterApi } from './splitter.types.js';
3
3
  import '@zag-js/core';
4
+ import './utils/registry.js';
4
5
 
5
6
  declare function connect<T extends PropTypes>(service: SplitterService, normalize: NormalizeProps<T>): SplitterApi<T>;
6
7
 
@@ -44,6 +44,7 @@ function connect(service, normalize) {
44
44
  const { state, send, prop, computed, context, scope } = service;
45
45
  const horizontal = computed("horizontal");
46
46
  const dragging = state.matches("dragging");
47
+ const registry = prop("registry");
47
48
  const orientation = prop("orientation");
48
49
  const getPanelStyle = (id) => {
49
50
  const panels = prop("panels");
@@ -203,7 +204,7 @@ function connect(service, normalize) {
203
204
  WebkitUserSelect: "none",
204
205
  flex: "0 0 auto",
205
206
  pointerEvents: triggerState.disabled ? "none" : triggerState.dragging && !triggerState.focused ? "none" : void 0,
206
- cursor: triggerState.disabled ? void 0 : horizontal ? "col-resize" : "row-resize",
207
+ cursor: triggerState.disabled || registry ? void 0 : horizontal ? "col-resize" : "row-resize",
207
208
  [horizontal ? "minHeight" : "minWidth"]: "0"
208
209
  },
209
210
  onPointerDown(event) {
@@ -212,6 +213,9 @@ function connect(service, normalize) {
212
213
  event.preventDefault();
213
214
  return;
214
215
  }
216
+ if (registry) {
217
+ return;
218
+ }
215
219
  const point = (0, import_dom_query.getEventPoint)(event);
216
220
  send({ type: "POINTER_DOWN", id, point });
217
221
  event.currentTarget.setPointerCapture(event.pointerId);
@@ -225,11 +229,11 @@ function connect(service, normalize) {
225
229
  }
226
230
  },
227
231
  onPointerOver() {
228
- if (triggerState.disabled) return;
232
+ if (triggerState.disabled || registry) return;
229
233
  send({ type: "POINTER_OVER", id });
230
234
  },
231
235
  onPointerLeave() {
232
- if (triggerState.disabled) return;
236
+ if (triggerState.disabled || registry) return;
233
237
  send({ type: "POINTER_LEAVE", id });
234
238
  },
235
239
  onBlur() {
@@ -1,3 +1,5 @@
1
+ import "./chunk-QZ7TP4HQ.mjs";
2
+
1
3
  // src/splitter.connect.ts
2
4
  import { dataAttr, getEventKey, getEventPoint, isLeftClick } from "@zag-js/dom-query";
3
5
  import { ensure } from "@zag-js/utils";
@@ -10,6 +12,7 @@ function connect(service, normalize) {
10
12
  const { state, send, prop, computed, context, scope } = service;
11
13
  const horizontal = computed("horizontal");
12
14
  const dragging = state.matches("dragging");
15
+ const registry = prop("registry");
13
16
  const orientation = prop("orientation");
14
17
  const getPanelStyle = (id) => {
15
18
  const panels = prop("panels");
@@ -169,7 +172,7 @@ function connect(service, normalize) {
169
172
  WebkitUserSelect: "none",
170
173
  flex: "0 0 auto",
171
174
  pointerEvents: triggerState.disabled ? "none" : triggerState.dragging && !triggerState.focused ? "none" : void 0,
172
- cursor: triggerState.disabled ? void 0 : horizontal ? "col-resize" : "row-resize",
175
+ cursor: triggerState.disabled || registry ? void 0 : horizontal ? "col-resize" : "row-resize",
173
176
  [horizontal ? "minHeight" : "minWidth"]: "0"
174
177
  },
175
178
  onPointerDown(event) {
@@ -178,6 +181,9 @@ function connect(service, normalize) {
178
181
  event.preventDefault();
179
182
  return;
180
183
  }
184
+ if (registry) {
185
+ return;
186
+ }
181
187
  const point = getEventPoint(event);
182
188
  send({ type: "POINTER_DOWN", id, point });
183
189
  event.currentTarget.setPointerCapture(event.pointerId);
@@ -191,11 +197,11 @@ function connect(service, normalize) {
191
197
  }
192
198
  },
193
199
  onPointerOver() {
194
- if (triggerState.disabled) return;
200
+ if (triggerState.disabled || registry) return;
195
201
  send({ type: "POINTER_OVER", id });
196
202
  },
197
203
  onPointerLeave() {
198
- if (triggerState.disabled) return;
204
+ if (triggerState.disabled || registry) return;
199
205
  send({ type: "POINTER_LEAVE", id });
200
206
  },
201
207
  onBlur() {
@@ -1,6 +1,7 @@
1
1
  import { Scope } from '@zag-js/core';
2
2
  import { CursorState } from './splitter.types.mjs';
3
3
  import '@zag-js/types';
4
+ import './utils/registry.mjs';
4
5
 
5
6
  declare const getRootId: (ctx: Scope) => any;
6
7
  declare const getResizeTriggerId: (ctx: Scope, id: string) => any;
@@ -1,6 +1,7 @@
1
1
  import { Scope } from '@zag-js/core';
2
2
  import { CursorState } from './splitter.types.js';
3
3
  import '@zag-js/types';
4
+ import './utils/registry.js';
4
5
 
5
6
  declare const getRootId: (ctx: Scope) => any;
6
7
  declare const getResizeTriggerId: (ctx: Scope, id: string) => any;
@@ -1,3 +1,5 @@
1
+ import "./chunk-QZ7TP4HQ.mjs";
2
+
1
3
  // src/splitter.dom.ts
2
4
  import { queryAll } from "@zag-js/dom-query";
3
5
  var getRootId = (ctx) => ctx.ids?.root ?? `splitter:${ctx.id}`;
@@ -1,6 +1,7 @@
1
1
  import * as _zag_js_core from '@zag-js/core';
2
2
  import { SplitterSchema } from './splitter.types.mjs';
3
3
  import '@zag-js/types';
4
+ import './utils/registry.mjs';
4
5
 
5
6
  declare const machine: _zag_js_core.Machine<SplitterSchema>;
6
7
 
@@ -1,6 +1,7 @@
1
1
  import * as _zag_js_core from '@zag-js/core';
2
2
  import { SplitterSchema } from './splitter.types.js';
3
3
  import '@zag-js/types';
4
+ import './utils/registry.js';
4
5
 
5
6
  declare const machine: _zag_js_core.Machine<SplitterSchema>;
6
7
 
@@ -120,6 +120,7 @@ var machine = (0, import_core.createMachine)({
120
120
  },
121
121
  entry: ["syncSize"],
122
122
  exit: ["clearGlobalCursor"],
123
+ effects: ["trackResizeHandles"],
123
124
  states: {
124
125
  idle: {
125
126
  entry: ["clearDraggingState", "clearKeyboardState"],
@@ -203,6 +204,37 @@ var machine = (0, import_core.createMachine)({
203
204
  },
204
205
  implementations: {
205
206
  effects: {
207
+ trackResizeHandles: ({ prop, scope, send }) => {
208
+ const registry = prop("registry");
209
+ if (!registry) return;
210
+ let cleanups = [];
211
+ const exec = () => {
212
+ cleanups.forEach((fn) => fn());
213
+ cleanups = dom.getResizeTriggerEls(scope).map((resizeTriggerEl) => {
214
+ const id = resizeTriggerEl.dataset.id;
215
+ if (!id) return;
216
+ return registry.register({
217
+ id: dom.getResizeTriggerId(scope, id),
218
+ element: resizeTriggerEl,
219
+ orientation: prop("orientation"),
220
+ onActivate(point) {
221
+ send({ type: "POINTER_DOWN", id, point });
222
+ },
223
+ onDeactivate() {
224
+ send({ type: "POINTER_UP" });
225
+ }
226
+ });
227
+ }).filter(Boolean);
228
+ };
229
+ exec();
230
+ const observeCleanup = (0, import_dom_query.observeChildren)(dom.getRootEl(scope), {
231
+ callback: exec
232
+ });
233
+ return () => {
234
+ cleanups.forEach((fn) => fn());
235
+ observeCleanup?.();
236
+ };
237
+ },
206
238
  waitForHoverDelay: ({ send }) => {
207
239
  return (0, import_utils.setRafTimeout)(() => {
208
240
  send({ type: "HOVER_DELAY" });
@@ -452,6 +484,8 @@ var machine = (0, import_core.createMachine)({
452
484
  }
453
485
  },
454
486
  setGlobalCursor({ context, scope, prop }) {
487
+ const registry = prop("registry");
488
+ if (registry) return;
455
489
  const dragState = context.get("dragState");
456
490
  if (!dragState) return;
457
491
  const panels = prop("panels");
@@ -483,7 +517,17 @@ function setSize(params, sizes) {
483
517
  const panelsArray = prop("panels");
484
518
  const onCollapse = prop("onCollapse");
485
519
  const onExpand = prop("onExpand");
520
+ const onResizeStart = prop("onResizeStart");
521
+ const onResizeEnd = prop("onResizeEnd");
486
522
  const panelIdToLastNotifiedSizeMap = refs.get("panelIdToLastNotifiedSizeMap");
523
+ const dragState = context.get("dragState");
524
+ const keyboardState = context.get("keyboardState");
525
+ const isProgrammatic = dragState === null && keyboardState === null;
526
+ if (isProgrammatic && onResizeStart) {
527
+ queueMicrotask(() => {
528
+ onResizeStart();
529
+ });
530
+ }
487
531
  context.set("size", sizes);
488
532
  sizes.forEach((size, index) => {
489
533
  const panelData = panelsArray[index];
@@ -502,6 +546,15 @@ function setSize(params, sizes) {
502
546
  }
503
547
  }
504
548
  });
549
+ if (isProgrammatic && onResizeEnd) {
550
+ queueMicrotask(() => {
551
+ onResizeEnd({
552
+ size: sizes,
553
+ resizeTriggerId: null
554
+ // Programmatic changes don't have a resize trigger
555
+ });
556
+ });
557
+ }
505
558
  }
506
559
  // Annotate the CommonJS export names for ESM import in node:
507
560
  0 && (module.exports = {
@@ -1,6 +1,8 @@
1
+ import "./chunk-QZ7TP4HQ.mjs";
2
+
1
3
  // src/splitter.machine.ts
2
4
  import { createMachine } from "@zag-js/core";
3
- import { trackPointerMove } from "@zag-js/dom-query";
5
+ import { observeChildren, trackPointerMove } from "@zag-js/dom-query";
4
6
  import { ensure, ensureProps, isEqual, next, prev, setRafTimeout } from "@zag-js/utils";
5
7
  import * as dom from "./splitter.dom.mjs";
6
8
  import { getAriaValue } from "./utils/aria.mjs";
@@ -94,6 +96,7 @@ var machine = createMachine({
94
96
  },
95
97
  entry: ["syncSize"],
96
98
  exit: ["clearGlobalCursor"],
99
+ effects: ["trackResizeHandles"],
97
100
  states: {
98
101
  idle: {
99
102
  entry: ["clearDraggingState", "clearKeyboardState"],
@@ -177,6 +180,37 @@ var machine = createMachine({
177
180
  },
178
181
  implementations: {
179
182
  effects: {
183
+ trackResizeHandles: ({ prop, scope, send }) => {
184
+ const registry = prop("registry");
185
+ if (!registry) return;
186
+ let cleanups = [];
187
+ const exec = () => {
188
+ cleanups.forEach((fn) => fn());
189
+ cleanups = dom.getResizeTriggerEls(scope).map((resizeTriggerEl) => {
190
+ const id = resizeTriggerEl.dataset.id;
191
+ if (!id) return;
192
+ return registry.register({
193
+ id: dom.getResizeTriggerId(scope, id),
194
+ element: resizeTriggerEl,
195
+ orientation: prop("orientation"),
196
+ onActivate(point) {
197
+ send({ type: "POINTER_DOWN", id, point });
198
+ },
199
+ onDeactivate() {
200
+ send({ type: "POINTER_UP" });
201
+ }
202
+ });
203
+ }).filter(Boolean);
204
+ };
205
+ exec();
206
+ const observeCleanup = observeChildren(dom.getRootEl(scope), {
207
+ callback: exec
208
+ });
209
+ return () => {
210
+ cleanups.forEach((fn) => fn());
211
+ observeCleanup?.();
212
+ };
213
+ },
180
214
  waitForHoverDelay: ({ send }) => {
181
215
  return setRafTimeout(() => {
182
216
  send({ type: "HOVER_DELAY" });
@@ -426,6 +460,8 @@ var machine = createMachine({
426
460
  }
427
461
  },
428
462
  setGlobalCursor({ context, scope, prop }) {
463
+ const registry = prop("registry");
464
+ if (registry) return;
429
465
  const dragState = context.get("dragState");
430
466
  if (!dragState) return;
431
467
  const panels = prop("panels");
@@ -457,7 +493,17 @@ function setSize(params, sizes) {
457
493
  const panelsArray = prop("panels");
458
494
  const onCollapse = prop("onCollapse");
459
495
  const onExpand = prop("onExpand");
496
+ const onResizeStart = prop("onResizeStart");
497
+ const onResizeEnd = prop("onResizeEnd");
460
498
  const panelIdToLastNotifiedSizeMap = refs.get("panelIdToLastNotifiedSizeMap");
499
+ const dragState = context.get("dragState");
500
+ const keyboardState = context.get("keyboardState");
501
+ const isProgrammatic = dragState === null && keyboardState === null;
502
+ if (isProgrammatic && onResizeStart) {
503
+ queueMicrotask(() => {
504
+ onResizeStart();
505
+ });
506
+ }
461
507
  context.set("size", sizes);
462
508
  sizes.forEach((size, index) => {
463
509
  const panelData = panelsArray[index];
@@ -476,6 +522,15 @@ function setSize(params, sizes) {
476
522
  }
477
523
  }
478
524
  });
525
+ if (isProgrammatic && onResizeEnd) {
526
+ queueMicrotask(() => {
527
+ onResizeEnd({
528
+ size: sizes,
529
+ resizeTriggerId: null
530
+ // Programmatic changes don't have a resize trigger
531
+ });
532
+ });
533
+ }
479
534
  }
480
535
  export {
481
536
  machine
@@ -1,6 +1,7 @@
1
1
  import { SplitterProps, ResizeTriggerProps, PanelProps } from './splitter.types.mjs';
2
2
  import '@zag-js/core';
3
3
  import '@zag-js/types';
4
+ import './utils/registry.mjs';
4
5
 
5
6
  declare const props: (keyof SplitterProps)[];
6
7
  declare const splitProps: <Props extends Partial<SplitterProps>>(props: Props) => [Partial<SplitterProps>, Omit<Props, keyof SplitterProps>];
@@ -1,6 +1,7 @@
1
1
  import { SplitterProps, ResizeTriggerProps, PanelProps } from './splitter.types.js';
2
2
  import '@zag-js/core';
3
3
  import '@zag-js/types';
4
+ import './utils/registry.js';
4
5
 
5
6
  declare const props: (keyof SplitterProps)[];
6
7
  declare const splitProps: <Props extends Partial<SplitterProps>>(props: Props) => [Partial<SplitterProps>, Omit<Props, keyof SplitterProps>];
@@ -45,7 +45,8 @@ var props = (0, import_types.createProps)()([
45
45
  "defaultSize",
46
46
  "panels",
47
47
  "keyboardResizeBy",
48
- "nonce"
48
+ "nonce",
49
+ "registry"
49
50
  ]);
50
51
  var splitProps = (0, import_utils.createSplitProps)(props);
51
52
  var panelProps = (0, import_types.createProps)()(["id"]);
@@ -1,3 +1,5 @@
1
+ import "./chunk-QZ7TP4HQ.mjs";
2
+
1
3
  // src/splitter.props.ts
2
4
  import { createProps } from "@zag-js/types";
3
5
  import { createSplitProps } from "@zag-js/utils";
@@ -16,7 +18,8 @@ var props = createProps()([
16
18
  "defaultSize",
17
19
  "panels",
18
20
  "keyboardResizeBy",
19
- "nonce"
21
+ "nonce",
22
+ "registry"
20
23
  ]);
21
24
  var splitProps = createSplitProps(props);
22
25
  var panelProps = createProps()(["id"]);
@@ -1,5 +1,6 @@
1
1
  import { Machine, EventObject, Service } from '@zag-js/core';
2
2
  import { PropTypes, RequiredBy, DirectionProperty, CommonProperties } from '@zag-js/types';
3
+ import { SplitterRegistry } from './utils/registry.mjs';
3
4
 
4
5
  type ResizeEvent = PointerEvent | KeyboardEvent;
5
6
  type PanelId = string;
@@ -105,6 +106,11 @@ interface SplitterProps extends DirectionProperty, CommonProperties {
105
106
  * Function called when a panel is expanded.
106
107
  */
107
108
  onExpand?: ((details: ExpandCollapseDetails) => void) | undefined;
109
+ /**
110
+ * The splitter registry to use for multi-drag support.
111
+ * When provided, enables dragging at the intersection of multiple splitters.
112
+ */
113
+ registry?: SplitterRegistry | undefined;
108
114
  }
109
115
  type PropsWithDefault = "orientation" | "panels";
110
116
  interface DragState {
@@ -1,5 +1,6 @@
1
1
  import { Machine, EventObject, Service } from '@zag-js/core';
2
2
  import { PropTypes, RequiredBy, DirectionProperty, CommonProperties } from '@zag-js/types';
3
+ import { SplitterRegistry } from './utils/registry.js';
3
4
 
4
5
  type ResizeEvent = PointerEvent | KeyboardEvent;
5
6
  type PanelId = string;
@@ -105,6 +106,11 @@ interface SplitterProps extends DirectionProperty, CommonProperties {
105
106
  * Function called when a panel is expanded.
106
107
  */
107
108
  onExpand?: ((details: ExpandCollapseDetails) => void) | undefined;
109
+ /**
110
+ * The splitter registry to use for multi-drag support.
111
+ * When provided, enables dragging at the intersection of multiple splitters.
112
+ */
113
+ registry?: SplitterRegistry | undefined;
108
114
  }
109
115
  type PropsWithDefault = "orientation" | "panels";
110
116
  interface DragState {
@@ -1,6 +1,7 @@
1
1
  import { PanelData } from '../splitter.types.mjs';
2
2
  import '@zag-js/core';
3
3
  import '@zag-js/types';
4
+ import './registry.mjs';
4
5
 
5
6
  /**
6
7
  * This code was modified from react-resizable-panels by Brian Vaughn
@@ -1,6 +1,7 @@
1
1
  import { PanelData } from '../splitter.types.js';
2
2
  import '@zag-js/core';
3
3
  import '@zag-js/types';
4
+ import './registry.js';
4
5
 
5
6
  /**
6
7
  * This code was modified from react-resizable-panels by Brian Vaughn
@@ -1,3 +1,5 @@
1
+ import "../chunk-QZ7TP4HQ.mjs";
2
+
1
3
  // src/utils/aria.ts
2
4
  import { ensure } from "@zag-js/utils";
3
5
  function calculateAriaValues({
@@ -1,3 +1,5 @@
1
+ import "../chunk-QZ7TP4HQ.mjs";
2
+
1
3
  // src/utils/fuzzy.ts
2
4
  var PRECISION = 10;
3
5
  function fuzzyCompareNumbers(actual, expected, fractionDigits = PRECISION) {
@@ -0,0 +1,6 @@
1
+ import { Rect } from '@zag-js/types';
2
+
3
+ declare function intersects(r1: Rect, r2: Rect, strict?: boolean): boolean;
4
+ declare function toRect(r: DOMRect): Rect;
5
+
6
+ export { intersects, toRect };
@@ -0,0 +1,6 @@
1
+ import { Rect } from '@zag-js/types';
2
+
3
+ declare function intersects(r1: Rect, r2: Rect, strict?: boolean): boolean;
4
+ declare function toRect(r: DOMRect): Rect;
5
+
6
+ export { intersects, toRect };
@@ -0,0 +1,40 @@
1
+ "use strict";
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
6
+ var __export = (target, all) => {
7
+ for (var name in all)
8
+ __defProp(target, name, { get: all[name], enumerable: true });
9
+ };
10
+ var __copyProps = (to, from, except, desc) => {
11
+ if (from && typeof from === "object" || typeof from === "function") {
12
+ for (let key of __getOwnPropNames(from))
13
+ if (!__hasOwnProp.call(to, key) && key !== except)
14
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
+ }
16
+ return to;
17
+ };
18
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
+
20
+ // src/utils/intersects.ts
21
+ var intersects_exports = {};
22
+ __export(intersects_exports, {
23
+ intersects: () => intersects,
24
+ toRect: () => toRect
25
+ });
26
+ module.exports = __toCommonJS(intersects_exports);
27
+ function intersects(r1, r2, strict = false) {
28
+ if (strict) {
29
+ return r1.x < r2.x + r2.width && r1.x + r1.width > r2.x && r1.y < r2.y + r2.height && r1.y + r1.height > r2.y;
30
+ }
31
+ return r1.x <= r2.x + r2.width && r1.x + r1.width >= r2.x && r1.y <= r2.y + r2.height && r1.y + r1.height >= r2.y;
32
+ }
33
+ function toRect(r) {
34
+ return { x: r.x, y: r.y, width: r.width, height: r.height };
35
+ }
36
+ // Annotate the CommonJS export names for ESM import in node:
37
+ 0 && (module.exports = {
38
+ intersects,
39
+ toRect
40
+ });
@@ -0,0 +1,16 @@
1
+ import "../chunk-QZ7TP4HQ.mjs";
2
+
3
+ // src/utils/intersects.ts
4
+ function intersects(r1, r2, strict = false) {
5
+ if (strict) {
6
+ return r1.x < r2.x + r2.width && r1.x + r1.width > r2.x && r1.y < r2.y + r2.height && r1.y + r1.height > r2.y;
7
+ }
8
+ return r1.x <= r2.x + r2.width && r1.x + r1.width >= r2.x && r1.y <= r2.y + r2.height && r1.y + r1.height >= r2.y;
9
+ }
10
+ function toRect(r) {
11
+ return { x: r.x, y: r.y, width: r.width, height: r.height };
12
+ }
13
+ export {
14
+ intersects,
15
+ toRect
16
+ };
@@ -1,6 +1,7 @@
1
1
  import { Style } from '@zag-js/types';
2
2
  import { PanelData, DragState, PanelId } from '../splitter.types.mjs';
3
3
  import '@zag-js/core';
4
+ import './registry.mjs';
4
5
 
5
6
  declare function getPanelById(panels: PanelData[], id: string): PanelData;
6
7
  declare function findPanelDataIndex(panels: PanelData[], panel: PanelData): number;
@@ -1,6 +1,7 @@
1
1
  import { Style } from '@zag-js/types';
2
2
  import { PanelData, DragState, PanelId } from '../splitter.types.js';
3
3
  import '@zag-js/core';
4
+ import './registry.js';
4
5
 
5
6
  declare function getPanelById(panels: PanelData[], id: string): PanelData;
6
7
  declare function findPanelDataIndex(panels: PanelData[], panel: PanelData): number;
@@ -1,3 +1,5 @@
1
+ import "../chunk-QZ7TP4HQ.mjs";
2
+
1
3
  // src/utils/panel.ts
2
4
  import { ensure } from "@zag-js/utils";
3
5
  function getPanelById(panels, id) {