intelicoreact 0.2.94 → 0.2.95

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.
@@ -49,7 +49,7 @@ var CheckboxInput = function CheckboxInput(_ref) {
49
49
  ref: function ref(elem) {
50
50
  if (elem) elem.indeterminate = isStark;
51
51
  },
52
- "data-testid": "checkbox--input--".concat(testId || label && (label === null || label === void 0 ? void 0 : label.replace(/\s/g, '-')) || id || key)
52
+ "data-testid": "checkbox--input--".concat(testId || key)
53
53
  })), /*#__PURE__*/_react.default.createElement("span", {
54
54
  className: "checkbox-input__mark"
55
55
  })), label && /*#__PURE__*/_react.default.createElement("div", {
@@ -77,7 +77,6 @@ var TieredCheckboxes = function TieredCheckboxes(_ref) {
77
77
  return item;
78
78
  });
79
79
  parent.disabled = true;
80
- console.log(parent);
81
80
  } else {
82
81
  var _parent = items.find(function (item) {
83
82
  return item.key === parentKey;
@@ -108,6 +107,7 @@ var TieredCheckboxes = function TieredCheckboxes(_ref) {
108
107
  key: child.key,
109
108
  className: "".concat(RC, "__children")
110
109
  }, /*#__PURE__*/_react.default.createElement(_CheckboxInput.default, {
110
+ testId: child.key,
111
111
  label: child.label,
112
112
  value: child.value,
113
113
  disabled: child === null || child === void 0 ? void 0 : child.disabled,
@@ -75,7 +75,7 @@ var AccordionTable = function AccordionTable(_ref) {
75
75
  key = _ref3[0],
76
76
  value = _ref3[1];
77
77
 
78
- return /*#__PURE__*/_react.default.createElement("div", {
78
+ return key !== 'promoDetails' && /*#__PURE__*/_react.default.createElement("div", {
79
79
  key: key,
80
80
  style: {
81
81
  flexBasis: "".concat((_getHeaderItem = getHeaderItem(key)) === null || _getHeaderItem === void 0 ? void 0 : _getHeaderItem.width, "%")
@@ -89,8 +89,20 @@ var AccordionTable = function AccordionTable(_ref) {
89
89
  return rows === null || rows === void 0 ? void 0 : rows.map(function (row, index) {
90
90
  return /*#__PURE__*/_react.default.createElement("div", {
91
91
  key: index,
92
- className: (0, _classnames.default)('accordion-table__tr', row.className)
93
- }, renderTd(row.cols || row));
92
+ className: (0, _classnames.default)('accordion-table__tr', {
93
+ 'accordion-table__tr-with-promo': row.promoDetails
94
+ }, row.className)
95
+ }, /*#__PURE__*/_react.default.createElement("div", {
96
+ className: "df w100"
97
+ }, renderTd(row.cols || row)), row.promoDetails && /*#__PURE__*/_react.default.createElement("div", {
98
+ className: "accordion-table__tr-promo-wrapper"
99
+ }, /*#__PURE__*/_react.default.createElement("div", {
100
+ className: "accordion-table__tr-promo"
101
+ }, /*#__PURE__*/_react.default.createElement(Tag, {
102
+ className: "tr-promo-icon"
103
+ }), /*#__PURE__*/_react.default.createElement("span", {
104
+ className: "tr-promo-label"
105
+ }, "PROMOTION"), row.promoDetails)));
94
106
  });
95
107
  };
96
108
 
@@ -101,14 +113,30 @@ var AccordionTable = function AccordionTable(_ref) {
101
113
  },
102
114
  className: "accordion-table__accordion-label-box"
103
115
  }, /*#__PURE__*/_react.default.createElement("div", {
104
- className: "j4"
116
+ className: "accordion-table__accordion-label-wrapper j4"
105
117
  }, /*#__PURE__*/_react.default.createElement(_reactFeather.ChevronDown, {
106
118
  className: (0, _classnames.default)('accordion-label-box__icon', {
107
119
  'accordion-label-box__icon--open': row.isOpen
108
120
  })
109
121
  }), /*#__PURE__*/_react.default.createElement("span", {
110
122
  className: "accordion-label-box__label"
111
- }, row.label)), /*#__PURE__*/_react.default.createElement("div", null, row.titleContent));
123
+ }, row.label), row.statistics && /*#__PURE__*/_react.default.createElement("div", {
124
+ className: (0, _classnames.default)('accordion-table__tr', row.className)
125
+ }, Object.entries(row.statistics).map(function (_ref4) {
126
+ var _getHeaderItem3, _getHeaderItem4;
127
+
128
+ var _ref5 = (0, _slicedToArray2.default)(_ref4, 2),
129
+ key = _ref5[0],
130
+ value = _ref5[1];
131
+
132
+ return /*#__PURE__*/_react.default.createElement("div", {
133
+ key: key,
134
+ style: {
135
+ flexBasis: "".concat((_getHeaderItem3 = getHeaderItem(key)) === null || _getHeaderItem3 === void 0 ? void 0 : _getHeaderItem3.width, "%")
136
+ },
137
+ className: (0, _classnames.default)('accordion-table__statistics-td', (_getHeaderItem4 = getHeaderItem(key)) === null || _getHeaderItem4 === void 0 ? void 0 : _getHeaderItem4.className)
138
+ }, value);
139
+ }))), row.titleContent);
112
140
  };
113
141
 
114
142
  (0, _react.useEffect)(function () {
@@ -1,9 +1,9 @@
1
1
  .accordion-table {
2
2
  display: flex;
3
- flex-direction: column;
3
+ overflow-x: auto;
4
4
  align-items: flex-start;
5
+ flex-direction: column;
5
6
  justify-content: flex-start;
6
- overflow-x: auto;
7
7
  width: 100%;
8
8
  min-width: 700px;
9
9
 
@@ -17,22 +17,23 @@
17
17
  &__header-item {
18
18
  display: flex;
19
19
  align-items: center;
20
- white-space: nowrap;
20
+ padding: 5px 10px;
21
21
  user-select: none;
22
+ white-space: nowrap;
22
23
  text-transform: uppercase;
23
24
  color: #757f8c;
25
+ background-color: #ebeff2;
24
26
  font-size: 11px;
25
27
  font-weight: 500;
26
- padding: 5px 10px;
27
- background-color: #ebeff2;
28
28
 
29
29
  &:first-child {
30
- border-top-left-radius: 8px;
31
30
  padding-left: 15px;
31
+ border-top-left-radius: 8px;
32
32
  }
33
+
33
34
  &:last-child {
34
- border-top-right-radius: 8px;
35
35
  padding-right: 15px;
36
+ border-top-right-radius: 8px;
36
37
  }
37
38
  }
38
39
 
@@ -44,27 +45,29 @@
44
45
  &:not(:first-child) {
45
46
  border-top: 1px solid #ebeff2;
46
47
  }
48
+
47
49
  &:last-child {
48
50
  .mono-accordion__container {
49
- border-bottom-left-radius: 8px;
50
51
  border-bottom-right-radius: 8px;
52
+ border-bottom-left-radius: 8px;
51
53
  }
52
54
  }
53
55
 
54
56
  &--closed {
55
57
  .mono-accordion__head {
56
58
  transition: all 0.3s ease-out;
57
- box-shadow: 0px 5px 8px rgba(255, 255, 255, 0.12)!important;
59
+ box-shadow: 0 5px 8px rgb(255 255 255 / 12%) !important;
58
60
  }
59
61
 
60
62
  .mono-accordion__container {
61
63
  transition: all 0.3s ease-out;
62
64
  opacity: 0;
63
65
  }
66
+
64
67
  &:last-child {
65
68
  .mono-accordion__head {
66
- border-bottom-left-radius: 8px;
67
69
  border-bottom-right-radius: 8px;
70
+ border-bottom-left-radius: 8px;
68
71
  }
69
72
  }
70
73
  }
@@ -82,9 +85,9 @@
82
85
  }
83
86
 
84
87
  &__td {
85
- padding: 15px 0px;
86
- border-bottom: 1px solid #ebeff2;
88
+ padding: 11.5px 0;
87
89
  white-space: nowrap;
90
+ border-bottom: 1px solid #ebeff2;
88
91
  font-size: 14px;
89
92
  font-weight: 400;
90
93
 
@@ -96,8 +99,8 @@
96
99
  margin-right: 15px;
97
100
  }
98
101
 
99
- &:not(:first-child):not(:last-child) {
100
- padding-right: 30px;
102
+ &:not(:first-child, :last-child) {
103
+ padding-right: 20px;
101
104
  }
102
105
  }
103
106
 
@@ -107,24 +110,103 @@
107
110
  justify-content: space-between;
108
111
  }
109
112
 
113
+ &__accordion-label-wrapper {
114
+ width: 100%;
115
+ max-height: 19px;
116
+
117
+ .accordion-table__tr {
118
+ justify-content: flex-end;
119
+ background-color: unset !important;
120
+ }
121
+
122
+ .accordion-table__td:first-child {
123
+ margin-left: 0;
124
+ }
125
+
126
+ .accordion-table__td:last-child {
127
+ margin-right: 0;
128
+ }
129
+ }
130
+
131
+ &__statistics-td {
132
+ padding: 15px 0;
133
+ white-space: nowrap;
134
+ font-size: 14px;
135
+ font-weight: 400;
136
+
137
+ &:first-child {
138
+ padding-left: 20px;
139
+ }
140
+
141
+ &:not(:last-child) {
142
+ padding-right: 20px;
143
+ }
144
+ }
145
+
146
+ &__tr-promo-wrapper {
147
+ margin-left: 50px;
148
+ margin-right: 15px;
149
+ border-bottom: 1px solid #ebeff2;
150
+ }
151
+
152
+ &__tr-with-promo {
153
+ flex-direction: column;
154
+
155
+ .accordion-table__td {
156
+ border-bottom: none;
157
+ padding: 15px 0 8px;
158
+ }
159
+ }
160
+
161
+ &__tr-promo {
162
+ background-color: #fff4e5;
163
+ border: 1px solid #ffce9f;
164
+ border-radius: 8px;
165
+ height: 16px;
166
+ display: flex;
167
+ align-items: center;
168
+ padding: 4px 8px;
169
+ font-size: 12px;
170
+ font-weight: 400;
171
+ line-height: 18px;
172
+ letter-spacing: 0.2px;
173
+ color: #3b414b;
174
+ margin-bottom: 10px;
175
+ width: 40%;
176
+ }
177
+
178
+ .tr-promo-icon {
179
+ color: #ff7d00;
180
+ }
181
+
182
+ .tr-promo-label {
183
+ font-weight: 600;
184
+ color: #ff7d00;
185
+ margin-right: 8px;
186
+ }
187
+
110
188
  .accordion-label-box {
111
189
  &__label {
112
190
  user-select: none;
191
+ white-space: nowrap;
113
192
  }
193
+
114
194
  &__icon {
115
- transition: all 0.2s ease-out;
116
- color: #757f8c;
117
- margin-right: 5px;
118
195
  min-width: 32px;
119
196
  max-width: 32px;
120
197
  min-height: 16px;
121
198
  max-height: 16px;
199
+ margin-right: 5px;
200
+ transition: all 0.2s ease-out;
201
+ color: #757f8c;
122
202
 
123
203
  &--open {
124
204
  transform: rotate(180deg);
125
205
  }
126
206
  }
207
+
127
208
  &__status {
209
+ white-space: nowrap;
128
210
  font-size: 12px;
129
211
  font-weight: 400;
130
212
  }
@@ -132,17 +214,19 @@
132
214
 
133
215
  .mono-accordion {
134
216
  &__head {
135
- padding: 14.5px;
136
- box-shadow: 0px 5px 8px rgba(39, 73, 113, 0.12);
137
- background-color: #ffff;
138
217
  position: relative;
139
218
  z-index: 2;
219
+ padding: 14.5px;
220
+ background-color: #ffff;
221
+ box-shadow: 0 5px 8px rgb(39 73 113 / 12%);
140
222
  }
223
+
141
224
  &__container {
142
- flex-direction: row;
143
225
  position: relative;
226
+ flex-direction: row;
144
227
  background-color: #ffff;
145
228
  }
229
+
146
230
  &__content-wrapper {
147
231
  width: 100%;
148
232
  padding: 0;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "intelicoreact",
3
- "version": "0.2.94",
3
+ "version": "0.2.95",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "files": [