@bolio-ui/core 1.0.2 → 1.0.4

package/README.md

@@ -1,16 +1,27 @@
 <p align="center">
   <a href="https://github.com/bolio-ui/bolio-ui">
-    <img src="https://github.com/bolio-ui/bolio-ui/blob/master/public/logo-colored.svg" alt="Bolio UI Logo" width="100" />
+    <img src="https://bolio-ui.com/logo-colored.svg" alt="Bolio UI Logo" width="100" />
   </a>
 </p>
 
 <h1 align="center">Bolio UI 🥷🏼</h1>
 
 <p align="center">
-  <img alt="Bundle Size" src="https://badgen.net/bundlephobia/minzip/@bolio-ui/core"/>
-  <img alt="MIT License" src="https://img.shields.io/github/license/bolio-ui/bolio-ui"/>
-  <img alt="NPM Downloads" src="https://img.shields.io/npm/dm/@bolio-ui/core.svg?style=flat"/>
-  <img alt="Github Stars" src="https://badgen.net/github/stars/bolio-ui/bolio-ui" />
+  <a href="https://github.com/bolio-ui/bolio-ui/blob/master/LICENSE">
+    <img alt="MIT License" src="https://img.shields.io/github/license/bolio-ui/bolio-ui" />
+  </a>
+  <a href="https://www.npmjs.com/package/@bolio-ui/core">
+    <img alt="NPM Downloads" src="https://img.shields.io/npm/dm/@bolio-ui/core.svg?style=flat" />
+  </a>
+  <a href="https://github.com/bolio-ui/bolio-ui/">
+    <img alt="Github Stars" src="https://badgen.net/github/stars/bolio-ui/bolio-ui" />
+  </a>
+  <a href="https://github.com/bolio-ui/bolio-ui/issues">
+    <img alt="Issues" src="https://img.shields.io/github/issues/bolio-ui/bolio-ui?color=0088ff" />
+  </a>
+  <a href="https://github.com/bolio-ui/bolio-ui/pulls">
+    <img alt="GitHub pull requests" src="https://img.shields.io/github/issues-pr/bolio-ui/bolio-ui?color=0088ff" />
+  </a>
 </p>
 
 <br />
@@ -38,10 +49,11 @@ npm i @bolio-ui/core
 Go to the root of your application and do this:
 
 ```jsx
-import { BolioUIProvider } from '@bolio-ui/core'
+import { BolioUIProvider, CssBaseline } from '@bolio-ui/core'
 
 const Application = () => (
   <BolioUIProvider>
+    <CssBaseline /> // ---> Normalize styles
     <AppComponent /> // ---> Your App Component
   </BolioUIProvider>
 )
@@ -57,6 +69,12 @@ import { Button } from '@bolio-ui/core'
 const Component = () => <Button>Click me</Button>
 ```
 
+### Showcases
+
+- [Bolio Icons](https://icons.bolio-ui.com/)
+- [Bolio Me](https://me.bolio-ui.com/)
+- [Bolio ChatGPT](https://chatgpt.bolio-ui.com/)
+
 ### Community
 
 We're excited to see the community adopt Bolio UI, raise issues, and provide feedback.

package/dist/card/index.js

@@ -1212,17 +1212,20 @@ var ImageBrowser$1 = ImageBrowser;
 Image$1.Browser = ImageBrowser$1;
 
 var _excluded = ["children", "hoverable", "rounded", "className", "shadow", "type"];
+var defaultProps = {
+  type: 'default',
+  hoverable: false,
+  shadow: false,
+  className: ''
+};
 
 function CardComponent(_ref) {
   var children = _ref.children,
-      _ref$hoverable = _ref.hoverable,
-      hoverable = _ref$hoverable === void 0 ? false : _ref$hoverable,
-      _ref$rounded = _ref.rounded,
-      rounded = _ref$rounded === void 0 ? false : _ref$rounded,
+      hoverable = _ref.hoverable,
+      rounded = _ref.rounded,
       _ref$className = _ref.className,
       className = _ref$className === void 0 ? '' : _ref$className,
-      _ref$shadow = _ref.shadow,
-      shadow = _ref$shadow === void 0 ? false : _ref$shadow,
+      shadow = _ref.shadow,
       _ref$type = _ref.type,
       type = _ref$type === void 0 ? 'default' : _ref$type,
       props = _objectWithoutProperties(_ref, _excluded);
@@ -1241,8 +1244,8 @@ function CardComponent(_ref) {
     return getStyles(type, theme.palette, shadow);
   }, [type, theme.palette, shadow]),
       color = _useMemo.color,
-      bgColor = _useMemo.bgColor;
-      _useMemo.borderColor;
+      bgColor = _useMemo.bgColor,
+      borderColor = _useMemo.borderColor;
 
   var _pickChild = pickChild(children, CardFooter$1),
       _pickChild2 = _slicedToArray(_pickChild, 2),
@@ -1256,15 +1259,14 @@ function CardComponent(_ref) {
 
   var hasContent = hasChild(withoutImageChildren, CardContent$1);
   return /*#__PURE__*/React__default["default"].createElement("div", _extends({}, props, {
-    className: styledJsx_cjs.style.dynamic([["470877697", [rounded ? '25px' : theme.layout.radius, shadow ? theme.expressiveness.shadowSmall : 'none', color, bgColor, SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverShadow]]]) + " " + (props && props.className != null && props.className || useClasses$1('card', className) || "")
-  }), imageChildren, hasContent ? withoutImageChildren : /*#__PURE__*/React__default["default"].createElement(CardContent$1, {
-    className: "card"
-  }, withoutImageChildren), footerChildren, /*#__PURE__*/React__default["default"].createElement(styledJsx_cjs.style, {
-    id: "470877697",
-    dynamic: [rounded ? '25px' : theme.layout.radius, shadow ? theme.expressiveness.shadowSmall : 'none', color, bgColor, SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverShadow]
-  }, ".card.__jsx-style-dynamic-selector{-webkit-transition:all 0.2s ease;transition:all 0.2s ease;border-radius:".concat(rounded ? '25px' : theme.layout.radius, ";box-shadow:").concat(shadow ? theme.expressiveness.shadowSmall : 'none', ";box-sizing:border-box;color:").concat(color, ";background-color:").concat(bgColor, ";width:").concat(SCALES.width(1, 'auto'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.card.__jsx-style-dynamic-selector:hover{box-shadow:").concat(hoverShadow, ";}.card.__jsx-style-dynamic-selector img{width:100%;}.card.__jsx-style-dynamic-selector .image{border-bottom-left-radius:0;border-bottom-right-radius:0;}")));
+    className: styledJsx_cjs.style.dynamic([["1209748169", [theme.palette.background, rounded ? '25px' : theme.layout.radius, shadow ? theme.expressiveness.shadowSmall : 'none', color, bgColor, borderColor, SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverShadow]]]) + " " + (props && props.className != null && props.className || useClasses$1('card', className) || "")
+  }), imageChildren, hasContent ? withoutImageChildren : /*#__PURE__*/React__default["default"].createElement(CardContent$1, null, withoutImageChildren), footerChildren, /*#__PURE__*/React__default["default"].createElement(styledJsx_cjs.style, {
+    id: "1209748169",
+    dynamic: [theme.palette.background, rounded ? '25px' : theme.layout.radius, shadow ? theme.expressiveness.shadowSmall : 'none', color, bgColor, borderColor, SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverShadow]
+  }, ".card.__jsx-style-dynamic-selector{background:".concat(theme.palette.background, ";-webkit-transition:all 0.2s ease;transition:all 0.2s ease;border-radius:").concat(rounded ? '25px' : theme.layout.radius, ";box-shadow:").concat(shadow ? theme.expressiveness.shadowSmall : 'none', ";box-sizing:border-box;color:").concat(color, ";background-color:").concat(bgColor, ";border:none;width:").concat(SCALES.width(1, 'auto'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.card.__jsx-style-dynamic-selector:hover{box-shadow:").concat(hoverShadow, ";}.card.__jsx-style-dynamic-selector img{width:100%;}.card.__jsx-style-dynamic-selector .image{border-bottom-left-radius:0;border-bottom-right-radius:0;}")));
 }
 
+CardComponent.defaultProps = defaultProps;
 CardComponent.displayName = 'BolioUICard';
 var Card = withScale$1(CardComponent);
 var Card$1 = Card;