@xaypay/tui 0.0.62 → 0.0.64
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/index.es.js +443 -81
- package/dist/index.js +445 -80
- package/package.json +1 -1
- package/src/assets/icons/toaster-close.svg +3 -0
- package/src/assets/icons/toaster-error.svg +3 -0
- package/src/assets/icons/toaster-info.svg +3 -0
- package/src/assets/icons/toaster-success.svg +3 -0
- package/src/assets/icons/toaster-warning.svg +3 -0
- package/src/components/autocomplate/index.js +3 -0
- package/src/components/file/index.js +9 -6
- package/src/components/icon/ToasterClose.js +19 -0
- package/src/components/icon/ToasterError.js +19 -0
- package/src/components/icon/ToasterInfo.js +19 -0
- package/src/components/icon/ToasterSuccess.js +19 -0
- package/src/components/icon/ToasterWarning.js +19 -0
- package/src/components/icon/index.js +5 -0
- package/src/components/input/index.js +16 -3
- package/src/components/input/input.stories.js +5 -0
- package/src/components/select/index.js +18 -10
- package/src/components/select/select.module.css +2 -2
- package/src/components/toaster/Toast.js +181 -0
- package/src/components/toaster/index.js +129 -0
- package/src/components/toaster/toaster.module.css +188 -0
- package/src/components/toaster/toaster.stories.js +378 -0
- package/src/index.js +2 -1
- package/src/stories/configuration.stories.mdx +38 -0
- package/src/stories/static/select-usage.png +0 -0
- package/src/stories/static/toaster-container-usage.png +0 -0
- package/src/stories/static/toaster-usage.png +0 -0
- package/src/stories/usage.stories.mdx +16 -1
package/dist/index.js
CHANGED
|
@@ -6,6 +6,7 @@ var React = require('react');
|
|
|
6
6
|
var PropTypes = require('prop-types');
|
|
7
7
|
var classnames = require('classnames');
|
|
8
8
|
var styled = require('styled-components');
|
|
9
|
+
var ReactDOM = require('react-dom');
|
|
9
10
|
|
|
10
11
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
11
12
|
|
|
@@ -32,6 +33,7 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
|
32
33
|
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
33
34
|
var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
|
|
34
35
|
var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
|
|
36
|
+
var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
|
|
35
37
|
|
|
36
38
|
function styleInject(css, ref) {
|
|
37
39
|
if ( ref === void 0 ) ref = {};
|
|
@@ -60,12 +62,12 @@ function styleInject(css, ref) {
|
|
|
60
62
|
}
|
|
61
63
|
}
|
|
62
64
|
|
|
63
|
-
var css_248z$
|
|
64
|
-
var styles$
|
|
65
|
-
styleInject(css_248z$
|
|
65
|
+
var css_248z$d = ".file-module_file-form__l13d5{align-items:center;background:#fbfbfb;border:2px dashed;border-radius:6px;cursor:pointer;display:flex;flex-direction:column;height:190px;justify-content:space-between;overflow:hidden;padding:4px 0;position:relative;width:100%}.file-module_file-form-wrap__qY--B:before{background:rgba(60,57,62,.4);border-radius:6px;content:\"\";height:100%;left:0;opacity:0;pointer-events:none;position:absolute;top:0;transition:opacity .24s;width:100%;z-index:1}.file-module_file-form-wrap__qY--B.file-module_active__L1gPt:hover:before{opacity:1;pointer-events:unset}.file-module_file-form-wrap__qY--B.file-module_active__L1gPt:hover .file-module_delete-upload-icon__PWN66{opacity:1}.file-module_file-form-inner-upload__tq3Dn{align-items:center;display:flex;flex-direction:column;justify-content:space-between;padding-bottom:16px;padding-top:48px}.file-module_file-form-inner-upload__tq3Dn>img{display:block;margin-bottom:14px}.file-module_upload-info__a8GFs{margin-bottom:40px;max-width:150px;text-align:center}.file-module_upload-info-txt__l11uN{color:#0da574}.file-module_file-form__l13d5.file-module_default__t7KU0{border-color:#d1d1d1}.file-module_file-form__l13d5.file-module_error__H-M4Z{border-color:#e00!important}.file-module_file-form__l13d5.file-module_accept__WTW6V{border-color:#00236a}.file-module_delete-upload-icon__PWN66{align-items:center;background:#fff;border-radius:6px;cursor:pointer;display:flex;height:26px;justify-content:center;opacity:0;position:absolute;right:10px;top:10px;transition:opacity .24s;width:26px;z-index:11}.file-module_delete-upload-icon__PWN66>i{color:#00236a;font-size:16px}.file-module_upload-file-content__QHMjn{align-items:center;display:flex;height:100%;justify-content:center;max-height:190px;overflow:hidden;position:relative;width:100%}.file-module_upload-file-content__QHMjn>img{bottom:0;display:block;height:190px;left:0;margin:auto;max-height:190px;position:absolute;right:0;top:0;width:auto}.file-module_file-form-title__zWTSB{margin-bottom:10px;max-width:390px;word-break:break-all}.file-module_file-form-wrap__qY--B{position:relative;transform:translateZ(0)}";
|
|
66
|
+
var styles$c = {"file-form-wrap":"file-module_file-form-wrap__qY--B","file-form":"file-module_file-form__l13d5","active":"file-module_active__L1gPt","delete-upload-icon":"file-module_delete-upload-icon__PWN66","file-form-inner-upload":"file-module_file-form-inner-upload__tq3Dn","upload-info":"file-module_upload-info__a8GFs","upload-info-txt":"file-module_upload-info-txt__l11uN","default":"file-module_default__t7KU0","error":"file-module_error__H-M4Z","accept":"file-module_accept__WTW6V","upload-file-content":"file-module_upload-file-content__QHMjn","file-form-title":"file-module_file-form-title__zWTSB"};
|
|
67
|
+
styleInject(css_248z$d);
|
|
66
68
|
|
|
67
|
-
var css_248z$
|
|
68
|
-
styleInject(css_248z$
|
|
69
|
+
var css_248z$c = "";
|
|
70
|
+
styleInject(css_248z$c);
|
|
69
71
|
|
|
70
72
|
const File = ({
|
|
71
73
|
name,
|
|
@@ -128,16 +130,16 @@ const File = ({
|
|
|
128
130
|
document.querySelector(`.${name}`).value = "";
|
|
129
131
|
};
|
|
130
132
|
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
131
|
-
className: `${styles$
|
|
133
|
+
className: `${styles$c['file-form-title']} ile-form-title-rem`
|
|
132
134
|
}, label, " ", required && /*#__PURE__*/React__default["default"].createElement("sup", {
|
|
133
135
|
style: {
|
|
134
136
|
color: "#ee0000"
|
|
135
137
|
}
|
|
136
138
|
}, "*")), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
137
|
-
className: classnames__default["default"](`${styles$
|
|
139
|
+
className: classnames__default["default"](`${styles$c['file-form-wrap']} file-form-wrap-rem`, image ? styles$c['active'] : '')
|
|
138
140
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
139
141
|
onChange: e => console.log(e),
|
|
140
|
-
className: `${styles$
|
|
142
|
+
className: `${styles$c['file-form']} file-form-rem ${errorMessage ? styles$c['error'] : ''}`,
|
|
141
143
|
onClick: () => document.querySelector(`.${name}`).click()
|
|
142
144
|
}, /*#__PURE__*/React__default["default"].createElement("input", {
|
|
143
145
|
hidden: true,
|
|
@@ -146,23 +148,23 @@ const File = ({
|
|
|
146
148
|
disabled: disabled,
|
|
147
149
|
onChange: e => handleCheckFile(e)
|
|
148
150
|
}), image ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
149
|
-
className: `${styles$
|
|
151
|
+
className: `${styles$c['upload-file-content']} upload-file-content-rem`
|
|
150
152
|
}, /*#__PURE__*/React__default["default"].createElement("img", {
|
|
151
153
|
src: image,
|
|
152
154
|
alt: fileName
|
|
153
155
|
})) : /*#__PURE__*/React__default["default"].createElement("div", {
|
|
154
|
-
className: `${styles$
|
|
156
|
+
className: `${styles$c['file-form-inner-upload']} ile-form-inner-upload-rem`
|
|
155
157
|
}, /*#__PURE__*/React__default["default"].createElement("img", {
|
|
156
158
|
src: "../../assets/upload.svg",
|
|
157
159
|
alt: ""
|
|
158
160
|
}), /*#__PURE__*/React__default["default"].createElement("span", {
|
|
159
|
-
className: `${styles$
|
|
161
|
+
className: `${styles$c['upload-info']} upload-info-rem`
|
|
160
162
|
}, /*#__PURE__*/React__default["default"].createElement("span", {
|
|
161
|
-
className: `${styles$
|
|
163
|
+
className: `${styles$c['upload-info-txt']} upload-info-txt-rem`
|
|
162
164
|
}, "\u0532\u0565\u057C\u0576\u0565\u056C")), /*#__PURE__*/React__default["default"].createElement("span", {
|
|
163
|
-
className: `${styles$
|
|
164
|
-
}, "\u0531\u057C\u0561\u057E\u0565\u056C\u0561\u0563\u0578\u0582\u0575\u0576\u0568 ", maxSize, "\u0544\u0532 ( ", fileExtensions.toString().split(',').join(', '), " )"))), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
165
|
-
className: `${styles$
|
|
165
|
+
className: `${styles$c['upload-info-size']} upload-info-size-rem`
|
|
166
|
+
}, "\u0531\u057C\u0561\u057E\u0565\u056C\u0561\u0563\u0578\u0582\u0575\u0576\u0568 ", maxSize, "\u0544\u0532 ( ", fileExtensions.toString().split(',').join(', '), " )"))), !disabled && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
167
|
+
className: `${styles$c['delete-upload-icon']} delete-upload-icon-rem`,
|
|
166
168
|
onClick: handleRemoveFile
|
|
167
169
|
}, /*#__PURE__*/React__default["default"].createElement("i", {
|
|
168
170
|
className: "icon-delete"
|
|
@@ -189,9 +191,9 @@ File.defaultProps = {
|
|
|
189
191
|
fileExtensions: ['jpg', 'jpeg', 'png', 'pdf']
|
|
190
192
|
};
|
|
191
193
|
|
|
192
|
-
var css_248z$
|
|
193
|
-
var styles$
|
|
194
|
-
styleInject(css_248z$
|
|
194
|
+
var css_248z$b = ".table-module_table-wrap__KKAnM{background:#fff;border-radius:14px 14px 0 0;box-shadow:0 10px 30px rgba(0,35,106,.06);overflow:hidden;width:100%}.table-module_table-wrap__KKAnM:not(:first-child){margin-top:30px}.table-module_table-bottom-inner__0Pus0 .table-module_table-items__UpFg2:first-child,.table-module_table-top__tfEKM .table-module_table-items__UpFg2:first-child{flex:0 0 auto;width:60px}.table-module_table-bottom-inner__0Pus0 .table-module_table-items__UpFg2:nth-child(2),.table-module_table-top__tfEKM .table-module_table-items__UpFg2:nth-child(2){flex:0 0 auto;width:120px}.table-module_table-bottom-inner__0Pus0 .table-module_table-items__UpFg2:nth-child(3),.table-module_table-top__tfEKM .table-module_table-items__UpFg2:nth-child(3){flex:0 0 auto;width:170px}.table-module_table-bottom-inner__0Pus0 .table-module_table-items__UpFg2:nth-child(4),.table-module_table-top__tfEKM .table-module_table-items__UpFg2:nth-child(4){flex:0 0 auto;width:126px}.table-module_table-bottom-inner__0Pus0 .table-module_table-items__UpFg2:nth-child(5),.table-module_table-bottom-inner__0Pus0 .table-module_table-items__UpFg2:nth-child(6),.table-module_table-bottom-inner__0Pus0 .table-module_table-items__UpFg2:nth-child(8),.table-module_table-top__tfEKM .table-module_table-items__UpFg2:nth-child(5),.table-module_table-top__tfEKM .table-module_table-items__UpFg2:nth-child(6),.table-module_table-top__tfEKM .table-module_table-items__UpFg2:nth-child(8){flex:0 0 auto;width:100px}.table-module_table-bottom-inner__0Pus0 .table-module_table-items__UpFg2:last-child,.table-module_table-top__tfEKM .table-module_table-items__UpFg2:last-child{flex:0 0 auto;width:104px}.table-module_table-top__tfEKM{background:#00236a;height:44px;width:100%}.table-module_table-top__tfEKM .table-module_table-items__UpFg2{align-items:center;color:#fff;display:flex;flex:1 1;font-size:15px;justify-content:center;line-height:17px;text-align:center}.table-module_table-bottom-inner__0Pus0{background:#fff;min-height:40px;width:100%}.table-module_table-bottom-inner__0Pus0 .table-module_table-items__UpFg2{align-items:center;border-bottom:1px solid #eee;display:flex;flex:1 1;font-size:14px;justify-content:center;line-height:16px;padding:4px;text-align:center}.table-module_table-bottom-inner__0Pus0 .table-module_table-items__UpFg2:not(:last-child){border-right:1px solid #eee}";
|
|
195
|
+
var styles$b = {"table-wrap":"table-module_table-wrap__KKAnM","table-bottom-inner":"table-module_table-bottom-inner__0Pus0","table-items":"table-module_table-items__UpFg2","table-top":"table-module_table-top__tfEKM"};
|
|
196
|
+
styleInject(css_248z$b);
|
|
195
197
|
|
|
196
198
|
function _extends() {
|
|
197
199
|
_extends = Object.assign ? Object.assign.bind() : function (target) {
|
|
@@ -208,9 +210,9 @@ function _extends() {
|
|
|
208
210
|
return _extends.apply(this, arguments);
|
|
209
211
|
}
|
|
210
212
|
|
|
211
|
-
var css_248z$
|
|
212
|
-
var styles$
|
|
213
|
-
styleInject(css_248z$
|
|
213
|
+
var css_248z$a = ".checkbox-module_checkbox-wrap__Xrg-m{align-items:center;cursor:pointer;display:inline-flex;flex-direction:row;flex-wrap:nowrap;margin:0 6px;padding-left:24px;position:relative}.checkbox-module_checkbox-wrap__Xrg-m>input{height:0;opacity:0;position:absolute;width:0}.checkbox-module_checkbox-wrap__Xrg-m .checkbox-module_checkmark__M8DY6{border:1px solid #d9d9d9;border-radius:3px;bottom:0;display:inline-block;height:14px;left:0;margin:auto 4px auto auto;position:absolute;top:0;transition:border-color .24s;vertical-align:top;width:14px}.checkbox-module_checkbox-wrap__Xrg-m>.checkbox-module_checkmark__M8DY6:after{border:solid #1890ff;border-width:0 2px 2px 0;content:\"\";display:block;height:8px;left:4px;opacity:0;position:absolute;top:1px;transform:rotate(45deg);transition:opacity .24s;width:4px}.checkbox-module_checkbox-wrap__Xrg-m input:checked~.checkbox-module_checkmark__M8DY6:after{opacity:1}.checkbox-module_checkbox-wrap__Xrg-m input:checked~.checkbox-module_checkmark__M8DY6,.checkbox-module_checkbox-wrap__Xrg-m:hover input~.checkbox-module_checkmark__M8DY6{border-color:#1890ff}";
|
|
214
|
+
var styles$a = {"checkbox-wrap":"checkbox-module_checkbox-wrap__Xrg-m","checkmark":"checkbox-module_checkmark__M8DY6"};
|
|
215
|
+
styleInject(css_248z$a);
|
|
214
216
|
|
|
215
217
|
const Checkbox = ({
|
|
216
218
|
disabled,
|
|
@@ -225,7 +227,7 @@ const Checkbox = ({
|
|
|
225
227
|
onClick,
|
|
226
228
|
...props
|
|
227
229
|
}) => {
|
|
228
|
-
const classProps = classnames__default["default"](styles$
|
|
230
|
+
const classProps = classnames__default["default"](styles$a.checkbox, className, 'checkbox-input-rem');
|
|
229
231
|
const parseData = jsonData.length !== 0 ? JSON.parse(jsonData) : [];
|
|
230
232
|
const [data, setData] = React.useState(parseData);
|
|
231
233
|
React.useEffect(() => {
|
|
@@ -258,7 +260,7 @@ const Checkbox = ({
|
|
|
258
260
|
} : '';
|
|
259
261
|
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, data.map(element => {
|
|
260
262
|
return /*#__PURE__*/React__default["default"].createElement("label", {
|
|
261
|
-
className: `${styles$
|
|
263
|
+
className: `${styles$a["checkbox-wrap"]} checkbox-wrap-rem`,
|
|
262
264
|
key: element.value
|
|
263
265
|
}, /*#__PURE__*/React__default["default"].createElement("input", _extends({
|
|
264
266
|
type: "checkbox",
|
|
@@ -272,9 +274,9 @@ const Checkbox = ({
|
|
|
272
274
|
onClick: onClick ? onClick : () => {},
|
|
273
275
|
defaultChecked: element.checked
|
|
274
276
|
}, props)), /*#__PURE__*/React__default["default"].createElement("span", {
|
|
275
|
-
className: `${styles$
|
|
277
|
+
className: `${styles$a["checkmark"]} checkmark-rem`
|
|
276
278
|
}), element[keyNames.label] ? /*#__PURE__*/React__default["default"].createElement("label", {
|
|
277
|
-
className: styles$
|
|
279
|
+
className: styles$a.labelCheckbox,
|
|
278
280
|
for: element[keyNames.id]
|
|
279
281
|
}, element[keyNames.label]) : "");
|
|
280
282
|
}));
|
|
@@ -316,23 +318,23 @@ const Table = ({
|
|
|
316
318
|
return true;
|
|
317
319
|
} : "";
|
|
318
320
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
319
|
-
className: `${styles$
|
|
321
|
+
className: `${styles$b["table-wrap"]} table-wrap-rem`
|
|
320
322
|
}, config.isHeader && hearderData.map((header, key) => {
|
|
321
323
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
322
|
-
className: `${styles$
|
|
324
|
+
className: `${styles$b["table-top"]} table-top-rem`,
|
|
323
325
|
key: key
|
|
324
326
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
325
|
-
className: `${styles$
|
|
327
|
+
className: `${styles$b["table-items"]} table-items-rem`
|
|
326
328
|
}, header));
|
|
327
329
|
}), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
328
|
-
className: `${styles$
|
|
330
|
+
className: `${styles$b["table-bottom"]} table-bottom-rem`
|
|
329
331
|
}, tbodyData.map((item, key) => {
|
|
330
332
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
331
|
-
className: `${styles$
|
|
333
|
+
className: `${styles$b["table-bottom-inner"]} table-bottom-inner-rem`,
|
|
332
334
|
key: key
|
|
333
335
|
}, keyNames.map((keyName, keyNameKey) => {
|
|
334
336
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
335
|
-
className: `${styles$
|
|
337
|
+
className: `${styles$b["table-items"]} table-items-rem`,
|
|
336
338
|
key: keyNameKey
|
|
337
339
|
}, config.isCheckbox && config.isCheckbox.showCheckbox && config.isCheckbox.showCheckbox(item) && keyNameKey == 0 && /*#__PURE__*/React__default["default"].createElement(Checkbox, {
|
|
338
340
|
onClick: e => {
|
|
@@ -348,7 +350,7 @@ const Table = ({
|
|
|
348
350
|
className: keyName.icon
|
|
349
351
|
}), item[keyName.name]));
|
|
350
352
|
}), actions && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
351
|
-
className: `${styles$
|
|
353
|
+
className: `${styles$b["table-items"]} table-items-rem`
|
|
352
354
|
}, actions.filter(a => a.show && a.show(item) || a.show === undefined).map((action, key) => {
|
|
353
355
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
354
356
|
key: key
|
|
@@ -384,9 +386,9 @@ Table.defaultProps = {
|
|
|
384
386
|
hearderData: []
|
|
385
387
|
};
|
|
386
388
|
|
|
387
|
-
var css_248z$
|
|
388
|
-
var styles$
|
|
389
|
-
styleInject(css_248z$
|
|
389
|
+
var css_248z$9 = ".modal-module_modal-wrap__IsXXf{background:rgba(0,0,0,.4);height:100%;left:0;position:fixed;top:0;width:100%;z-index:9}.modal-module_modal-top__ntDBi{background:#fbfbfb;box-sizing:border-box;display:flex;flex-direction:row;height:44px;padding:4px 10px 4px 0;width:100%}.modal-module_modal-title__r-WKl{align-items:center;color:#3c393e;display:flex;flex:1 1;font-size:20px;font-weight:500;line-height:24px;padding-right:20px}.modal-module_close-btn__Qf2UD{cursor:pointer;flex:0 0 auto;width:24px}.modal-module_close-btn__Qf2UD,.modal-module_modal-section__Bp8jN{align-items:center;display:flex;height:100%;justify-content:center}.modal-module_modal-section__Bp8jN{flex:1 1;padding:10px 0;width:100%}.modal-module_modal-content__1F-uE{align-items:center;animation:modal-module_show-popup__WrH7a .24s;background:#fff;border-radius:8px;display:flex;flex-direction:column;height:auto;left:0;margin:auto;min-height:130px;overflow:hidden;padding:10px;position:absolute;right:0;top:110px;width:fit-content}@keyframes modal-module_show-popup__WrH7a{0%{transform:translate3d(0,-30%,0)}to{opacity:1;transform:translateZ(0)}}";
|
|
390
|
+
var styles$9 = {"modal-wrap":"modal-module_modal-wrap__IsXXf","modal-top":"modal-module_modal-top__ntDBi","modal-title":"modal-module_modal-title__r-WKl","close-btn":"modal-module_close-btn__Qf2UD","modal-section":"modal-module_modal-section__Bp8jN","modal-content":"modal-module_modal-content__1F-uE","show-popup":"modal-module_show-popup__WrH7a"};
|
|
391
|
+
styleInject(css_248z$9);
|
|
390
392
|
|
|
391
393
|
const _ = require('lodash');
|
|
392
394
|
const compereConfigs = () => {
|
|
@@ -516,42 +518,42 @@ const Modal = ({
|
|
|
516
518
|
selected,
|
|
517
519
|
children
|
|
518
520
|
}) => {
|
|
519
|
-
classnames__default["default"](styles$
|
|
521
|
+
classnames__default["default"](styles$9.modal, className);
|
|
520
522
|
const [select, setSelect] = React.useState(selected);
|
|
521
523
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
522
|
-
className: `${styles$
|
|
524
|
+
className: `${styles$9["modal-wrap"]} modal-wrap-rem`,
|
|
523
525
|
onClick: () => setShow(false)
|
|
524
526
|
}, type == "content" ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
525
|
-
className: `${styles$
|
|
527
|
+
className: `${styles$9["modal-content"]} modal-content-rem`,
|
|
526
528
|
onClick: e => {
|
|
527
529
|
e.stopPropagation();
|
|
528
530
|
}
|
|
529
531
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
530
|
-
className: `${styles$
|
|
532
|
+
className: `${styles$9["modal-top"]} modal-top-rem`
|
|
531
533
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
532
|
-
className: `${styles$
|
|
534
|
+
className: `${styles$9["modal-title"]} modal-title-rem`
|
|
533
535
|
}, /*#__PURE__*/React__default["default"].createElement(Typography, {
|
|
534
536
|
variant: TypographyType.p,
|
|
535
537
|
color: "#00236A"
|
|
536
538
|
}, headerText)), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
537
|
-
className: `${styles$
|
|
539
|
+
className: `${styles$9["close-btn"]} close-btn-rem`,
|
|
538
540
|
onClick: () => setShow(false)
|
|
539
541
|
}, /*#__PURE__*/React__default["default"].createElement("i", {
|
|
540
542
|
className: "icon-close"
|
|
541
543
|
}))), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
542
|
-
className: `${styles$
|
|
544
|
+
className: `${styles$9["modal-section"]} modal-section-rem`
|
|
543
545
|
}, children)) : type == "images" ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
544
|
-
className: `${styles$
|
|
546
|
+
className: `${styles$9["modal-content"]} modal-content-rem`,
|
|
545
547
|
onClick: e => {
|
|
546
548
|
e.stopPropagation();
|
|
547
549
|
}
|
|
548
550
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
549
|
-
className: `${styles$
|
|
551
|
+
className: `${styles$9["close-btn"]} close-btn-rem`,
|
|
550
552
|
onClick: () => setShow(false)
|
|
551
553
|
}, /*#__PURE__*/React__default["default"].createElement("i", {
|
|
552
554
|
className: "icon-close"
|
|
553
555
|
})), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
554
|
-
className: `${styles$
|
|
556
|
+
className: `${styles$9["modal-section"]} modal-section-rem`
|
|
555
557
|
}, /*#__PURE__*/React__default["default"].createElement("div", null, select > 1 ? /*#__PURE__*/React__default["default"].createElement("h1", {
|
|
556
558
|
onClick: () => setSelect(select - 1)
|
|
557
559
|
}, "-") : null, data.map(elem => {
|
|
@@ -577,9 +579,9 @@ Modal.propTypes = {
|
|
|
577
579
|
data: PropTypes__default["default"].array
|
|
578
580
|
};
|
|
579
581
|
|
|
580
|
-
var css_248z$
|
|
581
|
-
var styles$
|
|
582
|
-
styleInject(css_248z$
|
|
582
|
+
var css_248z$8 = ".input-module_input-wrap__NunrE{position:relative;width:100%}.input-module_input-content__kP7lZ{display:flex;width:100%}input:-webkit-autofill,input:-webkit-autofill:active,input:-webkit-autofill:focus,input:-webkit-autofill:hover{background-color:inherit!important}.input-module_error-message-show__OrVSo{animation-fill-mode:forwards;animation-name:input-module_error-show__9MP6k}@keyframes input-module_error-show__9MP6k{to{bottom:-20px;transform:scaleX(1);-webkit-transform:scaleX(1);-moz-transform:scaleX(1);-ms-transform:scaleX(1);-o-transform:scaleX(1)}}";
|
|
583
|
+
var styles$8 = {"input-wrap":"input-module_input-wrap__NunrE","input-content":"input-module_input-content__kP7lZ","error-message-show":"input-module_error-message-show__OrVSo","error-show":"input-module_error-show__9MP6k"};
|
|
584
|
+
styleInject(css_248z$8);
|
|
583
585
|
|
|
584
586
|
const InputTypes = {
|
|
585
587
|
TEL: 'tel',
|
|
@@ -611,6 +613,7 @@ const Input = ({
|
|
|
611
613
|
errorLeft,
|
|
612
614
|
errorSize,
|
|
613
615
|
labelSize,
|
|
616
|
+
maxLength,
|
|
614
617
|
labelColor,
|
|
615
618
|
errorColor,
|
|
616
619
|
placeholder,
|
|
@@ -656,6 +659,14 @@ const Input = ({
|
|
|
656
659
|
animation: ${errorAnimation ? animation : 'none'};
|
|
657
660
|
`;
|
|
658
661
|
const handleChange = event => {
|
|
662
|
+
// TODO: need to discuss
|
|
663
|
+
// onChange
|
|
664
|
+
// ? type === 'tel'
|
|
665
|
+
// ? phoneNumberRegex.test(event.target.value)
|
|
666
|
+
// ? onChange(event.target.value)
|
|
667
|
+
// : _ => _
|
|
668
|
+
// : onChange(event.target.value)
|
|
669
|
+
// : _ => _;
|
|
659
670
|
onChange ? onChange(event.target.value) : _ => _;
|
|
660
671
|
};
|
|
661
672
|
const handleMouseEnter = () => {
|
|
@@ -665,9 +676,9 @@ const Input = ({
|
|
|
665
676
|
setIsHover(false);
|
|
666
677
|
};
|
|
667
678
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
668
|
-
className: `${styles$
|
|
679
|
+
className: `${styles$8["input-wrap"]}`
|
|
669
680
|
}, label ? /*#__PURE__*/React__default["default"].createElement("label", {
|
|
670
|
-
className: `${styles$
|
|
681
|
+
className: `${styles$8["input-title"]}`,
|
|
671
682
|
style: {
|
|
672
683
|
color: labelColor ? labelColor : configStyles.INPUT.labelColor,
|
|
673
684
|
fontSize: labelSize ? labelSize : configStyles.INPUT.labelSize,
|
|
@@ -681,7 +692,7 @@ const Input = ({
|
|
|
681
692
|
color: "#ee0000"
|
|
682
693
|
}
|
|
683
694
|
}, "*")) : '', /*#__PURE__*/React__default["default"].createElement("div", {
|
|
684
|
-
className: `${styles$
|
|
695
|
+
className: `${styles$8["input-content"]}`,
|
|
685
696
|
style: {
|
|
686
697
|
width: width ? width : configStyles.INPUT.width,
|
|
687
698
|
borderRadius: radius ? radius : configStyles.INPUT.radius,
|
|
@@ -719,7 +730,9 @@ const Input = ({
|
|
|
719
730
|
backgroundColor: disabled ? '#FBFBFB' : backgroundColor ? backgroundColor : configStyles.INPUT.backgroundColor
|
|
720
731
|
}
|
|
721
732
|
}, "+374") : '', /*#__PURE__*/React__default["default"].createElement("input", _extends({}, props, {
|
|
722
|
-
|
|
733
|
+
// TODO: need to discuss
|
|
734
|
+
// value={type === 'tel' ? phoneNumberRegex.test(value) ? value : '' : maxLength && value && value.length > maxLength ? value.substr(0, maxLength) : value}
|
|
735
|
+
value: maxLength && value && value.length > maxLength ? value.substr(0, maxLength) : value,
|
|
723
736
|
className: classProps,
|
|
724
737
|
onChange: handleChange,
|
|
725
738
|
type: show ? 'text' : type,
|
|
@@ -730,7 +743,7 @@ const Input = ({
|
|
|
730
743
|
style: {
|
|
731
744
|
border: 'none',
|
|
732
745
|
outline: 'none',
|
|
733
|
-
|
|
746
|
+
cursor: disabled ? 'not-allowed' : 'auto',
|
|
734
747
|
width: width ? width : configStyles.INPUT.width,
|
|
735
748
|
fontSize: size ? size : configStyles.INPUT.size,
|
|
736
749
|
height: height ? height : configStyles.INPUT.height,
|
|
@@ -790,6 +803,7 @@ Input.propTypes = {
|
|
|
790
803
|
errorSize: PropTypes__default["default"].string,
|
|
791
804
|
errorLeft: PropTypes__default["default"].string,
|
|
792
805
|
labelSize: PropTypes__default["default"].string,
|
|
806
|
+
maxLength: PropTypes__default["default"].number,
|
|
793
807
|
errorColor: PropTypes__default["default"].string,
|
|
794
808
|
labelColor: PropTypes__default["default"].string,
|
|
795
809
|
placeholder: PropTypes__default["default"].string,
|
|
@@ -819,9 +833,9 @@ Input.defaultProps = {
|
|
|
819
833
|
type: "text"
|
|
820
834
|
};
|
|
821
835
|
|
|
822
|
-
var css_248z$
|
|
823
|
-
var styles$
|
|
824
|
-
styleInject(css_248z$
|
|
836
|
+
var css_248z$7 = ".radio-module_radio-wrap__-lO7V{align-items:center;cursor:pointer;display:inline-flex;flex-direction:row;flex-wrap:nowrap;margin:0 6px;padding-left:24px;position:relative}.radio-module_radio-wrap__-lO7V>input{height:0;opacity:0;position:absolute;width:0}.radio-module_radio-wrap__-lO7V .radio-module_radio-checkmark__Kvol0{border:1px solid #d9d9d9;border-radius:50%;display:inline-block;height:14px;left:0;margin-right:4px;position:absolute;top:0;transition:border-color .24s;vertical-align:top;width:14px}.radio-module_radio-wrap__-lO7V>.radio-module_radio-checkmark__Kvol0:after{background-color:#d9d9d9;border-radius:50%;bottom:0;content:\"\";height:8px;left:0;margin:auto;opacity:0;position:absolute;right:0;top:0;transition:opacity .24s,background-color .24s;width:8px}.radio-module_radio-wrap__-lO7V input:checked~.radio-module_radio-checkmark__Kvol0:after{background-color:#1890ff;opacity:1}.radio-module_radio-wrap__-lO7V:hover input~.radio-module_radio-checkmark__Kvol0:after{opacity:1}.radio-module_radio-wrap__-lO7V input:checked~.radio-module_radio-checkmark__Kvol0{border-color:#1890ff}";
|
|
837
|
+
var styles$7 = {"radio-wrap":"radio-module_radio-wrap__-lO7V","radio-checkmark":"radio-module_radio-checkmark__Kvol0"};
|
|
838
|
+
styleInject(css_248z$7);
|
|
825
839
|
|
|
826
840
|
const Radio = ({
|
|
827
841
|
disabled,
|
|
@@ -835,11 +849,11 @@ const Radio = ({
|
|
|
835
849
|
keyNames,
|
|
836
850
|
...props
|
|
837
851
|
}) => {
|
|
838
|
-
const classProps = classnames__default["default"](styles$
|
|
852
|
+
const classProps = classnames__default["default"](styles$7.checkbox, className);
|
|
839
853
|
const parseData = jsonData.length !== 0 ? JSON.parse(jsonData) : [];
|
|
840
854
|
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, parseData.map((element, id) => {
|
|
841
855
|
return /*#__PURE__*/React__default["default"].createElement("label", {
|
|
842
|
-
className: `${styles$
|
|
856
|
+
className: `${styles$7["radio-wrap"]} radio-wrap-rem`,
|
|
843
857
|
key: element.value
|
|
844
858
|
}, /*#__PURE__*/React__default["default"].createElement("input", _extends({
|
|
845
859
|
type: "radio",
|
|
@@ -850,9 +864,9 @@ const Radio = ({
|
|
|
850
864
|
value: value ? value : element.value,
|
|
851
865
|
name: name ? name : element.name
|
|
852
866
|
}, props)), /*#__PURE__*/React__default["default"].createElement("span", {
|
|
853
|
-
className: `${styles$
|
|
867
|
+
className: `${styles$7["radio-checkmark"]} radio-checkmark-rem`
|
|
854
868
|
}), element.label ? /*#__PURE__*/React__default["default"].createElement("span", {
|
|
855
|
-
className: styles$
|
|
869
|
+
className: styles$7.labelRadio
|
|
856
870
|
}, label ? label : element.label) : "");
|
|
857
871
|
}));
|
|
858
872
|
};
|
|
@@ -967,9 +981,9 @@ Button.propTypes = {
|
|
|
967
981
|
disabledBackgroundColor: PropTypes__default["default"].string
|
|
968
982
|
};
|
|
969
983
|
|
|
970
|
-
var ReactCheckbox = "<svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M3.2 0H12.8C14.5673 0 16 1.43269 16 3.2V12.8C16 14.5673 14.5673 16 12.8 16H3.2C1.43269 16 0 14.5673 0 12.8V3.2C0 1.43269 1.43269 0 3.2 0ZM3.2 1.6C2.31634 1.6 1.6 2.31634 1.6 3.2V12.8C1.6 13.6837 2.31634 14.4 3.2 14.4H12.8C13.6837 14.4 14.4 13.6837 14.4 12.8V3.2C14.4 2.31634 13.6837 1.6 12.8 1.6H3.2Z\" fill=\"#D1D1D1\"/>\n</svg>";
|
|
984
|
+
var ReactCheckbox = "<svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M3.2 0H12.8C14.5673 0 16 1.43269 16 3.2V12.8C16 14.5673 14.5673 16 12.8 16H3.2C1.43269 16 0 14.5673 0 12.8V3.2C0 1.43269 1.43269 0 3.2 0ZM3.2 1.6C2.31634 1.6 1.6 2.31634 1.6 3.2V12.8C1.6 13.6837 2.31634 14.4 3.2 14.4H12.8C13.6837 14.4 14.4 13.6837 14.4 12.8V3.2C14.4 2.31634 13.6837 1.6 12.8 1.6H3.2Z\" fill=\"#D1D1D1\"/>\r\n</svg>";
|
|
971
985
|
|
|
972
|
-
var ReactCheckboxChecked = "<svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12.8 0H3.2C1.43269 0 0 1.43269 0 3.2V12.8C0 14.5673 1.43269 16 3.2 16H12.8C14.5673 16 16 14.5673 16 12.8V3.2C16 1.43269 14.5673 0 12.8 0ZM6.84979 10.9662C6.9178 10.9887 6.99067 11 7.0684 11C7.14613 11 7.219 10.9887 7.28701 10.9662C7.35502 10.944 7.41818 10.906 7.47647 10.8523L12.8397 5.91275C12.9466 5.81432 13 5.68671 13 5.52993C13 5.37351 12.9466 5.24609 12.8397 5.14765C12.7328 5.04922 12.5945 5 12.4246 5C12.2544 5 12.1158 5.04922 12.009 5.14765L7.0684 9.69799L4.98433 7.77852C4.87745 7.68009 4.74143 7.63087 4.57625 7.63087C4.41108 7.63087 4.27506 7.68009 4.16818 7.77852C4.06131 7.87696 4.00534 8.00438 4.00029 8.1608C3.99563 8.31758 4.04673 8.44519 4.15361 8.54362L6.66033 10.8523C6.71863 10.906 6.78178 10.944 6.84979 10.9662Z\" fill=\"#00236A\"/>\n</svg>";
|
|
986
|
+
var ReactCheckboxChecked = "<svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12.8 0H3.2C1.43269 0 0 1.43269 0 3.2V12.8C0 14.5673 1.43269 16 3.2 16H12.8C14.5673 16 16 14.5673 16 12.8V3.2C16 1.43269 14.5673 0 12.8 0ZM6.84979 10.9662C6.9178 10.9887 6.99067 11 7.0684 11C7.14613 11 7.219 10.9887 7.28701 10.9662C7.35502 10.944 7.41818 10.906 7.47647 10.8523L12.8397 5.91275C12.9466 5.81432 13 5.68671 13 5.52993C13 5.37351 12.9466 5.24609 12.8397 5.14765C12.7328 5.04922 12.5945 5 12.4246 5C12.2544 5 12.1158 5.04922 12.009 5.14765L7.0684 9.69799L4.98433 7.77852C4.87745 7.68009 4.74143 7.63087 4.57625 7.63087C4.41108 7.63087 4.27506 7.68009 4.16818 7.77852C4.06131 7.87696 4.00534 8.00438 4.00029 8.1608C3.99563 8.31758 4.04673 8.44519 4.15361 8.54362L6.66033 10.8523C6.71863 10.906 6.78178 10.944 6.84979 10.9662Z\" fill=\"#00236A\"/>\r\n</svg>";
|
|
973
987
|
|
|
974
988
|
const SelectCheckbox = ({
|
|
975
989
|
checked
|
|
@@ -1024,9 +1038,9 @@ const SvgCloseIcon = ({
|
|
|
1024
1038
|
fill: "#3C393E"
|
|
1025
1039
|
}));
|
|
1026
1040
|
|
|
1027
|
-
var css_248z$
|
|
1028
|
-
var styles$
|
|
1029
|
-
styleInject(css_248z$
|
|
1041
|
+
var css_248z$6 = ".select-module_select-content__GCMDX{display:flex;flex-direction:column;position:relative}.select-module_select-content-top__Aw-fB{align-items:center;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between}.select-module_select-content-bottom__ueZCR{animation:select-module_select-show__391hQ .64s linear forwards;-webkit-animation:select-module_select-show__391hQ .64s linear forwards;left:0;max-height:0;overflow:hidden;position:absolute;width:100%;z-index:1}.select-module_select-content-bottom-inner__NWy2X{display:flex;flex-direction:column;max-height:234px;overflow-x:hidden;overflow-y:auto}.select-module_select-content-top-icon__MBrGK{align-items:center;box-sizing:border-box;display:flex;flex:0 0 auto;padding:0 5px 0 20px}.select-module_select-content-top-icon__MBrGK>div{align-items:center;display:flex;height:14px;justify-content:center;width:14px}.select-module_close-icon__SFNaJ{border-right:1px solid #eee;box-sizing:content-box;padding-right:9px}.select-module_arrow-icon__rjHt-{margin-left:9px;transform-origin:center;transition:all .64s ease;-webkit-transition:all .64s ease;-moz-transition:all .64s ease;-ms-transition:all .64s ease;-o-transition:all .64s ease}.select-module_select-content-bottom-row__eKq5L{align-items:center;display:flex;transition:background-color .24s,color .24s;-webkit-transition:background-color .24s,color .24s;-moz-transition:background-color .24s,color .24s;-ms-transition:background-color .24s,color .24s;-o-transition:background-color .24s,color .24s}.select-module_select-content-bottom-row__eKq5L:last-child{margin-bottom:0}@keyframes select-module_select-show__391hQ{to{max-height:234px}}";
|
|
1042
|
+
var styles$6 = {"select-content":"select-module_select-content__GCMDX","select-content-top":"select-module_select-content-top__Aw-fB","select-content-bottom":"select-module_select-content-bottom__ueZCR","select-show":"select-module_select-show__391hQ","select-content-bottom-inner":"select-module_select-content-bottom-inner__NWy2X","select-content-top-icon":"select-module_select-content-top-icon__MBrGK","close-icon":"select-module_close-icon__SFNaJ","arrow-icon":"select-module_arrow-icon__rjHt-","select-content-bottom-row":"select-module_select-content-bottom-row__eKq5L"};
|
|
1043
|
+
styleInject(css_248z$6);
|
|
1030
1044
|
|
|
1031
1045
|
const Select = ({
|
|
1032
1046
|
options,
|
|
@@ -1200,7 +1214,7 @@ const Select = ({
|
|
|
1200
1214
|
}, "*")) : "", /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1201
1215
|
ref: ref
|
|
1202
1216
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1203
|
-
className: styles$
|
|
1217
|
+
className: styles$6['select-content']
|
|
1204
1218
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1205
1219
|
style: {
|
|
1206
1220
|
cursor: disabled ? 'not-allowed' : cursor ? cursor : configStyles.SELECT.cursor,
|
|
@@ -1218,9 +1232,9 @@ const Select = ({
|
|
|
1218
1232
|
onClick: disabled ? _ => _ : _ => handleOpenClose(),
|
|
1219
1233
|
onMouseEnter: disabled ? _ => _ : _ => handleMouseEnter(),
|
|
1220
1234
|
onMouseLeave: disabled ? _ => _ : _ => handleMouseLeave(),
|
|
1221
|
-
className: `${styles$
|
|
1235
|
+
className: `${styles$6['select-content-top']}`
|
|
1222
1236
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1223
|
-
className: `${styles$
|
|
1237
|
+
className: `${styles$6['select-content-top-text']}`,
|
|
1224
1238
|
style: {
|
|
1225
1239
|
color: errorMessage ? errorColor ? errorColor : configStyles.SELECT.errorColor : isHover ? selectedHoverColor ? selectedHoverColor : configStyles.SELECT.selectedHoverColor : selectedColor ? selectedColor : configStyles.SELECT.selectedColor
|
|
1226
1240
|
}
|
|
@@ -1233,28 +1247,28 @@ const Select = ({
|
|
|
1233
1247
|
}
|
|
1234
1248
|
}
|
|
1235
1249
|
}) : defaultOption ? defaultOption : ''), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1236
|
-
className: `${styles$
|
|
1237
|
-
}, multiple && newSelected.length > 1 && /*#__PURE__*/React__default["default"].createElement("span", null, newSelected.length), newSelected && newSelected.length > 0 && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1238
|
-
className: `${styles$
|
|
1250
|
+
className: `${styles$6['select-content-top-icon']}`
|
|
1251
|
+
}, !disabled && multiple && newSelected.length > 1 && /*#__PURE__*/React__default["default"].createElement("span", null, newSelected.length), !disabled && newSelected && newSelected.length > 0 && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1252
|
+
className: `${styles$6['close-icon']}`,
|
|
1239
1253
|
onClick: disabled ? _ => _ : handleClearSelect,
|
|
1240
1254
|
style: {
|
|
1241
1255
|
marginLeft: multiple && newSelected.length > 1 ? '17px' : '0px'
|
|
1242
1256
|
}
|
|
1243
|
-
}, closeIcon ? closeIcon : /*#__PURE__*/React__default["default"].createElement(SvgCloseIcon, null)), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1257
|
+
}, closeIcon ? closeIcon : /*#__PURE__*/React__default["default"].createElement(SvgCloseIcon, null)), !disabled ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1244
1258
|
style: {
|
|
1245
1259
|
transform: opened ? 'rotate(180deg)' : 'rotate(0deg)'
|
|
1246
1260
|
},
|
|
1247
|
-
className: `${styles$
|
|
1248
|
-
}, arrowIcon ? arrowIcon : /*#__PURE__*/React__default["default"].createElement(SvgArrow, null)))), opened && !disabled ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1261
|
+
className: `${styles$6['arrow-icon']}`
|
|
1262
|
+
}, arrowIcon ? arrowIcon : /*#__PURE__*/React__default["default"].createElement(SvgArrow, null)) : '')), opened && !disabled ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1249
1263
|
style: {
|
|
1250
1264
|
boxShadow: optionsBoxShadow ? optionsBoxShadow : configStyles.SELECT.optionsBoxShadow,
|
|
1251
1265
|
borderRadius: optionsBorderRadius ? optionsBorderRadius : configStyles.SELECT.optionsBorderRadius,
|
|
1252
1266
|
backgroundColor: optionsBackgroundColor ? optionsBackgroundColor : configStyles.SELECT.optionsBackgroundColor,
|
|
1253
|
-
top: parseFloat(selectedMinHeight
|
|
1267
|
+
top: selectedMinHeight ? selectedMinHeight.includes('rem') ? parseFloat(selectedMinHeight.substr(0, selectedMinHeight.length - 3)) + 0.6 + 'rem' : parseFloat(selectedMinHeight.substr(0, selectedMinHeight.length - 2)) + 6 + 'px' : configStyles.SELECT.selectedMinHeight.includes('rem') ? parseFloat(configStyles.SELECT.selectedMinHeight.substr(0, configStyles.SELECT.selectedMinHeight - 3)) + 0.6 + 'rem' : parseFloat(configStyles.SELECT.selectedMinHeight.substr(0, configStyles.SELECT.selectedMinHeight - 2)) + 6 + 'px'
|
|
1254
1268
|
},
|
|
1255
|
-
className: `${styles$
|
|
1269
|
+
className: `${styles$6['select-content-bottom']}`
|
|
1256
1270
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1257
|
-
className: `${styles$
|
|
1271
|
+
className: `${styles$6['select-content-bottom-inner']}`
|
|
1258
1272
|
}, existOptions && existOptions.length > 0 && existOptions.map((option, i) => {
|
|
1259
1273
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1260
1274
|
key: i,
|
|
@@ -1263,7 +1277,7 @@ const Select = ({
|
|
|
1263
1277
|
onClick: disabled ? _ => _ : _ => handleSelectItem(option),
|
|
1264
1278
|
onMouseEnter: disabled ? _ => _ : e => handleMouseEnterOption(e),
|
|
1265
1279
|
onMouseLeave: disabled ? _ => _ : e => handleMouseLeaveOption(e),
|
|
1266
|
-
className: `${styles$
|
|
1280
|
+
className: `${styles$6['select-content-bottom-row']}`,
|
|
1267
1281
|
style: {
|
|
1268
1282
|
color: optionItemColor ? optionItemColor : configStyles.SELECT.optionItemColor,
|
|
1269
1283
|
cursor: optionItemCursor ? optionItemCursor : configStyles.SELECT.optionItemCursor,
|
|
@@ -1340,7 +1354,353 @@ Select.propTypes = {
|
|
|
1340
1354
|
optionItemBackgroudColorHover: PropTypes__default["default"].string
|
|
1341
1355
|
};
|
|
1342
1356
|
|
|
1343
|
-
|
|
1357
|
+
const SvgToasterInfo = ({
|
|
1358
|
+
title,
|
|
1359
|
+
titleId,
|
|
1360
|
+
...props
|
|
1361
|
+
}) => /*#__PURE__*/React__namespace.createElement("svg", _extends({
|
|
1362
|
+
width: "1em",
|
|
1363
|
+
height: "1em",
|
|
1364
|
+
viewBox: "0 0 24 24",
|
|
1365
|
+
fill: "none",
|
|
1366
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1367
|
+
"aria-labelledby": titleId
|
|
1368
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
1369
|
+
id: titleId
|
|
1370
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
1371
|
+
d: "M12 18c.34 0 .625-.115.856-.346.23-.23.345-.515.344-.854v-4.83c0-.34-.115-.62-.346-.84A1.19 1.19 0 0 0 12 10.8c-.34 0-.625.115-.856.346-.23.23-.345.515-.344.854v4.83c0 .34.115.62.346.84.23.22.515.33.854.33Zm0-9.6c.34 0 .625-.115.856-.346.23-.23.345-.515.344-.854 0-.34-.115-.625-.346-.856A1.157 1.157 0 0 0 12 6c-.34 0-.625.115-.856.346-.23.23-.345.515-.344.854 0 .34.115.625.346.856.23.23.515.345.854.344ZM12 24c-1.66 0-3.22-.315-4.68-.946a12.137 12.137 0 0 1-3.81-2.564 12.11 12.11 0 0 1-2.564-3.81C.316 15.22 0 13.66 0 12c0-1.66.315-3.22.946-4.68.63-1.46 1.485-2.73 2.564-3.81A12.11 12.11 0 0 1 7.32.946C8.78.316 10.34 0 12 0c1.66 0 3.22.315 4.68.946 1.46.63 2.73 1.485 3.81 2.564a12.127 12.127 0 0 1 2.566 3.81c.63 1.46.945 3.02.944 4.68 0 1.66-.315 3.22-.946 4.68a12.137 12.137 0 0 1-2.564 3.81 12.127 12.127 0 0 1-3.81 2.566c-1.46.63-3.02.945-4.68.944Z",
|
|
1372
|
+
fill: "#00236A"
|
|
1373
|
+
}));
|
|
1374
|
+
|
|
1375
|
+
const SvgToasterError = ({
|
|
1376
|
+
title,
|
|
1377
|
+
titleId,
|
|
1378
|
+
...props
|
|
1379
|
+
}) => /*#__PURE__*/React__namespace.createElement("svg", _extends({
|
|
1380
|
+
width: "1em",
|
|
1381
|
+
height: "1em",
|
|
1382
|
+
viewBox: "0 0 24 24",
|
|
1383
|
+
fill: "none",
|
|
1384
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1385
|
+
"aria-labelledby": titleId
|
|
1386
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
1387
|
+
id: titleId
|
|
1388
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
1389
|
+
d: "M12 0a12 12 0 1 1 0 24 12 12 0 0 1 0-24Zm0 16a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3Zm0-11a1 1 0 0 0-.984.82L11 6v7l.016.18a1 1 0 0 0 1.968 0L13 13V6l-.016-.18A1 1 0 0 0 12 5Z",
|
|
1390
|
+
fill: "#E00"
|
|
1391
|
+
}));
|
|
1392
|
+
|
|
1393
|
+
const SvgToasterClose = ({
|
|
1394
|
+
title,
|
|
1395
|
+
titleId,
|
|
1396
|
+
...props
|
|
1397
|
+
}) => /*#__PURE__*/React__namespace.createElement("svg", _extends({
|
|
1398
|
+
width: "1em",
|
|
1399
|
+
height: "1em",
|
|
1400
|
+
viewBox: "0 0 18 18",
|
|
1401
|
+
fill: "none",
|
|
1402
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1403
|
+
"aria-labelledby": titleId
|
|
1404
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
1405
|
+
id: titleId
|
|
1406
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
1407
|
+
d: "m10.47 8.95 7.29-7.29A1 1 0 0 0 16.35.25L9.06 7.54 1.77.24A1 1 0 0 0 .36 1.65l7.29 7.3-7.3 7.29a.999.999 0 1 0 1.41 1.41l7.3-7.29 7.29 7.29a1 1 0 0 0 1.41-1.41l-7.29-7.29Z",
|
|
1408
|
+
fill: "#D1D1D1"
|
|
1409
|
+
}));
|
|
1410
|
+
|
|
1411
|
+
const SvgToasterWarning = ({
|
|
1412
|
+
title,
|
|
1413
|
+
titleId,
|
|
1414
|
+
...props
|
|
1415
|
+
}) => /*#__PURE__*/React__namespace.createElement("svg", _extends({
|
|
1416
|
+
width: "1em",
|
|
1417
|
+
height: "1em",
|
|
1418
|
+
viewBox: "0 0 24 21",
|
|
1419
|
+
fill: "none",
|
|
1420
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1421
|
+
"aria-labelledby": titleId
|
|
1422
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
1423
|
+
id: titleId
|
|
1424
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
1425
|
+
d: "M1.156 21a1.143 1.143 0 0 1-.994-.583 1.285 1.285 0 0 1-.16-.57c-.01-.204.043-.403.16-.597L10.978.583c.117-.194.268-.34.454-.437C11.616.049 11.806 0 12 0c.194 0 .384.049.57.146.185.097.336.243.452.437L23.838 19.25c.116.194.17.394.161.599a1.26 1.26 0 0 1-.161.568 1.14 1.14 0 0 1-.41.423 1.09 1.09 0 0 1-.584.16H1.156ZM12 17.5c.331 0 .61-.112.834-.336.224-.224.336-.5.335-.83 0-.331-.112-.608-.337-.832a1.128 1.128 0 0 0-.832-.335c-.331 0-.609.112-.834.336-.224.224-.336.5-.335.83 0 .33.112.608.337.832.224.224.502.336.832.335Zm0-3.5c.331 0 .61-.112.834-.336.224-.224.336-.5.335-.83v-3.5c0-.331-.112-.608-.337-.832A1.128 1.128 0 0 0 12 8.166c-.331 0-.609.112-.834.336-.224.224-.336.5-.335.83v3.5c0 .33.112.608.337.832.224.224.502.336.832.335Z",
|
|
1426
|
+
fill: "#FF8A00"
|
|
1427
|
+
}));
|
|
1428
|
+
|
|
1429
|
+
const SvgToasterSuccess = ({
|
|
1430
|
+
title,
|
|
1431
|
+
titleId,
|
|
1432
|
+
...props
|
|
1433
|
+
}) => /*#__PURE__*/React__namespace.createElement("svg", _extends({
|
|
1434
|
+
width: "1em",
|
|
1435
|
+
height: "1em",
|
|
1436
|
+
viewBox: "0 0 24 24",
|
|
1437
|
+
fill: "none",
|
|
1438
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1439
|
+
"aria-labelledby": titleId
|
|
1440
|
+
}, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
|
|
1441
|
+
id: titleId
|
|
1442
|
+
}, title) : null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
1443
|
+
d: "M12 0a12 12 0 1 1 0 24 12 12 0 0 1 0-24Zm-1.495 14.367L7.84 11.7a1.028 1.028 0 1 0-1.455 1.455l3.394 3.395a1.024 1.024 0 0 0 1.456 0l7.028-7.03a1.03 1.03 0 1 0-1.453-1.456l-6.304 6.303Z",
|
|
1444
|
+
fill: "#0DA574"
|
|
1445
|
+
}));
|
|
1446
|
+
|
|
1447
|
+
var css_248z$5 = "#toaster-module_top-left__q0LcN{left:0;top:1em}#toaster-module_top-right__f-AFL{right:0;top:1em}#toaster-module_top-center__eVRbc{left:50%;top:1em;transform:translateX(-50%);-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-o-transform:translateX(-50%)}#toaster-module_bottom-left__b-YHI{bottom:1em;left:0}#toaster-module_bottom-right__g9ACP{bottom:1em;right:0}#toaster-module_bottom-center__4KcFe{bottom:1em;left:50%;transform:translateX(-50%);-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-o-transform:translateX(-50%)}.toaster-module_top-left__q0LcN{left:0;top:1em}.toaster-module_top-right__f-AFL{right:0;top:1em}.toaster-module_top-center__eVRbc{left:50%;top:1em;transform:translateX(-50%);-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-o-transform:translateX(-50%)}.toaster-module_bottom-left__b-YHI{bottom:1em;left:0}.toaster-module_bottom-right__g9ACP{bottom:1em;right:0}.toaster-module_bottom-center__4KcFe{bottom:1em;left:50%;transform:translateX(-50%);-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-o-transform:translateX(-50%)}.toaster-module_notify-block__pRnEB{-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.toaster-module_bounce-in-right__shR2D{-webkit-animation-name:toaster-module_bounceInRight__rSk5p;animation-name:toaster-module_bounceInRight__rSk5p}.toaster-module_bounce-out-right__48pyA{-webkit-animation-name:toaster-module_bounceOutRight__bmFGS;animation-name:toaster-module_bounceOutRight__bmFGS}@keyframes toaster-module_bounceInRight__rSk5p{0%{opacity:0;right:-100%}60%{opacity:1;right:40px}75%{right:0}90%{right:30px}to{right:20px}}@keyframes toaster-module_bounceOutRight__bmFGS{0%{opacity:1;right:20px}60%{opacity:1;right:60px}to{opacity:0;right:-100%}}.toaster-module_bounce-in-left__xoF-M{-webkit-animation-name:toaster-module_bounceInLeft__to59v;animation-name:toaster-module_bounceInLeft__to59v}.toaster-module_bounce-out-left__fDOZw{-webkit-animation-name:toaster-module_bounceOutLeft__k5QgO;animation-name:toaster-module_bounceOutLeft__k5QgO}@keyframes toaster-module_bounceInLeft__to59v{0%{left:-100%;opacity:0}60%{left:40px;opacity:1}75%{left:0}90%{left:30px}to{left:20px}}@keyframes toaster-module_bounceOutLeft__k5QgO{0%{left:20px;opacity:1}60%{left:60px;opacity:1}to{left:-100%;opacity:0}}";
|
|
1448
|
+
var styles$5 = {"top-left":"toaster-module_top-left__q0LcN","top-right":"toaster-module_top-right__f-AFL","top-center":"toaster-module_top-center__eVRbc","bottom-left":"toaster-module_bottom-left__b-YHI","bottom-right":"toaster-module_bottom-right__g9ACP","bottom-center":"toaster-module_bottom-center__4KcFe","notify-block":"toaster-module_notify-block__pRnEB","bounce-in-right":"toaster-module_bounce-in-right__shR2D","bounceInRight":"toaster-module_bounceInRight__rSk5p","bounce-out-right":"toaster-module_bounce-out-right__48pyA","bounceOutRight":"toaster-module_bounceOutRight__bmFGS","bounce-in-left":"toaster-module_bounce-in-left__xoF-M","bounceInLeft":"toaster-module_bounceInLeft__to59v","bounce-out-left":"toaster-module_bounce-out-left__fDOZw","bounceOutLeft":"toaster-module_bounceOutLeft__k5QgO"};
|
|
1449
|
+
styleInject(css_248z$5);
|
|
1450
|
+
|
|
1451
|
+
const ToasterType = {
|
|
1452
|
+
info: 'info',
|
|
1453
|
+
warn: 'warn',
|
|
1454
|
+
error: 'error',
|
|
1455
|
+
success: 'success'
|
|
1456
|
+
};
|
|
1457
|
+
const ToasterPosition = {
|
|
1458
|
+
topLeft: 'top-left',
|
|
1459
|
+
topRight: 'top-right',
|
|
1460
|
+
topCenter: 'top-center',
|
|
1461
|
+
bottomLeft: 'bottom-left',
|
|
1462
|
+
bottomRight: 'bottom-right',
|
|
1463
|
+
bottomCenter: 'bottom-center'
|
|
1464
|
+
};
|
|
1465
|
+
const Toast = ({
|
|
1466
|
+
type,
|
|
1467
|
+
title,
|
|
1468
|
+
timer,
|
|
1469
|
+
position,
|
|
1470
|
+
removeToast,
|
|
1471
|
+
description
|
|
1472
|
+
}) => {
|
|
1473
|
+
let timeoutCall;
|
|
1474
|
+
let timeoutClick;
|
|
1475
|
+
const ref = React.useRef(null);
|
|
1476
|
+
const [showToaster, setShowToaster] = React.useState(true);
|
|
1477
|
+
const handleToasterClick = e => {
|
|
1478
|
+
e.stopPropagation();
|
|
1479
|
+
};
|
|
1480
|
+
const handleCloseToaster = ref => {
|
|
1481
|
+
setShowToaster(false);
|
|
1482
|
+
timeoutClick = setTimeout(() => {
|
|
1483
|
+
removeToast(ref, position);
|
|
1484
|
+
}, 300);
|
|
1485
|
+
clearTimeout(timeoutCall);
|
|
1486
|
+
};
|
|
1487
|
+
React.useEffect(() => {
|
|
1488
|
+
timeoutCall = setTimeout(() => {
|
|
1489
|
+
handleCloseToaster(ref);
|
|
1490
|
+
}, timer);
|
|
1491
|
+
return () => {
|
|
1492
|
+
setShowToaster(true);
|
|
1493
|
+
clearTimeout(timeoutCall);
|
|
1494
|
+
clearTimeout(timeoutClick);
|
|
1495
|
+
};
|
|
1496
|
+
}, []);
|
|
1497
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1498
|
+
ref: ref,
|
|
1499
|
+
onClick: handleToasterClick,
|
|
1500
|
+
style: {
|
|
1501
|
+
position: 'absolute',
|
|
1502
|
+
display: 'flex',
|
|
1503
|
+
width: '440px',
|
|
1504
|
+
height: '83px',
|
|
1505
|
+
borderRadius: '40px',
|
|
1506
|
+
alignItems: 'center',
|
|
1507
|
+
boxSizing: 'border-box',
|
|
1508
|
+
backgroundColor: '#FFFFFF',
|
|
1509
|
+
border: '2px solid #EEEEEE',
|
|
1510
|
+
padding: '14px 29px 14px 12px',
|
|
1511
|
+
justifyContent: 'space-between'
|
|
1512
|
+
},
|
|
1513
|
+
className: `
|
|
1514
|
+
${styles$5['notify-block']}
|
|
1515
|
+
${position === 'top-left' ? showToaster ? styles$5['bounce-in-left'] : styles$5['bounce-out-left'] : position === 'top-right' ? showToaster ? styles$5['bounce-in-right'] : styles$5['bounce-out-right'] : position === 'top-center' ? showToaster ? styles$5['bounce-in-left'] : styles$5['bounce-out-left'] : position === 'bottom-left' ? showToaster ? styles$5['bounce-in-left'] : styles$5['bounce-out-left'] : position === 'bottom-right' ? showToaster ? styles$5['bounce-in-right'] : styles$5['bounce-out-right'] : position === 'bottom-center' ? showToaster ? styles$5['bounce-in-left'] : styles$5['bounce-out-left'] : ''}
|
|
1516
|
+
`
|
|
1517
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1518
|
+
style: {
|
|
1519
|
+
display: 'flex',
|
|
1520
|
+
width: '60px',
|
|
1521
|
+
height: '60px',
|
|
1522
|
+
borderRadius: '30px',
|
|
1523
|
+
alignItems: 'center',
|
|
1524
|
+
justifyContent: 'center',
|
|
1525
|
+
backgroundColor: type === 'info' ? 'rgba(0, 35, 106, 0.05)' : type === 'warn' ? 'rgba(255, 138, 0, 0.05)' : type === 'error' ? 'rgba(238, 0, 0, 0.05)' : type === 'success' ? 'rgba(13, 165, 116, 0.05)' : ''
|
|
1526
|
+
}
|
|
1527
|
+
}, type === 'info' ? /*#__PURE__*/React__default["default"].createElement(SvgToasterInfo, null) : type === 'warn' ? /*#__PURE__*/React__default["default"].createElement(SvgToasterWarning, null) : type === 'error' ? /*#__PURE__*/React__default["default"].createElement(SvgToasterError, null) : type === 'success' ? /*#__PURE__*/React__default["default"].createElement(SvgToasterSuccess, null) : ''), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1528
|
+
style: {
|
|
1529
|
+
height: '100%',
|
|
1530
|
+
width: 'calc(100% - 90px)'
|
|
1531
|
+
}
|
|
1532
|
+
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
1533
|
+
style: {
|
|
1534
|
+
fontWeight: 600,
|
|
1535
|
+
color: '#3C393E',
|
|
1536
|
+
fontSize: '16px',
|
|
1537
|
+
lineHeight: '22px',
|
|
1538
|
+
fontStyle: 'normal',
|
|
1539
|
+
fontFamily: ''
|
|
1540
|
+
}
|
|
1541
|
+
}, title ? title.length > 25 ? title.substr(0, 25) + '...' : title : ''), /*#__PURE__*/React__default["default"].createElement("span", {
|
|
1542
|
+
style: {
|
|
1543
|
+
fontWeight: 500,
|
|
1544
|
+
color: '#3C393E',
|
|
1545
|
+
fontSize: '12px',
|
|
1546
|
+
lineHeight: '16px',
|
|
1547
|
+
fontStyle: 'normal',
|
|
1548
|
+
fontFamily: '',
|
|
1549
|
+
opacity: 0.8
|
|
1550
|
+
}
|
|
1551
|
+
}, description ? description.length > 120 ? description.substr(0, 120) + '...' : description : '')), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1552
|
+
onClick: () => handleCloseToaster(ref),
|
|
1553
|
+
style: {
|
|
1554
|
+
width: '18px',
|
|
1555
|
+
height: '18px',
|
|
1556
|
+
cursor: 'pointer'
|
|
1557
|
+
}
|
|
1558
|
+
}, /*#__PURE__*/React__default["default"].createElement(SvgToasterClose, null)));
|
|
1559
|
+
};
|
|
1560
|
+
Toast.propTypes = {
|
|
1561
|
+
timer: PropTypes__default["default"].number,
|
|
1562
|
+
title: PropTypes__default["default"].string,
|
|
1563
|
+
description: PropTypes__default["default"].string,
|
|
1564
|
+
removeToast: PropTypes__default["default"].func.isRequired,
|
|
1565
|
+
position: PropTypes__default["default"].oneOf(Object.values(ToasterPosition)),
|
|
1566
|
+
type: PropTypes__default["default"].oneOf(Object.values(ToasterType)).isRequired
|
|
1567
|
+
};
|
|
1568
|
+
Toast.defaultProps = {
|
|
1569
|
+
timer: 5000,
|
|
1570
|
+
position: 'top-right',
|
|
1571
|
+
title: 'toaster title'
|
|
1572
|
+
};
|
|
1573
|
+
|
|
1574
|
+
let toastify;
|
|
1575
|
+
let path = window.location.href;
|
|
1576
|
+
const removeToast = ref => {
|
|
1577
|
+
const node = ReactDOM__default["default"].findDOMNode(ref.current);
|
|
1578
|
+
const removeElem = node.parentNode;
|
|
1579
|
+
const parent = removeElem.parentNode;
|
|
1580
|
+
parent.removeChild(removeElem);
|
|
1581
|
+
if (!parent.hasChildNodes()) {
|
|
1582
|
+
toastify.removeChild(parent);
|
|
1583
|
+
}
|
|
1584
|
+
};
|
|
1585
|
+
const createToast = ({
|
|
1586
|
+
type,
|
|
1587
|
+
timer,
|
|
1588
|
+
title,
|
|
1589
|
+
position,
|
|
1590
|
+
description
|
|
1591
|
+
}) => {
|
|
1592
|
+
let toastParentBlock;
|
|
1593
|
+
if (!toastify) {
|
|
1594
|
+
toastify = document.getElementById('toastify');
|
|
1595
|
+
}
|
|
1596
|
+
const toastBlock = document.createElement('div');
|
|
1597
|
+
toastBlock.style.position = 'relative';
|
|
1598
|
+
toastBlock.style.flexShrink = 0;
|
|
1599
|
+
toastBlock.style.width = '440px';
|
|
1600
|
+
toastBlock.style.height = '83px';
|
|
1601
|
+
toastBlock.style.marginBottom = '20px';
|
|
1602
|
+
const newElem = /*#__PURE__*/React__default["default"].createElement(Toast, {
|
|
1603
|
+
type,
|
|
1604
|
+
timer,
|
|
1605
|
+
title,
|
|
1606
|
+
position,
|
|
1607
|
+
removeToast,
|
|
1608
|
+
description
|
|
1609
|
+
});
|
|
1610
|
+
ReactDOM__default["default"].render(newElem, toastBlock);
|
|
1611
|
+
if (!document.getElementById(styles$5[position]) || document.getElementById(styles$5[position]) == null) {
|
|
1612
|
+
toastParentBlock = document.createElement('div');
|
|
1613
|
+
toastParentBlock.style.position = 'fixed';
|
|
1614
|
+
toastParentBlock.style.display = 'flex';
|
|
1615
|
+
toastParentBlock.style.zIndex = 99999;
|
|
1616
|
+
toastParentBlock.style.flexDirection = position === 'top-left' || position === 'top-right' || position === 'top-center' ? 'column-reverse' : 'column';
|
|
1617
|
+
toastParentBlock.setAttribute('id', styles$5[position]);
|
|
1618
|
+
toastParentBlock.appendChild(toastBlock);
|
|
1619
|
+
toastify.appendChild(toastParentBlock);
|
|
1620
|
+
} else {
|
|
1621
|
+
document.getElementById(styles$5[position]).appendChild(toastBlock);
|
|
1622
|
+
}
|
|
1623
|
+
};
|
|
1624
|
+
const toast = {
|
|
1625
|
+
success: (title, props) => {
|
|
1626
|
+
const {
|
|
1627
|
+
timer,
|
|
1628
|
+
position,
|
|
1629
|
+
description
|
|
1630
|
+
} = props || {};
|
|
1631
|
+
createToast({
|
|
1632
|
+
title,
|
|
1633
|
+
type: 'success',
|
|
1634
|
+
timer: timer ? timer : 5000,
|
|
1635
|
+
position: position ? position : 'top-right',
|
|
1636
|
+
description: description ? description : ''
|
|
1637
|
+
});
|
|
1638
|
+
},
|
|
1639
|
+
info: (title, props) => {
|
|
1640
|
+
const {
|
|
1641
|
+
timer,
|
|
1642
|
+
position,
|
|
1643
|
+
description
|
|
1644
|
+
} = props || {};
|
|
1645
|
+
createToast({
|
|
1646
|
+
title,
|
|
1647
|
+
type: 'info',
|
|
1648
|
+
timer: timer ? timer : 5000,
|
|
1649
|
+
position: position ? position : 'top-right',
|
|
1650
|
+
description: description ? description : ''
|
|
1651
|
+
});
|
|
1652
|
+
},
|
|
1653
|
+
warn: (title, props) => {
|
|
1654
|
+
const {
|
|
1655
|
+
timer,
|
|
1656
|
+
position,
|
|
1657
|
+
description
|
|
1658
|
+
} = props || {};
|
|
1659
|
+
createToast({
|
|
1660
|
+
title,
|
|
1661
|
+
type: 'warn',
|
|
1662
|
+
timer: timer ? timer : 5000,
|
|
1663
|
+
position: position ? position : 'top-right',
|
|
1664
|
+
description: description ? description : ''
|
|
1665
|
+
});
|
|
1666
|
+
},
|
|
1667
|
+
error: (title, props) => {
|
|
1668
|
+
const {
|
|
1669
|
+
timer,
|
|
1670
|
+
position,
|
|
1671
|
+
description
|
|
1672
|
+
} = props || {};
|
|
1673
|
+
createToast({
|
|
1674
|
+
title,
|
|
1675
|
+
type: 'error',
|
|
1676
|
+
timer: timer ? timer : 5000,
|
|
1677
|
+
position: position ? position : 'top-right',
|
|
1678
|
+
description: description ? description : ''
|
|
1679
|
+
});
|
|
1680
|
+
}
|
|
1681
|
+
};
|
|
1682
|
+
const Toaster = () => {
|
|
1683
|
+
window.addEventListener('popstate', () => {
|
|
1684
|
+
if (path !== window.location.href) {
|
|
1685
|
+
if (!toastify) {
|
|
1686
|
+
toastify = document.getElementById('toastify');
|
|
1687
|
+
}
|
|
1688
|
+
if (toastify.hasChildNodes()) {
|
|
1689
|
+
toastify.innerHTML = '';
|
|
1690
|
+
}
|
|
1691
|
+
path = window.location.href;
|
|
1692
|
+
}
|
|
1693
|
+
});
|
|
1694
|
+
const handleToasterClick = e => {
|
|
1695
|
+
e.stopPropagation();
|
|
1696
|
+
};
|
|
1697
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1698
|
+
onClick: handleToasterClick,
|
|
1699
|
+
id: "toastify"
|
|
1700
|
+
});
|
|
1701
|
+
};
|
|
1702
|
+
|
|
1703
|
+
var ReactInfoIcon = "<svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n<path d=\"M8 0C3.58214 0 0 3.58214 0 8C0 12.4179 3.58214 16 8 16C12.4179 16 16 12.4179 16 8C16 3.58214 12.4179 0 8 0ZM8.57143 11.8571C8.57143 11.9357 8.50714 12 8.42857 12H7.57143C7.49286 12 7.42857 11.9357 7.42857 11.8571V7C7.42857 6.92143 7.49286 6.85714 7.57143 6.85714H8.42857C8.50714 6.85714 8.57143 6.92143 8.57143 7V11.8571ZM8 5.71429C7.7757 5.70971 7.56213 5.61739 7.40513 5.45714C7.24812 5.2969 7.16018 5.08149 7.16018 4.85714C7.16018 4.6328 7.24812 4.41739 7.40513 4.25714C7.56213 4.0969 7.7757 4.00458 8 4C8.2243 4.00458 8.43787 4.0969 8.59488 4.25714C8.75189 4.41739 8.83982 4.6328 8.83982 4.85714C8.83982 5.08149 8.75189 5.2969 8.59488 5.45714C8.43787 5.61739 8.2243 5.70971 8 5.71429Z\" fill=\"#D1D1D1\"/>\r\n</svg>";
|
|
1344
1704
|
|
|
1345
1705
|
var css_248z$4 = ".tooltip-module_tooltip-block__v8U9u{align-items:center;display:flex;justify-content:center;position:relative}.tooltip-module_tooltip__emM6A{padding:10px;position:absolute;z-index:1}.tooltip-module_tooltip-rel__to9gq{align-items:center;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;display:flex;height:auto;justify-content:center;min-height:10px;min-width:30px;position:relative;width:auto}.tooltip-module_tooltip-decor__qvt7t{border-radius:2px;-webkit-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;-o-border-radius:2px;height:10px;position:absolute;transform:rotate(45deg);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);width:10px;z-index:-1}";
|
|
1346
1706
|
var styles$4 = {"tooltip-block":"tooltip-module_tooltip-block__v8U9u","tooltip":"tooltip-module_tooltip__emM6A","tooltip-rel":"tooltip-module_tooltip-rel__to9gq","tooltip-decor":"tooltip-module_tooltip-decor__qvt7t"};
|
|
@@ -1811,7 +2171,10 @@ const Autocomplate = ({
|
|
|
1811
2171
|
setShowOptions(!showOptions);
|
|
1812
2172
|
},
|
|
1813
2173
|
value: inputValue,
|
|
1814
|
-
placeholder: placeHolder
|
|
2174
|
+
placeholder: placeHolder,
|
|
2175
|
+
style: {
|
|
2176
|
+
cursor: disabled ? 'not-allowed' : 'auto'
|
|
2177
|
+
}
|
|
1815
2178
|
}, props)), errorMessage ? /*#__PURE__*/React__default["default"].createElement("span", {
|
|
1816
2179
|
className: styles.errorMessage
|
|
1817
2180
|
}, errorMessage) : null, optionList));
|
|
@@ -1849,6 +2212,8 @@ exports.Select = Select;
|
|
|
1849
2212
|
exports.SelectCheckbox = SelectCheckbox;
|
|
1850
2213
|
exports.Stepper = Stepper;
|
|
1851
2214
|
exports.Table = Table;
|
|
2215
|
+
exports.Toaster = Toaster;
|
|
1852
2216
|
exports.Tooltip = Tooltip;
|
|
1853
2217
|
exports.Typography = Typography;
|
|
1854
2218
|
exports.TypographyType = TypographyType;
|
|
2219
|
+
exports.toast = toast;
|