@zag-js/splitter 0.2.5 → 0.2.7

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.
@@ -0,0 +1,6 @@
1
+ import * as _zag_js_anatomy from '@zag-js/anatomy';
2
+
3
+ declare const anatomy: _zag_js_anatomy.AnatomyInstance<"root" | "panel" | "toggleTrigger" | "resizeTrigger">;
4
+ declare const parts: Record<"root" | "panel" | "toggleTrigger" | "resizeTrigger", _zag_js_anatomy.AnatomyPart>;
5
+
6
+ export { anatomy, parts };
@@ -0,0 +1,34 @@
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/splitter.anatomy.ts
21
+ var splitter_anatomy_exports = {};
22
+ __export(splitter_anatomy_exports, {
23
+ anatomy: () => anatomy,
24
+ parts: () => parts
25
+ });
26
+ module.exports = __toCommonJS(splitter_anatomy_exports);
27
+ var import_anatomy = require("@zag-js/anatomy");
28
+ var anatomy = (0, import_anatomy.createAnatomy)("splitter").parts("root", "panel", "toggleTrigger", "resizeTrigger");
29
+ var parts = anatomy.build();
30
+ // Annotate the CommonJS export names for ESM import in node:
31
+ 0 && (module.exports = {
32
+ anatomy,
33
+ parts
34
+ });
@@ -0,0 +1,8 @@
1
+ import {
2
+ anatomy,
3
+ parts
4
+ } from "./chunk-HPRMFGOY.mjs";
5
+ export {
6
+ anatomy,
7
+ parts
8
+ };
@@ -0,0 +1,28 @@
1
+ import { PropTypes, NormalizeProps } from '@zag-js/types';
2
+ import { State, Send, PanelId, PanelProps, ResizeTriggerProps } from './splitter.types.js';
3
+ import '@zag-js/core';
4
+
5
+ declare function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): {
6
+ isFocused: boolean;
7
+ isDragging: boolean;
8
+ bounds: {
9
+ min: number;
10
+ max: number;
11
+ } | undefined;
12
+ collapse(id: PanelId): void;
13
+ expand(id: PanelId): void;
14
+ toggle(id: PanelId): void;
15
+ setSize(id: PanelId, size: number): void;
16
+ rootProps: T["element"];
17
+ getPanelProps(props: PanelProps): T["element"];
18
+ getResizeTriggerState(id: string): {
19
+ isFocused: boolean;
20
+ panelIds: string[];
21
+ min: number | undefined;
22
+ max: number | undefined;
23
+ value: number;
24
+ };
25
+ getResizeTriggerProps(props: ResizeTriggerProps): T["element"];
26
+ };
27
+
28
+ export { connect };
@@ -0,0 +1,360 @@
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/splitter.connect.ts
21
+ var splitter_connect_exports = {};
22
+ __export(splitter_connect_exports, {
23
+ connect: () => connect
24
+ });
25
+ module.exports = __toCommonJS(splitter_connect_exports);
26
+
27
+ // ../../utilities/dom/src/attrs.ts
28
+ var dataAttr = (guard) => {
29
+ return guard ? "" : void 0;
30
+ };
31
+
32
+ // ../../utilities/dom/src/query.ts
33
+ function isDocument(el) {
34
+ return el.nodeType === Node.DOCUMENT_NODE;
35
+ }
36
+ function isWindow(value) {
37
+ return (value == null ? void 0 : value.toString()) === "[object Window]";
38
+ }
39
+ function getDocument(el) {
40
+ var _a;
41
+ if (isWindow(el))
42
+ return el.document;
43
+ if (isDocument(el))
44
+ return el;
45
+ return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
46
+ }
47
+ function defineDomHelpers(helpers) {
48
+ 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
+ },
53
+ getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
54
+ getWin: (ctx) => {
55
+ var _a;
56
+ return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
57
+ },
58
+ getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
59
+ getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
60
+ };
61
+ return {
62
+ ...dom2,
63
+ ...helpers
64
+ };
65
+ }
66
+
67
+ // ../../utilities/dom/src/keyboard-event.ts
68
+ var rtlKeyMap = {
69
+ ArrowLeft: "ArrowRight",
70
+ ArrowRight: "ArrowLeft"
71
+ };
72
+ var sameKeyMap = {
73
+ Up: "ArrowUp",
74
+ Down: "ArrowDown",
75
+ Esc: "Escape",
76
+ " ": "Space",
77
+ ",": "Comma",
78
+ Left: "ArrowLeft",
79
+ Right: "ArrowRight"
80
+ };
81
+ function getEventKey(event, options = {}) {
82
+ var _a;
83
+ const { dir = "ltr", orientation = "horizontal" } = options;
84
+ let { key } = event;
85
+ key = (_a = sameKeyMap[key]) != null ? _a : key;
86
+ const isRtl = dir === "rtl" && orientation === "horizontal";
87
+ if (isRtl && key in rtlKeyMap) {
88
+ key = rtlKeyMap[key];
89
+ }
90
+ return key;
91
+ }
92
+ var PAGE_KEYS = /* @__PURE__ */ new Set(["PageUp", "PageDown"]);
93
+ var ARROW_KEYS = /* @__PURE__ */ new Set(["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"]);
94
+ function getEventStep(event) {
95
+ if (event.ctrlKey || event.metaKey) {
96
+ return 0.1;
97
+ } else {
98
+ const isPageKey = PAGE_KEYS.has(event.key);
99
+ const isSkipKey = isPageKey || event.shiftKey && ARROW_KEYS.has(event.key);
100
+ return isSkipKey ? 10 : 1;
101
+ }
102
+ }
103
+
104
+ // ../../utilities/dom/src/nodelist.ts
105
+ function queryAll(root, selector) {
106
+ var _a;
107
+ return Array.from((_a = root == null ? void 0 : root.querySelectorAll(selector)) != null ? _a : []);
108
+ }
109
+
110
+ // src/splitter.anatomy.ts
111
+ var import_anatomy = require("@zag-js/anatomy");
112
+ var anatomy = (0, import_anatomy.createAnatomy)("splitter").parts("root", "panel", "toggleTrigger", "resizeTrigger");
113
+ var parts = anatomy.build();
114
+
115
+ // src/splitter.dom.ts
116
+ var dom = defineDomHelpers({
117
+ getRootId: (ctx) => `splitter:${ctx.id}`,
118
+ getResizeTriggerId: (ctx, id) => `splitter:${ctx.id}:splitter:${id}`,
119
+ getToggleTriggerId: (ctx) => `splitter:${ctx.id}:toggle-btn`,
120
+ getLabelId: (ctx) => `splitter:${ctx.id}:label`,
121
+ getPanelId: (ctx, id) => `splitter:${ctx.id}:panel:${id}`,
122
+ globalCursorId: (ctx) => `splitter:${ctx.id}:global-cursor`,
123
+ getRootEl: (ctx) => dom.getById(ctx, dom.getRootId(ctx)),
124
+ getResizeTriggerEl: (ctx, id) => dom.getById(ctx, dom.getResizeTriggerId(ctx, id)),
125
+ getPanelEl: (ctx, id) => dom.getById(ctx, dom.getPanelId(ctx, id)),
126
+ getCursor(ctx) {
127
+ const x = ctx.isHorizontal;
128
+ let cursor = x ? "col-resize" : "row-resize";
129
+ if (ctx.activeResizeState.isAtMin)
130
+ cursor = x ? "e-resize" : "s-resize";
131
+ if (ctx.activeResizeState.isAtMax)
132
+ cursor = x ? "w-resize" : "n-resize";
133
+ return cursor;
134
+ },
135
+ getPanelStyle(ctx, id) {
136
+ var _a, _b;
137
+ const flexGrow = (_b = (_a = ctx.panels.find((panel) => panel.id === id)) == null ? void 0 : _a.size) != null ? _b : "0";
138
+ return {
139
+ flexBasis: 0,
140
+ flexGrow,
141
+ flexShrink: 1,
142
+ overflow: "hidden"
143
+ };
144
+ },
145
+ getActiveHandleEl(ctx) {
146
+ const activeId = ctx.activeResizeId;
147
+ if (activeId == null)
148
+ return;
149
+ return dom.getById(ctx, dom.getResizeTriggerId(ctx, activeId));
150
+ },
151
+ getResizeTriggerEls(ctx) {
152
+ const ownerId = CSS.escape(dom.getRootId(ctx));
153
+ return queryAll(dom.getRootEl(ctx), `[role=separator][data-ownedby='${ownerId}']`);
154
+ },
155
+ setupGlobalCursor(ctx) {
156
+ const styleEl = dom.getById(ctx, dom.globalCursorId(ctx));
157
+ const textContent = `* { cursor: ${dom.getCursor(ctx)} !important; }`;
158
+ if (styleEl) {
159
+ styleEl.textContent = textContent;
160
+ } else {
161
+ const style = dom.getDoc(ctx).createElement("style");
162
+ style.id = dom.globalCursorId(ctx);
163
+ style.textContent = textContent;
164
+ dom.getDoc(ctx).head.appendChild(style);
165
+ }
166
+ },
167
+ removeGlobalCursor(ctx) {
168
+ var _a;
169
+ (_a = dom.getById(ctx, dom.globalCursorId(ctx))) == null ? void 0 : _a.remove();
170
+ }
171
+ });
172
+
173
+ // src/splitter.utils.ts
174
+ function getHandlePanels(ctx, id = ctx.activeResizeId) {
175
+ var _a;
176
+ const [beforeId, afterId] = (_a = id == null ? void 0 : id.split(":")) != null ? _a : [];
177
+ if (!beforeId || !afterId)
178
+ return;
179
+ const beforeIndex = ctx.previousPanels.findIndex((panel) => panel.id === beforeId);
180
+ const afterIndex = ctx.previousPanels.findIndex((panel) => panel.id === afterId);
181
+ if (beforeIndex === -1 || afterIndex === -1)
182
+ return;
183
+ const before = ctx.previousPanels[beforeIndex];
184
+ const after = ctx.previousPanels[afterIndex];
185
+ return {
186
+ before: {
187
+ ...before,
188
+ index: beforeIndex
189
+ },
190
+ after: {
191
+ ...after,
192
+ index: afterIndex
193
+ }
194
+ };
195
+ }
196
+ function getHandleBounds(ctx, id = ctx.activeResizeId) {
197
+ const panels = getHandlePanels(ctx, id);
198
+ if (!panels)
199
+ return;
200
+ const { before, after } = panels;
201
+ return {
202
+ min: Math.max(before.start + before.minSize, after.end - after.maxSize),
203
+ max: Math.min(after.end - after.minSize, before.maxSize + before.start)
204
+ };
205
+ }
206
+
207
+ // src/splitter.connect.ts
208
+ function connect(state, send, normalize) {
209
+ const isHorizontal = state.context.isHorizontal;
210
+ const isFocused = state.hasTag("focus");
211
+ const isDragging = state.matches("dragging");
212
+ return {
213
+ isFocused,
214
+ isDragging,
215
+ bounds: getHandleBounds(state.context),
216
+ collapse(id) {
217
+ send({ type: "COLLAPSE", id });
218
+ },
219
+ expand(id) {
220
+ send({ type: "EXPAND", id });
221
+ },
222
+ toggle(id) {
223
+ send({ type: "TOGGLE", id });
224
+ },
225
+ setSize(id, size) {
226
+ send({ type: "SET_SIZE", id, size });
227
+ },
228
+ rootProps: normalize.element({
229
+ ...parts.root.attrs,
230
+ "data-orientation": state.context.orientation,
231
+ id: dom.getRootId(state.context),
232
+ dir: state.context.dir,
233
+ style: {
234
+ display: "flex",
235
+ flexDirection: isHorizontal ? "row" : "column",
236
+ height: "100%",
237
+ width: "100%",
238
+ overflow: "hidden"
239
+ }
240
+ }),
241
+ getPanelProps(props) {
242
+ const { id } = props;
243
+ return normalize.element({
244
+ ...parts.panel.attrs,
245
+ dir: state.context.dir,
246
+ id: dom.getPanelId(state.context, id),
247
+ "data-ownedby": dom.getRootId(state.context),
248
+ style: dom.getPanelStyle(state.context, id)
249
+ });
250
+ },
251
+ getResizeTriggerState(id) {
252
+ const ids = id.split(":");
253
+ const panelIds = ids.map((id2) => dom.getPanelId(state.context, id2));
254
+ const panels = getHandleBounds(state.context, id);
255
+ return {
256
+ isFocused: state.context.activeResizeId === id && isFocused,
257
+ panelIds,
258
+ min: panels == null ? void 0 : panels.min,
259
+ max: panels == null ? void 0 : panels.max,
260
+ value: 0
261
+ };
262
+ },
263
+ getResizeTriggerProps(props) {
264
+ const { id, disabled, step = 1 } = props;
265
+ const triggerState = this.getResizeTriggerState(id);
266
+ return normalize.element({
267
+ ...parts.resizeTrigger.attrs,
268
+ dir: state.context.dir,
269
+ id: dom.getResizeTriggerId(state.context, id),
270
+ role: "separator",
271
+ "data-ownedby": dom.getRootId(state.context),
272
+ tabIndex: disabled ? void 0 : 0,
273
+ "aria-valuenow": triggerState.value,
274
+ "aria-valuemin": triggerState.min,
275
+ "aria-valuemax": triggerState.max,
276
+ "data-orientation": state.context.orientation,
277
+ "aria-orientation": state.context.orientation,
278
+ "aria-controls": triggerState.panelIds.join(" "),
279
+ "data-focus": dataAttr(triggerState.isFocused),
280
+ "data-disabled": dataAttr(disabled),
281
+ style: {
282
+ touchAction: "none",
283
+ userSelect: "none",
284
+ flex: "0 0 auto",
285
+ pointerEvents: isDragging && !triggerState.isFocused ? "none" : void 0,
286
+ cursor: isHorizontal ? "col-resize" : "row-resize",
287
+ [isHorizontal ? "minHeight" : "minWidth"]: "0"
288
+ },
289
+ onPointerDown(event) {
290
+ if (disabled) {
291
+ event.preventDefault();
292
+ return;
293
+ }
294
+ send({ type: "POINTER_DOWN", id });
295
+ event.preventDefault();
296
+ event.stopPropagation();
297
+ },
298
+ onPointerOver() {
299
+ if (disabled)
300
+ return;
301
+ send({ type: "POINTER_OVER", id });
302
+ },
303
+ onPointerLeave() {
304
+ if (disabled)
305
+ return;
306
+ send({ type: "POINTER_LEAVE", id });
307
+ },
308
+ onBlur() {
309
+ send("BLUR");
310
+ },
311
+ onFocus() {
312
+ send({ type: "FOCUS", id });
313
+ },
314
+ onDoubleClick() {
315
+ if (disabled)
316
+ return;
317
+ send({ type: "DOUBLE_CLICK", id });
318
+ },
319
+ onKeyDown(event) {
320
+ if (disabled)
321
+ return;
322
+ const moveStep = getEventStep(event) * step;
323
+ const keyMap = {
324
+ Enter() {
325
+ send("ENTER");
326
+ },
327
+ ArrowUp() {
328
+ send({ type: "ARROW_UP", step: moveStep });
329
+ },
330
+ ArrowDown() {
331
+ send({ type: "ARROW_DOWN", step: moveStep });
332
+ },
333
+ ArrowLeft() {
334
+ send({ type: "ARROW_LEFT", step: moveStep });
335
+ },
336
+ ArrowRight() {
337
+ send({ type: "ARROW_RIGHT", step: moveStep });
338
+ },
339
+ Home() {
340
+ send("HOME");
341
+ },
342
+ End() {
343
+ send("END");
344
+ }
345
+ };
346
+ const key = getEventKey(event, state.context);
347
+ const exec = keyMap[key];
348
+ if (exec) {
349
+ exec(event);
350
+ event.preventDefault();
351
+ }
352
+ }
353
+ });
354
+ }
355
+ };
356
+ }
357
+ // Annotate the CommonJS export names for ESM import in node:
358
+ 0 && (module.exports = {
359
+ connect
360
+ });
@@ -0,0 +1,9 @@
1
+ import {
2
+ connect
3
+ } from "./chunk-X2M4RMIJ.mjs";
4
+ import "./chunk-HPRMFGOY.mjs";
5
+ import "./chunk-T56NFB6E.mjs";
6
+ import "./chunk-SQ3UMXCZ.mjs";
7
+ export {
8
+ connect
9
+ };
@@ -0,0 +1,39 @@
1
+ import { JSX } from '@zag-js/types';
2
+ import { MachineContext, PanelId } from './splitter.types.js';
3
+ import '@zag-js/core';
4
+
5
+ declare const dom: {
6
+ getRootNode: (ctx: {
7
+ getRootNode?: (() => Node | Document | ShadowRoot) | undefined;
8
+ }) => Document | ShadowRoot;
9
+ getDoc: (ctx: {
10
+ getRootNode?: (() => Node | Document | ShadowRoot) | undefined;
11
+ }) => Document;
12
+ getWin: (ctx: {
13
+ getRootNode?: (() => Node | Document | ShadowRoot) | undefined;
14
+ }) => Window & typeof globalThis;
15
+ getActiveElement: (ctx: {
16
+ getRootNode?: (() => Node | Document | ShadowRoot) | undefined;
17
+ }) => HTMLElement | null;
18
+ getById: <T = HTMLElement>(ctx: {
19
+ getRootNode?: (() => Node | Document | ShadowRoot) | undefined;
20
+ }, id: string) => T | null;
21
+ } & {
22
+ getRootId: (ctx: MachineContext) => string;
23
+ getResizeTriggerId: (ctx: MachineContext, id: string) => string;
24
+ getToggleTriggerId: (ctx: MachineContext) => string;
25
+ getLabelId: (ctx: MachineContext) => string;
26
+ getPanelId: (ctx: MachineContext, id: string | number) => string;
27
+ globalCursorId: (ctx: MachineContext) => string;
28
+ getRootEl: (ctx: MachineContext) => HTMLElement | null;
29
+ getResizeTriggerEl: (ctx: MachineContext, id: string) => HTMLElement | null;
30
+ getPanelEl: (ctx: MachineContext, id: string | number) => HTMLElement | null;
31
+ getCursor(ctx: MachineContext): (string & {}) | "col-resize" | "e-resize" | "n-resize" | "row-resize" | "s-resize" | "w-resize";
32
+ getPanelStyle(ctx: MachineContext, id: PanelId): JSX.CSSProperties;
33
+ getActiveHandleEl(ctx: MachineContext): HTMLElement | null | undefined;
34
+ getResizeTriggerEls(ctx: MachineContext): HTMLElement[];
35
+ setupGlobalCursor(ctx: MachineContext): void;
36
+ removeGlobalCursor(ctx: MachineContext): void;
37
+ };
38
+
39
+ export { dom };
@@ -0,0 +1,128 @@
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/splitter.dom.ts
21
+ var splitter_dom_exports = {};
22
+ __export(splitter_dom_exports, {
23
+ dom: () => dom
24
+ });
25
+ module.exports = __toCommonJS(splitter_dom_exports);
26
+
27
+ // ../../utilities/dom/src/query.ts
28
+ function isDocument(el) {
29
+ return el.nodeType === Node.DOCUMENT_NODE;
30
+ }
31
+ function isWindow(value) {
32
+ return (value == null ? void 0 : value.toString()) === "[object Window]";
33
+ }
34
+ function getDocument(el) {
35
+ var _a;
36
+ if (isWindow(el))
37
+ return el.document;
38
+ if (isDocument(el))
39
+ return el;
40
+ return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
41
+ }
42
+ function defineDomHelpers(helpers) {
43
+ 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
+ },
48
+ getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
49
+ getWin: (ctx) => {
50
+ var _a;
51
+ return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
52
+ },
53
+ getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
54
+ getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
55
+ };
56
+ return {
57
+ ...dom2,
58
+ ...helpers
59
+ };
60
+ }
61
+
62
+ // ../../utilities/dom/src/nodelist.ts
63
+ function queryAll(root, selector) {
64
+ var _a;
65
+ return Array.from((_a = root == null ? void 0 : root.querySelectorAll(selector)) != null ? _a : []);
66
+ }
67
+
68
+ // src/splitter.dom.ts
69
+ var dom = defineDomHelpers({
70
+ getRootId: (ctx) => `splitter:${ctx.id}`,
71
+ getResizeTriggerId: (ctx, id) => `splitter:${ctx.id}:splitter:${id}`,
72
+ getToggleTriggerId: (ctx) => `splitter:${ctx.id}:toggle-btn`,
73
+ getLabelId: (ctx) => `splitter:${ctx.id}:label`,
74
+ getPanelId: (ctx, id) => `splitter:${ctx.id}:panel:${id}`,
75
+ globalCursorId: (ctx) => `splitter:${ctx.id}:global-cursor`,
76
+ getRootEl: (ctx) => dom.getById(ctx, dom.getRootId(ctx)),
77
+ getResizeTriggerEl: (ctx, id) => dom.getById(ctx, dom.getResizeTriggerId(ctx, id)),
78
+ getPanelEl: (ctx, id) => dom.getById(ctx, dom.getPanelId(ctx, id)),
79
+ getCursor(ctx) {
80
+ const x = ctx.isHorizontal;
81
+ let cursor = x ? "col-resize" : "row-resize";
82
+ if (ctx.activeResizeState.isAtMin)
83
+ cursor = x ? "e-resize" : "s-resize";
84
+ if (ctx.activeResizeState.isAtMax)
85
+ cursor = x ? "w-resize" : "n-resize";
86
+ return cursor;
87
+ },
88
+ getPanelStyle(ctx, id) {
89
+ var _a, _b;
90
+ const flexGrow = (_b = (_a = ctx.panels.find((panel) => panel.id === id)) == null ? void 0 : _a.size) != null ? _b : "0";
91
+ return {
92
+ flexBasis: 0,
93
+ flexGrow,
94
+ flexShrink: 1,
95
+ overflow: "hidden"
96
+ };
97
+ },
98
+ getActiveHandleEl(ctx) {
99
+ const activeId = ctx.activeResizeId;
100
+ if (activeId == null)
101
+ return;
102
+ return dom.getById(ctx, dom.getResizeTriggerId(ctx, activeId));
103
+ },
104
+ getResizeTriggerEls(ctx) {
105
+ const ownerId = CSS.escape(dom.getRootId(ctx));
106
+ return queryAll(dom.getRootEl(ctx), `[role=separator][data-ownedby='${ownerId}']`);
107
+ },
108
+ setupGlobalCursor(ctx) {
109
+ const styleEl = dom.getById(ctx, dom.globalCursorId(ctx));
110
+ const textContent = `* { cursor: ${dom.getCursor(ctx)} !important; }`;
111
+ if (styleEl) {
112
+ styleEl.textContent = textContent;
113
+ } else {
114
+ const style = dom.getDoc(ctx).createElement("style");
115
+ style.id = dom.globalCursorId(ctx);
116
+ style.textContent = textContent;
117
+ dom.getDoc(ctx).head.appendChild(style);
118
+ }
119
+ },
120
+ removeGlobalCursor(ctx) {
121
+ var _a;
122
+ (_a = dom.getById(ctx, dom.globalCursorId(ctx))) == null ? void 0 : _a.remove();
123
+ }
124
+ });
125
+ // Annotate the CommonJS export names for ESM import in node:
126
+ 0 && (module.exports = {
127
+ dom
128
+ });
@@ -0,0 +1,6 @@
1
+ import {
2
+ dom
3
+ } from "./chunk-T56NFB6E.mjs";
4
+ export {
5
+ dom
6
+ };
@@ -0,0 +1,7 @@
1
+ import * as _zag_js_core from '@zag-js/core';
2
+ import { UserDefinedContext, MachineContext, MachineState } from './splitter.types.js';
3
+ import '@zag-js/types';
4
+
5
+ declare function machine(userContext: UserDefinedContext): _zag_js_core.Machine<MachineContext, MachineState, _zag_js_core.StateMachine.AnyEventObject>;
6
+
7
+ export { machine };