@flodesk/grain 11.54.0 → 11.55.1

package/es/components/card.js

@@ -0,0 +1,96 @@
+const _excluded = ["children", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight", "padding", "radius", "position", "zIndex"];
+
+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); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Box } from './box';
+import { types } from '../types';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export const Card = _ref => {
+  let {
+    children,
+    width,
+    minWidth,
+    maxWidth,
+    height,
+    minHeight,
+    maxHeight,
+    padding = 'var(--grn-card-padding)',
+    radius = 'var(--grn-card-radius)',
+    position,
+    zIndex
+  } = _ref,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  return ___EmotionJSX(Box, {
+    className: "grn-card-container",
+    width: width,
+    minWidth: minWidth,
+    maxWidth: maxWidth,
+    position: position,
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0,
+    zIndex: zIndex
+  }, ___EmotionJSX(Box, _extends({
+    className: "grn-card",
+    width: "100%",
+    padding: padding,
+    radius: radius,
+    height: height,
+    minHeight: minHeight,
+    maxHeight: maxHeight
+  }, props), children));
+};
+Card.propTypes = {
+  color: types.color,
+  colorHover: types.color,
+  backgroundColor: types.color,
+  backgroundColorHover: types.color,
+  borderColor: types.color,
+  borderColorHover: types.color,
+  borderWidth: types.borderWidth,
+  borderSide: types.side,
+  width: types.responsiveDimension,
+  minWidth: types.responsiveDimension,
+  maxWidth: types.responsiveDimension,
+  height: types.responsiveDimension,
+  minHeight: types.responsiveDimension,
+  maxHeight: types.responsiveDimension,
+  radius: types.radius,
+  shadow: types.shadow,
+  shadowHover: types.shadow,
+  padding: types.responsiveSpace,
+  margin: types.responsiveSpace,
+  marginTop: types.responsiveSpace,
+  marginBottom: types.responsiveSpace,
+  marginLeft: types.responsiveSpace,
+  marginRight: types.responsiveSpace,
+  marginX: types.responsiveSpace,
+  marginY: types.responsiveSpace,
+  position: types.position,
+  top: types.responsiveSpace,
+  bottom: types.responsiveSpace,
+  left: types.responsiveSpace,
+  right: types.responsiveSpace,
+  overflow: types.overflow,
+  overflowX: types.overflow,
+  overflowY: types.overflow,
+  aspectRatio: PropTypes.string,
+  zIndex: types.zIndex,
+  opacity: PropTypes.string,
+  opacityHover: PropTypes.string,
+  order: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.object]),
+  alignSelf: types.alignSelf,
+  flex: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
+  transition: types.transition,
+  transitionHover: types.transition,
+  cursor: types.cursor,
+  tag: PropTypes.string
+};

package/es/components/index.js

@@ -30,4 +30,5 @@ export { Nav, NavItem } from './nav';
 export { Flex } from './flex';
 export { Badge } from './badge';
 export { Toast } from './toast';
-export { Radio } from './radio';
+export { Radio } from './radio';
+export { Card } from './card';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flodesk/grain",
-  "version": "11.54.0",
+  "version": "11.55.1",
   "description": "Flodesk design system",
   "module": "es/index.js",
   "types": "es/types/index.d.ts",