beem-component 1.3.2 → 1.3.5

package/dist/components/Accordion/Accordion.js

@@ -19,7 +19,7 @@ var _iconStyles = require("../iconStyles");
 
 var _icons = require("@material-ui/icons");
 
-var _excluded = ["children", "disabled", "expandIcon"],
+var _excluded = ["children", "disabled", "expandIcon", "Open"],
     _excluded2 = ["children", "leadingIcon", "trailingIcon", "size"];
 
 var _templateObject, _templateObject2, _templateObject3;
@@ -74,9 +74,7 @@ var Dropdown = function Dropdown(value, rest) {
   }
 };
 
-var BmAccordionMenu = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  flex-direction: row;\n  ", "\n  padding: 0.571rem 1.143rem;\n  border: 1px solid \n  background: ", ";\n  > *:not(:last-child) {\n    margin-right: 0.5rem;\n  }\n"])), ""
-/* padding: 0.571rem; */
-, _colors.BmPrimaryWhite);
+var BmAccordionMenu = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  flex-direction: row;\n  padding: 0.571rem 1.143rem;\n  background: ", ";\n  > *:not(:last-child) {\n    margin-right: 0.5rem;\n  }\n"])), _colors.BmPrimaryWhite);
 
 var BmAccordionDetails = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  width: 100%;\n"])));
 
@@ -86,9 +84,10 @@ var BmAccordion = function BmAccordion(_ref) {
   var children = _ref.children,
       disabled = _ref.disabled,
       expandIcon = _ref.expandIcon,
+      Open = _ref.Open,
       rest = _objectWithoutProperties(_ref, _excluded);
 
-  var _useState = (0, _react.useState)(false),
+  var _useState = (0, _react.useState)(Open ? true : false),
       _useState2 = _slicedToArray(_useState, 2),
       toggle = _useState2[0],
       setToggle = _useState2[1];
@@ -138,7 +137,8 @@ BmAccordion.propTypes = {
   expandIcon: _propTypes.default.string,
   leadingIcon: _propTypes.default.node,
   trailingIcon: _propTypes.default.node,
-  disabled: _propTypes.default.bool
+  disabled: _propTypes.default.bool,
+  Open: _propTypes.default.bool
 };
 var _default = BmAccordion;
 exports.default = _default;

package/dist/components/Accordion/Accordion.stories.js

@@ -40,6 +40,15 @@ var _default = {
         type: "boolean"
       }
     },
+    Open: {
+      description: "Accordion body will be open initially",
+      defaultValue: {
+        summary: false
+      },
+      control: {
+        type: "boolean"
+      }
+    },
     children: {
       description: "Accordion Title Text",
       defaultValue: {
@@ -75,7 +84,8 @@ var optionSize = {
 
 var Accordion = function Accordion() {
   return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Accordion.default, {
-    disabled: (0, _addonKnobs.boolean)("disabled", false)
+    disabled: (0, _addonKnobs.boolean)("disabled", false),
+    Open: (0, _addonKnobs.boolean)("disabled", false)
   }, /*#__PURE__*/_react.default.createElement(_Accordion.default.Title, {
     leadingIcon: /*#__PURE__*/_react.default.createElement(_icons.Home, null),
     trailingIcon: /*#__PURE__*/_react.default.createElement(_icons.Favorite, null),

package/dist/components/ProgressRing/progressRing.js

@@ -128,9 +128,6 @@ var BmProgressRing = function BmProgressRing(props) {
       progress = props.progress,
       variant = props.variant,
       children = props.children;
-  console.log({
-    children: children
-  });
   var initialMeasure = measurement(size);
   circumference = initialMeasure.circumference;
   radius = initialMeasure.radius;

package/dist/components/RouteLink/link.js

@@ -13,16 +13,17 @@ var _colors = require("../colors");
 
 var _text = require("../text");
 
+var _polished = require("polished");
+
 var _templateObject;
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 
-var BmRouteLink = (0, _styledComponents.default)(_reactRouterDom.Link)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", "\n  color: ", ";\n  text-decoration: none;\n  &:hover,\n  &:focus,\n  &:active {\n    ", "\n    font-weight: 600;\n    &:before {\n      font-weight: normal;\n    }\n  }\n"])), _text.p, function (props) {
+var BmRouteLink = (0, _styledComponents.default)(_reactRouterDom.Link)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", "\n  color: ", ";\n  text-decoration: none;\n  &:hover,\n  &:focus,\n  &:active {\n    font-weight: 600;\n    &:before {\n      font-weight: normal;\n    }\n    color: ", " !important;\n  }\n"])), _text.p, function (props) {
   return props.color ? props.color : "".concat(_colors.BmPrimaryBlue, " ");
-}, ''
-/* color: ${(props) =>
-darken(0.1, props.color ? props.color : `${BmPrimaryBlue} `)} !important; */
-);
+}, function (props) {
+  return (0, _polished.darken)(0.1, props.color ? props.color : "".concat(_colors.BmPrimaryBlue));
+});
 exports.BmRouteLink = BmRouteLink;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "beem-component",
-    "version": "1.3.2",
+    "version": "1.3.5",
     "private": false,
     "main": "dist/components/index.js",
     "scripts": {

package/src/App.js

@@ -6,6 +6,7 @@ import {
   BmIcons,
   BmNoteBar,
   BmTab,
+  BmAccordion,
   MainWrapper,
 } from "./lib/components";
 import { GlobalStyle } from "./lib/components/globalStyles";
@@ -46,6 +47,10 @@ export const App = () => {
       <BmNoteBar closeButton>
         <p>Hello</p>
       </BmNoteBar>
+      <BmAccordion Open>
+        <BmAccordion.Title>Hello</BmAccordion.Title>
+        <BmAccordion.Body>Helloooo</BmAccordion.Body>
+      </BmAccordion>
       {/* </MainWrapper> */}
     </>
   );

package/src/lib/components/Accordion/Accordion.js

@@ -26,9 +26,7 @@ const BmAccordionMenu = styled.div`
   display: flex;
   align-items: center;
   flex-direction: row;
-  ${"" /* padding: 0.571rem; */}
   padding: 0.571rem 1.143rem;
-  border: 1px solid 
   background: ${BmPrimaryWhite};
   > *:not(:last-child) {
     margin-right: 0.5rem;
@@ -46,8 +44,8 @@ const BmAccordionWrapper = styled.div`
   flex-direction: column;
 `;
 
-const BmAccordion = ({ children, disabled, expandIcon, ...rest }) => {
-  const [toggle, setToggle] = useState(false);
+const BmAccordion = ({ children, disabled, expandIcon, Open, ...rest }) => {
+  const [toggle, setToggle] = useState(Open ? true : false);
 
   return (
     <BmAccordionWrapper>
@@ -99,6 +97,7 @@ BmAccordion.propTypes = {
   leadingIcon: PropTypes.node,
   trailingIcon: PropTypes.node,
   disabled: PropTypes.bool,
+  Open: PropTypes.bool,
 };
 
 export default BmAccordion;

package/src/lib/components/Accordion/Accordion.stories.js

@@ -20,6 +20,11 @@ export default {
       defaultValue: { summary: false },
       control: { type: "boolean" },
     },
+    Open: {
+      description: "Accordion body will be open initially",
+      defaultValue: { summary: false },
+      control: { type: "boolean" },
+    },
     children: {
       description: "Accordion Title Text",
       defaultValue: { summary: undefined },
@@ -48,7 +53,7 @@ const optionSize = {
 export const Accordion = () => {
   return (
     <div>
-      <BmAccordion disabled={boolean("disabled", false)}>
+      <BmAccordion disabled={boolean("disabled", false)} Open={boolean("disabled", false)}>
         <BmAccordion.Title
           leadingIcon={<Home />}
           trailingIcon={<Favorite />}

package/src/lib/components/ProgressRing/progressRing.js

@@ -90,7 +90,6 @@ const BmProgressRing = (props) => {
   const circleRef = useRef(null);
   const { size, progress, variant, children } = props;
 
-  console.log({ children });
   const initialMeasure = measurement(size);
 
   circumference = initialMeasure.circumference;

package/src/lib/components/RouteLink/link.js

@@ -2,6 +2,7 @@ import styled from "styled-components";
 import { Link } from "react-router-dom";
 import { BmPrimaryBlue } from "../colors";
 import { p } from "../text";
+import { darken } from "polished";
 
 export const BmRouteLink = styled(Link)`
   ${p}
@@ -10,11 +11,10 @@ export const BmRouteLink = styled(Link)`
   &:hover,
   &:focus,
   &:active {
-    ${'' /* color: ${(props) =>
-      darken(0.1, props.color ? props.color : `${BmPrimaryBlue} `)} !important; */}
     font-weight: 600;
     &:before {
       font-weight: normal;
     }
+    color: ${(props) => darken(0.1, props.color ? props.color : `${BmPrimaryBlue}`)} !important;
   }
 `;