@zag-js/splitter 0.2.9 → 0.2.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{chunk-XJ6FQC7X.mjs → chunk-EABXMZ6N.mjs} +18 -31
- package/dist/{chunk-WQJZVDKY.mjs → chunk-HPRMFGOY.mjs} +0 -0
- package/dist/{chunk-7TPJAZGM.mjs → chunk-JYQICU6Y.mjs} +6 -7
- package/dist/{chunk-M4IKJCRG.mjs → chunk-MV44GBQY.mjs} +3 -5
- package/dist/{chunk-GNH7KU6J.mjs → chunk-QY3R66FZ.mjs} +7 -17
- package/dist/index.js +29 -55
- package/dist/index.mjs +5 -5
- package/dist/splitter.anatomy.mjs +1 -1
- package/dist/splitter.connect.js +11 -23
- package/dist/splitter.connect.mjs +4 -4
- package/dist/splitter.dom.js +7 -17
- package/dist/splitter.dom.mjs +1 -1
- package/dist/splitter.machine.js +26 -51
- package/dist/splitter.machine.mjs +3 -3
- package/dist/splitter.types.d.ts +1 -1
- package/dist/splitter.utils.js +3 -5
- package/dist/splitter.utils.mjs +1 -1
- package/package.json +7 -7
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import {
|
|
2
2
|
dom
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-QY3R66FZ.mjs";
|
|
4
4
|
import {
|
|
5
5
|
clamp,
|
|
6
6
|
getHandleBounds,
|
|
7
7
|
getHandlePanels,
|
|
8
8
|
getNormalizedPanels,
|
|
9
9
|
getPanelBounds
|
|
10
|
-
} from "./chunk-
|
|
10
|
+
} from "./chunk-MV44GBQY.mjs";
|
|
11
11
|
|
|
12
12
|
// src/splitter.machine.ts
|
|
13
13
|
import { createMachine } from "@zag-js/core";
|
|
@@ -15,11 +15,11 @@ import { createMachine } from "@zag-js/core";
|
|
|
15
15
|
// ../../utilities/core/src/functions.ts
|
|
16
16
|
var runIfFn = (v, ...a) => {
|
|
17
17
|
const res = typeof v === "function" ? v(...a) : v;
|
|
18
|
-
return res
|
|
18
|
+
return res ?? void 0;
|
|
19
19
|
};
|
|
20
20
|
var callAll = (...fns) => (...a) => {
|
|
21
21
|
fns.forEach(function(fn) {
|
|
22
|
-
fn
|
|
22
|
+
fn?.(...a);
|
|
23
23
|
});
|
|
24
24
|
};
|
|
25
25
|
|
|
@@ -40,9 +40,8 @@ function compact(obj) {
|
|
|
40
40
|
// ../../utilities/dom/src/platform.ts
|
|
41
41
|
var isDom = () => typeof window !== "undefined";
|
|
42
42
|
function getPlatform() {
|
|
43
|
-
var _a;
|
|
44
43
|
const agent = navigator.userAgentData;
|
|
45
|
-
return
|
|
44
|
+
return agent?.platform ?? navigator.platform;
|
|
46
45
|
}
|
|
47
46
|
var pt = (v) => isDom() && v.test(getPlatform());
|
|
48
47
|
var isTouchDevice = () => isDom() && !!navigator.maxTouchPoints;
|
|
@@ -120,14 +119,13 @@ function extractInfo(event, type = "page") {
|
|
|
120
119
|
}
|
|
121
120
|
function addDomEvent(target, eventName, handler, options) {
|
|
122
121
|
const node = isRef(target) ? target.current : runIfFn(target);
|
|
123
|
-
node
|
|
122
|
+
node?.addEventListener(eventName, handler, options);
|
|
124
123
|
return () => {
|
|
125
|
-
node
|
|
124
|
+
node?.removeEventListener(eventName, handler, options);
|
|
126
125
|
};
|
|
127
126
|
}
|
|
128
127
|
function addPointerEvent(target, event, listener, options) {
|
|
129
|
-
|
|
130
|
-
const type = (_a = getEventName(event)) != null ? _a : event;
|
|
128
|
+
const type = getEventName(event) ?? event;
|
|
131
129
|
return addDomEvent(target, type, wrapHandler(listener, event === "pointerdown"), options);
|
|
132
130
|
}
|
|
133
131
|
function wrapHandler(fn, filter = false) {
|
|
@@ -138,8 +136,7 @@ function wrapHandler(fn, filter = false) {
|
|
|
138
136
|
}
|
|
139
137
|
function filterPrimaryPointer(fn) {
|
|
140
138
|
return (event) => {
|
|
141
|
-
|
|
142
|
-
const win = (_a = event.view) != null ? _a : window;
|
|
139
|
+
const win = event.view ?? window;
|
|
143
140
|
const isMouseEvent2 = event instanceof win.MouseEvent;
|
|
144
141
|
const isPrimary = !isMouseEvent2 || isMouseEvent2 && event.button === 0;
|
|
145
142
|
if (isPrimary)
|
|
@@ -198,7 +195,7 @@ var state = "default";
|
|
|
198
195
|
var savedUserSelect = "";
|
|
199
196
|
var modifiedElementMap = /* @__PURE__ */ new WeakMap();
|
|
200
197
|
function disableTextSelection({ target, doc } = {}) {
|
|
201
|
-
const _document = doc
|
|
198
|
+
const _document = doc ?? document;
|
|
202
199
|
if (isIos()) {
|
|
203
200
|
if (state === "default") {
|
|
204
201
|
savedUserSelect = _document.documentElement.style.webkitUserSelect;
|
|
@@ -212,7 +209,7 @@ function disableTextSelection({ target, doc } = {}) {
|
|
|
212
209
|
return () => restoreTextSelection({ target, doc: _document });
|
|
213
210
|
}
|
|
214
211
|
function restoreTextSelection({ target, doc } = {}) {
|
|
215
|
-
const _document = doc
|
|
212
|
+
const _document = doc ?? document;
|
|
216
213
|
if (isIos()) {
|
|
217
214
|
if (state !== "disabled")
|
|
218
215
|
return;
|
|
@@ -232,7 +229,7 @@ function restoreTextSelection({ target, doc } = {}) {
|
|
|
232
229
|
if (target && modifiedElementMap.has(target)) {
|
|
233
230
|
let targetOldUserSelect = modifiedElementMap.get(target);
|
|
234
231
|
if (target.style.userSelect === "none") {
|
|
235
|
-
target.style.userSelect = targetOldUserSelect
|
|
232
|
+
target.style.userSelect = targetOldUserSelect ?? "";
|
|
236
233
|
}
|
|
237
234
|
if (target.getAttribute("style") === "") {
|
|
238
235
|
target.removeAttribute("style");
|
|
@@ -272,7 +269,7 @@ function machine(userContext) {
|
|
|
272
269
|
return createMachine(
|
|
273
270
|
{
|
|
274
271
|
id: "splitter",
|
|
275
|
-
initial: "
|
|
272
|
+
initial: "idle",
|
|
276
273
|
context: {
|
|
277
274
|
orientation: "horizontal",
|
|
278
275
|
activeResizeId: null,
|
|
@@ -311,11 +308,6 @@ function machine(userContext) {
|
|
|
311
308
|
]
|
|
312
309
|
},
|
|
313
310
|
states: {
|
|
314
|
-
unknown: {
|
|
315
|
-
on: {
|
|
316
|
-
SETUP: "idle"
|
|
317
|
-
}
|
|
318
|
-
},
|
|
319
311
|
idle: {
|
|
320
312
|
entry: ["clearActiveHandleId"],
|
|
321
313
|
on: {
|
|
@@ -440,16 +432,13 @@ function machine(userContext) {
|
|
|
440
432
|
dom.removeGlobalCursor(ctx2);
|
|
441
433
|
},
|
|
442
434
|
invokeOnResize(ctx2) {
|
|
443
|
-
|
|
444
|
-
(_a = ctx2.onResize) == null ? void 0 : _a.call(ctx2, { size: ctx2.size, activeHandleId: ctx2.activeResizeId });
|
|
435
|
+
ctx2.onResize?.({ size: ctx2.size, activeHandleId: ctx2.activeResizeId });
|
|
445
436
|
},
|
|
446
437
|
invokeOnResizeStart(ctx2) {
|
|
447
|
-
|
|
448
|
-
(_a = ctx2.onResizeStart) == null ? void 0 : _a.call(ctx2, { size: ctx2.size, activeHandleId: ctx2.activeResizeId });
|
|
438
|
+
ctx2.onResizeStart?.({ size: ctx2.size, activeHandleId: ctx2.activeResizeId });
|
|
449
439
|
},
|
|
450
440
|
invokeOnResizeEnd(ctx2) {
|
|
451
|
-
|
|
452
|
-
(_a = ctx2.onResizeEnd) == null ? void 0 : _a.call(ctx2, { size: ctx2.size, activeHandleId: ctx2.activeResizeId });
|
|
441
|
+
ctx2.onResizeEnd?.({ size: ctx2.size, activeHandleId: ctx2.activeResizeId });
|
|
453
442
|
},
|
|
454
443
|
setActiveHandleId(ctx2, evt) {
|
|
455
444
|
ctx2.activeResizeId = evt.id;
|
|
@@ -505,14 +494,12 @@ function machine(userContext) {
|
|
|
505
494
|
},
|
|
506
495
|
focusResizeHandle(ctx2) {
|
|
507
496
|
raf(() => {
|
|
508
|
-
|
|
509
|
-
(_a = dom.getActiveHandleEl(ctx2)) == null ? void 0 : _a.focus();
|
|
497
|
+
dom.getActiveHandleEl(ctx2)?.focus();
|
|
510
498
|
});
|
|
511
499
|
},
|
|
512
500
|
blurResizeHandle(ctx2) {
|
|
513
501
|
raf(() => {
|
|
514
|
-
|
|
515
|
-
(_a = dom.getActiveHandleEl(ctx2)) == null ? void 0 : _a.blur();
|
|
502
|
+
dom.getActiveHandleEl(ctx2)?.blur();
|
|
516
503
|
});
|
|
517
504
|
},
|
|
518
505
|
setPreviousPanels(ctx2) {
|
|
File without changes
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import {
|
|
2
2
|
parts
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-HPRMFGOY.mjs";
|
|
4
4
|
import {
|
|
5
5
|
dom
|
|
6
|
-
} from "./chunk-
|
|
6
|
+
} from "./chunk-QY3R66FZ.mjs";
|
|
7
7
|
import {
|
|
8
8
|
getHandleBounds
|
|
9
|
-
} from "./chunk-
|
|
9
|
+
} from "./chunk-MV44GBQY.mjs";
|
|
10
10
|
|
|
11
11
|
// ../../utilities/dom/src/attrs.ts
|
|
12
12
|
var dataAttr = (guard) => {
|
|
@@ -28,10 +28,9 @@ var sameKeyMap = {
|
|
|
28
28
|
Right: "ArrowRight"
|
|
29
29
|
};
|
|
30
30
|
function getEventKey(event, options = {}) {
|
|
31
|
-
var _a;
|
|
32
31
|
const { dir = "ltr", orientation = "horizontal" } = options;
|
|
33
32
|
let { key } = event;
|
|
34
|
-
key =
|
|
33
|
+
key = sameKeyMap[key] ?? key;
|
|
35
34
|
const isRtl = dir === "rtl" && orientation === "horizontal";
|
|
36
35
|
if (isRtl && key in rtlKeyMap) {
|
|
37
36
|
key = rtlKeyMap[key];
|
|
@@ -103,8 +102,8 @@ function connect(state, send, normalize) {
|
|
|
103
102
|
isDisabled: !!disabled,
|
|
104
103
|
isFocused: state.context.activeResizeId === id && isFocused,
|
|
105
104
|
panelIds,
|
|
106
|
-
min: panels
|
|
107
|
-
max: panels
|
|
105
|
+
min: panels?.min,
|
|
106
|
+
max: panels?.max,
|
|
108
107
|
value: 0
|
|
109
108
|
};
|
|
110
109
|
},
|
|
@@ -9,9 +9,8 @@ function getNormalizedPanels(ctx) {
|
|
|
9
9
|
let totalSize = 0;
|
|
10
10
|
let totalMinSize = 0;
|
|
11
11
|
const panels = ctx.size.map((panel) => {
|
|
12
|
-
|
|
13
|
-
const
|
|
14
|
-
const maxSize = (_b = panel.maxSize) != null ? _b : 100;
|
|
12
|
+
const minSize = panel.minSize ?? 10;
|
|
13
|
+
const maxSize = panel.maxSize ?? 100;
|
|
15
14
|
totalMinSize += minSize;
|
|
16
15
|
if (panel.size == null) {
|
|
17
16
|
numOfPanelsWithoutSize++;
|
|
@@ -48,8 +47,7 @@ function getNormalizedPanels(ctx) {
|
|
|
48
47
|
return result;
|
|
49
48
|
}
|
|
50
49
|
function getHandlePanels(ctx, id = ctx.activeResizeId) {
|
|
51
|
-
|
|
52
|
-
const [beforeId, afterId] = (_a = id == null ? void 0 : id.split(":")) != null ? _a : [];
|
|
50
|
+
const [beforeId, afterId] = id?.split(":") ?? [];
|
|
53
51
|
if (!beforeId || !afterId)
|
|
54
52
|
return;
|
|
55
53
|
const beforeIndex = ctx.previousPanels.findIndex((panel) => panel.id === beforeId);
|
|
@@ -3,27 +3,20 @@ function isDocument(el) {
|
|
|
3
3
|
return el.nodeType === Node.DOCUMENT_NODE;
|
|
4
4
|
}
|
|
5
5
|
function isWindow(value) {
|
|
6
|
-
return
|
|
6
|
+
return value?.toString() === "[object Window]";
|
|
7
7
|
}
|
|
8
8
|
function getDocument(el) {
|
|
9
|
-
var _a;
|
|
10
9
|
if (isWindow(el))
|
|
11
10
|
return el.document;
|
|
12
11
|
if (isDocument(el))
|
|
13
12
|
return el;
|
|
14
|
-
return
|
|
13
|
+
return el?.ownerDocument ?? document;
|
|
15
14
|
}
|
|
16
15
|
function defineDomHelpers(helpers) {
|
|
17
16
|
const dom2 = {
|
|
18
|
-
getRootNode: (ctx) =>
|
|
19
|
-
var _a, _b;
|
|
20
|
-
return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
|
|
21
|
-
},
|
|
17
|
+
getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
|
|
22
18
|
getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
|
|
23
|
-
getWin: (ctx) =>
|
|
24
|
-
var _a;
|
|
25
|
-
return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
|
|
26
|
-
},
|
|
19
|
+
getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
|
|
27
20
|
getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
|
|
28
21
|
getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
|
|
29
22
|
};
|
|
@@ -35,8 +28,7 @@ function defineDomHelpers(helpers) {
|
|
|
35
28
|
|
|
36
29
|
// ../../utilities/dom/src/nodelist.ts
|
|
37
30
|
function queryAll(root, selector) {
|
|
38
|
-
|
|
39
|
-
return Array.from((_a = root == null ? void 0 : root.querySelectorAll(selector)) != null ? _a : []);
|
|
31
|
+
return Array.from(root?.querySelectorAll(selector) ?? []);
|
|
40
32
|
}
|
|
41
33
|
|
|
42
34
|
// src/splitter.dom.ts
|
|
@@ -60,8 +52,7 @@ var dom = defineDomHelpers({
|
|
|
60
52
|
return cursor;
|
|
61
53
|
},
|
|
62
54
|
getPanelStyle(ctx, id) {
|
|
63
|
-
|
|
64
|
-
const flexGrow = (_b = (_a = ctx.panels.find((panel) => panel.id === id)) == null ? void 0 : _a.size) != null ? _b : "0";
|
|
55
|
+
const flexGrow = ctx.panels.find((panel) => panel.id === id)?.size ?? "0";
|
|
65
56
|
return {
|
|
66
57
|
flexBasis: 0,
|
|
67
58
|
flexGrow,
|
|
@@ -92,8 +83,7 @@ var dom = defineDomHelpers({
|
|
|
92
83
|
}
|
|
93
84
|
},
|
|
94
85
|
removeGlobalCursor(ctx) {
|
|
95
|
-
|
|
96
|
-
(_a = dom.getById(ctx, dom.globalCursorId(ctx))) == null ? void 0 : _a.remove();
|
|
86
|
+
dom.getById(ctx, dom.globalCursorId(ctx))?.remove();
|
|
97
87
|
}
|
|
98
88
|
});
|
|
99
89
|
|
package/dist/index.js
CHANGED
|
@@ -39,11 +39,11 @@ var dataAttr = (guard) => {
|
|
|
39
39
|
// ../../utilities/core/src/functions.ts
|
|
40
40
|
var runIfFn = (v, ...a) => {
|
|
41
41
|
const res = typeof v === "function" ? v(...a) : v;
|
|
42
|
-
return res
|
|
42
|
+
return res ?? void 0;
|
|
43
43
|
};
|
|
44
44
|
var callAll = (...fns) => (...a) => {
|
|
45
45
|
fns.forEach(function(fn) {
|
|
46
|
-
fn
|
|
46
|
+
fn?.(...a);
|
|
47
47
|
});
|
|
48
48
|
};
|
|
49
49
|
|
|
@@ -64,9 +64,8 @@ function compact(obj) {
|
|
|
64
64
|
// ../../utilities/dom/src/platform.ts
|
|
65
65
|
var isDom = () => typeof window !== "undefined";
|
|
66
66
|
function getPlatform() {
|
|
67
|
-
var _a;
|
|
68
67
|
const agent = navigator.userAgentData;
|
|
69
|
-
return
|
|
68
|
+
return agent?.platform ?? navigator.platform;
|
|
70
69
|
}
|
|
71
70
|
var pt = (v) => isDom() && v.test(getPlatform());
|
|
72
71
|
var isTouchDevice = () => isDom() && !!navigator.maxTouchPoints;
|
|
@@ -79,27 +78,20 @@ function isDocument(el) {
|
|
|
79
78
|
return el.nodeType === Node.DOCUMENT_NODE;
|
|
80
79
|
}
|
|
81
80
|
function isWindow(value) {
|
|
82
|
-
return
|
|
81
|
+
return value?.toString() === "[object Window]";
|
|
83
82
|
}
|
|
84
83
|
function getDocument(el) {
|
|
85
|
-
var _a;
|
|
86
84
|
if (isWindow(el))
|
|
87
85
|
return el.document;
|
|
88
86
|
if (isDocument(el))
|
|
89
87
|
return el;
|
|
90
|
-
return
|
|
88
|
+
return el?.ownerDocument ?? document;
|
|
91
89
|
}
|
|
92
90
|
function defineDomHelpers(helpers) {
|
|
93
91
|
const dom2 = {
|
|
94
|
-
getRootNode: (ctx) =>
|
|
95
|
-
var _a, _b;
|
|
96
|
-
return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
|
|
97
|
-
},
|
|
92
|
+
getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
|
|
98
93
|
getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
|
|
99
|
-
getWin: (ctx) =>
|
|
100
|
-
var _a;
|
|
101
|
-
return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
|
|
102
|
-
},
|
|
94
|
+
getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
|
|
103
95
|
getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
|
|
104
96
|
getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
|
|
105
97
|
};
|
|
@@ -180,10 +172,9 @@ var sameKeyMap = {
|
|
|
180
172
|
Right: "ArrowRight"
|
|
181
173
|
};
|
|
182
174
|
function getEventKey(event, options = {}) {
|
|
183
|
-
var _a;
|
|
184
175
|
const { dir = "ltr", orientation = "horizontal" } = options;
|
|
185
176
|
let { key } = event;
|
|
186
|
-
key =
|
|
177
|
+
key = sameKeyMap[key] ?? key;
|
|
187
178
|
const isRtl = dir === "rtl" && orientation === "horizontal";
|
|
188
179
|
if (isRtl && key in rtlKeyMap) {
|
|
189
180
|
key = rtlKeyMap[key];
|
|
@@ -216,14 +207,13 @@ function extractInfo(event, type = "page") {
|
|
|
216
207
|
}
|
|
217
208
|
function addDomEvent(target, eventName, handler, options) {
|
|
218
209
|
const node = isRef(target) ? target.current : runIfFn(target);
|
|
219
|
-
node
|
|
210
|
+
node?.addEventListener(eventName, handler, options);
|
|
220
211
|
return () => {
|
|
221
|
-
node
|
|
212
|
+
node?.removeEventListener(eventName, handler, options);
|
|
222
213
|
};
|
|
223
214
|
}
|
|
224
215
|
function addPointerEvent(target, event, listener, options) {
|
|
225
|
-
|
|
226
|
-
const type = (_a = getEventName(event)) != null ? _a : event;
|
|
216
|
+
const type = getEventName(event) ?? event;
|
|
227
217
|
return addDomEvent(target, type, wrapHandler(listener, event === "pointerdown"), options);
|
|
228
218
|
}
|
|
229
219
|
function wrapHandler(fn, filter = false) {
|
|
@@ -234,8 +224,7 @@ function wrapHandler(fn, filter = false) {
|
|
|
234
224
|
}
|
|
235
225
|
function filterPrimaryPointer(fn) {
|
|
236
226
|
return (event) => {
|
|
237
|
-
|
|
238
|
-
const win = (_a = event.view) != null ? _a : window;
|
|
227
|
+
const win = event.view ?? window;
|
|
239
228
|
const isMouseEvent2 = event instanceof win.MouseEvent;
|
|
240
229
|
const isPrimary = !isMouseEvent2 || isMouseEvent2 && event.button === 0;
|
|
241
230
|
if (isPrimary)
|
|
@@ -291,8 +280,7 @@ function raf(fn) {
|
|
|
291
280
|
|
|
292
281
|
// ../../utilities/dom/src/nodelist.ts
|
|
293
282
|
function queryAll(root, selector) {
|
|
294
|
-
|
|
295
|
-
return Array.from((_a = root == null ? void 0 : root.querySelectorAll(selector)) != null ? _a : []);
|
|
283
|
+
return Array.from(root?.querySelectorAll(selector) ?? []);
|
|
296
284
|
}
|
|
297
285
|
|
|
298
286
|
// ../../utilities/dom/src/text-selection.ts
|
|
@@ -300,7 +288,7 @@ var state = "default";
|
|
|
300
288
|
var savedUserSelect = "";
|
|
301
289
|
var modifiedElementMap = /* @__PURE__ */ new WeakMap();
|
|
302
290
|
function disableTextSelection({ target, doc } = {}) {
|
|
303
|
-
const _document = doc
|
|
291
|
+
const _document = doc ?? document;
|
|
304
292
|
if (isIos()) {
|
|
305
293
|
if (state === "default") {
|
|
306
294
|
savedUserSelect = _document.documentElement.style.webkitUserSelect;
|
|
@@ -314,7 +302,7 @@ function disableTextSelection({ target, doc } = {}) {
|
|
|
314
302
|
return () => restoreTextSelection({ target, doc: _document });
|
|
315
303
|
}
|
|
316
304
|
function restoreTextSelection({ target, doc } = {}) {
|
|
317
|
-
const _document = doc
|
|
305
|
+
const _document = doc ?? document;
|
|
318
306
|
if (isIos()) {
|
|
319
307
|
if (state !== "disabled")
|
|
320
308
|
return;
|
|
@@ -334,7 +322,7 @@ function restoreTextSelection({ target, doc } = {}) {
|
|
|
334
322
|
if (target && modifiedElementMap.has(target)) {
|
|
335
323
|
let targetOldUserSelect = modifiedElementMap.get(target);
|
|
336
324
|
if (target.style.userSelect === "none") {
|
|
337
|
-
target.style.userSelect = targetOldUserSelect
|
|
325
|
+
target.style.userSelect = targetOldUserSelect ?? "";
|
|
338
326
|
}
|
|
339
327
|
if (target.getAttribute("style") === "") {
|
|
340
328
|
target.removeAttribute("style");
|
|
@@ -389,8 +377,7 @@ var dom = defineDomHelpers({
|
|
|
389
377
|
return cursor;
|
|
390
378
|
},
|
|
391
379
|
getPanelStyle(ctx, id) {
|
|
392
|
-
|
|
393
|
-
const flexGrow = (_b = (_a = ctx.panels.find((panel) => panel.id === id)) == null ? void 0 : _a.size) != null ? _b : "0";
|
|
380
|
+
const flexGrow = ctx.panels.find((panel) => panel.id === id)?.size ?? "0";
|
|
394
381
|
return {
|
|
395
382
|
flexBasis: 0,
|
|
396
383
|
flexGrow,
|
|
@@ -421,8 +408,7 @@ var dom = defineDomHelpers({
|
|
|
421
408
|
}
|
|
422
409
|
},
|
|
423
410
|
removeGlobalCursor(ctx) {
|
|
424
|
-
|
|
425
|
-
(_a = dom.getById(ctx, dom.globalCursorId(ctx))) == null ? void 0 : _a.remove();
|
|
411
|
+
dom.getById(ctx, dom.globalCursorId(ctx))?.remove();
|
|
426
412
|
}
|
|
427
413
|
});
|
|
428
414
|
|
|
@@ -437,9 +423,8 @@ function getNormalizedPanels(ctx) {
|
|
|
437
423
|
let totalSize = 0;
|
|
438
424
|
let totalMinSize = 0;
|
|
439
425
|
const panels = ctx.size.map((panel) => {
|
|
440
|
-
|
|
441
|
-
const
|
|
442
|
-
const maxSize = (_b = panel.maxSize) != null ? _b : 100;
|
|
426
|
+
const minSize = panel.minSize ?? 10;
|
|
427
|
+
const maxSize = panel.maxSize ?? 100;
|
|
443
428
|
totalMinSize += minSize;
|
|
444
429
|
if (panel.size == null) {
|
|
445
430
|
numOfPanelsWithoutSize++;
|
|
@@ -476,8 +461,7 @@ function getNormalizedPanels(ctx) {
|
|
|
476
461
|
return result;
|
|
477
462
|
}
|
|
478
463
|
function getHandlePanels(ctx, id = ctx.activeResizeId) {
|
|
479
|
-
|
|
480
|
-
const [beforeId, afterId] = (_a = id == null ? void 0 : id.split(":")) != null ? _a : [];
|
|
464
|
+
const [beforeId, afterId] = id?.split(":") ?? [];
|
|
481
465
|
if (!beforeId || !afterId)
|
|
482
466
|
return;
|
|
483
467
|
const beforeIndex = ctx.previousPanels.findIndex((panel) => panel.id === beforeId);
|
|
@@ -603,8 +587,8 @@ function connect(state2, send, normalize) {
|
|
|
603
587
|
isDisabled: !!disabled,
|
|
604
588
|
isFocused: state2.context.activeResizeId === id && isFocused,
|
|
605
589
|
panelIds,
|
|
606
|
-
min: panels
|
|
607
|
-
max: panels
|
|
590
|
+
min: panels?.min,
|
|
591
|
+
max: panels?.max,
|
|
608
592
|
value: 0
|
|
609
593
|
};
|
|
610
594
|
},
|
|
@@ -711,7 +695,7 @@ function machine(userContext) {
|
|
|
711
695
|
return (0, import_core.createMachine)(
|
|
712
696
|
{
|
|
713
697
|
id: "splitter",
|
|
714
|
-
initial: "
|
|
698
|
+
initial: "idle",
|
|
715
699
|
context: {
|
|
716
700
|
orientation: "horizontal",
|
|
717
701
|
activeResizeId: null,
|
|
@@ -750,11 +734,6 @@ function machine(userContext) {
|
|
|
750
734
|
]
|
|
751
735
|
},
|
|
752
736
|
states: {
|
|
753
|
-
unknown: {
|
|
754
|
-
on: {
|
|
755
|
-
SETUP: "idle"
|
|
756
|
-
}
|
|
757
|
-
},
|
|
758
737
|
idle: {
|
|
759
738
|
entry: ["clearActiveHandleId"],
|
|
760
739
|
on: {
|
|
@@ -879,16 +858,13 @@ function machine(userContext) {
|
|
|
879
858
|
dom.removeGlobalCursor(ctx2);
|
|
880
859
|
},
|
|
881
860
|
invokeOnResize(ctx2) {
|
|
882
|
-
|
|
883
|
-
(_a = ctx2.onResize) == null ? void 0 : _a.call(ctx2, { size: ctx2.size, activeHandleId: ctx2.activeResizeId });
|
|
861
|
+
ctx2.onResize?.({ size: ctx2.size, activeHandleId: ctx2.activeResizeId });
|
|
884
862
|
},
|
|
885
863
|
invokeOnResizeStart(ctx2) {
|
|
886
|
-
|
|
887
|
-
(_a = ctx2.onResizeStart) == null ? void 0 : _a.call(ctx2, { size: ctx2.size, activeHandleId: ctx2.activeResizeId });
|
|
864
|
+
ctx2.onResizeStart?.({ size: ctx2.size, activeHandleId: ctx2.activeResizeId });
|
|
888
865
|
},
|
|
889
866
|
invokeOnResizeEnd(ctx2) {
|
|
890
|
-
|
|
891
|
-
(_a = ctx2.onResizeEnd) == null ? void 0 : _a.call(ctx2, { size: ctx2.size, activeHandleId: ctx2.activeResizeId });
|
|
867
|
+
ctx2.onResizeEnd?.({ size: ctx2.size, activeHandleId: ctx2.activeResizeId });
|
|
892
868
|
},
|
|
893
869
|
setActiveHandleId(ctx2, evt) {
|
|
894
870
|
ctx2.activeResizeId = evt.id;
|
|
@@ -944,14 +920,12 @@ function machine(userContext) {
|
|
|
944
920
|
},
|
|
945
921
|
focusResizeHandle(ctx2) {
|
|
946
922
|
raf(() => {
|
|
947
|
-
|
|
948
|
-
(_a = dom.getActiveHandleEl(ctx2)) == null ? void 0 : _a.focus();
|
|
923
|
+
dom.getActiveHandleEl(ctx2)?.focus();
|
|
949
924
|
});
|
|
950
925
|
},
|
|
951
926
|
blurResizeHandle(ctx2) {
|
|
952
927
|
raf(() => {
|
|
953
|
-
|
|
954
|
-
(_a = dom.getActiveHandleEl(ctx2)) == null ? void 0 : _a.blur();
|
|
928
|
+
dom.getActiveHandleEl(ctx2)?.blur();
|
|
955
929
|
});
|
|
956
930
|
},
|
|
957
931
|
setPreviousPanels(ctx2) {
|
package/dist/index.mjs
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import {
|
|
2
2
|
connect
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-JYQICU6Y.mjs";
|
|
4
4
|
import {
|
|
5
5
|
anatomy
|
|
6
|
-
} from "./chunk-
|
|
6
|
+
} from "./chunk-HPRMFGOY.mjs";
|
|
7
7
|
import {
|
|
8
8
|
machine
|
|
9
|
-
} from "./chunk-
|
|
10
|
-
import "./chunk-
|
|
11
|
-
import "./chunk-
|
|
9
|
+
} from "./chunk-EABXMZ6N.mjs";
|
|
10
|
+
import "./chunk-QY3R66FZ.mjs";
|
|
11
|
+
import "./chunk-MV44GBQY.mjs";
|
|
12
12
|
export {
|
|
13
13
|
anatomy,
|
|
14
14
|
connect,
|
package/dist/splitter.connect.js
CHANGED
|
@@ -34,27 +34,20 @@ function isDocument(el) {
|
|
|
34
34
|
return el.nodeType === Node.DOCUMENT_NODE;
|
|
35
35
|
}
|
|
36
36
|
function isWindow(value) {
|
|
37
|
-
return
|
|
37
|
+
return value?.toString() === "[object Window]";
|
|
38
38
|
}
|
|
39
39
|
function getDocument(el) {
|
|
40
|
-
var _a;
|
|
41
40
|
if (isWindow(el))
|
|
42
41
|
return el.document;
|
|
43
42
|
if (isDocument(el))
|
|
44
43
|
return el;
|
|
45
|
-
return
|
|
44
|
+
return el?.ownerDocument ?? document;
|
|
46
45
|
}
|
|
47
46
|
function defineDomHelpers(helpers) {
|
|
48
47
|
const dom2 = {
|
|
49
|
-
getRootNode: (ctx) =>
|
|
50
|
-
var _a, _b;
|
|
51
|
-
return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
|
|
52
|
-
},
|
|
48
|
+
getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
|
|
53
49
|
getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
|
|
54
|
-
getWin: (ctx) =>
|
|
55
|
-
var _a;
|
|
56
|
-
return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
|
|
57
|
-
},
|
|
50
|
+
getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
|
|
58
51
|
getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
|
|
59
52
|
getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
|
|
60
53
|
};
|
|
@@ -79,10 +72,9 @@ var sameKeyMap = {
|
|
|
79
72
|
Right: "ArrowRight"
|
|
80
73
|
};
|
|
81
74
|
function getEventKey(event, options = {}) {
|
|
82
|
-
var _a;
|
|
83
75
|
const { dir = "ltr", orientation = "horizontal" } = options;
|
|
84
76
|
let { key } = event;
|
|
85
|
-
key =
|
|
77
|
+
key = sameKeyMap[key] ?? key;
|
|
86
78
|
const isRtl = dir === "rtl" && orientation === "horizontal";
|
|
87
79
|
if (isRtl && key in rtlKeyMap) {
|
|
88
80
|
key = rtlKeyMap[key];
|
|
@@ -103,8 +95,7 @@ function getEventStep(event) {
|
|
|
103
95
|
|
|
104
96
|
// ../../utilities/dom/src/nodelist.ts
|
|
105
97
|
function queryAll(root, selector) {
|
|
106
|
-
|
|
107
|
-
return Array.from((_a = root == null ? void 0 : root.querySelectorAll(selector)) != null ? _a : []);
|
|
98
|
+
return Array.from(root?.querySelectorAll(selector) ?? []);
|
|
108
99
|
}
|
|
109
100
|
|
|
110
101
|
// src/splitter.anatomy.ts
|
|
@@ -133,8 +124,7 @@ var dom = defineDomHelpers({
|
|
|
133
124
|
return cursor;
|
|
134
125
|
},
|
|
135
126
|
getPanelStyle(ctx, id) {
|
|
136
|
-
|
|
137
|
-
const flexGrow = (_b = (_a = ctx.panels.find((panel) => panel.id === id)) == null ? void 0 : _a.size) != null ? _b : "0";
|
|
127
|
+
const flexGrow = ctx.panels.find((panel) => panel.id === id)?.size ?? "0";
|
|
138
128
|
return {
|
|
139
129
|
flexBasis: 0,
|
|
140
130
|
flexGrow,
|
|
@@ -165,15 +155,13 @@ var dom = defineDomHelpers({
|
|
|
165
155
|
}
|
|
166
156
|
},
|
|
167
157
|
removeGlobalCursor(ctx) {
|
|
168
|
-
|
|
169
|
-
(_a = dom.getById(ctx, dom.globalCursorId(ctx))) == null ? void 0 : _a.remove();
|
|
158
|
+
dom.getById(ctx, dom.globalCursorId(ctx))?.remove();
|
|
170
159
|
}
|
|
171
160
|
});
|
|
172
161
|
|
|
173
162
|
// src/splitter.utils.ts
|
|
174
163
|
function getHandlePanels(ctx, id = ctx.activeResizeId) {
|
|
175
|
-
|
|
176
|
-
const [beforeId, afterId] = (_a = id == null ? void 0 : id.split(":")) != null ? _a : [];
|
|
164
|
+
const [beforeId, afterId] = id?.split(":") ?? [];
|
|
177
165
|
if (!beforeId || !afterId)
|
|
178
166
|
return;
|
|
179
167
|
const beforeIndex = ctx.previousPanels.findIndex((panel) => panel.id === beforeId);
|
|
@@ -257,8 +245,8 @@ function connect(state, send, normalize) {
|
|
|
257
245
|
isDisabled: !!disabled,
|
|
258
246
|
isFocused: state.context.activeResizeId === id && isFocused,
|
|
259
247
|
panelIds,
|
|
260
|
-
min: panels
|
|
261
|
-
max: panels
|
|
248
|
+
min: panels?.min,
|
|
249
|
+
max: panels?.max,
|
|
262
250
|
value: 0
|
|
263
251
|
};
|
|
264
252
|
},
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import {
|
|
2
2
|
connect
|
|
3
|
-
} from "./chunk-
|
|
4
|
-
import "./chunk-
|
|
5
|
-
import "./chunk-
|
|
6
|
-
import "./chunk-
|
|
3
|
+
} from "./chunk-JYQICU6Y.mjs";
|
|
4
|
+
import "./chunk-HPRMFGOY.mjs";
|
|
5
|
+
import "./chunk-QY3R66FZ.mjs";
|
|
6
|
+
import "./chunk-MV44GBQY.mjs";
|
|
7
7
|
export {
|
|
8
8
|
connect
|
|
9
9
|
};
|
package/dist/splitter.dom.js
CHANGED
|
@@ -29,27 +29,20 @@ function isDocument(el) {
|
|
|
29
29
|
return el.nodeType === Node.DOCUMENT_NODE;
|
|
30
30
|
}
|
|
31
31
|
function isWindow(value) {
|
|
32
|
-
return
|
|
32
|
+
return value?.toString() === "[object Window]";
|
|
33
33
|
}
|
|
34
34
|
function getDocument(el) {
|
|
35
|
-
var _a;
|
|
36
35
|
if (isWindow(el))
|
|
37
36
|
return el.document;
|
|
38
37
|
if (isDocument(el))
|
|
39
38
|
return el;
|
|
40
|
-
return
|
|
39
|
+
return el?.ownerDocument ?? document;
|
|
41
40
|
}
|
|
42
41
|
function defineDomHelpers(helpers) {
|
|
43
42
|
const dom2 = {
|
|
44
|
-
getRootNode: (ctx) =>
|
|
45
|
-
var _a, _b;
|
|
46
|
-
return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
|
|
47
|
-
},
|
|
43
|
+
getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
|
|
48
44
|
getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
|
|
49
|
-
getWin: (ctx) =>
|
|
50
|
-
var _a;
|
|
51
|
-
return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
|
|
52
|
-
},
|
|
45
|
+
getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
|
|
53
46
|
getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
|
|
54
47
|
getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
|
|
55
48
|
};
|
|
@@ -61,8 +54,7 @@ function defineDomHelpers(helpers) {
|
|
|
61
54
|
|
|
62
55
|
// ../../utilities/dom/src/nodelist.ts
|
|
63
56
|
function queryAll(root, selector) {
|
|
64
|
-
|
|
65
|
-
return Array.from((_a = root == null ? void 0 : root.querySelectorAll(selector)) != null ? _a : []);
|
|
57
|
+
return Array.from(root?.querySelectorAll(selector) ?? []);
|
|
66
58
|
}
|
|
67
59
|
|
|
68
60
|
// src/splitter.dom.ts
|
|
@@ -86,8 +78,7 @@ var dom = defineDomHelpers({
|
|
|
86
78
|
return cursor;
|
|
87
79
|
},
|
|
88
80
|
getPanelStyle(ctx, id) {
|
|
89
|
-
|
|
90
|
-
const flexGrow = (_b = (_a = ctx.panels.find((panel) => panel.id === id)) == null ? void 0 : _a.size) != null ? _b : "0";
|
|
81
|
+
const flexGrow = ctx.panels.find((panel) => panel.id === id)?.size ?? "0";
|
|
91
82
|
return {
|
|
92
83
|
flexBasis: 0,
|
|
93
84
|
flexGrow,
|
|
@@ -118,8 +109,7 @@ var dom = defineDomHelpers({
|
|
|
118
109
|
}
|
|
119
110
|
},
|
|
120
111
|
removeGlobalCursor(ctx) {
|
|
121
|
-
|
|
122
|
-
(_a = dom.getById(ctx, dom.globalCursorId(ctx))) == null ? void 0 : _a.remove();
|
|
112
|
+
dom.getById(ctx, dom.globalCursorId(ctx))?.remove();
|
|
123
113
|
}
|
|
124
114
|
});
|
|
125
115
|
// Annotate the CommonJS export names for ESM import in node:
|
package/dist/splitter.dom.mjs
CHANGED
package/dist/splitter.machine.js
CHANGED
|
@@ -28,11 +28,11 @@ var import_core = require("@zag-js/core");
|
|
|
28
28
|
// ../../utilities/core/src/functions.ts
|
|
29
29
|
var runIfFn = (v, ...a) => {
|
|
30
30
|
const res = typeof v === "function" ? v(...a) : v;
|
|
31
|
-
return res
|
|
31
|
+
return res ?? void 0;
|
|
32
32
|
};
|
|
33
33
|
var callAll = (...fns) => (...a) => {
|
|
34
34
|
fns.forEach(function(fn) {
|
|
35
|
-
fn
|
|
35
|
+
fn?.(...a);
|
|
36
36
|
});
|
|
37
37
|
};
|
|
38
38
|
|
|
@@ -53,9 +53,8 @@ function compact(obj) {
|
|
|
53
53
|
// ../../utilities/dom/src/platform.ts
|
|
54
54
|
var isDom = () => typeof window !== "undefined";
|
|
55
55
|
function getPlatform() {
|
|
56
|
-
var _a;
|
|
57
56
|
const agent = navigator.userAgentData;
|
|
58
|
-
return
|
|
57
|
+
return agent?.platform ?? navigator.platform;
|
|
59
58
|
}
|
|
60
59
|
var pt = (v) => isDom() && v.test(getPlatform());
|
|
61
60
|
var isTouchDevice = () => isDom() && !!navigator.maxTouchPoints;
|
|
@@ -68,27 +67,20 @@ function isDocument(el) {
|
|
|
68
67
|
return el.nodeType === Node.DOCUMENT_NODE;
|
|
69
68
|
}
|
|
70
69
|
function isWindow(value) {
|
|
71
|
-
return
|
|
70
|
+
return value?.toString() === "[object Window]";
|
|
72
71
|
}
|
|
73
72
|
function getDocument(el) {
|
|
74
|
-
var _a;
|
|
75
73
|
if (isWindow(el))
|
|
76
74
|
return el.document;
|
|
77
75
|
if (isDocument(el))
|
|
78
76
|
return el;
|
|
79
|
-
return
|
|
77
|
+
return el?.ownerDocument ?? document;
|
|
80
78
|
}
|
|
81
79
|
function defineDomHelpers(helpers) {
|
|
82
80
|
const dom2 = {
|
|
83
|
-
getRootNode: (ctx) =>
|
|
84
|
-
var _a, _b;
|
|
85
|
-
return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
|
|
86
|
-
},
|
|
81
|
+
getRootNode: (ctx) => ctx.getRootNode?.() ?? document,
|
|
87
82
|
getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
|
|
88
|
-
getWin: (ctx) =>
|
|
89
|
-
var _a;
|
|
90
|
-
return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
|
|
91
|
-
},
|
|
83
|
+
getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
|
|
92
84
|
getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
|
|
93
85
|
getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
|
|
94
86
|
};
|
|
@@ -168,14 +160,13 @@ function extractInfo(event, type = "page") {
|
|
|
168
160
|
}
|
|
169
161
|
function addDomEvent(target, eventName, handler, options) {
|
|
170
162
|
const node = isRef(target) ? target.current : runIfFn(target);
|
|
171
|
-
node
|
|
163
|
+
node?.addEventListener(eventName, handler, options);
|
|
172
164
|
return () => {
|
|
173
|
-
node
|
|
165
|
+
node?.removeEventListener(eventName, handler, options);
|
|
174
166
|
};
|
|
175
167
|
}
|
|
176
168
|
function addPointerEvent(target, event, listener, options) {
|
|
177
|
-
|
|
178
|
-
const type = (_a = getEventName(event)) != null ? _a : event;
|
|
169
|
+
const type = getEventName(event) ?? event;
|
|
179
170
|
return addDomEvent(target, type, wrapHandler(listener, event === "pointerdown"), options);
|
|
180
171
|
}
|
|
181
172
|
function wrapHandler(fn, filter = false) {
|
|
@@ -186,8 +177,7 @@ function wrapHandler(fn, filter = false) {
|
|
|
186
177
|
}
|
|
187
178
|
function filterPrimaryPointer(fn) {
|
|
188
179
|
return (event) => {
|
|
189
|
-
|
|
190
|
-
const win = (_a = event.view) != null ? _a : window;
|
|
180
|
+
const win = event.view ?? window;
|
|
191
181
|
const isMouseEvent2 = event instanceof win.MouseEvent;
|
|
192
182
|
const isPrimary = !isMouseEvent2 || isMouseEvent2 && event.button === 0;
|
|
193
183
|
if (isPrimary)
|
|
@@ -243,8 +233,7 @@ function raf(fn) {
|
|
|
243
233
|
|
|
244
234
|
// ../../utilities/dom/src/nodelist.ts
|
|
245
235
|
function queryAll(root, selector) {
|
|
246
|
-
|
|
247
|
-
return Array.from((_a = root == null ? void 0 : root.querySelectorAll(selector)) != null ? _a : []);
|
|
236
|
+
return Array.from(root?.querySelectorAll(selector) ?? []);
|
|
248
237
|
}
|
|
249
238
|
|
|
250
239
|
// ../../utilities/dom/src/text-selection.ts
|
|
@@ -252,7 +241,7 @@ var state = "default";
|
|
|
252
241
|
var savedUserSelect = "";
|
|
253
242
|
var modifiedElementMap = /* @__PURE__ */ new WeakMap();
|
|
254
243
|
function disableTextSelection({ target, doc } = {}) {
|
|
255
|
-
const _document = doc
|
|
244
|
+
const _document = doc ?? document;
|
|
256
245
|
if (isIos()) {
|
|
257
246
|
if (state === "default") {
|
|
258
247
|
savedUserSelect = _document.documentElement.style.webkitUserSelect;
|
|
@@ -266,7 +255,7 @@ function disableTextSelection({ target, doc } = {}) {
|
|
|
266
255
|
return () => restoreTextSelection({ target, doc: _document });
|
|
267
256
|
}
|
|
268
257
|
function restoreTextSelection({ target, doc } = {}) {
|
|
269
|
-
const _document = doc
|
|
258
|
+
const _document = doc ?? document;
|
|
270
259
|
if (isIos()) {
|
|
271
260
|
if (state !== "disabled")
|
|
272
261
|
return;
|
|
@@ -286,7 +275,7 @@ function restoreTextSelection({ target, doc } = {}) {
|
|
|
286
275
|
if (target && modifiedElementMap.has(target)) {
|
|
287
276
|
let targetOldUserSelect = modifiedElementMap.get(target);
|
|
288
277
|
if (target.style.userSelect === "none") {
|
|
289
|
-
target.style.userSelect = targetOldUserSelect
|
|
278
|
+
target.style.userSelect = targetOldUserSelect ?? "";
|
|
290
279
|
}
|
|
291
280
|
if (target.getAttribute("style") === "") {
|
|
292
281
|
target.removeAttribute("style");
|
|
@@ -341,8 +330,7 @@ var dom = defineDomHelpers({
|
|
|
341
330
|
return cursor;
|
|
342
331
|
},
|
|
343
332
|
getPanelStyle(ctx, id) {
|
|
344
|
-
|
|
345
|
-
const flexGrow = (_b = (_a = ctx.panels.find((panel) => panel.id === id)) == null ? void 0 : _a.size) != null ? _b : "0";
|
|
333
|
+
const flexGrow = ctx.panels.find((panel) => panel.id === id)?.size ?? "0";
|
|
346
334
|
return {
|
|
347
335
|
flexBasis: 0,
|
|
348
336
|
flexGrow,
|
|
@@ -373,8 +361,7 @@ var dom = defineDomHelpers({
|
|
|
373
361
|
}
|
|
374
362
|
},
|
|
375
363
|
removeGlobalCursor(ctx) {
|
|
376
|
-
|
|
377
|
-
(_a = dom.getById(ctx, dom.globalCursorId(ctx))) == null ? void 0 : _a.remove();
|
|
364
|
+
dom.getById(ctx, dom.globalCursorId(ctx))?.remove();
|
|
378
365
|
}
|
|
379
366
|
});
|
|
380
367
|
|
|
@@ -389,9 +376,8 @@ function getNormalizedPanels(ctx) {
|
|
|
389
376
|
let totalSize = 0;
|
|
390
377
|
let totalMinSize = 0;
|
|
391
378
|
const panels = ctx.size.map((panel) => {
|
|
392
|
-
|
|
393
|
-
const
|
|
394
|
-
const maxSize = (_b = panel.maxSize) != null ? _b : 100;
|
|
379
|
+
const minSize = panel.minSize ?? 10;
|
|
380
|
+
const maxSize = panel.maxSize ?? 100;
|
|
395
381
|
totalMinSize += minSize;
|
|
396
382
|
if (panel.size == null) {
|
|
397
383
|
numOfPanelsWithoutSize++;
|
|
@@ -428,8 +414,7 @@ function getNormalizedPanels(ctx) {
|
|
|
428
414
|
return result;
|
|
429
415
|
}
|
|
430
416
|
function getHandlePanels(ctx, id = ctx.activeResizeId) {
|
|
431
|
-
|
|
432
|
-
const [beforeId, afterId] = (_a = id == null ? void 0 : id.split(":")) != null ? _a : [];
|
|
417
|
+
const [beforeId, afterId] = id?.split(":") ?? [];
|
|
433
418
|
if (!beforeId || !afterId)
|
|
434
419
|
return;
|
|
435
420
|
const beforeIndex = ctx.previousPanels.findIndex((panel) => panel.id === beforeId);
|
|
@@ -508,7 +493,7 @@ function machine(userContext) {
|
|
|
508
493
|
return (0, import_core.createMachine)(
|
|
509
494
|
{
|
|
510
495
|
id: "splitter",
|
|
511
|
-
initial: "
|
|
496
|
+
initial: "idle",
|
|
512
497
|
context: {
|
|
513
498
|
orientation: "horizontal",
|
|
514
499
|
activeResizeId: null,
|
|
@@ -547,11 +532,6 @@ function machine(userContext) {
|
|
|
547
532
|
]
|
|
548
533
|
},
|
|
549
534
|
states: {
|
|
550
|
-
unknown: {
|
|
551
|
-
on: {
|
|
552
|
-
SETUP: "idle"
|
|
553
|
-
}
|
|
554
|
-
},
|
|
555
535
|
idle: {
|
|
556
536
|
entry: ["clearActiveHandleId"],
|
|
557
537
|
on: {
|
|
@@ -676,16 +656,13 @@ function machine(userContext) {
|
|
|
676
656
|
dom.removeGlobalCursor(ctx2);
|
|
677
657
|
},
|
|
678
658
|
invokeOnResize(ctx2) {
|
|
679
|
-
|
|
680
|
-
(_a = ctx2.onResize) == null ? void 0 : _a.call(ctx2, { size: ctx2.size, activeHandleId: ctx2.activeResizeId });
|
|
659
|
+
ctx2.onResize?.({ size: ctx2.size, activeHandleId: ctx2.activeResizeId });
|
|
681
660
|
},
|
|
682
661
|
invokeOnResizeStart(ctx2) {
|
|
683
|
-
|
|
684
|
-
(_a = ctx2.onResizeStart) == null ? void 0 : _a.call(ctx2, { size: ctx2.size, activeHandleId: ctx2.activeResizeId });
|
|
662
|
+
ctx2.onResizeStart?.({ size: ctx2.size, activeHandleId: ctx2.activeResizeId });
|
|
685
663
|
},
|
|
686
664
|
invokeOnResizeEnd(ctx2) {
|
|
687
|
-
|
|
688
|
-
(_a = ctx2.onResizeEnd) == null ? void 0 : _a.call(ctx2, { size: ctx2.size, activeHandleId: ctx2.activeResizeId });
|
|
665
|
+
ctx2.onResizeEnd?.({ size: ctx2.size, activeHandleId: ctx2.activeResizeId });
|
|
689
666
|
},
|
|
690
667
|
setActiveHandleId(ctx2, evt) {
|
|
691
668
|
ctx2.activeResizeId = evt.id;
|
|
@@ -741,14 +718,12 @@ function machine(userContext) {
|
|
|
741
718
|
},
|
|
742
719
|
focusResizeHandle(ctx2) {
|
|
743
720
|
raf(() => {
|
|
744
|
-
|
|
745
|
-
(_a = dom.getActiveHandleEl(ctx2)) == null ? void 0 : _a.focus();
|
|
721
|
+
dom.getActiveHandleEl(ctx2)?.focus();
|
|
746
722
|
});
|
|
747
723
|
},
|
|
748
724
|
blurResizeHandle(ctx2) {
|
|
749
725
|
raf(() => {
|
|
750
|
-
|
|
751
|
-
(_a = dom.getActiveHandleEl(ctx2)) == null ? void 0 : _a.blur();
|
|
726
|
+
dom.getActiveHandleEl(ctx2)?.blur();
|
|
752
727
|
});
|
|
753
728
|
},
|
|
754
729
|
setPreviousPanels(ctx2) {
|
package/dist/splitter.types.d.ts
CHANGED
|
@@ -50,7 +50,7 @@ type PrivateContext = Context<{
|
|
|
50
50
|
}>;
|
|
51
51
|
type MachineContext = PublicContext & ComputedContext & PrivateContext;
|
|
52
52
|
type MachineState = {
|
|
53
|
-
value: "
|
|
53
|
+
value: "idle" | "hover:temp" | "hover" | "dragging" | "focused";
|
|
54
54
|
tags: "focus";
|
|
55
55
|
};
|
|
56
56
|
type State = StateMachine.State<MachineContext, MachineState>;
|
package/dist/splitter.utils.js
CHANGED
|
@@ -37,9 +37,8 @@ function getNormalizedPanels(ctx) {
|
|
|
37
37
|
let totalSize = 0;
|
|
38
38
|
let totalMinSize = 0;
|
|
39
39
|
const panels = ctx.size.map((panel) => {
|
|
40
|
-
|
|
41
|
-
const
|
|
42
|
-
const maxSize = (_b = panel.maxSize) != null ? _b : 100;
|
|
40
|
+
const minSize = panel.minSize ?? 10;
|
|
41
|
+
const maxSize = panel.maxSize ?? 100;
|
|
43
42
|
totalMinSize += minSize;
|
|
44
43
|
if (panel.size == null) {
|
|
45
44
|
numOfPanelsWithoutSize++;
|
|
@@ -76,8 +75,7 @@ function getNormalizedPanels(ctx) {
|
|
|
76
75
|
return result;
|
|
77
76
|
}
|
|
78
77
|
function getHandlePanels(ctx, id = ctx.activeResizeId) {
|
|
79
|
-
|
|
80
|
-
const [beforeId, afterId] = (_a = id == null ? void 0 : id.split(":")) != null ? _a : [];
|
|
78
|
+
const [beforeId, afterId] = id?.split(":") ?? [];
|
|
81
79
|
if (!beforeId || !afterId)
|
|
82
80
|
return;
|
|
83
81
|
const beforeIndex = ctx.previousPanels.findIndex((panel) => panel.id === beforeId);
|
package/dist/splitter.utils.mjs
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zag-js/splitter",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.10",
|
|
4
4
|
"description": "Core logic for the splitter widget implemented as a state machine",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"js",
|
|
@@ -27,15 +27,15 @@
|
|
|
27
27
|
"url": "https://github.com/chakra-ui/zag/issues"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@zag-js/anatomy": "0.1.
|
|
31
|
-
"@zag-js/core": "0.2.
|
|
32
|
-
"@zag-js/types": "0.3.
|
|
30
|
+
"@zag-js/anatomy": "0.1.4",
|
|
31
|
+
"@zag-js/core": "0.2.7",
|
|
32
|
+
"@zag-js/types": "0.3.4"
|
|
33
33
|
},
|
|
34
34
|
"devDependencies": {
|
|
35
35
|
"clean-package": "2.2.0",
|
|
36
|
-
"@zag-js/dom-utils": "0.2.
|
|
37
|
-
"@zag-js/number-utils": "0.2.
|
|
38
|
-
"@zag-js/utils": "0.3.
|
|
36
|
+
"@zag-js/dom-utils": "0.2.4",
|
|
37
|
+
"@zag-js/number-utils": "0.2.3",
|
|
38
|
+
"@zag-js/utils": "0.3.3"
|
|
39
39
|
},
|
|
40
40
|
"clean-package": "../../../clean-package.config.json",
|
|
41
41
|
"main": "dist/index.js",
|