@innovaccer/design-system 2.3.0 → 2.4.0-0

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 (87) hide show
  1. package/CHANGELOG.md +35 -0
  2. package/core/components/atoms/backdrop/Backdrop.tsx +11 -1
  3. package/core/components/atoms/button/Button.tsx +60 -44
  4. package/core/components/atoms/button/__stories__/IconButtonGroup.story.tsx +4 -4
  5. package/core/components/atoms/button/__stories__/IconButtonSecondary.story.tsx +1 -1
  6. package/core/components/atoms/button/__tests__/Button.test.tsx +36 -1
  7. package/core/components/atoms/dropdown/DropdownList.tsx +1 -0
  8. package/core/components/atoms/dropdown/Loading.tsx +9 -9
  9. package/core/components/atoms/dropdown/__stories__/Options.tsx +2 -0
  10. package/core/components/atoms/dropdown/__tests__/Dropdown.test.tsx +12 -1
  11. package/core/components/atoms/dropdown/__tests__/Loading.test.tsx +66 -0
  12. package/core/components/atoms/dropdown/__tests__/Option.test.tsx +204 -0
  13. package/core/components/atoms/dropdown/option/CheckboxOption.tsx +1 -0
  14. package/core/components/atoms/dropdown/option/IconOption.tsx +3 -1
  15. package/core/components/atoms/dropdown/option/IconWithMetaOption.tsx +3 -1
  16. package/core/components/atoms/dropdown/option/index.tsx +7 -1
  17. package/core/components/molecules/dialog/__tests__/__snapshots__/Dialog.test.tsx.snap +13 -0
  18. package/core/components/molecules/emptyState/__stories__/assets/pageNotLoaded.png +0 -0
  19. package/core/components/molecules/emptyState/__stories__/variants/noContentAvailable.story.tsx +26 -0
  20. package/core/components/molecules/emptyState/__stories__/variants/{smallSizeWithButton.story.tsx → noSearchResults.story.tsx} +2 -2
  21. package/core/components/molecules/emptyState/__stories__/variants/{largeSize.story.tsx → pageNotLoaded.story.tsx} +3 -3
  22. package/core/components/molecules/fileList/FileIcon.tsx +10 -2
  23. package/core/components/molecules/fileList/FileListItem.tsx +7 -3
  24. package/core/components/molecules/fileList/__stories__/__common__/fileListExample.tsx +1 -0
  25. package/core/components/molecules/fileList/__tests__/FileList.test.tsx +115 -0
  26. package/core/components/molecules/fileList/__tests__/__snapshots__/FileList.test.tsx.snap +232 -0
  27. package/core/components/molecules/inputMask/InputMask.tsx +2 -5
  28. package/core/components/molecules/inputMask/__tests__/InputMask.test.tsx +128 -0
  29. package/core/components/molecules/inputMask/__tests__/__snapshots__/InputMask.test.tsx.snap +39 -0
  30. package/core/components/molecules/modal/Modal.tsx +7 -5
  31. package/core/components/molecules/modal/__tests__/__snapshots__/Modal.test.tsx.snap +18 -0
  32. package/core/components/molecules/sidesheet/Sidesheet.tsx +5 -3
  33. package/core/components/molecules/sidesheet/__tests__/__snapshots__/Sidesheet.test.tsx.snap +2 -0
  34. package/core/components/organisms/calendar/Calendar.tsx +66 -22
  35. package/core/components/organisms/calendar/__stories__/variants/withEvents.story.tsx +45 -0
  36. package/core/components/organisms/calendar/__tests__/Calendar.test.tsx +10 -0
  37. package/core/components/organisms/calendar/__tests__/__snapshots__/Calendar.test.tsx.snap +1096 -1096
  38. package/core/components/organisms/calendar/config.ts +2 -2
  39. package/core/components/organisms/calendar/types.ts +1 -0
  40. package/core/components/organisms/datePicker/DatePicker.tsx +23 -9
  41. package/core/components/organisms/datePicker/__tests__/{DatePicker.tsx → DatePicker.test.tsx} +16 -1
  42. package/core/components/organisms/datePicker/__tests__/__snapshots__/DatePicker.test.tsx.snap +2257 -0
  43. package/core/components/organisms/dateRangePicker/__tests__/__snapshots__/DateRangePicker.test.tsx.snap +2552 -2550
  44. package/core/components/organisms/inlineMessage/InlineMessage.tsx +75 -0
  45. package/core/components/organisms/inlineMessage/__stories__/Default.story.tsx +18 -0
  46. package/core/components/organisms/inlineMessage/__stories__/Error.story.tsx +19 -0
  47. package/core/components/organisms/inlineMessage/__stories__/Info.story.tsx +19 -0
  48. package/core/components/organisms/inlineMessage/__stories__/Success.story.tsx +19 -0
  49. package/core/components/organisms/inlineMessage/__stories__/Warning.story.tsx +18 -0
  50. package/core/components/organisms/inlineMessage/__stories__/variants/InlineMessageWithinTable.story.tsx +139 -0
  51. package/core/components/organisms/inlineMessage/__tests__/InlineMessage.test.tsx +91 -0
  52. package/core/components/organisms/inlineMessage/__tests__/__snapshots__/InlineMessage.test.tsx.snap +139 -0
  53. package/core/components/organisms/inlineMessage/index.tsx +1 -0
  54. package/core/components/organisms/timePicker/__tests__/__snapshots__/TimePicker.test.tsx.snap +8 -0
  55. package/core/index.tsx +2 -0
  56. package/core/index.type.tsx +1 -0
  57. package/core/utils/__tests__/__snapshots__/TS.test.tsx.snap +485 -466
  58. package/css/dist/index.css +72 -8
  59. package/css/dist/index.css.map +1 -1
  60. package/css/src/components/calendar.css +37 -5
  61. package/css/src/components/card.css +1 -1
  62. package/css/src/components/chipInput.css +2 -2
  63. package/css/src/components/editableChipInput.css +2 -1
  64. package/css/src/components/inlineMessage.css +29 -0
  65. package/dist/core/components/atoms/backdrop/Backdrop.d.ts +1 -0
  66. package/dist/core/components/atoms/button/Button.d.ts +1 -0
  67. package/dist/core/components/atoms/popperWrapper/PopperWrapper.d.ts +28 -27
  68. package/dist/core/components/organisms/calendar/Calendar.d.ts +6 -1
  69. package/dist/core/components/organisms/calendar/types.d.ts +3 -0
  70. package/dist/core/components/organisms/inlineMessage/InlineMessage.d.ts +15 -0
  71. package/dist/core/components/organisms/inlineMessage/index.d.ts +1 -0
  72. package/dist/core/index.d.ts +1 -0
  73. package/dist/core/index.type.d.ts +1 -0
  74. package/dist/index.esm.js +189 -66
  75. package/dist/index.js +201 -80
  76. package/dist/index.js.map +1 -1
  77. package/dist/index.umd.js +1 -1
  78. package/dist/index.umd.js.br +0 -0
  79. package/dist/index.umd.js.gz +0 -0
  80. package/dts.config.js +13 -0
  81. package/package.json +4 -2
  82. package/types/innovaccer-design-system/index.d.ts +39 -0
  83. package/types/innovaccer-design-system/innovaccer-design-system-tests.ts +0 -0
  84. package/types/innovaccer-design-system/tsconfig.json +23 -0
  85. package/types/innovaccer-design-system/tslint.json +1 -0
  86. package/core/components/molecules/emptyState/__stories__/variants/smallSizeWithoutButton.story.tsx +0 -21
  87. package/core/components/organisms/datePicker/__tests__/__snapshots__/DatePicker.tsx.snap +0 -2164
@@ -87,501 +87,519 @@ exports[`TS renders children 1`] = `
87
87
  class="Col"
88
88
  data-test="DesignSystem-Column"
89
89
  />
90
- <div
91
- class="Calendar-wrapper"
92
- data-test="DesignSystem-Calendar-Wrapper"
93
- >
90
+ <div>
94
91
  <div
95
- class="Calendar Calendar--date Calendar--large"
96
- data-test="DesignSystem-Calendar"
92
+ class="Calendar-wrapper"
93
+ data-test="DesignSystem-Calendar-Wrapper"
97
94
  >
98
95
  <div
99
- class="Calendar-header"
96
+ class="Calendar Calendar--date Calendar--large"
97
+ data-test="DesignSystem-Calendar"
100
98
  >
101
- <button
102
- class="Button Button--regular Button--regularSquare Button--transparent Calendar-headerIcon Calendar-headerIcon--prev"
103
- data-test="DesignSystem-Button"
104
- tabindex="0"
105
- type="button"
106
- >
107
- <div
108
- class="Button-icon"
109
- >
110
- <i
111
- class="material-icons material-icons-round Icon Icon--default"
112
- data-test="DesignSystem-Button--Icon"
113
- style="font-size: 16px; width: 16px;"
114
- >
115
- arrow_back_round
116
- </i>
117
- </div>
118
- </button>
119
99
  <div
120
- class="Calendar-headerContent Calendar-headerContent--noIcon-left Calendar-headerContent--noIcon-right"
100
+ class="Calendar-header"
121
101
  >
122
- <span>
123
- <h5
124
- class="Heading Heading--s Heading--default"
125
- data-test="DesignSystem-Heading"
126
- >
127
- Jun
128
- </h5>
129
- </span>
130
- <span
131
- class="ml-4"
102
+ <button
103
+ class="Button Button--regular Button--regularSquare Button--basic Calendar-headerIcon Calendar-headerIcon--prev"
104
+ data-test="DesignSystem-Button"
105
+ tabindex="0"
106
+ type="button"
132
107
  >
133
- <h5
134
- class="Heading Heading--s Heading--default"
135
- data-test="DesignSystem-Heading"
108
+ <div
109
+ class="Button-icon"
136
110
  >
137
- 2021
138
- </h5>
139
- </span>
140
- </div>
141
- <button
142
- class="Button Button--regular Button--regularSquare Button--transparent Calendar-headerIcon Calendar-headerIcon--next"
143
- data-test="DesignSystem-Button"
144
- tabindex="0"
145
- type="button"
146
- >
111
+ <i
112
+ class="material-icons material-icons-round Icon Icon--default"
113
+ data-test="DesignSystem-Button--Icon"
114
+ style="font-size: 16px; width: 16px;"
115
+ >
116
+ arrow_back_round
117
+ </i>
118
+ </div>
119
+ </button>
147
120
  <div
148
- class="Button-icon"
121
+ class="Calendar-headerContent Calendar-headerContent--noIcon-left Calendar-headerContent--noIcon-right"
149
122
  >
150
- <i
151
- class="material-icons material-icons-round Icon Icon--default"
152
- data-test="DesignSystem-Button--Icon"
153
- style="font-size: 16px; width: 16px;"
154
- >
155
- arrow_forward_round
156
- </i>
123
+ <span>
124
+ <h5
125
+ class="Heading Heading--s Heading--default"
126
+ data-test="DesignSystem-Heading"
127
+ >
128
+ Jun
129
+ </h5>
130
+ </span>
131
+ <span
132
+ class="ml-4"
133
+ >
134
+ <h5
135
+ class="Heading Heading--s Heading--default"
136
+ data-test="DesignSystem-Heading"
137
+ >
138
+ 2021
139
+ </h5>
140
+ </span>
157
141
  </div>
158
- </button>
159
- </div>
160
- <div
161
- class="Calendar-body"
162
- >
163
- <div
164
- class="Calendar-dayValues"
165
- >
166
- <h4
167
- class="Subheading Subheading--disabled Calendar-valueWrapper"
168
- data-test="DesignSystem-Subheading"
169
- >
170
- Sun
171
- </h4>
172
- <h4
173
- class="Subheading Subheading--disabled Calendar-valueWrapper"
174
- data-test="DesignSystem-Subheading"
175
- >
176
- Mon
177
- </h4>
178
- <h4
179
- class="Subheading Subheading--disabled Calendar-valueWrapper"
180
- data-test="DesignSystem-Subheading"
181
- >
182
- Tue
183
- </h4>
184
- <h4
185
- class="Subheading Subheading--disabled Calendar-valueWrapper"
186
- data-test="DesignSystem-Subheading"
187
- >
188
- Wed
189
- </h4>
190
- <h4
191
- class="Subheading Subheading--disabled Calendar-valueWrapper"
192
- data-test="DesignSystem-Subheading"
193
- >
194
- Thu
195
- </h4>
196
- <h4
197
- class="Subheading Subheading--disabled Calendar-valueWrapper"
198
- data-test="DesignSystem-Subheading"
142
+ <button
143
+ class="Button Button--regular Button--regularSquare Button--basic Calendar-headerIcon Calendar-headerIcon--next"
144
+ data-test="DesignSystem-Button"
145
+ tabindex="0"
146
+ type="button"
199
147
  >
200
- Fri
201
- </h4>
202
- <h4
203
- class="Subheading Subheading--disabled Calendar-valueWrapper"
204
- data-test="DesignSystem-Subheading"
205
- >
206
- Sat
207
- </h4>
148
+ <div
149
+ class="Button-icon"
150
+ >
151
+ <i
152
+ class="material-icons material-icons-round Icon Icon--default"
153
+ data-test="DesignSystem-Button--Icon"
154
+ style="font-size: 16px; width: 16px;"
155
+ >
156
+ arrow_forward_round
157
+ </i>
158
+ </div>
159
+ </button>
208
160
  </div>
209
161
  <div
210
- class="Calendar-dateValues"
162
+ class="Calendar-body"
211
163
  >
212
164
  <div
213
- class="Calendar-valueRow"
165
+ class="Calendar-dayValues"
166
+ >
167
+ <span
168
+ class="Text Text--default Text--strong Text--regular Calendar-valueWrapper"
169
+ data-test="DesignSystem-Text"
170
+ >
171
+ Su
172
+ </span>
173
+ <span
174
+ class="Text Text--default Text--strong Text--regular Calendar-valueWrapper"
175
+ data-test="DesignSystem-Text"
176
+ >
177
+ Mo
178
+ </span>
179
+ <span
180
+ class="Text Text--default Text--strong Text--regular Calendar-valueWrapper"
181
+ data-test="DesignSystem-Text"
182
+ >
183
+ Tu
184
+ </span>
185
+ <span
186
+ class="Text Text--default Text--strong Text--regular Calendar-valueWrapper"
187
+ data-test="DesignSystem-Text"
188
+ >
189
+ We
190
+ </span>
191
+ <span
192
+ class="Text Text--default Text--strong Text--regular Calendar-valueWrapper"
193
+ data-test="DesignSystem-Text"
194
+ >
195
+ Th
196
+ </span>
197
+ <span
198
+ class="Text Text--default Text--strong Text--regular Calendar-valueWrapper"
199
+ data-test="DesignSystem-Text"
200
+ >
201
+ Fr
202
+ </span>
203
+ <span
204
+ class="Text Text--default Text--strong Text--regular Calendar-valueWrapper"
205
+ data-test="DesignSystem-Text"
206
+ >
207
+ Sa
208
+ </span>
209
+ </div>
210
+ <div
211
+ class="Calendar-dateValues"
214
212
  >
215
213
  <div
216
- class="Calendar-valueWrapper"
217
- data-test="designSystem-Calendar-WrapperClass"
218
- />
219
- <div
220
- class="Calendar-valueWrapper"
221
- data-test="designSystem-Calendar-WrapperClass"
222
- />
223
- <div
224
- class="Calendar-valueWrapper"
225
- data-test="designSystem-Calendar-WrapperClass"
214
+ class="Calendar-valueRow"
226
215
  >
227
- <span
228
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
229
- data-test="DesignSystem-Calendar--dateValue"
216
+ <div
217
+ class="Calendar-valueWrapper"
218
+ data-test="designSystem-Calendar-WrapperClass"
219
+ />
220
+ <div
221
+ class="Calendar-valueWrapper"
222
+ data-test="designSystem-Calendar-WrapperClass"
223
+ />
224
+ <div
225
+ class="Calendar-valueWrapper"
226
+ data-test="designSystem-Calendar-WrapperClass"
230
227
  >
231
- 1
232
- </span>
233
- </div>
234
- <div
235
- class="Calendar-valueWrapper"
236
- data-test="designSystem-Calendar-WrapperClass"
237
- >
238
- <span
239
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
240
- data-test="DesignSystem-Calendar--dateValue"
228
+ <span
229
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
230
+ data-test="DesignSystem-Calendar--dateValue"
231
+ >
232
+ 1
233
+ </span>
234
+ </div>
235
+ <div
236
+ class="Calendar-valueWrapper"
237
+ data-test="designSystem-Calendar-WrapperClass"
241
238
  >
242
- 2
243
- </span>
244
- </div>
245
- <div
246
- class="Calendar-valueWrapper"
247
- data-test="designSystem-Calendar-WrapperClass"
248
- >
249
- <span
250
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
251
- data-test="DesignSystem-Calendar--dateValue"
239
+ <span
240
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
241
+ data-test="DesignSystem-Calendar--dateValue"
242
+ >
243
+ 2
244
+ </span>
245
+ </div>
246
+ <div
247
+ class="Calendar-valueWrapper"
248
+ data-test="designSystem-Calendar-WrapperClass"
252
249
  >
253
- 3
254
- </span>
255
- </div>
256
- <div
257
- class="Calendar-valueWrapper"
258
- data-test="designSystem-Calendar-WrapperClass"
259
- >
260
- <span
261
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
262
- data-test="DesignSystem-Calendar--dateValue"
250
+ <span
251
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
252
+ data-test="DesignSystem-Calendar--dateValue"
253
+ >
254
+ 3
255
+ </span>
256
+ </div>
257
+ <div
258
+ class="Calendar-valueWrapper"
259
+ data-test="designSystem-Calendar-WrapperClass"
263
260
  >
264
- 4
265
- </span>
266
- </div>
267
- <div
268
- class="Calendar-valueWrapper"
269
- data-test="designSystem-Calendar-WrapperClass"
270
- >
271
- <span
272
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
273
- data-test="DesignSystem-Calendar--dateValue"
261
+ <span
262
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
263
+ data-test="DesignSystem-Calendar--dateValue"
264
+ >
265
+ 4
266
+ </span>
267
+ </div>
268
+ <div
269
+ class="Calendar-valueWrapper"
270
+ data-test="designSystem-Calendar-WrapperClass"
274
271
  >
275
- 5
276
- </span>
272
+ <span
273
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
274
+ data-test="DesignSystem-Calendar--dateValue"
275
+ >
276
+ 5
277
+ </span>
278
+ </div>
277
279
  </div>
278
- </div>
279
- <div
280
- class="Calendar-valueRow"
281
- >
282
280
  <div
283
- class="Calendar-valueWrapper"
284
- data-test="designSystem-Calendar-WrapperClass"
281
+ class="Calendar-valueRow"
285
282
  >
286
- <span
287
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
288
- data-test="DesignSystem-Calendar--dateValue"
283
+ <div
284
+ class="Calendar-valueWrapper"
285
+ data-test="designSystem-Calendar-WrapperClass"
289
286
  >
290
- 6
291
- </span>
292
- </div>
293
- <div
294
- class="Calendar-valueWrapper"
295
- data-test="designSystem-Calendar-WrapperClass"
296
- >
297
- <span
298
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
299
- data-test="DesignSystem-Calendar--dateValue"
287
+ <span
288
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
289
+ data-test="DesignSystem-Calendar--dateValue"
290
+ >
291
+ 6
292
+ </span>
293
+ </div>
294
+ <div
295
+ class="Calendar-valueWrapper"
296
+ data-test="designSystem-Calendar-WrapperClass"
300
297
  >
301
- 7
302
- </span>
303
- </div>
304
- <div
305
- class="Calendar-valueWrapper"
306
- data-test="designSystem-Calendar-WrapperClass"
307
- >
308
- <span
309
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
310
- data-test="DesignSystem-Calendar--dateValue"
298
+ <span
299
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
300
+ data-test="DesignSystem-Calendar--dateValue"
301
+ >
302
+ 7
303
+ </span>
304
+ </div>
305
+ <div
306
+ class="Calendar-valueWrapper"
307
+ data-test="designSystem-Calendar-WrapperClass"
311
308
  >
312
- 8
313
- </span>
314
- </div>
315
- <div
316
- class="Calendar-valueWrapper"
317
- data-test="designSystem-Calendar-WrapperClass"
318
- >
319
- <span
320
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
321
- data-test="DesignSystem-Calendar--dateValue"
309
+ <span
310
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
311
+ data-test="DesignSystem-Calendar--dateValue"
312
+ >
313
+ 8
314
+ </span>
315
+ </div>
316
+ <div
317
+ class="Calendar-valueWrapper"
318
+ data-test="designSystem-Calendar-WrapperClass"
322
319
  >
323
- 9
324
- </span>
325
- </div>
326
- <div
327
- class="Calendar-valueWrapper"
328
- data-test="designSystem-Calendar-WrapperClass"
329
- >
330
- <span
331
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
332
- data-test="DesignSystem-Calendar--dateValue"
320
+ <span
321
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
322
+ data-test="DesignSystem-Calendar--dateValue"
323
+ >
324
+ 9
325
+ </span>
326
+ </div>
327
+ <div
328
+ class="Calendar-valueWrapper"
329
+ data-test="designSystem-Calendar-WrapperClass"
333
330
  >
334
- 10
335
- </span>
336
- </div>
337
- <div
338
- class="Calendar-valueWrapper"
339
- data-test="designSystem-Calendar-WrapperClass"
340
- >
341
- <span
342
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
343
- data-test="DesignSystem-Calendar--dateValue"
331
+ <span
332
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
333
+ data-test="DesignSystem-Calendar--dateValue"
334
+ >
335
+ 10
336
+ </span>
337
+ </div>
338
+ <div
339
+ class="Calendar-valueWrapper"
340
+ data-test="designSystem-Calendar-WrapperClass"
344
341
  >
345
- 11
346
- </span>
347
- </div>
348
- <div
349
- class="Calendar-valueWrapper"
350
- data-test="designSystem-Calendar-WrapperClass"
351
- >
352
- <span
353
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
354
- data-test="DesignSystem-Calendar--dateValue"
342
+ <span
343
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
344
+ data-test="DesignSystem-Calendar--dateValue"
345
+ >
346
+ 11
347
+ </span>
348
+ </div>
349
+ <div
350
+ class="Calendar-valueWrapper"
351
+ data-test="designSystem-Calendar-WrapperClass"
355
352
  >
356
- 12
357
- </span>
353
+ <span
354
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
355
+ data-test="DesignSystem-Calendar--dateValue"
356
+ >
357
+ 12
358
+ </span>
359
+ </div>
358
360
  </div>
359
- </div>
360
- <div
361
- class="Calendar-valueRow"
362
- >
363
361
  <div
364
- class="Calendar-valueWrapper"
365
- data-test="designSystem-Calendar-WrapperClass"
362
+ class="Calendar-valueRow"
366
363
  >
367
- <span
368
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
369
- data-test="DesignSystem-Calendar--dateValue"
364
+ <div
365
+ class="Calendar-valueWrapper"
366
+ data-test="designSystem-Calendar-WrapperClass"
370
367
  >
371
- 13
372
- </span>
373
- </div>
374
- <div
375
- class="Calendar-valueWrapper"
376
- data-test="designSystem-Calendar-WrapperClass"
377
- >
378
- <span
379
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
380
- data-test="DesignSystem-Calendar--dateValue"
368
+ <span
369
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
370
+ data-test="DesignSystem-Calendar--dateValue"
371
+ >
372
+ 13
373
+ </span>
374
+ </div>
375
+ <div
376
+ class="Calendar-valueWrapper"
377
+ data-test="designSystem-Calendar-WrapperClass"
381
378
  >
382
- 14
383
- </span>
384
- </div>
385
- <div
386
- class="Calendar-valueWrapper"
387
- data-test="designSystem-Calendar-WrapperClass"
388
- >
389
- <span
390
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
391
- data-test="DesignSystem-Calendar--dateValue"
379
+ <span
380
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
381
+ data-test="DesignSystem-Calendar--dateValue"
382
+ >
383
+ 14
384
+ </span>
385
+ </div>
386
+ <div
387
+ class="Calendar-valueWrapper"
388
+ data-test="designSystem-Calendar-WrapperClass"
392
389
  >
393
- 15
394
- </span>
395
- </div>
396
- <div
397
- class="Calendar-valueWrapper"
398
- data-test="designSystem-Calendar-WrapperClass"
399
- >
400
- <span
401
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
402
- data-test="DesignSystem-Calendar--dateValue"
390
+ <span
391
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
392
+ data-test="DesignSystem-Calendar--dateValue"
393
+ >
394
+ 15
395
+ </span>
396
+ </div>
397
+ <div
398
+ class="Calendar-valueWrapper"
399
+ data-test="designSystem-Calendar-WrapperClass"
403
400
  >
404
- 16
405
- </span>
406
- </div>
407
- <div
408
- class="Calendar-valueWrapper"
409
- data-test="designSystem-Calendar-WrapperClass"
410
- >
411
- <span
412
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
413
- data-test="DesignSystem-Calendar--dateValue"
401
+ <span
402
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
403
+ data-test="DesignSystem-Calendar--dateValue"
404
+ >
405
+ 16
406
+ </span>
407
+ </div>
408
+ <div
409
+ class="Calendar-valueWrapper"
410
+ data-test="designSystem-Calendar-WrapperClass"
414
411
  >
415
- 17
416
- </span>
417
- </div>
418
- <div
419
- class="Calendar-valueWrapper"
420
- data-test="designSystem-Calendar-WrapperClass"
421
- >
422
- <span
423
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
424
- data-test="DesignSystem-Calendar--dateValue"
412
+ <span
413
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
414
+ data-test="DesignSystem-Calendar--dateValue"
415
+ >
416
+ 17
417
+ </span>
418
+ </div>
419
+ <div
420
+ class="Calendar-valueWrapper"
421
+ data-test="designSystem-Calendar-WrapperClass"
425
422
  >
426
- 18
427
- </span>
428
- </div>
429
- <div
430
- class="Calendar-valueWrapper"
431
- data-test="designSystem-Calendar-WrapperClass"
432
- >
433
- <span
434
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
435
- data-test="DesignSystem-Calendar--dateValue"
423
+ <span
424
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
425
+ data-test="DesignSystem-Calendar--dateValue"
426
+ >
427
+ 18
428
+ </span>
429
+ </div>
430
+ <div
431
+ class="Calendar-valueWrapper"
432
+ data-test="designSystem-Calendar-WrapperClass"
436
433
  >
437
- 19
438
- </span>
434
+ <span
435
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
436
+ data-test="DesignSystem-Calendar--dateValue"
437
+ >
438
+ 19
439
+ </span>
440
+ </div>
439
441
  </div>
440
- </div>
441
- <div
442
- class="Calendar-valueRow"
443
- >
444
442
  <div
445
- class="Calendar-valueWrapper"
446
- data-test="designSystem-Calendar-WrapperClass"
443
+ class="Calendar-valueRow"
447
444
  >
448
- <span
449
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
450
- data-test="DesignSystem-Calendar--dateValue"
445
+ <div
446
+ class="Calendar-valueWrapper"
447
+ data-test="designSystem-Calendar-WrapperClass"
451
448
  >
452
- 20
453
- </span>
454
- </div>
455
- <div
456
- class="Calendar-valueWrapper"
457
- data-test="designSystem-Calendar-WrapperClass"
458
- >
459
- <span
460
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
461
- data-test="DesignSystem-Calendar--dateValue"
449
+ <span
450
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
451
+ data-test="DesignSystem-Calendar--dateValue"
452
+ >
453
+ 20
454
+ </span>
455
+ </div>
456
+ <div
457
+ class="Calendar-valueWrapper"
458
+ data-test="designSystem-Calendar-WrapperClass"
462
459
  >
463
- 21
464
- </span>
465
- </div>
466
- <div
467
- class="Calendar-valueWrapper"
468
- data-test="designSystem-Calendar-WrapperClass"
469
- >
470
- <span
471
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
472
- data-test="DesignSystem-Calendar--dateValue"
460
+ <span
461
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
462
+ data-test="DesignSystem-Calendar--dateValue"
463
+ >
464
+ 21
465
+ </span>
466
+ </div>
467
+ <div
468
+ class="Calendar-valueWrapper"
469
+ data-test="designSystem-Calendar-WrapperClass"
473
470
  >
474
- 22
475
- </span>
476
- </div>
477
- <div
478
- class="Calendar-valueWrapper"
479
- data-test="designSystem-Calendar-WrapperClass"
480
- >
481
- <span
482
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
483
- data-test="DesignSystem-Calendar--dateValue"
471
+ <span
472
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
473
+ data-test="DesignSystem-Calendar--dateValue"
474
+ >
475
+ 22
476
+ </span>
477
+ </div>
478
+ <div
479
+ class="Calendar-valueWrapper"
480
+ data-test="designSystem-Calendar-WrapperClass"
484
481
  >
485
- 23
486
- </span>
487
- </div>
488
- <div
489
- class="Calendar-valueWrapper"
490
- data-test="designSystem-Calendar-WrapperClass"
491
- >
492
- <span
493
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
494
- data-test="DesignSystem-Calendar--dateValue"
482
+ <span
483
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
484
+ data-test="DesignSystem-Calendar--dateValue"
485
+ >
486
+ 23
487
+ </span>
488
+ </div>
489
+ <div
490
+ class="Calendar-valueWrapper"
491
+ data-test="designSystem-Calendar-WrapperClass"
495
492
  >
496
- 24
497
- </span>
498
- </div>
499
- <div
500
- class="Calendar-valueWrapper"
501
- data-test="designSystem-Calendar-WrapperClass"
502
- >
503
- <span
504
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
505
- data-test="DesignSystem-Calendar--dateValue"
493
+ <span
494
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
495
+ data-test="DesignSystem-Calendar--dateValue"
496
+ >
497
+ 24
498
+ </span>
499
+ </div>
500
+ <div
501
+ class="Calendar-valueWrapper"
502
+ data-test="designSystem-Calendar-WrapperClass"
506
503
  >
507
- 25
508
- </span>
509
- </div>
510
- <div
511
- class="Calendar-valueWrapper"
512
- data-test="designSystem-Calendar-WrapperClass"
513
- >
514
- <span
515
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
516
- data-test="DesignSystem-Calendar--dateValue"
504
+ <span
505
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
506
+ data-test="DesignSystem-Calendar--dateValue"
507
+ >
508
+ 25
509
+ </span>
510
+ </div>
511
+ <div
512
+ class="Calendar-valueWrapper"
513
+ data-test="designSystem-Calendar-WrapperClass"
517
514
  >
518
- 26
519
- </span>
515
+ <span
516
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
517
+ data-test="DesignSystem-Calendar--dateValue"
518
+ >
519
+ 26
520
+ </span>
521
+ </div>
520
522
  </div>
521
- </div>
522
- <div
523
- class="Calendar-valueRow"
524
- >
525
523
  <div
526
- class="Calendar-valueWrapper"
527
- data-test="designSystem-Calendar-WrapperClass"
524
+ class="Calendar-valueRow"
528
525
  >
529
- <span
530
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
531
- data-test="DesignSystem-Calendar--dateValue"
526
+ <div
527
+ class="Calendar-valueWrapper"
528
+ data-test="designSystem-Calendar-WrapperClass"
532
529
  >
533
- 27
534
- </span>
535
- </div>
536
- <div
537
- class="Calendar-valueWrapper"
538
- data-test="designSystem-Calendar-WrapperClass"
539
- >
540
- <span
541
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
542
- data-test="DesignSystem-Calendar--dateValue"
530
+ <span
531
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
532
+ data-test="DesignSystem-Calendar--dateValue"
533
+ >
534
+ 27
535
+ </span>
536
+ </div>
537
+ <div
538
+ class="Calendar-valueWrapper"
539
+ data-test="designSystem-Calendar-WrapperClass"
543
540
  >
544
- 28
545
- </span>
546
- </div>
547
- <div
548
- class="Calendar-valueWrapper"
549
- data-test="designSystem-Calendar-WrapperClass"
550
- >
551
- <span
552
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
553
- data-test="DesignSystem-Calendar--dateValue"
541
+ <span
542
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
543
+ data-test="DesignSystem-Calendar--dateValue"
544
+ >
545
+ 28
546
+ </span>
547
+ </div>
548
+ <div
549
+ class="Calendar-valueWrapper"
550
+ data-test="designSystem-Calendar-WrapperClass"
554
551
  >
555
- 29
556
- </span>
557
- </div>
558
- <div
559
- class="Calendar-valueWrapper"
560
- data-test="designSystem-Calendar-WrapperClass"
561
- >
562
- <span
563
- class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
564
- data-test="DesignSystem-Calendar--dateValue"
552
+ <span
553
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
554
+ data-test="DesignSystem-Calendar--dateValue"
555
+ >
556
+ 29
557
+ </span>
558
+ </div>
559
+ <div
560
+ class="Calendar-valueWrapper"
561
+ data-test="designSystem-Calendar-WrapperClass"
565
562
  >
566
- 30
567
- </span>
563
+ <span
564
+ class="Text Text--default Text--regular Calendar-value Calendar-dateValue Calendar-dateValue--large"
565
+ data-test="DesignSystem-Calendar--dateValue"
566
+ >
567
+ 30
568
+ </span>
569
+ </div>
570
+ <div
571
+ class="Calendar-valueWrapper"
572
+ data-test="designSystem-Calendar-WrapperClass"
573
+ />
574
+ <div
575
+ class="Calendar-valueWrapper"
576
+ data-test="designSystem-Calendar-WrapperClass"
577
+ />
578
+ <div
579
+ class="Calendar-valueWrapper"
580
+ data-test="designSystem-Calendar-WrapperClass"
581
+ />
568
582
  </div>
569
- <div
570
- class="Calendar-valueWrapper"
571
- data-test="designSystem-Calendar-WrapperClass"
572
- />
573
- <div
574
- class="Calendar-valueWrapper"
575
- data-test="designSystem-Calendar-WrapperClass"
576
- />
577
- <div
578
- class="Calendar-valueWrapper"
579
- data-test="designSystem-Calendar-WrapperClass"
580
- />
581
583
  </div>
582
584
  </div>
583
585
  </div>
584
586
  </div>
587
+ <div
588
+ class="d-flex justify-content-center pb-6 pt-3"
589
+ data-test="DesignSystem-Select--TodaysDate-wrapper"
590
+ >
591
+ <div
592
+ class="Chip-wrapper Chip Chip--action"
593
+ data-test="DesignSystem-Chip--GenericChip"
594
+ >
595
+ <span
596
+ class="Text Text--default Text--regular"
597
+ data-test="DesignSystem-GenericChip--Text"
598
+ >
599
+ Today, Sep 17
600
+ </span>
601
+ </div>
602
+ </div>
585
603
  </div>
586
604
  <div
587
605
  class="Dropdown"
@@ -702,6 +720,7 @@ exports[`TS renders children 1`] = `
702
720
  </div>
703
721
  <div
704
722
  class="d-flex flex-column flex-grow-1"
723
+ data-test="DesignSystem-InputMask--Wrapper"
705
724
  >
706
725
  <div
707
726
  class="Input Input--regular"
@@ -1585,7 +1604,7 @@ exports[`TS renders children 1`] = `
1585
1604
  class="Calendar-header"
1586
1605
  >
1587
1606
  <button
1588
- class="Button Button--regular Button--regularSquare Button--transparent Calendar-headerIcon Calendar-headerIcon--prev"
1607
+ class="Button Button--regular Button--regularSquare Button--basic Calendar-headerIcon Calendar-headerIcon--prev"
1589
1608
  data-test="DesignSystem-Button"
1590
1609
  tabindex="0"
1591
1610
  type="button"
@@ -1625,7 +1644,7 @@ exports[`TS renders children 1`] = `
1625
1644
  </span>
1626
1645
  </div>
1627
1646
  <button
1628
- class="Button Button--regular Button--regularSquare Button--transparent Calendar-headerIcon Calendar-headerIcon--next"
1647
+ class="Button Button--regular Button--regularSquare Button--basic Calendar-headerIcon Calendar-headerIcon--next"
1629
1648
  data-test="DesignSystem-Button"
1630
1649
  tabindex="0"
1631
1650
  type="button"
@@ -1649,48 +1668,48 @@ exports[`TS renders children 1`] = `
1649
1668
  <div
1650
1669
  class="Calendar-dayValues"
1651
1670
  >
1652
- <h4
1653
- class="Subheading Subheading--disabled Calendar-valueWrapper"
1654
- data-test="DesignSystem-Subheading"
1671
+ <span
1672
+ class="Text Text--default Text--strong Text--regular Calendar-valueWrapper"
1673
+ data-test="DesignSystem-Text"
1655
1674
  >
1656
- Sun
1657
- </h4>
1658
- <h4
1659
- class="Subheading Subheading--disabled Calendar-valueWrapper"
1660
- data-test="DesignSystem-Subheading"
1675
+ Su
1676
+ </span>
1677
+ <span
1678
+ class="Text Text--default Text--strong Text--regular Calendar-valueWrapper"
1679
+ data-test="DesignSystem-Text"
1661
1680
  >
1662
- Mon
1663
- </h4>
1664
- <h4
1665
- class="Subheading Subheading--disabled Calendar-valueWrapper"
1666
- data-test="DesignSystem-Subheading"
1681
+ Mo
1682
+ </span>
1683
+ <span
1684
+ class="Text Text--default Text--strong Text--regular Calendar-valueWrapper"
1685
+ data-test="DesignSystem-Text"
1667
1686
  >
1668
- Tue
1669
- </h4>
1670
- <h4
1671
- class="Subheading Subheading--disabled Calendar-valueWrapper"
1672
- data-test="DesignSystem-Subheading"
1687
+ Tu
1688
+ </span>
1689
+ <span
1690
+ class="Text Text--default Text--strong Text--regular Calendar-valueWrapper"
1691
+ data-test="DesignSystem-Text"
1673
1692
  >
1674
- Wed
1675
- </h4>
1676
- <h4
1677
- class="Subheading Subheading--disabled Calendar-valueWrapper"
1678
- data-test="DesignSystem-Subheading"
1693
+ We
1694
+ </span>
1695
+ <span
1696
+ class="Text Text--default Text--strong Text--regular Calendar-valueWrapper"
1697
+ data-test="DesignSystem-Text"
1679
1698
  >
1680
- Thu
1681
- </h4>
1682
- <h4
1683
- class="Subheading Subheading--disabled Calendar-valueWrapper"
1684
- data-test="DesignSystem-Subheading"
1699
+ Th
1700
+ </span>
1701
+ <span
1702
+ class="Text Text--default Text--strong Text--regular Calendar-valueWrapper"
1703
+ data-test="DesignSystem-Text"
1685
1704
  >
1686
- Fri
1687
- </h4>
1688
- <h4
1689
- class="Subheading Subheading--disabled Calendar-valueWrapper"
1690
- data-test="DesignSystem-Subheading"
1705
+ Fr
1706
+ </span>
1707
+ <span
1708
+ class="Text Text--default Text--strong Text--regular Calendar-valueWrapper"
1709
+ data-test="DesignSystem-Text"
1691
1710
  >
1692
- Sat
1693
- </h4>
1711
+ Sa
1712
+ </span>
1694
1713
  </div>
1695
1714
  <div
1696
1715
  class="Calendar-dateValues"