@rcarls/rc-splitter 0.3.1 → 0.4.0
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/README.md +103 -61
- package/dist/custom-elements.json +255 -27
- package/dist/{rc-splitter-BZgnDbmR.js → rc-splitter-CJTLxYi3.js} +265 -130
- package/dist/rc-splitter-CJTLxYi3.js.map +1 -0
- package/dist/rc-splitter-define.js +1 -1
- package/dist/rc-splitter.js +1 -1
- package/dist/types/packages/rc-splitter/src/rc-splitter.d.ts +68 -13
- package/package.json +1 -1
- package/dist/rc-splitter-BZgnDbmR.js.map +0 -1
|
@@ -46,7 +46,7 @@
|
|
|
46
46
|
"declarations": [
|
|
47
47
|
{
|
|
48
48
|
"kind": "class",
|
|
49
|
-
"description": "Resizable pane splitter with pointer, keyboard, and
|
|
49
|
+
"description": "Resizable pane splitter with pointer, keyboard, anchored settling, and\ncollapse/restore controls, following the WAI-ARIA Window Splitter pattern.\n\nSet `orientation=\"vertical\"` for a vertical splitter",
|
|
50
50
|
"name": "RCSplitter",
|
|
51
51
|
"cssProperties": [
|
|
52
52
|
{
|
|
@@ -104,6 +104,11 @@
|
|
|
104
104
|
"name": "--rc-splitter-handle-transition",
|
|
105
105
|
"default": "0ms"
|
|
106
106
|
},
|
|
107
|
+
{
|
|
108
|
+
"description": "Duration of anchored settling after pointer release or `snapTo()`",
|
|
109
|
+
"name": "--rc-splitter-snap-duration",
|
|
110
|
+
"default": "200ms"
|
|
111
|
+
},
|
|
107
112
|
{
|
|
108
113
|
"description": "Diameter of the collapse/expand toggle button",
|
|
109
114
|
"name": "--rc-splitter-collapse-button-size",
|
|
@@ -194,7 +199,7 @@
|
|
|
194
199
|
"type": {
|
|
195
200
|
"text": "string"
|
|
196
201
|
},
|
|
197
|
-
"default": "
|
|
202
|
+
"default": "'Splitter'",
|
|
198
203
|
"description": "Accessible label for this splitter. Default label is 'Splitter'.",
|
|
199
204
|
"attribute": "label"
|
|
200
205
|
},
|
|
@@ -204,7 +209,7 @@
|
|
|
204
209
|
"type": {
|
|
205
210
|
"text": "SplitterOrientation"
|
|
206
211
|
},
|
|
207
|
-
"default": "
|
|
212
|
+
"default": "'horizontal'",
|
|
208
213
|
"description": "Splitter orientation, for keyboard navigation and initial sizing.",
|
|
209
214
|
"attribute": "orientation",
|
|
210
215
|
"reflects": true
|
|
@@ -215,9 +220,10 @@
|
|
|
215
220
|
"type": {
|
|
216
221
|
"text": "SplitterMode"
|
|
217
222
|
},
|
|
218
|
-
"default": "
|
|
219
|
-
"description": "Determines
|
|
220
|
-
"attribute": "mode"
|
|
223
|
+
"default": "'length'",
|
|
224
|
+
"description": "Determines value units and pane sizing behavior.\n\n- `length` uses px for the primary pane size.\n- `percent` uses percentage points.\n- `fixed` uses px for a clampable fixed primary pane while the secondary pane flexes.",
|
|
225
|
+
"attribute": "mode",
|
|
226
|
+
"reflects": true
|
|
221
227
|
},
|
|
222
228
|
{
|
|
223
229
|
"kind": "field",
|
|
@@ -355,13 +361,13 @@
|
|
|
355
361
|
{
|
|
356
362
|
"kind": "field",
|
|
357
363
|
"name": "_collapseButtonIcon",
|
|
358
|
-
"privacy": "
|
|
364
|
+
"privacy": "protected",
|
|
359
365
|
"readonly": true
|
|
360
366
|
},
|
|
361
367
|
{
|
|
362
368
|
"kind": "method",
|
|
363
369
|
"name": "_setValue",
|
|
364
|
-
"privacy": "
|
|
370
|
+
"privacy": "protected",
|
|
365
371
|
"return": {
|
|
366
372
|
"type": {
|
|
367
373
|
"text": "void"
|
|
@@ -385,7 +391,7 @@
|
|
|
385
391
|
{
|
|
386
392
|
"kind": "method",
|
|
387
393
|
"name": "_setUserValue",
|
|
388
|
-
"privacy": "
|
|
394
|
+
"privacy": "protected",
|
|
389
395
|
"return": {
|
|
390
396
|
"type": {
|
|
391
397
|
"text": "void"
|
|
@@ -416,7 +422,7 @@
|
|
|
416
422
|
"text": "boolean"
|
|
417
423
|
},
|
|
418
424
|
"default": "false",
|
|
419
|
-
"description": "
|
|
425
|
+
"description": "Disables pointer and keyboard resizing without changing pane size.",
|
|
420
426
|
"attribute": "fixed"
|
|
421
427
|
},
|
|
422
428
|
{
|
|
@@ -429,6 +435,26 @@
|
|
|
429
435
|
"description": "Renders a collapse/expand toggle button on the separator.",
|
|
430
436
|
"attribute": "collapsible"
|
|
431
437
|
},
|
|
438
|
+
{
|
|
439
|
+
"kind": "field",
|
|
440
|
+
"name": "snapPoints",
|
|
441
|
+
"type": {
|
|
442
|
+
"text": "string"
|
|
443
|
+
},
|
|
444
|
+
"default": "''",
|
|
445
|
+
"description": "Ascending whitespace-separated snap points in the current mode's units.\nAn empty value keeps pointer resizing continuous.",
|
|
446
|
+
"attribute": "snap-points"
|
|
447
|
+
},
|
|
448
|
+
{
|
|
449
|
+
"kind": "field",
|
|
450
|
+
"name": "swipeVelocity",
|
|
451
|
+
"type": {
|
|
452
|
+
"text": "number"
|
|
453
|
+
},
|
|
454
|
+
"default": "500",
|
|
455
|
+
"description": "Minimum release velocity, in px/s, that qualifies as a swipe.",
|
|
456
|
+
"attribute": "swipe-velocity"
|
|
457
|
+
},
|
|
432
458
|
{
|
|
433
459
|
"kind": "field",
|
|
434
460
|
"name": "valueText",
|
|
@@ -471,6 +497,14 @@
|
|
|
471
497
|
},
|
|
472
498
|
"privacy": "protected"
|
|
473
499
|
},
|
|
500
|
+
{
|
|
501
|
+
"kind": "field",
|
|
502
|
+
"name": "_$separatorHandle",
|
|
503
|
+
"type": {
|
|
504
|
+
"text": "HTMLDivElement"
|
|
505
|
+
},
|
|
506
|
+
"privacy": "protected"
|
|
507
|
+
},
|
|
474
508
|
{
|
|
475
509
|
"kind": "field",
|
|
476
510
|
"name": "_$primaryElements",
|
|
@@ -496,6 +530,46 @@
|
|
|
496
530
|
"privacy": "protected",
|
|
497
531
|
"default": "0"
|
|
498
532
|
},
|
|
533
|
+
{
|
|
534
|
+
"kind": "field",
|
|
535
|
+
"name": "_gestureStartValue",
|
|
536
|
+
"type": {
|
|
537
|
+
"text": "number"
|
|
538
|
+
},
|
|
539
|
+
"privacy": "protected",
|
|
540
|
+
"default": "0"
|
|
541
|
+
},
|
|
542
|
+
{
|
|
543
|
+
"kind": "field",
|
|
544
|
+
"name": "_gestureRestoreValue",
|
|
545
|
+
"type": {
|
|
546
|
+
"text": "number"
|
|
547
|
+
},
|
|
548
|
+
"privacy": "protected",
|
|
549
|
+
"default": "0"
|
|
550
|
+
},
|
|
551
|
+
{
|
|
552
|
+
"kind": "field",
|
|
553
|
+
"name": "_activeSnapAnimation",
|
|
554
|
+
"type": {
|
|
555
|
+
"text": "Animation | null"
|
|
556
|
+
},
|
|
557
|
+
"privacy": "protected",
|
|
558
|
+
"default": "null"
|
|
559
|
+
},
|
|
560
|
+
{
|
|
561
|
+
"kind": "field",
|
|
562
|
+
"name": "_reducedMotion",
|
|
563
|
+
"privacy": "protected",
|
|
564
|
+
"readonly": true
|
|
565
|
+
},
|
|
566
|
+
{
|
|
567
|
+
"kind": "field",
|
|
568
|
+
"name": "_gesture",
|
|
569
|
+
"privacy": "protected",
|
|
570
|
+
"readonly": true,
|
|
571
|
+
"default": "new DragGestureController(this, { target: () => this._$separatorHandle, axis: this.orientation === 'horizontal' ? 'x' : 'y', focusOnStart: true, onStart: (detail) => this._onGestureStart(detail), onMove: (detail) => this._onGestureMove(detail), onEnd: (detail) => this._onGestureEnd(detail), onCancel: () => this._onGestureCancel(), })"
|
|
572
|
+
},
|
|
499
573
|
{
|
|
500
574
|
"kind": "field",
|
|
501
575
|
"name": "_resizeObserver",
|
|
@@ -523,11 +597,146 @@
|
|
|
523
597
|
{
|
|
524
598
|
"name": "e",
|
|
525
599
|
"type": {
|
|
526
|
-
"text": "
|
|
600
|
+
"text": "Pick<PointerEvent, 'clientX' | 'clientY'>"
|
|
527
601
|
}
|
|
528
602
|
}
|
|
529
603
|
]
|
|
530
604
|
},
|
|
605
|
+
{
|
|
606
|
+
"kind": "method",
|
|
607
|
+
"name": "snapTo",
|
|
608
|
+
"return": {
|
|
609
|
+
"type": {
|
|
610
|
+
"text": "void"
|
|
611
|
+
}
|
|
612
|
+
},
|
|
613
|
+
"parameters": [
|
|
614
|
+
{
|
|
615
|
+
"name": "index",
|
|
616
|
+
"type": {
|
|
617
|
+
"text": "number"
|
|
618
|
+
},
|
|
619
|
+
"description": "zero-based index into `snapPoints`"
|
|
620
|
+
},
|
|
621
|
+
{
|
|
622
|
+
"name": "behavior",
|
|
623
|
+
"default": "'animated'",
|
|
624
|
+
"type": {
|
|
625
|
+
"text": "'animated' | 'instant'"
|
|
626
|
+
},
|
|
627
|
+
"description": "whether to animate the movement"
|
|
628
|
+
}
|
|
629
|
+
],
|
|
630
|
+
"description": "Settles at a declared snap point by zero-based index.\n\nFinite fractional indices are truncated and clamped. Calls without valid\nsnap points or with a non-finite index have no effect."
|
|
631
|
+
},
|
|
632
|
+
{
|
|
633
|
+
"kind": "method",
|
|
634
|
+
"name": "_onGestureStart",
|
|
635
|
+
"privacy": "protected",
|
|
636
|
+
"return": {
|
|
637
|
+
"type": {
|
|
638
|
+
"text": "void"
|
|
639
|
+
}
|
|
640
|
+
},
|
|
641
|
+
"parameters": [
|
|
642
|
+
{
|
|
643
|
+
"name": "_detail",
|
|
644
|
+
"type": {
|
|
645
|
+
"text": "DragGestureDetail"
|
|
646
|
+
}
|
|
647
|
+
}
|
|
648
|
+
]
|
|
649
|
+
},
|
|
650
|
+
{
|
|
651
|
+
"kind": "method",
|
|
652
|
+
"name": "_onGestureMove",
|
|
653
|
+
"privacy": "protected",
|
|
654
|
+
"return": {
|
|
655
|
+
"type": {
|
|
656
|
+
"text": "void"
|
|
657
|
+
}
|
|
658
|
+
},
|
|
659
|
+
"parameters": [
|
|
660
|
+
{
|
|
661
|
+
"name": "detail",
|
|
662
|
+
"type": {
|
|
663
|
+
"text": "DragGestureDetail"
|
|
664
|
+
}
|
|
665
|
+
}
|
|
666
|
+
]
|
|
667
|
+
},
|
|
668
|
+
{
|
|
669
|
+
"kind": "method",
|
|
670
|
+
"name": "_onGestureEnd",
|
|
671
|
+
"privacy": "protected",
|
|
672
|
+
"return": {
|
|
673
|
+
"type": {
|
|
674
|
+
"text": "void"
|
|
675
|
+
}
|
|
676
|
+
},
|
|
677
|
+
"parameters": [
|
|
678
|
+
{
|
|
679
|
+
"name": "detail",
|
|
680
|
+
"type": {
|
|
681
|
+
"text": "DragGestureDetail"
|
|
682
|
+
}
|
|
683
|
+
}
|
|
684
|
+
]
|
|
685
|
+
},
|
|
686
|
+
{
|
|
687
|
+
"kind": "method",
|
|
688
|
+
"name": "_onGestureCancel",
|
|
689
|
+
"privacy": "protected",
|
|
690
|
+
"return": {
|
|
691
|
+
"type": {
|
|
692
|
+
"text": "void"
|
|
693
|
+
}
|
|
694
|
+
}
|
|
695
|
+
},
|
|
696
|
+
{
|
|
697
|
+
"kind": "method",
|
|
698
|
+
"name": "_resolvedSnapPoints",
|
|
699
|
+
"privacy": "protected",
|
|
700
|
+
"return": {
|
|
701
|
+
"type": {
|
|
702
|
+
"text": "number[]"
|
|
703
|
+
}
|
|
704
|
+
}
|
|
705
|
+
},
|
|
706
|
+
{
|
|
707
|
+
"kind": "method",
|
|
708
|
+
"name": "_settleToValue",
|
|
709
|
+
"privacy": "protected",
|
|
710
|
+
"return": {
|
|
711
|
+
"type": {
|
|
712
|
+
"text": "Promise<void>"
|
|
713
|
+
}
|
|
714
|
+
},
|
|
715
|
+
"parameters": [
|
|
716
|
+
{
|
|
717
|
+
"name": "value",
|
|
718
|
+
"type": {
|
|
719
|
+
"text": "number"
|
|
720
|
+
}
|
|
721
|
+
},
|
|
722
|
+
{
|
|
723
|
+
"name": "behavior",
|
|
724
|
+
"type": {
|
|
725
|
+
"text": "'animated' | 'instant'"
|
|
726
|
+
}
|
|
727
|
+
}
|
|
728
|
+
]
|
|
729
|
+
},
|
|
730
|
+
{
|
|
731
|
+
"kind": "method",
|
|
732
|
+
"name": "_snapDuration",
|
|
733
|
+
"privacy": "protected",
|
|
734
|
+
"return": {
|
|
735
|
+
"type": {
|
|
736
|
+
"text": "number"
|
|
737
|
+
}
|
|
738
|
+
}
|
|
739
|
+
},
|
|
531
740
|
{
|
|
532
741
|
"kind": "method",
|
|
533
742
|
"name": "_onPrimaryChange",
|
|
@@ -557,7 +766,7 @@
|
|
|
557
766
|
{
|
|
558
767
|
"kind": "method",
|
|
559
768
|
"name": "_measureHostSize",
|
|
560
|
-
"privacy": "
|
|
769
|
+
"privacy": "protected",
|
|
561
770
|
"return": {
|
|
562
771
|
"type": {
|
|
563
772
|
"text": "number"
|
|
@@ -567,7 +776,7 @@
|
|
|
567
776
|
{
|
|
568
777
|
"name": "axis",
|
|
569
778
|
"type": {
|
|
570
|
-
"text": "
|
|
779
|
+
"text": "'inline' | 'block'"
|
|
571
780
|
}
|
|
572
781
|
}
|
|
573
782
|
]
|
|
@@ -583,91 +792,110 @@
|
|
|
583
792
|
"name": "rc-splitter-change",
|
|
584
793
|
"type": {
|
|
585
794
|
"text": "CustomEvent"
|
|
586
|
-
}
|
|
795
|
+
},
|
|
796
|
+
"description": "Fired when the separator position changes; `detail: { value, valueText }`"
|
|
587
797
|
}
|
|
588
798
|
],
|
|
589
799
|
"attributes": [
|
|
590
800
|
{
|
|
801
|
+
"description": "Accessible label for this splitter. Default label is 'Splitter'.",
|
|
591
802
|
"name": "label",
|
|
592
803
|
"type": {
|
|
593
804
|
"text": "string"
|
|
594
805
|
},
|
|
595
|
-
"default": "
|
|
596
|
-
"description": "Accessible label for this splitter. Default label is 'Splitter'.",
|
|
806
|
+
"default": "'Splitter'",
|
|
597
807
|
"fieldName": "label"
|
|
598
808
|
},
|
|
599
809
|
{
|
|
810
|
+
"description": "Splitter orientation, for keyboard navigation and initial sizing.",
|
|
600
811
|
"name": "orientation",
|
|
601
812
|
"type": {
|
|
602
813
|
"text": "SplitterOrientation"
|
|
603
814
|
},
|
|
604
|
-
"default": "
|
|
605
|
-
"description": "Splitter orientation, for keyboard navigation and initial sizing.",
|
|
815
|
+
"default": "'horizontal'",
|
|
606
816
|
"fieldName": "orientation"
|
|
607
817
|
},
|
|
608
818
|
{
|
|
819
|
+
"description": "Determines value units and pane sizing behavior.\n\n- `length` uses px for the primary pane size.\n- `percent` uses percentage points.\n- `fixed` uses px for a clampable fixed primary pane while the secondary pane flexes.",
|
|
609
820
|
"name": "mode",
|
|
610
821
|
"type": {
|
|
611
822
|
"text": "SplitterMode"
|
|
612
823
|
},
|
|
613
|
-
"default": "
|
|
614
|
-
"description": "Determines length units for min, max and step attributes, one of either `length` (default) or `percent`",
|
|
824
|
+
"default": "'length'",
|
|
615
825
|
"fieldName": "mode"
|
|
616
826
|
},
|
|
617
827
|
{
|
|
828
|
+
"description": "The step size for resizing, in either pixels or percentage points depending on `mode`.",
|
|
618
829
|
"name": "step",
|
|
619
830
|
"type": {
|
|
620
831
|
"text": "number"
|
|
621
832
|
},
|
|
622
833
|
"default": "1",
|
|
623
|
-
"description": "The step size for resizing, in either pixels or percentage points depending on `mode`.",
|
|
624
834
|
"fieldName": "step"
|
|
625
835
|
},
|
|
626
836
|
{
|
|
837
|
+
"description": "Minimum size of the primary pane in current mode units. Defaults to 0.",
|
|
627
838
|
"name": "min",
|
|
628
839
|
"type": {
|
|
629
840
|
"text": "number"
|
|
630
841
|
},
|
|
631
842
|
"default": "0",
|
|
632
|
-
"description": "Minimum size of the primary pane in current mode units. Defaults to 0.",
|
|
633
843
|
"fieldName": "min"
|
|
634
844
|
},
|
|
635
845
|
{
|
|
846
|
+
"description": "Maximum size of the primary pane in current mode units. Defaults to the full container size.",
|
|
636
847
|
"name": "max",
|
|
637
848
|
"type": {
|
|
638
849
|
"text": "number | undefined"
|
|
639
850
|
},
|
|
640
851
|
"default": "undefined",
|
|
641
|
-
"description": "Maximum size of the primary pane in current mode units. Defaults to the full container size.",
|
|
642
852
|
"fieldName": "max"
|
|
643
853
|
},
|
|
644
854
|
{
|
|
645
|
-
"name": "value",
|
|
646
855
|
"description": "The current splitter value, corresponding to the separator position, in either pixels or percentage points depending on `mode`.",
|
|
856
|
+
"name": "value",
|
|
647
857
|
"fieldName": "value"
|
|
648
858
|
},
|
|
649
859
|
{
|
|
650
|
-
"name": "default-value",
|
|
651
860
|
"description": "Initial uncontrolled splitter value.",
|
|
861
|
+
"name": "default-value",
|
|
652
862
|
"fieldName": "defaultValue"
|
|
653
863
|
},
|
|
654
864
|
{
|
|
865
|
+
"description": "Disables pointer and keyboard resizing without changing pane size.",
|
|
655
866
|
"name": "fixed",
|
|
656
867
|
"type": {
|
|
657
868
|
"text": "boolean"
|
|
658
869
|
},
|
|
659
870
|
"default": "false",
|
|
660
|
-
"description": "Toggles resizing ability",
|
|
661
871
|
"fieldName": "fixed"
|
|
662
872
|
},
|
|
663
873
|
{
|
|
874
|
+
"description": "Renders a collapse/expand toggle button on the separator.",
|
|
664
875
|
"name": "collapsible",
|
|
665
876
|
"type": {
|
|
666
877
|
"text": "boolean"
|
|
667
878
|
},
|
|
668
879
|
"default": "false",
|
|
669
|
-
"description": "Renders a collapse/expand toggle button on the separator.",
|
|
670
880
|
"fieldName": "collapsible"
|
|
881
|
+
},
|
|
882
|
+
{
|
|
883
|
+
"description": "Ascending whitespace-separated snap points in the current mode's units.\nAn empty value keeps pointer resizing continuous.",
|
|
884
|
+
"name": "snap-points",
|
|
885
|
+
"type": {
|
|
886
|
+
"text": "string"
|
|
887
|
+
},
|
|
888
|
+
"default": "''",
|
|
889
|
+
"fieldName": "snapPoints"
|
|
890
|
+
},
|
|
891
|
+
{
|
|
892
|
+
"description": "Minimum release velocity, in px/s, that qualifies as a swipe.",
|
|
893
|
+
"name": "swipe-velocity",
|
|
894
|
+
"type": {
|
|
895
|
+
"text": "number"
|
|
896
|
+
},
|
|
897
|
+
"default": "500",
|
|
898
|
+
"fieldName": "swipeVelocity"
|
|
671
899
|
}
|
|
672
900
|
],
|
|
673
901
|
"superclass": {
|