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

package/dist/index.cjs.js

@@ -6309,7 +6309,7 @@ var _excluded$3 = ["padding", "borderSize", "borderColor", "borderRadius", "boxS
   completely off screen (only for users of screen readers)
 */
 
-var Box = function Box(_ref) {
+var Box = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _ref$padding = _ref.padding,
       padding = _ref$padding === void 0 ? "16px" : _ref$padding,
       _ref$borderSize = _ref.borderSize,
@@ -6379,9 +6379,10 @@ var Box = function Box(_ref) {
     onMouseLeave: onMouseLeave,
     onFocus: onFocus,
     onBlur: onBlur,
-    onTouchEnd: onTouchEnd
+    onTouchEnd: onTouchEnd,
+    ref: ref
   }, rest), children && safeChildren(children, /*#__PURE__*/React__default.createElement(React.Fragment, null)));
-};
+});
 
 var CenterWrapper = styled__default.div.withConfig({
   displayName: "Centerstyled__CenterWrapper",
@@ -20751,8 +20752,6 @@ var Dropdown = function Dropdown(_ref8) {
       inputChangedByAutofill = _useState14[0],
       setInputChangedByAutofill = _useState14[1];
 
-  var inputBox = React.useRef(null);
-
   if (optionsState !== options) {
     setOptionsState(options);
     setOptionsChanged(true);
@@ -20772,6 +20771,7 @@ var Dropdown = function Dropdown(_ref8) {
     return /*#__PURE__*/React.createRef();
   }));
   var dropdownRef = React.useRef(null);
+  var inputRef = React.useRef(null);
 
   var getSelection = function getSelection() {
     var _options$find;
@@ -20883,11 +20883,11 @@ var Dropdown = function Dropdown(_ref8) {
     if (isOpen && selectedRef !== undefined && selectedRef.current !== null) {
       // WAI-ARIA requires the selected option to receive focus
       selectedRef.current.focus();
-      inputBox.current.focus();
+      console.log("input box ref", inputRef, inputRef.current);
     } else if (isOpen && optionRefs.current[0].current) {
       // If no selected option, first option receives focus
       optionRefs.current[0].current.focus();
-      inputBox.current.focus();
+      console.log("input box ref", inputRef, inputRef.current);
     }
 
     clearTimeout(timer);
@@ -20974,7 +20974,7 @@ var Dropdown = function Dropdown(_ref8) {
     },
     padding: "12px",
     placeholder: getSelection(),
-    ref: inputBox,
+    ref: inputRef,
     role: "combobox",
     themeValues: themeValues,
     title: hasTitles ? getSelection() : null,