@thecb/components 6.0.0-beta.10 → 6.0.0-beta.11
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/index.cjs.js +14 -6
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +14 -6
- package/dist/index.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/atoms/dropdown/Dropdown.js +78 -72
package/dist/index.cjs.js
CHANGED
|
@@ -19422,7 +19422,7 @@ var DropdownContentWrapper = styled__default.div.withConfig({
|
|
|
19422
19422
|
var maxHeight = _ref3.maxHeight;
|
|
19423
19423
|
return maxHeight || "400px";
|
|
19424
19424
|
});
|
|
19425
|
-
var DropdownItemWrapper = styled__default.
|
|
19425
|
+
var DropdownItemWrapper = styled__default.li.withConfig({
|
|
19426
19426
|
displayName: "Dropdown__DropdownItemWrapper",
|
|
19427
19427
|
componentId: "sc-pn6m0h-2"
|
|
19428
19428
|
})(["background-color:", ";text-align:start;border-width:0px;border-color:transparent;box-shadow:none;padding:1rem;box-sizing:border-box;width:100%;cursor:", ";&:hover{background-color:", ";}&:focus{background-color:", ";outline:none;}"], function (_ref4) {
|
|
@@ -19596,6 +19596,13 @@ var Dropdown = function Dropdown(_ref8) {
|
|
|
19596
19596
|
e.preventDefault();
|
|
19597
19597
|
optionRefs.current[(_optionRefs$current$l = optionRefs === null || optionRefs === void 0 ? void 0 : (_optionRefs$current = optionRefs.current) === null || _optionRefs$current === void 0 ? void 0 : _optionRefs$current.length) !== null && _optionRefs$current$l !== void 0 ? _optionRefs$current$l : 0 - 1].current.focus();
|
|
19598
19598
|
break;
|
|
19599
|
+
|
|
19600
|
+
case "Escape":
|
|
19601
|
+
if (isOpen) {
|
|
19602
|
+
onClick();
|
|
19603
|
+
}
|
|
19604
|
+
|
|
19605
|
+
break;
|
|
19599
19606
|
}
|
|
19600
19607
|
};
|
|
19601
19608
|
|
|
@@ -19682,7 +19689,9 @@ var Dropdown = function Dropdown(_ref8) {
|
|
|
19682
19689
|
value: inputValue,
|
|
19683
19690
|
width: "100%",
|
|
19684
19691
|
dataQa: placeholder
|
|
19685
|
-
},
|
|
19692
|
+
}), /*#__PURE__*/React__default.createElement(IconWrapper, {
|
|
19693
|
+
open: isOpen
|
|
19694
|
+
}, /*#__PURE__*/React__default.createElement(DropdownIcon, null))), /*#__PURE__*/React__default.createElement(React.Fragment, null, isOpen ? /*#__PURE__*/React__default.createElement(DropdownContentWrapper, {
|
|
19686
19695
|
maxHeight: maxHeight,
|
|
19687
19696
|
open: isOpen,
|
|
19688
19697
|
ref: dropdownRef,
|
|
@@ -19691,7 +19700,8 @@ var Dropdown = function Dropdown(_ref8) {
|
|
|
19691
19700
|
role: "listbox",
|
|
19692
19701
|
id: "".concat(ariaLabelledby, "_listbox")
|
|
19693
19702
|
}, /*#__PURE__*/React__default.createElement(Stack, {
|
|
19694
|
-
childGap: "0"
|
|
19703
|
+
childGap: "0",
|
|
19704
|
+
as: "ul"
|
|
19695
19705
|
}, filteredOptions.map(function (choice, i) {
|
|
19696
19706
|
if (choice.value === value && selectedRef !== optionRefs.current[i]) {
|
|
19697
19707
|
setSelectedRef(optionRefs.current[i]);
|
|
@@ -19723,9 +19733,7 @@ var Dropdown = function Dropdown(_ref8) {
|
|
|
19723
19733
|
color: choice.value === value ? WHITE : disabledValues.includes(choice.value) ? STORM_GREY : MINESHAFT_GREY,
|
|
19724
19734
|
extraStyles: "padding-left: 16px; \n cursor: ".concat(disabledValues.includes(choice.value) ? "default" : "pointer", "; \n white-space: nowrap; \n overflow: hidden; \n text-overflow: ellipsis;")
|
|
19725
19735
|
}, choice.text));
|
|
19726
|
-
}))) : /*#__PURE__*/React__default.createElement(React.Fragment, null))
|
|
19727
|
-
open: isOpen
|
|
19728
|
-
}, /*#__PURE__*/React__default.createElement(DropdownIcon, null))));
|
|
19736
|
+
}))) : /*#__PURE__*/React__default.createElement(React.Fragment, null)));
|
|
19729
19737
|
};
|
|
19730
19738
|
|
|
19731
19739
|
var Dropdown$1 = themeComponent(Dropdown, "Dropdown", fallbackValues$e);
|