@xaypay/tui 0.0.6 → 0.0.7
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 +56 -535
- package/dist/index.js +37 -525
- package/package.json +2 -3
package/dist/index.es.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import * as React
|
|
2
|
-
import React__default, { useState
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import React__default, { useState } from 'react';
|
|
3
3
|
import PropTypes from 'prop-types';
|
|
4
4
|
import classnames from 'classnames';
|
|
5
5
|
import styled from 'styled-components';
|
|
@@ -48,9 +48,9 @@ function styleInject(css, ref) {
|
|
|
48
48
|
}
|
|
49
49
|
}
|
|
50
50
|
|
|
51
|
-
var css_248z$
|
|
52
|
-
var styles$
|
|
53
|
-
styleInject(css_248z$
|
|
51
|
+
var css_248z$3 = ".button-module_btn__ffRtT{border:none;border-radius:6px;box-sizing:border-box;cursor:pointer;font-size:16px;line-height:20px;min-height:46px;outline:none;overflow:hidden;padding:12px 20px;text-transform:capitalize;transition:background-color .24s,color .24s}.button-module_btn__ffRtT.button-module_full-size__vmV2E{width:100%}.button-module_btn__ffRtT.button-module_content-size__f7JSE{width:auto}.button-module_btn__ffRtT.button-module_type-filled__BiyVo{background-color:#00236a;color:#fff}.button-module_btn__ffRtT.button-module_type-filled__BiyVo:hover{background-color:#001745}.button-module_btn__ffRtT.button-module_type-filled__BiyVo:disabled{background-color:#eee;color:#3c393e;pointer-events:none}.button-module_btn__ffRtT.button-module_type-outline__RpZ2V{background-color:#fff;box-shadow:inset 0 0 0 2px #00236a}.button-module_btn__ffRtT.button-module_type-outline__RpZ2V:hover{background-color:#001745;color:#fff}.button-module_btn__ffRtT.button-module_type-outline__RpZ2V:disabled{box-shadow:inset 0 0 0 2px #eee;color:#3c393e;pointer-events:none}";
|
|
52
|
+
var styles$2 = {"btn":"button-module_btn__ffRtT","full-size":"button-module_full-size__vmV2E","content-size":"button-module_content-size__f7JSE","size-default":"button-module_size-default__ydEgl","type-filled":"button-module_type-filled__BiyVo","with-icon":"button-module_with-icon__mfKU-","type-outline":"button-module_type-outline__RpZ2V"};
|
|
53
|
+
styleInject(css_248z$3);
|
|
54
54
|
|
|
55
55
|
/**
|
|
56
56
|
* Primary UI component for user interaction
|
|
@@ -86,9 +86,9 @@ const Button = ({
|
|
|
86
86
|
outline,
|
|
87
87
|
...props
|
|
88
88
|
}) => {
|
|
89
|
-
console.log(styles$
|
|
89
|
+
console.log(styles$2);
|
|
90
90
|
console.log(backgroundColor);
|
|
91
|
-
const classProps = classnames(styles$
|
|
91
|
+
const classProps = classnames(styles$2.btn, styles$2[theme], styles$2[size], outline ? styles$2['type-outline'] : styles$2['type-filled'], className); // className='btn type-outline size-default'
|
|
92
92
|
|
|
93
93
|
console.log(classProps);
|
|
94
94
|
return /*#__PURE__*/React__default.createElement("button", _extends({
|
|
@@ -140,8 +140,8 @@ Button.defaultProps = {
|
|
|
140
140
|
outline: false
|
|
141
141
|
};
|
|
142
142
|
|
|
143
|
-
var css_248z$
|
|
144
|
-
styleInject(css_248z$
|
|
143
|
+
var css_248z$2 = "h1{font-size:70px;line-height:70px}h1,h2{font-weight:400;text-transform:uppercase}h2{font-size:50px;line-height:50px}h3{font-size:38px;font-weight:400;line-height:38px}h3,h4{text-transform:uppercase}h4{font-size:24px;font-weight:600;line-height:24px}h5{font-size:20px;font-size:16px;line-height:20px;line-height:22px;text-transform:uppercase}h5,p{font-weight:600;text-transform:capitalize}p{font-size:14px;line-height:20px}span{font-size:12px;font-weight:500;line-height:16px;text-transform:capitalize}i{font-family:icomoon;font-style:inherit}";
|
|
144
|
+
styleInject(css_248z$2);
|
|
145
145
|
|
|
146
146
|
const TypographyType = {
|
|
147
147
|
h1: 'h1',
|
|
@@ -190,9 +190,9 @@ Typography.defaultProps = {
|
|
|
190
190
|
variant: 'h1'
|
|
191
191
|
};
|
|
192
192
|
|
|
193
|
-
var css_248z$
|
|
194
|
-
var styles$
|
|
195
|
-
styleInject(css_248z$
|
|
193
|
+
var css_248z$1 = ".autocomplate-module_autocomplate-content__UbIUT{display:flex;flex-direction:column}.autocomplate-module_autocomplate-content-top__FVgCp{border:2px solid #d1d1d1;border-radius:6px;box-sizing:border-box;color:#3c393e;cursor:pointer;display:flex;flex-direction:row;font-size:16px;font-weight:500;height:46px;line-height:22px;max-width:400px;padding:0 15px;transition:border-color .24s}.autocomplate-module_autocomplate-content-top__FVgCp.autocomplate-module_active__40fdV{border-color:#00236a}.autocomplate-module_autocomplate-content-top__FVgCp:hover{border-color:#3c393e}.autocomplate-module_autocomplate-content-bottom__yk0zP{animation:autocomplate-module_select-show__7Uap4 .64s linear forwards;background:#fbfbfb;border-radius:6px;box-shadow:0 0 10px rgba(60,57,62,.08);max-height:0;max-width:400px;overflow:hidden;position:relative;top:6px}.autocomplate-module_autocomplate-content-bottom-inner__rF5IF{display:flex;flex-direction:column;max-height:234px;overflow-x:hidden;overflow-y:auto}@keyframes autocomplate-module_select-show__7Uap4{to{max-height:400px}}.autocomplate-module_autocomplate-content-bottom-row__dRsZa{align-items:center;background:#fff;box-sizing:border-box;color:#3c393e;cursor:pointer;display:flex;font-size:16px;font-weight:500;height:46px;line-height:22px;margin-bottom:2px;padding:0 15px;transition:background .24s,color .24s}.autocomplate-module_autocomplate-content-bottom-row__dRsZa .autocomplate-module_no-option__xv0-E{color:red}.autocomplate-module_autocomplate-content-bottom-row__dRsZa:hover{background:unset;color:#00236a}.autocomplate-module_option-active__WuH4I .autocomplate-module_autocomplate-content-bottom-row__dRsZa{color:#00236a}";
|
|
194
|
+
var styles$1 = {"autocomplate-content":"autocomplate-module_autocomplate-content__UbIUT","autocomplate-content-top":"autocomplate-module_autocomplate-content-top__FVgCp","active":"autocomplate-module_active__40fdV","autocomplate-content-bottom":"autocomplate-module_autocomplate-content-bottom__yk0zP","select-show":"autocomplate-module_select-show__7Uap4","autocomplate-content-bottom-inner":"autocomplate-module_autocomplate-content-bottom-inner__rF5IF","autocomplate-content-bottom-row":"autocomplate-module_autocomplate-content-bottom-row__dRsZa","no-option":"autocomplate-module_no-option__xv0-E","option-active":"autocomplate-module_option-active__WuH4I"};
|
|
195
|
+
styleInject(css_248z$1);
|
|
196
196
|
|
|
197
197
|
const Autocomplate = ({
|
|
198
198
|
className,
|
|
@@ -205,7 +205,7 @@ const Autocomplate = ({
|
|
|
205
205
|
searchCount,
|
|
206
206
|
...props
|
|
207
207
|
}) => {
|
|
208
|
-
classnames(styles$
|
|
208
|
+
classnames(styles$1.searchBox, className);
|
|
209
209
|
const [inputValue, setInputValue] = useState("");
|
|
210
210
|
const [activeOption, setActiveOption] = useState(0);
|
|
211
211
|
const [filteredOptions, setFilteredOptions] = useState([]);
|
|
@@ -233,9 +233,9 @@ const Autocomplate = ({
|
|
|
233
233
|
if (showOptions && inputValue) {
|
|
234
234
|
if (filteredOptions.length && inputValue.length >= searchCount) {
|
|
235
235
|
optionList = /*#__PURE__*/React__default.createElement("div", {
|
|
236
|
-
className: styles$
|
|
236
|
+
className: styles$1['autocomplate-content-bottom']
|
|
237
237
|
}, /*#__PURE__*/React__default.createElement("div", {
|
|
238
|
-
className: styles$
|
|
238
|
+
className: styles$1['autocomplate-content-bottom-inner']
|
|
239
239
|
}, filteredOptions.map((optionName, index) => {
|
|
240
240
|
let className;
|
|
241
241
|
|
|
@@ -244,33 +244,33 @@ const Autocomplate = ({
|
|
|
244
244
|
}
|
|
245
245
|
|
|
246
246
|
return /*#__PURE__*/React__default.createElement("div", {
|
|
247
|
-
className: styles$
|
|
247
|
+
className: styles$1[className],
|
|
248
248
|
key: optionName,
|
|
249
249
|
onClick: handleClick
|
|
250
250
|
}, /*#__PURE__*/React__default.createElement("div", {
|
|
251
|
-
className: styles$
|
|
251
|
+
className: styles$1['autocomplate-content-bottom-row']
|
|
252
252
|
}, optionName));
|
|
253
253
|
})));
|
|
254
254
|
} else {
|
|
255
255
|
optionList = /*#__PURE__*/React__default.createElement("div", {
|
|
256
|
-
className: styles$
|
|
256
|
+
className: styles$1['autocomplate-content-bottom']
|
|
257
257
|
}, /*#__PURE__*/React__default.createElement("div", {
|
|
258
|
-
className: styles$
|
|
258
|
+
className: styles$1['autocomplate-content-bottom-inner']
|
|
259
259
|
}, /*#__PURE__*/React__default.createElement("div", {
|
|
260
|
-
className: styles$
|
|
260
|
+
className: styles$1['autocomplate-content-bottom-row']
|
|
261
261
|
}, /*#__PURE__*/React__default.createElement("div", {
|
|
262
|
-
className: styles$
|
|
262
|
+
className: styles$1['no-option']
|
|
263
263
|
}, "No Option!"))));
|
|
264
264
|
}
|
|
265
265
|
}
|
|
266
266
|
|
|
267
267
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, label ? /*#__PURE__*/React__default.createElement("label", {
|
|
268
|
-
className: styles$
|
|
268
|
+
className: styles$1.labelInput
|
|
269
269
|
}, label) : "", /*#__PURE__*/React__default.createElement("div", {
|
|
270
|
-
className: styles$
|
|
270
|
+
className: styles$1['autocomplate-content']
|
|
271
271
|
}, /*#__PURE__*/React__default.createElement("input", _extends({
|
|
272
272
|
type: "text",
|
|
273
|
-
className: styles$
|
|
273
|
+
className: styles$1['autocomplate-content-top'],
|
|
274
274
|
required: required,
|
|
275
275
|
disabled: disabled,
|
|
276
276
|
onChange: handleChange,
|
|
@@ -293,9 +293,9 @@ Autocomplate.defaultProps = {
|
|
|
293
293
|
searchCount: 2
|
|
294
294
|
};
|
|
295
295
|
|
|
296
|
-
var css_248z
|
|
297
|
-
var styles
|
|
298
|
-
styleInject(css_248z
|
|
296
|
+
var css_248z = ".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;display:inline-block;height:14px;left:0;margin-right:4px;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}";
|
|
297
|
+
var styles = {"checkbox-wrap":"checkbox-module_checkbox-wrap__Xrg-m","checkmark":"checkbox-module_checkmark__M8DY6"};
|
|
298
|
+
styleInject(css_248z);
|
|
299
299
|
|
|
300
300
|
const Checkbox = ({
|
|
301
301
|
disabled,
|
|
@@ -309,7 +309,7 @@ const Checkbox = ({
|
|
|
309
309
|
keyNames,
|
|
310
310
|
...props
|
|
311
311
|
}) => {
|
|
312
|
-
const classProps = classnames(styles
|
|
312
|
+
const classProps = classnames(styles.checkbox, className);
|
|
313
313
|
const parseData = jsonData.length !== 0 ? JSON.parse(jsonData) : [];
|
|
314
314
|
const [data, setData] = useState(parseData);
|
|
315
315
|
|
|
@@ -333,7 +333,7 @@ const Checkbox = ({
|
|
|
333
333
|
|
|
334
334
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, data.map(element => {
|
|
335
335
|
return /*#__PURE__*/React__default.createElement("label", {
|
|
336
|
-
className: styles
|
|
336
|
+
className: styles["checkbox-wrap"],
|
|
337
337
|
key: element.value
|
|
338
338
|
}, /*#__PURE__*/React__default.createElement("input", _extends({
|
|
339
339
|
type: "checkbox",
|
|
@@ -344,9 +344,9 @@ const Checkbox = ({
|
|
|
344
344
|
name: name ? name : element.name,
|
|
345
345
|
onChange: handleChange
|
|
346
346
|
}, props)), /*#__PURE__*/React__default.createElement("span", {
|
|
347
|
-
className: styles
|
|
347
|
+
className: styles["checkmark"]
|
|
348
348
|
}), element.label ? /*#__PURE__*/React__default.createElement("span", {
|
|
349
|
-
className: styles
|
|
349
|
+
className: styles.labelRadio
|
|
350
350
|
}, label ? label : element.label) : "");
|
|
351
351
|
}));
|
|
352
352
|
};
|
|
@@ -371,7 +371,7 @@ const SvgHeartFilled = ({
|
|
|
371
371
|
title,
|
|
372
372
|
titleId,
|
|
373
373
|
...props
|
|
374
|
-
}) => /*#__PURE__*/React
|
|
374
|
+
}) => /*#__PURE__*/React.createElement("svg", _extends({
|
|
375
375
|
xmlns: "http://www.w3.org/2000/svg",
|
|
376
376
|
width: "1em",
|
|
377
377
|
height: "1em",
|
|
@@ -382,9 +382,9 @@ const SvgHeartFilled = ({
|
|
|
382
382
|
xmlSpace: "preserve",
|
|
383
383
|
role: "img",
|
|
384
384
|
"aria-labelledby": titleId
|
|
385
|
-
}, props), title ? /*#__PURE__*/React
|
|
385
|
+
}, props), title ? /*#__PURE__*/React.createElement("title", {
|
|
386
386
|
id: titleId
|
|
387
|
-
}, title) : null, /*#__PURE__*/React
|
|
387
|
+
}, title) : null, /*#__PURE__*/React.createElement("path", {
|
|
388
388
|
d: "M475.366 71.951c-24.175-23.606-57.575-35.404-100.215-35.404-11.8 0-23.843 2.046-36.117 6.136-12.279 4.093-23.702 9.615-34.256 16.562-10.568 6.945-19.65 13.467-27.269 19.556a263.828 263.828 0 0 0-21.696 19.414 264.184 264.184 0 0 0-21.698-19.414c-7.616-6.089-16.702-12.607-27.268-19.556-10.564-6.95-21.985-12.468-34.261-16.562-12.275-4.089-24.316-6.136-36.116-6.136-42.637 0-76.039 11.801-100.211 35.404C12.087 95.552 0 128.288 0 170.162c0 12.753 2.24 25.889 6.711 39.398 4.471 13.514 9.566 25.031 15.275 34.546 5.708 9.514 12.181 18.796 19.414 27.837 7.233 9.042 12.519 15.27 15.846 18.699 3.33 3.422 5.948 5.899 7.851 7.419L243.25 469.937c3.427 3.429 7.614 5.144 12.562 5.144s9.138-1.715 12.563-5.137l177.87-171.307c43.588-43.583 65.38-86.41 65.38-128.475.001-41.874-12.088-74.61-36.259-98.211z",
|
|
389
389
|
fill: "currentColor"
|
|
390
390
|
}));
|
|
@@ -393,7 +393,7 @@ const SvgHeartOutline = ({
|
|
|
393
393
|
title,
|
|
394
394
|
titleId,
|
|
395
395
|
...props
|
|
396
|
-
}) => /*#__PURE__*/React
|
|
396
|
+
}) => /*#__PURE__*/React.createElement("svg", _extends({
|
|
397
397
|
xmlns: "http://www.w3.org/2000/svg",
|
|
398
398
|
viewBox: "0 0 471.701 471.701",
|
|
399
399
|
style: {
|
|
@@ -404,9 +404,9 @@ const SvgHeartOutline = ({
|
|
|
404
404
|
height: "1em",
|
|
405
405
|
role: "img",
|
|
406
406
|
"aria-labelledby": titleId
|
|
407
|
-
}, props), title ? /*#__PURE__*/React
|
|
407
|
+
}, props), title ? /*#__PURE__*/React.createElement("title", {
|
|
408
408
|
id: titleId
|
|
409
|
-
}, title) : null, /*#__PURE__*/React
|
|
409
|
+
}, title) : null, /*#__PURE__*/React.createElement("path", {
|
|
410
410
|
d: "M433.601 67.001c-24.7-24.7-57.4-38.2-92.3-38.2s-67.7 13.6-92.4 38.3l-12.9 12.9-13.1-13.1c-24.7-24.7-57.6-38.4-92.5-38.4-34.8 0-67.6 13.6-92.2 38.2-24.7 24.7-38.3 57.5-38.2 92.4 0 34.9 13.7 67.6 38.4 92.3l187.8 187.8c2.6 2.6 6.1 4 9.5 4 3.4 0 6.9-1.3 9.5-3.9l188.2-187.5c24.7-24.7 38.3-57.5 38.3-92.4.1-34.9-13.4-67.7-38.1-92.4zm-19.2 165.7-178.7 178-178.3-178.3c-19.6-19.6-30.4-45.6-30.4-73.3s10.7-53.7 30.3-73.2c19.5-19.5 45.5-30.3 73.1-30.3 27.7 0 53.8 10.8 73.4 30.4l22.6 22.6c5.3 5.3 13.8 5.3 19.1 0l22.4-22.4c19.6-19.6 45.7-30.4 73.3-30.4 27.6 0 53.6 10.8 73.2 30.3 19.6 19.6 30.3 45.6 30.3 73.3.1 27.7-10.7 53.7-30.3 73.3z",
|
|
411
411
|
fill: "currentColor"
|
|
412
412
|
}));
|
|
@@ -415,22 +415,22 @@ const SvgLikeFilled = ({
|
|
|
415
415
|
title,
|
|
416
416
|
titleId,
|
|
417
417
|
...props
|
|
418
|
-
}) => /*#__PURE__*/React
|
|
418
|
+
}) => /*#__PURE__*/React.createElement("svg", _extends({
|
|
419
419
|
width: "1em",
|
|
420
420
|
height: "1em",
|
|
421
421
|
viewBox: "0 0 23 20",
|
|
422
422
|
xmlns: "http://www.w3.org/2000/svg",
|
|
423
423
|
role: "img",
|
|
424
424
|
"aria-labelledby": titleId
|
|
425
|
-
}, props), title ? /*#__PURE__*/React
|
|
425
|
+
}, props), title ? /*#__PURE__*/React.createElement("title", {
|
|
426
426
|
id: titleId
|
|
427
|
-
}, title) : null, /*#__PURE__*/React
|
|
427
|
+
}, title) : null, /*#__PURE__*/React.createElement("g", {
|
|
428
428
|
fill: "none",
|
|
429
429
|
fillRule: "evenodd"
|
|
430
|
-
}, /*#__PURE__*/React
|
|
430
|
+
}, /*#__PURE__*/React.createElement("path", {
|
|
431
431
|
opacity: 0.87,
|
|
432
432
|
d: "M-1-1h24v24H-1z"
|
|
433
|
-
}), /*#__PURE__*/React
|
|
433
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
434
434
|
d: "M12.12 1.06 6.58 6.6c-.37.37-.58.88-.58 1.41V18c0 1.1.9 2 2 2h9c.8 0 1.52-.48 1.84-1.21l3.26-7.61C22.94 9.2 21.49 7 19.34 7h-5.65l.95-4.58c.1-.5-.05-1.01-.41-1.37-.59-.58-1.53-.58-2.11.01ZM2 20c1.1 0 2-.9 2-2v-8c0-1.1-.9-2-2-2s-2 .9-2 2v8c0 1.1.9 2 2 2Z",
|
|
435
435
|
fill: "currentColor"
|
|
436
436
|
})));
|
|
@@ -439,22 +439,22 @@ const SvgLikeOutline = ({
|
|
|
439
439
|
title,
|
|
440
440
|
titleId,
|
|
441
441
|
...props
|
|
442
|
-
}) => /*#__PURE__*/React
|
|
442
|
+
}) => /*#__PURE__*/React.createElement("svg", _extends({
|
|
443
443
|
width: "1em",
|
|
444
444
|
height: "1em",
|
|
445
445
|
viewBox: "0 0 22 20",
|
|
446
446
|
xmlns: "http://www.w3.org/2000/svg",
|
|
447
447
|
role: "img",
|
|
448
448
|
"aria-labelledby": titleId
|
|
449
|
-
}, props), title ? /*#__PURE__*/React
|
|
449
|
+
}, props), title ? /*#__PURE__*/React.createElement("title", {
|
|
450
450
|
id: titleId
|
|
451
|
-
}, title) : null, /*#__PURE__*/React
|
|
451
|
+
}, title) : null, /*#__PURE__*/React.createElement("g", {
|
|
452
452
|
fill: "none",
|
|
453
453
|
fillRule: "evenodd"
|
|
454
|
-
}, /*#__PURE__*/React
|
|
454
|
+
}, /*#__PURE__*/React.createElement("path", {
|
|
455
455
|
opacity: 0.87,
|
|
456
456
|
d: "M-1-1h24v24H-1z"
|
|
457
|
-
}), /*#__PURE__*/React
|
|
457
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
458
458
|
d: "M20 7h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L13.17 0 6.59 6.59C6.22 6.95 6 7.45 6 8v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73V9c0-1.1-.9-2-2-2Zm0 4-3 7H8V8l4.34-4.34L11.23 9H20v2ZM0 8h4v12H0V8Z",
|
|
459
459
|
fill: "currentColor"
|
|
460
460
|
})));
|
|
@@ -463,21 +463,21 @@ const SvgStarFilled = ({
|
|
|
463
463
|
title,
|
|
464
464
|
titleId,
|
|
465
465
|
...props
|
|
466
|
-
}) => /*#__PURE__*/React
|
|
466
|
+
}) => /*#__PURE__*/React.createElement("svg", _extends({
|
|
467
467
|
width: "1em",
|
|
468
468
|
height: "1em",
|
|
469
469
|
viewBox: "0 0 18 17",
|
|
470
470
|
xmlns: "http://www.w3.org/2000/svg",
|
|
471
471
|
role: "img",
|
|
472
472
|
"aria-labelledby": titleId
|
|
473
|
-
}, props), title ? /*#__PURE__*/React
|
|
473
|
+
}, props), title ? /*#__PURE__*/React.createElement("title", {
|
|
474
474
|
id: titleId
|
|
475
|
-
}, title) : null, /*#__PURE__*/React
|
|
475
|
+
}, title) : null, /*#__PURE__*/React.createElement("g", {
|
|
476
476
|
fill: "none",
|
|
477
477
|
fillRule: "evenodd"
|
|
478
|
-
}, /*#__PURE__*/React
|
|
478
|
+
}, /*#__PURE__*/React.createElement("path", {
|
|
479
479
|
d: "M-3-3h24v24H-3z"
|
|
480
|
-
}), /*#__PURE__*/React
|
|
480
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
481
481
|
d: "m9 14.27 4.15 2.51c.76.46 1.69-.22 1.49-1.08l-1.1-4.72 3.67-3.18c.67-.58.31-1.68-.57-1.75l-4.83-.41-1.89-4.46c-.34-.81-1.5-.81-1.84 0L6.19 5.63l-4.83.41C.48 6.11.12 7.21.79 7.79l3.67 3.18-1.1 4.72c-.2.86.73 1.54 1.49 1.08L9 14.27Z",
|
|
482
482
|
fill: "currentColor"
|
|
483
483
|
})));
|
|
@@ -486,7 +486,7 @@ const SvgStarOutline = ({
|
|
|
486
486
|
title,
|
|
487
487
|
titleId,
|
|
488
488
|
...props
|
|
489
|
-
}) => /*#__PURE__*/React
|
|
489
|
+
}) => /*#__PURE__*/React.createElement("svg", _extends({
|
|
490
490
|
xmlns: "http://www.w3.org/2000/svg",
|
|
491
491
|
viewBox: "0 0 24 24",
|
|
492
492
|
fill: "none",
|
|
@@ -499,489 +499,10 @@ const SvgStarOutline = ({
|
|
|
499
499
|
height: "1em",
|
|
500
500
|
role: "img",
|
|
501
501
|
"aria-labelledby": titleId
|
|
502
|
-
}, props), title ? /*#__PURE__*/React
|
|
502
|
+
}, props), title ? /*#__PURE__*/React.createElement("title", {
|
|
503
503
|
id: titleId
|
|
504
|
-
}, title) : null, /*#__PURE__*/React
|
|
504
|
+
}, title) : null, /*#__PURE__*/React.createElement("path", {
|
|
505
505
|
d: "m12 2 3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"
|
|
506
506
|
}));
|
|
507
507
|
|
|
508
|
-
|
|
509
|
-
var styles$4 = {"input-wrap":"input-module_input-wrap__NunrE","input":"input-module_input__-ipHD","full-size":"input-module_full-size__38YG7","content-size":"input-module_content-size__rZ5EA","size-medium":"input-module_size-medium__frTDq","with-icon":"input-module_with-icon__w3jTW","inputErrorMessages":"input-module_inputErrorMessages__hx490","error-message-show":"input-module_error-message-show__OrVSo","labelInput":"input-module_labelInput__sUMKQ","state-disabled":"input-module_state-disabled__402v0","error-message":"input-module_error-message__7NphF"};
|
|
510
|
-
styleInject(css_248z$5);
|
|
511
|
-
|
|
512
|
-
const InputTypes = {
|
|
513
|
-
TEXT: "text",
|
|
514
|
-
PASSWORD: "password",
|
|
515
|
-
EMAIL: "email",
|
|
516
|
-
NUMBER: "number",
|
|
517
|
-
TEL: "tel"
|
|
518
|
-
};
|
|
519
|
-
const InputSizes = {
|
|
520
|
-
SMALL: "size-small",
|
|
521
|
-
MEDIUM: "size-medium",
|
|
522
|
-
LARGE: "size-large"
|
|
523
|
-
};
|
|
524
|
-
const Input = ({
|
|
525
|
-
size,
|
|
526
|
-
color,
|
|
527
|
-
className,
|
|
528
|
-
label,
|
|
529
|
-
regexp,
|
|
530
|
-
regexpError,
|
|
531
|
-
errorMesage,
|
|
532
|
-
required,
|
|
533
|
-
disabled,
|
|
534
|
-
type,
|
|
535
|
-
...props
|
|
536
|
-
}) => {
|
|
537
|
-
const [inputValue, setInputValue] = useState("");
|
|
538
|
-
|
|
539
|
-
const handleChange = event => {
|
|
540
|
-
setInputValue(event.target.value);
|
|
541
|
-
};
|
|
542
|
-
|
|
543
|
-
let eMessage = "";
|
|
544
|
-
|
|
545
|
-
if (errorMesage) {
|
|
546
|
-
eMessage = errorMesage;
|
|
547
|
-
} else if (regexp) {
|
|
548
|
-
const regex = new RegExp(regexp);
|
|
549
|
-
eMessage = regex.test(inputValue) ? "" : regexpError;
|
|
550
|
-
}
|
|
551
|
-
|
|
552
|
-
const classProps = classnames(styles$4.input, styles$4[size], eMessage != '' ? styles$4['error-message'] : "", className);
|
|
553
|
-
return /*#__PURE__*/React__default.createElement("div", {
|
|
554
|
-
className: styles$4['input-wrap']
|
|
555
|
-
}, label ? /*#__PURE__*/React__default.createElement("label", {
|
|
556
|
-
className: styles$4.labelInput
|
|
557
|
-
}, label) : "", /*#__PURE__*/React__default.createElement("input", _extends({}, props, {
|
|
558
|
-
type: type,
|
|
559
|
-
className: classProps,
|
|
560
|
-
style: color && {
|
|
561
|
-
color
|
|
562
|
-
},
|
|
563
|
-
disabled: disabled ? disabled : "",
|
|
564
|
-
onChange: handleChange,
|
|
565
|
-
value: inputValue
|
|
566
|
-
})), eMessage ? /*#__PURE__*/React__default.createElement("span", {
|
|
567
|
-
className: styles$4.inputErrorMessages
|
|
568
|
-
}, eMessage) : "");
|
|
569
|
-
};
|
|
570
|
-
Input.propTypes = {
|
|
571
|
-
type: PropTypes.oneOf(Object.values(InputTypes)),
|
|
572
|
-
size: PropTypes.oneOf(Object.values(InputSizes)),
|
|
573
|
-
color: PropTypes.string,
|
|
574
|
-
className: PropTypes.string,
|
|
575
|
-
onChange: PropTypes.func,
|
|
576
|
-
required: PropTypes.bool,
|
|
577
|
-
errorMesage: PropTypes.string,
|
|
578
|
-
regexp: PropTypes.string,
|
|
579
|
-
regexpError: PropTypes.string,
|
|
580
|
-
label: PropTypes.string.isRequired,
|
|
581
|
-
disabled: PropTypes.bool
|
|
582
|
-
};
|
|
583
|
-
Input.defaultProps = {
|
|
584
|
-
label: "",
|
|
585
|
-
color: null,
|
|
586
|
-
size: InputSizes.MEDIUM,
|
|
587
|
-
onChange: undefined,
|
|
588
|
-
required: true,
|
|
589
|
-
errorMesage: "",
|
|
590
|
-
type: "text"
|
|
591
|
-
};
|
|
592
|
-
|
|
593
|
-
var css_248z$4 = ".pagination-module_listItem__b1-WN:focus{background-color:#4caf50;color:#fff}.pagination-module_listItem__b1-WN:hover:not(.pagination-module_active__KwBDp){background-color:#ddd}.pagination-module_pagination-bar__MrtYT{display:flex;flex-direction:row;flex-wrap:nowrap;gap:8px}.pagination-module_pagination-btn__w8Yh8{border:none;border-radius:6px;outline:none}.pagination-module_pagination-btn__w8Yh8,.pagination-module_pagination-item__t3emS,.pagination-module_pagination-jump-next__LAb9Z{align-items:center;background-color:#fff;box-shadow:0 0 0 1px #eee;cursor:pointer;display:flex;height:34px;justify-content:center;width:34px}.pagination-module_pagination-item__t3emS,.pagination-module_pagination-jump-next__LAb9Z{border-radius:6px;flex:0 0 auto;font-size:16px;line-height:22px;position:relative;transition:background-color .24s}.pagination-module_pagination-item__t3emS:hover{background-color:#eee}.pagination-module_pagination-item__t3emS.pagination-module_selected__EXzCA{background-color:#00236a;color:#fff}.pagination-module_pagination-jump-next-arrow__aEVD8,.pagination-module_pagination-jump-next-txt__e7nFj{align-items:center;bottom:0;display:flex;font-size:12px;justify-content:center;left:0;line-height:14px;margin:auto;position:absolute;right:0;top:0;transition:opacity .24s,color .24s}.pagination-module_pagination-jump-next-arrow__aEVD8{opacity:0}.pagination-module_pagination-jump-next__LAb9Z:hover .pagination-module_pagination-jump-next-arrow__aEVD8{opacity:1}.pagination-module_pagination-jump-next__LAb9Z:hover .pagination-module_pagination-jump-next-txt__e7nFj{opacity:0}i{color:#3c393e;font-size:12px;line-height:12px}";
|
|
594
|
-
var styles$3 = {"listItem":"pagination-module_listItem__b1-WN","active":"pagination-module_active__KwBDp","pagination-bar":"pagination-module_pagination-bar__MrtYT","pagination-btn":"pagination-module_pagination-btn__w8Yh8","pagination-item":"pagination-module_pagination-item__t3emS","pagination-jump-next":"pagination-module_pagination-jump-next__LAb9Z","selected":"pagination-module_selected__EXzCA","pagination-jump-next-txt":"pagination-module_pagination-jump-next-txt__e7nFj","pagination-jump-next-arrow":"pagination-module_pagination-jump-next-arrow__aEVD8"};
|
|
595
|
-
styleInject(css_248z$4);
|
|
596
|
-
|
|
597
|
-
const Dots = "...";
|
|
598
|
-
|
|
599
|
-
const range = (start, end) => {
|
|
600
|
-
const length = end - start + 1;
|
|
601
|
-
return Array.from({
|
|
602
|
-
length
|
|
603
|
-
}, (_, idx) => idx + start);
|
|
604
|
-
};
|
|
605
|
-
|
|
606
|
-
const PaginationRange = ({
|
|
607
|
-
currentTotalCount,
|
|
608
|
-
offset,
|
|
609
|
-
siblingCountNumber,
|
|
610
|
-
currentPageNumber
|
|
611
|
-
}) => {
|
|
612
|
-
const paginationRange = useMemo(() => {
|
|
613
|
-
const totalPageCount = Math.ceil(currentTotalCount / offset); //currentPage + 2*Dots + start + end = 5
|
|
614
|
-
|
|
615
|
-
const totalPageNumber = siblingCountNumber + 5;
|
|
616
|
-
|
|
617
|
-
if (totalPageNumber >= totalPageCount) {
|
|
618
|
-
return range(1, totalPageCount);
|
|
619
|
-
}
|
|
620
|
-
|
|
621
|
-
const rightSiblingIndex = Math.min(currentPageNumber + siblingCountNumber, totalPageCount);
|
|
622
|
-
const leftSiblingIndex = Math.max(currentPageNumber - siblingCountNumber, 1);
|
|
623
|
-
const shouldShowLeftDots = leftSiblingIndex > 2;
|
|
624
|
-
const shouldShowRightDots = rightSiblingIndex < totalPageCount - 2;
|
|
625
|
-
const firstPageIndex = 1;
|
|
626
|
-
const lastPageIndex = totalPageCount;
|
|
627
|
-
|
|
628
|
-
if (!shouldShowLeftDots && shouldShowRightDots) {
|
|
629
|
-
let leftItemCount = currentPageNumber === 4 && lastPageIndex > 7 ? 4 + siblingCountNumber : 3 + siblingCountNumber;
|
|
630
|
-
let leftRange = range(1, leftItemCount);
|
|
631
|
-
return [...leftRange, Dots, totalPageCount];
|
|
632
|
-
}
|
|
633
|
-
|
|
634
|
-
if (shouldShowLeftDots && !shouldShowRightDots) {
|
|
635
|
-
let rightItemCount = currentPageNumber === lastPageIndex - 3 && lastPageIndex > 7 ? rightItemCount = 4 + siblingCountNumber : rightItemCount = 3 + siblingCountNumber;
|
|
636
|
-
let rightRange = range(totalPageCount - rightItemCount + 1, totalPageCount);
|
|
637
|
-
return [firstPageIndex, Dots, ...rightRange];
|
|
638
|
-
}
|
|
639
|
-
|
|
640
|
-
if (shouldShowLeftDots && shouldShowRightDots) {
|
|
641
|
-
let middleRange = range(leftSiblingIndex, rightSiblingIndex);
|
|
642
|
-
return [firstPageIndex, Dots, ...middleRange, Dots, lastPageIndex];
|
|
643
|
-
}
|
|
644
|
-
}, [currentTotalCount, offset, siblingCountNumber, currentPageNumber]);
|
|
645
|
-
return paginationRange;
|
|
646
|
-
};
|
|
647
|
-
|
|
648
|
-
var css_248z$3 = "@font-face{font-display:block;font-family:icomoon;font-style:normal;font-weight:400;src:url(fonts/icomoon.eot?b29ky3);src:url(fonts/icomoon.eot?b29ky3#iefix) format(\"embedded-opentype\"),url(fonts/icomoon.ttf?b29ky3) format(\"truetype\"),url(fonts/icomoon.woff?b29ky3) format(\"woff\"),url(fonts/icomoon.svg?b29ky3#icomoon) format(\"svg\")}[class*=\" icon-\"],[class^=icon-]{speak:never;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:icomoon!important;font-style:normal;font-variant:normal;font-weight:400;line-height:1;text-transform:none}.icon-close:before{content:\"\\e907\"}.icon-arrow-up:before{content:\"\\e905\"}.icon-arrow-down:before{content:\"\\e906\"}.icon-arrow:before{content:\"\\e900\"}.icon-arrow-jump-next:before{content:\"\\e901\"}.icon-arrow-jump-back:before{content:\"\\e902\"}.icon-text:before{content:\"\\e903\"}.icon-arrow-back:before{content:\"\\e904\"}";
|
|
649
|
-
styleInject(css_248z$3);
|
|
650
|
-
|
|
651
|
-
/**
|
|
652
|
-
* Created by aleksanyan.tigran on 10/7/2022.
|
|
653
|
-
*/
|
|
654
|
-
|
|
655
|
-
const Icon = props => /*#__PURE__*/React.createElement("i", {
|
|
656
|
-
className: css_248z$3[props.className]
|
|
657
|
-
});
|
|
658
|
-
|
|
659
|
-
const Pagination = ({
|
|
660
|
-
onChange,
|
|
661
|
-
totalCount,
|
|
662
|
-
siblingCount,
|
|
663
|
-
currentPage,
|
|
664
|
-
offset,
|
|
665
|
-
className
|
|
666
|
-
}) => {
|
|
667
|
-
const [siblingCountNumber, setSibilingCountNumber] = useState(2);
|
|
668
|
-
const [currentPageNumber, setCurrentPage] = useState(1);
|
|
669
|
-
const [currentTotalCount, setcurrentTotalCount] = useState(10);
|
|
670
|
-
useEffect(() => {
|
|
671
|
-
setcurrentTotalCount(totalCount);
|
|
672
|
-
}, [totalCount]);
|
|
673
|
-
useEffect(() => {
|
|
674
|
-
setSibilingCountNumber(siblingCount);
|
|
675
|
-
}, [siblingCount]);
|
|
676
|
-
useEffect(() => {
|
|
677
|
-
setCurrentPage(currentPage);
|
|
678
|
-
}, [currentPage]);
|
|
679
|
-
|
|
680
|
-
const onPageChange = page => {
|
|
681
|
-
setCurrentPage(page);
|
|
682
|
-
};
|
|
683
|
-
|
|
684
|
-
onChange(currentPageNumber);
|
|
685
|
-
const paginationRange = PaginationRange({
|
|
686
|
-
currentPageNumber,
|
|
687
|
-
currentTotalCount,
|
|
688
|
-
siblingCountNumber,
|
|
689
|
-
offset
|
|
690
|
-
});
|
|
691
|
-
|
|
692
|
-
if (currentPageNumber === 0 || paginationRange.length < 2) {
|
|
693
|
-
return null;
|
|
694
|
-
}
|
|
695
|
-
|
|
696
|
-
const classProps = classnames(styles$3.list, className ? className : styles$3["pagination-bar"]);
|
|
697
|
-
|
|
698
|
-
const onNext = () => {
|
|
699
|
-
onPageChange(currentPageNumber + 1);
|
|
700
|
-
};
|
|
701
|
-
|
|
702
|
-
const onPrevious = () => {
|
|
703
|
-
onPageChange(currentPageNumber - 1);
|
|
704
|
-
};
|
|
705
|
-
|
|
706
|
-
const onNextFive = () => {
|
|
707
|
-
currentPageNumber !== lastPage - 4 ? onPageChange(currentPageNumber + 5) : onPageChange(currentPageNumber + 4);
|
|
708
|
-
};
|
|
709
|
-
|
|
710
|
-
const onPreviousFive = e => {
|
|
711
|
-
currentPageNumber !== 5 ? onPageChange(currentPageNumber - 5) : onPageChange(currentPageNumber - 4);
|
|
712
|
-
};
|
|
713
|
-
|
|
714
|
-
let lastPage = paginationRange[paginationRange.length - 1];
|
|
715
|
-
return /*#__PURE__*/React$2.createElement("ul", {
|
|
716
|
-
className: classProps
|
|
717
|
-
}, /*#__PURE__*/React$2.createElement("button", {
|
|
718
|
-
className: styles$3["pagination-btn"],
|
|
719
|
-
onClick: onPrevious,
|
|
720
|
-
disabled: currentPage === 1 ? true : false
|
|
721
|
-
}, /*#__PURE__*/React$2.createElement(Icon, {
|
|
722
|
-
className: "icon-arrow-back"
|
|
723
|
-
})), paginationRange.map((pageNumber, id) => {
|
|
724
|
-
if (pageNumber === Dots) {
|
|
725
|
-
let currentPageIndex = paginationRange.indexOf(currentPageNumber);
|
|
726
|
-
return /*#__PURE__*/React$2.createElement("li", {
|
|
727
|
-
key: id,
|
|
728
|
-
className: classnames(styles$3['pagination-jump-next'], styles$3.listItem),
|
|
729
|
-
onClick: id < currentPageIndex ? onPreviousFive : onNextFive,
|
|
730
|
-
disabled: currentPageIndex === 0 ? true : false
|
|
731
|
-
}, /*#__PURE__*/React$2.createElement("span", {
|
|
732
|
-
className: styles$3['pagination-jump-next-txt']
|
|
733
|
-
}, "..."), /*#__PURE__*/React$2.createElement("span", {
|
|
734
|
-
className: styles$3['pagination-jump-next-arrow']
|
|
735
|
-
}, /*#__PURE__*/React$2.createElement(Icon, {
|
|
736
|
-
className: "icon-arrow-jump-next"
|
|
737
|
-
})));
|
|
738
|
-
}
|
|
739
|
-
|
|
740
|
-
return /*#__PURE__*/React$2.createElement("li", {
|
|
741
|
-
onClick: () => onPageChange(pageNumber),
|
|
742
|
-
key: id,
|
|
743
|
-
className: classnames(`${pageNumber === currentPageNumber ? styles$3.selected : styles$3.listItem}`, styles$3['pagination-item'])
|
|
744
|
-
}, pageNumber);
|
|
745
|
-
}), /*#__PURE__*/React$2.createElement("button", {
|
|
746
|
-
onClick: onNext,
|
|
747
|
-
className: styles$3["pagination-btn"],
|
|
748
|
-
disabled: currentPageNumber === lastPage ? true : false
|
|
749
|
-
}, /*#__PURE__*/React$2.createElement(Icon, {
|
|
750
|
-
className: "icon-arrow"
|
|
751
|
-
})));
|
|
752
|
-
};
|
|
753
|
-
Pagination.propTypes = {
|
|
754
|
-
offset: PropTypes.number,
|
|
755
|
-
totalCount: PropTypes.number,
|
|
756
|
-
className: PropTypes.string,
|
|
757
|
-
siblingCount: PropTypes.number,
|
|
758
|
-
currentPage: PropTypes.number
|
|
759
|
-
};
|
|
760
|
-
Pagination.defaultProps = {
|
|
761
|
-
offset: 2,
|
|
762
|
-
siblingCount: 2
|
|
763
|
-
};
|
|
764
|
-
|
|
765
|
-
var css_248z$2 = ".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}";
|
|
766
|
-
var styles$2 = {"radio-wrap":"radio-module_radio-wrap__-lO7V","radio-checkmark":"radio-module_radio-checkmark__Kvol0"};
|
|
767
|
-
styleInject(css_248z$2);
|
|
768
|
-
|
|
769
|
-
const Radio = ({
|
|
770
|
-
disabled,
|
|
771
|
-
defaultChecked,
|
|
772
|
-
required,
|
|
773
|
-
className,
|
|
774
|
-
name,
|
|
775
|
-
value,
|
|
776
|
-
jsonData,
|
|
777
|
-
label,
|
|
778
|
-
keyNames,
|
|
779
|
-
...props
|
|
780
|
-
}) => {
|
|
781
|
-
const classProps = classnames(styles$2.checkbox, className);
|
|
782
|
-
const parseData = jsonData.length !== 0 ? JSON.parse(jsonData) : [];
|
|
783
|
-
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, parseData.map((element, id) => {
|
|
784
|
-
return /*#__PURE__*/React__default.createElement("label", {
|
|
785
|
-
className: styles$2["radio-wrap"],
|
|
786
|
-
key: element.value
|
|
787
|
-
}, /*#__PURE__*/React__default.createElement("input", _extends({
|
|
788
|
-
type: "radio",
|
|
789
|
-
className: classProps,
|
|
790
|
-
disabled: disabled,
|
|
791
|
-
required: required,
|
|
792
|
-
defaultChecked: id === 0 ? defaultChecked : "",
|
|
793
|
-
value: value ? value : element.value,
|
|
794
|
-
name: name ? name : element.name
|
|
795
|
-
}, props)), /*#__PURE__*/React__default.createElement("span", {
|
|
796
|
-
className: styles$2["radio-checkmark"]
|
|
797
|
-
}), element.label ? /*#__PURE__*/React__default.createElement("span", {
|
|
798
|
-
className: styles$2.labelRadio
|
|
799
|
-
}, label ? label : element.label) : "");
|
|
800
|
-
}));
|
|
801
|
-
};
|
|
802
|
-
Radio.propTypes = {
|
|
803
|
-
className: PropTypes.string,
|
|
804
|
-
onChange: PropTypes.func,
|
|
805
|
-
required: PropTypes.bool,
|
|
806
|
-
defaultChecked: PropTypes.bool,
|
|
807
|
-
disabled: PropTypes.bool,
|
|
808
|
-
name: PropTypes.string,
|
|
809
|
-
value: PropTypes.string,
|
|
810
|
-
jsonData: PropTypes.string,
|
|
811
|
-
label: PropTypes.string,
|
|
812
|
-
keyNames: PropTypes.object
|
|
813
|
-
};
|
|
814
|
-
Radio.defaultProps = {
|
|
815
|
-
onChange: undefined,
|
|
816
|
-
jsonData: '[{"value":"email", "name":"contact", "label":"Email", "id":"contactChoice1"}, {"value":"phone", "name":"contact", "label":"Phone", "id":"contactChoice2"}]'
|
|
817
|
-
};
|
|
818
|
-
|
|
819
|
-
var css_248z$1 = "*{margin:0;padding:0}.captcha-module_main__Ys3EH{margin:0;padding:0;position:relative;width:40%}.captcha-module_slider__KLYny{-webkit-appearance:none;background-color:hsla(0,0%,100%,.575);border:.1px solid hsla(0,0%,59%,.432);height:7px;outline:none;width:100%}.captcha-module_slider__KLYny::-webkit-slider-thumb{-webkit-appearance:none;height:48px;position:relative;width:48px;z-index:3}.captcha-module_selector__JFhb4{bottom:-20px;height:48px;left:50%;position:absolute;width:48px;z-index:2}.captcha-module_selectBtn__GP1iH{background-image:url(https://i.ibb.co/rQZNNzN/blue.png);background-position:50%;background-size:cover;border-radius:50%;bottom:40px;height:40px;position:absolute;right:30px;width:40px}.captcha-module_progressBar__mhdtM{background:#7070ee;bottom:38px;height:7px;left:0;margin:0;padding:0;position:absolute;width:50%}.captcha-module_range__k24I2{color:blue;margin-bottom:15px;margin-top:15px}";
|
|
820
|
-
var styles$1 = {"main":"captcha-module_main__Ys3EH","slider":"captcha-module_slider__KLYny","selector":"captcha-module_selector__JFhb4","selectBtn":"captcha-module_selectBtn__GP1iH","progressBar":"captcha-module_progressBar__mhdtM","range":"captcha-module_range__k24I2"};
|
|
821
|
-
styleInject(css_248z$1);
|
|
822
|
-
|
|
823
|
-
const Captcha = ({
|
|
824
|
-
onclick,
|
|
825
|
-
rangeCount
|
|
826
|
-
}) => {
|
|
827
|
-
const [data, setData] = useState("");
|
|
828
|
-
const [right, setRight] = useState(false);
|
|
829
|
-
let range = rangeCount <= 100 ? rangeCount : 0;
|
|
830
|
-
let rangeElement = document.getElementsByClassName(styles$1.range);
|
|
831
|
-
useEffect(() => {
|
|
832
|
-
for (let element of rangeElement) {
|
|
833
|
-
element.style.marginLeft = `${range - 3}%`;
|
|
834
|
-
element.style.color = data;
|
|
835
|
-
}
|
|
836
|
-
}, [range, data]);
|
|
837
|
-
|
|
838
|
-
function sliderInput(event) {
|
|
839
|
-
setData(rangeCount == event.target.value ? 'green' : 'indianred');
|
|
840
|
-
let selector = document.getElementsByClassName(styles$1.selector);
|
|
841
|
-
let selectBtn = document.getElementsByClassName(styles$1.selectBtn);
|
|
842
|
-
let progressBar = document.getElementsByClassName(styles$1.progressBar);
|
|
843
|
-
selector[0].style.left = event.target.value + '%';
|
|
844
|
-
progressBar[0].style.width = event.target.value + '%';
|
|
845
|
-
|
|
846
|
-
if (rangeCount == event.target.value) {
|
|
847
|
-
selectBtn[0].style.backgroundImage = "url('https://i.ibb.co/b1HDRtd/green.png')";
|
|
848
|
-
} else {
|
|
849
|
-
selectBtn[0].style.backgroundImage = "url('https://i.ibb.co/QvXjjLM/red.png')";
|
|
850
|
-
}
|
|
851
|
-
}
|
|
852
|
-
|
|
853
|
-
function sliderChange(e) {
|
|
854
|
-
setRight(rangeCount == e.target.value ? true : false);
|
|
855
|
-
}
|
|
856
|
-
|
|
857
|
-
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
|
|
858
|
-
className: styles$1.main
|
|
859
|
-
}, /*#__PURE__*/React__default.createElement("div", {
|
|
860
|
-
className: styles$1.range
|
|
861
|
-
}, "\u25BC"), /*#__PURE__*/React__default.createElement("input", {
|
|
862
|
-
type: "range",
|
|
863
|
-
className: styles$1.slider,
|
|
864
|
-
onClick: right ? onclick : null,
|
|
865
|
-
onInput: sliderInput,
|
|
866
|
-
onMouseUp: sliderChange
|
|
867
|
-
}), /*#__PURE__*/React__default.createElement("div", {
|
|
868
|
-
className: styles$1.selector
|
|
869
|
-
}, /*#__PURE__*/React__default.createElement("div", {
|
|
870
|
-
className: styles$1.selectBtn
|
|
871
|
-
})), /*#__PURE__*/React__default.createElement("div", {
|
|
872
|
-
className: styles$1.progressBar
|
|
873
|
-
}), /*#__PURE__*/React__default.createElement("div", {
|
|
874
|
-
className: styles$1.range
|
|
875
|
-
}, "\u25B2")));
|
|
876
|
-
};
|
|
877
|
-
Captcha.propTypes = {
|
|
878
|
-
onclick: PropTypes.func,
|
|
879
|
-
className: PropTypes.string,
|
|
880
|
-
rangeCount: PropTypes.number
|
|
881
|
-
};
|
|
882
|
-
Captcha.defaultProps = {
|
|
883
|
-
onclick: undefined
|
|
884
|
-
};
|
|
885
|
-
|
|
886
|
-
var css_248z = ".select-module_select-title__c8bR7{color:#3c393e;display:block;font-size:16px;font-weight:500;line-height:22px;margin-bottom:6px;text-transform:capitalize}.select-module_select-content__GCMDX{display:flex;flex-direction:column}.select-module_select-content-top__Aw-fB{border:2px solid #d1d1d1;border-radius:6px;box-sizing:border-box;color:#3c393e;cursor:pointer;display:flex;flex-direction:row;font-size:16px;font-weight:500;height:46px;line-height:22px;max-width:400px;padding:0 15px;transition:border-color .24s}.select-module_select-content-top__Aw-fB.select-module_active__v2Dce{border-color:#00236a}.select-module_select-content-top__Aw-fB:hover{border-color:#3c393e}.select-module_select-content-bottom__ueZCR{animation:select-module_select-show__391hQ .64s linear forwards;background:#fbfbfb;border-radius:6px;box-shadow:0 0 10px rgba(60,57,62,.08);max-height:0;max-width:400px;overflow:hidden;position:relative;top:6px}.select-module_select-content-bottom-inner__NWy2X{display:flex;flex-direction:column;max-height:234px;overflow-x:hidden;overflow-y:auto}@keyframes select-module_select-show__391hQ{to{max-height:400px}}.select-module_select-content-top-text__euajq{align-items:center;display:flex;flex:1;flex-direction:row;flex-wrap:nowrap}.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>i{color:#3c393e;font-size:8px}.select-module_select-content-bottom-row__eKq5L{align-items:center;background:#fff;box-sizing:border-box;color:#3c393e;cursor:pointer;display:flex;font-size:16px;font-weight:500;height:46px;line-height:22px;margin-bottom:2px;padding:0 15px;transition:background .24s,color .24s}.select-module_select-content-bottom-row__eKq5L:last-child{margin-bottom:0}.select-module_select-content-bottom-row__eKq5L:hover{background:unset;color:#00236a}";
|
|
887
|
-
var styles = {"select-title":"select-module_select-title__c8bR7","select-content":"select-module_select-content__GCMDX","select-content-top":"select-module_select-content-top__Aw-fB","active":"select-module_active__v2Dce","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-text":"select-module_select-content-top-text__euajq","select-content-top-icon":"select-module_select-content-top-icon__MBrGK","select-content-bottom-row":"select-module_select-content-bottom-row__eKq5L"};
|
|
888
|
-
styleInject(css_248z);
|
|
889
|
-
|
|
890
|
-
const SelectTheme = {
|
|
891
|
-
DEFAULT: 'select-default',
|
|
892
|
-
PRIMARY: 'select-primary',
|
|
893
|
-
SUCCESS: 'select-success',
|
|
894
|
-
INFO: 'select-info',
|
|
895
|
-
WARNING: 'select-warning',
|
|
896
|
-
DANGER: 'select-danger',
|
|
897
|
-
LINK: 'select-link'
|
|
898
|
-
};
|
|
899
|
-
const SelectSize = {
|
|
900
|
-
SMALL: 'small',
|
|
901
|
-
MEDIUM: 'medium',
|
|
902
|
-
LARGE: 'large'
|
|
903
|
-
};
|
|
904
|
-
const Select = ({
|
|
905
|
-
theme,
|
|
906
|
-
size,
|
|
907
|
-
className,
|
|
908
|
-
disabled,
|
|
909
|
-
label,
|
|
910
|
-
jsonData,
|
|
911
|
-
eMessage,
|
|
912
|
-
required,
|
|
913
|
-
defaultOption,
|
|
914
|
-
onChange,
|
|
915
|
-
selected
|
|
916
|
-
}) => {
|
|
917
|
-
const options = jsonData.length ? JSON.parse(jsonData) : [];
|
|
918
|
-
let [opened, setOpened] = useState(false);
|
|
919
|
-
let [newSelected, setNewSelected] = useState(selected);
|
|
920
|
-
classnames(styles[theme], styles[size], {
|
|
921
|
-
[styles.disabled]: disabled,
|
|
922
|
-
[styles.required]: required
|
|
923
|
-
}, className);
|
|
924
|
-
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, label ? /*#__PURE__*/React__default.createElement("label", {
|
|
925
|
-
className: styles['select-title']
|
|
926
|
-
}, label) : "", /*#__PURE__*/React__default.createElement("div", {
|
|
927
|
-
className: styles['select-wrap']
|
|
928
|
-
}, /*#__PURE__*/React__default.createElement("div", {
|
|
929
|
-
className: styles['select-content'],
|
|
930
|
-
id: styles.selector
|
|
931
|
-
}, /*#__PURE__*/React__default.createElement("div", {
|
|
932
|
-
className: styles['select-content-top'],
|
|
933
|
-
onClick: () => {
|
|
934
|
-
setOpened(!opened);
|
|
935
|
-
}
|
|
936
|
-
}, /*#__PURE__*/React__default.createElement("div", {
|
|
937
|
-
className: styles['select-content-top-text']
|
|
938
|
-
}, newSelected?.name || defaultOption), /*#__PURE__*/React__default.createElement("div", {
|
|
939
|
-
className: styles['select-content-top-icon']
|
|
940
|
-
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
941
|
-
className: opened ? 'icon-arrow-up' : 'icon-arrow-down'
|
|
942
|
-
}))), opened && !disabled ? /*#__PURE__*/React__default.createElement("div", {
|
|
943
|
-
className: styles['select-content-bottom']
|
|
944
|
-
}, /*#__PURE__*/React__default.createElement("div", {
|
|
945
|
-
className: styles['select-content-bottom-inner']
|
|
946
|
-
}, /*#__PURE__*/React__default.createElement("div", {
|
|
947
|
-
className: styles['select-content-bottom-row'],
|
|
948
|
-
onClick: () => {
|
|
949
|
-
if (!required && !selected) {
|
|
950
|
-
setNewSelected(defaultOption);
|
|
951
|
-
onChange(defaultOption);
|
|
952
|
-
setOpened(!opened);
|
|
953
|
-
}
|
|
954
|
-
}
|
|
955
|
-
}, defaultOption), options?.map((option, i) => {
|
|
956
|
-
return /*#__PURE__*/React__default.createElement("div", {
|
|
957
|
-
className: styles['select-content-bottom-row'],
|
|
958
|
-
disabled: true,
|
|
959
|
-
onClick: () => {
|
|
960
|
-
setNewSelected(option);
|
|
961
|
-
onChange(option);
|
|
962
|
-
setOpened(!opened);
|
|
963
|
-
},
|
|
964
|
-
defaultValue: option.id
|
|
965
|
-
}, option.name);
|
|
966
|
-
}))) : null)), eMessage ? /*#__PURE__*/React__default.createElement("span", {
|
|
967
|
-
className: styles.eMessage
|
|
968
|
-
}, eMessage) : null);
|
|
969
|
-
};
|
|
970
|
-
Select.propTypes = {
|
|
971
|
-
theme: PropTypes.oneOf(Object.values(SelectTheme)),
|
|
972
|
-
size: PropTypes.oneOf(Object.values(SelectSize)),
|
|
973
|
-
label: PropTypes.string,
|
|
974
|
-
eMessage: PropTypes.string,
|
|
975
|
-
defaultOption: PropTypes.string,
|
|
976
|
-
onChange: PropTypes.func,
|
|
977
|
-
required: PropTypes.bool,
|
|
978
|
-
disabled: PropTypes.bool,
|
|
979
|
-
className: PropTypes.string,
|
|
980
|
-
selected: PropTypes.object,
|
|
981
|
-
jsonData: PropTypes.string
|
|
982
|
-
};
|
|
983
|
-
Select.defaultProps = {
|
|
984
|
-
size: 'medium'
|
|
985
|
-
};
|
|
986
|
-
|
|
987
|
-
export { Autocomplate, Button, ButtonSize, ButtonTheme, ButtonType, Captcha, Checkbox, SvgHeartFilled as HeartFilled, SvgHeartOutline as HeartOutline, Input, InputSizes, InputTypes, SvgLikeFilled as LikeFilled, SvgLikeOutline as LikeOutline, Pagination, Radio, Select, SelectSize, SelectTheme, SvgStarFilled as StarFilled, SvgStarOutline as StarOutline, Typography, TypographyType };
|
|
508
|
+
export { Autocomplate, Button, ButtonSize, ButtonTheme, ButtonType, Checkbox, SvgHeartFilled as HeartFilled, SvgHeartOutline as HeartOutline, SvgLikeFilled as LikeFilled, SvgLikeOutline as LikeOutline, SvgStarFilled as StarFilled, SvgStarOutline as StarOutline, Typography, TypographyType };
|