@thecb/components 6.0.0-beta.28 → 6.0.0-beta.30

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.esm.js CHANGED
@@ -20744,6 +20744,11 @@ var Dropdown = function Dropdown(_ref8) {
20744
20744
  inputChangedByAutofill = _useState14[0],
20745
20745
  setInputChangedByAutofill = _useState14[1];
20746
20746
 
20747
+ var _useState15 = useState(false),
20748
+ _useState16 = _slicedToArray(_useState15, 2),
20749
+ focusedByClick = _useState16[0],
20750
+ setFocusedByClick = _useState16[1];
20751
+
20747
20752
  if (optionsState !== options) {
20748
20753
  setOptionsState(options);
20749
20754
  setOptionsChanged(true);
@@ -20754,10 +20759,10 @@ var Dropdown = function Dropdown(_ref8) {
20754
20759
  setOptionsChanged(false);
20755
20760
  }
20756
20761
 
20757
- var _useState15 = useState(null),
20758
- _useState16 = _slicedToArray(_useState15, 2),
20759
- timer = _useState16[0],
20760
- setTimer = _useState16[1];
20762
+ var _useState17 = useState(null),
20763
+ _useState18 = _slicedToArray(_useState17, 2),
20764
+ timer = _useState18[0],
20765
+ setTimer = _useState18[1];
20761
20766
 
20762
20767
  var optionRefs = useRef(_toConsumableArray(Array(options.length)).map(function () {
20763
20768
  return /*#__PURE__*/createRef();
@@ -20872,14 +20877,23 @@ var Dropdown = function Dropdown(_ref8) {
20872
20877
  };
20873
20878
 
20874
20879
  useEffect$1(function () {
20875
- if (isOpen && selectedRef !== undefined && selectedRef.current !== null) {
20880
+ var selectedRefExists = selectedRef !== undefined && selectedRef.current !== null;
20881
+
20882
+ if (isOpen && selectedRefExists && !focusedByClick) {
20876
20883
  // WAI-ARIA requires the selected option to receive focus
20877
20884
  selectedRef.current.focus();
20878
- console.log("input box ref", inputRef, inputRef.current);
20879
- } else if (isOpen && optionRefs.current[0].current) {
20885
+ } else if (isOpen && optionRefs.current[0].current && !focusedByClick) {
20880
20886
  // If no selected option, first option receives focus
20881
20887
  optionRefs.current[0].current.focus();
20882
- console.log("input box ref", inputRef, inputRef.current);
20888
+ }
20889
+
20890
+ if (isOpen && focusedByClick && selectedRefExists) {
20891
+ selectedRef.current.scrollIntoView({
20892
+ behavior: "smooth",
20893
+ block: "nearest",
20894
+ inline: "start"
20895
+ });
20896
+ setFocusedByClick(false);
20883
20897
  }
20884
20898
 
20885
20899
  clearTimeout(timer);
@@ -20928,6 +20942,8 @@ var Dropdown = function Dropdown(_ref8) {
20928
20942
  minWidth: "100%",
20929
20943
  onClick: function onClick() {
20930
20944
  if (!isOpen) {
20945
+ setFocusedByClick(true);
20946
+
20931
20947
  _onClick();
20932
20948
  }
20933
20949
  },