@luminati-io/uikit 3.3.1 → 3.3.2

package/dist/umd/uikit.development.js

@@ -37175,6 +37175,7 @@ var useStyles = function useStyles(_ref) {
           lg: 48
         };
         var borderColor = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.gray_7;
+        var boxShadow = 'none';
         var color = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.gray_11_50;
         var backgroundColor = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.white;
         var cursor = 'text';
@@ -37183,7 +37184,10 @@ var useStyles = function useStyles(_ref) {
           borderColor = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.gray_6;
           backgroundColor = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.gray_2;
           cursor = 'default';
-        } else if (selectProps['aria-invalid']) borderColor = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.red_11;else if (isFocused) borderColor = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.blue_11;
+        } else if (selectProps['aria-invalid']) borderColor = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.red_11;else if (isFocused) {
+          borderColor = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.blue_11;
+          boxShadow = "0px 0px 0px 2px rgba(0, 106, 220, 0.4)";
+        }
         return _objectSpread(_objectSpread(_objectSpread({}, baseStyles), LabelSm), {}, {
           minHeight: (0,_utils__WEBPACK_IMPORTED_MODULE_2__.toPixel)(height[size] || height.sm),
           padding: "".concat(_shared__WEBPACK_IMPORTED_MODULE_3__.inputVerticalPadding, "px ").concat(_shared__WEBPACK_IMPORTED_MODULE_3__.inputHorizontalPadding, "px"),
@@ -37191,7 +37195,7 @@ var useStyles = function useStyles(_ref) {
           backgroundColor: backgroundColor,
           borderColor: borderColor,
           cursor: cursor,
-          boxShadow: 'none'
+          boxShadow: boxShadow
         });
       },
       valueContainer: function valueContainer(baseStyles) {
@@ -38331,22 +38335,29 @@ var useStyles = function useStyles(_ref) {
     size = _ref.size;
   return (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(function () {
     return (0,_util_with_user_styles__WEBPACK_IMPORTED_MODULE_5__.withUserStyles)(styles, {
-      control: function control(baseStyles, state) {
+      control: function control(baseStyles, _ref2) {
+        var isDisabled = _ref2.isDisabled,
+          isFocused = _ref2.isFocused,
+          selectProps = _ref2.selectProps;
         var height = {
           sm: 36,
           md: 40,
           lg: 48
         };
         var borderColor = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.gray_7;
+        var boxShadow = 'none';
         var color = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.gray_11_50;
         var backgroundColor = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.white;
         var cursor = 'text';
-        if (state.isDisabled) {
+        if (isDisabled) {
           color = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.gray_9;
           borderColor = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.gray_6;
           backgroundColor = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.gray_2;
           cursor = 'default';
-        } else if (state.selectProps['aria-invalid']) borderColor = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.red_11;else if (state.isFocused) borderColor = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.blue_11;
+        } else if (selectProps['aria-invalid']) borderColor = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.red_11;else if (isFocused) {
+          borderColor = _theme__WEBPACK_IMPORTED_MODULE_1__["default"].color.blue_11;
+          boxShadow = "0px 0px 0px 2px rgba(0, 106, 220, 0.4)";
+        }
         return _objectSpread(_objectSpread({}, baseStyles), {}, {
           minHeight: (0,_utils__WEBPACK_IMPORTED_MODULE_2__.toPixel)(height[size] || height.sm),
           padding: "".concat(_shared__WEBPACK_IMPORTED_MODULE_4__.inputVerticalPadding, "px ").concat(_shared__WEBPACK_IMPORTED_MODULE_4__.inputHorizontalPadding, "px"),
@@ -38360,7 +38371,7 @@ var useStyles = function useStyles(_ref) {
           backgroundColor: backgroundColor,
           borderColor: borderColor,
           cursor: cursor,
-          boxShadow: 'none'
+          boxShadow: boxShadow
         });
       },
       valueContainer: function valueContainer(baseStyles) {