@desynova-digital/components 9.0.26 → 9.1.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/_helpers/globals.js +9 -10
- package/_helpers/pagination.js +10 -15
- package/_helpers/story-example.js +16 -39
- package/_helpers/story-helpers.js +15 -14
- package/_helpers/story-stack.js +22 -43
- package/_helpers/uniqueId.js +2 -5
- package/_helpers/utils.js +28 -4
- package/atoms/avatar/avatar.js +19 -42
- package/atoms/avatar/avatar.story.js +25 -58
- package/atoms/avatar/index.js +13 -11
- package/atoms/badge/badge.js +14 -37
- package/atoms/badge/badge.story.js +45 -103
- package/atoms/badge/index.js +12 -10
- package/atoms/button/button.js +85 -161
- package/atoms/button/button.story.js +354 -508
- package/atoms/button/index.js +5 -9
- package/atoms/card/card.js +26 -55
- package/atoms/card/card.story.js +39 -88
- package/atoms/card/index.js +12 -10
- package/atoms/cardStack/cardStack.js +88 -147
- package/atoms/cardStack/cardStack.story.js +106 -210
- package/atoms/cardStack/index.js +12 -10
- package/atoms/cardV2/cardV2.js +57 -106
- package/atoms/cardV2/cardV2.story.js +184 -232
- package/atoms/cardV2/content.js +154 -256
- package/atoms/cardV2/index.js +4 -8
- package/atoms/cardV2/thumbnail.js +138 -208
- package/atoms/cardV2/timeline.js +167 -123
- package/atoms/checkbox/checkbox.js +85 -157
- package/atoms/checkbox/checkbox.story.js +237 -365
- package/atoms/checkbox/index.js +4 -9
- package/atoms/customSelect/customSelect.js +136 -215
- package/atoms/customSelect/customSelect.story.js +745 -851
- package/atoms/customSelect/index.js +4 -8
- package/atoms/datePicker/datePicker.js +299 -431
- package/atoms/datePicker/datePicker.story.js +453 -501
- package/atoms/datePicker/index.js +4 -8
- package/atoms/dateTime/dateTime.js +3 -6
- package/atoms/dateTime/dateTime.story.js +17 -63
- package/atoms/dateTime/index.js +5 -9
- package/atoms/draftInputText/draftInputText.js +121 -189
- package/atoms/draftInputText/draftInputText.story.js +200 -249
- package/atoms/draftInputText/index.js +5 -9
- package/atoms/dropdown/dropdown.js +38 -66
- package/atoms/dropdown/dropdown.story.js +102 -262
- package/atoms/dropdown/index.js +4 -8
- package/atoms/dropdownList/dropdownList.js +78 -108
- package/atoms/dropdownList/dropdownList.story.js +1546 -1621
- package/atoms/dropdownList/index.js +4 -8
- package/atoms/graphs/barGraph/barGraph.js +95 -146
- package/atoms/graphs/barGraph/barGraph.story.js +65 -87
- package/atoms/graphs/barGraph/index.js +4 -8
- package/atoms/graphs/circleDonut/circleDonut.js +177 -229
- package/atoms/graphs/circleDonut/circleDonut.story.js +328 -394
- package/atoms/graphs/circleDonut/index.js +5 -9
- package/atoms/graphs/circleGraph/circleGraph.js +60 -90
- package/atoms/graphs/circleGraph/circleGraph.story.js +36 -54
- package/atoms/graphs/circleGraph/index.js +4 -8
- package/atoms/graphs/circleNested/circleNested.js +216 -262
- package/atoms/graphs/circleNested/circleNested.story.js +91 -116
- package/atoms/graphs/circleNested/index.js +5 -9
- package/atoms/graphs/pieChart/index.js +4 -8
- package/atoms/graphs/pieChart/pieChart.js +162 -191
- package/atoms/graphs/pieChart/pieChart.story.js +147 -176
- package/atoms/graphs/verticalBarGraph/index.js +5 -9
- package/atoms/graphs/verticalBarGraph/verticalBarGraph.js +75 -98
- package/atoms/graphs/verticalBarGraph/verticalBarGraph.story.js +26 -45
- package/atoms/icon/icon.js +41 -72
- package/atoms/icon/icon.story.js +831 -260
- package/atoms/icon/index.js +19 -12
- package/atoms/image/image.js +18 -32
- package/atoms/image/image.story.js +10 -19
- package/atoms/image/index.js +4 -8
- package/atoms/inputText/index.js +4 -8
- package/atoms/inputText/inputText.js +86 -131
- package/atoms/inputText/inputText.story.js +191 -255
- package/atoms/label/index.js +4 -8
- package/atoms/label/label.js +25 -50
- package/atoms/label/label.story.js +42 -83
- package/atoms/loader/CircleLoader.js +29 -63
- package/atoms/loader/ShimmerComponent/CollabShimmerCard.js +39 -50
- package/atoms/loader/ShimmerComponent/CollabShimmerCardTray.js +41 -42
- package/atoms/loader/ShimmerComponent/FiltersShimmer.js +30 -30
- package/atoms/loader/ShimmerComponent/GraphDetailShimmer.js +21 -34
- package/atoms/loader/ShimmerComponent/GraphTitleShimmer.js +30 -34
- package/atoms/loader/ShimmerComponent/GraphsComponentShimmer.js +23 -32
- package/atoms/loader/ShimmerComponent/Shimmer.js +24 -32
- package/atoms/loader/ThreeDotLoader.js +14 -29
- package/atoms/loader/index.js +13 -11
- package/atoms/loader/loader.js +34 -58
- package/atoms/loader/loader.story.js +48 -52
- package/atoms/loader/spinningLoader.js +23 -34
- package/atoms/popup/index.js +5 -9
- package/atoms/popup/popup.js +123 -208
- package/atoms/popup/popup.story.js +97 -131
- package/atoms/radio/index.js +18 -11
- package/atoms/radio/radio.js +58 -112
- package/atoms/radio/radio.story.js +197 -420
- package/atoms/select/index.js +4 -8
- package/atoms/select/select.js +48 -86
- package/atoms/sideBar/index.js +5 -9
- package/atoms/sideBar/sidebar.js +89 -140
- package/atoms/switch/index.js +4 -8
- package/atoms/switch/switch.js +56 -86
- package/atoms/switch/switch.story.js +268 -415
- package/atoms/tag/index.js +12 -10
- package/atoms/tag/tag.js +29 -63
- package/atoms/tag/tag.story.js +135 -209
- package/atoms/textarea/index.js +5 -9
- package/atoms/textarea/textarea.js +55 -99
- package/atoms/textarea/textarea.story.js +48 -41
- package/atoms/thematicBreak/index.js +12 -10
- package/atoms/thematicBreak/thematicBreak.js +20 -38
- package/atoms/thematicBreak/thematicBreak.story.js +25 -37
- package/atoms/timeCodeInput/index.js +4 -8
- package/atoms/timeCodeInput/timCodeInput.story.js +21 -35
- package/atoms/timeCodeInput/timeCodeInput.js +33 -51
- package/atoms/timer/index.js +5 -9
- package/atoms/timer/timer.js +57 -108
- package/atoms/timer/timer.story.js +13 -26
- package/atoms/toast/index.js +5 -9
- package/atoms/toast/toast.js +81 -116
- package/atoms/toast/toast.story.js +50 -76
- package/atoms/videoCard/index.js +12 -10
- package/atoms/videoCard/videoCard.js +265 -447
- package/atoms/videoCard/videoCard.story.js +495 -710
- package/components.js +411 -294
- package/index.js +350 -61
- package/molecules/carousel/carousel.js +121 -207
- package/molecules/carousel/carousel.story.js +240 -223
- package/molecules/carousel/index.js +5 -9
- package/molecules/errorScreen/CollabErrorScreen.js +35 -66
- package/molecules/errorScreen/TableErrorScreen.js +109 -102
- package/molecules/errorScreen/TableErrorScreen.jsx +7 -6
- package/molecules/errorScreen/errorScreen.js +41 -94
- package/molecules/filter/constants.js +1 -0
- package/molecules/filter/filter.js +378 -562
- package/molecules/filter/filter.story.js +79 -104
- package/molecules/filter/index.js +5 -9
- package/molecules/graphCard/graphCard.js +97 -193
- package/molecules/graphCard/graphCard.story.js +159 -191
- package/molecules/graphCard/index.js +4 -8
- package/molecules/graphCard/loader.js +28 -68
- package/molecules/graphDetailCard/graphDetailCard.js +115 -183
- package/molecules/graphDetailCard/graphDetailCard.story.js +218 -254
- package/molecules/graphDetailCard/index.js +5 -9
- package/molecules/pageHeader/index.js +12 -10
- package/molecules/pageHeader/pageHeader.js +38 -79
- package/molecules/pageHeader/pageHeader.story.js +34 -55
- package/molecules/pagination/index.js +4 -8
- package/molecules/pagination/pagination.js +126 -202
- package/molecules/pagination/pagination.story.js +40 -52
- package/molecules/richTextInput/RichTextInput.js +354 -0
- package/molecules/richTextInput/RichTextInput.story.js +50 -0
- package/molecules/richTextInput/index.js +9 -0
- package/molecules/table/index.js +4 -8
- package/molecules/table/table-column.js +10 -16
- package/molecules/table/table-header.js +31 -72
- package/molecules/table/table.js +743 -1075
- package/molecules/table/table.story.js +274 -304
- package/molecules/tabs/index.js +4 -8
- package/molecules/tabs/tabs.js +112 -184
- package/molecules/tabs/tabs.story.js +66 -133
- package/molecules/videoCardList/index.js +4 -8
- package/molecules/videoCardList/videoCardList.js +24 -41
- package/molecules/videoCardList/videoCardList.story.js +449 -664
- package/molecules/videoPlayer/index.js +4 -8
- package/molecules/videoPlayer/videoPlayer.js +1019 -1097
- package/molecules/videoPlayer/videoPlayer.story.js +10 -21
- package/package.json +2 -2
package/atoms/toast/toast.js
CHANGED
|
@@ -1,85 +1,63 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
2
|
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
3
5
|
Object.defineProperty(exports, "__esModule", {
|
|
4
6
|
value: true
|
|
5
7
|
});
|
|
6
|
-
|
|
7
|
-
var
|
|
8
|
-
|
|
9
|
-
var
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
var
|
|
13
|
-
|
|
14
|
-
var
|
|
15
|
-
|
|
16
|
-
var
|
|
17
|
-
|
|
18
|
-
var
|
|
19
|
-
|
|
20
|
-
var
|
|
21
|
-
|
|
22
|
-
var
|
|
23
|
-
|
|
24
|
-
var _icon = require('../icon');
|
|
25
|
-
|
|
26
|
-
var _icon2 = _interopRequireDefault(_icon);
|
|
27
|
-
|
|
28
|
-
var _tokens = require('../../../tokens');
|
|
29
|
-
|
|
30
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
31
|
-
|
|
32
|
-
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
33
|
-
|
|
34
|
-
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
|
|
35
|
-
|
|
36
|
-
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
|
|
37
|
-
|
|
38
|
-
function _taggedTemplateLiteral(strings, raw) { return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
39
|
-
|
|
8
|
+
exports["default"] = void 0;
|
|
9
|
+
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
10
|
+
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
11
|
+
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
|
|
12
|
+
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
|
|
13
|
+
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
14
|
+
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
15
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
16
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
17
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
18
|
+
var _icon = _interopRequireDefault(require("../icon"));
|
|
19
|
+
var _tokens = require("../../../tokens");
|
|
20
|
+
var _templateObject, _templateObject2;
|
|
21
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
22
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
23
|
+
function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
|
|
24
|
+
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
|
|
40
25
|
var propTypes = {
|
|
41
|
-
showToast:
|
|
42
|
-
type:
|
|
43
|
-
text:
|
|
44
|
-
direction:
|
|
45
|
-
icon:
|
|
26
|
+
showToast: _propTypes["default"].bool,
|
|
27
|
+
type: _propTypes["default"].string,
|
|
28
|
+
text: _propTypes["default"].instanceOf(Object),
|
|
29
|
+
direction: _propTypes["default"].string,
|
|
30
|
+
icon: _propTypes["default"].string
|
|
46
31
|
};
|
|
47
|
-
|
|
48
|
-
var
|
|
49
|
-
|
|
50
|
-
var ToastEle = _styledComponents2.default.div(_templateObject2, function (props) {
|
|
32
|
+
var ToastGroupEle = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n position: fixed;\n width: 100%;\n right: 0px;\n top: 0px;\n z-index: 1000;\n text-align: center;\n height: 1px;\n"])));
|
|
33
|
+
var ToastEle = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n &.toast-box {\n background: #fff;\n padding: 10px;\n margin-bottom: 10px;\n border-radius: 5px;\n text-align: left;\n text-transform: capitalize;\n font-family: SFUIText-Regular;\n color: #333;\n box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.5);\n display: flex;\n align-items: center;\n cursor: default;\n\n width: 260px;\n height: 80px;\n border-radius: 2px;\n background-image: linear-gradient(to right, #00c8e7, #00e6b9);\n\n animation-name: ", ";\n animation-duration: 7s;\n\n position: absolute;\n\n .icon-box {\n margin-right: 10px;\n border-radius: 50%;\n background: rgba(255, 255, 255, 0.1411764705882353);\n padding: 5px;\n }\n .head {\n font-family: SFUIText-Medium;\n font-size: 14px;\n padding: 3px 0px;\n }\n .body {\n font-family: SFUIText-Regular;\n font-size: 12px;\n padding: 3px 0px;\n }\n\n &.right {\n top: 0px;\n right: -260px;\n }\n &.left {\n top: 0px;\n left: -260px;\n }\n &.top {\n top: -85px;\n }\n\n &.success {\n background: ", ";\n background-image: linear-gradient(to right, #00c8e7, #00e6b9);\n color: #fff;\n }\n &.error {\n background: ", ";\n background-image: linear-gradient(to right, #de564a, #cc5b30);\n color: #fff;\n }\n }\n\n /* Standard syntax */\n @keyframes toast-top {\n 0% {\n top: -85px;\n }\n 15% {\n top: 20px;\n }\n 85% {\n top: 20px;\n }\n 100% {\n top: -85px;\n }\n }\n @keyframes toast-right {\n 0% {\n right: -260px;\n }\n 15% {\n right: 0px;\n }\n 85% {\n right: 0px;\n }\n 100% {\n right: -260px;\n }\n }\n @keyframes toast-left {\n 0% {\n left: -260px;\n }\n 15% {\n left: 0px;\n }\n 85% {\n left: 0px;\n }\n 100% {\n left: -260px;\n }\n }\n"])), function (props) {
|
|
51
34
|
return 'toast-' + props.toastDirection;
|
|
52
35
|
}, function (props) {
|
|
53
36
|
return _tokens.colors[props.theme].toast.themeColor;
|
|
54
37
|
}, function (props) {
|
|
55
38
|
return _tokens.colors[props.theme].toast.themeColor;
|
|
56
39
|
});
|
|
57
|
-
|
|
58
|
-
var Toast = function (_Component) {
|
|
59
|
-
_inherits(Toast, _Component);
|
|
60
|
-
|
|
40
|
+
var Toast = exports["default"] = /*#__PURE__*/function (_Component) {
|
|
61
41
|
function Toast(props) {
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
42
|
+
var _this;
|
|
43
|
+
(0, _classCallCheck2["default"])(this, Toast);
|
|
44
|
+
_this = _callSuper(this, Toast, [props]);
|
|
66
45
|
_this.state = {
|
|
67
46
|
show: false
|
|
68
47
|
};
|
|
69
48
|
return _this;
|
|
70
49
|
}
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
key:
|
|
50
|
+
(0, _inherits2["default"])(Toast, _Component);
|
|
51
|
+
return (0, _createClass2["default"])(Toast, [{
|
|
52
|
+
key: "componentDidMount",
|
|
74
53
|
value: function componentDidMount() {
|
|
75
|
-
var
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
54
|
+
var _this$props = this.props,
|
|
55
|
+
showToast = _this$props.showToast,
|
|
56
|
+
type = _this$props.type,
|
|
57
|
+
text = _this$props.text,
|
|
58
|
+
direction = _this$props.direction,
|
|
59
|
+
icon = _this$props.icon,
|
|
60
|
+
theme = _this$props.theme;
|
|
83
61
|
var self = this;
|
|
84
62
|
if (showToast && (text.head || text.body)) {
|
|
85
63
|
this.setState({
|
|
@@ -99,14 +77,13 @@ var Toast = function (_Component) {
|
|
|
99
77
|
}
|
|
100
78
|
}
|
|
101
79
|
}, {
|
|
102
|
-
key:
|
|
80
|
+
key: "UNSAFE_componentWillReceiveProps",
|
|
103
81
|
value: function UNSAFE_componentWillReceiveProps(newProps) {
|
|
104
82
|
var showToast = newProps.showToast,
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
83
|
+
text = newProps.text,
|
|
84
|
+
type = newProps.type,
|
|
85
|
+
icon = newProps.icon,
|
|
86
|
+
direction = newProps.direction;
|
|
110
87
|
var self = this;
|
|
111
88
|
if (text !== self.props.text) {
|
|
112
89
|
if (showToast && (text.head || text.body)) {
|
|
@@ -128,7 +105,7 @@ var Toast = function (_Component) {
|
|
|
128
105
|
}
|
|
129
106
|
}
|
|
130
107
|
}, {
|
|
131
|
-
key:
|
|
108
|
+
key: "iconFor",
|
|
132
109
|
value: function iconFor(key) {
|
|
133
110
|
switch (key) {
|
|
134
111
|
case 'success':
|
|
@@ -146,59 +123,47 @@ var Toast = function (_Component) {
|
|
|
146
123
|
}
|
|
147
124
|
}
|
|
148
125
|
}, {
|
|
149
|
-
key:
|
|
126
|
+
key: "render",
|
|
150
127
|
value: function render() {
|
|
151
|
-
var
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
128
|
+
var _this$state = this.state,
|
|
129
|
+
show = _this$state.show,
|
|
130
|
+
toastText = _this$state.toastText,
|
|
131
|
+
type = _this$state.type,
|
|
132
|
+
toastIcon = _this$state.toastIcon,
|
|
133
|
+
toastDirection = _this$state.toastDirection;
|
|
158
134
|
console.log(this.props.theme, 'HELLO');
|
|
159
|
-
return show ?
|
|
160
|
-
|
|
161
|
-
{
|
|
162
|
-
|
|
163
|
-
onClick: function onClick() {
|
|
164
|
-
document.querySelector('.toast-box').style.display = 'none';
|
|
165
|
-
},
|
|
166
|
-
className: 'toast-box ' + type + ' ' + toastDirection,
|
|
167
|
-
toastDirection: toastDirection
|
|
135
|
+
return show ? /*#__PURE__*/_react["default"].createElement(ToastEle, {
|
|
136
|
+
theme: this.props.theme,
|
|
137
|
+
onClick: function onClick() {
|
|
138
|
+
document.querySelector('.toast-box').style.display = 'none';
|
|
168
139
|
},
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
140
|
+
className: 'toast-box ' + type + ' ' + toastDirection,
|
|
141
|
+
toastDirection: toastDirection
|
|
142
|
+
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
143
|
+
className: "icon-box"
|
|
144
|
+
}, toastIcon ? /*#__PURE__*/_react["default"].createElement(_icon["default"], {
|
|
145
|
+
name: toastIcon,
|
|
146
|
+
width: 18,
|
|
147
|
+
height: 18,
|
|
148
|
+
color: "#fff"
|
|
149
|
+
}) : this.iconFor(type) ? /*#__PURE__*/_react["default"].createElement(_icon["default"], {
|
|
150
|
+
name: this.iconFor(type),
|
|
151
|
+
width: 18,
|
|
152
|
+
height: 18,
|
|
153
|
+
color: "#fff"
|
|
154
|
+
}) : null), /*#__PURE__*/_react["default"].createElement("div", {
|
|
155
|
+
className: "content"
|
|
156
|
+
}, toastText.head && toastText.head.length > 0 ? /*#__PURE__*/_react["default"].createElement("div", {
|
|
157
|
+
className: "head"
|
|
158
|
+
}, toastText.head) : null, toastText.body && toastText.body.length > 0 ? /*#__PURE__*/_react["default"].createElement("div", {
|
|
159
|
+
className: "body"
|
|
160
|
+
}, toastText.body) : null)) : null;
|
|
189
161
|
}
|
|
190
162
|
}]);
|
|
191
|
-
|
|
192
|
-
return Toast;
|
|
193
|
-
}(_react.Component);
|
|
194
|
-
|
|
195
|
-
//Toast.propTypes = propTypes;
|
|
196
|
-
|
|
197
|
-
exports.default = Toast;
|
|
163
|
+
}(_react.Component); //Toast.propTypes = propTypes;
|
|
198
164
|
Toast.propTypes = {
|
|
199
|
-
theme:
|
|
165
|
+
theme: _propTypes["default"].oneOf(['light', 'dark', 'nexc'])
|
|
200
166
|
};
|
|
201
|
-
|
|
202
167
|
Toast.defaultProps = {
|
|
203
168
|
theme: 'light'
|
|
204
169
|
};
|
|
@@ -1,79 +1,53 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
var
|
|
4
|
-
|
|
5
|
-
var _react2 =
|
|
6
|
-
|
|
7
|
-
var
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
_storyHelpers.Stack,
|
|
23
|
-
null,
|
|
24
|
-
_react2.default.createElement(_toast2.default, {
|
|
25
|
-
showToast: true,
|
|
26
|
-
type: 'error',
|
|
27
|
-
text: {
|
|
28
|
-
head: 'Access Request Sent',
|
|
29
|
-
body: 'Please check your email for details'
|
|
30
|
-
},
|
|
31
|
-
direction: 'right',
|
|
32
|
-
icon: 'dashboard'
|
|
33
|
-
})
|
|
34
|
-
)
|
|
35
|
-
);
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _react = _interopRequireDefault(require("react"));
|
|
5
|
+
var _react2 = require("@storybook/react");
|
|
6
|
+
var _storyHelpers = require("../../_helpers/story-helpers");
|
|
7
|
+
var _toast = _interopRequireDefault(require("./toast"));
|
|
8
|
+
(0, _react2.storiesOf)('Toast').add('right-error', function () {
|
|
9
|
+
return /*#__PURE__*/_react["default"].createElement(_storyHelpers.Example, {
|
|
10
|
+
title: "appearance-dark",
|
|
11
|
+
background: "dark"
|
|
12
|
+
}, /*#__PURE__*/_react["default"].createElement(_storyHelpers.Stack, null, /*#__PURE__*/_react["default"].createElement(_toast["default"], {
|
|
13
|
+
showToast: true,
|
|
14
|
+
type: 'error',
|
|
15
|
+
text: {
|
|
16
|
+
head: 'Access Request Sent',
|
|
17
|
+
body: 'Please check your email for details'
|
|
18
|
+
},
|
|
19
|
+
direction: 'right',
|
|
20
|
+
icon: 'dashboard'
|
|
21
|
+
})));
|
|
36
22
|
});
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
},
|
|
52
|
-
direction: 'left',
|
|
53
|
-
icon: 'dashboard'
|
|
54
|
-
})
|
|
55
|
-
)
|
|
56
|
-
);
|
|
23
|
+
(0, _react2.storiesOf)('Toast').add('left-success', function () {
|
|
24
|
+
return /*#__PURE__*/_react["default"].createElement(_storyHelpers.Example, {
|
|
25
|
+
title: "appearance-dark",
|
|
26
|
+
background: "dark"
|
|
27
|
+
}, /*#__PURE__*/_react["default"].createElement(_storyHelpers.Stack, null, /*#__PURE__*/_react["default"].createElement(_toast["default"], {
|
|
28
|
+
showToast: true,
|
|
29
|
+
type: 'success',
|
|
30
|
+
text: {
|
|
31
|
+
head: 'Access Request Sent',
|
|
32
|
+
body: 'Please check your email for details'
|
|
33
|
+
},
|
|
34
|
+
direction: 'left',
|
|
35
|
+
icon: 'dashboard'
|
|
36
|
+
})));
|
|
57
37
|
});
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
},
|
|
74
|
-
direction: 'left',
|
|
75
|
-
icon: 'dashboard'
|
|
76
|
-
})
|
|
77
|
-
)
|
|
78
|
-
);
|
|
38
|
+
(0, _react2.storiesOf)('Toast').add('left-success nexc', function () {
|
|
39
|
+
return /*#__PURE__*/_react["default"].createElement(_storyHelpers.Example, {
|
|
40
|
+
title: "appearance-dark",
|
|
41
|
+
background: "dark"
|
|
42
|
+
}, /*#__PURE__*/_react["default"].createElement(_storyHelpers.Stack, null, /*#__PURE__*/_react["default"].createElement(_toast["default"], {
|
|
43
|
+
theme: "nexc",
|
|
44
|
+
showToast: true,
|
|
45
|
+
type: 'success',
|
|
46
|
+
text: {
|
|
47
|
+
head: 'Access Request Sent',
|
|
48
|
+
body: 'Please check your email for details'
|
|
49
|
+
},
|
|
50
|
+
direction: 'left',
|
|
51
|
+
icon: 'dashboard'
|
|
52
|
+
})));
|
|
79
53
|
});
|
package/atoms/videoCard/index.js
CHANGED
|
@@ -1,15 +1,17 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
3
4
|
Object.defineProperty(exports, "__esModule", {
|
|
4
5
|
value: true
|
|
5
6
|
});
|
|
6
|
-
exports
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
7
|
+
Object.defineProperty(exports, "StyledCard", {
|
|
8
|
+
enumerable: true,
|
|
9
|
+
get: function get() {
|
|
10
|
+
return _videoCard.StyledCard;
|
|
11
|
+
}
|
|
12
|
+
});
|
|
13
|
+
exports["default"] = void 0;
|
|
14
|
+
var _videoCard = _interopRequireWildcard(require("./videoCard"));
|
|
15
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
16
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
17
|
+
var _default = exports["default"] = _videoCard["default"];
|