chakra-react-select - npm Package Compare versions

Comparing version 4.1.0 to 4.1.1

dist/cjs/chakra-components/containers.js

@@ -62,3 +62,3 @@ "use strict";
     flex: 1,
-    padding: "0.125rem " + px[size],
+    padding: "0.125rem " + px[size || "md"],
     flexWrap: "wrap",
@@ -65,0 +65,0 @@ WebkitOverflowScrolling: "touch",

dist/cjs/chakra-components/control.js

@@ -47,3 +47,3 @@ "use strict";
     height: "auto",
-    minHeight: heights[size]
+    minHeight: heights[size || "md"]
   });
@@ -65,2 +65,3 @@
     "data-focus": isFocused ? true : undefined,
+    "data-focus-visible": isFocused ? true : undefined,
     "data-invalid": isInvalid ? true : undefined,
@@ -67,0 +68,0 @@ "data-disabled": isDisabled ? true : undefined

dist/cjs/chakra-components/group.js

@@ -67,4 +67,4 @@ "use strict";
   var initialStyles = _extends({}, groupTitle, {
-    fontSize: fontSizes[size],
-    padding: paddings[size],
+    fontSize: fontSizes[size || "md"],
+    padding: paddings[size || "md"],
     margin: 0,
@@ -71,0 +71,0 @@ borderBottomWidth: hasStickyGroupHeaders ? "1px" : 0,

dist/cjs/chakra-components/indicators.js

@@ -78,3 +78,3 @@ "use strict";
   };
-  var iconSize = iconSizes[size];
+  var iconSize = iconSizes[size || "md"];
 
@@ -91,6 +91,7 @@ var initialStyles = _extends({}, addon, {
   }, useBasicStyles && {
-    bg: "transparent",
-    p: 0,
-    w: 6,
-    mx: 2,
+    background: "transparent",
+    padding: 0,
+    width: 6,
+    marginRight: 2,
+    marginLeft: 1,
     cursor: "inherit"
@@ -171,3 +172,4 @@ });
     sx: sx,
-    "data-focused": isFocused ? true : undefined,
+    "data-focus": isFocused ? true : undefined,
+    "data-focus-visible": isFocused ? true : undefined,
     "aria-label": "Clear selected options"
@@ -198,3 +200,3 @@ }, innerProps), children || /*#__PURE__*/_react["default"].createElement(CrossIcon, {
   };
-  var spinnerSize = spinnerSizes[size];
+  var spinnerSize = spinnerSizes[size || "md"];
   var initialStyles = {
@@ -201,0 +203,0 @@ marginRight: 3

dist/cjs/chakra-components/menu.js

@@ -70,3 +70,3 @@ "use strict";
     overflowY: "auto",
-    borderRadius: borderRadii[size]
+    borderRadius: borderRadii[size || "md"]
   });
@@ -109,4 +109,4 @@
     textAlign: "center",
-    padding: paddings[size],
-    fontSize: fontSizes[size]
+    padding: paddings[size || "md"],
+    fontSize: fontSizes[size || "md"]
   };
@@ -147,4 +147,4 @@ var sx = chakraStyles != null && chakraStyles.loadingMessage ? chakraStyles.loadingMessage(initialStyles, props) : initialStyles;
     textAlign: "center",
-    padding: paddings[size],
-    fontSize: fontSizes[size]
+    padding: paddings[size || "md"],
+    fontSize: fontSizes[size || "md"]
   };
@@ -151,0 +151,0 @@ var sx = chakraStyles != null && chakraStyles.noOptionsMessage ? chakraStyles.noOptionsMessage(initialStyles, props) : initialStyles;

dist/cjs/chakra-components/multi-value.js

@@ -152,3 +152,4 @@ "use strict";
     sx: sx,
-    "data-focus": isFocused ? true : undefined
+    "data-focus": isFocused ? true : undefined,
+    "data-focus-visible": isFocused ? true : undefined
   }), children || /*#__PURE__*/_react["default"].createElement(TagCloseIcon, null));
@@ -155,0 +156,0 @@ };

dist/cjs/chakra-components/option.js

@@ -35,4 +35,2 @@ "use strict";
 var Option = function Option(props) {
-  var _itemStyles$_focus;
-
   var className = props.className,
@@ -78,5 +76,5 @@ cx = props.cx,
     fontSize: size,
-    padding: paddings[size],
-    bg: isFocused ? (_itemStyles$_focus = itemStyles._focus) == null ? void 0 : _itemStyles$_focus.bg : "transparent"
-  }, shouldHighlight && {
+    padding: paddings[size || "md"],
+    bg: "transparent"
+  }, isFocused && itemStyles._focus, shouldHighlight && {
     bg: selectedBg,
@@ -83,0 +81,0 @@ color: selectedColor,

dist/esm/chakra-components/containers.js

@@ -50,3 +50,3 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
     flex: 1,
-    padding: "0.125rem " + px[size],
+    padding: "0.125rem " + px[size || "md"],
     flexWrap: "wrap",
@@ -53,0 +53,0 @@ WebkitOverflowScrolling: "touch",

dist/esm/chakra-components/control.js

@@ -38,3 +38,3 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
     height: "auto",
-    minHeight: heights[size]
+    minHeight: heights[size || "md"]
   });
@@ -56,2 +56,3 @@
     "data-focus": isFocused ? true : undefined,
+    "data-focus-visible": isFocused ? true : undefined,
     "data-invalid": isInvalid ? true : undefined,
@@ -58,0 +59,0 @@ "data-disabled": isDisabled ? true : undefined

dist/esm/chakra-components/group.js

@@ -58,4 +58,4 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
   var initialStyles = _extends({}, groupTitle, {
-    fontSize: fontSizes[size],
-    padding: paddings[size],
+    fontSize: fontSizes[size || "md"],
+    padding: paddings[size || "md"],
     margin: 0,
@@ -62,0 +62,0 @@ borderBottomWidth: hasStickyGroupHeaders ? "1px" : 0,

dist/esm/chakra-components/indicators.js

@@ -60,3 +60,3 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
   };
-  var iconSize = iconSizes[size];
+  var iconSize = iconSizes[size || "md"];
 
@@ -73,6 +73,7 @@ var initialStyles = _extends({}, addon, {
   }, useBasicStyles && {
-    bg: "transparent",
-    p: 0,
-    w: 6,
-    mx: 2,
+    background: "transparent",
+    padding: 0,
+    width: 6,
+    marginRight: 2,
+    marginLeft: 1,
     cursor: "inherit"
@@ -147,3 +148,4 @@ });
     sx: sx,
-    "data-focused": isFocused ? true : undefined,
+    "data-focus": isFocused ? true : undefined,
+    "data-focus-visible": isFocused ? true : undefined,
     "aria-label": "Clear selected options"
@@ -171,3 +173,3 @@ }, innerProps), children || /*#__PURE__*/React.createElement(CrossIcon, {
   };
-  var spinnerSize = spinnerSizes[size];
+  var spinnerSize = spinnerSizes[size || "md"];
   var initialStyles = {
@@ -174,0 +176,0 @@ marginRight: 3

dist/esm/chakra-components/menu.js

@@ -61,3 +61,3 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
     overflowY: "auto",
-    borderRadius: borderRadii[size]
+    borderRadius: borderRadii[size || "md"]
   });
@@ -98,4 +98,4 @@
     textAlign: "center",
-    padding: paddings[size],
-    fontSize: fontSizes[size]
+    padding: paddings[size || "md"],
+    fontSize: fontSizes[size || "md"]
   };
@@ -134,4 +134,4 @@ var sx = chakraStyles != null && chakraStyles.loadingMessage ? chakraStyles.loadingMessage(initialStyles, props) : initialStyles;
     textAlign: "center",
-    padding: paddings[size],
-    fontSize: fontSizes[size]
+    padding: paddings[size || "md"],
+    fontSize: fontSizes[size || "md"]
   };
@@ -138,0 +138,0 @@ var sx = chakraStyles != null && chakraStyles.noOptionsMessage ? chakraStyles.noOptionsMessage(initialStyles, props) : initialStyles;

dist/esm/chakra-components/multi-value.js

@@ -138,3 +138,4 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
     sx: sx,
-    "data-focus": isFocused ? true : undefined
+    "data-focus": isFocused ? true : undefined,
+    "data-focus-visible": isFocused ? true : undefined
   }), children || /*#__PURE__*/React.createElement(TagCloseIcon, null));
@@ -141,0 +142,0 @@ };

dist/esm/chakra-components/option.js

@@ -25,4 +25,2 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 var Option = function Option(props) {
-  var _itemStyles$_focus;
-
   var className = props.className,
@@ -68,5 +66,5 @@ cx = props.cx,
     fontSize: size,
-    padding: paddings[size],
-    bg: isFocused ? (_itemStyles$_focus = itemStyles._focus) == null ? void 0 : _itemStyles$_focus.bg : "transparent"
-  }, shouldHighlight && {
+    padding: paddings[size || "md"],
+    bg: "transparent"
+  }, isFocused && itemStyles._focus, shouldHighlight && {
     bg: selectedBg,
@@ -73,0 +71,0 @@ color: selectedColor,

package.json

 {
   "name": "chakra-react-select",
-  "version": "4.1.0",
+  "version": "4.1.1",
   "description": "A Chakra UI wrapper for the popular library React Select",
@@ -5,0 +5,0 @@ "license": "MIT",

No alert changes

Improved metrics

Total package byte prevSize

386465

increased by0.36%

Lines of code

2818

increased by0.21%

No dependency changes