intelicoreact 0.3.2 → 0.3.5

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 (5) hide show
  1. package/dist/Atomic/FormElements/Input/Input.js +3 -2
  2. package/dist/Atomic/FormElements/UserContacts/UserContacts.js +4 -1
  3. package/dist/Atomic/UI/AdvancedTag/AdvTag.js +97 -53
  4. package/dist/Atomic/UI/AdvancedTag/AdvancedTags.scss +99 -66
  5. package/package.json +1 -1
package/dist/Atomic/FormElements/Input/Input.js CHANGED
@@ -78,7 +78,8 @@ var Input = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
78
78
  _ref$isCropFirstNool = _ref.isCropFirstNool,
79
79
  isCropFirstNool = _ref$isCropFirstNool === void 0 ? false : _ref$isCropFirstNool,
80
80
  _ref$testId = _ref.testId,
81
- testId = _ref$testId === void 0 ? 'input' : _ref$testId;
81
+ testId = _ref$testId === void 0 ? 'input' : _ref$testId,
82
+ action = _ref.action;
82
83
  var DEFAULT_BLINK_TIME = 100; // STATES
83
84
 
84
85
  var _useState = (0, _react.useState)(false),
@@ -241,7 +242,7 @@ var Input = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
241
242
  onMouseLeave: function onMouseLeave() {
242
243
  return setOnInputHover(false);
243
244
  }
244
- }, renderInput(), icon, withDelete && onInputHover && /*#__PURE__*/_react.default.createElement("span", {
245
+ }, renderInput(), icon, action, withDelete && onInputHover && /*#__PURE__*/_react.default.createElement("span", {
245
246
  "data-testid": "icon-close",
246
247
  className: (0, _classnames.default)("input__close", {
247
248
  hidden: !value
package/dist/Atomic/FormElements/UserContacts/UserContacts.js CHANGED
@@ -35,6 +35,7 @@ var UserContacts = function UserContacts(props) {
35
35
  var _ref = props || {},
36
36
  email = _ref.email,
37
37
  phone = _ref.phone,
38
+ contactType = _ref.contactType,
38
39
  _ref$isDisputeContact = _ref.isDisputeContact,
39
40
  isDisputeContact = _ref$isDisputeContact === void 0 ? null : _ref$isDisputeContact,
40
41
  _ref$isSalesContact = _ref.isSalesContact,
@@ -117,7 +118,9 @@ var UserContacts = function UserContacts(props) {
117
118
  target: "_blank",
118
119
  rel: "noreferrer",
119
120
  className: (0, _classnames.default)('no-wrap', "".concat(RC, "__phone"), (0, _defineProperty2.default)({}, "".concat(RC, "__phone_icon-mode"), isUsePhonelIcon))
120
- }, isUsePhonelIcon ? PIcon : phone), isContact && /*#__PURE__*/_react.default.createElement("span", {
121
+ }, isUsePhonelIcon ? PIcon : phone), !!contactType && /*#__PURE__*/_react.default.createElement("span", {
122
+ className: (0, _classnames.default)('no-wrap', "".concat(RC, "__contactType"))
123
+ }, contactType), isContact && /*#__PURE__*/_react.default.createElement("span", {
121
124
  ref: contactsRef,
122
125
  className: (0, _classnames.default)('no-wrap', "".concat(RC, "__contacts"))
123
126
  }, isSalesContact ? "".concat(Lng('Sales')).concat(getComma()) : '', isDisputeContact ? "".concat(Lng('Dispute')).concat(getComma()) : '', isAccountingContact ? "".concat(Lng('Accounting ')) : '', "contact"));
package/dist/Atomic/UI/AdvancedTag/AdvTag.js CHANGED
@@ -42,7 +42,15 @@ var AdvTag = function AdvTag(_ref) {
42
42
  warnLeft = item.warnLeft,
43
43
  warnLeftMsg = item.warnLeftMsg,
44
44
  warnRightMsg = item.warnRightMsg,
45
- noPingTree = item.noPingTree;
45
+ noPingTree = item.noPingTree,
46
+ _item$isEntityAndCoun = item.isEntityAndCounter,
47
+ isEntityAndCounter = _item$isEntityAndCoun === void 0 ? false : _item$isEntityAndCoun,
48
+ _item$entityAndCounte = item.entityAndCounter,
49
+ entityAndCounter = _item$entityAndCounte === void 0 ? {
50
+ nullCounterMessage: '',
51
+ title: '',
52
+ counter: null
53
+ } : _item$entityAndCounte;
46
54
 
47
55
  var _useState = (0, _react.useState)(false),
48
56
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -86,58 +94,94 @@ var AdvTag = function AdvTag(_ref) {
86
94
  return document.removeEventListener('click', handleClickOutside, true);
87
95
  };
88
96
  });
89
- return /*#__PURE__*/_react.default.createElement("div", {
90
- className: advancedTagClass,
91
- ref: hintRef
92
- }, warnLeft && /*#__PURE__*/_react.default.createElement("div", {
93
- "data-testid": "".concat(testId, "-left"),
94
- className: "pointer",
95
- onMouseEnter: function onMouseEnter() {
96
- return onWarningClick('warnLeft');
97
- },
98
- onMouseLeave: function onMouseLeave() {
99
- return setIsOpen(false);
100
- }
101
- }, /*#__PURE__*/_react.default.createElement(_reactFeather.AlertTriangle, {
102
- width: 16,
103
- height: 16,
104
- className: "advanced-tags--warning-icon mr5"
105
- })), labelLeft && /*#__PURE__*/_react.default.createElement("span", {
106
- className: "mr5"
107
- }, labelLeft), labelRight && /*#__PURE__*/_react.default.createElement("span", null, labelRight), item.type !== 'simple' ? /*#__PURE__*/_react.default.createElement("span", {
108
- className: "ml5 mr5"
109
- }, "|") : null, item.type !== 'simple' ? /*#__PURE__*/_react.default.createElement("div", {
110
- className: "df"
111
- }, /*#__PURE__*/_react.default.createElement("span", {
112
- className: activeNumberClass
113
- }, active), /*#__PURE__*/_react.default.createElement("span", {
114
- className: "strong color--pause"
115
- }, "/"), /*#__PURE__*/_react.default.createElement("span", {
116
- className: pauseNumberClass
117
- }, pause)) : null, item.type !== 'simple' ? /*#__PURE__*/_react.default.createElement("span", {
118
- className: "ml5 mr5"
119
- }, "|") : null, merchants ? /*#__PURE__*/_react.default.createElement("span", null, merchants) : item.type !== 'simple' && /*#__PURE__*/_react.default.createElement("div", {
120
- "data-testid": "".concat(testId, "-right"),
121
- className: "pointer",
122
- onMouseEnter: function onMouseEnter() {
123
- return onWarningClick('warnRight');
124
- },
125
- onMouseLeave: function onMouseLeave() {
126
- return setIsOpen(false);
127
- }
128
- }, /*#__PURE__*/_react.default.createElement(_reactFeather.AlertTriangle, {
129
- width: 16,
130
- height: 16,
131
- className: "advanced-tags--warning-icon"
132
- })), isOpen && warnLeftMsg && clickedWarning === 'warnLeft' ? /*#__PURE__*/_react.default.createElement("span", {
133
- className: (0, _classnames.default)('advanced-tags__warn-text advanced-tags__warn-text--warnLeft', {
134
- 'advanced-tags__warn-text--warnLeft--to-top': toTop
135
- })
136
- }, warnLeftMsg) : null, isOpen && warnRightMsg && clickedWarning === 'warnRight' ? /*#__PURE__*/_react.default.createElement("span", {
137
- className: (0, _classnames.default)('advanced-tags__warn-text', 'advanced-tags__warn-text--warnRight', {
138
- 'advanced-tags__warn-text--warnRight--to-top': toTop
139
- })
140
- }, warnRightMsg) : null);
97
+
98
+ var renderClassicTag = function renderClassicTag() {
99
+ return /*#__PURE__*/_react.default.createElement("div", {
100
+ className: advancedTagClass,
101
+ ref: hintRef
102
+ }, warnLeft && /*#__PURE__*/_react.default.createElement("div", {
103
+ "data-testid": "".concat(testId, "-left"),
104
+ className: "pointer",
105
+ onMouseEnter: function onMouseEnter() {
106
+ return onWarningClick('warnLeft');
107
+ },
108
+ onMouseLeave: function onMouseLeave() {
109
+ return setIsOpen(false);
110
+ }
111
+ }, /*#__PURE__*/_react.default.createElement(_reactFeather.AlertTriangle, {
112
+ width: 16,
113
+ height: 16,
114
+ className: "advanced-tags--warning-icon mr5"
115
+ })), labelLeft && /*#__PURE__*/_react.default.createElement("span", {
116
+ className: "mr5"
117
+ }, labelLeft), labelRight && /*#__PURE__*/_react.default.createElement("span", null, labelRight), item.type !== 'simple' ? /*#__PURE__*/_react.default.createElement("span", {
118
+ className: "ml5 mr5"
119
+ }, "|") : null, item.type !== 'simple' ? /*#__PURE__*/_react.default.createElement("div", {
120
+ className: "df"
121
+ }, /*#__PURE__*/_react.default.createElement("span", {
122
+ className: activeNumberClass
123
+ }, active), /*#__PURE__*/_react.default.createElement("span", {
124
+ className: "strong color--pause"
125
+ }, "/"), /*#__PURE__*/_react.default.createElement("span", {
126
+ className: pauseNumberClass
127
+ }, pause)) : null, item.type !== 'simple' ? /*#__PURE__*/_react.default.createElement("span", {
128
+ className: "ml5 mr5"
129
+ }, "|") : null, merchants ? /*#__PURE__*/_react.default.createElement("span", null, merchants) : item.type !== 'simple' && /*#__PURE__*/_react.default.createElement("div", {
130
+ "data-testid": "".concat(testId, "-right"),
131
+ className: "pointer",
132
+ onMouseEnter: function onMouseEnter() {
133
+ return onWarningClick('warnRight');
134
+ },
135
+ onMouseLeave: function onMouseLeave() {
136
+ return setIsOpen(false);
137
+ }
138
+ }, /*#__PURE__*/_react.default.createElement(_reactFeather.AlertTriangle, {
139
+ width: 16,
140
+ height: 16,
141
+ className: "advanced-tags--warning-icon"
142
+ })), isOpen && warnLeftMsg && clickedWarning === 'warnLeft' ? /*#__PURE__*/_react.default.createElement("span", {
143
+ className: (0, _classnames.default)('advanced-tags__warn-text advanced-tags__warn-text--warnLeft', {
144
+ 'advanced-tags__warn-text--warnLeft--to-top': toTop
145
+ })
146
+ }, warnLeftMsg) : null, isOpen && warnRightMsg && clickedWarning === 'warnRight' ? /*#__PURE__*/_react.default.createElement("span", {
147
+ className: (0, _classnames.default)('advanced-tags__warn-text', 'advanced-tags__warn-text--warnRight', {
148
+ 'advanced-tags__warn-text--warnRight--to-top': toTop
149
+ })
150
+ }, warnRightMsg) : null);
151
+ };
152
+
153
+ var renderWithEntityAndCounterTag = function renderWithEntityAndCounterTag() {
154
+ var _entityAndCounter$cou;
155
+
156
+ var isNullcounter = (entityAndCounter === null || entityAndCounter === void 0 ? void 0 : (_entityAndCounter$cou = entityAndCounter.counter) === null || _entityAndCounter$cou === void 0 ? void 0 : _entityAndCounter$cou.toString()) === '0';
157
+ return /*#__PURE__*/_react.default.createElement("div", {
158
+ className: advancedTagClass,
159
+ ref: hintRef
160
+ }, isNullcounter && /*#__PURE__*/_react.default.createElement("div", {
161
+ "data-testid": "".concat(testId, "-left"),
162
+ className: "pointer",
163
+ onMouseEnter: function onMouseEnter() {
164
+ return onWarningClick('warnLeft');
165
+ },
166
+ onMouseLeave: function onMouseLeave() {
167
+ return setIsOpen(false);
168
+ }
169
+ }, /*#__PURE__*/_react.default.createElement(_reactFeather.AlertTriangle, {
170
+ width: 16,
171
+ height: 16,
172
+ className: "advanced-tags--warning-icon mr5"
173
+ })), isOpen && entityAndCounter !== null && entityAndCounter !== void 0 && entityAndCounter.nullCounterMessage && clickedWarning === 'warnLeft' ? /*#__PURE__*/_react.default.createElement("span", {
174
+ className: (0, _classnames.default)('advanced-tags__warn-text advanced-tags__warn-text--warnLeft', {
175
+ 'advanced-tags__warn-text--warnLeft--to-top': toTop
176
+ })
177
+ }, entityAndCounter === null || entityAndCounter === void 0 ? void 0 : entityAndCounter.nullCounterMessage) : null, (entityAndCounter === null || entityAndCounter === void 0 ? void 0 : entityAndCounter.title) && /*#__PURE__*/_react.default.createElement("span", {
178
+ className: "mr5"
179
+ }, entityAndCounter === null || entityAndCounter === void 0 ? void 0 : entityAndCounter.title), /*#__PURE__*/_react.default.createElement("div", {
180
+ className: "advanced-tags__counter ".concat(isNullcounter ? 'advanced-tags__counter--null' : 'advanced-tags__counter--bold')
181
+ }, entityAndCounter === null || entityAndCounter === void 0 ? void 0 : entityAndCounter.counter));
182
+ };
183
+
184
+ return !isEntityAndCounter ? renderClassicTag() : renderWithEntityAndCounterTag();
141
185
  };
142
186
 
143
187
  var _default = AdvTag;
package/dist/Atomic/UI/AdvancedTag/AdvancedTags.scss CHANGED
@@ -1,82 +1,115 @@
1
1
  .advanced-tags {
2
- display: inline-flex;
3
- background-color: #e2e5ec;
4
- height: 24px;
5
- align-items: center;
6
- justify-content: center;
7
- border-radius: 2px;
8
- padding: 2px 8px;
9
- margin-right: 4px;
2
+ display: inline-flex;
3
+ background-color: #e2e5ec;
4
+ height: 24px;
5
+ align-items: center;
6
+ justify-content: center;
7
+ border-radius: 2px;
8
+ padding: 2px 8px;
9
+ margin-right: 4px;
10
+ font-size: 10px;
11
+ position: relative;
12
+ margin-top: 2.5px;
13
+ margin-bottom: 2.5px;
14
+
15
+ &--error {
16
+ background-color: #fce2e8;
17
+ }
18
+
19
+
20
+
21
+ &--warning-icon {
22
+ min-height: 16px;
23
+ min-width: 16px;
24
+ font-size: 17px;
25
+ color: #f06d8d;
26
+ }
27
+
28
+ &__warn-text {
29
+ position: absolute;
30
+ background-color: #6b81dd;
31
+ color: #fff;
10
32
  font-size: 10px;
11
- position: relative;
12
- margin-top: 2.5px;
13
- margin-bottom: 2.5px;
33
+ line-height: 16px;
34
+ border-radius: 4px;
35
+ max-width: 270px;
36
+ min-width: 80px;
37
+ padding: 8px;
38
+ z-index: 2;
14
39
 
15
- &--error {
16
- background-color: #fce2e8;
40
+ &:before {
41
+ content: '';
42
+ position: absolute;
43
+ width: 8.5px;
44
+ height: 8.5px;
45
+ background-color: #6b81dd;
46
+ transform: rotate(45deg);
17
47
  }
18
48
 
49
+ &--warnLeft {
50
+ top: 30px;
51
+ left: 4px;
19
52
 
53
+ &:before {
54
+ left: 8px;
55
+ top: -4px;
56
+ }
20
57
 
21
- &--warning-icon {
22
- min-height: 16px;
23
- min-width: 16px;
24
- font-size: 17px;
25
- color: #f06d8d;
58
+ &--to-top {
59
+ top: -50px;
60
+ }
26
61
  }
27
62
 
28
- &__warn-text {
29
- position: absolute;
30
- background-color: #6b81dd;
31
- color: #fff;
32
- font-size: 10px;
33
- line-height: 16px;
34
- border-radius: 4px;
35
- max-width: 270px;
36
- min-width: 80px;
37
- padding: 8px;
38
- z-index: 2;
39
- // white-space: nowrap;
40
- &:before {
41
- content: '';
42
- position: absolute;
43
- width: 8.5px;
44
- height: 8.5px;
45
- background-color: #6b81dd;
46
- transform: rotate(45deg);
47
- }
48
-
49
- &--warnLeft {
50
- top: 30px;
51
- left: 4px;
52
-
53
- &:before {
54
- left: 8px;
55
- top: -4px;
56
- }
57
- &--to-top {
58
- top: -50px;
59
- }
60
- }
61
-
62
- &--warnRight {
63
- top: 30px;
64
- &:before {
65
- right: 10px;
66
- top: -4px;
67
- }
68
- &--to-top {
69
- top: -50px;
70
- }
71
- }
63
+ &--warnRight {
64
+ top: 30px;
65
+
66
+ &:before {
67
+ right: 10px;
68
+ top: -4px;
69
+ }
72
70
 
71
+ &--to-top {
72
+ top: -50px;
73
+ }
73
74
  }
74
75
 
75
- &--showMore {
76
- background-color: #ffedc8;
77
- cursor: pointer;
78
- user-select: none;
76
+ }
77
+
78
+ &--showMore {
79
+ background-color: #ffedc8;
80
+ cursor: pointer;
81
+ user-select: none;
82
+ }
83
+
84
+
85
+ &__counter {
86
+ text-align: center;
87
+ margin-right: -8px;
88
+ padding: 0 8px 0;
89
+ width: fit-content;
90
+ position: relative;
91
+
92
+ &::after {
93
+ content: '';
94
+ position: absolute;
95
+ height: 27px;
96
+ width: 2px;
97
+ background-color: #9AA0B9;
98
+ opacity: 0.2;
99
+ left: 0;
100
+ top: -7px;
79
101
  }
80
102
 
103
+ &--null {
104
+ color: #9AA0B9;
105
+ opacity: 0.7;
106
+ }
81
107
 
108
+ &--bold {
109
+ font-family: 'Roboto';
110
+ font-weight: 700;
111
+ font-size: 11px;
112
+ color: #1E1E2D;
113
+ }
114
+ }
82
115
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "intelicoreact",
3
- "version": "0.3.2",
3
+ "version": "0.3.5",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "files": [