bright-components 10.1.0 → 10.2.1

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 (25) hide show
  1. package/dist/components/Checkbox/index.js +6 -4
  2. package/dist/components/DayPicker/NewDayPicker/index.js +207 -0
  3. package/dist/components/DayPicker/index.js +30 -7
  4. package/dist/components/DayPickerPanel/index.js +1 -1
  5. package/dist/components/Modal/ModalBody/index.js +1 -0
  6. package/dist/components/Modal/index.js +2 -1
  7. package/dist/components/Time/TimePicker/index.js +1 -0
  8. package/dist/setupTests.js +5 -0
  9. package/package.json +3 -2
  10. package/src/components/Checkbox/index.js +2 -2
  11. package/src/components/DayPicker/NewDayPicker/index.js +208 -0
  12. package/src/components/DayPicker/examples.md +17 -0
  13. package/src/components/DayPicker/index.js +43 -17
  14. package/src/components/DayPicker/test.js +297 -1
  15. package/src/components/DayPickerPanel/index.js +1 -1
  16. package/src/components/DayPickerPanel/test.js +1 -1
  17. package/src/components/DurationInput/test.js +5 -3
  18. package/src/components/EmployeePicker/FilterBar/test.js +1 -1
  19. package/src/components/Modal/ModalBody/index.js +1 -0
  20. package/src/components/Modal/index.js +2 -1
  21. package/src/components/Modal/test.js +0 -1
  22. package/src/components/ResponsiveTabs/test.js +3 -3
  23. package/src/components/Time/TimePicker/index.js +1 -0
  24. package/src/components/Time/TimePicker/test.js +29 -28
  25. package/src/setupTests.js +2 -0
package/src/components/Time/TimePicker/test.js CHANGED
@@ -7,21 +7,22 @@ describe('<TimePicker />', () => {
7
7
  describe('given a null value', () => {
8
8
  it('should render without throwing exceptions', () => {
9
9
  const onChange = jest.fn();
10
- const { getAllByRole } = render(
10
+ const { getByRole, getByTestId } = render(
11
11
  <TimePicker value={null} onChange={onChange} />
12
12
  );
13
13
 
14
- expect(getAllByRole('textbox').length).toBe(2);
14
+ expect(getByRole('textbox')).toBeInTheDocument();
15
+ expect(getByTestId('mobileTimePicker')).toBeInTheDocument();
15
16
  });
16
17
 
17
18
  it('should allow a new value to be input', () => {
18
19
  const onChange = jest.fn();
19
- const { getAllByRole } = render(
20
+ const { getByRole } = render(
20
21
  <TimePicker value={null} onChange={onChange} />
21
22
  );
22
23
 
23
24
  // check a new value can be input
24
- const textBox = getAllByRole('textbox')[1];
25
+ const textBox = getByRole('textbox');
25
26
  expect(onChange).not.toHaveBeenCalled();
26
27
  fireEvent.change(textBox, { target: { value: '17:15' } });
27
28
  expect(onChange).toHaveBeenCalledWith({
@@ -44,14 +45,14 @@ describe('<TimePicker />', () => {
44
45
 
45
46
  describe('on initial render', () => {
46
47
  it('should render a native time input for mobile devices', () => {
47
- const { getAllByRole } = render(
48
+ const { getByTestId } = render(
48
49
  <TimePicker
49
50
  value={{ hours: 1, minutes: 30 }}
50
51
  onChange={() => {}}
51
52
  />
52
53
  );
53
54
 
54
- const textBox = getAllByRole('textbox')[0];
55
+ const textBox = getByTestId('mobileTimePicker');
55
56
  expect(textBox.type).toBe('time');
56
57
  expect(textBox.value).toBe('01:30');
57
58
  expect(textBox).toHaveStyleRule('display', 'inline-block');
@@ -62,14 +63,14 @@ describe('<TimePicker />', () => {
62
63
  });
63
64
 
64
65
  it('should render a standard input for desktop-class devices', () => {
65
- const { getAllByRole } = render(
66
+ const { getByRole } = render(
66
67
  <TimePicker
67
68
  value={{ hours: 1, minutes: 30 }}
68
69
  onChange={() => {}}
69
70
  />
70
71
  );
71
72
 
72
- const textBox = getAllByRole('textbox')[1];
73
+ const textBox = getByRole('textbox');
73
74
  expect(textBox.type).toBe('text');
74
75
  expect(textBox.value).toBe('01:30');
75
76
  });
@@ -77,7 +78,7 @@ describe('<TimePicker />', () => {
77
78
  it('should support onFocus and onBlur props and call down to them', () => {
78
79
  const onFocus = jest.fn();
79
80
  const onBlur = jest.fn();
80
- const { getAllByRole } = render(
81
+ const { getByRole } = render(
81
82
  <TimePicker
82
83
  value={{ hours: 1, minutes: 30 }}
83
84
  onFocus={onFocus}
@@ -86,7 +87,7 @@ describe('<TimePicker />', () => {
86
87
  />
87
88
  );
88
89
 
89
- const textBox = getAllByRole('textbox')[1];
90
+ const textBox = getByRole('textbox');
90
91
  expect(onFocus).not.toHaveBeenCalled();
91
92
  expect(onBlur).not.toHaveBeenCalled();
92
93
  fireEvent.focus(textBox);
@@ -152,14 +153,14 @@ describe('<TimePicker />', () => {
152
153
  describe('given a valid value is supplied', () => {
153
154
  it('should call the onChange handler when the mobile input is used', () => {
154
155
  const onChange = jest.fn();
155
- const { getAllByRole } = render(
156
+ const { getByTestId } = render(
156
157
  <TimePicker
157
158
  value={{ hours: 1, minutes: 30 }}
158
159
  onChange={onChange}
159
160
  />
160
161
  );
161
162
 
162
- const textBox = getAllByRole('textbox')[0];
163
+ const textBox = getByTestId('mobileTimePicker');
163
164
  expect(onChange).not.toHaveBeenCalled();
164
165
  fireEvent.focus(textBox);
165
166
  fireEvent.change(textBox, { target: { value: '17:15' } });
@@ -171,14 +172,14 @@ describe('<TimePicker />', () => {
171
172
 
172
173
  it('should call the onChange handler when the desktop-class input is used', () => {
173
174
  const onChange = jest.fn();
174
- const { getAllByRole } = render(
175
+ const { getByRole } = render(
175
176
  <TimePicker
176
177
  value={{ hours: 1, minutes: 30 }}
177
178
  onChange={onChange}
178
179
  />
179
180
  );
180
181
 
181
- const textBox = getAllByRole('textbox')[1];
182
+ const textBox = getByRole('textbox');
182
183
  expect(onChange).not.toHaveBeenCalled();
183
184
  fireEvent.focus(textBox);
184
185
  fireEvent.change(textBox, { target: { value: '17:15' } });
@@ -192,14 +193,14 @@ describe('<TimePicker />', () => {
192
193
  describe('given an incomplete value is supplied', () => {
193
194
  it('should not call the onChange handler when the mobile input is used', () => {
194
195
  const onChange = jest.fn();
195
- const { getAllByRole } = render(
196
+ const { getByTestId } = render(
196
197
  <TimePicker
197
198
  value={{ hours: 1, minutes: 30 }}
198
199
  onChange={onChange}
199
200
  />
200
201
  );
201
202
 
202
- const textBox = getAllByRole('textbox')[0];
203
+ const textBox = getByTestId('mobileTimePicker');
203
204
  expect(onChange).not.toHaveBeenCalled();
204
205
  fireEvent.change(textBox, { target: { value: '17:1' } });
205
206
  expect(onChange).not.toHaveBeenCalledWith();
@@ -207,14 +208,14 @@ describe('<TimePicker />', () => {
207
208
 
208
209
  it('should not call the onChange handler when the desktop-class input is used', () => {
209
210
  const onChange = jest.fn();
210
- const { getAllByRole } = render(
211
+ const { getByRole } = render(
211
212
  <TimePicker
212
213
  value={{ hours: 1, minutes: 30 }}
213
214
  onChange={onChange}
214
215
  />
215
216
  );
216
217
 
217
- const textBox = getAllByRole('textbox')[1];
218
+ const textBox = getByRole('textbox');
218
219
  expect(onChange).not.toHaveBeenCalled();
219
220
  fireEvent.change(textBox, { target: { value: '17:1' } });
220
221
  expect(onChange).not.toHaveBeenCalledWith();
@@ -224,14 +225,14 @@ describe('<TimePicker />', () => {
224
225
  describe('given the box is cleared', () => {
225
226
  it('should call the onChange handler with null', () => {
226
227
  const onChange = jest.fn();
227
- const { getAllByRole } = render(
228
+ const { getByRole } = render(
228
229
  <TimePicker
229
230
  value={{ hours: 1, minutes: 30 }}
230
231
  onChange={onChange}
231
232
  />
232
233
  );
233
234
 
234
- const textBox = getAllByRole('textbox')[1];
235
+ const textBox = getByRole('textbox');
235
236
  expect(onChange).not.toHaveBeenCalled();
236
237
  fireEvent.focus(textBox);
237
238
  fireEvent.change(textBox, { target: { value: '' } });
@@ -242,14 +243,14 @@ describe('<TimePicker />', () => {
242
243
  describe('when the field loses focus', () => {
243
244
  it('should parse reasonable partial values into valid values', () => {
244
245
  const onChange = jest.fn();
245
- const { getAllByRole } = render(
246
+ const { getByRole } = render(
246
247
  <TimePicker
247
248
  value={{ hours: 1, minutes: 30 }}
248
249
  onChange={onChange}
249
250
  />
250
251
  );
251
252
 
252
- const textBox = getAllByRole('textbox')[1];
253
+ const textBox = getByRole('textbox');
253
254
  fireEvent.focus(textBox);
254
255
  fireEvent.change(textBox, { target: { value: '01:3' } });
255
256
  expect(onChange).not.toHaveBeenCalled();
@@ -259,14 +260,14 @@ describe('<TimePicker />', () => {
259
260
 
260
261
  it('should not call onChange if parsed partial value is same as given value', () => {
261
262
  const onChange = jest.fn();
262
- const { getAllByRole } = render(
263
+ const { getByRole } = render(
263
264
  <TimePicker
264
265
  value={{ hours: 1, minutes: 3 }}
265
266
  onChange={onChange}
266
267
  />
267
268
  );
268
269
 
269
- const textBox = getAllByRole('textbox')[1];
270
+ const textBox = getByRole('textbox');
270
271
  fireEvent.focus(textBox);
271
272
  fireEvent.change(textBox, { target: { value: '01:3' } });
272
273
  expect(onChange).not.toHaveBeenCalled();
@@ -276,14 +277,14 @@ describe('<TimePicker />', () => {
276
277
 
277
278
  it('should not parse unreasonable values into valid values', () => {
278
279
  const onChange = jest.fn();
279
- const { getAllByRole } = render(
280
+ const { getByRole } = render(
280
281
  <TimePicker
281
282
  value={{ hours: 1, minutes: 30 }}
282
283
  onChange={onChange}
283
284
  />
284
285
  );
285
286
 
286
- const textBox = getAllByRole('textbox')[1];
287
+ const textBox = getByRole('textbox');
287
288
  fireEvent.focus(textBox);
288
289
  fireEvent.change(textBox, { target: { value: '01' } });
289
290
  expect(onChange).not.toHaveBeenCalled();
@@ -297,7 +298,7 @@ describe('<TimePicker />', () => {
297
298
  // this is a convoluted test to cover some code that works around an issue with
298
299
  // stores (mobx) that only re-render when actual values change
299
300
  const onChange = jest.fn();
300
- const { getAllByRole } = render(
301
+ const { getByRole } = render(
301
302
  <TimePicker
302
303
  value={{ hours: 1, minutes: 30 }}
303
304
  minuteIncrements={5}
@@ -305,7 +306,7 @@ describe('<TimePicker />', () => {
305
306
  />
306
307
  );
307
308
 
308
- const textBox = getAllByRole('textbox')[1];
309
+ const textBox = getByRole('textbox');
309
310
  fireEvent.focus(textBox);
310
311
  fireEvent.change(textBox, { target: { value: '01:32' } });
311
312
  expect(onChange).toHaveBeenCalledWith({
package/src/setupTests.js CHANGED
@@ -1,4 +1,5 @@
1
1
  import { configure } from 'enzyme';
2
+ import { configure as RTLConfig } from '@testing-library/react';
2
3
  import Adapter from 'enzyme-adapter-react-16';
3
4
  import ReactGA from 'react-ga';
4
5
  import 'jest-enzyme';
@@ -34,3 +35,4 @@ afterEach(() => {
34
35
  });
35
36
 
36
37
  configure({ adapter: new Adapter() });
38
+ RTLConfig({ defaultHidden: true });