beem-component 1.7.9 → 1.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Accordion/Accordion.js +15 -54
- package/dist/components/Accordion/Accordion.stories.js +0 -8
- package/dist/components/Avatars/avatars.js +3 -23
- package/dist/components/Avatars/avatars.stories.js +0 -7
- package/dist/components/BannerCard/bannerCard.stories.js +0 -14
- package/dist/components/BannerCard/bannerCards.js +7 -37
- package/dist/components/Buttons/Stories/basicbutton.stories.js +0 -7
- package/dist/components/Buttons/Stories/buttonAlertIcons.stories.js +0 -7
- package/dist/components/Buttons/Stories/buttonIconsOnly.stories.js +0 -7
- package/dist/components/Buttons/buttonAlertIcons.js +4 -29
- package/dist/components/Buttons/buttonDropdown copy.js +9 -40
- package/dist/components/Buttons/buttonDropdown.js +0 -7
- package/dist/components/Buttons/buttonIconsOnly.js +10 -32
- package/dist/components/Buttons/buttons.js +29 -67
- package/dist/components/Cards/cards.js +0 -7
- package/dist/components/Cards/cards.stories.js +0 -12
- package/dist/components/ChatComponents/ChatBody/FeedPostComments.js +4 -30
- package/dist/components/ChatComponents/ChatBody/chatBody.js +34 -107
- package/dist/components/ChatComponents/ChatBody/chatBody.stories.js +0 -13
- package/dist/components/ChatComponents/ChatBody/sessionDetails.js +2 -16
- package/dist/components/ChatComponents/ChatBody/sessionTimeline.js +2 -18
- package/dist/components/ChatComponents/ChatHeader/chatHeader.js +1 -8
- package/dist/components/ChatComponents/ChatHeader/chatHeader.stories.js +0 -7
- package/dist/components/ChatComponents/ColorPicker/colorPicker.js +0 -6
- package/dist/components/ChatComponents/ColorPicker/colorPicker.stories.js +0 -6
- package/dist/components/ChatComponents/ContactCards/contactCards.js +3 -14
- package/dist/components/ChatComponents/ContactCards/contactCards.stories.js +0 -9
- package/dist/components/ChatComponents/FormAccordion/FormAccordion.js +0 -6
- package/dist/components/ChatComponents/FormAccordion/FormAccordion.stories.js +0 -6
- package/dist/components/ChatComponents/InfoTab/infoTab.js +1 -8
- package/dist/components/ChatComponents/InfoTab/infoTab.stories.js +0 -9
- package/dist/components/ChatComponents/LabelAccordion/LabelAccordion.js +0 -6
- package/dist/components/ChatComponents/LabelAccordion/LabelAccordion.stories.js +0 -6
- package/dist/components/ChatComponents/NoteAccordion/NoteAccordion.js +0 -7
- package/dist/components/ChatComponents/NoteAccordion/NoteAccordion.stories.js +0 -8
- package/dist/components/Chats/chat.js +17 -65
- package/dist/components/Chats/chatInput.js +5 -21
- package/dist/components/Chats/chatwrapper.js +7 -27
- package/dist/components/Checkbox/checkboxToggler.js +5 -18
- package/dist/components/Checkbox/checkboxToggler.stories.js +9 -30
- package/dist/components/Lists/listBox.js +3 -25
- package/dist/components/Lists/listBox.stories.js +3 -23
- package/dist/components/Lists/listHeader.stories.js +0 -8
- package/dist/components/Lists/listheader.js +4 -21
- package/dist/components/Lists/rowLabels.js +6 -29
- package/dist/components/Lists/rowLabels.stories.js +3 -12
- package/dist/components/Loader/loader.js +1 -20
- package/dist/components/Loader/loader.stories.js +0 -6
- package/dist/components/MainWrapper/index.js +0 -7
- package/dist/components/MessageCounter/MessageCounter.stories.js +0 -7
- package/dist/components/MessageCounter/messageCounter.js +0 -9
- package/dist/components/Modals/modal.js +28 -65
- package/dist/components/Modals/modals.stories.js +9 -32
- package/dist/components/NoteBar/noteBar.js +9 -39
- package/dist/components/NoteBar/noteBar.stories.js +0 -6
- package/dist/components/PaymentBox/paymentBox.js +1 -15
- package/dist/components/PaymentBox/paymentBox.stories.js +0 -6
- package/dist/components/PerformanceIndicator/performaceIndicator.stories.js +0 -6
- package/dist/components/PerformanceIndicator/performanceIndicator.js +4 -23
- package/dist/components/Pills/pills.js +13 -45
- package/dist/components/Pills/pills.stories.js +0 -7
- package/dist/components/ProfileIcon/ProfileIcon.js +4 -29
- package/dist/components/ProfileIcon/profileIcon.stories.js +0 -7
- package/dist/components/ProgressBar/progressbar.js +1 -13
- package/dist/components/ProgressBar/progressbar.stories.js +0 -6
- package/dist/components/ProgressRing/progressRing.js +6 -39
- package/dist/components/ProgressRing/progressRing.stories.js +0 -6
- package/dist/components/RouteLink/link.js +0 -9
- package/dist/components/RouteLink/link.stories.js +0 -7
- package/dist/components/ScrollBar/scrollBar.js +0 -11
- package/dist/components/SuperFluid/Content/index.js +0 -7
- package/dist/components/SuperFluid/ContentTitle.js/index.js +0 -13
- package/dist/components/SuperFluid/SegmentCard/index.js +0 -25
- package/dist/components/Tabs/tabs.js +11 -31
- package/dist/components/Tabs/tabs.stories.js +0 -7
- package/dist/components/Tags/tags.js +18 -53
- package/dist/components/Tags/tags.stories.js +0 -9
- package/dist/components/chatHeader.js +1 -18
- package/dist/components/checkbox.js +7 -25
- package/dist/components/colors.js +12 -6
- package/dist/components/contacts.js +17 -50
- package/dist/components/dropdown.js +12 -43
- package/dist/components/dropdownButton.js +7 -31
- package/dist/components/dropdownItems.js +7 -34
- package/dist/components/examples/App.js +6 -16
- package/dist/components/examples/InfoAccordion.js +0 -6
- package/dist/components/examples/chatBodyExample.js +0 -9
- package/dist/components/examples/selectExample.js +3 -20
- package/dist/components/globalStyles.js +0 -5
- package/dist/components/iconStyles.js +17 -37
- package/dist/components/index-copy.js +0 -49
- package/dist/components/index.js +0 -45
- package/dist/components/input.js +21 -44
- package/dist/components/logo.js +2 -18
- package/dist/components/navbar.js +10 -19
- package/dist/components/search.js +2 -24
- package/dist/components/text.js +12 -8
- package/dist/components/wrapper.js +2 -14
- package/package.json +98 -96
- package/src/App.js +240 -243
- package/src/lib/components/input.js +31 -21
|
@@ -4,96 +4,70 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.Button = exports.BmButtonDropDown = void 0;
|
|
7
|
-
|
|
8
7
|
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
8
|
var _icons = require("@material-ui/icons");
|
|
11
|
-
|
|
12
9
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
13
|
-
|
|
14
10
|
var _buttonIconsOnly = require("./buttonIconsOnly");
|
|
15
|
-
|
|
16
11
|
var _buttons = require("./buttons");
|
|
17
|
-
|
|
18
12
|
var _colors = require("../colors");
|
|
19
|
-
|
|
20
13
|
var _excluded = ["children"];
|
|
21
|
-
|
|
22
14
|
var _templateObject, _templateObject2, _templateObject3;
|
|
23
|
-
|
|
24
15
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
25
|
-
|
|
26
16
|
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); }
|
|
27
|
-
|
|
28
17
|
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; }
|
|
29
|
-
|
|
30
18
|
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; }
|
|
31
|
-
|
|
32
19
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
33
|
-
|
|
34
20
|
var ButtonDropdownWrapper = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n &:hover {\n background: ", ";\n border: 0.071rem solid\n ", ";\n }\n &:active {\n background: ", ";\n box-shadow: ", ";\n border: 0.071rem solid\n ", ";\n }\n"])), function (_ref) {
|
|
35
21
|
var variant = _ref.variant,
|
|
36
|
-
|
|
37
|
-
|
|
22
|
+
disabled = _ref.disabled;
|
|
38
23
|
if (!disabled) {
|
|
39
24
|
if (variant === "primary") return "".concat(_colors.BmSecondaryCyan);
|
|
40
25
|
if (variant === "neutral") return "".concat(_colors.BmGrey50);
|
|
41
26
|
if (variant === "success") return "".concat(_colors.BmSecondaryGreen8);
|
|
42
27
|
if (variant === "destructive") return "".concat(_colors.BmSecondaryRed8);
|
|
43
|
-
|
|
44
28
|
if (!variant) {
|
|
45
29
|
return "".concat(_colors.BmSecondaryCyan);
|
|
46
30
|
}
|
|
47
31
|
}
|
|
48
32
|
}, function (_ref2) {
|
|
49
33
|
var variant = _ref2.variant,
|
|
50
|
-
|
|
51
|
-
|
|
34
|
+
disabled = _ref2.disabled;
|
|
52
35
|
if (!disabled) {
|
|
53
36
|
if (variant === "secondary") return "".concat(_colors.BmSecondaryCyan);
|
|
54
37
|
}
|
|
55
|
-
|
|
56
38
|
return "none";
|
|
57
39
|
}, function (_ref3) {
|
|
58
40
|
var variant = _ref3.variant,
|
|
59
|
-
|
|
60
|
-
|
|
41
|
+
disabled = _ref3.disabled;
|
|
61
42
|
if (!disabled) {
|
|
62
43
|
if (variant === "primary") return "".concat(_colors.BmPrimaryBlue);
|
|
63
44
|
if (variant === "neutral") return "".concat(_colors.BmGrey100);
|
|
64
45
|
if (variant === "success") return "".concat(_colors.BmSecondaryDarkGreen);
|
|
65
46
|
if (variant === "destructive") return "".concat(_colors.BmSecondaryRed);
|
|
66
|
-
|
|
67
47
|
if (!variant) {
|
|
68
48
|
return "".concat(_colors.BmPrimaryBlue);
|
|
69
49
|
}
|
|
70
50
|
}
|
|
71
51
|
}, function (_ref4) {
|
|
72
52
|
var variant = _ref4.variant,
|
|
73
|
-
|
|
74
|
-
|
|
53
|
+
disabled = _ref4.disabled;
|
|
75
54
|
if (!disabled) {
|
|
76
55
|
if (variant === "primary" || variant === "success" || variant === "destructive") return "inset 0rem 0.125rem 0.25rem rgba(0, 0, 0, 0.25)";
|
|
77
|
-
|
|
78
56
|
if (!variant) {
|
|
79
57
|
return "inset 0rem 0.125rem 0.25rem rgba(0, 0, 0, 0.25)";
|
|
80
58
|
}
|
|
81
59
|
}
|
|
82
60
|
}, function (_ref5) {
|
|
83
61
|
var variant = _ref5.variant,
|
|
84
|
-
|
|
85
|
-
|
|
62
|
+
disabled = _ref5.disabled;
|
|
86
63
|
if (!disabled) {
|
|
87
64
|
if (variant === "secondary") return "".concat(_colors.BmPrimaryBlue);
|
|
88
65
|
}
|
|
89
|
-
|
|
90
66
|
return "none";
|
|
91
67
|
});
|
|
92
|
-
|
|
93
68
|
var Dropdown = (0, _styledComponents.default)(_buttonIconsOnly.BmBtnIcon)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n background: ", ";\n border: 0.0625rem solid\n ", ";\n\n border-left: 0.071rem solid\n ", ";\n border-top-left-radius: 0.071rem;\n border-bottom-left-radius: 0.071rem;\n padding: 0rem;\n"])), function (_ref6) {
|
|
94
69
|
var variant = _ref6.variant,
|
|
95
|
-
|
|
96
|
-
|
|
70
|
+
disabled = _ref6.disabled;
|
|
97
71
|
if (!disabled) {
|
|
98
72
|
if (variant === "primary") return "".concat(_colors.BmPrimaryBlue);
|
|
99
73
|
if (variant === "secondary") return "none";
|
|
@@ -110,8 +84,7 @@ var Dropdown = (0, _styledComponents.default)(_buttonIconsOnly.BmBtnIcon)(_templ
|
|
|
110
84
|
}
|
|
111
85
|
}, function (_ref7) {
|
|
112
86
|
var variant = _ref7.variant,
|
|
113
|
-
|
|
114
|
-
|
|
87
|
+
disabled = _ref7.disabled;
|
|
115
88
|
if (!disabled) {
|
|
116
89
|
if (variant === "primary") return "".concat(_colors.BmPrimaryBlue);
|
|
117
90
|
if (variant === "secondary") return "".concat(_colors.BmPrimaryBlue);
|
|
@@ -127,8 +100,7 @@ var Dropdown = (0, _styledComponents.default)(_buttonIconsOnly.BmBtnIcon)(_templ
|
|
|
127
100
|
}
|
|
128
101
|
}, function (_ref8) {
|
|
129
102
|
var variant = _ref8.variant,
|
|
130
|
-
|
|
131
|
-
|
|
103
|
+
disabled = _ref8.disabled;
|
|
132
104
|
if (!disabled) {
|
|
133
105
|
if (variant === "primary") return "".concat(_colors.BmPrimaryWhite);
|
|
134
106
|
if (variant === "secondary") return "".concat(_colors.BmPrimaryBlue);
|
|
@@ -145,14 +117,11 @@ var Dropdown = (0, _styledComponents.default)(_buttonIconsOnly.BmBtnIcon)(_templ
|
|
|
145
117
|
});
|
|
146
118
|
var Button = (0, _styledComponents.default)(_buttons.BmButton)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n border-top-right-radius: 0.071rem;\n border-bottom-right-radius: 0.071rem;\n border-radius: none;\n border-right: none;\n"])));
|
|
147
119
|
exports.Button = Button;
|
|
148
|
-
|
|
149
120
|
var BmButtonDropDown = function BmButtonDropDown(_ref9) {
|
|
150
121
|
var children = _ref9.children,
|
|
151
|
-
|
|
152
|
-
|
|
122
|
+
rest = _objectWithoutProperties(_ref9, _excluded);
|
|
153
123
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(ButtonDropdownWrapper, rest, /*#__PURE__*/_react.default.createElement(Button, rest, children), /*#__PURE__*/_react.default.createElement(Dropdown, _extends({}, rest, {
|
|
154
124
|
icon: /*#__PURE__*/_react.default.createElement(_icons.KeyboardArrowDown, null)
|
|
155
125
|
}))));
|
|
156
126
|
};
|
|
157
|
-
|
|
158
127
|
exports.BmButtonDropDown = BmButtonDropDown;
|
|
@@ -4,17 +4,11 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.BmButtonDropdown = void 0;
|
|
7
|
-
|
|
8
7
|
var _icons = require("@material-ui/icons");
|
|
9
|
-
|
|
10
8
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
11
|
-
|
|
12
9
|
var _buttonIconsOnly = require("./buttonIconsOnly");
|
|
13
|
-
|
|
14
10
|
var _buttons = require("./buttons");
|
|
15
|
-
|
|
16
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
-
|
|
18
12
|
var BmButtonDropdown = function BmButtonDropdown(_ref) {
|
|
19
13
|
var children = _ref.children;
|
|
20
14
|
return /*#__PURE__*/React.createElement("div", {
|
|
@@ -26,5 +20,4 @@ var BmButtonDropdown = function BmButtonDropdown(_ref) {
|
|
|
26
20
|
leadingIcon: /*#__PURE__*/React.createElement(_icons.KeyboardArrowDown, null)
|
|
27
21
|
}));
|
|
28
22
|
};
|
|
29
|
-
|
|
30
23
|
exports.BmButtonDropdown = BmButtonDropdown;
|
|
@@ -4,36 +4,22 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.BmIconWrapper = exports.BmBtnIcon = void 0;
|
|
7
|
-
|
|
8
7
|
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
8
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
11
|
-
|
|
12
9
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
|
-
|
|
14
10
|
var _colors = require("../colors");
|
|
15
|
-
|
|
16
11
|
var _iconStyles = require("../iconStyles");
|
|
17
|
-
|
|
18
12
|
var _excluded = ["variant", "size", "disabled", "children", "icon", "color"];
|
|
19
|
-
|
|
20
13
|
var _templateObject, _templateObject2;
|
|
21
|
-
|
|
22
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
23
|
-
|
|
24
15
|
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); }
|
|
25
|
-
|
|
26
16
|
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; }
|
|
27
|
-
|
|
28
17
|
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; }
|
|
29
|
-
|
|
30
18
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
31
|
-
|
|
32
19
|
var BeemButtonIcon = _styledComponents.default.button(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n background: ", ";\n border: 0.071rem solid\n ", ";\n box-sizing: border-box;\n border-radius: 0.25rem;\n padding: 0rem;\n"])), function (_ref) {
|
|
33
20
|
var variant = _ref.variant,
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
21
|
+
disabled = _ref.disabled,
|
|
22
|
+
color = _ref.color;
|
|
37
23
|
if (!disabled) {
|
|
38
24
|
if (variant === 'active') return "".concat(_colors.BmPrimaryBlue);
|
|
39
25
|
if (variant === 'enabled') return "".concat(_colors.BmGrey50);
|
|
@@ -45,13 +31,11 @@ var BeemButtonIcon = _styledComponents.default.button(_templateObject || (_templ
|
|
|
45
31
|
if (variant === 'tertiary') return "".concat(_colors.BmPrimaryWhite);
|
|
46
32
|
return "".concat(color || _colors.BmPrimaryBlue);
|
|
47
33
|
}
|
|
48
|
-
|
|
49
34
|
return "".concat(_colors.BmGrey100);
|
|
50
35
|
}, function (_ref2) {
|
|
51
36
|
var variant = _ref2.variant,
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
37
|
+
disabled = _ref2.disabled,
|
|
38
|
+
color = _ref2.color;
|
|
55
39
|
if (!disabled) {
|
|
56
40
|
if (variant === 'active') return "".concat(_colors.BmPrimaryBlue);
|
|
57
41
|
if (variant === 'enabled') return "".concat(_colors.BmGrey50);
|
|
@@ -63,23 +47,18 @@ var BeemButtonIcon = _styledComponents.default.button(_templateObject || (_templ
|
|
|
63
47
|
if (variant === 'tertiary') return "".concat(_colors.BmPrimaryWhite);
|
|
64
48
|
return "".concat(color || _colors.BmPrimaryBlue);
|
|
65
49
|
}
|
|
66
|
-
|
|
67
50
|
return "".concat(_colors.BmGrey100);
|
|
68
51
|
});
|
|
69
|
-
|
|
70
52
|
var BmIconWrapper = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n padding: 0.5rem !important;\n"])));
|
|
71
|
-
|
|
72
53
|
exports.BmIconWrapper = BmIconWrapper;
|
|
73
|
-
|
|
74
54
|
var BmBtnIcon = function BmBtnIcon(props) {
|
|
75
55
|
var variant = props.variant,
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
56
|
+
size = props.size,
|
|
57
|
+
disabled = props.disabled,
|
|
58
|
+
children = props.children,
|
|
59
|
+
icon = props.icon,
|
|
60
|
+
color = props.color,
|
|
61
|
+
rest = _objectWithoutProperties(props, _excluded);
|
|
83
62
|
return /*#__PURE__*/_react.default.createElement(BeemButtonIcon, _extends({
|
|
84
63
|
color: color,
|
|
85
64
|
size: size,
|
|
@@ -93,7 +72,6 @@ var BmBtnIcon = function BmBtnIcon(props) {
|
|
|
93
72
|
color: color
|
|
94
73
|
})));
|
|
95
74
|
};
|
|
96
|
-
|
|
97
75
|
exports.BmBtnIcon = BmBtnIcon;
|
|
98
76
|
BmBtnIcon.propTypes = {
|
|
99
77
|
size: _propTypes.default.string,
|
|
@@ -4,35 +4,20 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.BmRightIcon = exports.BmLeftIcon = exports.BmButton = void 0;
|
|
7
|
-
|
|
8
7
|
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
8
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
11
|
-
|
|
12
9
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
|
-
|
|
14
10
|
var _polished = require("polished");
|
|
15
|
-
|
|
16
11
|
var _colors = require("../colors");
|
|
17
|
-
|
|
18
12
|
var _iconStyles = require("../iconStyles");
|
|
19
|
-
|
|
20
13
|
var _text = require("../text");
|
|
21
|
-
|
|
22
14
|
var _excluded = ["variant", "size", "disabled", "children", "leadingIcon", "trailingIcon", "color", "type"];
|
|
23
|
-
|
|
24
15
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4;
|
|
25
|
-
|
|
26
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
27
|
-
|
|
28
17
|
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); }
|
|
29
|
-
|
|
30
18
|
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; }
|
|
31
|
-
|
|
32
19
|
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; }
|
|
33
|
-
|
|
34
20
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
35
|
-
|
|
36
21
|
var ButtonText = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n ", "\n text-align: center;\n color: ", ";\n padding: 0rem;\n"])), function (_ref) {
|
|
37
22
|
var size = _ref.size;
|
|
38
23
|
if (size === 'large') return "".concat(_text.h3);
|
|
@@ -41,9 +26,8 @@ var ButtonText = _styledComponents.default.div(_templateObject || (_templateObje
|
|
|
41
26
|
return "".concat(_text.h3);
|
|
42
27
|
}, function (_ref2) {
|
|
43
28
|
var variant = _ref2.variant,
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
29
|
+
disabled = _ref2.disabled,
|
|
30
|
+
color = _ref2.color;
|
|
47
31
|
if (!disabled) {
|
|
48
32
|
if (variant === 'primary') return "".concat(_colors.BmPrimaryWhite);
|
|
49
33
|
if (variant === 'secondary') return "".concat(color || _colors.BmPrimaryBlue);
|
|
@@ -53,10 +37,8 @@ var ButtonText = _styledComponents.default.div(_templateObject || (_templateObje
|
|
|
53
37
|
if (variant === 'neutral') return "".concat(color || _colors.BmPrimaryBlue);
|
|
54
38
|
return "".concat(_colors.BmPrimaryWhite);
|
|
55
39
|
}
|
|
56
|
-
|
|
57
40
|
return "".concat(_colors.BmGrey400);
|
|
58
41
|
});
|
|
59
|
-
|
|
60
42
|
var BeemButton = _styledComponents.default.button(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n border-radius: 0.25rem;\n padding: ", ";\n background: ", ";\n\n border: 0.071rem solid\n ", ";\n\n &:hover {\n background: ", ";\n border: 0.071rem solid\n ", ";\n }\n &:active {\n background: ", ";\n box-shadow: ", ";\n border: 0.071rem solid\n ", ";\n }\n\n &:hover ", " {\n color: ", ";\n }\n &:active ", " {\n color: ", ";\n }\n"])), function (_ref3) {
|
|
61
43
|
var size = _ref3.size;
|
|
62
44
|
if (size === 'large') return '0.625rem 1.5rem';
|
|
@@ -65,9 +47,8 @@ var BeemButton = _styledComponents.default.button(_templateObject2 || (_template
|
|
|
65
47
|
return '0.625rem 1.5rem';
|
|
66
48
|
}, function (_ref4) {
|
|
67
49
|
var variant = _ref4.variant,
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
50
|
+
disabled = _ref4.disabled,
|
|
51
|
+
color = _ref4.color;
|
|
71
52
|
if (!disabled) {
|
|
72
53
|
if (variant === 'primary') return "".concat(color || _colors.BmPrimaryBlue);
|
|
73
54
|
if (variant === 'secondary') return 'none';
|
|
@@ -77,16 +58,14 @@ var BeemButton = _styledComponents.default.button(_templateObject2 || (_template
|
|
|
77
58
|
if (variant === 'neutral') return "".concat(_colors.BmPrimaryWhite);
|
|
78
59
|
return "".concat(color || _colors.BmPrimaryBlue);
|
|
79
60
|
}
|
|
80
|
-
|
|
81
61
|
if (variant === 'primary') return "".concat(_colors.BmGrey100);
|
|
82
62
|
if (variant === 'secondary') return 'none';
|
|
83
63
|
if (variant === 'tertiary') return 'none';
|
|
84
64
|
return "".concat(_colors.BmGrey100);
|
|
85
65
|
}, function (_ref5) {
|
|
86
66
|
var variant = _ref5.variant,
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
67
|
+
disabled = _ref5.disabled,
|
|
68
|
+
color = _ref5.color;
|
|
90
69
|
if (!disabled) {
|
|
91
70
|
if (variant === 'primary') return "".concat(color || _colors.BmPrimaryBlue);
|
|
92
71
|
if (variant === 'secondary') return "".concat(color || _colors.BmPrimaryBlue);
|
|
@@ -96,105 +75,89 @@ var BeemButton = _styledComponents.default.button(_templateObject2 || (_template
|
|
|
96
75
|
if (variant === 'neutral') return "".concat(_colors.BmGrey400);
|
|
97
76
|
return "".concat(color || _colors.BmPrimaryBlue);
|
|
98
77
|
}
|
|
99
|
-
|
|
100
78
|
if (variant === 'primary') return "".concat(_colors.BmGrey100);
|
|
101
79
|
if (variant === 'secondary') return "".concat(_colors.BmGrey400);
|
|
102
80
|
if (variant === 'tertiary') return 'transparent';
|
|
103
81
|
}, function (_ref6) {
|
|
104
82
|
var variant = _ref6.variant,
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
83
|
+
disabled = _ref6.disabled,
|
|
84
|
+
color = _ref6.color;
|
|
108
85
|
if (!disabled) {
|
|
109
86
|
if (variant === 'primary') return "".concat((0, _polished.darken)(0.1, color || _colors.BmPrimaryBlue));
|
|
110
87
|
if (variant === 'neutral') return "".concat(_colors.BmGrey50);
|
|
111
88
|
if (variant === 'success') return "".concat(_colors.BmSecondaryGreen8);
|
|
112
89
|
if (variant === 'destructive') return "".concat(_colors.BmSecondaryRed8);
|
|
113
|
-
|
|
114
90
|
if (!variant) {
|
|
115
91
|
return "".concat((0, _polished.darken)(0.1, color || _colors.BmPrimaryBlue));
|
|
116
92
|
}
|
|
117
93
|
}
|
|
118
94
|
}, function (_ref7) {
|
|
119
95
|
var variant = _ref7.variant,
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
96
|
+
disabled = _ref7.disabled,
|
|
97
|
+
color = _ref7.color;
|
|
123
98
|
if (!disabled) {
|
|
124
99
|
if (variant === 'secondary') return "".concat((0, _polished.darken)(0.1, color || _colors.BmPrimaryBlue));
|
|
125
100
|
}
|
|
126
|
-
|
|
127
101
|
return 'none';
|
|
128
102
|
}, function (_ref8) {
|
|
129
103
|
var variant = _ref8.variant,
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
104
|
+
disabled = _ref8.disabled,
|
|
105
|
+
color = _ref8.color;
|
|
133
106
|
if (!disabled) {
|
|
134
107
|
if (variant === 'primary') return "".concat((0, _polished.darken)(0.1, color || _colors.BmPrimaryBlue));
|
|
135
108
|
if (variant === 'neutral') return "".concat(_colors.BmGrey100);
|
|
136
109
|
if (variant === 'success') return "".concat(_colors.BmSecondaryDarkGreen);
|
|
137
110
|
if (variant === 'destructive') return "".concat(_colors.BmSecondaryRed);
|
|
138
|
-
|
|
139
111
|
if (!variant) {
|
|
140
112
|
return "".concat((0, _polished.darken)(0.1, color || _colors.BmPrimaryBlue));
|
|
141
113
|
}
|
|
142
114
|
}
|
|
143
115
|
}, function (_ref9) {
|
|
144
116
|
var variant = _ref9.variant,
|
|
145
|
-
|
|
146
|
-
|
|
117
|
+
disabled = _ref9.disabled;
|
|
147
118
|
if (!disabled) {
|
|
148
119
|
if (variant === 'primary' || variant === 'success' || variant === 'destructive') return 'inset 0rem 0.125rem 0.25rem rgba(0, 0, 0, 0.25)';
|
|
149
|
-
|
|
150
120
|
if (!variant) {
|
|
151
121
|
return 'inset 0rem 0.125rem 0.25rem rgba(0, 0, 0, 0.25)';
|
|
152
122
|
}
|
|
153
123
|
}
|
|
154
124
|
}, function (_ref10) {
|
|
155
125
|
var variant = _ref10.variant,
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
126
|
+
disabled = _ref10.disabled,
|
|
127
|
+
color = _ref10.color;
|
|
159
128
|
if (!disabled) {
|
|
160
129
|
if (variant === 'secondary') return "".concat((0, _polished.darken)(0.1, color || _colors.BmPrimaryBlue));
|
|
161
130
|
}
|
|
162
|
-
|
|
163
131
|
return 'none';
|
|
164
132
|
}, ButtonText, function (_ref11) {
|
|
165
133
|
var variant = _ref11.variant,
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
134
|
+
disabled = _ref11.disabled,
|
|
135
|
+
color = _ref11.color;
|
|
169
136
|
if (!disabled) {
|
|
170
137
|
if (variant === 'secondary' || variant === 'tertiary') return "".concat((0, _polished.darken)(0.1, color || _colors.BmPrimaryBlue));
|
|
171
138
|
}
|
|
172
139
|
}, ButtonText, function (_ref12) {
|
|
173
140
|
var variant = _ref12.variant,
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
141
|
+
disabled = _ref12.disabled,
|
|
142
|
+
color = _ref12.color;
|
|
177
143
|
if (!disabled) {
|
|
178
144
|
if (variant === 'secondary' || variant === 'tertiary') return "".concat((0, _polished.darken)(0.1, color || _colors.BmPrimaryBlue));
|
|
179
145
|
}
|
|
180
146
|
});
|
|
181
|
-
|
|
182
147
|
var BmLeftIcon = (0, _styledComponents.default)(_iconStyles.BmButtonIcon)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n margin-right: 0.5rem;\n"])));
|
|
183
148
|
exports.BmLeftIcon = BmLeftIcon;
|
|
184
149
|
var BmRightIcon = (0, _styledComponents.default)(_iconStyles.BmButtonIcon)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n margin-left: 0.5rem;\n"])));
|
|
185
150
|
exports.BmRightIcon = BmRightIcon;
|
|
186
|
-
|
|
187
151
|
var BmButton = function BmButton(props) {
|
|
188
152
|
var variant = props.variant,
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
153
|
+
size = props.size,
|
|
154
|
+
disabled = props.disabled,
|
|
155
|
+
children = props.children,
|
|
156
|
+
leadingIcon = props.leadingIcon,
|
|
157
|
+
trailingIcon = props.trailingIcon,
|
|
158
|
+
color = props.color,
|
|
159
|
+
type = props.type,
|
|
160
|
+
rest = _objectWithoutProperties(props, _excluded);
|
|
198
161
|
return /*#__PURE__*/_react.default.createElement(BeemButton, _extends({
|
|
199
162
|
size: size,
|
|
200
163
|
variant: variant,
|
|
@@ -212,8 +175,8 @@ var BmButton = function BmButton(props) {
|
|
|
212
175
|
variant: variant,
|
|
213
176
|
size: size,
|
|
214
177
|
color: color,
|
|
215
|
-
type: type
|
|
216
|
-
|
|
178
|
+
type: type
|
|
179
|
+
// {...rest}
|
|
217
180
|
}, children), trailingIcon && /*#__PURE__*/_react.default.createElement(BmRightIcon, {
|
|
218
181
|
icon: trailingIcon,
|
|
219
182
|
disabled: disabled,
|
|
@@ -222,7 +185,6 @@ var BmButton = function BmButton(props) {
|
|
|
222
185
|
color: color
|
|
223
186
|
}));
|
|
224
187
|
};
|
|
225
|
-
|
|
226
188
|
exports.BmButton = BmButton;
|
|
227
189
|
BmButton.propTypes = {
|
|
228
190
|
size: _propTypes.default.string,
|
|
@@ -4,19 +4,12 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
|
|
8
7
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
9
|
-
|
|
10
8
|
var _colors = require("../colors");
|
|
11
|
-
|
|
12
9
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4;
|
|
13
|
-
|
|
14
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
-
|
|
16
11
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
17
|
-
|
|
18
12
|
var BmCard = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n background: ", ";\n border: 0.071rem solid ", ";\n border-radius: 0.25rem;\n > * {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 0.5rem;\n }\n"])), _colors.BmPrimaryWhite, _colors.BmGrey400);
|
|
19
|
-
|
|
20
13
|
BmCard.Header = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n padding: 0.5rem 0.5rem 0rem 0.5rem;\n"])));
|
|
21
14
|
BmCard.Body = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n padding: 0rem 0.5rem;\n"])));
|
|
22
15
|
BmCard.Footer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n border-top: 0.071rem solid ", ";\n padding: 0.5rem 0.5rem 0rem 0.5rem;\n"])), _colors.BmGrey400);
|
|
@@ -4,21 +4,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = exports.Example = exports.BasicCardSample = void 0;
|
|
7
|
-
|
|
8
7
|
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
8
|
var _addonKnobs = require("@storybook/addon-knobs");
|
|
11
|
-
|
|
12
9
|
var _cards = _interopRequireDefault(require("./cards"));
|
|
13
|
-
|
|
14
10
|
require("../../../main.scss");
|
|
15
|
-
|
|
16
11
|
var _buttons = require("../Buttons/buttons");
|
|
17
|
-
|
|
18
12
|
var _beem = _interopRequireDefault(require("../../assets/beem.jpeg"));
|
|
19
|
-
|
|
20
13
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
21
|
-
|
|
22
14
|
/* eslint-disable import/no-anonymous-default-export */
|
|
23
15
|
var _default = {
|
|
24
16
|
component: _cards.default,
|
|
@@ -33,15 +25,12 @@ var _default = {
|
|
|
33
25
|
}
|
|
34
26
|
};
|
|
35
27
|
exports.default = _default;
|
|
36
|
-
|
|
37
28
|
var BasicCardSample = function BasicCardSample() {
|
|
38
29
|
return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_cards.default, {
|
|
39
30
|
disabled: (0, _addonKnobs.boolean)('disabled', false)
|
|
40
31
|
}, /*#__PURE__*/_react.default.createElement(_cards.default.Header, null, /*#__PURE__*/_react.default.createElement("h3", null, (0, _addonKnobs.text)('children', 'Card Header'))), /*#__PURE__*/_react.default.createElement(_cards.default.Body, null, "Card Body"), /*#__PURE__*/_react.default.createElement(_cards.default.Footer, null, "Card Footer")));
|
|
41
32
|
};
|
|
42
|
-
|
|
43
33
|
exports.BasicCardSample = BasicCardSample;
|
|
44
|
-
|
|
45
34
|
var Example = function Example() {
|
|
46
35
|
return /*#__PURE__*/_react.default.createElement(_cards.default, null, /*#__PURE__*/_react.default.createElement(_cards.default.Header, null, /*#__PURE__*/_react.default.createElement("h3", null, "Overview")), /*#__PURE__*/_react.default.createElement(_cards.default.Body, null, /*#__PURE__*/_react.default.createElement("img", {
|
|
47
36
|
src: _beem.default,
|
|
@@ -53,5 +42,4 @@ var Example = function Example() {
|
|
|
53
42
|
size: "small"
|
|
54
43
|
}, "View")));
|
|
55
44
|
};
|
|
56
|
-
|
|
57
45
|
exports.Example = Example;
|