intelicoreact 0.0.24 → 0.0.41

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.
Files changed (147) hide show
  1. package/dist/Atomic/FormElements/Calendar/Calendar.js +134 -0
  2. package/dist/Atomic/FormElements/Calendar/Calendar.scss +543 -0
  3. package/dist/Atomic/FormElements/Calendar/Calendar.stories.js +75 -0
  4. package/dist/Atomic/FormElements/CheckboxInput/CheckboxInput.scss +3 -5
  5. package/dist/Atomic/FormElements/CheckboxInput/CheckboxInput.stories.js +2 -5
  6. package/dist/Atomic/FormElements/DateTime/DateTime.stories.js +0 -2
  7. package/dist/Atomic/FormElements/DoubleString/DoubleString.stories.js +0 -2
  8. package/dist/Atomic/FormElements/Dropdown/Dropdown.js +3 -3
  9. package/dist/Atomic/FormElements/Dropdown/Dropdown.stories.js +0 -2
  10. package/dist/Atomic/FormElements/Header/Header.js +8 -10
  11. package/dist/Atomic/FormElements/Header/Header.scss +16 -5
  12. package/dist/Atomic/FormElements/Header/Header.stories.js +0 -2
  13. package/dist/Atomic/FormElements/Input/Input.js +93 -103
  14. package/dist/Atomic/FormElements/Input/Input.scss +25 -10
  15. package/dist/Atomic/FormElements/Input/Input.stories.js +32 -27
  16. package/dist/Atomic/FormElements/InputsRow/InputsRow.js +30 -7
  17. package/dist/Atomic/FormElements/InputsRow/InputsRow.scss +1 -3
  18. package/dist/Atomic/FormElements/InputsRow/InputsRow.stories.js +0 -2
  19. package/dist/Atomic/FormElements/Label/Label.js +2 -4
  20. package/dist/Atomic/FormElements/Label/Label.scss +1 -3
  21. package/dist/Atomic/FormElements/Label/Label.stories.js +0 -2
  22. package/dist/Atomic/FormElements/Modal/Modal.js +5 -7
  23. package/dist/Atomic/FormElements/Modal/Modal.scss +61 -7
  24. package/dist/Atomic/FormElements/Modal/Modal.stories.js +3 -3
  25. package/dist/Atomic/FormElements/MultiSelect/MultiSelect.js +3 -5
  26. package/dist/Atomic/FormElements/MultiSelect/MultiSelect.scss +1 -3
  27. package/dist/Atomic/FormElements/MultiSelect/MultiSelect.stories.js +0 -2
  28. package/dist/Atomic/FormElements/NavLine/NavLine.js +2 -2
  29. package/dist/Atomic/FormElements/NavLine/NavLine.scss +4 -6
  30. package/dist/Atomic/FormElements/NavLine/NavLine.stories.js +21 -13
  31. package/dist/Atomic/FormElements/RadioInput/RadioInput.stories.js +0 -2
  32. package/dist/Atomic/FormElements/RangeInputs/RangeInputs.stories.js +0 -2
  33. package/dist/Atomic/FormElements/Switcher/Switcher.stories.js +0 -2
  34. package/dist/Atomic/FormElements/Table/Partials/TdCell.js +1 -1
  35. package/dist/Atomic/FormElements/Table/Partials/TdHeader.js +2 -2
  36. package/dist/Atomic/FormElements/Table/TdTypes/TdActions.js +5 -5
  37. package/dist/Atomic/FormElements/Table/TdTypes/TdPriority.js +3 -3
  38. package/dist/Atomic/FormElements/Table/TdTypes/TdTypes.scss +4 -6
  39. package/dist/Atomic/FormElements/Table/TdTypes/TdWeight.js +2 -2
  40. package/dist/Atomic/FormElements/Tag/Tag.js +2 -2
  41. package/dist/Atomic/FormElements/Tag/Tag.stories.js +0 -2
  42. package/dist/Atomic/FormElements/TagsDropdown/TagsDropdown.js +3 -3
  43. package/dist/Atomic/FormElements/TagsDropdown/TagsDropdown.stories.js +0 -2
  44. package/dist/Atomic/FormElements/TextSwitcher/TextSwitcher.stories.js +0 -2
  45. package/dist/Atomic/FormElements/Textarea/Textarea.stories.js +0 -2
  46. package/dist/Atomic/FormElements/TimeRange/TimeRange.js +1 -1
  47. package/dist/Atomic/FormElements/TimeRange/TimeRange.stories.js +0 -2
  48. package/dist/Atomic/MainMenu/MainMenu.js +4 -4
  49. package/dist/Atomic/MainMenu/MainMenu.stories.js +11 -11
  50. package/dist/Atomic/UI/Accordion/Accordion.js +1 -1
  51. package/dist/Atomic/UI/Accordion/Accordion.stories.js +4 -4
  52. package/dist/Atomic/UI/Accordion/AccordionItem.js +3 -3
  53. package/dist/Atomic/UI/AdvancedTag/AdvTag.js +3 -3
  54. package/dist/Atomic/UI/AdvancedTag/AdvancedTags.js +4 -3
  55. package/dist/Atomic/UI/AdvancedTag/AdvancedTags.scss +3 -5
  56. package/dist/Atomic/UI/AdvancedTag/AdvancedTags.stories.js +1 -3
  57. package/dist/Atomic/UI/Alert/Alert.js +7 -4
  58. package/dist/Atomic/UI/Alert/Alert.scss +7 -0
  59. package/dist/Atomic/UI/Alert/Alert.stories.js +1 -3
  60. package/dist/Atomic/UI/Button/Button.js +8 -19
  61. package/dist/Atomic/UI/Button/Button.scss +44 -42
  62. package/dist/Atomic/UI/Button/Button.stories.js +7 -23
  63. package/dist/Atomic/UI/Header/partials/default_ava.png +0 -0
  64. package/dist/Atomic/UI/Hint/Hint.js +8 -13
  65. package/dist/Atomic/UI/Hint/Hint.scss +8 -12
  66. package/dist/Atomic/UI/Hint/Hint.stories.js +3 -4
  67. package/dist/Atomic/UI/Price/Price.js +32 -0
  68. package/dist/Atomic/UI/Price/Price.stories.js +42 -0
  69. package/dist/Atomic/{FormElements → UI}/Status/Status.js +4 -6
  70. package/dist/Atomic/{FormElements → UI}/Status/Status.scss +0 -0
  71. package/dist/Atomic/{FormElements → UI}/Status/Status.stories.js +4 -3
  72. package/dist/Functions/useClickOutside.js +25 -0
  73. package/dist/scss/main.scss +2 -2
  74. package/package.json +7 -5
  75. package/src/Atomic/FormElements/Calendar/Calendar.js +106 -0
  76. package/src/Atomic/FormElements/Calendar/Calendar.scss +543 -0
  77. package/src/Atomic/FormElements/Calendar/Calendar.stories.js +38 -0
  78. package/src/Atomic/FormElements/CheckboxInput/CheckboxInput.scss +3 -5
  79. package/src/Atomic/FormElements/CheckboxInput/CheckboxInput.stories.js +3 -5
  80. package/src/Atomic/FormElements/DateTime/DateTime.stories.js +0 -2
  81. package/src/Atomic/FormElements/DoubleString/DoubleString.stories.js +0 -2
  82. package/src/Atomic/FormElements/Dropdown/Dropdown.js +3 -3
  83. package/src/Atomic/FormElements/Dropdown/Dropdown.stories.js +0 -1
  84. package/src/Atomic/FormElements/Header/Header.js +8 -9
  85. package/src/Atomic/FormElements/Header/Header.scss +16 -5
  86. package/src/Atomic/FormElements/Header/Header.stories.js +0 -2
  87. package/src/Atomic/FormElements/Input/Input.js +77 -73
  88. package/src/Atomic/FormElements/Input/Input.scss +25 -10
  89. package/src/Atomic/FormElements/Input/Input.stories.js +24 -29
  90. package/src/Atomic/FormElements/InputsRow/InputsRow.js +28 -5
  91. package/src/Atomic/FormElements/InputsRow/InputsRow.scss +1 -3
  92. package/src/Atomic/FormElements/InputsRow/InputsRow.stories.js +0 -2
  93. package/src/Atomic/FormElements/Label/Label.js +2 -4
  94. package/src/Atomic/FormElements/Label/Label.scss +1 -3
  95. package/src/Atomic/FormElements/Label/Label.stories.js +1 -2
  96. package/src/Atomic/FormElements/Modal/Modal.js +5 -8
  97. package/src/Atomic/FormElements/Modal/Modal.scss +61 -7
  98. package/src/Atomic/FormElements/Modal/Modal.stories.js +3 -3
  99. package/src/Atomic/FormElements/MultiSelect/MultiSelect.js +3 -5
  100. package/src/Atomic/FormElements/MultiSelect/MultiSelect.scss +1 -3
  101. package/src/Atomic/FormElements/MultiSelect/MultiSelect.stories.js +1 -2
  102. package/src/Atomic/FormElements/NavLine/NavLine.js +4 -4
  103. package/src/Atomic/FormElements/NavLine/NavLine.scss +4 -6
  104. package/src/Atomic/FormElements/NavLine/NavLine.stories.js +24 -14
  105. package/src/Atomic/FormElements/RadioInput/RadioInput.stories.js +0 -2
  106. package/src/Atomic/FormElements/RangeInputs/RangeInputs.stories.js +0 -1
  107. package/src/Atomic/FormElements/Switcher/Switcher.stories.js +0 -2
  108. package/src/Atomic/FormElements/Table/Partials/TdCell.js +1 -1
  109. package/src/Atomic/FormElements/Table/Partials/TdHeader.js +1 -1
  110. package/src/Atomic/FormElements/Table/TdTypes/TdActions.js +5 -5
  111. package/src/Atomic/FormElements/Table/TdTypes/TdPriority.js +3 -3
  112. package/src/Atomic/FormElements/Table/TdTypes/TdTypes.scss +4 -6
  113. package/src/Atomic/FormElements/Table/TdTypes/TdWeight.js +2 -2
  114. package/src/Atomic/FormElements/Tag/Tag.js +2 -2
  115. package/src/Atomic/FormElements/Tag/Tag.stories.js +0 -2
  116. package/src/Atomic/FormElements/TagsDropdown/TagsDropdown.js +3 -3
  117. package/src/Atomic/FormElements/TagsDropdown/TagsDropdown.stories.js +0 -2
  118. package/src/Atomic/FormElements/TextSwitcher/TextSwitcher.stories.js +0 -2
  119. package/src/Atomic/FormElements/Textarea/Textarea.stories.js +0 -2
  120. package/src/Atomic/FormElements/TimeRange/TimeRange.js +1 -1
  121. package/src/Atomic/FormElements/TimeRange/TimeRange.stories.js +0 -2
  122. package/src/Atomic/MainMenu/MainMenu.js +4 -4
  123. package/src/Atomic/MainMenu/MainMenu.stories.js +11 -11
  124. package/src/Atomic/UI/Accordion/Accordion.js +1 -1
  125. package/src/Atomic/UI/Accordion/Accordion.stories.js +4 -4
  126. package/src/Atomic/UI/Accordion/AccordionItem.js +3 -3
  127. package/src/Atomic/UI/AdvancedTag/AdvTag.js +3 -3
  128. package/src/Atomic/UI/AdvancedTag/AdvancedTags.js +3 -3
  129. package/src/Atomic/UI/AdvancedTag/AdvancedTags.scss +3 -5
  130. package/src/Atomic/UI/AdvancedTag/AdvancedTags.stories.js +1 -3
  131. package/src/Atomic/UI/Alert/Alert.js +9 -6
  132. package/src/Atomic/UI/Alert/Alert.scss +7 -0
  133. package/src/Atomic/UI/Alert/Alert.stories.js +1 -3
  134. package/src/Atomic/UI/Button/Button.js +5 -9
  135. package/src/Atomic/UI/Button/Button.scss +44 -42
  136. package/src/Atomic/UI/Button/Button.stories.js +6 -23
  137. package/src/Atomic/UI/Header/partials/default_ava.png +0 -0
  138. package/src/Atomic/UI/Hint/Hint.js +6 -9
  139. package/src/Atomic/UI/Hint/Hint.scss +8 -12
  140. package/src/Atomic/UI/Hint/Hint.stories.js +3 -3
  141. package/src/Atomic/UI/Price/Price.js +19 -0
  142. package/src/Atomic/UI/Price/Price.stories.js +30 -0
  143. package/src/Atomic/{FormElements → UI}/Status/Status.js +2 -4
  144. package/src/Atomic/{FormElements → UI}/Status/Status.scss +0 -0
  145. package/src/Atomic/{FormElements → UI}/Status/Status.stories.js +4 -3
  146. package/src/Functions/useClickOutside.js +15 -0
  147. package/src/scss/main.scss +2 -2
@@ -17,57 +17,63 @@ var _react = _interopRequireWildcard(require("react"));
17
17
 
18
18
  var _Input = _interopRequireDefault(require("./Input"));
19
19
 
20
- require("../../../../scss/main.scss");
21
-
22
20
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
23
21
 
24
22
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
25
23
 
26
24
  global.lng = 'en';
27
25
  var _default = {
28
- title: 'Input',
26
+ title: 'Form Elements/Input',
29
27
  component: _Input.default,
30
28
  argTypes: {
31
- hintSide: {
32
- description: 'string: ["right", "bottom", "top", "left"]',
33
- control: {
34
- type: 'select',
35
- options: ['right', 'bottom', 'top', 'left']
36
- }
37
- },
38
- hint: {
39
- description: 'string'
40
- },
41
29
  disabled: {
42
30
  description: 'boolean'
43
31
  },
44
32
  error: {
45
- description: 'text'
33
+ description: 'text - coloring input if is errored'
46
34
  },
47
35
  withDelete: {
48
- description: 'boolean'
36
+ description: 'boolean - add clear-cross by hover'
49
37
  },
50
38
  isNumeric: {
51
- description: 'boolean'
39
+ description: 'boolean - add plus/minus buttons, force input to numeric type'
40
+ },
41
+ numStep: {
42
+ description: 'number/text - plus/minus buttons factor (default: 1)'
52
43
  },
53
44
  min: {
54
- description: 'number'
45
+ description: 'number/text - minimal number for numeric input'
55
46
  },
56
47
  max: {
57
- description: 'number'
48
+ description: 'number/text - maximal number for numeric input'
58
49
  },
59
50
  placeholder: {
60
51
  description: 'text'
61
52
  },
62
- label: {
63
- description: 'text'
64
- },
65
53
  type: {
66
- description: 'string: any input type',
54
+ description: "'text', 'number', 'password', 'color', 'date', 'datetime-local', 'month', 'time', 'email', 'range'",
67
55
  control: {
68
56
  type: 'select',
69
- options: ['text', 'number']
57
+ options: ['text', 'number', 'password', 'color', 'date', 'datetime-local', 'month', 'time', 'email', 'range']
70
58
  }
59
+ },
60
+ value: {
61
+ description: '(* - required prop)'
62
+ },
63
+ className: {
64
+ description: 'string'
65
+ },
66
+ mask: {
67
+ description: 'string: force input to masked https://www.npmjs.com/package/react-input-mask'
68
+ },
69
+ onBlur: {
70
+ description: 'custom callback on blur'
71
+ },
72
+ onFocus: {
73
+ description: 'custom callback on focus'
74
+ },
75
+ onKeyUp: {
76
+ description: 'custom callback on keyup, returns event keyCode'
71
77
  }
72
78
  }
73
79
  };
@@ -93,10 +99,9 @@ InputTemplate.args = {
93
99
  error: '',
94
100
  withDelete: true,
95
101
  isNumeric: false,
102
+ numStep: 1,
96
103
  min: '0',
97
- max: 5,
104
+ max: '5',
98
105
  placeholder: 'Placeholder',
99
- label: 'label',
100
- hint: 'hint',
101
- hintSide: 'bottom'
106
+ mask: ''
102
107
  };
@@ -19,9 +19,7 @@ var _react = _interopRequireWildcard(require("react"));
19
19
 
20
20
  var _uuid = require("uuid");
21
21
 
22
- var _fi = require("react-icons/fi");
23
-
24
- var _utils = require("../../../Functions/utils");
22
+ var _reactFeather = require("react-feather");
25
23
 
26
24
  var _Input = _interopRequireDefault(require("../Input/Input"));
27
25
 
@@ -37,6 +35,31 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
37
35
 
38
36
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
39
37
 
38
+ var getRandomInRange = function getRandomInRange(min, max) {
39
+ return Math.floor(Math.random() * (max - min + 1)) + min;
40
+ };
41
+
42
+ var handleObjectChange = function handleObjectChange(updateObject, updateFunction) {
43
+ return function (data) {
44
+ var prop = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
45
+ var isNumber = arguments.length > 2 ? arguments[2] : undefined;
46
+ var value;
47
+
48
+ if (data !== null && data !== void 0 && data.target) {
49
+ value = data.target.type === 'checkbox' ? data.target.checked : data.target.value;
50
+ } else value = data;
51
+
52
+ value = isNumber ? +value : value;
53
+ var props = prop.split('.');
54
+ var currentObject = props.reduce(function (res, chapter, index) {
55
+ if (props.length !== index + 1) res = res[chapter];
56
+ return res;
57
+ }, updateObject);
58
+ currentObject[props.pop()] = value;
59
+ updateFunction();
60
+ };
61
+ };
62
+
40
63
  var InputsRow = function InputsRow(_ref) {
41
64
  var items = _ref.items,
42
65
  title = _ref.title,
@@ -63,7 +86,7 @@ var InputsRow = function InputsRow(_ref) {
63
86
  data = _useState2[0],
64
87
  setData = _useState2[1];
65
88
 
66
- var onChange = (0, _utils.handleObjectChange)(setData, function () {
89
+ var onChange = handleObjectChange(setData, function () {
67
90
  return setData(_objectSpread({}, data));
68
91
  });
69
92
 
@@ -77,7 +100,7 @@ var InputsRow = function InputsRow(_ref) {
77
100
  param: '',
78
101
  value: '',
79
102
  description: '',
80
- rowId: (0, _uuid.v4)()
103
+ rowId: getRandomInRange(1, 1000)
81
104
  }]);
82
105
  setRows(newRow);
83
106
  onChange(newRow);
@@ -136,10 +159,10 @@ var InputsRow = function InputsRow(_ref) {
136
159
  return onDelete(index);
137
160
  },
138
161
  className: "inputs-row--trash"
139
- }, /*#__PURE__*/_react.default.createElement(_fi.FiTrash2, null)));
162
+ }, /*#__PURE__*/_react.default.createElement(_reactFeather.Trash2, null)));
140
163
  }), rows.length < 10 && /*#__PURE__*/_react.default.createElement(_Button.default, {
141
164
  onClick: handleAddRow,
142
- text: "Add row",
165
+ label: "Add row",
143
166
  className: "inputs-row--add-btn"
144
167
  }));
145
168
  };
@@ -1,5 +1,3 @@
1
- @import "../../../scss/vars";
2
-
3
1
  .inputs-row {
4
2
  &--input {
5
3
  width: 200px;
@@ -20,7 +18,7 @@
20
18
  border-radius: 5px;
21
19
 
22
20
  svg {
23
- color: $color--secondary;
21
+ color: #f06d8d;
24
22
  }
25
23
  }
26
24
 
@@ -11,8 +11,6 @@ var _react = _interopRequireDefault(require("react"));
11
11
 
12
12
  var _InputsRow = _interopRequireDefault(require("./InputsRow"));
13
13
 
14
- require("../../../../scss/main.scss");
15
-
16
14
  global.lng = 'en';
17
15
  var _default = {
18
16
  title: 'InputsRow',
@@ -17,8 +17,6 @@ var _Hint = _interopRequireDefault(require("../../UI/Hint/Hint"));
17
17
 
18
18
  require("./Label.scss");
19
19
 
20
- var RC = 'label';
21
-
22
20
  var Label = function Label(_ref) {
23
21
  var label = _ref.label,
24
22
  isBold = _ref.isBold,
@@ -27,13 +25,13 @@ var Label = function Label(_ref) {
27
25
  className = _ref.className,
28
26
  isRequired = _ref.isRequired;
29
27
  return /*#__PURE__*/_react.default.createElement("span", {
30
- className: (0, _classnames.default)("".concat(RC), (0, _defineProperty2.default)({}, "".concat(RC, "_bold"), isBold), className)
28
+ className: (0, _classnames.default)("label", (0, _defineProperty2.default)({}, "label_bold", isBold), className)
31
29
  }, label, isRequired && /*#__PURE__*/_react.default.createElement("span", {
32
30
  className: "label_isRequired"
33
31
  }, "*"), hint && /*#__PURE__*/_react.default.createElement(_Hint.default, {
34
32
  hint: hint,
35
33
  side: hintSide,
36
- className: "".concat(RC, "-hint")
34
+ className: "label-hint"
37
35
  }));
38
36
  };
39
37
 
@@ -1,8 +1,6 @@
1
- @import '../../../scss/vars';
2
-
3
1
  .label {
4
2
  display: flex;
5
- color: $color--dark;
3
+ color: #1e1e2d;
6
4
  font-size: 13px;
7
5
 
8
6
  &_bold {
@@ -11,8 +11,6 @@ var _react = _interopRequireDefault(require("react"));
11
11
 
12
12
  var _Label = _interopRequireDefault(require("./Label"));
13
13
 
14
- require("../../../../scss/main.scss");
15
-
16
14
  global.lng = 'en';
17
15
  var _default = {
18
16
  title: 'Label',
@@ -13,12 +13,10 @@ var _react = _interopRequireDefault(require("react"));
13
13
 
14
14
  var _classnames = _interopRequireDefault(require("classnames"));
15
15
 
16
- var _io = require("react-icons/io5");
16
+ var _reactFeather = require("react-feather");
17
17
 
18
18
  var _Button = _interopRequireDefault(require("../../UI/Button/Button"));
19
19
 
20
- require("../../../../scss/main.scss");
21
-
22
20
  require("./Modal.scss");
23
21
 
24
22
  var Modal = function Modal(_ref) {
@@ -60,12 +58,12 @@ var Modal = function Modal(_ref) {
60
58
  className: (0, _classnames.default)('modal__header', (0, _defineProperty2.default)({}, "modal__header-".concat(variant), variant))
61
59
  }, /*#__PURE__*/_react.default.createElement("span", {
62
60
  className: (0, _classnames.default)('modal__header-title', (0, _defineProperty2.default)({}, "modal__header-".concat(variant, "-title"), variant))
63
- }, /*#__PURE__*/_react.default.createElement("span", null, renderModalTitle())), /*#__PURE__*/_react.default.createElement("div", {
61
+ }, renderModalTitle()), /*#__PURE__*/_react.default.createElement("div", {
64
62
  onClick: closeModal,
65
63
  className: (0, _classnames.default)('modal-close-icon-box', {
66
64
  'modal-close-icon-box-primary': variant === 'primary'
67
65
  })
68
- }, /*#__PURE__*/_react.default.createElement(_io.IoClose, {
66
+ }, /*#__PURE__*/_react.default.createElement(_reactFeather.X, {
69
67
  className: "modal-close-icon"
70
68
  }))), /*#__PURE__*/_react.default.createElement("div", {
71
69
  className: "modal__body"
@@ -74,12 +72,12 @@ var Modal = function Modal(_ref) {
74
72
  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
75
73
  variant: "dark-outline",
76
74
  onClick: closeModal,
77
- text: closeBtnText || 'Cancel'
75
+ label: closeBtnText || 'Cancel'
78
76
  }), !noConfirmBtn && /*#__PURE__*/_react.default.createElement(_Button.default, {
79
77
  onClick: function onClick() {
80
78
  return handleConfirm();
81
79
  },
82
- text: confirmBtnLabel || (mode === null || mode === void 0 ? void 0 : mode[0].toUpperCase()) + (mode === null || mode === void 0 ? void 0 : mode.slice(1)) || 'Apply',
80
+ label: confirmBtnLabel || (mode === null || mode === void 0 ? void 0 : mode[0].toUpperCase()) + (mode === null || mode === void 0 ? void 0 : mode.slice(1)) || 'Apply',
83
81
  className: "ml5",
84
82
  variant: confirmBtnVariant
85
83
  }))));
@@ -1,6 +1,3 @@
1
- @import "../../../scss/anme/anme-vars";
2
- @import "../../../scss/anme/anme-mixins";
3
-
4
1
  .modal-overlay {
5
2
  position: fixed;
6
3
  top: 0;
@@ -36,7 +33,7 @@
36
33
  border-top-right-radius: 4px;
37
34
 
38
35
  &-primary {
39
- background-color: $color--primary;
36
+ background-color: #6b81dd;
40
37
 
41
38
  &-title {
42
39
  color: #ffff !important;
@@ -47,7 +44,7 @@
47
44
  &-title {
48
45
  font-size: 16px;
49
46
  font-weight: 400;
50
- color: $color--primary;
47
+ color: #6b81dd;
51
48
  }
52
49
  }
53
50
 
@@ -59,7 +56,59 @@
59
56
  border-bottom-left-radius: 4px;
60
57
  border-bottom-right-radius: 4px;
61
58
 
62
- @include custom-scroll2;
59
+ scrollbar-color: rgb(186, 194, 201) rgba(0, 0, 0, 0) !important;
60
+ scrollbar-width: thin !important;
61
+
62
+ scrollbar {
63
+ -moz-appearance: none !important;
64
+ }
65
+ scrollbarbutton {
66
+ -moz-appearance: none !important;
67
+ }
68
+ thumb {
69
+ -moz-appearance: none !important;
70
+ }
71
+ scrollcorner {
72
+ -moz-appearance: none !important;
73
+ resize: both;
74
+ }
75
+ // overflow-y: overlay;
76
+
77
+ &::-webkit-scrollbar {
78
+ width: 4px;
79
+ }
80
+
81
+ &::-webkit-scrollbar-thumb {
82
+ -webkit-border-radius: 3px;
83
+ border-radius: 3px;
84
+ background: #bac2c9;
85
+
86
+ &:hover {
87
+ background: #9aa0b9;
88
+ }
89
+ }
90
+
91
+ &::-webkit-scrollbar:horizontal {
92
+ height: 8px;
93
+ }
94
+
95
+ &::-webkit-scrollbar-track:horizontal {
96
+ background: inherit;
97
+ }
98
+
99
+ &::-webkit-scrollbar-thumb:horizontal {
100
+ -webkit-border-radius: 6px;
101
+ border-radius: 6px;
102
+ background: #bac2c9;
103
+ background-clip: padding-box;
104
+ border: 2px solid rgba(0, 0, 0, 0);
105
+
106
+ &:hover {
107
+ background: #9aa0b9;
108
+ border: 1px solid rgba(0, 0, 0, 0);
109
+ background-clip: padding-box;
110
+ }
111
+ }
63
112
  }
64
113
 
65
114
  &__footer {
@@ -87,6 +136,11 @@
87
136
  left: calc(50% - 210px);
88
137
  }
89
138
 
139
+ &-770 {
140
+ width: 770px;
141
+ left: calc(50% - 385px);
142
+ }
143
+
90
144
  &-870 {
91
145
  width: 870px;
92
146
  left: calc(50% - 435px);
@@ -163,7 +217,7 @@
163
217
  }
164
218
 
165
219
  .included-selector-modal {
166
- .simple-table {
220
+ .table {
167
221
  min-height: 400px;
168
222
  max-height: 500px;
169
223
  }
@@ -45,7 +45,7 @@ var _default = {
45
45
  size: {
46
46
  control: {
47
47
  type: 'select',
48
- options: ['default', '290', '420', '870', '950']
48
+ options: ['default', '290', '420', '870', '770', '950']
49
49
  }
50
50
  }
51
51
  },
@@ -58,7 +58,7 @@ var _default = {
58
58
  size: {
59
59
  control: {
60
60
  type: 'select',
61
- options: ['default', '290', '420', '870', '950']
61
+ options: ['default', '290', '420', '770', '870', '950']
62
62
  }
63
63
  }
64
64
  };
@@ -78,7 +78,7 @@ var Template = function Template(args) {
78
78
  onClick: function onClick() {
79
79
  return setIsOpen(true);
80
80
  },
81
- text: "Show modal"
81
+ label: "Show modal"
82
82
  }), /*#__PURE__*/_react.default.createElement(_Modal.default, (0, _extends2.default)({
83
83
  closeModal: closeModal,
84
84
  isOpen: isOpen
@@ -25,8 +25,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
25
25
 
26
26
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
27
27
 
28
- var RC = 'multiselect';
29
-
30
28
  var MultiSelect = function MultiSelect(_ref) {
31
29
  var options = _ref.options,
32
30
  chosenOptions = _ref.chosenOptions,
@@ -52,7 +50,7 @@ var MultiSelect = function MultiSelect(_ref) {
52
50
  return label.toLowerCase().includes(searchValue.toLowerCase());
53
51
  });
54
52
  return /*#__PURE__*/_react.default.createElement("div", {
55
- className: RC
53
+ className: "multiselect"
56
54
  }, /*#__PURE__*/_react.default.createElement(_Input.default, {
57
55
  value: searchValue,
58
56
  onChange: function onChange(value) {
@@ -60,7 +58,7 @@ var MultiSelect = function MultiSelect(_ref) {
60
58
  },
61
59
  placeholder: "Search"
62
60
  }), /*#__PURE__*/_react.default.createElement("div", {
63
- className: "".concat(RC, "__list")
61
+ className: "multiselect__list"
64
62
  }, filteredOptions.map(function (_ref3) {
65
63
  var label = _ref3.label,
66
64
  value = _ref3.value,
@@ -72,7 +70,7 @@ var MultiSelect = function MultiSelect(_ref) {
72
70
  onChange: function onChange(state) {
73
71
  return checkHandler(state, value);
74
72
  },
75
- className: "".concat(RC, "__item")
73
+ className: "multiselect__item"
76
74
  });
77
75
  })));
78
76
  };
@@ -1,10 +1,8 @@
1
- @import "../../../scss/vars";
2
-
3
1
  .multiselect {
4
2
  display: inline-flex;
5
3
  flex-direction: column;
6
4
  background-color: #fff;
7
- border: 1px solid $color--gray--light;
5
+ border: 1px solid #e2e5ec;
8
6
  border-radius: 4px;
9
7
  padding: 8px 10px;
10
8
 
@@ -17,8 +17,6 @@ var _react = _interopRequireWildcard(require("react"));
17
17
 
18
18
  var _MultiSelect = _interopRequireDefault(require("./MultiSelect"));
19
19
 
20
- require("../../../../scss/main.scss");
21
-
22
20
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
23
21
 
24
22
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -15,7 +15,7 @@ var _reactRouterDom = require("react-router-dom");
15
15
 
16
16
  var _classnames = _interopRequireDefault(require("classnames"));
17
17
 
18
- var Icons = _interopRequireWildcard(require("react-icons/fi"));
18
+ var Icons = _interopRequireWildcard(require("react-feather"));
19
19
 
20
20
  require("./NavLine.scss");
21
21
 
@@ -67,7 +67,7 @@ var NavLine = function NavLine(_ref) {
67
67
  })
68
68
  }, item.label), item.count !== undefined ? /*#__PURE__*/_react.default.createElement("span", {
69
69
  className: "nav-line--count ml5"
70
- }, "(", item.count || 0, ")") : null)) : /*#__PURE__*/_react.default.createElement(_reactRouterDom.Link, {
70
+ }, "(", item.count || 0, ")") : null)) : /*#__PURE__*/_react.default.createElement(_reactRouterDom.NavLink, {
71
71
  to: "".concat(root).concat(item.tabId, "/"),
72
72
  key: "tab__".concat(item.tabId),
73
73
  className: (0, _classnames.default)({
@@ -1,5 +1,3 @@
1
- @import "../../../scss/anme/anme-vars";
2
-
3
1
  .nav-line {
4
2
  &__inner {
5
3
  display: flex;
@@ -41,8 +39,8 @@
41
39
  font-weight: 500;
42
40
  border-top: 2px solid #6b81dd;
43
41
  cursor: default;
44
- border-left: 1px solid $color--border;
45
- border-right: 1px solid $color--border;
42
+ border-left: 1px solid #cfcfcf;
43
+ border-right: 1px solid #cfcfcf;
46
44
  text-decoration: none;
47
45
  }
48
46
  }
@@ -52,7 +50,7 @@
52
50
  flex-wrap: wrap;
53
51
  padding: 24px 32px;
54
52
  font-size: 13px;
55
- border-top: 1px solid $color--border;
53
+ border-top: 1px solid #cfcfcf;
56
54
  margin-left: -32px;
57
55
  margin-right: -32px;
58
56
  background-color: #f7fafc;
@@ -76,7 +74,7 @@
76
74
  cursor: pointer;
77
75
  font-size: 13px;
78
76
  color: #1e1e2d;
79
- border-bottom: 1px solid $color--border;
77
+ border-bottom: 1px solid #cfcfcf;
80
78
  user-select: none;
81
79
  margin-bottom: -1px;
82
80
  border-bottom: 2px solid transparent;
@@ -15,13 +15,13 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
15
15
 
16
16
  var _react = _interopRequireWildcard(require("react"));
17
17
 
18
+ var _reactRouterDom = require("react-router-dom");
19
+
18
20
  var _NavLine = _interopRequireDefault(require("./NavLine"));
19
21
 
20
22
  var _Alert = _interopRequireDefault(require("../../UI/Alert/Alert"));
21
23
 
22
- var _Status = _interopRequireDefault(require("../Status/Status"));
23
-
24
- require("../../../../scss/main.scss");
24
+ var _Status = _interopRequireDefault(require("../../UI/Status/Status"));
25
25
 
26
26
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
27
27
 
@@ -61,10 +61,10 @@ var Template = function Template(args) {
61
61
  activeTab = _useState2[0],
62
62
  setActiveTab = _useState2[1];
63
63
 
64
- return /*#__PURE__*/_react.default.createElement(_NavLine.default, (0, _extends2.default)({}, args, {
64
+ return /*#__PURE__*/_react.default.createElement(_reactRouterDom.BrowserRouter, null, /*#__PURE__*/_react.default.createElement(_NavLine.default, (0, _extends2.default)({}, args, {
65
65
  activeTab: activeTab,
66
66
  onChange: setActiveTab
67
- }), navLineContent[activeTab]);
67
+ }), navLineContent[activeTab]));
68
68
  };
69
69
 
70
70
  var NavLineSimpleTemplate = Template.bind({});
@@ -76,19 +76,25 @@ NavLineSimpleTemplate.args = {
76
76
  variant: 'simple',
77
77
  isLocal: false,
78
78
  items: [{
79
- tabId: 'general'
79
+ tabId: 'general',
80
+ label: 'Tab1'
80
81
  }, {
81
- tabId: 'payments'
82
+ tabId: 'payments',
83
+ label: 'Tab2'
82
84
  }, {
83
- tabId: 'filters'
85
+ tabId: 'filters',
86
+ label: 'Tab3'
84
87
  }, {
85
88
  tabId: 'offers',
89
+ label: 'Tab4',
86
90
  count: 2
87
91
  }, {
88
92
  tabId: 'merchants',
93
+ label: 'Tab5',
89
94
  count: 15
90
95
  }, {
91
- tabId: 'integration'
96
+ tabId: 'integration',
97
+ label: 'Tab6'
92
98
  }, {
93
99
  tabId: 'tab',
94
100
  label: 'Disabled tab',
@@ -100,19 +106,21 @@ NavLineTemplate.args = {
100
106
  isLocal: false,
101
107
  items: [{
102
108
  tabId: 'customDetails',
103
- icon: 'FiGift'
109
+ label: 'Tab1',
110
+ icon: 'Gift'
104
111
  }, {
105
112
  tabId: 'postsLog',
106
- icon: 'FiGift',
113
+ label: 'Tab2',
114
+ icon: 'Gift',
107
115
  count: 43
108
116
  }, {
109
117
  tabId: 'tab1',
110
118
  label: 'disabled tab',
111
- icon: 'FiGift',
119
+ icon: 'Gift',
112
120
  status: 'disabled'
113
121
  }, {
114
122
  tabId: 'tab2',
115
123
  label: 'tab 2',
116
- icon: 'FiGift'
124
+ icon: 'Gift'
117
125
  }]
118
126
  };
@@ -11,8 +11,6 @@ var _react = _interopRequireDefault(require("react"));
11
11
 
12
12
  var _RadioInput = _interopRequireDefault(require("./RadioInput"));
13
13
 
14
- require("../../../../scss/main.scss");
15
-
16
14
  global.lng = 'en';
17
15
  var _default = {
18
16
  title: 'RadioInput',
@@ -11,8 +11,6 @@ var _react = _interopRequireDefault(require("react"));
11
11
 
12
12
  var _RangeInputs = _interopRequireDefault(require("./RangeInputs"));
13
13
 
14
- require("../../../../scss/main.scss");
15
-
16
14
  require("./RangeInputs.scss");
17
15
 
18
16
  global.lng = 'en';
@@ -17,8 +17,6 @@ var _react = _interopRequireWildcard(require("react"));
17
17
 
18
18
  var _Switcher = _interopRequireDefault(require("./Switcher"));
19
19
 
20
- require("../../../../scss/main.scss");
21
-
22
20
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
23
21
 
24
22
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -21,7 +21,7 @@ var _TdActions = require("../TdTypes/TdActions");
21
21
 
22
22
  var _AdvancedTags = _interopRequireDefault(require("../../../UI/AdvancedTag/AdvancedTags"));
23
23
 
24
- var _Status = _interopRequireDefault(require("../../Status/Status"));
24
+ var _Status = _interopRequireDefault(require("../../../UI/Status/Status"));
25
25
 
26
26
  var _Tag = _interopRequireDefault(require("../../Tag/Tag"));
27
27