linear-react-components-ui 0.4.76-rc.9 → 0.4.76
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/.husky/pre-commit +2 -2
- package/.tool-versions +1 -0
- package/.vscode/settings.json +1 -2
- package/README.md +40 -5
- package/lib/assets/styles/button.scss +19 -10
- package/lib/assets/styles/checkbox.scss +92 -70
- package/lib/assets/styles/commons.scss +36 -0
- package/lib/assets/styles/drawers.scss +22 -6
- package/lib/assets/styles/dropdown.scss +28 -2
- package/lib/assets/styles/effects.scss +32 -0
- package/lib/assets/styles/floatMenu.scss +0 -1
- package/lib/assets/styles/gridlayout.scss +2 -1
- package/lib/assets/styles/input.scss +21 -0
- package/lib/assets/styles/label.scss +9 -1
- package/lib/assets/styles/list.scss +8 -0
- package/lib/assets/styles/multiSelect.scss +105 -0
- package/lib/assets/styles/panel.scss +3 -1
- package/lib/assets/styles/periodpicker.scss +65 -0
- package/lib/assets/styles/progress.scss +8 -1
- package/lib/assets/styles/radio.scss +19 -0
- package/lib/assets/styles/select.scss +4 -3
- package/lib/assets/styles/sidenav.scss +11 -1
- package/lib/assets/styles/skeleton.scss +48 -0
- package/lib/assets/styles/table.scss +25 -5
- package/lib/assets/styles/tabs.scss +116 -75
- package/lib/assets/styles/treeview.scss +41 -0
- package/lib/assets/styles/uitour.scss +112 -0
- package/lib/avatar/avatar.spec.js +17 -6
- package/lib/avatar/index.js +1 -1
- package/lib/buttons/DefaultButton.js +13 -4
- package/lib/buttons/split_button/index.js +8 -4
- package/lib/checkbox/Label.js +37 -0
- package/lib/checkbox/checkbox.spec.js +16 -16
- package/lib/checkbox/index.js +33 -12
- package/lib/dialog/base/index.js +15 -6
- package/lib/dialog/form/index.js +24 -4
- package/lib/drawer/Drawer.js +9 -5
- package/lib/drawer/Header.js +15 -5
- package/lib/drawer/index.js +4 -1
- package/lib/dropdown/Popup.js +3 -2
- package/lib/form/Field.js +2 -0
- package/lib/form/FieldNumber.js +11 -3
- package/lib/form/FieldPeriod.js +100 -0
- package/lib/form/form.spec.js +8 -0
- package/lib/form/helpers.js +20 -1
- package/lib/form/index.js +220 -218
- package/lib/form/withFieldHOC.js +5 -1
- package/lib/form/withFormSecurity.js +106 -0
- package/lib/icons/helper.js +24 -0
- package/lib/inputs/base/InputTextBase.js +30 -5
- package/lib/inputs/base/helpers.js +13 -9
- package/lib/inputs/date/Dropdown.js +3 -3
- package/lib/inputs/date/date.spec.js +46 -36
- package/lib/inputs/date/helpers.js +36 -0
- package/lib/inputs/date/index.js +12 -10
- package/lib/inputs/mask/Phone.js +10 -1
- package/lib/inputs/mask/imaskHOC.js +2 -1
- package/lib/inputs/mask/input_mask.spec.js +21 -4
- package/lib/inputs/multiSelect/ActionButtons.js +68 -0
- package/lib/inputs/multiSelect/Dropdown.js +200 -0
- package/lib/inputs/multiSelect/helper.js +18 -0
- package/lib/inputs/multiSelect/index.js +343 -0
- package/lib/inputs/number/BaseNumber.js +1 -1
- package/lib/inputs/number/index.js +7 -5
- package/lib/inputs/period/Dialog.js +38 -0
- package/lib/inputs/period/Dropdown.js +90 -0
- package/lib/inputs/period/PeriodList.js +79 -0
- package/lib/inputs/period/helper.js +118 -0
- package/lib/inputs/period/index.js +490 -0
- package/lib/inputs/search/index.js +2 -0
- package/lib/inputs/select/Dropdown.js +55 -65
- package/lib/inputs/select/helper.js +65 -2
- package/lib/inputs/select/index.js +26 -3
- package/lib/inputs/select/multiple/index.js +16 -11
- package/lib/inputs/select/simple/index.js +39 -24
- package/lib/internals/constants.js +4 -3
- package/lib/internals/withTooltip.js +86 -82
- package/lib/labels/DefaultLabel.js +7 -4
- package/lib/list/Item.js +35 -9
- package/lib/list/helpers.js +8 -3
- package/lib/list/index.js +172 -14
- package/lib/list/list.spec.js +290 -89
- package/lib/menus/float/MenuItem.js +25 -8
- package/lib/menus/sidenav/NavMenuItem.js +17 -8
- package/lib/menus/sidenav/index.js +59 -86
- package/lib/menus/sidenav/popup_menu_search/index.js +26 -17
- package/lib/menus/sidenav/sidenav.spec.js +86 -19
- package/lib/panel/Header.js +4 -3
- package/lib/progress/Bar.js +40 -9
- package/lib/progress/index.js +12 -4
- package/lib/radio/index.js +9 -6
- package/lib/skeleton/SkeletonContainer.js +42 -0
- package/lib/skeleton/index.js +84 -0
- package/lib/spinner/index.js +6 -1
- package/lib/split/Split.js +5 -11
- package/lib/table/Body.js +55 -11
- package/lib/table/Header.js +14 -1
- package/lib/table/HeaderColumn.js +26 -3
- package/lib/table/Row.js +19 -8
- package/lib/table/RowColumn.js +23 -3
- package/lib/table/helpers.js +11 -1
- package/lib/table/index.js +41 -8
- package/lib/tabs/DropdownItems.js +84 -0
- package/lib/tabs/Menu.js +12 -9
- package/lib/tabs/MenuItems.js +15 -9
- package/lib/tabs/Panel.js +1 -3
- package/lib/tabs/index.js +156 -22
- package/lib/tabs/tabs.spec.js +8 -5
- package/lib/toolbar/ButtonBar.js +30 -24
- package/lib/toolbar/LabelBar.js +22 -27
- package/lib/toolbar/helpers.js +12 -0
- package/lib/toolbar/index.js +24 -9
- package/lib/tooltip/index.js +20 -7
- package/lib/treeview/Node.js +364 -49
- package/lib/treeview/index.js +475 -36
- package/lib/treeview/treeview.spec.js +18 -0
- package/lib/uitour/helpers.js +15 -0
- package/lib/uitour/index.js +271 -0
- package/lib/uitour/uitour.spec.js +176 -0
- package/package.json +9 -8
package/lib/list/list.spec.js
CHANGED
|
@@ -34,9 +34,16 @@ describe('Components', function () {
|
|
|
34
34
|
title: "defaut"
|
|
35
35
|
}, listHeaderProps), /*#__PURE__*/_react["default"].createElement("p", {
|
|
36
36
|
className: "listheader-child"
|
|
37
|
-
}, "saas")), /*#__PURE__*/_react["default"].createElement(_index.ListItem,
|
|
37
|
+
}, "saas")), /*#__PURE__*/_react["default"].createElement(_index.ListItem, _extends({
|
|
38
|
+
itemId: "1"
|
|
39
|
+
}, listItemProps), /*#__PURE__*/_react["default"].createElement(_buttons["default"], {
|
|
38
40
|
customClass: "childbuttontest",
|
|
39
41
|
label: "Teste Child"
|
|
42
|
+
})), /*#__PURE__*/_react["default"].createElement(_index.ListItem, _extends({
|
|
43
|
+
itemId: "2"
|
|
44
|
+
}, listItemProps), /*#__PURE__*/_react["default"].createElement(_buttons["default"], {
|
|
45
|
+
customClass: "childbuttontest",
|
|
46
|
+
label: "Teste Child 2"
|
|
40
47
|
}))));
|
|
41
48
|
};
|
|
42
49
|
|
|
@@ -92,17 +99,189 @@ describe('Components', function () {
|
|
|
92
99
|
|
|
93
100
|
expect(container.firstChild).toHaveStyle(style);
|
|
94
101
|
});
|
|
102
|
+
it('should select item by id', function () {
|
|
103
|
+
var _render6 = (0, _react2.render)(list({
|
|
104
|
+
selectable: true,
|
|
105
|
+
onSelectItem: jest.fn(),
|
|
106
|
+
selectedItemId: '1'
|
|
107
|
+
})),
|
|
108
|
+
container = _render6.container;
|
|
109
|
+
|
|
110
|
+
var listItem = container.querySelector('.item-container');
|
|
111
|
+
expect(listItem).toHaveClass('-activedlist');
|
|
112
|
+
});
|
|
113
|
+
it('should select next item when pressed arrow down', function () {
|
|
114
|
+
var _render7 = (0, _react2.render)(list({
|
|
115
|
+
selectable: true,
|
|
116
|
+
onSelectItem: jest.fn()
|
|
117
|
+
})),
|
|
118
|
+
container = _render7.container;
|
|
119
|
+
|
|
120
|
+
var listComponent = container.querySelector('.list-component');
|
|
121
|
+
|
|
122
|
+
_react2.fireEvent.keyDown(listComponent, {
|
|
123
|
+
key: 'ArrowDown',
|
|
124
|
+
code: 'ArrowDown',
|
|
125
|
+
keyCode: 40
|
|
126
|
+
});
|
|
127
|
+
|
|
128
|
+
_react2.fireEvent.keyDown(listComponent, {
|
|
129
|
+
key: 'ArrowDown',
|
|
130
|
+
code: 'ArrowDown',
|
|
131
|
+
keyCode: 40
|
|
132
|
+
});
|
|
133
|
+
|
|
134
|
+
expect(container.querySelectorAll('.item-container')[1]).toHaveClass('-activedlist');
|
|
135
|
+
});
|
|
136
|
+
it('should select previous item when pressed arrow down', function () {
|
|
137
|
+
var _render8 = (0, _react2.render)(list({
|
|
138
|
+
selectable: true,
|
|
139
|
+
onSelectItem: jest.fn()
|
|
140
|
+
})),
|
|
141
|
+
container = _render8.container;
|
|
142
|
+
|
|
143
|
+
var listComponent = container.querySelector('.list-component');
|
|
144
|
+
|
|
145
|
+
_react2.fireEvent.keyDown(listComponent, {
|
|
146
|
+
key: 'ArrowDown',
|
|
147
|
+
code: 'ArrowDown',
|
|
148
|
+
keyCode: 40
|
|
149
|
+
});
|
|
150
|
+
|
|
151
|
+
_react2.fireEvent.keyDown(listComponent, {
|
|
152
|
+
key: 'ArrowDown',
|
|
153
|
+
code: 'ArrowDown',
|
|
154
|
+
keyCode: 40
|
|
155
|
+
});
|
|
156
|
+
|
|
157
|
+
_react2.fireEvent.keyDown(listComponent, {
|
|
158
|
+
key: 'ArrowUp',
|
|
159
|
+
code: 'ArrowUp',
|
|
160
|
+
keyCode: 38
|
|
161
|
+
});
|
|
162
|
+
|
|
163
|
+
expect(container.querySelectorAll('.item-container')[0]).toHaveClass('-activedlist');
|
|
164
|
+
});
|
|
165
|
+
it('should select last item when pressed arrow up at first item', function () {
|
|
166
|
+
var _render9 = (0, _react2.render)(list({
|
|
167
|
+
selectable: true,
|
|
168
|
+
onSelectItem: jest.fn()
|
|
169
|
+
})),
|
|
170
|
+
container = _render9.container;
|
|
171
|
+
|
|
172
|
+
var listComponent = container.querySelector('.list-component');
|
|
173
|
+
|
|
174
|
+
_react2.fireEvent.keyDown(listComponent, {
|
|
175
|
+
key: 'ArrowDown',
|
|
176
|
+
code: 'ArrowDown',
|
|
177
|
+
keyCode: 40
|
|
178
|
+
});
|
|
179
|
+
|
|
180
|
+
_react2.fireEvent.keyDown(listComponent, {
|
|
181
|
+
key: 'ArrowUp',
|
|
182
|
+
code: 'ArrowUp',
|
|
183
|
+
keyCode: 38
|
|
184
|
+
});
|
|
185
|
+
|
|
186
|
+
expect(container.querySelectorAll('.item-container')[1]).toHaveClass('-activedlist');
|
|
187
|
+
});
|
|
188
|
+
it('should select first item when pressed arrow down at last item', function () {
|
|
189
|
+
var _render10 = (0, _react2.render)(list({
|
|
190
|
+
selectable: true,
|
|
191
|
+
onSelectItem: jest.fn()
|
|
192
|
+
})),
|
|
193
|
+
container = _render10.container;
|
|
194
|
+
|
|
195
|
+
var listComponent = container.querySelector('.list-component');
|
|
196
|
+
|
|
197
|
+
_react2.fireEvent.keyDown(listComponent, {
|
|
198
|
+
key: 'ArrowDown',
|
|
199
|
+
code: 'ArrowDown',
|
|
200
|
+
keyCode: 40
|
|
201
|
+
});
|
|
202
|
+
|
|
203
|
+
_react2.fireEvent.keyDown(listComponent, {
|
|
204
|
+
key: 'ArrowDown',
|
|
205
|
+
code: 'ArrowDown',
|
|
206
|
+
keyCode: 40
|
|
207
|
+
});
|
|
208
|
+
|
|
209
|
+
_react2.fireEvent.keyDown(listComponent, {
|
|
210
|
+
key: 'ArrowDown',
|
|
211
|
+
code: 'ArrowDown',
|
|
212
|
+
keyCode: 40
|
|
213
|
+
});
|
|
214
|
+
|
|
215
|
+
expect(container.querySelectorAll('.item-container')[0]).toHaveClass('-activedlist');
|
|
216
|
+
});
|
|
217
|
+
it('should fire event when press Enter key', function () {
|
|
218
|
+
var mockOnSelectItem = jest.fn();
|
|
219
|
+
var itemId = '1';
|
|
220
|
+
|
|
221
|
+
var _render11 = (0, _react2.render)(list({
|
|
222
|
+
selectable: true,
|
|
223
|
+
onSelectItem: mockOnSelectItem
|
|
224
|
+
})),
|
|
225
|
+
container = _render11.container;
|
|
226
|
+
|
|
227
|
+
var listComponent = container.querySelector('.list-component');
|
|
228
|
+
|
|
229
|
+
_react2.fireEvent.keyDown(listComponent, {
|
|
230
|
+
key: 'ArrowDown',
|
|
231
|
+
code: 'ArrowDown',
|
|
232
|
+
keyCode: 40
|
|
233
|
+
});
|
|
234
|
+
|
|
235
|
+
var listItem = container.querySelector('.list-component .item-container.-activedlist');
|
|
236
|
+
|
|
237
|
+
_react2.fireEvent.keyDown(listItem, {
|
|
238
|
+
key: 'Enter',
|
|
239
|
+
code: 'Enter',
|
|
240
|
+
keyCode: 13
|
|
241
|
+
});
|
|
242
|
+
|
|
243
|
+
expect(mockOnSelectItem).toHaveBeenCalledWith(itemId);
|
|
244
|
+
});
|
|
245
|
+
it('should render skeletonize when true', function () {
|
|
246
|
+
var _render12 = (0, _react2.render)(list({
|
|
247
|
+
skeletonize: true
|
|
248
|
+
})),
|
|
249
|
+
container = _render12.container;
|
|
250
|
+
|
|
251
|
+
var skeleton = container.querySelector('.item-container .item .skeleton-component');
|
|
252
|
+
expect(skeleton).toBeInTheDocument();
|
|
253
|
+
});
|
|
254
|
+
it('should render five skeletons when skeletonize', function () {
|
|
255
|
+
var _render13 = (0, _react2.render)(list({
|
|
256
|
+
skeletonize: true,
|
|
257
|
+
skeletonItens: 5
|
|
258
|
+
})),
|
|
259
|
+
container = _render13.container;
|
|
260
|
+
|
|
261
|
+
var skeletons = container.querySelectorAll('.item-container .item .skeleton-component');
|
|
262
|
+
expect(skeletons.length).toBe(5);
|
|
263
|
+
});
|
|
264
|
+
it('should define skeleton height', function () {
|
|
265
|
+
var _render14 = (0, _react2.render)(list({
|
|
266
|
+
skeletonize: true,
|
|
267
|
+
skeletonHeight: 36
|
|
268
|
+
})),
|
|
269
|
+
container = _render14.container;
|
|
270
|
+
|
|
271
|
+
var skeleton = container.querySelector('.item-container .item .skeleton-component');
|
|
272
|
+
expect(skeleton).toHaveStyle('height: 36px');
|
|
273
|
+
});
|
|
95
274
|
describe('prop selectable', function () {
|
|
96
275
|
it('should allow ListItem to be selected', function () {
|
|
97
276
|
var listItemProps = {
|
|
98
|
-
itemId: '1',
|
|
99
277
|
onClick: jest.fn()
|
|
100
278
|
};
|
|
101
279
|
|
|
102
|
-
var
|
|
103
|
-
selectable: true
|
|
280
|
+
var _render15 = (0, _react2.render)(list({
|
|
281
|
+
selectable: true,
|
|
282
|
+
selectedItemId: '1'
|
|
104
283
|
}, {}, listItemProps)),
|
|
105
|
-
container =
|
|
284
|
+
container = _render15.container;
|
|
106
285
|
|
|
107
286
|
var listItem = container.querySelector('.item-container');
|
|
108
287
|
|
|
@@ -110,22 +289,37 @@ describe('Components', function () {
|
|
|
110
289
|
|
|
111
290
|
expect(listItem).toHaveClass('-activedlist');
|
|
112
291
|
});
|
|
292
|
+
it('should call onSelectItem', function () {
|
|
293
|
+
var mockOnSelectItem = jest.fn();
|
|
294
|
+
|
|
295
|
+
var _render16 = (0, _react2.render)(list({
|
|
296
|
+
selectable: true,
|
|
297
|
+
onSelectItem: mockOnSelectItem
|
|
298
|
+
})),
|
|
299
|
+
container = _render16.container;
|
|
300
|
+
|
|
301
|
+
var listItem = container.querySelector('.item-container');
|
|
302
|
+
|
|
303
|
+
_react2.fireEvent.click(listItem);
|
|
304
|
+
|
|
305
|
+
expect(mockOnSelectItem).toHaveBeenCalledWith('1');
|
|
306
|
+
});
|
|
113
307
|
});
|
|
114
308
|
});
|
|
115
309
|
describe('ListHeader', function () {
|
|
116
310
|
it('should render correctly', function () {
|
|
117
|
-
var
|
|
118
|
-
container =
|
|
311
|
+
var _render17 = (0, _react2.render)(list()),
|
|
312
|
+
container = _render17.container;
|
|
119
313
|
|
|
120
314
|
expect(container.querySelector('.list-header')).toBeTruthy();
|
|
121
315
|
});
|
|
122
316
|
it('should apply title', function () {
|
|
123
317
|
var title = 'Teste Header';
|
|
124
318
|
|
|
125
|
-
var
|
|
319
|
+
var _render18 = (0, _react2.render)(list({}, {
|
|
126
320
|
title: title
|
|
127
321
|
})),
|
|
128
|
-
container =
|
|
322
|
+
container = _render18.container;
|
|
129
323
|
|
|
130
324
|
var listHeaderTitle = container.querySelector('.list-header > .title');
|
|
131
325
|
expect(listHeaderTitle).toBeTruthy();
|
|
@@ -137,10 +331,10 @@ describe('Components', function () {
|
|
|
137
331
|
paddingBottom: '2px'
|
|
138
332
|
};
|
|
139
333
|
|
|
140
|
-
var
|
|
334
|
+
var _render19 = (0, _react2.render)(list({}, {
|
|
141
335
|
style: style
|
|
142
336
|
})),
|
|
143
|
-
container =
|
|
337
|
+
container = _render19.container;
|
|
144
338
|
|
|
145
339
|
var listHeader = container.querySelector('.list-header');
|
|
146
340
|
expect(listHeader).toHaveStyle(style);
|
|
@@ -148,17 +342,17 @@ describe('Components', function () {
|
|
|
148
342
|
it('should apply customClass', function () {
|
|
149
343
|
var customClass = 'teste-listheader';
|
|
150
344
|
|
|
151
|
-
var
|
|
345
|
+
var _render20 = (0, _react2.render)(list({}, {
|
|
152
346
|
customClass: customClass
|
|
153
347
|
})),
|
|
154
|
-
container =
|
|
348
|
+
container = _render20.container;
|
|
155
349
|
|
|
156
350
|
var listHeader = container.querySelector('.list-header');
|
|
157
351
|
expect(listHeader).toHaveClass(customClass);
|
|
158
352
|
});
|
|
159
353
|
it('should render children', function () {
|
|
160
|
-
var
|
|
161
|
-
container =
|
|
354
|
+
var _render21 = (0, _react2.render)(list()),
|
|
355
|
+
container = _render21.container;
|
|
162
356
|
|
|
163
357
|
var listHeaderChild = container.querySelector('.list-header > .listheader-child');
|
|
164
358
|
expect(listHeaderChild).toBeTruthy();
|
|
@@ -166,8 +360,8 @@ describe('Components', function () {
|
|
|
166
360
|
});
|
|
167
361
|
describe('ListItem', function () {
|
|
168
362
|
it('should render correctly', function () {
|
|
169
|
-
var
|
|
170
|
-
container =
|
|
363
|
+
var _render22 = (0, _react2.render)(list()),
|
|
364
|
+
container = _render22.container;
|
|
171
365
|
|
|
172
366
|
var listItem = container.querySelector('.item-container');
|
|
173
367
|
expect(listItem).toBeTruthy();
|
|
@@ -175,10 +369,10 @@ describe('Components', function () {
|
|
|
175
369
|
it('should apply text', function () {
|
|
176
370
|
var text = 'Teste Item 1';
|
|
177
371
|
|
|
178
|
-
var
|
|
372
|
+
var _render23 = (0, _react2.render)(list({}, {}, {
|
|
179
373
|
text: text
|
|
180
374
|
})),
|
|
181
|
-
container =
|
|
375
|
+
container = _render23.container;
|
|
182
376
|
|
|
183
377
|
var listItemText = container.querySelector('.item-container .text');
|
|
184
378
|
expect(listItemText).toBeTruthy();
|
|
@@ -187,10 +381,10 @@ describe('Components', function () {
|
|
|
187
381
|
it('should apply subtext', function () {
|
|
188
382
|
var subText = 'Teste Item 1';
|
|
189
383
|
|
|
190
|
-
var
|
|
384
|
+
var _render24 = (0, _react2.render)(list({}, {}, {
|
|
191
385
|
subText: subText
|
|
192
386
|
})),
|
|
193
|
-
container =
|
|
387
|
+
container = _render24.container;
|
|
194
388
|
|
|
195
389
|
var listItemSubText = container.querySelector('.item-container .subtext');
|
|
196
390
|
expect(listItemSubText).toBeTruthy();
|
|
@@ -202,10 +396,10 @@ describe('Components', function () {
|
|
|
202
396
|
paddingBottom: '2px'
|
|
203
397
|
};
|
|
204
398
|
|
|
205
|
-
var
|
|
399
|
+
var _render25 = (0, _react2.render)(list({}, {}, {
|
|
206
400
|
style: style
|
|
207
401
|
})),
|
|
208
|
-
container =
|
|
402
|
+
container = _render25.container;
|
|
209
403
|
|
|
210
404
|
var listItem = container.querySelector('.item-container');
|
|
211
405
|
expect(listItem).toHaveStyle(style);
|
|
@@ -213,41 +407,41 @@ describe('Components', function () {
|
|
|
213
407
|
describe('prop separator', function () {
|
|
214
408
|
var separator = true;
|
|
215
409
|
it('apply list-separator css class to text/subtext/children container', function () {
|
|
216
|
-
var
|
|
410
|
+
var _render26 = (0, _react2.render)(list({}, {}, {
|
|
217
411
|
text: 'Teste',
|
|
218
412
|
separator: separator
|
|
219
413
|
})),
|
|
220
|
-
container =
|
|
414
|
+
container = _render26.container;
|
|
221
415
|
|
|
222
416
|
var listItemTextContainer = container.querySelector('.item-container .item');
|
|
223
417
|
expect(listItemTextContainer).toHaveClass('list-separator');
|
|
224
418
|
});
|
|
225
419
|
it('apply list-separator css class to leftIcon/leftElement container', function () {
|
|
226
|
-
var
|
|
420
|
+
var _render27 = (0, _react2.render)(list({}, {}, {
|
|
227
421
|
leftIconName: 'pencil',
|
|
228
422
|
separator: separator
|
|
229
423
|
})),
|
|
230
|
-
container =
|
|
424
|
+
container = _render27.container;
|
|
231
425
|
|
|
232
426
|
var listItemLeftElContainer = container.querySelector('.item-container .item.-icon-left');
|
|
233
427
|
expect(listItemLeftElContainer).toHaveClass('list-separator');
|
|
234
428
|
});
|
|
235
429
|
it('apply list-separator css class to rightIcon/rightElement container', function () {
|
|
236
|
-
var
|
|
430
|
+
var _render28 = (0, _react2.render)(list({}, {}, {
|
|
237
431
|
rightIconName: 'pencil',
|
|
238
432
|
separator: separator
|
|
239
433
|
})),
|
|
240
|
-
container =
|
|
434
|
+
container = _render28.container;
|
|
241
435
|
|
|
242
436
|
var listItemRightElContainer = container.querySelector('.item-container .item.-icon-right');
|
|
243
437
|
expect(listItemRightElContainer).toHaveClass('list-separator');
|
|
244
438
|
});
|
|
245
439
|
});
|
|
246
440
|
it('prop hovered should apply css class hovered ', function () {
|
|
247
|
-
var
|
|
441
|
+
var _render29 = (0, _react2.render)(list({}, {}, {
|
|
248
442
|
hovered: true
|
|
249
443
|
})),
|
|
250
|
-
container =
|
|
444
|
+
container = _render29.container;
|
|
251
445
|
|
|
252
446
|
var listItem = container.querySelector('.item-container');
|
|
253
447
|
expect(listItem).toHaveClass('hovered');
|
|
@@ -257,11 +451,11 @@ describe('Components', function () {
|
|
|
257
451
|
it('should disable onClick event', function () {
|
|
258
452
|
var mockFunc = jest.fn();
|
|
259
453
|
|
|
260
|
-
var
|
|
454
|
+
var _render30 = (0, _react2.render)(list({}, {}, {
|
|
261
455
|
disabled: disabled,
|
|
262
456
|
onClick: mockFunc
|
|
263
457
|
})),
|
|
264
|
-
container =
|
|
458
|
+
container = _render30.container;
|
|
265
459
|
|
|
266
460
|
var listItem = container.querySelector('.item-container');
|
|
267
461
|
|
|
@@ -270,53 +464,53 @@ describe('Components', function () {
|
|
|
270
464
|
expect(mockFunc).not.toBeCalled();
|
|
271
465
|
});
|
|
272
466
|
it('apply disabled css class to text/subtext/children container', function () {
|
|
273
|
-
var
|
|
467
|
+
var _render31 = (0, _react2.render)(list({}, {}, {
|
|
274
468
|
text: 'Teste',
|
|
275
469
|
disabled: disabled
|
|
276
470
|
})),
|
|
277
|
-
container =
|
|
471
|
+
container = _render31.container;
|
|
278
472
|
|
|
279
473
|
var listItemTextContainer = container.querySelector('.item-container .item');
|
|
280
474
|
expect(listItemTextContainer).toHaveClass('disabled');
|
|
281
475
|
});
|
|
282
476
|
it('apply disabled css class to leftIcon/leftElement container', function () {
|
|
283
|
-
var
|
|
477
|
+
var _render32 = (0, _react2.render)(list({}, {}, {
|
|
284
478
|
leftIconName: 'pencil',
|
|
285
479
|
disabled: disabled
|
|
286
480
|
})),
|
|
287
|
-
container =
|
|
481
|
+
container = _render32.container;
|
|
288
482
|
|
|
289
483
|
var listItemLeftElContainer = container.querySelector('.item-container .item.-icon-left');
|
|
290
484
|
expect(listItemLeftElContainer).toHaveClass('disabled');
|
|
291
485
|
});
|
|
292
486
|
it('apply disabled css class to rightIcon/rightElement container', function () {
|
|
293
|
-
var
|
|
487
|
+
var _render33 = (0, _react2.render)(list({}, {}, {
|
|
294
488
|
rightIconName: 'pencil',
|
|
295
489
|
disabled: disabled
|
|
296
490
|
})),
|
|
297
|
-
container =
|
|
491
|
+
container = _render33.container;
|
|
298
492
|
|
|
299
493
|
var listItemRightElContainer = container.querySelector('.item-container .item.-icon-right');
|
|
300
494
|
expect(listItemRightElContainer).toHaveClass('disabled');
|
|
301
495
|
});
|
|
302
496
|
it('should hide url', function () {
|
|
303
|
-
var
|
|
497
|
+
var _render34 = (0, _react2.render)(list({}, {}, {
|
|
304
498
|
disabled: disabled,
|
|
305
499
|
url: 'saas'
|
|
306
500
|
})),
|
|
307
|
-
container =
|
|
501
|
+
container = _render34.container;
|
|
308
502
|
|
|
309
503
|
var linkitem = container.querySelector('.linkitem');
|
|
310
504
|
expect(linkitem).not.toBeInTheDocument();
|
|
311
505
|
});
|
|
312
506
|
});
|
|
313
507
|
it('prop displayCheckbox should render Checkbox within subject', function () {
|
|
314
|
-
var
|
|
508
|
+
var _render35 = (0, _react2.render)(list({}, {}, {
|
|
315
509
|
displayCheckbox: true
|
|
316
510
|
})),
|
|
317
|
-
container =
|
|
511
|
+
container = _render35.container;
|
|
318
512
|
|
|
319
|
-
var checkboxComponent = container.querySelector('.item-container .item.-icon-left .checkbox-component');
|
|
513
|
+
var checkboxComponent = container.querySelector('.item-container .item.-icon-left .checkbox-component input');
|
|
320
514
|
expect(checkboxComponent).toBeTruthy();
|
|
321
515
|
expect(checkboxComponent.name).toEqual('checkbox');
|
|
322
516
|
});
|
|
@@ -325,10 +519,10 @@ describe('Components', function () {
|
|
|
325
519
|
customClass: "leftElTeste"
|
|
326
520
|
});
|
|
327
521
|
|
|
328
|
-
var
|
|
522
|
+
var _render36 = (0, _react2.render)(list({}, {}, {
|
|
329
523
|
leftElement: leftElement
|
|
330
524
|
})),
|
|
331
|
-
container =
|
|
525
|
+
container = _render36.container;
|
|
332
526
|
|
|
333
527
|
var leftElementHTML = container.querySelector('.item-container .item.-icon-left .leftElTeste');
|
|
334
528
|
expect(leftElementHTML).toBeTruthy();
|
|
@@ -338,10 +532,10 @@ describe('Components', function () {
|
|
|
338
532
|
customClass: "rightElTeste"
|
|
339
533
|
});
|
|
340
534
|
|
|
341
|
-
var
|
|
535
|
+
var _render37 = (0, _react2.render)(list({}, {}, {
|
|
342
536
|
rightElement: rightElement
|
|
343
537
|
})),
|
|
344
|
-
container =
|
|
538
|
+
container = _render37.container;
|
|
345
539
|
|
|
346
540
|
var rightElementHTML = container.querySelector('.item-container .item.-icon-right .rightElTeste');
|
|
347
541
|
expect(rightElementHTML).toBeTruthy();
|
|
@@ -354,10 +548,10 @@ describe('Components', function () {
|
|
|
354
548
|
color: "#000"
|
|
355
549
|
});
|
|
356
550
|
|
|
357
|
-
var
|
|
551
|
+
var _render38 = (0, _react2.render)(list({}, {}, {
|
|
358
552
|
leftIcon: leftIcon
|
|
359
553
|
})),
|
|
360
|
-
container =
|
|
554
|
+
container = _render38.container;
|
|
361
555
|
|
|
362
556
|
var leftIconHTML = container.querySelector('.item-container .item.-icon-left .icon-component.iconTeste');
|
|
363
557
|
expect(leftIconHTML).toBeTruthy();
|
|
@@ -370,111 +564,118 @@ describe('Components', function () {
|
|
|
370
564
|
color: "#000"
|
|
371
565
|
});
|
|
372
566
|
|
|
373
|
-
var
|
|
567
|
+
var _render39 = (0, _react2.render)(list({}, {}, {
|
|
374
568
|
rightIcon: rightIcon
|
|
375
569
|
})),
|
|
376
|
-
container =
|
|
570
|
+
container = _render39.container;
|
|
377
571
|
|
|
378
572
|
var rightIconHTML = container.querySelector('.item-container .item.-icon-right .icon-component.iconTeste');
|
|
379
573
|
expect(rightIconHTML).toBeTruthy();
|
|
380
574
|
});
|
|
381
575
|
it('prop leftIconName should render Icon', function () {
|
|
382
|
-
var
|
|
576
|
+
var _render40 = (0, _react2.render)(list({}, {}, {
|
|
383
577
|
leftIconName: 'code'
|
|
384
578
|
})),
|
|
385
|
-
container =
|
|
579
|
+
container = _render40.container;
|
|
386
580
|
|
|
387
581
|
var leftIcon = container.querySelector('.item-container .item.-icon-left .icon-component');
|
|
388
582
|
expect(leftIcon).toBeTruthy();
|
|
389
583
|
});
|
|
390
584
|
it('prop rightIconName should render Icon', function () {
|
|
391
|
-
var
|
|
585
|
+
var _render41 = (0, _react2.render)(list({}, {}, {
|
|
392
586
|
rightIconName: 'code'
|
|
393
587
|
})),
|
|
394
|
-
container =
|
|
588
|
+
container = _render41.container;
|
|
395
589
|
|
|
396
590
|
var rightIcon = container.querySelector('.item-container .item.-icon-right .icon-component');
|
|
397
591
|
expect(rightIcon).toBeTruthy();
|
|
398
592
|
});
|
|
399
593
|
it('should apply onClick', function () {
|
|
400
594
|
var mockFunc = jest.fn();
|
|
595
|
+
var listItemId = '1';
|
|
401
596
|
|
|
402
|
-
var
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
597
|
+
var mockList = /*#__PURE__*/_react["default"].createElement(_index["default"], null, /*#__PURE__*/_react["default"].createElement(_index.ListItem, {
|
|
598
|
+
itemId: listItemId,
|
|
599
|
+
text: "Teste Foo",
|
|
600
|
+
onClick: function onClick(_, itemId) {
|
|
601
|
+
return mockFunc(itemId);
|
|
602
|
+
}
|
|
603
|
+
}));
|
|
604
|
+
|
|
605
|
+
var _render42 = (0, _react2.render)(mockList),
|
|
606
|
+
container = _render42.container;
|
|
406
607
|
|
|
407
608
|
var listItem = container.querySelector('.item-container');
|
|
408
609
|
|
|
409
610
|
_react2.fireEvent.click(listItem);
|
|
410
611
|
|
|
411
|
-
expect(mockFunc).
|
|
612
|
+
expect(mockFunc).toBeCalledWith(listItemId);
|
|
412
613
|
});
|
|
413
614
|
describe('prop customClass', function () {
|
|
414
615
|
var customClass = 'customclassTeste';
|
|
415
616
|
it('apply customClass css class to text/subtext/children container', function () {
|
|
416
|
-
var
|
|
617
|
+
var _render43 = (0, _react2.render)(list({}, {}, {
|
|
417
618
|
text: 'Teste',
|
|
418
619
|
customClass: customClass
|
|
419
620
|
})),
|
|
420
|
-
container =
|
|
621
|
+
container = _render43.container;
|
|
421
622
|
|
|
422
623
|
var listItemTextContainer = container.querySelector('.item-container .item');
|
|
423
624
|
expect(listItemTextContainer).toHaveClass(customClass);
|
|
424
625
|
});
|
|
425
626
|
it('apply customClass css class to leftIcon/leftElement container', function () {
|
|
426
|
-
var
|
|
627
|
+
var _render44 = (0, _react2.render)(list({}, {}, {
|
|
427
628
|
leftIconName: 'pencil',
|
|
428
629
|
customClass: customClass
|
|
429
630
|
})),
|
|
430
|
-
container =
|
|
631
|
+
container = _render44.container;
|
|
431
632
|
|
|
432
633
|
var listItemLeftElContainer = container.querySelector('.item-container .item.-icon-left');
|
|
433
634
|
expect(listItemLeftElContainer).toHaveClass(customClass);
|
|
434
635
|
});
|
|
435
636
|
it('apply customClass css class to rightIcon/rightElement container', function () {
|
|
436
|
-
var
|
|
637
|
+
var _render45 = (0, _react2.render)(list({}, {}, {
|
|
437
638
|
rightIconName: 'pencil',
|
|
438
639
|
customClass: customClass
|
|
439
640
|
})),
|
|
440
|
-
container =
|
|
641
|
+
container = _render45.container;
|
|
441
642
|
|
|
442
643
|
var listItemRightElContainer = container.querySelector('.item-container .item.-icon-right');
|
|
443
644
|
expect(listItemRightElContainer).toHaveClass(customClass);
|
|
444
645
|
});
|
|
445
646
|
});
|
|
446
647
|
it('prop url should render Link', function () {
|
|
447
|
-
var
|
|
648
|
+
var _render46 = (0, _react2.render)(list({}, {}, {
|
|
448
649
|
url: 'saas'
|
|
449
650
|
})),
|
|
450
|
-
container =
|
|
651
|
+
container = _render46.container;
|
|
451
652
|
|
|
452
653
|
var linkComponent = container.querySelector('.item-container .linkitem');
|
|
453
654
|
expect(linkComponent).toBeTruthy();
|
|
454
655
|
});
|
|
455
656
|
describe('prop visible', function () {
|
|
456
657
|
it('when true(default) should allow subject to render', function () {
|
|
457
|
-
var
|
|
658
|
+
var _render47 = (0, _react2.render)(list({}, {}, {
|
|
458
659
|
visible: true
|
|
459
660
|
})),
|
|
460
|
-
container =
|
|
661
|
+
container = _render47.container;
|
|
461
662
|
|
|
462
663
|
var listItem = container.querySelector('.item-container');
|
|
463
664
|
expect(listItem).toBeTruthy();
|
|
464
665
|
});
|
|
465
666
|
it('when false should not let subject render', function () {
|
|
466
|
-
var
|
|
667
|
+
var _render48 = (0, _react2.render)(list({}, {}, {
|
|
467
668
|
visible: false
|
|
468
669
|
})),
|
|
469
|
-
container =
|
|
670
|
+
container = _render48.container;
|
|
470
671
|
|
|
471
672
|
var listItem = container.querySelector('.item-container');
|
|
472
673
|
expect(listItem).not.toBeInTheDocument();
|
|
473
674
|
});
|
|
474
675
|
});
|
|
475
676
|
it('should render children', function () {
|
|
476
|
-
var
|
|
477
|
-
container =
|
|
677
|
+
var _render49 = (0, _react2.render)(list()),
|
|
678
|
+
container = _render49.container;
|
|
478
679
|
|
|
479
680
|
var listItemButtonChild = container.querySelector('.item-container .childbuttontest');
|
|
480
681
|
expect(listItemButtonChild).toBeTruthy();
|
|
@@ -485,10 +686,10 @@ describe('Components', function () {
|
|
|
485
686
|
it('should render subject', function () {
|
|
486
687
|
setSessionStorageMock();
|
|
487
688
|
|
|
488
|
-
var
|
|
689
|
+
var _render50 = (0, _react2.render)(list({}, {}, {
|
|
489
690
|
permissionAttr: (0, _storageMock.permissionAttrMockAuthorized)('disabled')
|
|
490
691
|
})),
|
|
491
|
-
container =
|
|
692
|
+
container = _render50.container;
|
|
492
693
|
|
|
493
694
|
var listItem = container.querySelector('.item-container');
|
|
494
695
|
expect(listItem).toBeTruthy();
|
|
@@ -498,10 +699,10 @@ describe('Components', function () {
|
|
|
498
699
|
it('onDenied.unvisible option should not render subject', function () {
|
|
499
700
|
setSessionStorageMock();
|
|
500
701
|
|
|
501
|
-
var
|
|
702
|
+
var _render51 = (0, _react2.render)(list({}, {}, {
|
|
502
703
|
permissionAttr: (0, _storageMock.permissionAttrMockUnauthorized)('unvisible')
|
|
503
704
|
})),
|
|
504
|
-
container =
|
|
705
|
+
container = _render51.container;
|
|
505
706
|
|
|
506
707
|
var listItem = container.querySelector('.item-container');
|
|
507
708
|
expect(listItem).not.toBeInTheDocument();
|
|
@@ -513,10 +714,10 @@ describe('Components', function () {
|
|
|
513
714
|
it('disable onClick event', function () {
|
|
514
715
|
var mockFunc = jest.fn();
|
|
515
716
|
|
|
516
|
-
var
|
|
717
|
+
var _render52 = (0, _react2.render)(list({}, {}, _extends({}, permissionProp, {
|
|
517
718
|
onClick: mockFunc
|
|
518
719
|
}))),
|
|
519
|
-
container =
|
|
720
|
+
container = _render52.container;
|
|
520
721
|
|
|
521
722
|
var listItem = container.querySelector('.item-container');
|
|
522
723
|
|
|
@@ -525,37 +726,37 @@ describe('Components', function () {
|
|
|
525
726
|
expect(mockFunc).not.toBeCalled();
|
|
526
727
|
});
|
|
527
728
|
it('apply disabled css class to text/subtext/children container', function () {
|
|
528
|
-
var
|
|
729
|
+
var _render53 = (0, _react2.render)(list({}, {}, _extends({
|
|
529
730
|
text: 'Teste'
|
|
530
731
|
}, permissionProp))),
|
|
531
|
-
container =
|
|
732
|
+
container = _render53.container;
|
|
532
733
|
|
|
533
734
|
var listItemTextContainer = container.querySelector('.item-container .item');
|
|
534
735
|
expect(listItemTextContainer).toHaveClass('disabled');
|
|
535
736
|
});
|
|
536
737
|
it('apply disabled css class to leftIcon/leftElement container', function () {
|
|
537
|
-
var
|
|
738
|
+
var _render54 = (0, _react2.render)(list({}, {}, _extends({
|
|
538
739
|
leftIconName: 'pencil'
|
|
539
740
|
}, permissionProp))),
|
|
540
|
-
container =
|
|
741
|
+
container = _render54.container;
|
|
541
742
|
|
|
542
743
|
var listItemLeftElContainer = container.querySelector('.item-container .item.-icon-left');
|
|
543
744
|
expect(listItemLeftElContainer).toHaveClass('disabled');
|
|
544
745
|
});
|
|
545
746
|
it('apply disabled css class to rightIcon/rightElement container', function () {
|
|
546
|
-
var
|
|
747
|
+
var _render55 = (0, _react2.render)(list({}, {}, _extends({
|
|
547
748
|
rightIconName: 'pencil'
|
|
548
749
|
}, permissionProp))),
|
|
549
|
-
container =
|
|
750
|
+
container = _render55.container;
|
|
550
751
|
|
|
551
752
|
var listItemRightElContainer = container.querySelector('.item-container .item.-icon-right');
|
|
552
753
|
expect(listItemRightElContainer).toHaveClass('disabled');
|
|
553
754
|
});
|
|
554
755
|
it('hide url', function () {
|
|
555
|
-
var
|
|
756
|
+
var _render56 = (0, _react2.render)(list({}, {}, _extends({}, permissionProp, {
|
|
556
757
|
url: 'saas'
|
|
557
758
|
}))),
|
|
558
|
-
container =
|
|
759
|
+
container = _render56.container;
|
|
559
760
|
|
|
560
761
|
var linkitem = container.querySelector('.linkitem');
|
|
561
762
|
expect(linkitem).not.toBeInTheDocument();
|