@vonage/vivid 3.36.0 → 3.38.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 (168) hide show
  1. package/accordion/index.js +3 -4
  2. package/accordion-item/index.js +3 -2
  3. package/alert/index.js +5 -4
  4. package/avatar/index.js +1 -1
  5. package/badge/index.js +2 -1
  6. package/banner/index.js +4 -3
  7. package/breadcrumb/index.js +0 -1
  8. package/breadcrumb-item/index.js +3 -2
  9. package/button/index.js +4 -3
  10. package/card/index.js +2 -3
  11. package/checkbox/index.js +3 -4
  12. package/combobox/index.js +7 -8
  13. package/custom-elements.json +386 -758
  14. package/data-grid/index.js +2 -3
  15. package/date-picker/index.js +10 -9
  16. package/date-range-picker/index.js +36 -0
  17. package/dialog/index.js +6 -7
  18. package/divider/index.js +1 -1
  19. package/elevation/index.js +1 -1
  20. package/empty-state/index.js +2 -3
  21. package/fab/index.js +4 -3
  22. package/file-picker/index.js +6 -4
  23. package/focus/index.js +1 -1
  24. package/header/index.js +2 -2
  25. package/icon/index.js +1 -1
  26. package/index.js +44 -42
  27. package/layout/index.js +1 -1
  28. package/lib/components.d.ts +1 -0
  29. package/lib/date-picker/date-picker.d.ts +5 -15
  30. package/lib/date-range-picker/date-range-picker.d.ts +16 -0
  31. package/lib/date-range-picker/definition.d.ts +3 -0
  32. package/lib/file-picker/file-picker.d.ts +8 -5
  33. package/lib/file-picker/file-picker.form-associated.d.ts +10 -0
  34. package/lib/file-picker/locale.d.ts +6 -0
  35. package/lib/number-field/number-field.d.ts +6 -2
  36. package/lib/tag-group/tag-group.d.ts +1 -0
  37. package/lib/tree-item/tree-item.template.d.ts +1 -1
  38. package/listbox/index.js +4 -5
  39. package/locales/en-GB.js +27 -3
  40. package/locales/en-US.js +27 -3
  41. package/locales/ja-JP.js +25 -1
  42. package/locales/zh-CN.js +25 -1
  43. package/menu/index.js +8 -9
  44. package/menu-item/index.js +4 -5
  45. package/nav/index.js +1 -1
  46. package/nav-disclosure/index.js +4 -3
  47. package/nav-item/index.js +4 -3
  48. package/note/index.js +3 -2
  49. package/number-field/index.js +6 -5
  50. package/option/index.js +4 -3
  51. package/package.json +1 -1
  52. package/pagination/index.js +5 -5
  53. package/popup/index.js +6 -5
  54. package/progress/index.js +1 -1
  55. package/progress-ring/index.js +1 -1
  56. package/radio/index.js +2 -2
  57. package/radio-group/index.js +2 -3
  58. package/select/index.js +8 -9
  59. package/shared/affix.js +5 -1
  60. package/shared/apply-mixins.js +1 -1
  61. package/shared/children.js +2 -2
  62. package/shared/date-picker/calendar/dateRange.d.ts +5 -0
  63. package/shared/date-picker/calendar/presentationDateRange.d.ts +5 -0
  64. package/shared/date-picker/date-picker-base.d.ts +20 -0
  65. package/shared/date-picker/date-picker-base.form-associated.d.ts +10 -0
  66. package/shared/date-picker/date-picker-base.template.d.ts +4 -0
  67. package/{lib → shared}/date-picker/locale.d.ts +6 -0
  68. package/shared/definition.js +5 -5
  69. package/shared/definition10.js +9 -14
  70. package/shared/definition11.js +1 -1
  71. package/shared/definition12.js +1 -1
  72. package/shared/definition13.js +3 -3
  73. package/shared/definition14.js +3 -3
  74. package/shared/definition15.js +5 -5
  75. package/shared/definition16.js +4 -5
  76. package/shared/definition17.js +59 -6016
  77. package/shared/definition18.js +350 -213
  78. package/shared/definition19.js +251 -67
  79. package/shared/definition2.js +2 -3
  80. package/shared/definition20.js +66 -58
  81. package/shared/definition21.js +43 -83
  82. package/shared/definition22.js +75 -2298
  83. package/shared/definition23.js +2361 -45
  84. package/shared/definition24.js +63 -27
  85. package/shared/definition25.js +24 -51
  86. package/shared/definition26.js +36 -806
  87. package/shared/definition27.js +820 -49
  88. package/shared/definition28.js +52 -89
  89. package/shared/definition29.js +88 -24
  90. package/shared/definition3.js +1 -1
  91. package/shared/definition30.js +25 -12
  92. package/shared/definition31.js +12 -53
  93. package/shared/definition32.js +29 -441
  94. package/shared/definition33.js +427 -197
  95. package/shared/definition34.js +260 -174
  96. package/shared/definition35.js +187 -69
  97. package/shared/definition36.js +68 -55
  98. package/shared/definition37.js +61 -422
  99. package/shared/definition38.js +435 -35
  100. package/shared/definition39.js +30 -679
  101. package/shared/definition4.js +3 -3
  102. package/shared/definition40.js +661 -77
  103. package/shared/definition41.js +77 -557
  104. package/shared/definition42.js +559 -106
  105. package/shared/definition43.js +105 -136
  106. package/shared/definition44.js +153 -17
  107. package/shared/definition45.js +16 -79
  108. package/shared/definition46.js +53 -475
  109. package/shared/definition47.js +506 -20
  110. package/shared/definition48.js +22 -121
  111. package/shared/definition49.js +115 -262
  112. package/shared/definition5.js +2 -2
  113. package/shared/definition50.js +248 -120
  114. package/shared/definition51.js +139 -123
  115. package/shared/definition52.js +84 -74
  116. package/shared/definition53.js +114 -70
  117. package/shared/definition54.js +81 -292
  118. package/shared/definition55.js +302 -13
  119. package/shared/definition56.js +11 -41
  120. package/shared/definition57.js +20 -154
  121. package/shared/definition58.js +181 -0
  122. package/shared/definition6.js +5 -5
  123. package/shared/definition7.js +4 -4
  124. package/shared/definition8.js +3 -3
  125. package/shared/definition9.js +1 -2
  126. package/shared/index.js +1 -1
  127. package/shared/index2.js +1 -1
  128. package/shared/listbox.js +1 -1
  129. package/shared/localization/Locale.d.ts +3 -1
  130. package/shared/localized.js +9 -0
  131. package/shared/patterns/affix.d.ts +3 -1
  132. package/shared/presentationDate.js +6133 -0
  133. package/shared/ref.js +1 -1
  134. package/shared/slotted.js +73 -3
  135. package/shared/text-anchor.template.js +4 -4
  136. package/shared/text-field.js +1 -1
  137. package/side-drawer/index.js +1 -1
  138. package/slider/index.js +2 -2
  139. package/split-button/index.js +4 -3
  140. package/style.css +265 -197
  141. package/styles/core/all.css +44 -13
  142. package/styles/core/theme.css +1 -1
  143. package/styles/core/typography.css +44 -13
  144. package/styles/tokens/theme-dark.css +4 -4
  145. package/styles/tokens/theme-light.css +4 -4
  146. package/styles/tokens/vivid-2-compat.css +1 -1
  147. package/switch/index.js +4 -3
  148. package/tab/index.js +4 -3
  149. package/tab-panel/index.js +1 -1
  150. package/tabs/index.js +6 -7
  151. package/tag/index.js +4 -3
  152. package/tag-group/index.js +1 -1
  153. package/text-anchor/index.js +1 -0
  154. package/text-area/index.js +4 -3
  155. package/text-field/index.js +4 -5
  156. package/toggletip/index.js +7 -6
  157. package/tooltip/index.js +7 -6
  158. package/tree-item/index.js +4 -5
  159. package/tree-view/index.js +1 -2
  160. package/vivid.api.json +105 -0
  161. package/lib/date-picker/date-picker.template.d.ts +0 -4
  162. package/shared/node-observation.js +0 -74
  163. /package/{lib → shared}/date-picker/calendar/calendarGrid.d.ts +0 -0
  164. /package/{lib → shared}/date-picker/calendar/dateStr.d.ts +0 -0
  165. /package/{lib → shared}/date-picker/calendar/month.d.ts +0 -0
  166. /package/{lib → shared}/date-picker/calendar/monthPickerGrid.d.ts +0 -0
  167. /package/{lib → shared}/date-picker/calendar/presentationDate.d.ts +0 -0
  168. /package/{lib → shared}/date-picker/calendar/year.d.ts +0 -0
@@ -1,5 +1,5 @@
1
1
  import { r as registerDataGrid } from '../shared/definition16.js';
2
- import '../shared/definition24.js';
2
+ import '../shared/definition25.js';
3
3
  import '../shared/index.js';
4
4
  import '../shared/icon.js';
5
5
  import '../shared/_has.js';
@@ -7,9 +7,8 @@ import '../shared/class-names.js';
7
7
  import '../shared/when.js';
8
8
  import '../shared/key-codes.js';
9
9
  import '../shared/repeat.js';
10
- import '../shared/node-observation.js';
11
- import '../shared/children.js';
12
10
  import '../shared/slotted.js';
11
+ import '../shared/children.js';
13
12
  import '../shared/focus2.js';
14
13
  import '../shared/focus.js';
15
14
 
@@ -1,17 +1,18 @@
1
1
  import { r as registerDatePicker } from '../shared/definition17.js';
2
2
  import '../shared/index.js';
3
- import '../shared/definition57.js';
3
+ import '../shared/definition58.js';
4
4
  import '../shared/definition10.js';
5
- import '../shared/definition24.js';
5
+ import '../shared/definition25.js';
6
6
  import '../shared/icon.js';
7
7
  import '../shared/_has.js';
8
8
  import '../shared/class-names.js';
9
9
  import '../shared/when.js';
10
- import '../shared/definition55.js';
10
+ import '../shared/definition56.js';
11
11
  import '../shared/focus.js';
12
- import '../shared/definition35.js';
12
+ import '../shared/definition36.js';
13
13
  import '../shared/base-progress.js';
14
14
  import '../shared/affix.js';
15
+ import '../shared/slotted.js';
15
16
  import '../shared/button.js';
16
17
  import '../shared/apply-mixins.js';
17
18
  import '../shared/form-associated.js';
@@ -20,16 +21,16 @@ import '../shared/aria-global.js';
20
21
  import '../shared/start-end.js';
21
22
  import '../shared/ref.js';
22
23
  import '../shared/focus2.js';
23
- import '../shared/definition56.js';
24
- import '../shared/definition50.js';
24
+ import '../shared/definition57.js';
25
+ import '../shared/definition51.js';
25
26
  import '../shared/index2.js';
26
27
  import '../locales/en-US.js';
27
28
  import '../shared/text-field2.js';
28
29
  import '../shared/text-field.js';
29
- import '../shared/slotted.js';
30
- import '../shared/node-observation.js';
31
- import '../shared/definition19.js';
30
+ import '../shared/definition20.js';
32
31
  import '../shared/aria.js';
32
+ import '../shared/presentationDate.js';
33
33
  import '../shared/repeat.js';
34
+ import '../shared/localized.js';
34
35
 
35
36
  registerDatePicker();
@@ -0,0 +1,36 @@
1
+ import { r as registerDateRangePicker } from '../shared/definition18.js';
2
+ import '../shared/index.js';
3
+ import '../shared/definition10.js';
4
+ import '../shared/definition25.js';
5
+ import '../shared/icon.js';
6
+ import '../shared/_has.js';
7
+ import '../shared/class-names.js';
8
+ import '../shared/when.js';
9
+ import '../shared/definition56.js';
10
+ import '../shared/focus.js';
11
+ import '../shared/definition36.js';
12
+ import '../shared/base-progress.js';
13
+ import '../shared/affix.js';
14
+ import '../shared/slotted.js';
15
+ import '../shared/button.js';
16
+ import '../shared/apply-mixins.js';
17
+ import '../shared/form-associated.js';
18
+ import '../shared/key-codes.js';
19
+ import '../shared/aria-global.js';
20
+ import '../shared/start-end.js';
21
+ import '../shared/ref.js';
22
+ import '../shared/focus2.js';
23
+ import '../shared/definition58.js';
24
+ import '../shared/definition57.js';
25
+ import '../shared/definition51.js';
26
+ import '../shared/index2.js';
27
+ import '../locales/en-US.js';
28
+ import '../shared/text-field2.js';
29
+ import '../shared/text-field.js';
30
+ import '../shared/definition20.js';
31
+ import '../shared/aria.js';
32
+ import '../shared/presentationDate.js';
33
+ import '../shared/repeat.js';
34
+ import '../shared/localized.js';
35
+
36
+ registerDateRangePicker();
package/dialog/index.js CHANGED
@@ -1,16 +1,17 @@
1
- import { r as registerDialog } from '../shared/definition18.js';
1
+ import { r as registerDialog } from '../shared/definition19.js';
2
2
  import '../shared/index.js';
3
- import '../shared/definition24.js';
3
+ import '../shared/definition25.js';
4
4
  import '../shared/icon.js';
5
5
  import '../shared/_has.js';
6
6
  import '../shared/class-names.js';
7
7
  import '../shared/when.js';
8
8
  import '../shared/definition10.js';
9
- import '../shared/definition55.js';
9
+ import '../shared/definition56.js';
10
10
  import '../shared/focus.js';
11
- import '../shared/definition35.js';
11
+ import '../shared/definition36.js';
12
12
  import '../shared/base-progress.js';
13
13
  import '../shared/affix.js';
14
+ import '../shared/slotted.js';
14
15
  import '../shared/button.js';
15
16
  import '../shared/apply-mixins.js';
16
17
  import '../shared/form-associated.js';
@@ -19,8 +20,6 @@ import '../shared/aria-global.js';
19
20
  import '../shared/start-end.js';
20
21
  import '../shared/ref.js';
21
22
  import '../shared/focus2.js';
22
- import '../shared/definition56.js';
23
- import '../shared/slotted.js';
24
- import '../shared/node-observation.js';
23
+ import '../shared/definition57.js';
25
24
 
26
25
  registerDialog();
package/divider/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import { r as registerDivider } from '../shared/definition19.js';
1
+ import { r as registerDivider } from '../shared/definition20.js';
2
2
  import '../shared/index.js';
3
3
  import '../shared/aria.js';
4
4
  import '../shared/class-names.js';
@@ -1,4 +1,4 @@
1
- import { r as registerElevation } from '../shared/definition56.js';
1
+ import { r as registerElevation } from '../shared/definition57.js';
2
2
  import '../shared/index.js';
3
3
  import '../shared/class-names.js';
4
4
 
@@ -1,11 +1,10 @@
1
- import { r as registerEmptyState } from '../shared/definition20.js';
1
+ import { r as registerEmptyState } from '../shared/definition21.js';
2
2
  import '../shared/index.js';
3
- import '../shared/definition24.js';
3
+ import '../shared/definition25.js';
4
4
  import '../shared/icon.js';
5
5
  import '../shared/_has.js';
6
6
  import '../shared/class-names.js';
7
7
  import '../shared/when.js';
8
8
  import '../shared/slotted.js';
9
- import '../shared/node-observation.js';
10
9
 
11
10
  registerEmptyState();
package/fab/index.js CHANGED
@@ -1,13 +1,14 @@
1
- import { r as registerFab } from '../shared/definition21.js';
1
+ import { r as registerFab } from '../shared/definition22.js';
2
2
  import '../shared/index.js';
3
- import '../shared/definition24.js';
3
+ import '../shared/definition25.js';
4
4
  import '../shared/icon.js';
5
5
  import '../shared/_has.js';
6
6
  import '../shared/class-names.js';
7
7
  import '../shared/when.js';
8
- import '../shared/definition55.js';
8
+ import '../shared/definition56.js';
9
9
  import '../shared/focus.js';
10
10
  import '../shared/affix.js';
11
+ import '../shared/slotted.js';
11
12
  import '../shared/apply-mixins.js';
12
13
  import '../shared/button.js';
13
14
  import '../shared/form-associated.js';
@@ -1,16 +1,17 @@
1
- import { r as registerFilePicker } from '../shared/definition22.js';
1
+ import { r as registerFilePicker } from '../shared/definition23.js';
2
2
  import '../shared/index.js';
3
- import '../shared/definition24.js';
3
+ import '../shared/definition25.js';
4
4
  import '../shared/icon.js';
5
5
  import '../shared/_has.js';
6
6
  import '../shared/class-names.js';
7
7
  import '../shared/when.js';
8
- import '../shared/definition55.js';
8
+ import '../shared/definition56.js';
9
9
  import '../shared/focus.js';
10
10
  import '../shared/definition10.js';
11
- import '../shared/definition35.js';
11
+ import '../shared/definition36.js';
12
12
  import '../shared/base-progress.js';
13
13
  import '../shared/affix.js';
14
+ import '../shared/slotted.js';
14
15
  import '../shared/button.js';
15
16
  import '../shared/apply-mixins.js';
16
17
  import '../shared/form-associated.js';
@@ -21,5 +22,6 @@ import '../shared/ref.js';
21
22
  import '../shared/focus2.js';
22
23
  import '../shared/index2.js';
23
24
  import '../locales/en-US.js';
25
+ import '../shared/localized.js';
24
26
 
25
27
  registerFilePicker();
package/focus/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import { r as registerFocus } from '../shared/definition55.js';
1
+ import { r as registerFocus } from '../shared/definition56.js';
2
2
  import '../shared/index.js';
3
3
  import '../shared/focus.js';
4
4
 
package/header/index.js CHANGED
@@ -1,6 +1,6 @@
1
- import { r as registerHeader } from '../shared/definition23.js';
1
+ import { r as registerHeader } from '../shared/definition24.js';
2
2
  import '../shared/index.js';
3
- import '../shared/definition56.js';
3
+ import '../shared/definition57.js';
4
4
  import '../shared/class-names.js';
5
5
 
6
6
  registerHeader();
package/icon/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import { r as registerIcon } from '../shared/definition24.js';
1
+ import { r as registerIcon } from '../shared/definition25.js';
2
2
  import '../shared/index.js';
3
3
  import '../shared/icon.js';
4
4
  import '../shared/_has.js';
package/index.js CHANGED
@@ -15,50 +15,52 @@ export { c as checkboxDefinition, a as checkboxRegistries, r as registerCheckbox
15
15
  export { c as combobox, a as comboboxRegistries, r as registerCombobox } from './shared/definition15.js';
16
16
  export { d as dataGrid, b as dataGridCell, c as dataGridElements, a as dataGridRow, r as registerDataGrid } from './shared/definition16.js';
17
17
  export { d as datePickerDefinition, a as datePickerRegistries, r as registerDatePicker } from './shared/definition17.js';
18
- export { d as dialogDefinition, a as dialogRegistries, r as registerDialog } from './shared/definition18.js';
19
- export { d as dividerDefinition, a as dividerRegistries, r as registerDivider } from './shared/definition19.js';
20
- export { e as emptyStateDefinition, a as emptyStateRegistries, r as registerEmptyState } from './shared/definition20.js';
21
- export { f as fabDefinition, a as fabRegistries, r as registerFab } from './shared/definition21.js';
22
- export { f as filePickerDefinition, a as filePickerRegistries, r as registerFilePicker } from './shared/definition22.js';
23
- export { h as headerDefinition, a as headerRegistries, r as registerHeader } from './shared/definition23.js';
24
- export { i as iconDefinition, a as iconRegistries, r as registerIcon } from './shared/definition24.js';
25
- export { l as layoutDefinition, a as layoutRegistries, r as registerLayout } from './shared/definition25.js';
26
- export { m as menuItemDefinition, a as menuItemRegistries, r as registerMenuItem } from './shared/definition26.js';
27
- export { m as menuDefinition, a as menuRegistries, r as registerMenu } from './shared/definition27.js';
28
- export { n as navDisclosureDefinition, a as navDisclosureRegistries, r as registerNavDisclosure } from './shared/definition28.js';
29
- export { n as navItemDefinition, a as navItemRegistries, r as registerNavItem } from './shared/definition29.js';
30
- export { n as navDefinition, a as navRegistries, r as registerNav } from './shared/definition30.js';
31
- export { n as noteDefinition, a as noteRegistries, r as registerNote } from './shared/definition31.js';
32
- export { n as numberFieldDefinition, a as numberFieldRegistries, r as registerNumberField } from './shared/definition32.js';
33
- export { l as listboxOptionDefinition, a as listboxOptionRegistries, r as registerOption } from './shared/definition33.js';
34
- export { p as paginationDefinition, a as paginationRegistries, r as registerPagination } from './shared/definition34.js';
35
- export { p as progressRingDefinition, a as progressRingRegistries, r as registerProgressRing } from './shared/definition35.js';
36
- export { p as progressDefinition, a as progressRegistries, r as registerProgress } from './shared/definition36.js';
37
- export { r as radioGroupDefinition, a as radioGroupRegistries, b as registerRadioGroup } from './shared/definition37.js';
38
- export { r as radioDefinition, a as radioRegistries, b as registerRadio } from './shared/definition38.js';
39
- export { r as registerSelect, s as selectDefinition, a as selectRegistries } from './shared/definition39.js';
40
- export { r as registerSideDrawer, s as sideDrawerDefinition, a as sideDrawerRegistries } from './shared/definition40.js';
41
- export { r as registerSlider, s as sliderDefinition, a as sliderRegistries } from './shared/definition41.js';
42
- export { r as registerSplitButton, s as splitButtonDefinition, a as splitButtonRegistries } from './shared/definition42.js';
43
- export { r as registerSwitch, s as switchDefinition, a as switchRegistries } from './shared/definition43.js';
44
- export { r as registerTabPanel, t as tabPanelDefinition, a as tabPanelRegistries } from './shared/definition44.js';
45
- export { r as registerTab, t as tabDefinition, a as tabRegistries } from './shared/definition45.js';
46
- export { r as registerTabs, t as tabsDefinition, a as tabsRegistries } from './shared/definition46.js';
47
- export { r as registerTagGroup, t as tagGroupDefinition, a as tagGroupRegistries } from './shared/definition47.js';
48
- export { r as registerTag, t as tagDefinition } from './shared/definition48.js';
49
- export { r as registerTextArea, t as textAreaDefinition, a as textAreaRegistries } from './shared/definition49.js';
50
- export { r as registerTextField, t as textFieldDefinition, a as textFieldRegistries } from './shared/definition50.js';
51
- export { r as registerToggletip, t as toggletipDefinition, a as toggletipRegistries } from './shared/definition51.js';
52
- export { r as registerTooltip, t as tooltipDefinition, a as tooltipRegistries } from './shared/definition52.js';
53
- export { r as registerTreeItem, t as treeItemDefinition, a as treeItemRegistries } from './shared/definition53.js';
54
- export { r as registerTreeView, t as treeViewDefinition, a as treeViewRegistries } from './shared/definition54.js';
18
+ export { d as dateRangePickerDefinition, a as dateRangePickerRegistries, r as registerDateRangePicker } from './shared/definition18.js';
19
+ export { d as dialogDefinition, a as dialogRegistries, r as registerDialog } from './shared/definition19.js';
20
+ export { d as dividerDefinition, a as dividerRegistries, r as registerDivider } from './shared/definition20.js';
21
+ export { e as emptyStateDefinition, a as emptyStateRegistries, r as registerEmptyState } from './shared/definition21.js';
22
+ export { f as fabDefinition, a as fabRegistries, r as registerFab } from './shared/definition22.js';
23
+ export { f as filePickerDefinition, a as filePickerRegistries, r as registerFilePicker } from './shared/definition23.js';
24
+ export { h as headerDefinition, a as headerRegistries, r as registerHeader } from './shared/definition24.js';
25
+ export { i as iconDefinition, a as iconRegistries, r as registerIcon } from './shared/definition25.js';
26
+ export { l as layoutDefinition, a as layoutRegistries, r as registerLayout } from './shared/definition26.js';
27
+ export { m as menuItemDefinition, a as menuItemRegistries, r as registerMenuItem } from './shared/definition27.js';
28
+ export { m as menuDefinition, a as menuRegistries, r as registerMenu } from './shared/definition28.js';
29
+ export { n as navDisclosureDefinition, a as navDisclosureRegistries, r as registerNavDisclosure } from './shared/definition29.js';
30
+ export { n as navItemDefinition, a as navItemRegistries, r as registerNavItem } from './shared/definition30.js';
31
+ export { n as navDefinition, a as navRegistries, r as registerNav } from './shared/definition31.js';
32
+ export { n as noteDefinition, a as noteRegistries, r as registerNote } from './shared/definition32.js';
33
+ export { n as numberFieldDefinition, a as numberFieldRegistries, r as registerNumberField } from './shared/definition33.js';
34
+ export { l as listboxOptionDefinition, a as listboxOptionRegistries, r as registerOption } from './shared/definition34.js';
35
+ export { p as paginationDefinition, a as paginationRegistries, r as registerPagination } from './shared/definition35.js';
36
+ export { p as progressRingDefinition, a as progressRingRegistries, r as registerProgressRing } from './shared/definition36.js';
37
+ export { p as progressDefinition, a as progressRegistries, r as registerProgress } from './shared/definition37.js';
38
+ export { r as radioGroupDefinition, a as radioGroupRegistries, b as registerRadioGroup } from './shared/definition38.js';
39
+ export { r as radioDefinition, a as radioRegistries, b as registerRadio } from './shared/definition39.js';
40
+ export { r as registerSelect, s as selectDefinition, a as selectRegistries } from './shared/definition40.js';
41
+ export { r as registerSideDrawer, s as sideDrawerDefinition, a as sideDrawerRegistries } from './shared/definition41.js';
42
+ export { r as registerSlider, s as sliderDefinition, a as sliderRegistries } from './shared/definition42.js';
43
+ export { r as registerSplitButton, s as splitButtonDefinition, a as splitButtonRegistries } from './shared/definition43.js';
44
+ export { r as registerSwitch, s as switchDefinition, a as switchRegistries } from './shared/definition44.js';
45
+ export { r as registerTabPanel, t as tabPanelDefinition, a as tabPanelRegistries } from './shared/definition45.js';
46
+ export { r as registerTab, t as tabDefinition, a as tabRegistries } from './shared/definition46.js';
47
+ export { r as registerTabs, t as tabsDefinition, a as tabsRegistries } from './shared/definition47.js';
48
+ export { r as registerTagGroup, t as tagGroupDefinition, a as tagGroupRegistries } from './shared/definition48.js';
49
+ export { r as registerTag, t as tagDefinition } from './shared/definition49.js';
50
+ export { r as registerTextArea, t as textAreaDefinition, a as textAreaRegistries } from './shared/definition50.js';
51
+ export { r as registerTextField, t as textFieldDefinition, a as textFieldRegistries } from './shared/definition51.js';
52
+ export { r as registerToggletip, t as toggletipDefinition, a as toggletipRegistries } from './shared/definition52.js';
53
+ export { r as registerTooltip, t as tooltipDefinition, a as tooltipRegistries } from './shared/definition53.js';
54
+ export { r as registerTreeItem, t as treeItemDefinition, a as treeItemRegistries } from './shared/definition54.js';
55
+ export { r as registerTreeView, t as treeViewDefinition, a as treeViewRegistries } from './shared/definition55.js';
55
56
  export { d as designSystem, r as registerFactory } from './shared/index.js';
56
57
  export { s as setLocale } from './shared/index2.js';
57
- import './shared/definition55.js';
58
+ import './shared/definition56.js';
58
59
  import './shared/focus.js';
59
60
  import './shared/affix.js';
60
61
  import './shared/icon.js';
61
62
  import './shared/_has.js';
63
+ import './shared/slotted.js';
62
64
  import './shared/apply-mixins.js';
63
65
  import './shared/start-end.js';
64
66
  import './shared/ref.js';
@@ -66,10 +68,8 @@ import './shared/focus2.js';
66
68
  import './shared/when.js';
67
69
  import './shared/key-codes.js';
68
70
  import './shared/numbers.js';
69
- import './shared/node-observation.js';
70
- import './shared/slotted.js';
71
71
  import './shared/class-names.js';
72
- import './shared/definition56.js';
72
+ import './shared/definition57.js';
73
73
  import './shared/button.js';
74
74
  import './shared/form-associated.js';
75
75
  import './shared/aria-global.js';
@@ -78,12 +78,14 @@ import './shared/anchor.js';
78
78
  import './shared/text-anchor.template.js';
79
79
  import './shared/calendar-event.js';
80
80
  import './shared/repeat.js';
81
- import './shared/definition57.js';
81
+ import './shared/definition58.js';
82
82
  import './shared/text-field.js';
83
83
  import './shared/listbox.js';
84
84
  import './shared/strings.js';
85
85
  import './shared/select.options.js';
86
86
  import './shared/children.js';
87
+ import './shared/presentationDate.js';
88
+ import './shared/localized.js';
87
89
  import './shared/aria.js';
88
90
  import './shared/direction.js';
89
91
  import './shared/dom.js';
package/layout/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import { r as registerLayout } from '../shared/definition25.js';
1
+ import { r as registerLayout } from '../shared/definition26.js';
2
2
  import '../shared/index.js';
3
3
  import '../shared/class-names.js';
4
4
 
@@ -15,6 +15,7 @@ export * from './checkbox/definition';
15
15
  export * from './combobox/definition';
16
16
  export * from './data-grid/definition';
17
17
  export * from './date-picker/definition';
18
+ export * from './date-range-picker/definition';
18
19
  export * from './dialog/definition';
19
20
  export * from './divider/definition';
20
21
  export * from './empty-state/definition';
@@ -1,18 +1,8 @@
1
- import { FoundationElement } from '@microsoft/fast-foundation';
2
- import { Localized } from '../../shared/patterns';
3
- import { type DateStr } from './calendar/dateStr';
4
- export declare class DatePicker extends FoundationElement {
1
+ import { type ErrorText, type FormElement } from '../../shared/patterns';
2
+ import { DatePickerBase } from '../../shared/date-picker/date-picker-base';
3
+ export declare class DatePicker extends DatePickerBase {
5
4
  #private;
6
- label?: string;
7
- helperText?: string;
8
- errorText?: string;
9
- min: DateStr | null;
10
- max: DateStr | null;
11
- value: DateStr | null;
12
- disabled: boolean;
13
- readOnly: boolean;
14
- connectedCallback(): void;
15
- disconnectedCallback(): void;
5
+ constructor();
16
6
  }
17
- export interface DatePicker extends Localized {
7
+ export interface DatePicker extends ErrorText, FormElement {
18
8
  }
@@ -0,0 +1,16 @@
1
+ import { type ErrorText, type FormElement } from '../../shared/patterns';
2
+ import { DatePickerBase } from '../../shared/date-picker/date-picker-base';
3
+ export declare class DateRangePicker extends DatePickerBase {
4
+ #private;
5
+ initialStart: string;
6
+ initialEnd: string;
7
+ start: string;
8
+ end: string;
9
+ currentStart: string;
10
+ currentEnd: string;
11
+ setFormValue: (value: File | string | FormData | null, state?: File | string | FormData | null) => void;
12
+ connectedCallback(): void;
13
+ formResetCallback(): void;
14
+ }
15
+ export interface DateRangePicker extends ErrorText, FormElement {
16
+ }
@@ -0,0 +1,3 @@
1
+ import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
2
+ export declare const dateRangePickerDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
3
+ export declare const registerDateRangePicker: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;
@@ -1,11 +1,10 @@
1
- import { FoundationElement } from '@microsoft/fast-foundation';
2
1
  import type { Size } from '../enums';
3
- import { FormElementHelperText } from '../../shared/patterns';
2
+ import { type ErrorText, type FormElement, FormElementHelperText, Localized } from '../../shared/patterns';
3
+ import { FormAssociatedFilePicker } from './file-picker.form-associated';
4
4
  export type FileUploaderSize = Extract<Size, Size.Normal | Size.Expanded>;
5
- export declare class FilePicker extends FoundationElement {
5
+ export declare class FilePicker extends FormAssociatedFilePicker {
6
6
  #private;
7
7
  get files(): File[];
8
- label?: string;
9
8
  maxFiles?: number;
10
9
  maxFilesChanged(_oldValue: number, newValue: number): void;
11
10
  maxFileSize: number;
@@ -13,10 +12,14 @@ export declare class FilePicker extends FoundationElement {
13
12
  accept?: string;
14
13
  acceptChanged(_oldValue: string, newValue: string): void;
15
14
  size?: FileUploaderSize;
15
+ nameChanged(previous: string, next: string): void;
16
16
  private buttonTag;
17
17
  constructor();
18
18
  connectedCallback(): void;
19
19
  disconnectedCallback(): void;
20
+ setFormValue: (value: File | string | FormData | null, state?: File | string | FormData | null) => void;
21
+ validate(): void;
22
+ formResetCallback(): void;
20
23
  }
21
- export interface FilePicker extends FormElementHelperText {
24
+ export interface FilePicker extends FormElementHelperText, Localized, ErrorText, FormElement, FormElementHelperText {
22
25
  }
@@ -0,0 +1,10 @@
1
+ import { FormAssociated, FoundationElement } from '@microsoft/fast-foundation';
2
+ declare class _FilePicker extends FoundationElement {
3
+ }
4
+ interface _FilePicker extends FormAssociated {
5
+ }
6
+ declare const FormAssociatedFilePicker_base: typeof _FilePicker;
7
+ export declare class FormAssociatedFilePicker extends FormAssociatedFilePicker_base {
8
+ proxy: HTMLInputElement;
9
+ }
10
+ export {};
@@ -0,0 +1,6 @@
1
+ export interface FilePickerLocale {
2
+ invalidFileTypeError: string;
3
+ maxFilesExceededError: string;
4
+ fileTooBigError: string;
5
+ removeFileLabel: string;
6
+ }
@@ -1,6 +1,6 @@
1
1
  import { NumberField as FastNumberField } from '@microsoft/fast-foundation';
2
2
  import type { Appearance, Shape } from '../enums';
3
- import { type FormElement, FormElementCharCount, FormElementHelperText, FormElementSuccessText } from '../../shared/patterns';
3
+ import { type ErrorText, type FormElement, FormElementCharCount, FormElementHelperText, FormElementSuccessText } from '../../shared/patterns';
4
4
  import { AffixIcon } from '../../shared/patterns';
5
5
  export type NumberFieldAppearance = Extract<Appearance, Appearance.Fieldset | Appearance.Ghost>;
6
6
  export type NumberFieldShape = Extract<Shape, Shape.Rounded | Shape.Pill>;
@@ -8,6 +8,10 @@ export declare class NumberField extends FastNumberField {
8
8
  appearance?: NumberFieldAppearance;
9
9
  shape?: NumberFieldShape;
10
10
  autoComplete?: string;
11
+ stepChanged(_previous: number, next: number): void;
12
+ attributeChangedCallback(name: string, previous: string, next: string): void;
13
+ stepUp(): void;
14
+ stepDown(): void;
11
15
  }
12
- export interface NumberField extends AffixIcon, FormElement, FormElementCharCount, FormElementHelperText, FormElementSuccessText {
16
+ export interface NumberField extends AffixIcon, ErrorText, FormElement, FormElementCharCount, FormElementHelperText, FormElementSuccessText {
13
17
  }
@@ -1,3 +1,4 @@
1
1
  import { FoundationElement } from '@microsoft/fast-foundation';
2
2
  export declare class TagGroup extends FoundationElement {
3
+ ariaLabel: string | null;
3
4
  }
@@ -1,4 +1,4 @@
1
1
  import type { ElementDefinitionContext } from '@microsoft/fast-foundation';
2
- import type { TreeItem } from './tree-item';
2
+ import { TreeItem } from './tree-item';
3
3
  export declare const expandCollapseButton: (context: ElementDefinitionContext) => import("@microsoft/fast-element").ViewTemplate<TreeItem, any>;
4
4
  export declare const TreeItemTemplate: (context: ElementDefinitionContext) => import("@microsoft/fast-element").ViewTemplate<TreeItem, any>;
package/listbox/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { h as html, r as registerFactory } from '../shared/index.js';
2
- import { f as focusRegistries } from '../shared/definition55.js';
3
- import { a as listboxOptionRegistries } from '../shared/definition33.js';
2
+ import { f as focusRegistries } from '../shared/definition56.js';
3
+ import { a as listboxOptionRegistries } from '../shared/definition34.js';
4
4
  import { L as ListboxElement, a as Listbox } from '../shared/listbox.js';
5
5
  import '../shared/affix.js';
6
6
  import { f as focusTemplateFactory } from '../shared/focus2.js';
@@ -8,7 +8,7 @@ import '../shared/index2.js';
8
8
  import { s as slotted } from '../shared/slotted.js';
9
9
  import { c as classNames } from '../shared/class-names.js';
10
10
  import '../shared/focus.js';
11
- import '../shared/definition24.js';
11
+ import '../shared/definition25.js';
12
12
  import '../shared/icon.js';
13
13
  import '../shared/_has.js';
14
14
  import '../shared/when.js';
@@ -21,7 +21,6 @@ import '../shared/key-codes.js';
21
21
  import '../shared/strings.js';
22
22
  import '../shared/numbers.js';
23
23
  import '../locales/en-US.js';
24
- import '../shared/node-observation.js';
25
24
 
26
25
  const getClasses = ({ appearance, shape, disabled, orientation }) => classNames(
27
26
  "base",
@@ -62,7 +61,7 @@ const ListboxTemplate = (context) => {
62
61
  `;
63
62
  };
64
63
 
65
- const styles = "/**\n * Do not edit directly\n * Generated on Wed, 13 Sep 2023 10:58:27 GMT\n */\n:host {\n display: inline-block;\n inline-size: fit-content;\n}\n\n:host(:focus-within) {\n outline: none;\n}\n\n.base {\n position: relative;\n display: inline-flex;\n box-sizing: border-box;\n padding: 4px;\n background-color: var(--_appearance-color-fill);\n border-radius: var(--_listbox-border-radius);\n box-shadow: inset 0 0 0 1px var(--_appearance-color-outline);\n contain: paint;\n gap: 4px;\n inline-size: 100%;\n}\n.base {\n /* @cssprop [--vvd-listbox-accent-backdrop=var(--vvd-color-canvas)] */\n --_connotation-color-backdrop: var(--vvd-listbox-accent-backdrop, var(--vvd-color-canvas));\n /* @cssprop [--vvd-listbox-accent-intermediate=var(--vvd-color-neutral-500)] */\n --_connotation-color-intermediate: var(--vvd-listbox-accent-intermediate, var(--vvd-color-neutral-500));\n /* @cssprop [--vvd-listbox-accent-primary=var(--vvd-color-canvas-text)] */\n --_connotation-color-primary: var(--vvd-listbox-accent-primary, var(--vvd-color-canvas-text));\n /* @cssprop [--vvd-listbox-accent-soft=var(--vvd-color-neutral-100)] */\n --_connotation-color-soft: var(--vvd-listbox-accent-soft, var(--vvd-color-neutral-100));\n}\n.base {\n --_appearance-color-text: var(--vvd-color-canvas-text);\n --_appearance-color-fill: var(--_connotation-color-backdrop);\n --_appearance-color-outline: var(--_connotation-color-intermediate);\n}\n.base.appearance-ghost {\n --_appearance-color-text: var(--_connotation-color-primary);\n --_appearance-color-fill: transparent;\n --_appearance-color-outline: transparent;\n}\n.base:where(:disabled, .disabled) {\n --_appearance-color-text: var(--vvd-color-neutral-300);\n --_appearance-color-fill: var(--vvd-color-neutral-100);\n --_appearance-color-outline: var(--vvd-color-neutral-300);\n}\n.base:where(:disabled, .disabled).appearance-ghost {\n --_appearance-color-text: var(--vvd-color-neutral-300);\n --_appearance-color-fill: transparent;\n --_appearance-color-outline: transparent;\n}\n.base:not(.orientation-horizontal) {\n flex-direction: column;\n}\n\n.focus-indicator {\n pointer-events: none;\n}\n:host(:not(:focus-within)) .focus-indicator {\n display: none;\n}\n\n/* Shape */\n.base:not(.shape-pill) {\n --_listbox-border-radius: 6px;\n}\n\n.base.shape-pill {\n --_listbox-border-radius: 24px;\n}\n\n::slotted([role=option]) {\n border-radius: var(--_listbox-border-radius);\n contain: content;\n}\n\n.base.disabled ::slotted([role=option]) {\n --_option-appearance-color-text: var(--_appearance-color-outline);\n cursor: not-allowed;\n pointer-events: none;\n}";
64
+ const styles = "/**\n * Do not edit directly\n * Generated on Fri, 13 Oct 2023 14:45:50 GMT\n */\n:host {\n display: inline-block;\n inline-size: fit-content;\n}\n\n:host(:focus-within) {\n outline: none;\n}\n\n:host([disabled]) {\n cursor: not-allowed;\n}\n\n.base {\n position: relative;\n display: inline-flex;\n box-sizing: border-box;\n padding: 4px;\n background-color: var(--_appearance-color-fill);\n border-radius: var(--_listbox-border-radius);\n box-shadow: inset 0 0 0 1px var(--_appearance-color-outline);\n contain: paint;\n gap: 4px;\n inline-size: 100%;\n}\n.base {\n /* @cssprop [--vvd-listbox-accent-backdrop=var(--vvd-color-canvas)] */\n --_connotation-color-backdrop: var(--vvd-listbox-accent-backdrop, var(--vvd-color-canvas));\n /* @cssprop [--vvd-listbox-accent-intermediate=var(--vvd-color-neutral-500)] */\n --_connotation-color-intermediate: var(--vvd-listbox-accent-intermediate, var(--vvd-color-neutral-500));\n /* @cssprop [--vvd-listbox-accent-primary=var(--vvd-color-canvas-text)] */\n --_connotation-color-primary: var(--vvd-listbox-accent-primary, var(--vvd-color-canvas-text));\n /* @cssprop [--vvd-listbox-accent-soft=var(--vvd-color-neutral-100)] */\n --_connotation-color-soft: var(--vvd-listbox-accent-soft, var(--vvd-color-neutral-100));\n}\n.base {\n --_appearance-color-text: var(--vvd-color-canvas-text);\n --_appearance-color-fill: var(--_connotation-color-backdrop);\n --_appearance-color-outline: var(--_connotation-color-intermediate);\n}\n.base.appearance-ghost {\n --_appearance-color-text: var(--_connotation-color-primary);\n --_appearance-color-fill: transparent;\n --_appearance-color-outline: transparent;\n}\n.base:where(:disabled, .disabled) {\n --_appearance-color-text: var(--vvd-color-neutral-300);\n --_appearance-color-fill: var(--vvd-color-neutral-100);\n --_appearance-color-outline: var(--vvd-color-neutral-300);\n}\n.base:where(:disabled, .disabled).appearance-ghost {\n --_appearance-color-text: var(--vvd-color-neutral-300);\n --_appearance-color-fill: transparent;\n --_appearance-color-outline: transparent;\n}\n.base:not(.orientation-horizontal) {\n flex-direction: column;\n}\n\n.focus-indicator {\n pointer-events: none;\n}\n:host(:not(:focus-within)) .focus-indicator {\n display: none;\n}\n\n/* Shape */\n.base:not(.shape-pill) {\n --_listbox-border-radius: 6px;\n}\n\n.base.shape-pill {\n --_listbox-border-radius: 24px;\n}\n\n::slotted([role=option]) {\n border-radius: var(--_listbox-border-radius);\n contain: content;\n}\n\n.base.disabled ::slotted([role=option]) {\n --_option-appearance-color-text: var(--_appearance-color-outline);\n pointer-events: none;\n}";
66
65
 
67
66
  const listboxDefinition = Listbox.compose({
68
67
  baseName: "listbox",
package/locales/en-GB.js CHANGED
@@ -11,7 +11,7 @@ const enGB = {
11
11
  "July",
12
12
  "August",
13
13
  "September",
14
- "Oktober",
14
+ "October",
15
15
  "November",
16
16
  "December"
17
17
  ],
@@ -25,7 +25,7 @@ const enGB = {
25
25
  "Jul",
26
26
  "Aug",
27
27
  "Sep",
28
- "Okt",
28
+ "Oct",
29
29
  "Nov",
30
30
  "Dec"
31
31
  ]
@@ -46,13 +46,37 @@ const enGB = {
46
46
  dateFormat: "dd/MM/yyyy",
47
47
  dateFormatPlaceholder: "DD/MM/YYYY",
48
48
  chooseDateLabel: "Choose date",
49
+ changeDateLabel: (
50
+ /* istanbul ignore next */
51
+ (date) => `Change date, ${date}`
52
+ ),
53
+ chooseDatesLabel: "Choose dates",
54
+ changeDatesLabel: (
55
+ /* istanbul ignore next */
56
+ (range) => `Change dates, ${range}`
57
+ ),
49
58
  prevYearLabel: "Previous year",
50
59
  prevMonthLabel: "Previous month",
51
60
  nextMonthLabel: "Next month",
52
61
  nextYearLabel: "Next year",
53
62
  clearLabel: "Clear",
54
63
  okLabel: "OK",
55
- invalidDateError: "Please enter a valid date."
64
+ invalidDateError: "Please enter a valid date.",
65
+ invalidDateRangeError: "Please enter a valid date range.",
66
+ startDateAfterMinDateError: (
67
+ /* istanbul ignore next */
68
+ (minDate) => `The start date must be ${minDate} or later.`
69
+ ),
70
+ endDateBeforeMaxDateError: (
71
+ /* istanbul ignore next */
72
+ (maxDate) => `The end date must be ${maxDate} or earlier.`
73
+ )
74
+ },
75
+ filePicker: {
76
+ invalidFileTypeError: "You can't select files of this type.",
77
+ maxFilesExceededError: "You can't select any more files.",
78
+ fileTooBigError: "File is too big ({{filesize}}MiB). Max filesize: {{maxFilesize}}MiB.",
79
+ removeFileLabel: "Remove file"
56
80
  }
57
81
  };
58
82