@flodesk/grain 5.8.0 → 5.8.1

package/es/components/select.js

@@ -81,10 +81,19 @@ var MenuItem = /*#__PURE__*/React.forwardRef(function (_ref2, ref) {
     icon: /*#__PURE__*/React.createElement(IconCheck, null)
   })));
 });
-export var Select = function Select(_ref3) {
-  var options = _ref3.options,
-      defaultOption = _ref3.defaultOption,
-      onChange = _ref3.onChange;
+
+var Root = function Root(_ref3) {
+  var props = Object.assign({}, _ref3);
+  return /*#__PURE__*/React.createElement(Box, Object.assign({}, props, {
+    width: "fit-content",
+    position: "relative"
+  }));
+};
+
+export var Select = function Select(_ref4) {
+  var options = _ref4.options,
+      defaultOption = _ref4.defaultOption,
+      onChange = _ref4.onChange;
 
   var _useState = useState(defaultOption || options[0]),
       _useState2 = _slicedToArray(_useState, 2),
@@ -97,6 +106,7 @@ export var Select = function Select(_ref3) {
   };
 
   return /*#__PURE__*/React.createElement(Listbox, {
+    as: Root,
     value: selectedOption,
     onChange: handleChange
   }, /*#__PURE__*/React.createElement(SelectButton, null, selectedOption.content), /*#__PURE__*/React.createElement(Options, null, options.map(function (option, index) {
@@ -104,9 +114,9 @@ export var Select = function Select(_ref3) {
       key: index,
       value: option,
       as: React.Fragment
-    }, function (_ref4) {
-      var active = _ref4.active,
-          selected = _ref4.selected;
+    }, function (_ref5) {
+      var active = _ref5.active,
+          selected = _ref5.selected;
       return /*#__PURE__*/React.createElement(MenuItem, {
         isSelected: selected,
         isActive: active

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flodesk/grain",
-  "version": "5.8.0",
+  "version": "5.8.1",
   "description": "Flodesk design system",
   "module": "es/index.js",
   "author": "Flodesk",