@rcarls/rc-splitter 0.5.0 → 0.7.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/CHANGELOG.md +125 -0
- package/README.md +22 -14
- package/dist/custom-elements.json +90 -9
- package/dist/rc-splitter-_P5HsZI9.js +437 -0
- package/dist/rc-splitter-_P5HsZI9.js.map +1 -0
- package/dist/rc-splitter-define.js +3 -1
- package/dist/rc-splitter-define.js.map +1 -1
- package/dist/rc-splitter.js +3 -2
- package/dist/types/packages/rc-splitter/src/index.d.ts +1 -1
- package/dist/types/packages/rc-splitter/src/rc-splitter.d.ts +45 -8
- package/package.json +2 -2
- package/dist/rc-splitter-CJTLxYi3.js +0 -608
- package/dist/rc-splitter-CJTLxYi3.js.map +0 -1
- package/dist/types/packages/rc-splitter/src/rc-splitter.test.d.ts +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,130 @@
|
|
|
1
1
|
# @rcarls/rc-splitter
|
|
2
2
|
|
|
3
|
+
## 0.7.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 54d9ead: Localize every component's built-in text. Button names, role
|
|
8
|
+
descriptions, announcements, and default labels now resolve per key from
|
|
9
|
+
the element's `messages` property, then from text registered with
|
|
10
|
+
`registerMessages(locale, catalog)` in `@rcarls/rc-common`, then from the
|
|
11
|
+
English defaults. The locale is the element's own `lang`, else
|
|
12
|
+
`<html lang>`; an ancestor's `lang` is ignored, because it usually marks
|
|
13
|
+
content rather than the interface. Components re-render when that locale
|
|
14
|
+
changes or new text is registered. `RcMessageCatalog` types the catalog,
|
|
15
|
+
and each package adds its scope to it.
|
|
16
|
+
|
|
17
|
+
Numbers a component formats as text follow the same locale:
|
|
18
|
+
`rc-progress`'s default percentage and `rc-splitter`'s `aria-valuetext`
|
|
19
|
+
use `Intl.NumberFormat`. `TypeaheadController` matches prefixes with an
|
|
20
|
+
`Intl.Collator`, so case and accents are ignored the way the locale
|
|
21
|
+
ignores them, and takes a `locale` option. `ItemsCollectionController`'s
|
|
22
|
+
`setCreateOption(text, label?)` takes the option's visible text from its
|
|
23
|
+
caller.
|
|
24
|
+
|
|
25
|
+
`rc-transfer-list`'s direction arrows are now decorative: screen readers
|
|
26
|
+
read only the action name, and the arrows turn over in RTL.
|
|
27
|
+
|
|
28
|
+
**Breaking:** chrome-text properties are replaced by `messages`. Migrate:
|
|
29
|
+
|
|
30
|
+
- `rc-search-bar` `clear-label` / `clearLabel` → `messages.clear`
|
|
31
|
+
- `rc-adaptive-menu` `overflow-label` / `overflowLabel` → `messages.overflow`
|
|
32
|
+
- `rc-chip-group` `show-all-label` / `showAllLabel` and `show-less-label` /
|
|
33
|
+
`showLessLabel` → `messages.showAll` and `messages.showLess`
|
|
34
|
+
- `rc-select` and `rc-combobox` `dialog-confirm-label` /
|
|
35
|
+
`dialogConfirmLabel` and `dialog-cancel-label` / `dialogCancelLabel` →
|
|
36
|
+
`messages.done` and `messages.cancel`
|
|
37
|
+
- `rc-editor-toolbar` `label` → `messages.toolbar`
|
|
38
|
+
|
|
39
|
+
Per-instance names stay attributes, but now default to `undefined` and fall
|
|
40
|
+
back to a message: `label` on `rc-adaptive-menu`, `rc-chip-group`,
|
|
41
|
+
`rc-menubar`, and `rc-splitter`; `available-label` and `selected-label`
|
|
42
|
+
on `rc-transfer-list`; `low-label` and `high-label` on `rc-range-slider`.
|
|
43
|
+
Read the resolved name from the rendered `aria-label` instead of the
|
|
44
|
+
property.
|
|
45
|
+
|
|
46
|
+
### Patch Changes
|
|
47
|
+
|
|
48
|
+
- 5c006de: Ship component CSS minified. Package builds now run the CSS in Lit `css` styles
|
|
49
|
+
and light-DOM structural styles through Lightning CSS, removing comments and
|
|
50
|
+
whitespace while keeping source maps that resolve to each template. Rendered
|
|
51
|
+
styles are unchanged.
|
|
52
|
+
|
|
53
|
+
`@rcarls/rc-common` adds `cssText`, an identity tag that marks a plain CSS
|
|
54
|
+
string for minification. `rc-chip`, `rc-disclosure`, and `rc-accordion` now
|
|
55
|
+
depend on `@rcarls/rc-common` for it.
|
|
56
|
+
|
|
57
|
+
- b764a3c: Observe interface locale changes through containing shadow roots and the host's own document.
|
|
58
|
+
An explicit empty `lang` now means an unknown locale rather than falling back to `<html lang>`.
|
|
59
|
+
Typeahead compares complete grapheme prefixes, including decomposed accents and collation
|
|
60
|
+
expansions. Default interpolating messages format numeric positions in the interface locale
|
|
61
|
+
while translation callbacks continue to receive numbers and can accept an optional locale.
|
|
62
|
+
Default messages isolate consumer text whose direction is unknown. Textarea content direction
|
|
63
|
+
uses the native LTR fallback for neutral `dir="auto"` content, recognizes Arabic Letter Mark and
|
|
64
|
+
isolate controls, and reruns plugins when the native textarea's `lang` or `dir` changes.
|
|
65
|
+
- d7e7208: Follow the reading direction and writing mode. Pointer resizing measures the
|
|
66
|
+
primary pane from its logical start edge, so dragging works in RTL, where the
|
|
67
|
+
primary pane sits on the right; swipe-to-collapse uses logical deltas; the
|
|
68
|
+
separator reports the orientation it renders in, and its drag axis and
|
|
69
|
+
collapse shortcut follow it in vertical text. Separator borders, the collapse
|
|
70
|
+
button, and the drag handle use logical properties, and the collapse chevron
|
|
71
|
+
mirrors in RTL.
|
|
72
|
+
- a63ded3: Size the primary pane and measure the host along logical axes, so a
|
|
73
|
+
splitter in vertical text sizes the pane it separates rather than the
|
|
74
|
+
cross axis. The grip dots and resize cursor now follow the bar's rendered
|
|
75
|
+
direction, turning with it in vertical text.
|
|
76
|
+
- afcfef8: Read snap duration custom properties as CSS times. `--rc-bottom-sheet-snap-duration` and
|
|
77
|
+
`--rc-splitter-snap-duration` now accept seconds as well as milliseconds, so a theme motion
|
|
78
|
+
token such as `.3s` animates for 300 ms instead of finishing in a fraction of a millisecond.
|
|
79
|
+
`rc-common` exports the shared `parseCssTime` helper.
|
|
80
|
+
- 1102fd6: Point the collapse chevron at the primary pane in every writing mode and
|
|
81
|
+
direction. It is now chosen from the pane axis and the element's flow, so it
|
|
82
|
+
also turns correctly in vertical text, where it used to point across the
|
|
83
|
+
panes, and re-renders when an ancestor's `dir` changes.
|
|
84
|
+
- cd1b85b: Measure length-mode limits and snap animation frames in splitter CSS pixels
|
|
85
|
+
so sizing stays consistent under CSS zoom.
|
|
86
|
+
- Updated dependencies [e3dfa59]
|
|
87
|
+
- Updated dependencies [50d5610]
|
|
88
|
+
- Updated dependencies [9ee769c]
|
|
89
|
+
- Updated dependencies [1179f24]
|
|
90
|
+
- Updated dependencies [595fe37]
|
|
91
|
+
- Updated dependencies [38cd00c]
|
|
92
|
+
- Updated dependencies [5c006de]
|
|
93
|
+
- Updated dependencies [a6553ff]
|
|
94
|
+
- Updated dependencies [2205478]
|
|
95
|
+
- Updated dependencies [4341311]
|
|
96
|
+
- Updated dependencies [899bb5e]
|
|
97
|
+
- Updated dependencies [25fcfe0]
|
|
98
|
+
- Updated dependencies [51f6403]
|
|
99
|
+
- Updated dependencies [9caca6b]
|
|
100
|
+
- Updated dependencies [b764a3c]
|
|
101
|
+
- Updated dependencies [54d9ead]
|
|
102
|
+
- Updated dependencies [b9175e9]
|
|
103
|
+
- Updated dependencies [c8b762b]
|
|
104
|
+
- Updated dependencies [55e1e7f]
|
|
105
|
+
- Updated dependencies [f1ca82d]
|
|
106
|
+
- Updated dependencies [b87f27b]
|
|
107
|
+
- Updated dependencies [32ebead]
|
|
108
|
+
- Updated dependencies [bfefedd]
|
|
109
|
+
- Updated dependencies [c130173]
|
|
110
|
+
- Updated dependencies [11680b6]
|
|
111
|
+
- Updated dependencies [223d36c]
|
|
112
|
+
- Updated dependencies [7b91a44]
|
|
113
|
+
- Updated dependencies [aa04ead]
|
|
114
|
+
- Updated dependencies [ac65b5b]
|
|
115
|
+
- Updated dependencies [afcfef8]
|
|
116
|
+
- Updated dependencies [11ef1ad]
|
|
117
|
+
- @rcarls/rc-common@0.7.0
|
|
118
|
+
|
|
119
|
+
## 0.6.0
|
|
120
|
+
|
|
121
|
+
### Patch Changes
|
|
122
|
+
|
|
123
|
+
- Updated dependencies [6683eb9]
|
|
124
|
+
- Updated dependencies [ee7ba6c]
|
|
125
|
+
- Updated dependencies [30eb232]
|
|
126
|
+
- @rcarls/rc-common@0.6.0
|
|
127
|
+
|
|
3
128
|
## 0.5.0
|
|
4
129
|
|
|
5
130
|
### Patch Changes
|
package/README.md
CHANGED
|
@@ -49,20 +49,28 @@ Vertical orientation:
|
|
|
49
49
|
|
|
50
50
|
### Properties / attributes
|
|
51
51
|
|
|
52
|
-
| Property | Attribute | Type | Default
|
|
53
|
-
| --------------- | ---------------- | ---------------------------------- |
|
|
54
|
-
| `label` | `label` | `string`
|
|
55
|
-
| `orientation` | `orientation` | `'horizontal' \| 'vertical'` | `'horizontal'`
|
|
56
|
-
| `mode` | `mode` | `'length' \| 'percent' \| 'fixed'` | `'length'`
|
|
57
|
-
| `step` | `step` | `number` | `1`
|
|
58
|
-
| `min` | `min` | `number` | `0`
|
|
59
|
-
| `max` | `max` | `number \| undefined` | `undefined`
|
|
60
|
-
| `value` | `value` | `number` | `0`
|
|
61
|
-
| `defaultValue` | `default-value` | `number \| undefined` | `undefined`
|
|
62
|
-
| `fixed` | `fixed` | `boolean` | `false`
|
|
63
|
-
| `collapsible` | `collapsible` | `boolean` | `false`
|
|
64
|
-
| `snapPoints` | `snap-points` | `string` | `''`
|
|
65
|
-
| `swipeVelocity` | `swipe-velocity` | `number` | `500`
|
|
52
|
+
| Property | Attribute | Type | Default | Description |
|
|
53
|
+
| --------------- | ---------------- | ---------------------------------- | --------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
54
|
+
| `label` | `label` | `string \| undefined` | `label` message | Accessible label applied to the primary pane and used by the separator handle via `aria-labelledby`. |
|
|
55
|
+
| `orientation` | `orientation` | `'horizontal' \| 'vertical'` | `'horizontal'` | Layout direction. `horizontal` = left/right panes; `vertical` = top/bottom panes. Reflects to attribute. |
|
|
56
|
+
| `mode` | `mode` | `'length' \| 'percent' \| 'fixed'` | `'length'` | Unit and sizing behavior for `value`. `length` = pixels of the primary pane; `percent` = percentage of total container size; `fixed` = clampable px primary pane while the secondary pane flexes. |
|
|
57
|
+
| `step` | `step` | `number` | `1` | Keyboard step size in the current unit (px or %). Shift multiplies by 10×. |
|
|
58
|
+
| `min` | `min` | `number` | `0` | Minimum primary pane size in the current mode's units. |
|
|
59
|
+
| `max` | `max` | `number \| undefined` | `undefined` | Maximum primary pane size in the current mode's units. Defaults to the full container size. |
|
|
60
|
+
| `value` | `value` | `number` | `0` | Current primary pane size. Host writes update the separator position silently (no `rc-splitter-change`). |
|
|
61
|
+
| `defaultValue` | `default-value` | `number \| undefined` | `undefined` | Initial uncontrolled primary pane size, applied once the splitter has measured its container. |
|
|
62
|
+
| `fixed` | `fixed` | `boolean` | `false` | Disable resizing. This legacy boolean locks interaction and is distinct from `mode="fixed"`. |
|
|
63
|
+
| `collapsible` | `collapsible` | `boolean` | `false` | Render the separator's collapse/restore button and enable swipe collapse/restore. |
|
|
64
|
+
| `snapPoints` | `snap-points` | `string` | `''` | Ascending whitespace-separated anchors in the current mode's units. |
|
|
65
|
+
| `swipeVelocity` | `swipe-velocity` | `number` | `500` | Release velocity in px/s that selects the next anchor or collapse action. |
|
|
66
|
+
|
|
67
|
+
### Localization
|
|
68
|
+
|
|
69
|
+
Built-in text follows the element's own `lang`, else `<html lang>`, and never an
|
|
70
|
+
ancestor's `lang`, which usually marks content. Override it per element with the
|
|
71
|
+
`messages` property, or for every instance with `registerMessages()` from
|
|
72
|
+
`@rcarls/rc-common` under `rc-splitter`. Keys: `label`, `expand`, `collapse`. The separator's `aria-valuetext` is formatted with `Intl.NumberFormat` for the same locale; `valueText` stays a CSS length. See the
|
|
73
|
+
[rc-common Localization section](https://github.com/richardcarls/rc-webcomponents/tree/develop/packages/rc-common#localization).
|
|
66
74
|
|
|
67
75
|
### Anchored settling
|
|
68
76
|
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
"name": "*",
|
|
36
36
|
"declaration": {
|
|
37
37
|
"name": "*",
|
|
38
|
-
"module": "src/rc-splitter"
|
|
38
|
+
"module": "src/rc-splitter.js"
|
|
39
39
|
}
|
|
40
40
|
}
|
|
41
41
|
]
|
|
@@ -44,9 +44,16 @@
|
|
|
44
44
|
"kind": "javascript-module",
|
|
45
45
|
"path": "src/rc-splitter.ts",
|
|
46
46
|
"declarations": [
|
|
47
|
+
{
|
|
48
|
+
"kind": "variable",
|
|
49
|
+
"name": "DEFAULT_SPLITTER_MESSAGES",
|
|
50
|
+
"type": {
|
|
51
|
+
"text": "Readonly<RCSplitterMessages>"
|
|
52
|
+
}
|
|
53
|
+
},
|
|
47
54
|
{
|
|
48
55
|
"kind": "class",
|
|
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",
|
|
56
|
+
"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\n\nBuilt-in text (the collapse button name and default pane name; the separator value text is formatted for the same locale) follows the element's own `lang`, else\n`<html lang>`: per element through `messages`, or for every instance\nthrough `registerMessages()` from `@rcarls/rc-common` under `rc-splitter`.",
|
|
50
57
|
"name": "RCSplitter",
|
|
51
58
|
"cssProperties": [
|
|
52
59
|
{
|
|
@@ -193,14 +200,28 @@
|
|
|
193
200
|
}
|
|
194
201
|
],
|
|
195
202
|
"members": [
|
|
203
|
+
{
|
|
204
|
+
"kind": "field",
|
|
205
|
+
"name": "messages",
|
|
206
|
+
"type": {
|
|
207
|
+
"text": "Partial<RCSplitterMessages> | undefined"
|
|
208
|
+
},
|
|
209
|
+
"description": "Built-in text overrides; unset keys fall back to registered text, then English."
|
|
210
|
+
},
|
|
211
|
+
{
|
|
212
|
+
"kind": "field",
|
|
213
|
+
"name": "_messages",
|
|
214
|
+
"privacy": "private",
|
|
215
|
+
"readonly": true,
|
|
216
|
+
"default": "new MessagesController( this, 'rc-splitter', DEFAULT_SPLITTER_MESSAGES, { overrides: () => this.messages, }, )"
|
|
217
|
+
},
|
|
196
218
|
{
|
|
197
219
|
"kind": "field",
|
|
198
220
|
"name": "label",
|
|
199
221
|
"type": {
|
|
200
|
-
"text": "string"
|
|
222
|
+
"text": "string | undefined"
|
|
201
223
|
},
|
|
202
|
-
"
|
|
203
|
-
"description": "Accessible label for this splitter. Default label is 'Splitter'.",
|
|
224
|
+
"description": "Accessible label for this splitter. Defaults to the `label` message.",
|
|
204
225
|
"attribute": "label"
|
|
205
226
|
},
|
|
206
227
|
{
|
|
@@ -458,7 +479,17 @@
|
|
|
458
479
|
{
|
|
459
480
|
"kind": "field",
|
|
460
481
|
"name": "valueText",
|
|
461
|
-
"description": "
|
|
482
|
+
"description": "The value as a CSS length, such as `40%` or `240px`.",
|
|
483
|
+
"readonly": true
|
|
484
|
+
},
|
|
485
|
+
{
|
|
486
|
+
"kind": "field",
|
|
487
|
+
"name": "_accessibleValueText",
|
|
488
|
+
"type": {
|
|
489
|
+
"text": "string"
|
|
490
|
+
},
|
|
491
|
+
"privacy": "protected",
|
|
492
|
+
"description": "The value for `aria-valuetext`, with digits in the splitter's locale.",
|
|
462
493
|
"readonly": true
|
|
463
494
|
},
|
|
464
495
|
{
|
|
@@ -576,6 +607,24 @@
|
|
|
576
607
|
"privacy": "protected",
|
|
577
608
|
"default": "new ResizeObserver(() => this._onResize())"
|
|
578
609
|
},
|
|
610
|
+
{
|
|
611
|
+
"kind": "field",
|
|
612
|
+
"name": "_flow",
|
|
613
|
+
"privacy": "protected",
|
|
614
|
+
"readonly": true,
|
|
615
|
+
"default": "new FlowController(this)",
|
|
616
|
+
"description": "Keeps the separator's aria-orientation and drag axis on the rendered layout."
|
|
617
|
+
},
|
|
618
|
+
{
|
|
619
|
+
"kind": "field",
|
|
620
|
+
"name": "_paneAxis",
|
|
621
|
+
"type": {
|
|
622
|
+
"text": "LogicalAxis"
|
|
623
|
+
},
|
|
624
|
+
"privacy": "protected",
|
|
625
|
+
"description": "The logical axis the panes sit along: `horizontal` places them side by\nside along the inline axis, `vertical` stacks them along the block axis.",
|
|
626
|
+
"readonly": true
|
|
627
|
+
},
|
|
579
628
|
{
|
|
580
629
|
"kind": "method",
|
|
581
630
|
"name": "_onKeyboardResize",
|
|
@@ -763,6 +812,31 @@
|
|
|
763
812
|
}
|
|
764
813
|
]
|
|
765
814
|
},
|
|
815
|
+
{
|
|
816
|
+
"kind": "method",
|
|
817
|
+
"name": "_sizeAlong",
|
|
818
|
+
"privacy": "protected",
|
|
819
|
+
"return": {
|
|
820
|
+
"type": {
|
|
821
|
+
"text": "number"
|
|
822
|
+
}
|
|
823
|
+
},
|
|
824
|
+
"parameters": [
|
|
825
|
+
{
|
|
826
|
+
"name": "rect",
|
|
827
|
+
"type": {
|
|
828
|
+
"text": "DOMRect"
|
|
829
|
+
}
|
|
830
|
+
},
|
|
831
|
+
{
|
|
832
|
+
"name": "axis",
|
|
833
|
+
"type": {
|
|
834
|
+
"text": "LogicalAxis"
|
|
835
|
+
}
|
|
836
|
+
}
|
|
837
|
+
],
|
|
838
|
+
"description": "The extent of `rect` along a logical axis. The pane axis is vertical on\nscreen in vertical text, so a physical width would measure the wrong one."
|
|
839
|
+
},
|
|
766
840
|
{
|
|
767
841
|
"kind": "method",
|
|
768
842
|
"name": "_measureHostSize",
|
|
@@ -798,12 +872,11 @@
|
|
|
798
872
|
],
|
|
799
873
|
"attributes": [
|
|
800
874
|
{
|
|
801
|
-
"description": "Accessible label for this splitter.
|
|
875
|
+
"description": "Accessible label for this splitter. Defaults to the `label` message.",
|
|
802
876
|
"name": "label",
|
|
803
877
|
"type": {
|
|
804
|
-
"text": "string"
|
|
878
|
+
"text": "string | undefined"
|
|
805
879
|
},
|
|
806
|
-
"default": "'Splitter'",
|
|
807
880
|
"fieldName": "label"
|
|
808
881
|
},
|
|
809
882
|
{
|
|
@@ -907,6 +980,14 @@
|
|
|
907
980
|
}
|
|
908
981
|
],
|
|
909
982
|
"exports": [
|
|
983
|
+
{
|
|
984
|
+
"kind": "js",
|
|
985
|
+
"name": "DEFAULT_SPLITTER_MESSAGES",
|
|
986
|
+
"declaration": {
|
|
987
|
+
"name": "DEFAULT_SPLITTER_MESSAGES",
|
|
988
|
+
"module": "src/rc-splitter.ts"
|
|
989
|
+
}
|
|
990
|
+
},
|
|
910
991
|
{
|
|
911
992
|
"kind": "js",
|
|
912
993
|
"name": "RCSplitter",
|