@zag-js/splitter 0.1.11 → 0.1.12

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 (3) hide show
  1. package/dist/index.js +193 -184
  2. package/dist/index.mjs +193 -184
  3. package/package.json +3 -3
package/dist/index.js CHANGED
@@ -292,7 +292,13 @@ function trackPointerMove(doc, opts) {
292
292
  }
293
293
  onPointerMove(info, event);
294
294
  };
295
- return callAll(addPointerEvent(doc, "pointermove", handlePointerMove, false), addPointerEvent(doc, "pointerup", onPointerUp, false), addPointerEvent(doc, "pointercancel", onPointerUp, false), addPointerEvent(doc, "contextmenu", onPointerUp, false), disableTextSelection({ doc }));
295
+ return callAll(
296
+ addPointerEvent(doc, "pointermove", handlePointerMove, false),
297
+ addPointerEvent(doc, "pointerup", onPointerUp, false),
298
+ addPointerEvent(doc, "pointercancel", onPointerUp, false),
299
+ addPointerEvent(doc, "contextmenu", onPointerUp, false),
300
+ disableTextSelection({ doc })
301
+ );
296
302
  }
297
303
 
298
304
  // src/splitter.dom.ts
@@ -554,213 +560,216 @@ var nf = new Intl.NumberFormat("en-US", { style: "decimal", maximumFractionDigit
554
560
  // src/splitter.machine.ts
555
561
  var { not } = import_core.guards;
556
562
  function machine(ctx) {
557
- return (0, import_core.createMachine)({
558
- id: "splitter",
559
- initial: "unknown",
560
- context: {
561
- orientation: "horizontal",
562
- min: 224,
563
- max: 340,
564
- step: 1,
565
- value: 256,
566
- snapOffset: 0,
567
- ...ctx
568
- },
569
- computed: {
570
- isHorizontal: (ctx2) => ctx2.orientation === "horizontal",
571
- isAtMin: (ctx2) => ctx2.value === ctx2.min,
572
- isAtMax: (ctx2) => ctx2.value === ctx2.max
573
- },
574
- on: {
575
- COLLAPSE: {
576
- actions: "setToMin"
563
+ return (0, import_core.createMachine)(
564
+ {
565
+ id: "splitter",
566
+ initial: "unknown",
567
+ context: {
568
+ orientation: "horizontal",
569
+ min: 224,
570
+ max: 340,
571
+ step: 1,
572
+ value: 256,
573
+ snapOffset: 0,
574
+ ...ctx
577
575
  },
578
- EXPAND: {
579
- actions: "setToMax"
576
+ computed: {
577
+ isHorizontal: (ctx2) => ctx2.orientation === "horizontal",
578
+ isAtMin: (ctx2) => ctx2.value === ctx2.min,
579
+ isAtMax: (ctx2) => ctx2.value === ctx2.max
580
580
  },
581
- TOGGLE: [
582
- {
583
- guard: "isCollapsed",
581
+ on: {
582
+ COLLAPSE: {
583
+ actions: "setToMin"
584
+ },
585
+ EXPAND: {
584
586
  actions: "setToMax"
585
587
  },
586
- {
587
- actions: "setToMin"
588
- }
589
- ]
590
- },
591
- states: {
592
- unknown: {
593
- on: {
594
- SETUP: "idle"
595
- }
596
- },
597
- idle: {
598
- on: {
599
- POINTER_OVER: {
600
- guard: not("isFixed"),
601
- target: "hover:temp"
588
+ TOGGLE: [
589
+ {
590
+ guard: "isCollapsed",
591
+ actions: "setToMax"
602
592
  },
603
- POINTER_LEAVE: "idle",
604
- FOCUS: "focused"
605
- }
593
+ {
594
+ actions: "setToMin"
595
+ }
596
+ ]
606
597
  },
607
- "hover:temp": {
608
- after: {
609
- HOVER_DELAY: "hover"
598
+ states: {
599
+ unknown: {
600
+ on: {
601
+ SETUP: "idle"
602
+ }
610
603
  },
611
- on: {
612
- POINTER_DOWN: {
613
- target: "dragging",
614
- actions: ["invokeOnChangeStart"]
615
- },
616
- POINTER_LEAVE: "idle"
617
- }
618
- },
619
- hover: {
620
- tags: ["focus"],
621
- on: {
622
- POINTER_DOWN: {
623
- target: "dragging",
624
- actions: ["invokeOnChangeStart"]
625
- },
626
- POINTER_LEAVE: "idle"
627
- }
628
- },
629
- focused: {
630
- tags: ["focus"],
631
- on: {
632
- BLUR: "idle",
633
- POINTER_DOWN: {
634
- target: "dragging",
635
- actions: ["invokeOnChangeStart"]
636
- },
637
- ARROW_LEFT: {
638
- guard: "isHorizontal",
639
- actions: "decrement"
640
- },
641
- ARROW_RIGHT: {
642
- guard: "isHorizontal",
643
- actions: "increment"
644
- },
645
- ARROW_UP: {
646
- guard: "isVertical",
647
- actions: "increment"
648
- },
649
- ARROW_DOWN: {
650
- guard: "isVertical",
651
- actions: "decrement"
604
+ idle: {
605
+ on: {
606
+ POINTER_OVER: {
607
+ guard: not("isFixed"),
608
+ target: "hover:temp"
609
+ },
610
+ POINTER_LEAVE: "idle",
611
+ FOCUS: "focused"
612
+ }
613
+ },
614
+ "hover:temp": {
615
+ after: {
616
+ HOVER_DELAY: "hover"
652
617
  },
653
- ENTER: [
654
- {
655
- guard: "isCollapsed",
618
+ on: {
619
+ POINTER_DOWN: {
620
+ target: "dragging",
621
+ actions: ["invokeOnChangeStart"]
622
+ },
623
+ POINTER_LEAVE: "idle"
624
+ }
625
+ },
626
+ hover: {
627
+ tags: ["focus"],
628
+ on: {
629
+ POINTER_DOWN: {
630
+ target: "dragging",
631
+ actions: ["invokeOnChangeStart"]
632
+ },
633
+ POINTER_LEAVE: "idle"
634
+ }
635
+ },
636
+ focused: {
637
+ tags: ["focus"],
638
+ on: {
639
+ BLUR: "idle",
640
+ POINTER_DOWN: {
641
+ target: "dragging",
642
+ actions: ["invokeOnChangeStart"]
643
+ },
644
+ ARROW_LEFT: {
645
+ guard: "isHorizontal",
646
+ actions: "decrement"
647
+ },
648
+ ARROW_RIGHT: {
649
+ guard: "isHorizontal",
650
+ actions: "increment"
651
+ },
652
+ ARROW_UP: {
653
+ guard: "isVertical",
654
+ actions: "increment"
655
+ },
656
+ ARROW_DOWN: {
657
+ guard: "isVertical",
658
+ actions: "decrement"
659
+ },
660
+ ENTER: [
661
+ {
662
+ guard: "isCollapsed",
663
+ actions: "setToMin"
664
+ },
665
+ { actions: "setToMin" }
666
+ ],
667
+ HOME: {
656
668
  actions: "setToMin"
657
669
  },
658
- { actions: "setToMin" }
659
- ],
660
- HOME: {
661
- actions: "setToMin"
662
- },
663
- END: {
664
- actions: "setToMax"
665
- },
666
- DOUBLE_CLICK: [
667
- {
668
- guard: "isCollapsed",
670
+ END: {
669
671
  actions: "setToMax"
670
672
  },
671
- { actions: "setToMin" }
672
- ]
673
- }
674
- },
675
- dragging: {
676
- tags: ["focus"],
677
- entry: "focusSplitter",
678
- activities: "trackPointerMove",
679
- on: {
680
- POINTER_UP: {
681
- target: "focused",
682
- actions: ["invokeOnChangeEnd"]
683
- },
684
- POINTER_MOVE: {
685
- actions: "setPointerValue"
673
+ DOUBLE_CLICK: [
674
+ {
675
+ guard: "isCollapsed",
676
+ actions: "setToMax"
677
+ },
678
+ { actions: "setToMin" }
679
+ ]
686
680
  }
687
- }
688
- }
689
- }
690
- }, {
691
- activities: {
692
- trackPointerMove: (ctx2, _evt, { send }) => {
693
- const doc = dom.getDoc(ctx2);
694
- return trackPointerMove(doc, {
695
- onPointerMove(info) {
696
- send({ type: "POINTER_MOVE", point: info.point });
697
- doc.documentElement.style.cursor = dom.getCursor(ctx2);
698
- },
699
- onPointerUp() {
700
- send("POINTER_UP");
701
- doc.documentElement.style.cursor = "";
681
+ },
682
+ dragging: {
683
+ tags: ["focus"],
684
+ entry: "focusSplitter",
685
+ activities: "trackPointerMove",
686
+ on: {
687
+ POINTER_UP: {
688
+ target: "focused",
689
+ actions: ["invokeOnChangeEnd"]
690
+ },
691
+ POINTER_MOVE: {
692
+ actions: "setPointerValue"
693
+ }
702
694
  }
703
- });
695
+ }
704
696
  }
705
697
  },
706
- guards: {
707
- isCollapsed: (ctx2) => ctx2.isAtMin,
708
- isHorizontal: (ctx2) => ctx2.isHorizontal,
709
- isVertical: (ctx2) => !ctx2.isHorizontal,
710
- isFixed: (ctx2) => !!ctx2.fixed
711
- },
712
- delays: {
713
- HOVER_DELAY: 250
714
- },
715
- actions: {
716
- invokeOnChange(ctx2, evt) {
717
- var _a;
718
- if (evt.type !== "SETUP") {
719
- (_a = ctx2.onChange) == null ? void 0 : _a.call(ctx2, { value: ctx2.value });
698
+ {
699
+ activities: {
700
+ trackPointerMove: (ctx2, _evt, { send }) => {
701
+ const doc = dom.getDoc(ctx2);
702
+ return trackPointerMove(doc, {
703
+ onPointerMove(info) {
704
+ send({ type: "POINTER_MOVE", point: info.point });
705
+ doc.documentElement.style.cursor = dom.getCursor(ctx2);
706
+ },
707
+ onPointerUp() {
708
+ send("POINTER_UP");
709
+ doc.documentElement.style.cursor = "";
710
+ }
711
+ });
720
712
  }
721
713
  },
722
- invokeOnChangeStart(ctx2) {
723
- var _a;
724
- (_a = ctx2.onChangeStart) == null ? void 0 : _a.call(ctx2, { value: ctx2.value });
725
- },
726
- invokeOnChangeEnd(ctx2) {
727
- var _a;
728
- (_a = ctx2.onChangeEnd) == null ? void 0 : _a.call(ctx2, { value: ctx2.value });
714
+ guards: {
715
+ isCollapsed: (ctx2) => ctx2.isAtMin,
716
+ isHorizontal: (ctx2) => ctx2.isHorizontal,
717
+ isVertical: (ctx2) => !ctx2.isHorizontal,
718
+ isFixed: (ctx2) => !!ctx2.fixed
729
719
  },
730
- setToMin(ctx2) {
731
- ctx2.value = ctx2.min;
720
+ delays: {
721
+ HOVER_DELAY: 250
732
722
  },
733
- setToMax(ctx2) {
734
- ctx2.value = ctx2.max;
735
- },
736
- increment(ctx2, evt) {
737
- ctx2.value = clamp(increment(ctx2.value, evt.step), ctx2);
738
- },
739
- decrement(ctx2, evt) {
740
- ctx2.value = clamp(decrement(ctx2.value, evt.step), ctx2);
741
- },
742
- focusSplitter(ctx2) {
743
- raf(() => {
723
+ actions: {
724
+ invokeOnChange(ctx2, evt) {
744
725
  var _a;
745
- return (_a = dom.getSplitterEl(ctx2)) == null ? void 0 : _a.focus();
746
- });
747
- },
748
- setPointerValue(ctx2, evt) {
749
- const el = dom.getPrimaryPaneEl(ctx2);
750
- if (!el)
751
- return;
752
- const relativePoint = getPointRelativeToNode(evt.point, el);
753
- let currentPoint = ctx2.isHorizontal ? relativePoint.x : relativePoint.y;
754
- let value = parseFloat(snapToStep(clamp(currentPoint, ctx2), ctx2.step));
755
- if (Math.abs(value - ctx2.min) <= ctx2.snapOffset) {
756
- value = ctx2.min;
757
- } else if (Math.abs(value - ctx2.max) <= ctx2.snapOffset) {
758
- value = ctx2.max;
726
+ if (evt.type !== "SETUP") {
727
+ (_a = ctx2.onChange) == null ? void 0 : _a.call(ctx2, { value: ctx2.value });
728
+ }
729
+ },
730
+ invokeOnChangeStart(ctx2) {
731
+ var _a;
732
+ (_a = ctx2.onChangeStart) == null ? void 0 : _a.call(ctx2, { value: ctx2.value });
733
+ },
734
+ invokeOnChangeEnd(ctx2) {
735
+ var _a;
736
+ (_a = ctx2.onChangeEnd) == null ? void 0 : _a.call(ctx2, { value: ctx2.value });
737
+ },
738
+ setToMin(ctx2) {
739
+ ctx2.value = ctx2.min;
740
+ },
741
+ setToMax(ctx2) {
742
+ ctx2.value = ctx2.max;
743
+ },
744
+ increment(ctx2, evt) {
745
+ ctx2.value = clamp(increment(ctx2.value, evt.step), ctx2);
746
+ },
747
+ decrement(ctx2, evt) {
748
+ ctx2.value = clamp(decrement(ctx2.value, evt.step), ctx2);
749
+ },
750
+ focusSplitter(ctx2) {
751
+ raf(() => {
752
+ var _a;
753
+ return (_a = dom.getSplitterEl(ctx2)) == null ? void 0 : _a.focus();
754
+ });
755
+ },
756
+ setPointerValue(ctx2, evt) {
757
+ const el = dom.getPrimaryPaneEl(ctx2);
758
+ if (!el)
759
+ return;
760
+ const relativePoint = getPointRelativeToNode(evt.point, el);
761
+ let currentPoint = ctx2.isHorizontal ? relativePoint.x : relativePoint.y;
762
+ let value = parseFloat(snapToStep(clamp(currentPoint, ctx2), ctx2.step));
763
+ if (Math.abs(value - ctx2.min) <= ctx2.snapOffset) {
764
+ value = ctx2.min;
765
+ } else if (Math.abs(value - ctx2.max) <= ctx2.snapOffset) {
766
+ value = ctx2.max;
767
+ }
768
+ ctx2.value = value;
759
769
  }
760
- ctx2.value = value;
761
770
  }
762
771
  }
763
- });
772
+ );
764
773
  }
765
774
  // Annotate the CommonJS export names for ESM import in node:
766
775
  0 && (module.exports = {
package/dist/index.mjs CHANGED
@@ -265,7 +265,13 @@ function trackPointerMove(doc, opts) {
265
265
  }
266
266
  onPointerMove(info, event);
267
267
  };
268
- return callAll(addPointerEvent(doc, "pointermove", handlePointerMove, false), addPointerEvent(doc, "pointerup", onPointerUp, false), addPointerEvent(doc, "pointercancel", onPointerUp, false), addPointerEvent(doc, "contextmenu", onPointerUp, false), disableTextSelection({ doc }));
268
+ return callAll(
269
+ addPointerEvent(doc, "pointermove", handlePointerMove, false),
270
+ addPointerEvent(doc, "pointerup", onPointerUp, false),
271
+ addPointerEvent(doc, "pointercancel", onPointerUp, false),
272
+ addPointerEvent(doc, "contextmenu", onPointerUp, false),
273
+ disableTextSelection({ doc })
274
+ );
269
275
  }
270
276
 
271
277
  // src/splitter.dom.ts
@@ -527,213 +533,216 @@ var nf = new Intl.NumberFormat("en-US", { style: "decimal", maximumFractionDigit
527
533
  // src/splitter.machine.ts
528
534
  var { not } = guards;
529
535
  function machine(ctx) {
530
- return createMachine({
531
- id: "splitter",
532
- initial: "unknown",
533
- context: {
534
- orientation: "horizontal",
535
- min: 224,
536
- max: 340,
537
- step: 1,
538
- value: 256,
539
- snapOffset: 0,
540
- ...ctx
541
- },
542
- computed: {
543
- isHorizontal: (ctx2) => ctx2.orientation === "horizontal",
544
- isAtMin: (ctx2) => ctx2.value === ctx2.min,
545
- isAtMax: (ctx2) => ctx2.value === ctx2.max
546
- },
547
- on: {
548
- COLLAPSE: {
549
- actions: "setToMin"
536
+ return createMachine(
537
+ {
538
+ id: "splitter",
539
+ initial: "unknown",
540
+ context: {
541
+ orientation: "horizontal",
542
+ min: 224,
543
+ max: 340,
544
+ step: 1,
545
+ value: 256,
546
+ snapOffset: 0,
547
+ ...ctx
550
548
  },
551
- EXPAND: {
552
- actions: "setToMax"
549
+ computed: {
550
+ isHorizontal: (ctx2) => ctx2.orientation === "horizontal",
551
+ isAtMin: (ctx2) => ctx2.value === ctx2.min,
552
+ isAtMax: (ctx2) => ctx2.value === ctx2.max
553
553
  },
554
- TOGGLE: [
555
- {
556
- guard: "isCollapsed",
554
+ on: {
555
+ COLLAPSE: {
556
+ actions: "setToMin"
557
+ },
558
+ EXPAND: {
557
559
  actions: "setToMax"
558
560
  },
559
- {
560
- actions: "setToMin"
561
- }
562
- ]
563
- },
564
- states: {
565
- unknown: {
566
- on: {
567
- SETUP: "idle"
568
- }
569
- },
570
- idle: {
571
- on: {
572
- POINTER_OVER: {
573
- guard: not("isFixed"),
574
- target: "hover:temp"
561
+ TOGGLE: [
562
+ {
563
+ guard: "isCollapsed",
564
+ actions: "setToMax"
575
565
  },
576
- POINTER_LEAVE: "idle",
577
- FOCUS: "focused"
578
- }
566
+ {
567
+ actions: "setToMin"
568
+ }
569
+ ]
579
570
  },
580
- "hover:temp": {
581
- after: {
582
- HOVER_DELAY: "hover"
571
+ states: {
572
+ unknown: {
573
+ on: {
574
+ SETUP: "idle"
575
+ }
583
576
  },
584
- on: {
585
- POINTER_DOWN: {
586
- target: "dragging",
587
- actions: ["invokeOnChangeStart"]
588
- },
589
- POINTER_LEAVE: "idle"
590
- }
591
- },
592
- hover: {
593
- tags: ["focus"],
594
- on: {
595
- POINTER_DOWN: {
596
- target: "dragging",
597
- actions: ["invokeOnChangeStart"]
598
- },
599
- POINTER_LEAVE: "idle"
600
- }
601
- },
602
- focused: {
603
- tags: ["focus"],
604
- on: {
605
- BLUR: "idle",
606
- POINTER_DOWN: {
607
- target: "dragging",
608
- actions: ["invokeOnChangeStart"]
609
- },
610
- ARROW_LEFT: {
611
- guard: "isHorizontal",
612
- actions: "decrement"
613
- },
614
- ARROW_RIGHT: {
615
- guard: "isHorizontal",
616
- actions: "increment"
617
- },
618
- ARROW_UP: {
619
- guard: "isVertical",
620
- actions: "increment"
621
- },
622
- ARROW_DOWN: {
623
- guard: "isVertical",
624
- actions: "decrement"
577
+ idle: {
578
+ on: {
579
+ POINTER_OVER: {
580
+ guard: not("isFixed"),
581
+ target: "hover:temp"
582
+ },
583
+ POINTER_LEAVE: "idle",
584
+ FOCUS: "focused"
585
+ }
586
+ },
587
+ "hover:temp": {
588
+ after: {
589
+ HOVER_DELAY: "hover"
625
590
  },
626
- ENTER: [
627
- {
628
- guard: "isCollapsed",
591
+ on: {
592
+ POINTER_DOWN: {
593
+ target: "dragging",
594
+ actions: ["invokeOnChangeStart"]
595
+ },
596
+ POINTER_LEAVE: "idle"
597
+ }
598
+ },
599
+ hover: {
600
+ tags: ["focus"],
601
+ on: {
602
+ POINTER_DOWN: {
603
+ target: "dragging",
604
+ actions: ["invokeOnChangeStart"]
605
+ },
606
+ POINTER_LEAVE: "idle"
607
+ }
608
+ },
609
+ focused: {
610
+ tags: ["focus"],
611
+ on: {
612
+ BLUR: "idle",
613
+ POINTER_DOWN: {
614
+ target: "dragging",
615
+ actions: ["invokeOnChangeStart"]
616
+ },
617
+ ARROW_LEFT: {
618
+ guard: "isHorizontal",
619
+ actions: "decrement"
620
+ },
621
+ ARROW_RIGHT: {
622
+ guard: "isHorizontal",
623
+ actions: "increment"
624
+ },
625
+ ARROW_UP: {
626
+ guard: "isVertical",
627
+ actions: "increment"
628
+ },
629
+ ARROW_DOWN: {
630
+ guard: "isVertical",
631
+ actions: "decrement"
632
+ },
633
+ ENTER: [
634
+ {
635
+ guard: "isCollapsed",
636
+ actions: "setToMin"
637
+ },
638
+ { actions: "setToMin" }
639
+ ],
640
+ HOME: {
629
641
  actions: "setToMin"
630
642
  },
631
- { actions: "setToMin" }
632
- ],
633
- HOME: {
634
- actions: "setToMin"
635
- },
636
- END: {
637
- actions: "setToMax"
638
- },
639
- DOUBLE_CLICK: [
640
- {
641
- guard: "isCollapsed",
643
+ END: {
642
644
  actions: "setToMax"
643
645
  },
644
- { actions: "setToMin" }
645
- ]
646
- }
647
- },
648
- dragging: {
649
- tags: ["focus"],
650
- entry: "focusSplitter",
651
- activities: "trackPointerMove",
652
- on: {
653
- POINTER_UP: {
654
- target: "focused",
655
- actions: ["invokeOnChangeEnd"]
656
- },
657
- POINTER_MOVE: {
658
- actions: "setPointerValue"
646
+ DOUBLE_CLICK: [
647
+ {
648
+ guard: "isCollapsed",
649
+ actions: "setToMax"
650
+ },
651
+ { actions: "setToMin" }
652
+ ]
659
653
  }
660
- }
661
- }
662
- }
663
- }, {
664
- activities: {
665
- trackPointerMove: (ctx2, _evt, { send }) => {
666
- const doc = dom.getDoc(ctx2);
667
- return trackPointerMove(doc, {
668
- onPointerMove(info) {
669
- send({ type: "POINTER_MOVE", point: info.point });
670
- doc.documentElement.style.cursor = dom.getCursor(ctx2);
671
- },
672
- onPointerUp() {
673
- send("POINTER_UP");
674
- doc.documentElement.style.cursor = "";
654
+ },
655
+ dragging: {
656
+ tags: ["focus"],
657
+ entry: "focusSplitter",
658
+ activities: "trackPointerMove",
659
+ on: {
660
+ POINTER_UP: {
661
+ target: "focused",
662
+ actions: ["invokeOnChangeEnd"]
663
+ },
664
+ POINTER_MOVE: {
665
+ actions: "setPointerValue"
666
+ }
675
667
  }
676
- });
668
+ }
677
669
  }
678
670
  },
679
- guards: {
680
- isCollapsed: (ctx2) => ctx2.isAtMin,
681
- isHorizontal: (ctx2) => ctx2.isHorizontal,
682
- isVertical: (ctx2) => !ctx2.isHorizontal,
683
- isFixed: (ctx2) => !!ctx2.fixed
684
- },
685
- delays: {
686
- HOVER_DELAY: 250
687
- },
688
- actions: {
689
- invokeOnChange(ctx2, evt) {
690
- var _a;
691
- if (evt.type !== "SETUP") {
692
- (_a = ctx2.onChange) == null ? void 0 : _a.call(ctx2, { value: ctx2.value });
671
+ {
672
+ activities: {
673
+ trackPointerMove: (ctx2, _evt, { send }) => {
674
+ const doc = dom.getDoc(ctx2);
675
+ return trackPointerMove(doc, {
676
+ onPointerMove(info) {
677
+ send({ type: "POINTER_MOVE", point: info.point });
678
+ doc.documentElement.style.cursor = dom.getCursor(ctx2);
679
+ },
680
+ onPointerUp() {
681
+ send("POINTER_UP");
682
+ doc.documentElement.style.cursor = "";
683
+ }
684
+ });
693
685
  }
694
686
  },
695
- invokeOnChangeStart(ctx2) {
696
- var _a;
697
- (_a = ctx2.onChangeStart) == null ? void 0 : _a.call(ctx2, { value: ctx2.value });
698
- },
699
- invokeOnChangeEnd(ctx2) {
700
- var _a;
701
- (_a = ctx2.onChangeEnd) == null ? void 0 : _a.call(ctx2, { value: ctx2.value });
687
+ guards: {
688
+ isCollapsed: (ctx2) => ctx2.isAtMin,
689
+ isHorizontal: (ctx2) => ctx2.isHorizontal,
690
+ isVertical: (ctx2) => !ctx2.isHorizontal,
691
+ isFixed: (ctx2) => !!ctx2.fixed
702
692
  },
703
- setToMin(ctx2) {
704
- ctx2.value = ctx2.min;
693
+ delays: {
694
+ HOVER_DELAY: 250
705
695
  },
706
- setToMax(ctx2) {
707
- ctx2.value = ctx2.max;
708
- },
709
- increment(ctx2, evt) {
710
- ctx2.value = clamp(increment(ctx2.value, evt.step), ctx2);
711
- },
712
- decrement(ctx2, evt) {
713
- ctx2.value = clamp(decrement(ctx2.value, evt.step), ctx2);
714
- },
715
- focusSplitter(ctx2) {
716
- raf(() => {
696
+ actions: {
697
+ invokeOnChange(ctx2, evt) {
717
698
  var _a;
718
- return (_a = dom.getSplitterEl(ctx2)) == null ? void 0 : _a.focus();
719
- });
720
- },
721
- setPointerValue(ctx2, evt) {
722
- const el = dom.getPrimaryPaneEl(ctx2);
723
- if (!el)
724
- return;
725
- const relativePoint = getPointRelativeToNode(evt.point, el);
726
- let currentPoint = ctx2.isHorizontal ? relativePoint.x : relativePoint.y;
727
- let value = parseFloat(snapToStep(clamp(currentPoint, ctx2), ctx2.step));
728
- if (Math.abs(value - ctx2.min) <= ctx2.snapOffset) {
729
- value = ctx2.min;
730
- } else if (Math.abs(value - ctx2.max) <= ctx2.snapOffset) {
731
- value = ctx2.max;
699
+ if (evt.type !== "SETUP") {
700
+ (_a = ctx2.onChange) == null ? void 0 : _a.call(ctx2, { value: ctx2.value });
701
+ }
702
+ },
703
+ invokeOnChangeStart(ctx2) {
704
+ var _a;
705
+ (_a = ctx2.onChangeStart) == null ? void 0 : _a.call(ctx2, { value: ctx2.value });
706
+ },
707
+ invokeOnChangeEnd(ctx2) {
708
+ var _a;
709
+ (_a = ctx2.onChangeEnd) == null ? void 0 : _a.call(ctx2, { value: ctx2.value });
710
+ },
711
+ setToMin(ctx2) {
712
+ ctx2.value = ctx2.min;
713
+ },
714
+ setToMax(ctx2) {
715
+ ctx2.value = ctx2.max;
716
+ },
717
+ increment(ctx2, evt) {
718
+ ctx2.value = clamp(increment(ctx2.value, evt.step), ctx2);
719
+ },
720
+ decrement(ctx2, evt) {
721
+ ctx2.value = clamp(decrement(ctx2.value, evt.step), ctx2);
722
+ },
723
+ focusSplitter(ctx2) {
724
+ raf(() => {
725
+ var _a;
726
+ return (_a = dom.getSplitterEl(ctx2)) == null ? void 0 : _a.focus();
727
+ });
728
+ },
729
+ setPointerValue(ctx2, evt) {
730
+ const el = dom.getPrimaryPaneEl(ctx2);
731
+ if (!el)
732
+ return;
733
+ const relativePoint = getPointRelativeToNode(evt.point, el);
734
+ let currentPoint = ctx2.isHorizontal ? relativePoint.x : relativePoint.y;
735
+ let value = parseFloat(snapToStep(clamp(currentPoint, ctx2), ctx2.step));
736
+ if (Math.abs(value - ctx2.min) <= ctx2.snapOffset) {
737
+ value = ctx2.min;
738
+ } else if (Math.abs(value - ctx2.max) <= ctx2.snapOffset) {
739
+ value = ctx2.max;
740
+ }
741
+ ctx2.value = value;
732
742
  }
733
- ctx2.value = value;
734
743
  }
735
744
  }
736
- });
745
+ );
737
746
  }
738
747
  export {
739
748
  connect,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zag-js/splitter",
3
- "version": "0.1.11",
3
+ "version": "0.1.12",
4
4
  "description": "Core logic for the splitter widget implemented as a state machine",
5
5
  "keywords": [
6
6
  "js",
@@ -31,10 +31,10 @@
31
31
  },
32
32
  "dependencies": {
33
33
  "@zag-js/core": "0.1.9",
34
- "@zag-js/types": "0.2.3"
34
+ "@zag-js/types": "0.2.4"
35
35
  },
36
36
  "devDependencies": {
37
- "@zag-js/dom-utils": "0.1.8",
37
+ "@zag-js/dom-utils": "0.1.10",
38
38
  "@zag-js/number-utils": "0.1.3"
39
39
  },
40
40
  "scripts": {