@splunk/react-ui 5.0.0-beta.2 → 5.0.0-beta.4
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/Accordion.js +185 -243
- package/Animation.js +2 -2
- package/Button.js +4 -4
- package/ButtonGroup.js +10 -11
- package/ButtonSimple.js +48 -42
- package/CHANGELOG.md +26 -0
- package/CHANGELOG.v5.mdx +81 -0
- package/Calendar.js +352 -469
- package/Card.js +178 -321
- package/Chip.js +154 -296
- package/Clickable.js +30 -30
- package/Code.js +64 -49
- package/Color.js +546 -462
- package/ComboBox.js +575 -767
- package/Date.js +144 -136
- package/Divider.js +29 -26
- package/DualListbox.js +441 -444
- package/File.js +707 -981
- package/FormRows.js +260 -286
- package/Image.js +124 -251
- package/JSONTree.js +129 -129
- package/Layout.d.ts +2 -0
- package/Link.js +12 -12
- package/MIGRATION.mdx +22 -1
- package/MIGRATION.v5.mdx +12 -1
- package/Menu.js +76 -76
- package/Message.js +77 -100
- package/MessageBar.js +141 -251
- package/Modal.js +42 -40
- package/ModalLayer.js +12 -12
- package/Multiselect.js +1989 -2362
- package/NonInteractiveCheckbox.js +30 -118
- package/Number.js +75 -73
- package/Popover.js +348 -350
- package/Progress.js +1 -1
- package/RadioBar.js +136 -136
- package/Resize.js +62 -65
- package/Scroll.js +2 -2
- package/Select.js +281 -283
- package/SidePanel.js +53 -55
- package/Slider.js +370 -364
- package/SlidingPanels.js +100 -102
- package/SplitButton.js +170 -343
- package/StaticContent.js +15 -13
- package/StepBar.js +61 -60
- package/Switch.js +150 -164
- package/TabBar.js +544 -417
- package/Table.js +1711 -1540
- package/Text.js +28 -26
- package/TextArea.js +26 -26
- package/Tooltip.js +416 -562
- package/TransitionOpen.js +179 -158
- package/Tree.d.ts +2 -0
- package/WaitSpinner.js +1 -1
- package/package.json +7 -9
- package/types/src/Accordion/Accordion.d.ts +14 -21
- package/types/src/Accordion/AccordionContext.d.ts +0 -1
- package/types/src/Animation/Animation.d.ts +2 -3
- package/types/src/AnimationToggle/docs/examples/Provider.d.ts +2 -2
- package/types/src/AnimationToggle/docs/examples/ToggleComponent.d.ts +2 -2
- package/types/src/AnimationToggle/useAnimationToggle.d.ts +1 -1
- package/types/src/Button/Button.d.ts +2 -2
- package/types/src/ButtonGroup/ButtonGroupContext.d.ts +0 -1
- package/types/src/ButtonSimple/ButtonSimple.d.ts +1 -3
- package/types/src/ButtonSimple/mixin.d.ts +1 -1
- package/types/src/Calendar/Calendar.d.ts +2 -2
- package/types/src/Calendar/{DateTable.d.ts → DateGrid.d.ts} +9 -9
- package/types/src/Calendar/Day.d.ts +8 -4
- package/types/src/Card/Card.d.ts +27 -14
- package/types/src/CardLayout/CardLayoutContext.d.ts +0 -1
- package/types/src/CardLayout/docs/examples/Interactive.d.ts +2 -2
- package/types/src/Clickable/Clickable.d.ts +1 -1
- package/types/src/CollapsiblePanel/SingleOpenPanelGroupContext.d.ts +0 -1
- package/types/src/Color/Color.d.ts +3 -3
- package/types/src/Color/ColorInput.d.ts +27 -0
- package/types/src/Color/Palette.d.ts +11 -18
- package/types/src/Color/Swatch.d.ts +3 -1
- package/types/src/ComboBox/ComboBox.d.ts +46 -50
- package/types/src/ComboBox/Option.d.ts +34 -18
- package/types/src/ControlGroup/docs/examples/CustomizedLabelTarget.d.ts +2 -2
- package/types/src/Date/Date.d.ts +3 -2
- package/types/src/Date/docs/examples/Controlled.d.ts +2 -2
- package/types/src/Date/docs/examples/HighlightToday.d.ts +2 -2
- package/types/src/DefinitionList/DefinitionListContext.d.ts +0 -1
- package/types/src/Divider/Divider.d.ts +14 -6
- package/types/src/Divider/docs/examples/Appearance.d.ts +3 -0
- package/types/src/DualListbox/DualListbox.d.ts +5 -1
- package/types/src/File/File.d.ts +6 -6
- package/types/src/File/FileContext.d.ts +0 -1
- package/types/src/File/Item.d.ts +11 -3
- package/types/src/File/ItemIcon.d.ts +7 -0
- package/types/src/File/docs/examples/Disabled.d.ts +2 -2
- package/types/src/File/docs/examples/DropAnywhere.d.ts +2 -2
- package/types/src/File/docs/examples/Multi.d.ts +2 -2
- package/types/src/File/docs/examples/Single.d.ts +2 -2
- package/types/src/FormRows/FormRows.d.ts +8 -8
- package/types/src/FormRows/FormRowsContext.d.ts +1 -2
- package/types/src/FormRows/Row.d.ts +2 -2
- package/types/src/FormRows/RowInternal.d.ts +1 -1
- package/types/src/FormRows/SortableRow.d.ts +3 -3
- package/types/src/FormRows/docs/examples/Basic.d.ts +2 -2
- package/types/src/FormRows/docs/examples/Header.d.ts +2 -2
- package/types/src/FormRows/docs/examples/Menu.d.ts +2 -2
- package/types/src/FormRows/docs/examples/ReorderOnly.d.ts +2 -2
- package/types/src/Image/Image.d.ts +1 -4
- package/types/src/JSONTree/docs/examples/Events.d.ts +2 -2
- package/types/src/Layout/Layout.d.ts +1 -0
- package/types/src/Link/icons/External.d.ts +1 -2
- package/types/src/Menu/Divider.d.ts +1 -1
- package/types/src/Menu/MenuContext.d.ts +0 -1
- package/types/src/MessageBar/MessageBar.d.ts +5 -1
- package/types/src/Modal/ModalContext.d.ts +0 -1
- package/types/src/Multiselect/Compact.d.ts +49 -21
- package/types/src/Multiselect/Multiselect.d.ts +73 -30
- package/types/src/Multiselect/Normal.d.ts +46 -57
- package/types/src/Multiselect/Option.d.ts +42 -18
- package/types/src/Multiselect/docs/examples/Children.d.ts +2 -2
- package/types/src/Multiselect/docs/examples/Controlled.d.ts +2 -2
- package/types/src/Multiselect/docs/examples/CustomizeSelected.d.ts +2 -2
- package/types/src/Multiselect/docs/examples/Disabled.d.ts +2 -2
- package/types/src/Multiselect/docs/examples/Error.d.ts +2 -2
- package/types/src/Multiselect/docs/examples/Fetching.d.ts +2 -2
- package/types/src/Multiselect/docs/examples/LoadMoreOnScrollBottom.d.ts +2 -2
- package/types/src/Multiselect/docs/examples/NewValues.d.ts +2 -2
- package/types/src/Multiselect/docs/examples/TabInput.d.ts +2 -2
- package/types/src/NonInteractiveCheckbox/NonInteractiveCheckbox.d.ts +9 -8
- package/types/src/Number/Number.d.ts +1 -0
- package/types/src/Number/docs/examples/Basic.d.ts +2 -2
- package/types/src/Number/docs/examples/Limits.d.ts +2 -2
- package/types/src/Number/docs/examples/Locale.d.ts +2 -2
- package/types/src/Popover/Popover.d.ts +1 -1
- package/types/src/Popover/PopoverMenuContext.d.ts +0 -1
- package/types/src/RadioBar/RadioBar.d.ts +1 -1
- package/types/src/RadioBar/RadioBarContext.d.ts +0 -1
- package/types/src/RadioList/RadioListContext.d.ts +0 -1
- package/types/src/Scroll/Inner.d.ts +1 -1
- package/types/src/Scroll/docs/examples/Controlled.d.ts +2 -2
- package/types/src/Search/Search.d.ts +2 -2
- package/types/src/Select/SelectBase.d.ts +2 -2
- package/types/src/SidePanel/SidePanel.d.ts +8 -3
- package/types/src/Slider/Slider.d.ts +1 -1
- package/types/src/Slider/docs/examples/Controlled.d.ts +2 -2
- package/types/src/Slider/docs/examples/CustomLabels.d.ts +2 -2
- package/types/src/Slider/getStepMarksBackground.d.ts +8 -0
- package/types/src/SlidingPanels/Panel.d.ts +2 -2
- package/types/src/SlidingPanels/SlidingPanels.d.ts +2 -2
- package/types/src/SlidingPanels/docs/examples/Basic.d.ts +2 -2
- package/types/src/SlidingPanels/docs/examples/Dropdown.d.ts +2 -2
- package/types/src/SplitButton/Item.d.ts +34 -20
- package/types/src/SplitButton/SplitButton.d.ts +4 -1
- package/types/src/StaticContent/StaticContent.d.ts +3 -1
- package/types/src/StepBar/Step.d.ts +1 -1
- package/types/src/StepBar/StepBar.d.ts +1 -1
- package/types/src/StepBar/StepBarContext.d.ts +0 -1
- package/types/src/Switch/Switch.d.ts +1 -9
- package/types/src/Switch/docs/examples/Basic.d.ts +2 -2
- package/types/src/Switch/docs/examples/Disabled.d.ts +2 -2
- package/types/src/TabBar/Tab.d.ts +12 -5
- package/types/src/TabBar/TabBar.d.ts +4 -3
- package/types/src/TabBar/TabBarContext.d.ts +7 -2
- package/types/src/Table/Head.d.ts +4 -15
- package/types/src/Table/HeadCell.d.ts +23 -25
- package/types/src/Table/HeadDropdownCell.d.ts +23 -26
- package/types/src/Table/HeadInner.d.ts +4 -10
- package/types/src/Table/Row.d.ts +6 -6
- package/types/src/Table/Table.d.ts +3 -8
- package/types/src/Table/TableContext.d.ts +0 -1
- package/types/src/Table/Toggle.d.ts +1 -1
- package/types/src/Text/Text.d.ts +5 -1
- package/types/src/Tooltip/Tooltip.d.ts +26 -58
- package/types/src/Tooltip/docs/examples/Controlled.d.ts +2 -2
- package/types/src/TransitionOpen/TransitionOpen.d.ts +6 -1
- package/types/src/Tree/TreeContext.d.ts +0 -1
- package/types/src/useForceUpdate/useForceUpdate.d.ts +0 -1
- package/types/src/useResizeObserver/useResizeObserver.d.ts +2 -1
- package/types/src/utils/types.d.ts +2 -3
- package/useResizeObserver.js +26 -19
- package/types/src/File/Icon.d.ts +0 -3
- package/types/src/File/IconCloud.d.ts +0 -3
- package/types/src/File/PaperClip.d.ts +0 -3
- package/types/src/File/Retry.d.ts +0 -2
- package/types/src/File/Trash.d.ts +0 -3
- package/types/src/FormRows/icons/FormRowsPlusIcon.d.ts +0 -3
- package/types/src/Image/icons/Cross.d.ts +0 -3
- package/types/src/Multiselect/docs/examples/CompactSelectAll.d.ts +0 -3
- package/types/src/Table/docs/examples/prisma/DockedHeaderScrollbar.d.ts +0 -3
- package/types/src/Tooltip/InfoIcon.d.ts +0 -4
package/Progress.js
CHANGED
|
@@ -88,7 +88,7 @@
|
|
|
88
88
|
var y = c().div.withConfig({
|
|
89
89
|
displayName: "ProgressStyles__StyledProgressWrapper",
|
|
90
90
|
componentId: "csowex-0"
|
|
91
|
-
})([ "height:", ";position:relative;border:1px solid ", ";border-radius:", ";background:", ";&::before{display:block;position:absolute;top:-1px;left:-1px;content:'';border-radius:", ";height:100%;", " ", "}" ], b, d.variables.interactiveColorBorder, d.variables.borderRadius, d.variables.neutral100, d.variables.borderRadius, (function(e) {
|
|
91
|
+
})([ "", " height:", ";position:relative;border:1px solid ", ";border-radius:", ";background:", ";&::before{display:block;position:absolute;top:-1px;left:-1px;content:'';border-radius:", ";height:100%;", " ", "}" ], d.mixins.reset("block"), b, d.variables.interactiveColorBorder, d.variables.borderRadius, d.variables.neutral100, d.variables.borderRadius, (function(e) {
|
|
92
92
|
var r = e.$animated, t = e.$type;
|
|
93
93
|
// Animated is only supported for the info type.
|
|
94
94
|
// This is enforced in the component and duplicating here
|
package/RadioBar.js
CHANGED
|
@@ -61,8 +61,8 @@
|
|
|
61
61
|
e.r(r);
|
|
62
62
|
// EXPORTS
|
|
63
63
|
e.d(r, {
|
|
64
|
-
Option: () => /* reexport */
|
|
65
|
-
default: () => /* reexport */
|
|
64
|
+
Option: () => /* reexport */ B,
|
|
65
|
+
default: () => /* reexport */ G
|
|
66
66
|
});
|
|
67
67
|
// CONCATENATED MODULE: external "react"
|
|
68
68
|
const t = require("react");
|
|
@@ -71,8 +71,8 @@
|
|
|
71
71
|
const o = require("prop-types");
|
|
72
72
|
var a = e.n(o);
|
|
73
73
|
// CONCATENATED MODULE: external "lodash/omit"
|
|
74
|
-
const
|
|
75
|
-
var
|
|
74
|
+
const i = require("lodash/omit");
|
|
75
|
+
var l = e.n(i);
|
|
76
76
|
// CONCATENATED MODULE: external "@splunk/ui-utils/keyboard"
|
|
77
77
|
const u = require("@splunk/ui-utils/keyboard");
|
|
78
78
|
// CONCATENATED MODULE: external "@splunk/react-ui/useControlled"
|
|
@@ -88,30 +88,29 @@
|
|
|
88
88
|
var p = e.n(f);
|
|
89
89
|
// CONCATENATED MODULE: ./src/RadioBar/OptionStyles.ts
|
|
90
90
|
var y = 10;
|
|
91
|
-
var m =
|
|
92
|
-
var g = v()(p()).withConfig({
|
|
91
|
+
var m = v()(p()).withConfig({
|
|
93
92
|
displayName: "OptionStyles__StyledButton",
|
|
94
93
|
componentId: "fyq77p-0"
|
|
95
|
-
})([ "border:", " solid ", ";border-radius:0;
|
|
94
|
+
})([ "border:", " solid ", ";border-radius:0;height:", ";min-height:", ";min-width:0;padding:", " ", ";z-index:", ";&&{color:", ";}&:first-child{border-top-left-radius:", ";border-bottom-left-radius:", ";}&:last-child{border-top-right-radius:", ";border-bottom-right-radius:", ";}&:not(:last-child){margin-right:-", ";}&&:focus{background-color:", ";box-shadow:", ";color:", ";z-index:", ";border:0;span{padding:0 ", ";}}&:not([disabled],[aria-disabled='true']){", "}&[disabled],&[aria-disabled='true']{background-color:", ";color:", ";z-index:0;}" ], b.variables.inputBorderWidth, b.variables.borderColor, b.variables.inputHeight, b.variables.inputHeight, b.variables.spacingXSmall, b.variables.spacingSmall, y, b.variables.contentColorDefault, b.variables.borderRadius, b.variables.borderRadius, b.variables.borderRadius, b.variables.borderRadius, b.variables.inputBorderWidth, b.variables.actionColorBackgroundSecondaryActive, b.variables.focusShadowInset, b.variables.contentColorActive, y * 5, b.variables.inputBorderWidth, (0,
|
|
96
95
|
b.pickVariant)("$optionSelected", {
|
|
97
|
-
true: (0, s.css)([ "background-color:", ";border-color:", ";border-width:", ";color:", ";
|
|
96
|
+
true: (0, s.css)([ "background-color:", ";border-color:", ";border-width:", ";color:", ";z-index:", ";" ], b.variables.actionColorBackgroundSecondaryActive, b.variables.actionColorBorderSecondaryActive, b.variables.inputBorderWidth, b.variables.contentColorActive, y * 4),
|
|
98
97
|
false: (0, s.css)([ "&:hover{background-color:", ";border-color:", ";color:", ";z-index:", ";}" ], b.variables.actionColorBackgroundSecondaryHover, b.variables.borderColor, b.variables.contentColorActive, y * 3)
|
|
99
98
|
}), b.variables.actionColorBackgroundSecondaryDisabled, b.variables.contentColorDisabled);
|
|
100
|
-
var
|
|
99
|
+
var g = v().div.withConfig({
|
|
101
100
|
displayName: "OptionStyles__StyledLabel",
|
|
102
101
|
componentId: "fyq77p-1"
|
|
103
102
|
})([ "", " flex:0 1 auto;" ], b.mixins.ellipsis);
|
|
104
|
-
var
|
|
103
|
+
var h = v().div.withConfig({
|
|
105
104
|
displayName: "OptionStyles__StyledAdornment",
|
|
106
105
|
componentId: "fyq77p-2"
|
|
107
106
|
})([ "display:flex;" ]);
|
|
108
107
|
// CONCATENATED MODULE: ./src/RadioBar/RadioBarContext.tsx
|
|
109
|
-
var
|
|
110
|
-
|
|
111
|
-
/* harmony default export */ const
|
|
108
|
+
var O = (0, t.createContext)({});
|
|
109
|
+
O.displayName = "RadioBar";
|
|
110
|
+
/* harmony default export */ const S = O;
|
|
112
111
|
// CONCATENATED MODULE: ./src/RadioBar/Option.tsx
|
|
113
|
-
function
|
|
114
|
-
return
|
|
112
|
+
function w() {
|
|
113
|
+
return w = Object.assign ? Object.assign.bind() : function(e) {
|
|
115
114
|
for (var r = 1; r < arguments.length; r++) {
|
|
116
115
|
var t = arguments[r];
|
|
117
116
|
for (var n in t) {
|
|
@@ -119,11 +118,11 @@
|
|
|
119
118
|
}
|
|
120
119
|
}
|
|
121
120
|
return e;
|
|
122
|
-
},
|
|
121
|
+
}, w.apply(null, arguments);
|
|
123
122
|
}
|
|
124
|
-
function
|
|
123
|
+
function C(e, r) {
|
|
125
124
|
if (null == e) return {};
|
|
126
|
-
var t, n, o =
|
|
125
|
+
var t, n, o = j(e, r);
|
|
127
126
|
if (Object.getOwnPropertySymbols) {
|
|
128
127
|
var a = Object.getOwnPropertySymbols(e);
|
|
129
128
|
for (n = 0; n < a.length; n++) {
|
|
@@ -132,7 +131,7 @@
|
|
|
132
131
|
}
|
|
133
132
|
return o;
|
|
134
133
|
}
|
|
135
|
-
function
|
|
134
|
+
function j(e, r) {
|
|
136
135
|
if (null == e) return {};
|
|
137
136
|
var t = {};
|
|
138
137
|
for (var n in e) {
|
|
@@ -143,7 +142,7 @@
|
|
|
143
142
|
}
|
|
144
143
|
return t;
|
|
145
144
|
}
|
|
146
|
-
var
|
|
145
|
+
var k = {
|
|
147
146
|
disabled: a().bool,
|
|
148
147
|
startAdornment: a().node,
|
|
149
148
|
endAdornment: a().node,
|
|
@@ -155,19 +154,19 @@
|
|
|
155
154
|
/** The value of the `Option`. */
|
|
156
155
|
value: a().any.isRequired
|
|
157
156
|
};
|
|
158
|
-
function
|
|
159
|
-
var r = e.disabled, o = e.label, a = e.selected,
|
|
157
|
+
function x(e) {
|
|
158
|
+
var r = e.disabled, o = e.label, a = e.selected, i = e.startAdornment, l = e.endAdornment, u = e.value, d = e.role, c = d === void 0 ? "radio" : d, s = C(e, [ "disabled", "label", "selected", "startAdornment", "endAdornment", "value", "role" ]);
|
|
160
159
|
// @docs-props-type OptionPropsBase
|
|
161
|
-
var v = (0, t.useContext)(
|
|
162
|
-
var
|
|
163
|
-
if (
|
|
164
|
-
if (u ===
|
|
165
|
-
|
|
160
|
+
var v = (0, t.useContext)(S), b = v.onClick, f = v.error, p = v.onKeyDown, y = v.firstValue, O = v.selectedValue;
|
|
161
|
+
var j = -1;
|
|
162
|
+
if (O) {
|
|
163
|
+
if (u === O) {
|
|
164
|
+
j = 0;
|
|
166
165
|
}
|
|
167
166
|
} else if (u === y) {
|
|
168
|
-
|
|
167
|
+
j = 0;
|
|
169
168
|
}
|
|
170
|
-
var k =
|
|
169
|
+
var k = j;
|
|
171
170
|
var x = (0, t.useCallback)((function(e) {
|
|
172
171
|
if (!a) {
|
|
173
172
|
b === null || b === void 0 ? void 0 : b(e, {
|
|
@@ -176,14 +175,14 @@
|
|
|
176
175
|
});
|
|
177
176
|
}
|
|
178
177
|
}), [ o, b, a, u ]);
|
|
179
|
-
var
|
|
178
|
+
var B = (0, t.useCallback)((function(e) {
|
|
180
179
|
return p === null || p === void 0 ? void 0 : p(e, {
|
|
181
180
|
value: u,
|
|
182
181
|
label: o
|
|
183
182
|
});
|
|
184
183
|
}), [ o, p, u ]);
|
|
185
184
|
|
|
186
|
-
return n().createElement(
|
|
185
|
+
return n().createElement(m, w({
|
|
187
186
|
"aria-invalid": f,
|
|
188
187
|
"data-test": "option",
|
|
189
188
|
"data-test-value": u,
|
|
@@ -196,33 +195,33 @@
|
|
|
196
195
|
role: c,
|
|
197
196
|
"aria-checked": a,
|
|
198
197
|
tabIndex: k,
|
|
199
|
-
onKeyDown:
|
|
200
|
-
}),
|
|
198
|
+
onKeyDown: B
|
|
199
|
+
}), i && n().createElement(h, null, i), o && n().createElement(g, null, o), l && n().createElement(h, null, l));
|
|
201
200
|
}
|
|
202
|
-
|
|
203
|
-
/* harmony default export */ const
|
|
201
|
+
x.propTypes = k;
|
|
202
|
+
/* harmony default export */ const B = x;
|
|
204
203
|
// CONCATENATED MODULE: external "@splunk/react-ui/Box"
|
|
205
|
-
const
|
|
206
|
-
var
|
|
204
|
+
const P = require("@splunk/react-ui/Box");
|
|
205
|
+
var A = e.n(P);
|
|
207
206
|
// CONCATENATED MODULE: ./src/RadioBar/RadioBarStyles.ts
|
|
208
|
-
var
|
|
207
|
+
var E = v()(A()).withConfig({
|
|
209
208
|
displayName: "RadioBarStyles__StyledRadioBar",
|
|
210
209
|
componentId: "gg1b79-0"
|
|
211
210
|
})([ "height:", ";", "" ], b.variables.inputHeight, (function(e) {
|
|
212
211
|
var r = e.$error;
|
|
213
|
-
return r && (0, s.css)([ "& > ", "{border-color:", ";:not([disabled],[aria-disabled='true']){&:hover{border-color:", ";}&[aria-checked='true']{background-color:", ";border-color:", ";}}}" ],
|
|
212
|
+
return r && (0, s.css)([ "& > ", "{border-color:", ";:not([disabled],[aria-disabled='true']){&:hover{border-color:", ";}&[aria-checked='true']{background-color:", ";border-color:", ";}}}" ], m, b.variables.actionColorBorderDestructiveSecondary, b.variables.actionColorBorderDestructiveSecondary, b.variables.actionColorBackgroundDestructiveSecondaryActive, b.variables.actionColorBorderDestructiveSecondaryActive);
|
|
214
213
|
}));
|
|
215
214
|
// CONCATENATED MODULE: ./src/RadioBar/RadioBar.tsx
|
|
216
|
-
function
|
|
215
|
+
function R(e) {
|
|
217
216
|
"@babel/helpers - typeof";
|
|
218
|
-
return
|
|
217
|
+
return R = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
|
|
219
218
|
return typeof e;
|
|
220
219
|
} : function(e) {
|
|
221
220
|
return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
|
|
222
|
-
},
|
|
221
|
+
}, R(e);
|
|
223
222
|
}
|
|
224
|
-
function
|
|
225
|
-
return
|
|
223
|
+
function q() {
|
|
224
|
+
return q = Object.assign ? Object.assign.bind() : function(e) {
|
|
226
225
|
for (var r = 1; r < arguments.length; r++) {
|
|
227
226
|
var t = arguments[r];
|
|
228
227
|
for (var n in t) {
|
|
@@ -230,9 +229,9 @@
|
|
|
230
229
|
}
|
|
231
230
|
}
|
|
232
231
|
return e;
|
|
233
|
-
},
|
|
232
|
+
}, q.apply(null, arguments);
|
|
234
233
|
}
|
|
235
|
-
function
|
|
234
|
+
function D(e, r) {
|
|
236
235
|
var t = Object.keys(e);
|
|
237
236
|
if (Object.getOwnPropertySymbols) {
|
|
238
237
|
var n = Object.getOwnPropertySymbols(e);
|
|
@@ -242,87 +241,87 @@
|
|
|
242
241
|
}
|
|
243
242
|
return t;
|
|
244
243
|
}
|
|
245
|
-
function
|
|
244
|
+
function I(e) {
|
|
246
245
|
for (var r = 1; r < arguments.length; r++) {
|
|
247
246
|
var t = null != arguments[r] ? arguments[r] : {};
|
|
248
|
-
r % 2 ?
|
|
249
|
-
|
|
250
|
-
})) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) :
|
|
247
|
+
r % 2 ? D(Object(t), !0).forEach((function(r) {
|
|
248
|
+
_(e, r, t[r]);
|
|
249
|
+
})) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : D(Object(t)).forEach((function(r) {
|
|
251
250
|
Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
|
|
252
251
|
}));
|
|
253
252
|
}
|
|
254
253
|
return e;
|
|
255
254
|
}
|
|
256
|
-
function
|
|
257
|
-
return (r =
|
|
255
|
+
function _(e, r, t) {
|
|
256
|
+
return (r = T(r)) in e ? Object.defineProperty(e, r, {
|
|
258
257
|
value: t,
|
|
259
258
|
enumerable: !0,
|
|
260
259
|
configurable: !0,
|
|
261
260
|
writable: !0
|
|
262
261
|
}) : e[r] = t, e;
|
|
263
262
|
}
|
|
264
|
-
function
|
|
265
|
-
var r =
|
|
266
|
-
return "symbol" ==
|
|
263
|
+
function T(e) {
|
|
264
|
+
var r = V(e, "string");
|
|
265
|
+
return "symbol" == R(r) ? r : r + "";
|
|
267
266
|
}
|
|
268
|
-
function
|
|
269
|
-
if ("object" !=
|
|
267
|
+
function V(e, r) {
|
|
268
|
+
if ("object" != R(e) || !e) return e;
|
|
270
269
|
var t = e[Symbol.toPrimitive];
|
|
271
270
|
if (void 0 !== t) {
|
|
272
271
|
var n = t.call(e, r || "default");
|
|
273
|
-
if ("object" !=
|
|
272
|
+
if ("object" != R(n)) return n;
|
|
274
273
|
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
275
274
|
}
|
|
276
275
|
return ("string" === r ? String : Number)(e);
|
|
277
276
|
}
|
|
278
|
-
function
|
|
279
|
-
return
|
|
277
|
+
function M(e, r) {
|
|
278
|
+
return W(e) || H(e, r) || $(e, r) || N();
|
|
280
279
|
}
|
|
281
|
-
function
|
|
280
|
+
function N() {
|
|
282
281
|
throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
283
282
|
}
|
|
284
|
-
function
|
|
283
|
+
function $(e, r) {
|
|
285
284
|
if (e) {
|
|
286
|
-
if ("string" == typeof e) return
|
|
285
|
+
if ("string" == typeof e) return z(e, r);
|
|
287
286
|
var t = {}.toString.call(e).slice(8, -1);
|
|
288
|
-
return "Object" === t && e.constructor && (t = e.constructor.name), "Map" === t || "Set" === t ? Array.from(e) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ?
|
|
287
|
+
return "Object" === t && e.constructor && (t = e.constructor.name), "Map" === t || "Set" === t ? Array.from(e) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? z(e, r) : void 0;
|
|
289
288
|
}
|
|
290
289
|
}
|
|
291
|
-
function
|
|
290
|
+
function z(e, r) {
|
|
292
291
|
(null == r || r > e.length) && (r = e.length);
|
|
293
292
|
for (var t = 0, n = Array(r); t < r; t++) {
|
|
294
293
|
n[t] = e[t];
|
|
295
294
|
}
|
|
296
295
|
return n;
|
|
297
296
|
}
|
|
298
|
-
function
|
|
297
|
+
function H(e, r) {
|
|
299
298
|
var t = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
|
|
300
299
|
if (null != t) {
|
|
301
|
-
var n, o, a,
|
|
300
|
+
var n, o, a, i, l = [], u = !0, d = !1;
|
|
302
301
|
try {
|
|
303
302
|
if (a = (t = t.call(e)).next, 0 === r) {
|
|
304
303
|
if (Object(t) !== t) return;
|
|
305
304
|
u = !1;
|
|
306
|
-
} else for (;!(u = (n = a.call(t)).done) && (
|
|
305
|
+
} else for (;!(u = (n = a.call(t)).done) && (l.push(n.value), l.length !== r); u = !0) {
|
|
307
306
|
}
|
|
308
307
|
} catch (e) {
|
|
309
308
|
d = !0, o = e;
|
|
310
309
|
} finally {
|
|
311
310
|
try {
|
|
312
|
-
if (!u && null != t["return"] && (
|
|
311
|
+
if (!u && null != t["return"] && (i = t["return"](), Object(i) !== i)) return;
|
|
313
312
|
} finally {
|
|
314
313
|
if (d) throw o;
|
|
315
314
|
}
|
|
316
315
|
}
|
|
317
|
-
return
|
|
316
|
+
return l;
|
|
318
317
|
}
|
|
319
318
|
}
|
|
320
|
-
function
|
|
319
|
+
function W(e) {
|
|
321
320
|
if (Array.isArray(e)) return e;
|
|
322
321
|
}
|
|
323
|
-
function
|
|
322
|
+
function K(e, r) {
|
|
324
323
|
if (null == e) return {};
|
|
325
|
-
var t, n, o =
|
|
324
|
+
var t, n, o = F(e, r);
|
|
326
325
|
if (Object.getOwnPropertySymbols) {
|
|
327
326
|
var a = Object.getOwnPropertySymbols(e);
|
|
328
327
|
for (n = 0; n < a.length; n++) {
|
|
@@ -331,7 +330,7 @@
|
|
|
331
330
|
}
|
|
332
331
|
return o;
|
|
333
332
|
}
|
|
334
|
-
function
|
|
333
|
+
function F(e, r) {
|
|
335
334
|
if (null == e) return {};
|
|
336
335
|
var t = {};
|
|
337
336
|
for (var n in e) {
|
|
@@ -342,7 +341,7 @@
|
|
|
342
341
|
}
|
|
343
342
|
return t;
|
|
344
343
|
}
|
|
345
|
-
/** @public */ var
|
|
344
|
+
/** @public */ var L = {
|
|
346
345
|
children: a().node,
|
|
347
346
|
defaultValue: a().any,
|
|
348
347
|
describedBy: a().string,
|
|
@@ -358,22 +357,22 @@
|
|
|
358
357
|
value: a().any
|
|
359
358
|
};
|
|
360
359
|
// TODO(SUI-7012): Once converted to a functional component, this function can be removed and RadioBar should use useRovingFocus hook
|
|
361
|
-
var
|
|
360
|
+
var U = function e(r, t, n, o) {
|
|
362
361
|
var a = r === "forward" ? 1 : -1;
|
|
363
|
-
var
|
|
364
|
-
var
|
|
362
|
+
var i = r === "forward" ? "nextSibling" : "previousSibling";
|
|
363
|
+
var l = r === "forward" ? "firstElementChild" : "lastElementChild";
|
|
365
364
|
var u = r === "forward" ? 0 : t - 1;
|
|
366
|
-
var d = n[
|
|
365
|
+
var d = n[i];
|
|
367
366
|
var c = null;
|
|
368
367
|
var s = o + a;
|
|
369
368
|
while (d !== n && c === null) {
|
|
370
369
|
if (d === null) {
|
|
371
370
|
var v;
|
|
372
|
-
d = (v = n.parentElement) === null || v === void 0 ? void 0 : v[
|
|
371
|
+
d = (v = n.parentElement) === null || v === void 0 ? void 0 : v[l];
|
|
373
372
|
s = u;
|
|
374
373
|
}
|
|
375
374
|
if (d.disabled) {
|
|
376
|
-
var b = d[
|
|
375
|
+
var b = d[i];
|
|
377
376
|
d = b;
|
|
378
377
|
s += a;
|
|
379
378
|
} else {
|
|
@@ -387,17 +386,17 @@
|
|
|
387
386
|
};
|
|
388
387
|
/**
|
|
389
388
|
* RadioBar is a form control that provides the ability to select one option out of a group.
|
|
390
|
-
*/ function
|
|
391
|
-
var r = e.children, o = e.defaultValue, a = e.describedBy,
|
|
389
|
+
*/ function X(e) {
|
|
390
|
+
var r = e.children, o = e.defaultValue, a = e.describedBy, i = e.elementRef, d = e.error, s = e.labelledBy, v = e.name, b = e.onChange, f = e.required, p = e.role, y = p === void 0 ? "radiogroup" : p, m = e.value, g = K(e, [ "children", "defaultValue", "describedBy", "elementRef", "error", "labelledBy", "name", "onChange", "required", "role", "value" ]);
|
|
392
391
|
// @docs-props-type RadioBarPropsBase
|
|
393
|
-
var
|
|
392
|
+
var h = c()({
|
|
394
393
|
componentName: "RadioBar",
|
|
395
394
|
/* eslint-disable-next-line prefer-rest-params */
|
|
396
395
|
componentProps: arguments[0]
|
|
397
396
|
});
|
|
398
|
-
var
|
|
399
|
-
var
|
|
400
|
-
var
|
|
397
|
+
var O = (0, t.useState)(o), w = M(O, 2), C = w[0], j = w[1];
|
|
398
|
+
var k = h ? m : C;
|
|
399
|
+
var x = (0, t.useMemo)((function() {
|
|
401
400
|
// Everything in here is grouped because together they are based on children changing
|
|
402
401
|
var e = t.Children.toArray(r).filter(t.isValidElement);
|
|
403
402
|
var n = e.map((function(e) {
|
|
@@ -410,9 +409,9 @@
|
|
|
410
409
|
var a = e.map((function(e, r) {
|
|
411
410
|
|
|
412
411
|
return (0, t.cloneElement)(e, {
|
|
413
|
-
selected: e.props.value ===
|
|
412
|
+
selected: e.props.value === k,
|
|
414
413
|
key: e.key || r,
|
|
415
|
-
role:
|
|
414
|
+
role: y === "radiogroup" ? "radio" : "menuitemradio"
|
|
416
415
|
});
|
|
417
416
|
}));
|
|
418
417
|
return {
|
|
@@ -420,81 +419,82 @@
|
|
|
420
419
|
disabled: o,
|
|
421
420
|
filteredValues: n
|
|
422
421
|
};
|
|
423
|
-
}), [ r,
|
|
424
|
-
var
|
|
425
|
-
var
|
|
426
|
-
return
|
|
427
|
-
}), [ A,
|
|
422
|
+
}), [ r, y, k ]), B = x.childrenFormatted, P = x.disabled, A = x.filteredValues;
|
|
423
|
+
var R = A[0];
|
|
424
|
+
var D = (0, t.useMemo)((function() {
|
|
425
|
+
return m == null || A.includes(k);
|
|
426
|
+
}), [ A, k, m ]);
|
|
428
427
|
(0, t.useEffect)((function() {
|
|
429
428
|
if (false) {}
|
|
430
|
-
}), [ A,
|
|
431
|
-
var
|
|
432
|
-
if (
|
|
433
|
-
|
|
434
|
-
name:
|
|
429
|
+
}), [ A, k, D ]);
|
|
430
|
+
var _ = (0, t.useCallback)((function(e, r) {
|
|
431
|
+
if (m !== r.value) {
|
|
432
|
+
b === null || b === void 0 ? void 0 : b(e, I({
|
|
433
|
+
name: v
|
|
435
434
|
}, r));
|
|
436
|
-
if (!
|
|
437
|
-
|
|
435
|
+
if (!h) {
|
|
436
|
+
j(r.value);
|
|
438
437
|
}
|
|
439
438
|
}
|
|
440
|
-
}), [
|
|
441
|
-
var
|
|
439
|
+
}), [ h, v, b, m ]);
|
|
440
|
+
var T = (0, t.useCallback)((function(e, r) {
|
|
442
441
|
var t = r.value, n = r.label;
|
|
443
442
|
var o = (0, u.keycode)(e.nativeEvent);
|
|
444
443
|
var a = e.currentTarget;
|
|
445
|
-
var
|
|
446
|
-
var
|
|
444
|
+
var i = null;
|
|
445
|
+
var l = 0;
|
|
447
446
|
var d = A.indexOf(t);
|
|
448
447
|
if (o === "down" || o === "right") {
|
|
449
448
|
e.preventDefault();
|
|
450
|
-
var c =
|
|
451
|
-
|
|
452
|
-
|
|
449
|
+
var c = U("forward", A.length, a, d), s = c.nextTargetRes, v = c.nextIndexRes;
|
|
450
|
+
i = s;
|
|
451
|
+
l = v;
|
|
453
452
|
} else if (o === "up" || o === "left") {
|
|
454
453
|
e.preventDefault();
|
|
455
|
-
var b =
|
|
456
|
-
|
|
457
|
-
|
|
454
|
+
var b = U("backward", A.length, a, d), f = b.nextTargetRes, p = b.nextIndexRes;
|
|
455
|
+
i = f;
|
|
456
|
+
l = p;
|
|
458
457
|
}
|
|
459
|
-
if (
|
|
458
|
+
if (i) {
|
|
460
459
|
var y;
|
|
461
|
-
(y =
|
|
462
|
-
var m = A[
|
|
463
|
-
|
|
460
|
+
(y = i) === null || y === void 0 ? void 0 : y.focus();
|
|
461
|
+
var m = A[l];
|
|
462
|
+
_(e, {
|
|
464
463
|
value: m,
|
|
465
464
|
label: n
|
|
466
465
|
});
|
|
467
466
|
}
|
|
468
|
-
}), [ A,
|
|
469
|
-
var
|
|
467
|
+
}), [ A, _ ]);
|
|
468
|
+
var V = (0, t.useMemo)((function() {
|
|
470
469
|
return {
|
|
471
|
-
error:
|
|
472
|
-
firstValue:
|
|
473
|
-
onClick:
|
|
474
|
-
onKeyDown:
|
|
475
|
-
selectedValue:
|
|
470
|
+
error: d,
|
|
471
|
+
firstValue: R,
|
|
472
|
+
onClick: _,
|
|
473
|
+
onKeyDown: T,
|
|
474
|
+
selectedValue: D ? k : undefined
|
|
476
475
|
};
|
|
477
|
-
}), [
|
|
476
|
+
}), [ d, R, _, T, D, k ]);
|
|
478
477
|
|
|
479
|
-
return n().createElement(
|
|
478
|
+
return n().createElement(E, q({
|
|
480
479
|
flex: true,
|
|
481
480
|
$disabled: P,
|
|
482
|
-
$error:
|
|
481
|
+
$error: d,
|
|
482
|
+
elementRef: i,
|
|
483
483
|
"data-test": "radio-bar",
|
|
484
|
-
"data-test-value":
|
|
485
|
-
role:
|
|
486
|
-
"aria-labelledby":
|
|
484
|
+
"data-test-value": k,
|
|
485
|
+
role: y,
|
|
486
|
+
"aria-labelledby": s,
|
|
487
487
|
"aria-describedby": a,
|
|
488
488
|
"aria-disabled": P || undefined,
|
|
489
|
-
"aria-required":
|
|
490
|
-
"aria-invalid":
|
|
491
|
-
},
|
|
492
|
-
value:
|
|
493
|
-
},
|
|
489
|
+
"aria-required": f,
|
|
490
|
+
"aria-invalid": y === "radiogroup" ? d : undefined
|
|
491
|
+
}, l()(g, "onChange")), n().createElement(S.Provider, {
|
|
492
|
+
value: V
|
|
493
|
+
}, B));
|
|
494
494
|
}
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
/* harmony default export */ const
|
|
495
|
+
X.Option = B;
|
|
496
|
+
X.propTypes = L;
|
|
497
|
+
/* harmony default export */ const G = X;
|
|
498
498
|
// only for styled components using RadioBar
|
|
499
499
|
// CONCATENATED MODULE: ./src/RadioBar/index.ts
|
|
500
500
|
module.exports = r;
|