@splunk/react-ui 4.42.0 → 4.43.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 +25 -0
- package/Code.js +611 -426
- package/ComboBox.js +25 -32
- package/Date.js +21 -26
- package/Dropdown.js +1 -1
- package/JSONTree.js +30 -24
- package/MIGRATION.mdx +48 -53
- package/Menu.js +12 -8
- package/Multiselect.js +1 -1
- package/Number.js +418 -392
- package/Paginator.js +269 -251
- package/Popover.js +412 -345
- package/RadioList.js +44 -43
- package/ResultsMenu.d.ts +2 -0
- package/Search.js +56 -65
- package/Select.js +1 -1
- package/TabBar.js +4 -0
- package/Table.js +146 -146
- package/TransitionOpen.js +16 -14
- package/Tree.js +20 -14
- package/package.json +6 -6
- package/types/src/Button/Button.d.ts +1 -0
- package/types/src/Code/Code.d.ts +1 -1
- package/types/src/ComboBox/ComboBox.d.ts +6 -3
- package/types/src/Date/Date.d.ts +0 -1
- package/types/src/Dropdown/docs/examples/TooltipButtonToggle.d.ts +2 -0
- package/types/src/Multiselect/Multiselect.d.ts +2 -0
- package/types/src/Number/Number.d.ts +3 -10
- package/types/src/Number/utils.d.ts +29 -0
- package/types/src/Paginator/Paginator.d.ts +15 -2
- package/types/src/Paginator/docs/examples/CustomPages.d.ts +2 -0
- package/types/src/Popover/Popover.d.ts +17 -8
- package/types/src/Popover/PopoverMenuContext.d.ts +6 -0
- package/types/src/Popover/PopoverProvider.d.ts +23 -0
- package/types/src/Popover/index.d.ts +2 -1
- package/types/src/RadioList/RadioList.d.ts +1 -1
- package/types/src/Select/SelectBase.d.ts +1 -1
- package/types/src/Select/docs/examples/Appearance.d.ts +1 -11
- package/types/src/Select/docs/examples/Basic.d.ts +1 -9
- package/types/src/Select/docs/examples/Children.d.ts +1 -9
- package/types/src/Select/docs/examples/Descriptions.d.ts +1 -9
- package/types/src/Select/docs/examples/Fetching.d.ts +1 -22
- package/types/src/Select/docs/examples/Filter.d.ts +1 -9
- package/types/src/Select/docs/examples/Headings.d.ts +1 -9
- package/types/src/Select/docs/examples/LoadMoreOnScrollBottom.d.ts +1 -24
- package/types/src/Select/docs/examples/Prefix.d.ts +1 -9
- package/types/src/Select/docs/examples/Truncate.d.ts +1 -9
- package/types/src/Table/docs/examples/Click.d.ts +2 -16
- package/types/src/Table/docs/examples/ClickRows.d.ts +2 -16
- package/types/src/Table/docs/examples/Complex.d.ts +2 -50
- package/types/src/Table/docs/examples/FilterColumnValues.d.ts +1 -13
- package/types/src/Table/docs/examples/HeadDropdownCell.d.ts +1 -17
- package/types/src/Table/docs/examples/ReorderColumns.d.ts +2 -21
- package/types/src/Table/docs/examples/ReorderRows.d.ts +2 -21
- package/types/src/Table/docs/examples/Resizable.d.ts +2 -23
- package/types/src/Table/docs/examples/ResizableFill.d.ts +2 -23
- package/types/src/Table/docs/examples/RowActions.d.ts +2 -39
- package/types/src/Table/docs/examples/Selectable.d.ts +2 -18
- package/types/src/Table/docs/examples/SortableColumns.d.ts +1 -11
- package/useResizeObserver.js +122 -90
- package/types/src/Dropdown/docs/examples/OtherToggles.d.ts +0 -2
- package/types/src/Popover/PopoverContext.d.ts +0 -6
package/MIGRATION.mdx
CHANGED
|
@@ -46,6 +46,17 @@ Remove usages of the `iconSize` prop.
|
|
|
46
46
|
|
|
47
47
|
## 4.39.0
|
|
48
48
|
|
|
49
|
+
### Deprecated `Menu.Item`'s `icon` prop
|
|
50
|
+
|
|
51
|
+
#### Change
|
|
52
|
+
`Menu.Item`'s `icon` prop is deprecated and will be removed in a future major version.
|
|
53
|
+
|
|
54
|
+
#### Context
|
|
55
|
+
The `Menu.Item` icon should not be used as `Menu.Item` as that restricted the location of the icon and it is now possible to place an adornment at the start or the end of the `Menu.Item` content.
|
|
56
|
+
|
|
57
|
+
#### Migration steps
|
|
58
|
+
Replace all usage of `Menu.Item`'s `icon` prop with `startAdornment` and/or `endAdornment`.
|
|
59
|
+
|
|
49
60
|
### Deprecated `TabBar` and `TabLayout`'s `appearance` prop
|
|
50
61
|
|
|
51
62
|
#### Change
|
|
@@ -60,7 +71,7 @@ Due to these factors, the `"context"` appearance has poor accessibility on two f
|
|
|
60
71
|
* it makes it difficult to distinguish the tabs from the content
|
|
61
72
|
* it has poor contrast between the selected and unselected tabs
|
|
62
73
|
|
|
63
|
-
The
|
|
74
|
+
The existence of this appearance has also encouraged uses of these components where tabs are not appropriate.
|
|
64
75
|
|
|
65
76
|
Additionally, this appearance has only been supported in Prisma themes, leading to visual inconsistency with Enterprise themes.
|
|
66
77
|
|
|
@@ -98,6 +109,22 @@ There are two possible use cases for a selectable `Button`:
|
|
|
98
109
|
1) If the `Button` was used as part of a `ButtonGroup`, replace it with a `RadioBar`.
|
|
99
110
|
2) If the `Button` was used standalone, replace it with a `Switch` with `appearance="toggle"`.
|
|
100
111
|
|
|
112
|
+
## 4.36.0
|
|
113
|
+
|
|
114
|
+
### Deprecated `ComboBox`, `ControlGroup`, and `StaticContent`'s `size` prop
|
|
115
|
+
|
|
116
|
+
#### Change
|
|
117
|
+
|
|
118
|
+
`ComboBox`, `ControlGroup`, and `StaticContent`'s `size` prop has been deprecated and will be removed in the next major version.
|
|
119
|
+
|
|
120
|
+
#### Context
|
|
121
|
+
|
|
122
|
+
The `size` prop currently does not do anything in `ComboBox`, `ControlGroup`, or `StaticContent`, so it will be removed in the next major version.
|
|
123
|
+
|
|
124
|
+
#### Migration steps
|
|
125
|
+
|
|
126
|
+
Remove all usage of `ComboBox`, `ControlGroup`, and `StaticContent`'s `size` prop. To change the size of components, use the `SplunkThemeProvider`'s `density` prop.
|
|
127
|
+
|
|
101
128
|
## 4.35.0
|
|
102
129
|
|
|
103
130
|
### Deprecated `Menu`'s `retainFocus` prop
|
|
@@ -142,7 +169,7 @@ For Enterprise themes:
|
|
|
142
169
|
* the `"pill"` value can be replaced with `"subtle"` with no other changes.
|
|
143
170
|
|
|
144
171
|
For Prisma themes:
|
|
145
|
-
* the `"flat"` appearance can be replaced
|
|
172
|
+
* the `"flat"` appearance can be replaced with `"subtle"`.
|
|
146
173
|
* the `"toggle"` appearance can be replaced with `"default"`.
|
|
147
174
|
|
|
148
175
|
### Improved `Card.Header` accessibility when rendering actions
|
|
@@ -223,6 +250,21 @@ and move them to the new `actions` prop.
|
|
|
223
250
|
|
|
224
251
|
## 4.30.0
|
|
225
252
|
|
|
253
|
+
### Deprecated `Text`'s `appearance` prop
|
|
254
|
+
|
|
255
|
+
#### Change
|
|
256
|
+
|
|
257
|
+
`Text`'s `appearance` prop has been deprecated and will be removed in the next major version.
|
|
258
|
+
|
|
259
|
+
#### Context
|
|
260
|
+
|
|
261
|
+
`Text`'s `appearance` prop allowed the values "default" and "search".
|
|
262
|
+
With the new `Search` component optimized for user interaction, Text's `appearance` prop has become unnecessary.
|
|
263
|
+
|
|
264
|
+
#### Migration steps
|
|
265
|
+
|
|
266
|
+
Replace all usage of `Text`'s `appearance="search"` value with the `Search` component. Remove all usage of `Text`'s `appearance="default"` value.
|
|
267
|
+
|
|
226
268
|
### Deprecated `NavigationProvider`'s `prefix` prop
|
|
227
269
|
|
|
228
270
|
#### Change
|
|
@@ -397,7 +439,7 @@ const StyledSHeading = styled(Heading)`
|
|
|
397
439
|
})};
|
|
398
440
|
`;
|
|
399
441
|
|
|
400
|
-
<StyledSHeading level={
|
|
442
|
+
<StyledSHeading level={5} variant="title4"/>
|
|
401
443
|
```
|
|
402
444
|
|
|
403
445
|
`level="ss"` styling:
|
|
@@ -410,7 +452,7 @@ const StyledSSHeading = styled(Heading)`
|
|
|
410
452
|
})};
|
|
411
453
|
`;
|
|
412
454
|
|
|
413
|
-
<StyledSHeading level={
|
|
455
|
+
<StyledSHeading level={6} variant="title5"/>
|
|
414
456
|
```
|
|
415
457
|
|
|
416
458
|
*Prisma*
|
|
@@ -423,14 +465,14 @@ const StyledSHeading = styled(Heading)`
|
|
|
423
465
|
color: ${variables.contentColorDefault};
|
|
424
466
|
`;
|
|
425
467
|
|
|
426
|
-
<StyledSHeading level={
|
|
468
|
+
<StyledSHeading level={5} variant="title4"/>
|
|
427
469
|
```
|
|
428
470
|
|
|
429
471
|
`level="ss"` styling:
|
|
430
472
|
|
|
431
473
|
```jsx
|
|
432
474
|
No styling is needed.
|
|
433
|
-
<Heading level="ss"> is equivalent to <StyledSHeading level={
|
|
475
|
+
<Heading level="ss"> is equivalent to <StyledSHeading level={6} variant="title5"/>
|
|
434
476
|
```
|
|
435
477
|
|
|
436
478
|
## 4.17.1
|
|
@@ -724,50 +766,3 @@ Previously, `Tooltip` closed as soon as a user stopped hovering over the toggle.
|
|
|
724
766
|
|
|
725
767
|
#### Migration steps
|
|
726
768
|
Replace all usage of `Popover`’s `pointerEvents` prop with `possibleOpenReasons` and `possibleCloseReasons`.
|
|
727
|
-
|
|
728
|
-
## 4.30.0
|
|
729
|
-
|
|
730
|
-
### Deprecated `Text`'s `appearance` prop
|
|
731
|
-
|
|
732
|
-
#### Change
|
|
733
|
-
|
|
734
|
-
`Text`'s `appearance` prop has been deprecated and will be removed in the next major version.
|
|
735
|
-
|
|
736
|
-
#### Context
|
|
737
|
-
|
|
738
|
-
`Text`'s `appearance` prop allowed the values "default" and "search".
|
|
739
|
-
With the new `Search` component optimized for user interaction, Text's `appearance` prop has become unnecessary.
|
|
740
|
-
|
|
741
|
-
#### Migration steps
|
|
742
|
-
|
|
743
|
-
Replace all usage of `Text`'s `appearance="search"` value with the `Search` component. Remove all usage of `Text`'s `appearance="default"` value.
|
|
744
|
-
|
|
745
|
-
## 4.36.0
|
|
746
|
-
|
|
747
|
-
### Deprecated `ComboBox`, `ControlGroup`, and `StaticContent`'s `size` prop
|
|
748
|
-
|
|
749
|
-
#### Change
|
|
750
|
-
|
|
751
|
-
`ComboBox`, `ControlGroup`, and `StaticContent`'s `size` prop has been deprecated and will be removed in the next major version.
|
|
752
|
-
|
|
753
|
-
#### Context
|
|
754
|
-
|
|
755
|
-
The `size` prop currently does not do anything in `ComboBox`, `ControlGroup`, or `StaticContent`, so it will be removed in the next major version.
|
|
756
|
-
|
|
757
|
-
#### Migration steps
|
|
758
|
-
|
|
759
|
-
Remove all usage of `ComboBox`, `ControlGroup`, and `StaticContent`'s `size` prop. To change the size of components, use the `SplunkThemeProvider`'s `density` prop.
|
|
760
|
-
|
|
761
|
-
## 4.39.0
|
|
762
|
-
|
|
763
|
-
### Deprecated `Menu.Item`'s `icon` prop
|
|
764
|
-
|
|
765
|
-
#### Change
|
|
766
|
-
`Menu.Item`'s `icon` prop is deprecated and will be removed in a future major version.
|
|
767
|
-
|
|
768
|
-
#### Context
|
|
769
|
-
The `Menu.Item` icon should not be used as `Menu.Item` as that restricted the location of the icon and it is now possible to place an adornment at the start or the end of the `Menu.Item` content.
|
|
770
|
-
|
|
771
|
-
#### Migration steps
|
|
772
|
-
Replace all usage of `Menu.Item`'s `icon` prop with `startAdornment` and/or `endAdornment`.
|
|
773
|
-
|
package/Menu.js
CHANGED
|
@@ -294,8 +294,8 @@
|
|
|
294
294
|
const L = require("lodash/isString");
|
|
295
295
|
var z = e.n(L);
|
|
296
296
|
// CONCATENATED MODULE: external "@splunk/react-icons/ChevronRight"
|
|
297
|
-
const
|
|
298
|
-
var
|
|
297
|
+
const K = require("@splunk/react-icons/ChevronRight");
|
|
298
|
+
var B = e.n(K);
|
|
299
299
|
// CONCATENATED MODULE: external "@splunk/react-icons/Checkmark"
|
|
300
300
|
const W = require("@splunk/react-icons/Checkmark");
|
|
301
301
|
var G = e.n(W);
|
|
@@ -668,10 +668,10 @@
|
|
|
668
668
|
}) : e[t] = r, e;
|
|
669
669
|
}
|
|
670
670
|
function ze(e) {
|
|
671
|
-
var t =
|
|
671
|
+
var t = Ke(e, "string");
|
|
672
672
|
return "symbol" == Ee(t) ? t : t + "";
|
|
673
673
|
}
|
|
674
|
-
function
|
|
674
|
+
function Ke(e, t) {
|
|
675
675
|
if ("object" != Ee(e) || !e) return e;
|
|
676
676
|
var r = e[Symbol.toPrimitive];
|
|
677
677
|
if (void 0 !== r) {
|
|
@@ -681,7 +681,7 @@
|
|
|
681
681
|
}
|
|
682
682
|
return ("string" === t ? String : Number)(e);
|
|
683
683
|
}
|
|
684
|
-
var
|
|
684
|
+
var Be = {
|
|
685
685
|
active: o().bool,
|
|
686
686
|
children: o().node,
|
|
687
687
|
description: o().string,
|
|
@@ -871,7 +871,7 @@
|
|
|
871
871
|
}), o && n().createElement(me, null, S ? n().createElement(Y(), {
|
|
872
872
|
hideDefaultTooltip: true,
|
|
873
873
|
screenReaderText: null
|
|
874
|
-
}) : n().createElement(
|
|
874
|
+
}) : n().createElement(B(), null)), T && n().createElement(ae, {
|
|
875
875
|
"data-test": "description"
|
|
876
876
|
}, u), n().createElement(ue, null, x ? n().createElement(se, null, x) : p && n().createElement(se, null, p), n().createElement(de, {
|
|
877
877
|
$truncate: y
|
|
@@ -887,7 +887,7 @@
|
|
|
887
887
|
} ]);
|
|
888
888
|
return r;
|
|
889
889
|
}(r.Component);
|
|
890
|
-
Le(Ve, "propTypes",
|
|
890
|
+
Le(Ve, "propTypes", Be);
|
|
891
891
|
Le(Ve, "defaultProps", We);
|
|
892
892
|
Le(Ve, "as", void 0);
|
|
893
893
|
Le(Ve, "contextType", h);
|
|
@@ -985,7 +985,7 @@
|
|
|
985
985
|
// @docs-props-type MenuPropsBase
|
|
986
986
|
if (false) {}
|
|
987
987
|
var d = (0, r.useContext)(h), f = d.role, v = f === void 0 ? "menu" : f;
|
|
988
|
-
var m = (0, r.useContext)(s.
|
|
988
|
+
var m = (0, r.useContext)(s.PopoverMenuContext), b = m.retainFocus;
|
|
989
989
|
var y = (0, r.useRef)(null);
|
|
990
990
|
var g = true;
|
|
991
991
|
if (a != null) {
|
|
@@ -1024,6 +1024,10 @@
|
|
|
1024
1024
|
}), [ i ]);
|
|
1025
1025
|
var w = lt(g);
|
|
1026
1026
|
var S = (0, r.useCallback)((function(e) {
|
|
1027
|
+
// if command key on Mac was pressed ignore
|
|
1028
|
+
if (e.nativeEvent.metaKey) {
|
|
1029
|
+
return;
|
|
1030
|
+
}
|
|
1027
1031
|
var t = st(e);
|
|
1028
1032
|
var r = t === "tab" || t === "tabShift";
|
|
1029
1033
|
var n = t === "enter";
|
package/Multiselect.js
CHANGED
|
@@ -1176,7 +1176,7 @@
|
|
|
1176
1176
|
role: "combobox",
|
|
1177
1177
|
"aria-expanded": "true",
|
|
1178
1178
|
"aria-controls": c,
|
|
1179
|
-
"aria-owns": l ? n : undefined,
|
|
1179
|
+
"aria-owns": w && l ? n : undefined,
|
|
1180
1180
|
"aria-label": (0, s._)("Filter"),
|
|
1181
1181
|
"aria-autocomplete": "list",
|
|
1182
1182
|
"aria-activedescendant": w && l ? n : undefined,
|