@flodesk/grain 5.11.0 → 5.11.1

package/es/components/select.js

@@ -96,7 +96,7 @@ export var Select = function Select(_ref3) {
     onChange: handleChange
   }, /*#__PURE__*/React.createElement(Listbox.Button, {
     as: Fragment
-  }, trigger ? trigger(selectedOption) : /*#__PURE__*/React.createElement(DefaultTrigger, null, selectedOption)), /*#__PURE__*/React.createElement(Listbox.Options, {
+  }, trigger ? trigger(selectedOption) : /*#__PURE__*/React.createElement(DefaultTrigger, null, selectedOption.content)), /*#__PURE__*/React.createElement(Listbox.Options, {
     menuAlign: menuAlign,
     menuWidth: menuWidth,
     as: MenuCard
@@ -104,20 +104,22 @@ export var Select = function Select(_ref3) {
     return /*#__PURE__*/React.createElement(Listbox.Option, {
       key: index,
       value: option,
-      as: Fragment
+      as: Fragment,
+      disabled: option.isDisabled
     }, function (_ref4) {
       var active = _ref4.active,
           selected = _ref4.selected;
       return /*#__PURE__*/React.createElement(MenuCardItem, {
         isSelected: selected,
-        isActive: active
-      }, option);
+        isActive: active,
+        isDisabled: option.isDisabled
+      }, option.content);
     });
   })));
 };
 Select.propTypes = {
   options: PropTypes.array,
-  defaultOption: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+  defaultOption: PropTypes.object,
   onChange: PropTypes.func,
   menuAlign: PropTypes.oneOf(['left', 'right']),
   menuWidth: types.dimension,

package/es/foundational/index.js

@@ -4,7 +4,7 @@ import "core-js/modules/es.object.define-properties.js";
 import "core-js/modules/es.object.keys.js";
 import "core-js/modules/es.array.index-of.js";
 import "core-js/modules/es.symbol.js";
-var _excluded = ["children", "isSelected", "isActive", "icon"];
+var _excluded = ["children", "isSelected", "isActive", "isDisabled", "icon"];
 
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
 
@@ -43,22 +43,27 @@ export var MenuCard = styled.ul(_templateObject5 || (_templateObject5 = _taggedT
   var menuAlign = _ref3.menuAlign;
   return "".concat(menuAlign, ": 0;");
 });
-var MenuItemWrapper = styled.li(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  display: grid;\n  grid-auto-flow: column;\n  grid-template-columns: ", ";\n  ", ";\n  align-items: center;\n  justify-content: start;\n  list-style: none;\n  padding: 0 12px;\n  min-height: ", ";\n  cursor: pointer;\n  border-radius: ", ";\n  appearance: none;\n"])), function (p) {
+var MenuItemWrapper = styled.li(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  display: grid;\n  grid-auto-flow: column;\n  grid-template-columns: ", ";\n  ", ";\n  ", ";\n  align-items: center;\n  justify-content: start;\n  list-style: none;\n  padding: 0 12px;\n  min-height: ", ";\n  cursor: pointer;\n  border-radius: ", ";\n  appearance: none;\n"])), function (p) {
   return p.hasIcon ? 'auto 1fr' : '1fr auto';
 }, function (p) {
   return (p.hasIcon || p.isSelected) && 'gap: 8px';
+}, function (_ref4) {
+  var isDisabled = _ref4.isDisabled;
+  return isDisabled && "color: ".concat(getColor('contentDisabled'));
 }, textBoxHeight, getRadius('s'));
-export var MenuCardItem = /*#__PURE__*/forwardRef(function (_ref4, ref) {
-  var children = _ref4.children,
-      isSelected = _ref4.isSelected,
-      isActive = _ref4.isActive,
-      icon = _ref4.icon,
-      props = _objectWithoutProperties(_ref4, _excluded);
+export var MenuCardItem = /*#__PURE__*/forwardRef(function (_ref5, ref) {
+  var children = _ref5.children,
+      isSelected = _ref5.isSelected,
+      isActive = _ref5.isActive,
+      isDisabled = _ref5.isDisabled,
+      icon = _ref5.icon,
+      props = _objectWithoutProperties(_ref5, _excluded);
 
   return /*#__PURE__*/React.createElement(MenuItemWrapper, Object.assign({
     ref: ref,
     isActive: isActive,
     isSelected: isSelected,
+    isDisabled: isDisabled,
     style: {
       background: isActive ? getColor('overlay') : undefined
     },

package/package.json

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