@hitachivantara/uikit-react-core 5.24.4 → 5.24.6
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/dist/cjs/components/BaseDropdown/BaseDropdown.cjs +5 -0
- package/dist/cjs/components/BaseDropdown/BaseDropdown.cjs.map +1 -1
- package/dist/cjs/components/Dropdown/Dropdown.cjs +1 -0
- package/dist/cjs/components/Dropdown/Dropdown.cjs.map +1 -1
- package/dist/cjs/components/Focus/Focus.cjs +25 -39
- package/dist/cjs/components/Focus/Focus.cjs.map +1 -1
- package/dist/cjs/components/Focus/Focus.styles.cjs +43 -40
- package/dist/cjs/components/Focus/Focus.styles.cjs.map +1 -1
- package/dist/cjs/components/List/List.cjs +38 -28
- package/dist/cjs/components/List/List.cjs.map +1 -1
- package/dist/cjs/components/List/List.styles.cjs +38 -149
- package/dist/cjs/components/List/List.styles.cjs.map +1 -1
- package/dist/cjs/components/MultiButton/MultiButton.cjs +15 -11
- package/dist/cjs/components/MultiButton/MultiButton.cjs.map +1 -1
- package/dist/cjs/components/MultiButton/MultiButton.styles.cjs +109 -151
- package/dist/cjs/components/MultiButton/MultiButton.styles.cjs.map +1 -1
- package/dist/cjs/components/SimpleGrid/SimpleGrid.cjs +11 -3
- package/dist/cjs/components/SimpleGrid/SimpleGrid.cjs.map +1 -1
- package/dist/cjs/components/SimpleGrid/SimpleGrid.styles.cjs +29 -28
- package/dist/cjs/components/SimpleGrid/SimpleGrid.styles.cjs.map +1 -1
- package/dist/cjs/components/Slider/Slider.cjs +45 -29
- package/dist/cjs/components/Slider/Slider.cjs.map +1 -1
- package/dist/cjs/components/Slider/Slider.styles.cjs +66 -150
- package/dist/cjs/components/Slider/Slider.styles.cjs.map +1 -1
- package/dist/cjs/components/Slider/SliderInput/SliderInput.cjs +13 -9
- package/dist/cjs/components/Slider/SliderInput/SliderInput.cjs.map +1 -1
- package/dist/cjs/components/Slider/SliderInput/SliderInput.styles.cjs +16 -51
- package/dist/cjs/components/Slider/SliderInput/SliderInput.styles.cjs.map +1 -1
- package/dist/cjs/components/VerticalNavigation/NavigationSlider/NavigationSlider.styles.cjs +1 -1
- package/dist/cjs/index.cjs +8 -8
- package/dist/esm/components/BaseDropdown/BaseDropdown.js +5 -0
- package/dist/esm/components/BaseDropdown/BaseDropdown.js.map +1 -1
- package/dist/esm/components/Dropdown/Dropdown.js +1 -0
- package/dist/esm/components/Dropdown/Dropdown.js.map +1 -1
- package/dist/esm/components/Focus/Focus.js +27 -41
- package/dist/esm/components/Focus/Focus.js.map +1 -1
- package/dist/esm/components/Focus/Focus.styles.js +43 -38
- package/dist/esm/components/Focus/Focus.styles.js.map +1 -1
- package/dist/esm/components/List/List.js +39 -28
- package/dist/esm/components/List/List.js.map +1 -1
- package/dist/esm/components/List/List.styles.js +38 -147
- package/dist/esm/components/List/List.styles.js.map +1 -1
- package/dist/esm/components/MultiButton/MultiButton.js +18 -13
- package/dist/esm/components/MultiButton/MultiButton.js.map +1 -1
- package/dist/esm/components/MultiButton/MultiButton.styles.js +109 -149
- package/dist/esm/components/MultiButton/MultiButton.styles.js.map +1 -1
- package/dist/esm/components/SimpleGrid/SimpleGrid.js +12 -4
- package/dist/esm/components/SimpleGrid/SimpleGrid.js.map +1 -1
- package/dist/esm/components/SimpleGrid/SimpleGrid.styles.js +29 -26
- package/dist/esm/components/SimpleGrid/SimpleGrid.styles.js.map +1 -1
- package/dist/esm/components/Slider/Slider.js +45 -31
- package/dist/esm/components/Slider/Slider.js.map +1 -1
- package/dist/esm/components/Slider/Slider.styles.js +67 -147
- package/dist/esm/components/Slider/Slider.styles.js.map +1 -1
- package/dist/esm/components/Slider/SliderInput/SliderInput.js +16 -11
- package/dist/esm/components/Slider/SliderInput/SliderInput.js.map +1 -1
- package/dist/esm/components/Slider/SliderInput/SliderInput.styles.js +16 -49
- package/dist/esm/components/Slider/SliderInput/SliderInput.styles.js.map +1 -1
- package/dist/esm/components/VerticalNavigation/NavigationSlider/NavigationSlider.styles.js +1 -1
- package/dist/esm/index.js +238 -238
- package/dist/types/index.d.ts +438 -408
- package/package.json +5 -5
- package/dist/cjs/components/Focus/focusClasses.cjs +0 -8
- package/dist/cjs/components/Focus/focusClasses.cjs.map +0 -1
- package/dist/cjs/components/List/listClasses.cjs +0 -8
- package/dist/cjs/components/List/listClasses.cjs.map +0 -1
- package/dist/cjs/components/MultiButton/multiButtonClasses.cjs +0 -8
- package/dist/cjs/components/MultiButton/multiButtonClasses.cjs.map +0 -1
- package/dist/cjs/components/Slider/SliderInput/sliderInputClasses.cjs +0 -8
- package/dist/cjs/components/Slider/SliderInput/sliderInputClasses.cjs.map +0 -1
- package/dist/cjs/components/Slider/sliderClasses.cjs +0 -8
- package/dist/cjs/components/Slider/sliderClasses.cjs.map +0 -1
- package/dist/esm/components/Focus/focusClasses.js +0 -8
- package/dist/esm/components/Focus/focusClasses.js.map +0 -1
- package/dist/esm/components/List/listClasses.js +0 -8
- package/dist/esm/components/List/listClasses.js.map +0 -1
- package/dist/esm/components/MultiButton/multiButtonClasses.js +0 -8
- package/dist/esm/components/MultiButton/multiButtonClasses.js.map +0 -1
- package/dist/esm/components/Slider/SliderInput/sliderInputClasses.js +0 -8
- package/dist/esm/components/Slider/SliderInput/sliderInputClasses.js.map +0 -1
- package/dist/esm/components/Slider/sliderClasses.js +0 -8
- package/dist/esm/components/Slider/sliderClasses.js.map +0 -1
|
@@ -1,55 +1,20 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const
|
|
4
|
-
const
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
styles: "display:flex"
|
|
18
|
-
} : {
|
|
19
|
-
name: "zjik7",
|
|
20
|
-
styles: "display:flex",
|
|
21
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvU2xpZGVyL1NsaWRlcklucHV0L1NsaWRlcklucHV0LnN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBSTBCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvU2xpZGVyL1NsaWRlcklucHV0L1NsaWRlcklucHV0LnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcblxuaW1wb3J0IHsgSHZJbnB1dCB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzL0lucHV0XCI7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRSb290ID0gc3R5bGVkKFwiZGl2XCIpKHsgZGlzcGxheTogXCJmbGV4XCIgfSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRJbnB1dENvbnRhaW5lciA9IHN0eWxlZChcImRpdlwiKSh7IGRpc3BsYXk6IFwiZmxleFwiIH0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkSW5wdXQgPSBzdHlsZWQoSHZJbnB1dCkoeyBtYXhXaWR0aDogXCI1MHB4XCIgfSk7XG4iXX0= */",
|
|
22
|
-
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
3
|
+
const classes = require("../../../utils/classes.cjs");
|
|
4
|
+
const {
|
|
5
|
+
staticClasses,
|
|
6
|
+
useClasses
|
|
7
|
+
} = classes.createClasses("HvSliderInput", {
|
|
8
|
+
inputRoot: {
|
|
9
|
+
display: "flex"
|
|
10
|
+
},
|
|
11
|
+
input: {
|
|
12
|
+
maxWidth: "50px"
|
|
13
|
+
},
|
|
14
|
+
inputContainer: {
|
|
15
|
+
display: "flex"
|
|
16
|
+
}
|
|
23
17
|
});
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
} : {
|
|
27
|
-
target: "e13c18d81",
|
|
28
|
-
label: "StyledInputContainer"
|
|
29
|
-
})(process.env.NODE_ENV === "production" ? {
|
|
30
|
-
name: "zjik7",
|
|
31
|
-
styles: "display:flex"
|
|
32
|
-
} : {
|
|
33
|
-
name: "zjik7",
|
|
34
|
-
styles: "display:flex",
|
|
35
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvU2xpZGVyL1NsaWRlcklucHV0L1NsaWRlcklucHV0LnN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBTW9DIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvU2xpZGVyL1NsaWRlcklucHV0L1NsaWRlcklucHV0LnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcblxuaW1wb3J0IHsgSHZJbnB1dCB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzL0lucHV0XCI7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRSb290ID0gc3R5bGVkKFwiZGl2XCIpKHsgZGlzcGxheTogXCJmbGV4XCIgfSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRJbnB1dENvbnRhaW5lciA9IHN0eWxlZChcImRpdlwiKSh7IGRpc3BsYXk6IFwiZmxleFwiIH0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkSW5wdXQgPSBzdHlsZWQoSHZJbnB1dCkoeyBtYXhXaWR0aDogXCI1MHB4XCIgfSk7XG4iXX0= */",
|
|
36
|
-
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
37
|
-
});
|
|
38
|
-
const StyledInput = /* @__PURE__ */ _styled__default.default(Input.HvInput, process.env.NODE_ENV === "production" ? {
|
|
39
|
-
target: "e13c18d80"
|
|
40
|
-
} : {
|
|
41
|
-
target: "e13c18d80",
|
|
42
|
-
label: "StyledInput"
|
|
43
|
-
})(process.env.NODE_ENV === "production" ? {
|
|
44
|
-
name: "3yvj47",
|
|
45
|
-
styles: "max-width:50px"
|
|
46
|
-
} : {
|
|
47
|
-
name: "3yvj47",
|
|
48
|
-
styles: "max-width:50px",
|
|
49
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvU2xpZGVyL1NsaWRlcklucHV0L1NsaWRlcklucHV0LnN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBUTJCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvU2xpZGVyL1NsaWRlcklucHV0L1NsaWRlcklucHV0LnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcblxuaW1wb3J0IHsgSHZJbnB1dCB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzL0lucHV0XCI7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRSb290ID0gc3R5bGVkKFwiZGl2XCIpKHsgZGlzcGxheTogXCJmbGV4XCIgfSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRJbnB1dENvbnRhaW5lciA9IHN0eWxlZChcImRpdlwiKSh7IGRpc3BsYXk6IFwiZmxleFwiIH0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkSW5wdXQgPSBzdHlsZWQoSHZJbnB1dCkoeyBtYXhXaWR0aDogXCI1MHB4XCIgfSk7XG4iXX0= */",
|
|
50
|
-
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
51
|
-
});
|
|
52
|
-
exports.StyledInput = StyledInput;
|
|
53
|
-
exports.StyledInputContainer = StyledInputContainer;
|
|
54
|
-
exports.StyledRoot = StyledRoot;
|
|
18
|
+
exports.staticClasses = staticClasses;
|
|
19
|
+
exports.useClasses = useClasses;
|
|
55
20
|
//# sourceMappingURL=SliderInput.styles.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SliderInput.styles.cjs","sources":["../../../../../src/components/Slider/SliderInput/SliderInput.styles.tsx"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"file":"SliderInput.styles.cjs","sources":["../../../../../src/components/Slider/SliderInput/SliderInput.styles.tsx"],"sourcesContent":["import { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvSliderInput\", {\n inputRoot: { display: \"flex\" },\n input: { maxWidth: \"50px\" },\n inputContainer: { display: \"flex\" },\n});\n"],"names":["staticClasses","useClasses","createClasses","inputRoot","display","input","maxWidth","inputContainer"],"mappings":";;;AAEa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,QAAAA,cAAc,iBAAiB;AAAA,EAC1EC,WAAW;AAAA,IAAEC,SAAS;AAAA,EAAO;AAAA,EAC7BC,OAAO;AAAA,IAAEC,UAAU;AAAA,EAAO;AAAA,EAC1BC,gBAAgB;AAAA,IAAEH,SAAS;AAAA,EAAO;AACpC,CAAC;;;"}
|
|
@@ -2,8 +2,8 @@
|
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
const _styled = require("@emotion/styled/base");
|
|
4
4
|
const uikitStyles = require("@hitachivantara/uikit-styles");
|
|
5
|
-
const ListItem = require("../../ListContainer/ListItem/ListItem.cjs");
|
|
6
5
|
const ListItem_styles = require("../../ListContainer/ListItem/ListItem.styles.cjs");
|
|
6
|
+
const ListItem = require("../../ListContainer/ListItem/ListItem.cjs");
|
|
7
7
|
const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
|
|
8
8
|
const _styled__default = /* @__PURE__ */ _interopDefault(_styled);
|
|
9
9
|
const StyledListItem = /* @__PURE__ */ _styled__default.default(ListItem.HvListItem, process.env.NODE_ENV === "production" ? {
|
package/dist/cjs/index.cjs
CHANGED
|
@@ -8,7 +8,7 @@ const utils = require("./components/Typography/utils.cjs");
|
|
|
8
8
|
const Typography_styles = require("./components/Typography/Typography.styles.cjs");
|
|
9
9
|
const Typography = require("./components/Typography/Typography.cjs");
|
|
10
10
|
const Box = require("./components/Box/Box.cjs");
|
|
11
|
-
const
|
|
11
|
+
const Focus_styles = require("./components/Focus/Focus.styles.cjs");
|
|
12
12
|
const Focus = require("./components/Focus/Focus.cjs");
|
|
13
13
|
const ListContainer_styles = require("./components/ListContainer/ListContainer.styles.cjs");
|
|
14
14
|
const ListContainer = require("./components/ListContainer/ListContainer.cjs");
|
|
@@ -93,7 +93,7 @@ const Link_styles = require("./components/Link/Link.styles.cjs");
|
|
|
93
93
|
const Link = require("./components/Link/Link.cjs");
|
|
94
94
|
const Loading_styles = require("./components/Loading/Loading.styles.cjs");
|
|
95
95
|
const Loading = require("./components/Loading/Loading.cjs");
|
|
96
|
-
const
|
|
96
|
+
const MultiButton_styles = require("./components/MultiButton/MultiButton.styles.cjs");
|
|
97
97
|
const MultiButton = require("./components/MultiButton/MultiButton.cjs");
|
|
98
98
|
const Panel_styles = require("./components/Panel/Panel.styles.cjs");
|
|
99
99
|
const Panel = require("./components/Panel/Panel.cjs");
|
|
@@ -137,7 +137,7 @@ const TagsInput_styles = require("./components/TagsInput/TagsInput.styles.cjs");
|
|
|
137
137
|
const TagsInput = require("./components/TagsInput/TagsInput.cjs");
|
|
138
138
|
const CheckBoxGroup_styles = require("./components/CheckBoxGroup/CheckBoxGroup.styles.cjs");
|
|
139
139
|
const CheckBoxGroup = require("./components/CheckBoxGroup/CheckBoxGroup.cjs");
|
|
140
|
-
const
|
|
140
|
+
const List_styles = require("./components/List/List.styles.cjs");
|
|
141
141
|
const List = require("./components/List/List.cjs");
|
|
142
142
|
const RadioGroup_styles = require("./components/RadioGroup/RadioGroup.styles.cjs");
|
|
143
143
|
const RadioGroup = require("./components/RadioGroup/RadioGroup.cjs");
|
|
@@ -232,7 +232,7 @@ const treeViewItemClasses = require("./components/VerticalNavigation/TreeView/tr
|
|
|
232
232
|
const TreeView = require("./components/VerticalNavigation/TreeView/TreeView.cjs");
|
|
233
233
|
const TreeViewItem = require("./components/VerticalNavigation/TreeView/TreeViewItem.cjs");
|
|
234
234
|
const VerticalNavigationContext = require("./components/VerticalNavigation/VerticalNavigationContext.cjs");
|
|
235
|
-
const
|
|
235
|
+
const Slider_styles = require("./components/Slider/Slider.styles.cjs");
|
|
236
236
|
const Slider = require("./components/Slider/Slider.cjs");
|
|
237
237
|
const FilterGroup_styles = require("./components/FilterGroup/FilterGroup.styles.cjs");
|
|
238
238
|
const FilterGroup = require("./components/FilterGroup/FilterGroup.cjs");
|
|
@@ -315,7 +315,7 @@ exports.typographyVariants = utils.typographyVariants;
|
|
|
315
315
|
exports.typographyClasses = Typography_styles.staticClasses;
|
|
316
316
|
exports.HvTypography = Typography.HvTypography;
|
|
317
317
|
exports.HvBox = Box.HvBox;
|
|
318
|
-
exports.focusClasses =
|
|
318
|
+
exports.focusClasses = Focus_styles.staticClasses;
|
|
319
319
|
exports.HvFocus = Focus.HvFocus;
|
|
320
320
|
exports.listContainerClasses = ListContainer_styles.staticClasses;
|
|
321
321
|
exports.HvListContainer = ListContainer.HvListContainer;
|
|
@@ -413,7 +413,7 @@ exports.linkClasses = Link_styles.staticClasses;
|
|
|
413
413
|
exports.HvLink = Link.HvLink;
|
|
414
414
|
exports.loadingClasses = Loading_styles.staticClasses;
|
|
415
415
|
exports.HvLoading = Loading.HvLoading;
|
|
416
|
-
exports.multiButtonClasses =
|
|
416
|
+
exports.multiButtonClasses = MultiButton_styles.staticClasses;
|
|
417
417
|
exports.HvMultiButton = MultiButton.HvMultiButton;
|
|
418
418
|
exports.panelClasses = Panel_styles.staticClasses;
|
|
419
419
|
exports.HvPanel = Panel.HvPanel;
|
|
@@ -458,7 +458,7 @@ exports.tagsInputClasses = TagsInput_styles.staticClasses;
|
|
|
458
458
|
exports.HvTagsInput = TagsInput.HvTagsInput;
|
|
459
459
|
exports.checkBoxGroupClasses = CheckBoxGroup_styles.staticClasses;
|
|
460
460
|
exports.HvCheckBoxGroup = CheckBoxGroup.HvCheckBoxGroup;
|
|
461
|
-
exports.listClasses =
|
|
461
|
+
exports.listClasses = List_styles.staticClasses;
|
|
462
462
|
exports.HvList = List.HvList;
|
|
463
463
|
exports.radioGroupClasses = RadioGroup_styles.staticClasses;
|
|
464
464
|
exports.HvRadioGroup = RadioGroup.HvRadioGroup;
|
|
@@ -588,7 +588,7 @@ exports.treeViewItemClasses = treeViewItemClasses.default;
|
|
|
588
588
|
exports.HvVerticalNavigationTreeView = TreeView.HvVerticalNavigationTreeView;
|
|
589
589
|
exports.HvVerticalNavigationTreeViewItem = TreeViewItem.HvVerticalNavigationTreeViewItem;
|
|
590
590
|
exports.VerticalNavigationContext = VerticalNavigationContext.VerticalNavigationContext;
|
|
591
|
-
exports.sliderClasses =
|
|
591
|
+
exports.sliderClasses = Slider_styles.staticClasses;
|
|
592
592
|
exports.HvSlider = Slider.HvSlider;
|
|
593
593
|
exports.filterGroupClasses = FilterGroup_styles.staticClasses;
|
|
594
594
|
exports.HvFilterGroup = FilterGroup.HvFilterGroup;
|
|
@@ -34,6 +34,7 @@ const HvBaseDropdown = (props) => {
|
|
|
34
34
|
defaultExpanded = false,
|
|
35
35
|
disabled = false,
|
|
36
36
|
readOnly = false,
|
|
37
|
+
required = false,
|
|
37
38
|
disablePortal = false,
|
|
38
39
|
variableWidth = false,
|
|
39
40
|
placement = "right",
|
|
@@ -193,6 +194,8 @@ const HvBaseDropdown = (props) => {
|
|
|
193
194
|
"aria-controls": isOpen ? setId(elementId, "children-container") : void 0,
|
|
194
195
|
"aria-label": others["aria-label"] ?? void 0,
|
|
195
196
|
"aria-labelledby": others["aria-labelledby"] ?? void 0,
|
|
197
|
+
"aria-required": required ?? void 0,
|
|
198
|
+
"aria-readonly": readOnly ?? void 0,
|
|
196
199
|
tabIndex: disabled ? -1 : 0,
|
|
197
200
|
ref: handleDropdownHeaderRef,
|
|
198
201
|
...dropdownHeaderProps,
|
|
@@ -287,6 +290,8 @@ const HvBaseDropdown = (props) => {
|
|
|
287
290
|
role: ariaRole,
|
|
288
291
|
"aria-expanded": ariaExpanded,
|
|
289
292
|
"aria-owns": isOpen ? setId(elementId, "children-container") : void 0,
|
|
293
|
+
"aria-required": required ?? void 0,
|
|
294
|
+
"aria-readonly": readOnly ?? void 0,
|
|
290
295
|
className: cx(classes.anchor, {
|
|
291
296
|
[classes.rootDisabled]: disabled
|
|
292
297
|
}, className),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseDropdown.js","sources":["../../../../src/components/BaseDropdown/BaseDropdown.tsx"],"sourcesContent":["import React, {\n useMemo,\n useState,\n useCallback,\n KeyboardEventHandler,\n} from \"react\";\n\nimport { createPortal } from \"react-dom\";\n\nimport {\n ClickAwayListener,\n ClickAwayListenerProps,\n PopperPlacementType,\n PopperProps,\n} from \"@mui/material\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { usePopper } from \"react-popper\";\nimport { detectOverflow, ModifierArguments, Options } from \"@popperjs/core\";\n\nimport { HvTypography } from \"@core/components/Typography\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { useForkRef } from \"@core/hooks/useForkRef\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { isKey, isOneOfKeys } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport { getFirstAndLastFocus } from \"@core/utils/focusableElementFinder\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./BaseDropdown.styles\";\nimport BaseDropdownContext from \"./BaseDropdownContext\";\n\nexport { staticClasses as baseDropdownClasses };\n\nexport type HvBaseDropdownClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvBaseDropdownProps\n extends HvBaseProps<HTMLDivElement, \"placeholder\"> {\n /**\n * The role of the element that triggers the popup.\n *\n * Defaults to \"combobox\" if `component` and the default\n * \"textbox\" header is used, undefined otherwise.\n */\n role?: string;\n /**\n * Header placeholder.\n */\n placeholder?: string | React.ReactNode;\n /**\n * If `true` the dropdown is disabled unable to be interacted, if `false` it is enabled.\n */\n disabled?: boolean;\n /**\n * If `true` the dropdown will be in read only mode, unable to be interacted.\n */\n readOnly?: boolean;\n /**\n * Disable the portal behavior.\n * The children stay within it's parent DOM hierarchy.\n */\n disablePortal?: boolean;\n /**\n * If `true` the dropdown width depends size of content if `false` the width depends on the header size.\n * Defaults to `false`.\n */\n variableWidth?: boolean;\n /**\n * If `true` the dropdown starts opened if `false` it starts closed.\n */\n expanded?: boolean;\n /**\n * When uncontrolled, defines the initial expanded state.\n */\n defaultExpanded?: boolean;\n /**\n * An object containing props to be wired to the popper component.\n */\n popperProps?: Partial<PopperProps>;\n /**\n * Placement of the dropdown.\n */\n placement?: \"left\" | \"right\";\n /**\n * Replacement for the header component.\n */\n component?: React.ReactNode;\n /**\n * Adornment to replace the default arrows.\n */\n adornment?: React.ReactNode;\n /**\n * When dropdown changes the expanded state.\n */\n onToggle?: (event: Event, open: boolean) => void;\n /**\n * When user click outside the open container.\n */\n onClickOutside?: (event: Event) => void;\n /**\n * Callback called when the dropdown is opened and ready,\n * commonly used to set focus to the content.\n */\n onContainerCreation?: (container: HTMLElement | null) => void;\n /**\n * Attributes applied to the dropdown header element.\n */\n dropdownHeaderProps?: React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLDivElement>,\n HTMLDivElement\n >;\n /**\n * Pass a ref to the dropdown header element.\n */\n dropdownHeaderRef?: React.Ref<any>;\n /**\n * A Jss Object used to override or extend the component styles applied.\n */\n classes?: HvBaseDropdownClasses;\n}\n\nexport const HvBaseDropdown = (props: HvBaseDropdownProps) => {\n const {\n id,\n className,\n classes: classesProp,\n children,\n role,\n placeholder,\n component,\n adornment,\n expanded,\n dropdownHeaderProps,\n defaultExpanded = false,\n disabled = false,\n readOnly = false,\n disablePortal = false,\n variableWidth = false,\n placement = \"right\",\n popperProps = {},\n dropdownHeaderRef: dropdownHeaderRefProp,\n onToggle,\n onClickOutside,\n onContainerCreation,\n \"aria-expanded\": ariaExpandedProp,\n ...others\n } = useDefaultProps(\"HvBaseDropdown\", props);\n const { classes, cx } = useClasses(classesProp);\n\n const { rootId } = useTheme();\n\n const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));\n\n const [referenceElement, setReferenceElement] = useState<HTMLElement | null>(\n null\n );\n const [popperElement, setPopperElement] = useState<HTMLElement | null>(null);\n const [popperMaxSize, setPopperMaxSize] = useState<{\n width?: number;\n height?: number;\n }>({});\n\n const handleDropdownHeaderRefProp = useForkRef(\n dropdownHeaderRefProp,\n dropdownHeaderProps?.ref\n );\n const handleDropdownHeaderRef = useForkRef(\n setReferenceElement,\n handleDropdownHeaderRefProp\n );\n\n const ariaRole = role || (component == null ? \"combobox\" : undefined);\n\n const ariaExpanded = ariaExpandedProp ?? (ariaRole ? !!isOpen : undefined);\n\n const elementId = useUniqueId(id, \"hvbasedropdown\");\n\n const bottom: PopperPlacementType =\n placement && `bottom-${placement === \"right\" ? \"start\" : \"end\"}`;\n\n const extensionWidth = referenceElement\n ? referenceElement?.offsetWidth\n : \"inherit\";\n\n const { modifiers: popperPropsModifiers = [], ...otherPopperProps } =\n popperProps;\n\n const onFirstUpdate = useCallback(() => {\n if (onContainerCreation) onContainerCreation(popperElement);\n }, [onContainerCreation, popperElement]);\n\n const widthCalculator = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n state.styles.popper.width = `${state.rects.reference.width}px`;\n },\n []\n );\n\n const widthCalculatorEffect = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n state.elements.popper.style.width = `${\n (state.elements.reference as any).offsetWidth\n }px`;\n },\n []\n );\n\n const applyMaxSizeCalculator = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n // The `maxSize` modifier provides this data\n const { width, height } = state.modifiersData.maxSize;\n if (width !== popperMaxSize?.width || height !== popperMaxSize?.height) {\n setPopperMaxSize({ width, height });\n }\n\n state.styles.popper = {\n ...state.styles.popper,\n maxWidth: `${width}px`,\n maxHeight: `${height}px`,\n };\n },\n [popperMaxSize]\n );\n\n const maxSizeCalculator = useCallback(\n ({ state, name, options }: ModifierArguments<Options>) => {\n const overflow = detectOverflow(state, options);\n\n const x = state.modifiersData.preventOverflow?.x || 0;\n const y = state.modifiersData.preventOverflow?.y || 0;\n\n const popperWidth = state.rects.popper.width;\n const popperHeight = state.rects.popper.height;\n\n const basePlacement = state.placement.split(\"-\")[0];\n\n const widthProp = basePlacement === \"left\" ? \"left\" : \"right\";\n const heightProp = basePlacement === \"top\" ? \"top\" : \"bottom\";\n\n state.modifiersData[name] = {\n width: popperWidth - overflow[widthProp] - x,\n height: popperHeight - overflow[heightProp] - y,\n };\n },\n []\n );\n\n const modifiers: PopperProps[\"modifiers\"] = useMemo(\n () => [\n {\n name: \"variableWidth\",\n enabled: !variableWidth,\n phase: \"beforeWrite\",\n requires: [\"computeStyles\"],\n fn: widthCalculator,\n effect: widthCalculatorEffect,\n },\n {\n name: \"maxSize\",\n enabled: true,\n phase: \"main\",\n requiresIfExists: [\"offset\", \"preventOverflow\", \"flip\"],\n fn: maxSizeCalculator,\n },\n {\n name: \"applyMaxSize\",\n enabled: true,\n phase: \"beforeWrite\",\n requires: [\"maxSize\"],\n fn: applyMaxSizeCalculator,\n },\n ...popperPropsModifiers,\n ],\n [\n maxSizeCalculator,\n applyMaxSizeCalculator,\n popperPropsModifiers,\n variableWidth,\n widthCalculator,\n widthCalculatorEffect,\n ]\n );\n\n const { styles: popperStyles, attributes } = usePopper(\n referenceElement,\n popperElement,\n {\n placement: bottom,\n modifiers,\n onFirstUpdate,\n ...otherPopperProps,\n }\n );\n\n const popperPlacement =\n attributes.popper?.[\"data-popper-placement\"] ?? \"bottom\";\n\n const handleToggle = useCallback(\n (event) => {\n if (event && !isKey(event, \"Tab\")) {\n event.preventDefault();\n }\n\n const notControlKey =\n !!event?.code &&\n !isOneOfKeys(event, [\"Tab\", \"Enter\", \"Esc\", \"ArrowDown\", \"Space\"]);\n\n const ignoredCombinations =\n (isKey(event, \"Esc\") && !isOpen) ||\n (isKey(event, \"ArrowDown\") && isOpen) ||\n (isKey(event, \"Tab\") && !isOpen);\n\n if (disabled || notControlKey || ignoredCombinations) return;\n\n const newOpen = !isOpen;\n\n /* If about to close focus on the header component. */\n const focusHeader = () => {\n if (!newOpen) {\n // Focus-ring won't be visible even if using the keyboard:\n // https://github.com/WICG/focus-visible/issues/88\n referenceElement?.focus({ preventScroll: true });\n }\n\n return newOpen;\n };\n setIsOpen(focusHeader());\n\n onToggle?.(event, newOpen);\n },\n [isOpen, disabled, setIsOpen, onToggle, referenceElement]\n );\n\n const headerComponent = (() => {\n if (component) {\n return React.cloneElement(component as React.ReactElement, {\n ref: handleDropdownHeaderRef,\n \"aria-controls\": isOpen\n ? setId(elementId, \"children-container\")\n : undefined,\n });\n }\n\n const ExpanderComponent = isOpen ? DropUpXS : DropDownXS;\n\n return (\n <div\n id={setId(id, \"header\")}\n className={cx(classes.header, {\n [classes.headerDisabled]: disabled,\n [classes.headerReadOnly]: readOnly,\n [classes.headerOpen]: isOpen,\n [classes.headerOpenUp]: isOpen && popperPlacement.includes(\"top\"),\n [classes.headerOpenDown]:\n isOpen && popperPlacement.includes(\"bottom\"),\n })}\n role={ariaRole === \"combobox\" ? \"textbox\" : undefined}\n style={disabled || readOnly ? { pointerEvents: \"none\" } : undefined}\n aria-controls={\n isOpen ? setId(elementId, \"children-container\") : undefined\n }\n aria-label={others[\"aria-label\"] ?? undefined}\n aria-labelledby={others[\"aria-labelledby\"] ?? undefined}\n // Removes the element from the navigation sequence for keyboard focus if disabled\n tabIndex={disabled ? -1 : 0}\n ref={handleDropdownHeaderRef}\n {...dropdownHeaderProps}\n >\n <div className={classes.selection}>\n {placeholder && typeof placeholder === \"string\" ? (\n <HvTypography\n className={cx(classes.placeholder, {\n [classes.selectionDisabled]: disabled,\n })}\n variant=\"body\"\n >\n {placeholder}\n </HvTypography>\n ) : (\n placeholder\n )}\n </div>\n <div className={classes.arrowContainer}>\n {adornment || (\n <ExpanderComponent\n iconSize=\"XS\"\n color={disabled ? theme.colors.secondary_60 : undefined}\n className={classes.arrow}\n />\n )}\n </div>\n </div>\n );\n })();\n\n const containerComponent = (() => {\n /**\n * Handle keyboard inside children container.\n */\n const handleContainerKeyDown: KeyboardEventHandler = (event) => {\n if (isKey(event, \"Esc\")) {\n handleToggle(event);\n }\n if (isKey(event, \"Tab\") && !event.shiftKey) {\n const focusList = getFirstAndLastFocus(popperElement);\n if (document.activeElement === focusList?.last) {\n event.preventDefault();\n focusList?.first?.focus();\n }\n }\n };\n\n const handleOutside: ClickAwayListenerProps[\"onClickAway\"] = (event) => {\n const isButtonClick = referenceElement?.contains(event.target as any);\n if (!isButtonClick) {\n onClickOutside?.(event);\n setIsOpen(false);\n onToggle?.(event, false);\n }\n };\n\n const container = (\n <div\n role=\"tooltip\"\n ref={setPopperElement}\n className={classes.container}\n style={popperStyles.popper}\n {...attributes.popper}\n >\n <ClickAwayListener onClickAway={handleOutside}>\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n <div onKeyDown={handleContainerKeyDown}>\n {popperPlacement.includes(\"bottom\") && (\n <div\n style={{ width: extensionWidth }}\n className={cx(classes.inputExtensionOpen, {\n [classes.inputExtensionLeftPosition]:\n popperPlacement.includes(\"end\"),\n })}\n />\n )}\n <BaseDropdownContext.Provider value={popperMaxSize}>\n <div\n id={setId(elementId, \"children-container\")}\n className={cx(classes.panel, {\n [classes.panelOpenedUp]: popperPlacement.includes(\"top\"),\n [classes.panelOpenedDown]: popperPlacement.includes(\"bottom\"),\n })}\n >\n {children}\n </div>\n </BaseDropdownContext.Provider>\n {popperPlacement.includes(\"top\") && (\n <div\n style={{ width: extensionWidth }}\n className={cx(\n classes.inputExtensionOpen,\n classes.inputExtensionOpenShadow,\n {\n [classes.inputExtensionFloatRight]:\n popperPlacement.includes(\"end\"),\n [classes.inputExtensionFloatLeft]:\n popperPlacement.includes(\"start\"),\n }\n )}\n />\n )}\n </div>\n </ClickAwayListener>\n </div>\n );\n\n if (disablePortal) return container;\n\n return createPortal(\n container,\n document.getElementById(rootId || \"\") || document.body\n );\n })();\n\n return (\n <div className={classes.root}>\n <div\n id={id}\n role={ariaRole}\n aria-expanded={ariaExpanded}\n aria-owns={isOpen ? setId(elementId, \"children-container\") : undefined}\n className={cx(\n classes.anchor,\n { [classes.rootDisabled]: disabled },\n className\n )}\n {...(!readOnly && {\n onKeyDown: handleToggle,\n onClick: handleToggle,\n })}\n // Removes the element from the navigation sequence for keyboard focus\n tabIndex={-1}\n {...others}\n >\n {headerComponent}\n </div>\n {isOpen && containerComponent}\n </div>\n );\n};\n"],"names":["HvBaseDropdown","props","id","className","classes","classesProp","children","role","placeholder","component","adornment","expanded","dropdownHeaderProps","defaultExpanded","disabled","readOnly","disablePortal","variableWidth","placement","popperProps","dropdownHeaderRef","dropdownHeaderRefProp","onToggle","onClickOutside","onContainerCreation","ariaExpandedProp","others","useDefaultProps","cx","useClasses","rootId","useTheme","isOpen","setIsOpen","useControlled","Boolean","referenceElement","setReferenceElement","useState","popperElement","setPopperElement","popperMaxSize","setPopperMaxSize","handleDropdownHeaderRefProp","useForkRef","ref","handleDropdownHeaderRef","ariaRole","undefined","ariaExpanded","elementId","useUniqueId","bottom","extensionWidth","offsetWidth","modifiers","popperPropsModifiers","otherPopperProps","onFirstUpdate","useCallback","widthCalculator","state","styles","popper","width","rects","reference","widthCalculatorEffect","elements","style","applyMaxSizeCalculator","height","modifiersData","maxSize","maxWidth","maxHeight","maxSizeCalculator","name","options","overflow","detectOverflow","x","preventOverflow","y","popperWidth","popperHeight","basePlacement","split","widthProp","heightProp","useMemo","enabled","phase","requires","fn","effect","requiresIfExists","popperStyles","attributes","usePopper","popperPlacement","handleToggle","event","isKey","preventDefault","notControlKey","code","isOneOfKeys","ignoredCombinations","newOpen","focusHeader","focus","preventScroll","headerComponent","React","cloneElement","setId","ExpanderComponent","DropUpXS","DropDownXS","header","headerDisabled","headerReadOnly","headerOpen","headerOpenUp","includes","headerOpenDown","pointerEvents","tabIndex","_jsx","selection","HvTypography","selectionDisabled","variant","arrowContainer","iconSize","color","theme","colors","secondary_60","arrow","containerComponent","handleContainerKeyDown","shiftKey","focusList","getFirstAndLastFocus","document","activeElement","last","first","handleOutside","isButtonClick","contains","target","container","ClickAwayListener","onClickAway","onKeyDown","inputExtensionOpen","inputExtensionLeftPosition","BaseDropdownContext","Provider","value","panel","panelOpenedUp","panelOpenedDown","inputExtensionOpenShadow","inputExtensionFloatRight","inputExtensionFloatLeft","createPortal","getElementById","body","root","anchor","rootDisabled","onClick"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BaseDropdown.js","sources":["../../../../src/components/BaseDropdown/BaseDropdown.tsx"],"sourcesContent":["import React, {\n useMemo,\n useState,\n useCallback,\n KeyboardEventHandler,\n} from \"react\";\n\nimport { createPortal } from \"react-dom\";\n\nimport {\n ClickAwayListener,\n ClickAwayListenerProps,\n PopperPlacementType,\n PopperProps,\n} from \"@mui/material\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\n\nimport { usePopper } from \"react-popper\";\nimport { detectOverflow, ModifierArguments, Options } from \"@popperjs/core\";\n\nimport { HvTypography } from \"@core/components/Typography\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { useForkRef } from \"@core/hooks/useForkRef\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { isKey, isOneOfKeys } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport { getFirstAndLastFocus } from \"@core/utils/focusableElementFinder\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./BaseDropdown.styles\";\nimport BaseDropdownContext from \"./BaseDropdownContext\";\n\nexport { staticClasses as baseDropdownClasses };\n\nexport type HvBaseDropdownClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvBaseDropdownProps\n extends HvBaseProps<HTMLDivElement, \"placeholder\"> {\n /**\n * The role of the element that triggers the popup.\n *\n * Defaults to \"combobox\" if `component` and the default\n * \"textbox\" header is used, undefined otherwise.\n */\n role?: string;\n /**\n * Header placeholder.\n */\n placeholder?: string | React.ReactNode;\n /**\n * If `true` the dropdown is disabled unable to be interacted, if `false` it is enabled.\n */\n disabled?: boolean;\n /**\n * If `true` the dropdown will be in read only mode, unable to be interacted.\n */\n readOnly?: boolean;\n /**\n * Indicates that user input is required on the form element.\n */\n required?: boolean;\n /**\n * Disable the portal behavior.\n * The children stay within it's parent DOM hierarchy.\n */\n disablePortal?: boolean;\n /**\n * If `true` the dropdown width depends size of content if `false` the width depends on the header size.\n * Defaults to `false`.\n */\n variableWidth?: boolean;\n /**\n * If `true` the dropdown starts opened if `false` it starts closed.\n */\n expanded?: boolean;\n /**\n * When uncontrolled, defines the initial expanded state.\n */\n defaultExpanded?: boolean;\n /**\n * An object containing props to be wired to the popper component.\n */\n popperProps?: Partial<PopperProps>;\n /**\n * Placement of the dropdown.\n */\n placement?: \"left\" | \"right\";\n /**\n * Replacement for the header component.\n */\n component?: React.ReactNode;\n /**\n * Adornment to replace the default arrows.\n */\n adornment?: React.ReactNode;\n /**\n * When dropdown changes the expanded state.\n */\n onToggle?: (event: Event, open: boolean) => void;\n /**\n * When user click outside the open container.\n */\n onClickOutside?: (event: Event) => void;\n /**\n * Callback called when the dropdown is opened and ready,\n * commonly used to set focus to the content.\n */\n onContainerCreation?: (container: HTMLElement | null) => void;\n /**\n * Attributes applied to the dropdown header element.\n */\n dropdownHeaderProps?: React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLDivElement>,\n HTMLDivElement\n >;\n /**\n * Pass a ref to the dropdown header element.\n */\n dropdownHeaderRef?: React.Ref<any>;\n /**\n * A Jss Object used to override or extend the component styles applied.\n */\n classes?: HvBaseDropdownClasses;\n}\n\nexport const HvBaseDropdown = (props: HvBaseDropdownProps) => {\n const {\n id,\n className,\n classes: classesProp,\n children,\n role,\n placeholder,\n component,\n adornment,\n expanded,\n dropdownHeaderProps,\n defaultExpanded = false,\n disabled = false,\n readOnly = false,\n required = false,\n disablePortal = false,\n variableWidth = false,\n placement = \"right\",\n popperProps = {},\n dropdownHeaderRef: dropdownHeaderRefProp,\n onToggle,\n onClickOutside,\n onContainerCreation,\n \"aria-expanded\": ariaExpandedProp,\n ...others\n } = useDefaultProps(\"HvBaseDropdown\", props);\n const { classes, cx } = useClasses(classesProp);\n\n const { rootId } = useTheme();\n\n const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));\n\n const [referenceElement, setReferenceElement] = useState<HTMLElement | null>(\n null\n );\n const [popperElement, setPopperElement] = useState<HTMLElement | null>(null);\n const [popperMaxSize, setPopperMaxSize] = useState<{\n width?: number;\n height?: number;\n }>({});\n\n const handleDropdownHeaderRefProp = useForkRef(\n dropdownHeaderRefProp,\n dropdownHeaderProps?.ref\n );\n const handleDropdownHeaderRef = useForkRef(\n setReferenceElement,\n handleDropdownHeaderRefProp\n );\n\n const ariaRole = role || (component == null ? \"combobox\" : undefined);\n\n const ariaExpanded = ariaExpandedProp ?? (ariaRole ? !!isOpen : undefined);\n\n const elementId = useUniqueId(id, \"hvbasedropdown\");\n\n const bottom: PopperPlacementType =\n placement && `bottom-${placement === \"right\" ? \"start\" : \"end\"}`;\n\n const extensionWidth = referenceElement\n ? referenceElement?.offsetWidth\n : \"inherit\";\n\n const { modifiers: popperPropsModifiers = [], ...otherPopperProps } =\n popperProps;\n\n const onFirstUpdate = useCallback(() => {\n if (onContainerCreation) onContainerCreation(popperElement);\n }, [onContainerCreation, popperElement]);\n\n const widthCalculator = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n state.styles.popper.width = `${state.rects.reference.width}px`;\n },\n []\n );\n\n const widthCalculatorEffect = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n state.elements.popper.style.width = `${\n (state.elements.reference as any).offsetWidth\n }px`;\n },\n []\n );\n\n const applyMaxSizeCalculator = useCallback(\n ({ state }: ModifierArguments<Options>) => {\n // The `maxSize` modifier provides this data\n const { width, height } = state.modifiersData.maxSize;\n if (width !== popperMaxSize?.width || height !== popperMaxSize?.height) {\n setPopperMaxSize({ width, height });\n }\n\n state.styles.popper = {\n ...state.styles.popper,\n maxWidth: `${width}px`,\n maxHeight: `${height}px`,\n };\n },\n [popperMaxSize]\n );\n\n const maxSizeCalculator = useCallback(\n ({ state, name, options }: ModifierArguments<Options>) => {\n const overflow = detectOverflow(state, options);\n\n const x = state.modifiersData.preventOverflow?.x || 0;\n const y = state.modifiersData.preventOverflow?.y || 0;\n\n const popperWidth = state.rects.popper.width;\n const popperHeight = state.rects.popper.height;\n\n const basePlacement = state.placement.split(\"-\")[0];\n\n const widthProp = basePlacement === \"left\" ? \"left\" : \"right\";\n const heightProp = basePlacement === \"top\" ? \"top\" : \"bottom\";\n\n state.modifiersData[name] = {\n width: popperWidth - overflow[widthProp] - x,\n height: popperHeight - overflow[heightProp] - y,\n };\n },\n []\n );\n\n const modifiers: PopperProps[\"modifiers\"] = useMemo(\n () => [\n {\n name: \"variableWidth\",\n enabled: !variableWidth,\n phase: \"beforeWrite\",\n requires: [\"computeStyles\"],\n fn: widthCalculator,\n effect: widthCalculatorEffect,\n },\n {\n name: \"maxSize\",\n enabled: true,\n phase: \"main\",\n requiresIfExists: [\"offset\", \"preventOverflow\", \"flip\"],\n fn: maxSizeCalculator,\n },\n {\n name: \"applyMaxSize\",\n enabled: true,\n phase: \"beforeWrite\",\n requires: [\"maxSize\"],\n fn: applyMaxSizeCalculator,\n },\n ...popperPropsModifiers,\n ],\n [\n maxSizeCalculator,\n applyMaxSizeCalculator,\n popperPropsModifiers,\n variableWidth,\n widthCalculator,\n widthCalculatorEffect,\n ]\n );\n\n const { styles: popperStyles, attributes } = usePopper(\n referenceElement,\n popperElement,\n {\n placement: bottom,\n modifiers,\n onFirstUpdate,\n ...otherPopperProps,\n }\n );\n\n const popperPlacement =\n attributes.popper?.[\"data-popper-placement\"] ?? \"bottom\";\n\n const handleToggle = useCallback(\n (event) => {\n if (event && !isKey(event, \"Tab\")) {\n event.preventDefault();\n }\n\n const notControlKey =\n !!event?.code &&\n !isOneOfKeys(event, [\"Tab\", \"Enter\", \"Esc\", \"ArrowDown\", \"Space\"]);\n\n const ignoredCombinations =\n (isKey(event, \"Esc\") && !isOpen) ||\n (isKey(event, \"ArrowDown\") && isOpen) ||\n (isKey(event, \"Tab\") && !isOpen);\n\n if (disabled || notControlKey || ignoredCombinations) return;\n\n const newOpen = !isOpen;\n\n /* If about to close focus on the header component. */\n const focusHeader = () => {\n if (!newOpen) {\n // Focus-ring won't be visible even if using the keyboard:\n // https://github.com/WICG/focus-visible/issues/88\n referenceElement?.focus({ preventScroll: true });\n }\n\n return newOpen;\n };\n setIsOpen(focusHeader());\n\n onToggle?.(event, newOpen);\n },\n [isOpen, disabled, setIsOpen, onToggle, referenceElement]\n );\n\n const headerComponent = (() => {\n if (component) {\n return React.cloneElement(component as React.ReactElement, {\n ref: handleDropdownHeaderRef,\n \"aria-controls\": isOpen\n ? setId(elementId, \"children-container\")\n : undefined,\n });\n }\n\n const ExpanderComponent = isOpen ? DropUpXS : DropDownXS;\n\n return (\n <div\n id={setId(id, \"header\")}\n className={cx(classes.header, {\n [classes.headerDisabled]: disabled,\n [classes.headerReadOnly]: readOnly,\n [classes.headerOpen]: isOpen,\n [classes.headerOpenUp]: isOpen && popperPlacement.includes(\"top\"),\n [classes.headerOpenDown]:\n isOpen && popperPlacement.includes(\"bottom\"),\n })}\n role={ariaRole === \"combobox\" ? \"textbox\" : undefined}\n style={disabled || readOnly ? { pointerEvents: \"none\" } : undefined}\n aria-controls={\n isOpen ? setId(elementId, \"children-container\") : undefined\n }\n aria-label={others[\"aria-label\"] ?? undefined}\n aria-labelledby={others[\"aria-labelledby\"] ?? undefined}\n aria-required={required ?? undefined}\n aria-readonly={readOnly ?? undefined}\n // Removes the element from the navigation sequence for keyboard focus if disabled\n tabIndex={disabled ? -1 : 0}\n ref={handleDropdownHeaderRef}\n {...dropdownHeaderProps}\n >\n <div className={classes.selection}>\n {placeholder && typeof placeholder === \"string\" ? (\n <HvTypography\n className={cx(classes.placeholder, {\n [classes.selectionDisabled]: disabled,\n })}\n variant=\"body\"\n >\n {placeholder}\n </HvTypography>\n ) : (\n placeholder\n )}\n </div>\n <div className={classes.arrowContainer}>\n {adornment || (\n <ExpanderComponent\n iconSize=\"XS\"\n color={disabled ? theme.colors.secondary_60 : undefined}\n className={classes.arrow}\n />\n )}\n </div>\n </div>\n );\n })();\n\n const containerComponent = (() => {\n /**\n * Handle keyboard inside children container.\n */\n const handleContainerKeyDown: KeyboardEventHandler = (event) => {\n if (isKey(event, \"Esc\")) {\n handleToggle(event);\n }\n if (isKey(event, \"Tab\") && !event.shiftKey) {\n const focusList = getFirstAndLastFocus(popperElement);\n if (document.activeElement === focusList?.last) {\n event.preventDefault();\n focusList?.first?.focus();\n }\n }\n };\n\n const handleOutside: ClickAwayListenerProps[\"onClickAway\"] = (event) => {\n const isButtonClick = referenceElement?.contains(event.target as any);\n if (!isButtonClick) {\n onClickOutside?.(event);\n setIsOpen(false);\n onToggle?.(event, false);\n }\n };\n\n const container = (\n <div\n role=\"tooltip\"\n ref={setPopperElement}\n className={classes.container}\n style={popperStyles.popper}\n {...attributes.popper}\n >\n <ClickAwayListener onClickAway={handleOutside}>\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n <div onKeyDown={handleContainerKeyDown}>\n {popperPlacement.includes(\"bottom\") && (\n <div\n style={{ width: extensionWidth }}\n className={cx(classes.inputExtensionOpen, {\n [classes.inputExtensionLeftPosition]:\n popperPlacement.includes(\"end\"),\n })}\n />\n )}\n <BaseDropdownContext.Provider value={popperMaxSize}>\n <div\n id={setId(elementId, \"children-container\")}\n className={cx(classes.panel, {\n [classes.panelOpenedUp]: popperPlacement.includes(\"top\"),\n [classes.panelOpenedDown]: popperPlacement.includes(\"bottom\"),\n })}\n >\n {children}\n </div>\n </BaseDropdownContext.Provider>\n {popperPlacement.includes(\"top\") && (\n <div\n style={{ width: extensionWidth }}\n className={cx(\n classes.inputExtensionOpen,\n classes.inputExtensionOpenShadow,\n {\n [classes.inputExtensionFloatRight]:\n popperPlacement.includes(\"end\"),\n [classes.inputExtensionFloatLeft]:\n popperPlacement.includes(\"start\"),\n }\n )}\n />\n )}\n </div>\n </ClickAwayListener>\n </div>\n );\n\n if (disablePortal) return container;\n\n return createPortal(\n container,\n document.getElementById(rootId || \"\") || document.body\n );\n })();\n\n return (\n <div className={classes.root}>\n <div\n id={id}\n role={ariaRole}\n aria-expanded={ariaExpanded}\n aria-owns={isOpen ? setId(elementId, \"children-container\") : undefined}\n aria-required={required ?? undefined}\n aria-readonly={readOnly ?? undefined}\n className={cx(\n classes.anchor,\n { [classes.rootDisabled]: disabled },\n className\n )}\n {...(!readOnly && {\n onKeyDown: handleToggle,\n onClick: handleToggle,\n })}\n // Removes the element from the navigation sequence for keyboard focus\n tabIndex={-1}\n {...others}\n >\n {headerComponent}\n </div>\n {isOpen && containerComponent}\n </div>\n );\n};\n"],"names":["HvBaseDropdown","props","id","className","classes","classesProp","children","role","placeholder","component","adornment","expanded","dropdownHeaderProps","defaultExpanded","disabled","readOnly","required","disablePortal","variableWidth","placement","popperProps","dropdownHeaderRef","dropdownHeaderRefProp","onToggle","onClickOutside","onContainerCreation","ariaExpandedProp","others","useDefaultProps","cx","useClasses","rootId","useTheme","isOpen","setIsOpen","useControlled","Boolean","referenceElement","setReferenceElement","useState","popperElement","setPopperElement","popperMaxSize","setPopperMaxSize","handleDropdownHeaderRefProp","useForkRef","ref","handleDropdownHeaderRef","ariaRole","undefined","ariaExpanded","elementId","useUniqueId","bottom","extensionWidth","offsetWidth","modifiers","popperPropsModifiers","otherPopperProps","onFirstUpdate","useCallback","widthCalculator","state","styles","popper","width","rects","reference","widthCalculatorEffect","elements","style","applyMaxSizeCalculator","height","modifiersData","maxSize","maxWidth","maxHeight","maxSizeCalculator","name","options","overflow","detectOverflow","x","preventOverflow","y","popperWidth","popperHeight","basePlacement","split","widthProp","heightProp","useMemo","enabled","phase","requires","fn","effect","requiresIfExists","popperStyles","attributes","usePopper","popperPlacement","handleToggle","event","isKey","preventDefault","notControlKey","code","isOneOfKeys","ignoredCombinations","newOpen","focusHeader","focus","preventScroll","headerComponent","React","cloneElement","setId","ExpanderComponent","DropUpXS","DropDownXS","header","headerDisabled","headerReadOnly","headerOpen","headerOpenUp","includes","headerOpenDown","pointerEvents","tabIndex","_jsx","selection","HvTypography","selectionDisabled","variant","arrowContainer","iconSize","color","theme","colors","secondary_60","arrow","containerComponent","handleContainerKeyDown","shiftKey","focusList","getFirstAndLastFocus","document","activeElement","last","first","handleOutside","isButtonClick","contains","target","container","ClickAwayListener","onClickAway","onKeyDown","inputExtensionOpen","inputExtensionLeftPosition","BaseDropdownContext","Provider","value","panel","panelOpenedUp","panelOpenedDown","inputExtensionOpenShadow","inputExtensionFloatRight","inputExtensionFloatLeft","createPortal","getElementById","body","root","anchor","rootDisabled","onClick"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dropdown.js","sources":["../../../../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { PopperProps } from \"@mui/material\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { setId } from \"@core/utils/setId\";\nimport { useLabels, useUniqueId, useControlled } from \"@core/hooks\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport {\n HvBaseDropdown,\n HvBaseDropdownProps,\n} from \"@core/components/BaseDropdown\";\nimport { HvListValue } from \"@core/components/List\";\nimport {\n isInvalid,\n HvInfoMessage,\n HvWarningText,\n HvFormElement,\n HvLabel,\n} from \"@core/components/Forms\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvTypography } from \"@core/components/Typography\";\n\nimport { getSelected, getSelectionLabel } from \"./utils\";\nimport { HvDropdownList, HvDropdownListProps } from \"./List\";\nimport { staticClasses, useClasses } from \"./Dropdown.styles\";\nimport { HvDropdownLabelsProps, HvDropdownStatus } from \"./types\";\n\nexport { staticClasses as dropdownClasses };\n\nexport type HvDropdownClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDropdownProps\n extends HvBaseProps<HTMLDivElement, \"onChange\"> {\n /**\n * Class names to be applied.\n */\n className?: string;\n /**\n * A Jss Object used to override or extend the component styles applied.\n */\n classes?: HvDropdownClasses;\n /**\n * Id to be applied to the form element root node.\n */\n id?: string;\n /**\n * The form element name.\n */\n name?: string;\n /**\n * The label of the form element.\n *\n * The form element must be labeled for accessibility reasons.\n * If not provided, an aria-label or aria-labelledby must be provided instead.\n */\n label?: any;\n /**\n * @ignore\n */\n \"aria-label\"?: string;\n /**\n * @ignore\n */\n \"aria-labelledby\"?: string;\n /**\n * Provide additional descriptive text for the form element.\n */\n description?: any;\n /**\n * @ignore\n */\n \"aria-describedby\"?: string;\n /**\n * The placeholder value when nothing is selected.\n */\n placeholder?: string;\n\n /**\n * Indicates that the form element is disabled.\n */\n disabled?: boolean;\n /**\n * Indicates that the form element is in read only mode.\n */\n readOnly?: boolean;\n /**\n * Indicates that user input is required on the form element.\n */\n required?: boolean;\n /**\n * The status of the form element.\n *\n * Valid is correct, invalid is incorrect and standBy means no validations have run.\n *\n * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n * or \"invalid\" after any change to the state.\n */\n status?: HvDropdownStatus;\n /**\n * The error message to show when the validation status is \"invalid\".\n *\n * Defaults to \"Required\" when the status is uncontrolled and no `aria-errormessage` is provided.\n */\n statusMessage?: any;\n /**\n * Identifies the element that provides an error message for the dropdown.\n *\n * Will only be used when the validation status is invalid.\n */\n \"aria-errormessage\"?: string;\n\n /**\n * The callback fired when the value changes.\n */\n onChange?: (selected: HvListValue | HvListValue[] | undefined) => void;\n\n /**\n * The list to be rendered by the dropdown.\n */\n values?: HvListValue[];\n /**\n * If `true` the dropdown is multiSelect, if `false` the dropdown is single select.\n */\n multiSelect?: boolean;\n /**\n * If `true` the dropdown is rendered with a search bar, if `false` there won't be a search bar.\n */\n showSearch?: boolean;\n /**\n * If `true` the dropdown starts opened if `false` it starts closed.\n */\n expanded?: boolean;\n /**\n * When uncontrolled, defines the initial expanded state.\n */\n defaultExpanded?: boolean;\n /**\n * If 'true' the dropdown will notify on the first render.\n */\n notifyChangesOnFirstRender?: boolean;\n /**\n * An object containing all the labels for the dropdown.\n */\n labels?: HvDropdownLabelsProps;\n /**\n * If `true` the dropdown will show tooltips when user mouseenter text in list\n */\n hasTooltips?: boolean;\n /**\n * Disable the portal behavior.\n * The children stay within it's parent DOM hierarchy.\n */\n disablePortal?: boolean;\n /**\n * If `true` the dropdown width depends size of content if `false` the width depends on the header size.\n * Defaults to `false`.\n */\n variableWidth?: boolean;\n /**\n * If `true`, selection can be toggled when single selection.\n */\n singleSelectionToggle?: boolean;\n /**\n * Placement of the dropdown.\n */\n placement?: \"left\" | \"right\";\n /**\n * An object containing props to be wired to the popper component.\n */\n popperProps?: Partial<PopperProps>;\n\n /**\n * Callback called when the user cancels the changes.\n *\n * Called when the cancel button is used and when the user clicks outside the open container.\n *\n * @param {object} event The event source of the callback.\n */\n onCancel?: (event: Event) => void;\n /**\n * Callback called when dropdown changes the expanded state.\n *\n * @param {object} event The event source of the callback.\n * @param {boolean} open If the dropdown new state is open (`true`) or closed (`false`).\n */\n onToggle?: (event: Event, open: boolean) => void;\n /**\n * Callback called when the user clicks outside the open container.\n *\n * @param {object} event The event source of the callback.\n */\n onClickOutside?: (event: Event) => void;\n /**\n * @ignore\n */\n onFocus?: React.FocusEventHandler<any>;\n /**\n * @ignore\n */\n onBlur?: React.FocusEventHandler<any>;\n /**\n * Experimental. Height of the dropdown, in case you want to control it from a prop. Styles can also be used through dropdownListContainer class. Required in case virtualized is used\n */\n height?: number;\n /**\n * Experimental. Height of the dropdown, in case you want to control it from a prop. Styles can also be used through dropdownListContainer class. Required in case virtualized is used\n */\n maxHeight?: number;\n /**\n * Experimental. Uses dropdown in a virtualized form, where not all options are rendered initially. Good for use cases with a lot of options.\n */\n virtualized?: boolean;\n /**\n * Extra props passed to the dropdown.\n */\n baseDropdownProps?: HvBaseDropdownProps;\n /**\n * Extra props passed to the list.\n */\n listProps?: HvDropdownListProps;\n}\n\nconst DEFAULT_LABELS: HvDropdownLabelsProps = {\n select: undefined,\n selectAll: \"All\",\n cancelLabel: \"Cancel\",\n applyLabel: \"Apply\",\n searchPlaceholder: \"Search\",\n multiSelectionConjunction: \"/\",\n};\n\n/**\n * A dropdown list is a graphical control element, similar to a list box, that allows the user to choose one value from a list.\n */\nexport const HvDropdown = (props: HvDropdownProps) => {\n const {\n classes: classesProp,\n className,\n\n id,\n name,\n\n required = false,\n disabled = false,\n readOnly = false,\n\n label,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n\n placeholder = \"Select...\",\n\n onChange,\n\n status,\n statusMessage,\n \"aria-errormessage\": ariaErrorMessage,\n\n onCancel,\n onToggle,\n onClickOutside,\n\n onFocus,\n onBlur,\n\n values,\n multiSelect = false,\n showSearch = false,\n expanded,\n defaultExpanded = false,\n notifyChangesOnFirstRender = false,\n labels: labelsProp,\n hasTooltips = false,\n disablePortal = false,\n singleSelectionToggle = true,\n placement,\n variableWidth = false,\n popperProps = {},\n height,\n maxHeight,\n virtualized = false,\n baseDropdownProps = {},\n listProps = {},\n ...others\n } = useDefaultProps(\"HvDropdown\", props);\n\n const { classes, cx, css } = useClasses(classesProp);\n\n const labels = useLabels(DEFAULT_LABELS, labelsProp);\n\n const elementId = useUniqueId(id, \"hvdropdown\");\n\n const [validationState, setValidationState] = useControlled(\n status,\n \"standBy\"\n );\n\n const [validationMessage] = useControlled(statusMessage, \"Required\");\n\n const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));\n const [selectionLabel, setSelectionLabel] = useState(\n getSelectionLabel(labels, placeholder, multiSelect, values)\n );\n const [internalValues, setInternalValues] = useState(values);\n\n useEffect(() => {\n setInternalValues(values);\n }, [values]);\n\n useEffect(() => {\n setSelectionLabel(\n getSelectionLabel(labels, placeholder, multiSelect, values)\n );\n }, [labels, multiSelect, placeholder, values]);\n\n if (virtualized && !height && process.env.NODE_ENV !== \"production\") {\n // eslint-disable-next-line no-console\n console.error(\n \"Dropdown/List in virtualized mode requires a height. Please define it.\"\n );\n }\n\n const dropdownHeaderRef = useRef<HTMLDivElement>();\n\n const handleToggle: HvBaseDropdownProps[\"onToggle\"] = (event, open) => {\n onToggle?.(event, open);\n\n setIsOpen(open);\n\n if (!open) {\n // also run built-in validation when closing without changes\n // as the user \"touched\" the input\n setValidationState(() => {\n // this will only run if status is uncontrolled\n if (required) {\n const hasSelection = getSelected(internalValues).length > 0;\n\n if (!hasSelection) {\n return \"invalid\";\n }\n }\n\n return \"valid\";\n });\n }\n };\n\n /** Applies the selected values to the state */\n const handleSelection: HvDropdownListProps[\"onChange\"] = (\n listValues,\n commitChanges,\n toggle,\n notifyChanges = true\n ) => {\n const selected = getSelected(listValues);\n\n if (commitChanges) {\n setInternalValues(listValues);\n setSelectionLabel(\n getSelectionLabel(labels, placeholder, multiSelect, listValues)\n );\n\n setValidationState(() => {\n // this will only run if status is uncontrolled\n if (required && selected.length === 0) {\n return \"invalid\";\n }\n\n return \"valid\";\n });\n }\n if (notifyChanges) onChange?.(multiSelect ? selected : selected[0]);\n if (toggle) {\n handleToggle(undefined as any, false);\n\n // focus-ring won't be visible even if using the keyboard:\n // https://github.com/WICG/focus-visible/issues/88\n dropdownHeaderRef.current?.focus({ preventScroll: true });\n }\n };\n\n /**\n * Handles the `Cancel` action. Both single and ranged modes are handled here.\n */\n const handleCancel: HvDropdownListProps[\"onCancel\"] = (evt) => {\n onCancel?.(evt as any);\n\n handleToggle(evt as any, false);\n\n // focus-ring won't be visible even if using the keyboard:\n // https://github.com/WICG/focus-visible/issues/88\n dropdownHeaderRef.current?.focus({ preventScroll: true });\n };\n\n const handleClickOutside: HvBaseDropdownProps[\"onClickOutside\"] = (evt) => {\n onClickOutside?.(evt);\n onCancel?.(evt);\n };\n\n const setFocusToContent: HvBaseDropdownProps[\"onContainerCreation\"] = (\n containerRef\n ) => {\n const inputs = containerRef?.getElementsByTagName(\"input\");\n if (inputs && inputs.length > 0) {\n inputs[0].focus();\n return;\n }\n const listItems =\n containerRef != null ? [...containerRef.getElementsByTagName(\"li\")] : [];\n listItems.every((listItem) => {\n if (listItem.tabIndex >= 0) {\n listItem.focus();\n return false;\n }\n return true;\n });\n };\n\n const buildHeaderLabel = () => {\n const hasSelection = getSelected(internalValues).length > 0;\n return labels?.select || !multiSelect ? (\n <HvTypography\n component=\"div\"\n variant=\"body\"\n className={cx(\n classes.placeholder,\n {\n [classes.selectionDisabled]: disabled,\n },\n !(isOpen || hasSelection) &&\n css({ color: theme.dropdown.placeholderColor })\n )}\n >\n {selectionLabel.selected}\n </HvTypography>\n ) : (\n <HvTypography\n component=\"div\"\n className={cx(classes.placeholder, {\n [classes.selectionDisabled]: disabled,\n })}\n variant=\"body\"\n >\n <b>{selectionLabel.selected}</b>\n {` ${labels?.multiSelectionConjunction} ${selectionLabel.total}`}\n </HvTypography>\n );\n };\n\n const hasLabel = label != null;\n const hasDescription = description != null;\n\n // the error message area will only be created if:\n // - an external element that provides an error message isn't identified via aria-errormessage AND\n // - both status and statusMessage properties are being controlled OR\n // - status is uncontrolled and required is true\n const canShowError =\n ariaErrorMessage == null &&\n ((status !== undefined && statusMessage !== undefined) ||\n (status === undefined && required));\n\n const isStateInvalid = isInvalid(validationState);\n\n let errorMessageId;\n if (isStateInvalid) {\n errorMessageId = canShowError\n ? setId(elementId, \"error\")\n : ariaErrorMessage;\n }\n\n return (\n <HvFormElement\n id={id}\n name={name}\n status={validationState}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n className={cx(\n classes.root,\n disabled && css({ color: theme.dropdown.disabledColor }),\n className\n )}\n {...others}\n >\n {(hasLabel || hasDescription) && (\n <div className={classes.labelContainer}>\n {hasLabel && (\n <HvLabel\n id={setId(elementId, \"label\")}\n label={label}\n className={classes.label}\n />\n )}\n\n {hasDescription && (\n <HvInfoMessage\n id={setId(elementId, \"description\")}\n className={classes.description}\n >\n {description}\n </HvInfoMessage>\n )}\n </div>\n )}\n <HvBaseDropdown\n id={setId(id, \"dropdown\")}\n classes={{\n root: cx(\n classes.dropdown,\n readOnly &&\n css({\n [`& .${staticClasses.dropdownHeader}`]: {\n border: theme.dropdown.readOnlyBorder,\n backgroundColor: theme.dropdown.readOnlyBackgroundColor,\n },\n })\n ),\n arrow: classes.arrow,\n header: cx(classes.dropdownHeader, {\n [classes.dropdownHeaderInvalid]: isStateInvalid,\n }),\n headerOpen: classes.dropdownHeaderOpen,\n }}\n expanded={isOpen}\n disabled={disabled}\n readOnly={readOnly}\n disablePortal={disablePortal}\n placement={placement}\n popperProps={popperProps}\n placeholder={buildHeaderLabel()}\n onToggle={handleToggle}\n onClickOutside={handleClickOutside}\n onContainerCreation={setFocusToContent}\n role=\"combobox\"\n variableWidth={variableWidth}\n aria-label={ariaLabel}\n aria-labelledby={\n [label && setId(elementId, \"label\"), ariaLabelledBy]\n .join(\" \")\n .trim() || undefined\n }\n aria-invalid={isStateInvalid ? true : undefined}\n aria-errormessage={errorMessageId}\n aria-describedby={\n [description && setId(elementId, \"description\"), ariaDescribedBy]\n .join(\" \")\n .trim() || undefined\n }\n onFocus={onFocus}\n onBlur={onBlur}\n dropdownHeaderRef={dropdownHeaderRef}\n {...baseDropdownProps}\n >\n <HvDropdownList\n id={setId(elementId, \"values\")}\n classes={{\n rootList: classes.rootList,\n dropdownListContainer: classes.dropdownListContainer,\n }}\n values={internalValues}\n multiSelect={multiSelect}\n showSearch={showSearch}\n onChange={handleSelection}\n onCancel={handleCancel}\n labels={labels}\n notifyChangesOnFirstRender={notifyChangesOnFirstRender}\n hasTooltips={hasTooltips}\n singleSelectionToggle={singleSelectionToggle}\n aria-labelledby={hasLabel ? setId(elementId, \"label\") : undefined}\n height={height}\n maxHeight={maxHeight}\n virtualized={virtualized}\n {...listProps}\n />\n </HvBaseDropdown>\n {canShowError && (\n <HvWarningText\n id={setId(elementId, \"error\")}\n disableBorder\n className={classes.error}\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n};\n"],"names":["DEFAULT_LABELS","select","undefined","selectAll","cancelLabel","applyLabel","searchPlaceholder","multiSelectionConjunction","HvDropdown","props","classes","classesProp","className","id","name","required","disabled","readOnly","label","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","placeholder","onChange","status","statusMessage","ariaErrorMessage","onCancel","onToggle","onClickOutside","onFocus","onBlur","values","multiSelect","showSearch","expanded","defaultExpanded","notifyChangesOnFirstRender","labels","labelsProp","hasTooltips","disablePortal","singleSelectionToggle","placement","variableWidth","popperProps","height","maxHeight","virtualized","baseDropdownProps","listProps","others","useDefaultProps","cx","css","useClasses","useLabels","elementId","useUniqueId","validationState","setValidationState","useControlled","validationMessage","isOpen","setIsOpen","Boolean","selectionLabel","setSelectionLabel","useState","getSelectionLabel","internalValues","setInternalValues","useEffect","process","env","NODE_ENV","console","error","dropdownHeaderRef","useRef","handleToggle","event","open","hasSelection","getSelected","length","handleSelection","listValues","commitChanges","toggle","notifyChanges","selected","current","focus","preventScroll","handleCancel","evt","handleClickOutside","setFocusToContent","containerRef","inputs","getElementsByTagName","listItems","every","listItem","tabIndex","buildHeaderLabel","HvTypography","component","variant","selectionDisabled","color","theme","dropdown","placeholderColor","children","_jsxs","_jsx","total","hasLabel","hasDescription","canShowError","isStateInvalid","isInvalid","errorMessageId","setId","HvFormElement","root","disabledColor","labelContainer","HvLabel","HvInfoMessage","HvBaseDropdown","staticClasses","dropdownHeader","border","readOnlyBorder","backgroundColor","readOnlyBackgroundColor","arrow","header","dropdownHeaderInvalid","headerOpen","dropdownHeaderOpen","onContainerCreation","role","join","trim","HvDropdownList","rootList","dropdownListContainer","HvWarningText","disableBorder"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Dropdown.js","sources":["../../../../src/components/Dropdown/Dropdown.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { PopperProps } from \"@mui/material\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { setId } from \"@core/utils/setId\";\nimport { useLabels, useUniqueId, useControlled } from \"@core/hooks\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport {\n HvBaseDropdown,\n HvBaseDropdownProps,\n} from \"@core/components/BaseDropdown\";\nimport { HvListValue } from \"@core/components/List\";\nimport {\n isInvalid,\n HvInfoMessage,\n HvWarningText,\n HvFormElement,\n HvLabel,\n} from \"@core/components/Forms\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvTypography } from \"@core/components/Typography\";\n\nimport { getSelected, getSelectionLabel } from \"./utils\";\nimport { HvDropdownList, HvDropdownListProps } from \"./List\";\nimport { staticClasses, useClasses } from \"./Dropdown.styles\";\nimport { HvDropdownLabelsProps, HvDropdownStatus } from \"./types\";\n\nexport { staticClasses as dropdownClasses };\n\nexport type HvDropdownClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDropdownProps\n extends HvBaseProps<HTMLDivElement, \"onChange\"> {\n /**\n * Class names to be applied.\n */\n className?: string;\n /**\n * A Jss Object used to override or extend the component styles applied.\n */\n classes?: HvDropdownClasses;\n /**\n * Id to be applied to the form element root node.\n */\n id?: string;\n /**\n * The form element name.\n */\n name?: string;\n /**\n * The label of the form element.\n *\n * The form element must be labeled for accessibility reasons.\n * If not provided, an aria-label or aria-labelledby must be provided instead.\n */\n label?: any;\n /**\n * @ignore\n */\n \"aria-label\"?: string;\n /**\n * @ignore\n */\n \"aria-labelledby\"?: string;\n /**\n * Provide additional descriptive text for the form element.\n */\n description?: any;\n /**\n * @ignore\n */\n \"aria-describedby\"?: string;\n /**\n * The placeholder value when nothing is selected.\n */\n placeholder?: string;\n\n /**\n * Indicates that the form element is disabled.\n */\n disabled?: boolean;\n /**\n * Indicates that the form element is in read only mode.\n */\n readOnly?: boolean;\n /**\n * Indicates that user input is required on the form element.\n */\n required?: boolean;\n /**\n * The status of the form element.\n *\n * Valid is correct, invalid is incorrect and standBy means no validations have run.\n *\n * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n * or \"invalid\" after any change to the state.\n */\n status?: HvDropdownStatus;\n /**\n * The error message to show when the validation status is \"invalid\".\n *\n * Defaults to \"Required\" when the status is uncontrolled and no `aria-errormessage` is provided.\n */\n statusMessage?: any;\n /**\n * Identifies the element that provides an error message for the dropdown.\n *\n * Will only be used when the validation status is invalid.\n */\n \"aria-errormessage\"?: string;\n\n /**\n * The callback fired when the value changes.\n */\n onChange?: (selected: HvListValue | HvListValue[] | undefined) => void;\n\n /**\n * The list to be rendered by the dropdown.\n */\n values?: HvListValue[];\n /**\n * If `true` the dropdown is multiSelect, if `false` the dropdown is single select.\n */\n multiSelect?: boolean;\n /**\n * If `true` the dropdown is rendered with a search bar, if `false` there won't be a search bar.\n */\n showSearch?: boolean;\n /**\n * If `true` the dropdown starts opened if `false` it starts closed.\n */\n expanded?: boolean;\n /**\n * When uncontrolled, defines the initial expanded state.\n */\n defaultExpanded?: boolean;\n /**\n * If 'true' the dropdown will notify on the first render.\n */\n notifyChangesOnFirstRender?: boolean;\n /**\n * An object containing all the labels for the dropdown.\n */\n labels?: HvDropdownLabelsProps;\n /**\n * If `true` the dropdown will show tooltips when user mouseenter text in list\n */\n hasTooltips?: boolean;\n /**\n * Disable the portal behavior.\n * The children stay within it's parent DOM hierarchy.\n */\n disablePortal?: boolean;\n /**\n * If `true` the dropdown width depends size of content if `false` the width depends on the header size.\n * Defaults to `false`.\n */\n variableWidth?: boolean;\n /**\n * If `true`, selection can be toggled when single selection.\n */\n singleSelectionToggle?: boolean;\n /**\n * Placement of the dropdown.\n */\n placement?: \"left\" | \"right\";\n /**\n * An object containing props to be wired to the popper component.\n */\n popperProps?: Partial<PopperProps>;\n\n /**\n * Callback called when the user cancels the changes.\n *\n * Called when the cancel button is used and when the user clicks outside the open container.\n *\n * @param {object} event The event source of the callback.\n */\n onCancel?: (event: Event) => void;\n /**\n * Callback called when dropdown changes the expanded state.\n *\n * @param {object} event The event source of the callback.\n * @param {boolean} open If the dropdown new state is open (`true`) or closed (`false`).\n */\n onToggle?: (event: Event, open: boolean) => void;\n /**\n * Callback called when the user clicks outside the open container.\n *\n * @param {object} event The event source of the callback.\n */\n onClickOutside?: (event: Event) => void;\n /**\n * @ignore\n */\n onFocus?: React.FocusEventHandler<any>;\n /**\n * @ignore\n */\n onBlur?: React.FocusEventHandler<any>;\n /**\n * Experimental. Height of the dropdown, in case you want to control it from a prop. Styles can also be used through dropdownListContainer class. Required in case virtualized is used\n */\n height?: number;\n /**\n * Experimental. Height of the dropdown, in case you want to control it from a prop. Styles can also be used through dropdownListContainer class. Required in case virtualized is used\n */\n maxHeight?: number;\n /**\n * Experimental. Uses dropdown in a virtualized form, where not all options are rendered initially. Good for use cases with a lot of options.\n */\n virtualized?: boolean;\n /**\n * Extra props passed to the dropdown.\n */\n baseDropdownProps?: HvBaseDropdownProps;\n /**\n * Extra props passed to the list.\n */\n listProps?: HvDropdownListProps;\n}\n\nconst DEFAULT_LABELS: HvDropdownLabelsProps = {\n select: undefined,\n selectAll: \"All\",\n cancelLabel: \"Cancel\",\n applyLabel: \"Apply\",\n searchPlaceholder: \"Search\",\n multiSelectionConjunction: \"/\",\n};\n\n/**\n * A dropdown list is a graphical control element, similar to a list box, that allows the user to choose one value from a list.\n */\nexport const HvDropdown = (props: HvDropdownProps) => {\n const {\n classes: classesProp,\n className,\n\n id,\n name,\n\n required = false,\n disabled = false,\n readOnly = false,\n\n label,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n\n placeholder = \"Select...\",\n\n onChange,\n\n status,\n statusMessage,\n \"aria-errormessage\": ariaErrorMessage,\n\n onCancel,\n onToggle,\n onClickOutside,\n\n onFocus,\n onBlur,\n\n values,\n multiSelect = false,\n showSearch = false,\n expanded,\n defaultExpanded = false,\n notifyChangesOnFirstRender = false,\n labels: labelsProp,\n hasTooltips = false,\n disablePortal = false,\n singleSelectionToggle = true,\n placement,\n variableWidth = false,\n popperProps = {},\n height,\n maxHeight,\n virtualized = false,\n baseDropdownProps = {},\n listProps = {},\n ...others\n } = useDefaultProps(\"HvDropdown\", props);\n\n const { classes, cx, css } = useClasses(classesProp);\n\n const labels = useLabels(DEFAULT_LABELS, labelsProp);\n\n const elementId = useUniqueId(id, \"hvdropdown\");\n\n const [validationState, setValidationState] = useControlled(\n status,\n \"standBy\"\n );\n\n const [validationMessage] = useControlled(statusMessage, \"Required\");\n\n const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));\n const [selectionLabel, setSelectionLabel] = useState(\n getSelectionLabel(labels, placeholder, multiSelect, values)\n );\n const [internalValues, setInternalValues] = useState(values);\n\n useEffect(() => {\n setInternalValues(values);\n }, [values]);\n\n useEffect(() => {\n setSelectionLabel(\n getSelectionLabel(labels, placeholder, multiSelect, values)\n );\n }, [labels, multiSelect, placeholder, values]);\n\n if (virtualized && !height && process.env.NODE_ENV !== \"production\") {\n // eslint-disable-next-line no-console\n console.error(\n \"Dropdown/List in virtualized mode requires a height. Please define it.\"\n );\n }\n\n const dropdownHeaderRef = useRef<HTMLDivElement>();\n\n const handleToggle: HvBaseDropdownProps[\"onToggle\"] = (event, open) => {\n onToggle?.(event, open);\n\n setIsOpen(open);\n\n if (!open) {\n // also run built-in validation when closing without changes\n // as the user \"touched\" the input\n setValidationState(() => {\n // this will only run if status is uncontrolled\n if (required) {\n const hasSelection = getSelected(internalValues).length > 0;\n\n if (!hasSelection) {\n return \"invalid\";\n }\n }\n\n return \"valid\";\n });\n }\n };\n\n /** Applies the selected values to the state */\n const handleSelection: HvDropdownListProps[\"onChange\"] = (\n listValues,\n commitChanges,\n toggle,\n notifyChanges = true\n ) => {\n const selected = getSelected(listValues);\n\n if (commitChanges) {\n setInternalValues(listValues);\n setSelectionLabel(\n getSelectionLabel(labels, placeholder, multiSelect, listValues)\n );\n\n setValidationState(() => {\n // this will only run if status is uncontrolled\n if (required && selected.length === 0) {\n return \"invalid\";\n }\n\n return \"valid\";\n });\n }\n if (notifyChanges) onChange?.(multiSelect ? selected : selected[0]);\n if (toggle) {\n handleToggle(undefined as any, false);\n\n // focus-ring won't be visible even if using the keyboard:\n // https://github.com/WICG/focus-visible/issues/88\n dropdownHeaderRef.current?.focus({ preventScroll: true });\n }\n };\n\n /**\n * Handles the `Cancel` action. Both single and ranged modes are handled here.\n */\n const handleCancel: HvDropdownListProps[\"onCancel\"] = (evt) => {\n onCancel?.(evt as any);\n\n handleToggle(evt as any, false);\n\n // focus-ring won't be visible even if using the keyboard:\n // https://github.com/WICG/focus-visible/issues/88\n dropdownHeaderRef.current?.focus({ preventScroll: true });\n };\n\n const handleClickOutside: HvBaseDropdownProps[\"onClickOutside\"] = (evt) => {\n onClickOutside?.(evt);\n onCancel?.(evt);\n };\n\n const setFocusToContent: HvBaseDropdownProps[\"onContainerCreation\"] = (\n containerRef\n ) => {\n const inputs = containerRef?.getElementsByTagName(\"input\");\n if (inputs && inputs.length > 0) {\n inputs[0].focus();\n return;\n }\n const listItems =\n containerRef != null ? [...containerRef.getElementsByTagName(\"li\")] : [];\n listItems.every((listItem) => {\n if (listItem.tabIndex >= 0) {\n listItem.focus();\n return false;\n }\n return true;\n });\n };\n\n const buildHeaderLabel = () => {\n const hasSelection = getSelected(internalValues).length > 0;\n return labels?.select || !multiSelect ? (\n <HvTypography\n component=\"div\"\n variant=\"body\"\n className={cx(\n classes.placeholder,\n {\n [classes.selectionDisabled]: disabled,\n },\n !(isOpen || hasSelection) &&\n css({ color: theme.dropdown.placeholderColor })\n )}\n >\n {selectionLabel.selected}\n </HvTypography>\n ) : (\n <HvTypography\n component=\"div\"\n className={cx(classes.placeholder, {\n [classes.selectionDisabled]: disabled,\n })}\n variant=\"body\"\n >\n <b>{selectionLabel.selected}</b>\n {` ${labels?.multiSelectionConjunction} ${selectionLabel.total}`}\n </HvTypography>\n );\n };\n\n const hasLabel = label != null;\n const hasDescription = description != null;\n\n // the error message area will only be created if:\n // - an external element that provides an error message isn't identified via aria-errormessage AND\n // - both status and statusMessage properties are being controlled OR\n // - status is uncontrolled and required is true\n const canShowError =\n ariaErrorMessage == null &&\n ((status !== undefined && statusMessage !== undefined) ||\n (status === undefined && required));\n\n const isStateInvalid = isInvalid(validationState);\n\n let errorMessageId;\n if (isStateInvalid) {\n errorMessageId = canShowError\n ? setId(elementId, \"error\")\n : ariaErrorMessage;\n }\n\n return (\n <HvFormElement\n id={id}\n name={name}\n status={validationState}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n className={cx(\n classes.root,\n disabled && css({ color: theme.dropdown.disabledColor }),\n className\n )}\n {...others}\n >\n {(hasLabel || hasDescription) && (\n <div className={classes.labelContainer}>\n {hasLabel && (\n <HvLabel\n id={setId(elementId, \"label\")}\n label={label}\n className={classes.label}\n />\n )}\n\n {hasDescription && (\n <HvInfoMessage\n id={setId(elementId, \"description\")}\n className={classes.description}\n >\n {description}\n </HvInfoMessage>\n )}\n </div>\n )}\n <HvBaseDropdown\n id={setId(id, \"dropdown\")}\n classes={{\n root: cx(\n classes.dropdown,\n readOnly &&\n css({\n [`& .${staticClasses.dropdownHeader}`]: {\n border: theme.dropdown.readOnlyBorder,\n backgroundColor: theme.dropdown.readOnlyBackgroundColor,\n },\n })\n ),\n arrow: classes.arrow,\n header: cx(classes.dropdownHeader, {\n [classes.dropdownHeaderInvalid]: isStateInvalid,\n }),\n headerOpen: classes.dropdownHeaderOpen,\n }}\n expanded={isOpen}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n disablePortal={disablePortal}\n placement={placement}\n popperProps={popperProps}\n placeholder={buildHeaderLabel()}\n onToggle={handleToggle}\n onClickOutside={handleClickOutside}\n onContainerCreation={setFocusToContent}\n role=\"combobox\"\n variableWidth={variableWidth}\n aria-label={ariaLabel}\n aria-labelledby={\n [label && setId(elementId, \"label\"), ariaLabelledBy]\n .join(\" \")\n .trim() || undefined\n }\n aria-invalid={isStateInvalid ? true : undefined}\n aria-errormessage={errorMessageId}\n aria-describedby={\n [description && setId(elementId, \"description\"), ariaDescribedBy]\n .join(\" \")\n .trim() || undefined\n }\n onFocus={onFocus}\n onBlur={onBlur}\n dropdownHeaderRef={dropdownHeaderRef}\n {...baseDropdownProps}\n >\n <HvDropdownList\n id={setId(elementId, \"values\")}\n classes={{\n rootList: classes.rootList,\n dropdownListContainer: classes.dropdownListContainer,\n }}\n values={internalValues}\n multiSelect={multiSelect}\n showSearch={showSearch}\n onChange={handleSelection}\n onCancel={handleCancel}\n labels={labels}\n notifyChangesOnFirstRender={notifyChangesOnFirstRender}\n hasTooltips={hasTooltips}\n singleSelectionToggle={singleSelectionToggle}\n aria-labelledby={hasLabel ? setId(elementId, \"label\") : undefined}\n height={height}\n maxHeight={maxHeight}\n virtualized={virtualized}\n {...listProps}\n />\n </HvBaseDropdown>\n {canShowError && (\n <HvWarningText\n id={setId(elementId, \"error\")}\n disableBorder\n className={classes.error}\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n};\n"],"names":["DEFAULT_LABELS","select","undefined","selectAll","cancelLabel","applyLabel","searchPlaceholder","multiSelectionConjunction","HvDropdown","props","classes","classesProp","className","id","name","required","disabled","readOnly","label","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","placeholder","onChange","status","statusMessage","ariaErrorMessage","onCancel","onToggle","onClickOutside","onFocus","onBlur","values","multiSelect","showSearch","expanded","defaultExpanded","notifyChangesOnFirstRender","labels","labelsProp","hasTooltips","disablePortal","singleSelectionToggle","placement","variableWidth","popperProps","height","maxHeight","virtualized","baseDropdownProps","listProps","others","useDefaultProps","cx","css","useClasses","useLabels","elementId","useUniqueId","validationState","setValidationState","useControlled","validationMessage","isOpen","setIsOpen","Boolean","selectionLabel","setSelectionLabel","useState","getSelectionLabel","internalValues","setInternalValues","useEffect","process","env","NODE_ENV","console","error","dropdownHeaderRef","useRef","handleToggle","event","open","hasSelection","getSelected","length","handleSelection","listValues","commitChanges","toggle","notifyChanges","selected","current","focus","preventScroll","handleCancel","evt","handleClickOutside","setFocusToContent","containerRef","inputs","getElementsByTagName","listItems","every","listItem","tabIndex","buildHeaderLabel","HvTypography","component","variant","selectionDisabled","color","theme","dropdown","placeholderColor","children","_jsxs","_jsx","total","hasLabel","hasDescription","canShowError","isStateInvalid","isInvalid","errorMessageId","setId","HvFormElement","root","disabledColor","labelContainer","HvLabel","HvInfoMessage","HvBaseDropdown","staticClasses","dropdownHeader","border","readOnlyBorder","backgroundColor","readOnlyBackgroundColor","arrow","header","dropdownHeaderInvalid","headerOpen","dropdownHeaderOpen","onContainerCreation","role","join","trim","HvDropdownList","rootList","dropdownListContainer","HvWarningText","disableBorder"],"mappings":";;;;;;;;;;;;;;;;;;AAiOA,MAAMA,iBAAwC;AAAA,EAC5CC,QAAQC;AAAAA,EACRC,WAAW;AAAA,EACXC,aAAa;AAAA,EACbC,YAAY;AAAA,EACZC,mBAAmB;AAAA,EACnBC,2BAA2B;AAC7B;AAKaC,MAAAA,aAAaA,CAACC,UAA2B;AAC9C,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IAEAC;AAAAA,IACAC;AAAAA,IAEAC,WAAW;AAAA,IACXC,WAAW;AAAA,IACXC,WAAW;AAAA,IAEXC;AAAAA,IACA,cAAcC;AAAAA,IACd,mBAAmBC;AAAAA,IACnBC;AAAAA,IACA,oBAAoBC;AAAAA,IAEpBC,cAAc;AAAA,IAEdC;AAAAA,IAEAC;AAAAA,IACAC;AAAAA,IACA,qBAAqBC;AAAAA,IAErBC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IAEAC;AAAAA,IACAC;AAAAA,IAEAC;AAAAA,IACAC,cAAc;AAAA,IACdC,aAAa;AAAA,IACbC;AAAAA,IACAC,kBAAkB;AAAA,IAClBC,6BAA6B;AAAA,IAC7BC,QAAQC;AAAAA,IACRC,cAAc;AAAA,IACdC,gBAAgB;AAAA,IAChBC,wBAAwB;AAAA,IACxBC;AAAAA,IACAC,gBAAgB;AAAA,IAChBC,cAAc,CAAC;AAAA,IACfC;AAAAA,IACAC;AAAAA,IACAC,cAAc;AAAA,IACdC,oBAAoB,CAAC;AAAA,IACrBC,YAAY,CAAC;AAAA,IACb,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,cAAc5C,KAAK;AAEjC,QAAA;AAAA,IAAEC;AAAAA,IAAS4C;AAAAA,IAAIC;AAAAA,EAAAA,IAAQC,WAAW7C,WAAW;AAE7C4B,QAAAA,SAASkB,UAAUzD,gBAAgBwC,UAAU;AAE7CkB,QAAAA,YAAYC,YAAY9C,IAAI,YAAY;AAE9C,QAAM,CAAC+C,iBAAiBC,kBAAkB,IAAIC,cAC5CrC,QACA,SACF;AAEA,QAAM,CAACsC,iBAAiB,IAAID,cAAcpC,eAAe,UAAU;AAE7D,QAAA,CAACsC,QAAQC,SAAS,IAAIH,cAAc1B,UAAU8B,QAAQ7B,eAAe,CAAC;AACtE,QAAA,CAAC8B,gBAAgBC,iBAAiB,IAAIC,SAC1CC,kBAAkB/B,QAAQhB,aAAaW,aAAaD,MAAM,CAC5D;AACA,QAAM,CAACsC,gBAAgBC,iBAAiB,IAAIH,SAASpC,MAAM;AAE3DwC,YAAU,MAAM;AACdD,sBAAkBvC,MAAM;AAAA,EAAA,GACvB,CAACA,MAAM,CAAC;AAEXwC,YAAU,MAAM;AACdL,sBACEE,kBAAkB/B,QAAQhB,aAAaW,aAAaD,MAAM,CAC5D;AAAA,KACC,CAACM,QAAQL,aAAaX,aAAaU,MAAM,CAAC;AAE7C,MAAIgB,eAAe,CAACF,UAAU2B,QAAQC,IAAIC,aAAa,cAAc;AAEnEC,YAAQC,MACN,wEACF;AAAA,EACF;AAEA,QAAMC,oBAAoBC;AAEpBC,QAAAA,eAAgDA,CAACC,OAAOC,SAAS;AACrEtD,yCAAWqD,OAAOC;AAElBlB,cAAUkB,IAAI;AAEd,QAAI,CAACA,MAAM;AAGTtB,yBAAmB,MAAM;AAEvB,YAAI9C,UAAU;AACZ,gBAAMqE,eAAeC,YAAYd,cAAc,EAAEe,SAAS;AAE1D,cAAI,CAACF,cAAc;AACV,mBAAA;AAAA,UACT;AAAA,QACF;AAEO,eAAA;AAAA,MAAA,CACR;AAAA,IACH;AAAA,EAAA;AAIF,QAAMG,kBAAmDA,CACvDC,YACAC,eACAC,QACAC,gBAAgB,SACb;;AACGC,UAAAA,WAAWP,YAAYG,UAAU;AAEvC,QAAIC,eAAe;AACjBjB,wBAAkBgB,UAAU;AAC5BpB,wBACEE,kBAAkB/B,QAAQhB,aAAaW,aAAasD,UAAU,CAChE;AAEA3B,yBAAmB,MAAM;AAEnB9C,YAAAA,YAAY6E,SAASN,WAAW,GAAG;AAC9B,iBAAA;AAAA,QACT;AAEO,eAAA;AAAA,MAAA,CACR;AAAA,IACH;AACIK,QAAAA;AAAenE,2CAAWU,cAAc0D,WAAWA,SAAS,CAAC;AACjE,QAAIF,QAAQ;AACVT,mBAAa/E,QAAkB,KAAK;AAIpC6E,8BAAkBc,YAAlBd,mBAA2Be,MAAM;AAAA,QAAEC,eAAe;AAAA,MAAA;AAAA,IACpD;AAAA,EAAA;AAMF,QAAMC,eAAiDC,CAAQ,QAAA;;AAC7DrE,yCAAWqE;AAEXhB,iBAAagB,KAAY,KAAK;AAI9BlB,4BAAkBc,YAAlBd,mBAA2Be,MAAM;AAAA,MAAEC,eAAe;AAAA,IAAA;AAAA,EAAM;AAG1D,QAAMG,qBAA6DD,CAAQ,QAAA;AACzEnE,qDAAiBmE;AACjBrE,yCAAWqE;AAAAA,EAAG;AAGhB,QAAME,oBACJC,CACG,iBAAA;AACGC,UAAAA,SAASD,6CAAcE,qBAAqB;AAC9CD,QAAAA,UAAUA,OAAOf,SAAS,GAAG;AACxB,aAAA,CAAC,EAAEQ;AACV;AAAA,IACF;AACMS,UAAAA,YACJH,gBAAgB,OAAO,CAAC,GAAGA,aAAaE,qBAAqB,IAAI,CAAC,IAAI;AACxEC,cAAUC,MAAOC,CAAa,aAAA;AACxBA,UAAAA,SAASC,YAAY,GAAG;AAC1BD,iBAASX,MAAM;AACR,eAAA;AAAA,MACT;AACO,aAAA;AAAA,IAAA,CACR;AAAA,EAAA;AAGH,QAAMa,mBAAmBA,MAAM;AAC7B,UAAMvB,eAAeC,YAAYd,cAAc,EAAEe,SAAS;AAC1D,YAAO/C,iCAAQtC,WAAU,CAACiC,kCACvB0E,cAAY;AAAA,MACXC,WAAU;AAAA,MACVC,SAAQ;AAAA,MACRlG,WAAW0C,GACT5C,QAAQa,aACR;AAAA,QACE,CAACb,QAAQqG,iBAAiB,GAAG/F;AAAAA,MAE/B,GAAA,EAAEgD,UAAUoB,iBACV7B,IAAI;AAAA,QAAEyD,OAAOC,MAAMC,SAASC;AAAAA,MAAAA,CAAkB,CAClD;AAAA,MAAEC,UAEDjD,eAAeyB;AAAAA,IAAAA,CACJ,IAEdyB,qBAACT,cAAY;AAAA,MACXC,WAAU;AAAA,MACVjG,WAAW0C,GAAG5C,QAAQa,aAAa;AAAA,QACjC,CAACb,QAAQqG,iBAAiB,GAAG/F;AAAAA,MAAAA,CAC9B;AAAA,MACD8F,SAAQ;AAAA,MAAMM,WAEdE,oBAAA,KAAA;AAAA,QAAAF,UAAIjD,eAAeyB;AAAAA,MAAAA,CAAY,GAC7B,IAAGrD,iCAAQhC,6BAA6B4D,eAAeoD,OAAO;AAAA,IAAA,CACpD;AAAA,EAAA;AAIlB,QAAMC,WAAWtG,SAAS;AAC1B,QAAMuG,iBAAiBpG,eAAe;AAMhCqG,QAAAA,eACJ/F,oBAAoB,SAClBF,WAAWvB,UAAawB,kBAAkBxB,UACzCuB,WAAWvB,UAAaa;AAEvB4G,QAAAA,iBAAiBC,UAAUhE,eAAe;AAE5CiE,MAAAA;AACJ,MAAIF,gBAAgB;AAClBE,qBAAiBH,eACbI,MAAMpE,WAAW,OAAO,IACxB/B;AAAAA,EACN;AAEA,8BACGoG,eAAa;AAAA,IACZlH;AAAAA,IACAC;AAAAA,IACAW,QAAQmC;AAAAA,IACR5C;AAAAA,IACAC;AAAAA,IACAF;AAAAA,IACAH,WAAW0C,GACT5C,QAAQsH,MACRhH,YAAYuC,IAAI;AAAA,MAAEyD,OAAOC,MAAMC,SAASe;AAAAA,IAAe,CAAA,GACvDrH,SACF;AAAA,IAAE,GACEwC;AAAAA,IAAMgE,YAERI,YAAYC,wCACZ,OAAA;AAAA,MAAK7G,WAAWF,QAAQwH;AAAAA,MAAed,UACpCI,CAAAA,YACCF,oBAACa,SAAO;AAAA,QACNtH,IAAIiH,MAAMpE,WAAW,OAAO;AAAA,QAC5BxC;AAAAA,QACAN,WAAWF,QAAQQ;AAAAA,MAAAA,CACpB,GAGFuG,kBACCH,oBAACc,eAAa;AAAA,QACZvH,IAAIiH,MAAMpE,WAAW,aAAa;AAAA,QAClC9C,WAAWF,QAAQW;AAAAA,QAAY+F,UAE9B/F;AAAAA,MAAAA,CACY,CAChB;AAAA,IAAA,CACE,GAEPiG,oBAACe,gBAAc;AAAA,MACbxH,IAAIiH,MAAMjH,IAAI,UAAU;AAAA,MACxBH,SAAS;AAAA,QACPsH,MAAM1E,GACJ5C,QAAQwG,UACRjG,YACEsC,IAAI;AAAA,UACF,CAAE,MAAK+E,cAAcC,gBAAgB,GAAG;AAAA,YACtCC,QAAQvB,MAAMC,SAASuB;AAAAA,YACvBC,iBAAiBzB,MAAMC,SAASyB;AAAAA,UAClC;AAAA,QAAA,CACD,CACL;AAAA,QACAC,OAAOlI,QAAQkI;AAAAA,QACfC,QAAQvF,GAAG5C,QAAQ6H,gBAAgB;AAAA,UACjC,CAAC7H,QAAQoI,qBAAqB,GAAGnB;AAAAA,QAAAA,CAClC;AAAA,QACDoB,YAAYrI,QAAQsI;AAAAA,MACtB;AAAA,MACA5G,UAAU4B;AAAAA,MACVhD;AAAAA,MACAC;AAAAA,MACAF;AAAAA,MACA2B;AAAAA,MACAE;AAAAA,MACAE;AAAAA,MACAvB,aAAaoF,iBAAiB;AAAA,MAC9B9E,UAAUoD;AAAAA,MACVnD,gBAAgBoE;AAAAA,MAChB+C,qBAAqB9C;AAAAA,MACrB+C,MAAK;AAAA,MACLrG;AAAAA,MACA,cAAY1B;AAAAA,MACZ,mBACE,CAACD,SAAS4G,MAAMpE,WAAW,OAAO,GAAGtC,cAAc,EAChD+H,KAAK,GAAG,EACRC,UAAUlJ;AAAAA,MAEf,gBAAcyH,iBAAiB,OAAOzH;AAAAA,MACtC,qBAAmB2H;AAAAA,MACnB,oBACE,CAACxG,eAAeyG,MAAMpE,WAAW,aAAa,GAAGpC,eAAe,EAC7D6H,KAAK,GAAG,EACRC,UAAUlJ;AAAAA,MAEf6B;AAAAA,MACAC;AAAAA,MACA+C;AAAAA,MAAqC,GACjC7B;AAAAA,MAAiBkE,8BAEpBiC,gBAAc;AAAA,QACbxI,IAAIiH,MAAMpE,WAAW,QAAQ;AAAA,QAC7BhD,SAAS;AAAA,UACP4I,UAAU5I,QAAQ4I;AAAAA,UAClBC,uBAAuB7I,QAAQ6I;AAAAA,QACjC;AAAA,QACAtH,QAAQsC;AAAAA,QACRrC;AAAAA,QACAC;AAAAA,QACAX,UAAU+D;AAAAA,QACV3D,UAAUoE;AAAAA,QACVzD;AAAAA,QACAD;AAAAA,QACAG;AAAAA,QACAE;AAAAA,QACA,mBAAiB6E,WAAWM,MAAMpE,WAAW,OAAO,IAAIxD;AAAAA,QACxD6C;AAAAA,QACAC;AAAAA,QACAC;AAAAA,QAAyB,GACrBE;AAAAA,MAAAA,CACL;AAAA,IAAA,CACa,GACfuE,gBACCJ,oBAACkC,eAAa;AAAA,MACZ3I,IAAIiH,MAAMpE,WAAW,OAAO;AAAA,MAC5B+F,eAAa;AAAA,MACb7I,WAAWF,QAAQoE;AAAAA,MAAMsC,UAExBrD;AAAAA,IAAAA,CACY,CAChB;AAAA,EAAA,CACY;AAEnB;"}
|