@cloudscape-design/components 3.0.680 → 3.0.682

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 (245) hide show
  1. package/button/index.d.ts.map +1 -1
  2. package/button/index.js +2 -2
  3. package/button/index.js.map +1 -1
  4. package/button/interfaces.d.ts +6 -0
  5. package/button/interfaces.d.ts.map +1 -1
  6. package/button/interfaces.js.map +1 -1
  7. package/button/internal.d.ts.map +1 -1
  8. package/button/internal.js +15 -4
  9. package/button/internal.js.map +1 -1
  10. package/button/styles.css.js +20 -19
  11. package/button/styles.scoped.css +161 -167
  12. package/button/styles.selectors.js +20 -19
  13. package/button/test-classes/styles.css.js +6 -0
  14. package/button/test-classes/styles.scoped.css +7 -0
  15. package/button/test-classes/styles.selectors.js +7 -0
  16. package/button-dropdown/category-elements/expandable-category-element.js +1 -1
  17. package/button-dropdown/category-elements/expandable-category-element.js.map +1 -1
  18. package/button-dropdown/category-elements/mobile-expandable-category-element.js +1 -1
  19. package/button-dropdown/category-elements/mobile-expandable-category-element.js.map +1 -1
  20. package/button-dropdown/index.d.ts.map +1 -1
  21. package/button-dropdown/index.js +2 -2
  22. package/button-dropdown/index.js.map +1 -1
  23. package/button-dropdown/interfaces.d.ts +7 -0
  24. package/button-dropdown/interfaces.d.ts.map +1 -1
  25. package/button-dropdown/interfaces.js.map +1 -1
  26. package/button-dropdown/internal.d.ts.map +1 -1
  27. package/button-dropdown/internal.js +4 -2
  28. package/button-dropdown/internal.js.map +1 -1
  29. package/button-dropdown/item-element/index.js +1 -1
  30. package/button-dropdown/item-element/index.js.map +1 -1
  31. package/calendar/grid/index.d.ts +3 -1
  32. package/calendar/grid/index.d.ts.map +1 -1
  33. package/calendar/grid/index.js +26 -6
  34. package/calendar/grid/index.js.map +1 -1
  35. package/calendar/grid/use-calendar-grid-keyboard-navigation.d.ts +2 -1
  36. package/calendar/grid/use-calendar-grid-keyboard-navigation.d.ts.map +1 -1
  37. package/calendar/grid/use-calendar-grid-keyboard-navigation.js +8 -5
  38. package/calendar/grid/use-calendar-grid-keyboard-navigation.js.map +1 -1
  39. package/calendar/interfaces.d.ts +9 -0
  40. package/calendar/interfaces.d.ts.map +1 -1
  41. package/calendar/interfaces.js.map +1 -1
  42. package/calendar/internal.d.ts +1 -1
  43. package/calendar/internal.d.ts.map +1 -1
  44. package/calendar/internal.js +7 -5
  45. package/calendar/internal.js.map +1 -1
  46. package/calendar/styles.css.js +21 -20
  47. package/calendar/styles.scoped.css +46 -42
  48. package/calendar/styles.selectors.js +21 -20
  49. package/calendar/utils/navigation.d.ts +10 -10
  50. package/calendar/utils/navigation.d.ts.map +1 -1
  51. package/calendar/utils/navigation.js +29 -29
  52. package/calendar/utils/navigation.js.map +1 -1
  53. package/column-layout/flexible-column-layout/index.d.ts +2 -2
  54. package/column-layout/flexible-column-layout/index.d.ts.map +1 -1
  55. package/column-layout/flexible-column-layout/index.js +3 -2
  56. package/column-layout/flexible-column-layout/index.js.map +1 -1
  57. package/column-layout/flexible-column-layout/styles.css.js +5 -5
  58. package/column-layout/flexible-column-layout/styles.scoped.css +99 -4
  59. package/column-layout/flexible-column-layout/styles.selectors.js +5 -5
  60. package/column-layout/grid-column-layout.d.ts +2 -2
  61. package/column-layout/grid-column-layout.d.ts.map +1 -1
  62. package/column-layout/grid-column-layout.js +2 -2
  63. package/column-layout/grid-column-layout.js.map +1 -1
  64. package/column-layout/interfaces.d.ts +4 -0
  65. package/column-layout/interfaces.d.ts.map +1 -1
  66. package/column-layout/interfaces.js.map +1 -1
  67. package/column-layout/internal.d.ts +1 -1
  68. package/column-layout/internal.d.ts.map +1 -1
  69. package/column-layout/internal.js +2 -2
  70. package/column-layout/internal.js.map +1 -1
  71. package/date-picker/index.d.ts.map +1 -1
  72. package/date-picker/index.js +2 -2
  73. package/date-picker/index.js.map +1 -1
  74. package/date-range-picker/calendar/grids/grid.d.ts +2 -1
  75. package/date-range-picker/calendar/grids/grid.d.ts.map +1 -1
  76. package/date-range-picker/calendar/grids/grid.js +55 -7
  77. package/date-range-picker/calendar/grids/grid.js.map +1 -1
  78. package/date-range-picker/calendar/grids/index.d.ts +2 -1
  79. package/date-range-picker/calendar/grids/index.d.ts.map +1 -1
  80. package/date-range-picker/calendar/grids/index.js +20 -12
  81. package/date-range-picker/calendar/grids/index.js.map +1 -1
  82. package/date-range-picker/calendar/grids/styles.css.js +28 -27
  83. package/date-range-picker/calendar/grids/styles.scoped.css +46 -42
  84. package/date-range-picker/calendar/grids/styles.selectors.js +28 -27
  85. package/date-range-picker/calendar/index.d.ts +2 -1
  86. package/date-range-picker/calendar/index.d.ts.map +1 -1
  87. package/date-range-picker/calendar/index.js +2 -2
  88. package/date-range-picker/calendar/index.js.map +1 -1
  89. package/date-range-picker/dropdown.d.ts +2 -2
  90. package/date-range-picker/dropdown.d.ts.map +1 -1
  91. package/date-range-picker/dropdown.js +2 -2
  92. package/date-range-picker/dropdown.js.map +1 -1
  93. package/date-range-picker/index.d.ts.map +1 -1
  94. package/date-range-picker/index.js +2 -2
  95. package/date-range-picker/index.js.map +1 -1
  96. package/date-range-picker/interfaces.d.ts +9 -0
  97. package/date-range-picker/interfaces.d.ts.map +1 -1
  98. package/date-range-picker/interfaces.js.map +1 -1
  99. package/grid/internal.d.ts +4 -0
  100. package/grid/internal.d.ts.map +1 -1
  101. package/grid/internal.js +3 -2
  102. package/grid/internal.js.map +1 -1
  103. package/index.d.ts +1 -0
  104. package/index.d.ts.map +1 -1
  105. package/index.js +1 -0
  106. package/index.js.map +1 -1
  107. package/internal/base-component/styles.scoped.css +12 -10
  108. package/internal/components/option/interfaces.d.ts +2 -0
  109. package/internal/components/option/interfaces.d.ts.map +1 -1
  110. package/internal/components/option/interfaces.js.map +1 -1
  111. package/internal/components/selectable-item/index.d.ts +1 -0
  112. package/internal/components/selectable-item/index.d.ts.map +1 -1
  113. package/internal/components/selectable-item/index.js +3 -0
  114. package/internal/components/selectable-item/index.js.map +1 -1
  115. package/internal/components/tooltip/index.d.ts +3 -1
  116. package/internal/components/tooltip/index.d.ts.map +1 -1
  117. package/internal/components/tooltip/index.js +3 -3
  118. package/internal/components/tooltip/index.js.map +1 -1
  119. package/internal/environment.js +1 -1
  120. package/internal/environment.json +1 -1
  121. package/internal/generated/styles/tokens.d.ts +2 -0
  122. package/internal/generated/styles/tokens.js +4 -2
  123. package/internal/generated/theming/index.cjs +78 -12
  124. package/internal/generated/theming/index.cjs.d.ts +16 -0
  125. package/internal/generated/theming/index.d.ts +16 -0
  126. package/internal/generated/theming/index.js +78 -12
  127. package/{button-dropdown/utils/use-hidden-description.d.ts → internal/hooks/use-hidden-description/index.d.ts} +2 -1
  128. package/internal/hooks/use-hidden-description/index.d.ts.map +1 -0
  129. package/{button-dropdown/utils/use-hidden-description.js → internal/hooks/use-hidden-description/index.js} +3 -2
  130. package/internal/hooks/use-hidden-description/index.js.map +1 -0
  131. package/internal/manifest.json +1 -1
  132. package/key-value-pairs/index.d.ts +5 -0
  133. package/key-value-pairs/index.d.ts.map +1 -0
  134. package/key-value-pairs/index.js +18 -0
  135. package/key-value-pairs/index.js.map +1 -0
  136. package/key-value-pairs/interfaces.d.ts +42 -0
  137. package/key-value-pairs/interfaces.d.ts.map +1 -0
  138. package/key-value-pairs/interfaces.js +2 -0
  139. package/key-value-pairs/interfaces.js.map +1 -0
  140. package/key-value-pairs/internal.d.ts +5 -0
  141. package/key-value-pairs/internal.d.ts.map +1 -0
  142. package/key-value-pairs/internal.js +41 -0
  143. package/key-value-pairs/internal.js.map +1 -0
  144. package/key-value-pairs/styles.css.js +13 -0
  145. package/key-value-pairs/styles.scoped.css +210 -0
  146. package/key-value-pairs/styles.selectors.js +14 -0
  147. package/package.json +2 -1
  148. package/segmented-control/interfaces.d.ts +2 -0
  149. package/segmented-control/interfaces.d.ts.map +1 -1
  150. package/segmented-control/interfaces.js.map +1 -1
  151. package/segmented-control/internal-segmented-control.d.ts.map +1 -1
  152. package/segmented-control/internal-segmented-control.js +11 -8
  153. package/segmented-control/internal-segmented-control.js.map +1 -1
  154. package/segmented-control/segment.d.ts.map +1 -1
  155. package/segmented-control/segment.js +14 -4
  156. package/segmented-control/segment.js.map +1 -1
  157. package/segmented-control/styles.css.js +15 -14
  158. package/segmented-control/styles.scoped.css +37 -33
  159. package/segmented-control/styles.selectors.js +15 -14
  160. package/select/interfaces.d.ts +1 -0
  161. package/select/interfaces.d.ts.map +1 -1
  162. package/select/interfaces.js.map +1 -1
  163. package/select/parts/filter.d.ts +1 -1
  164. package/select/parts/item.d.ts.map +1 -1
  165. package/select/parts/item.js +13 -3
  166. package/select/parts/item.js.map +1 -1
  167. package/select/parts/multiselect-item.d.ts.map +1 -1
  168. package/select/parts/multiselect-item.js +15 -3
  169. package/select/parts/multiselect-item.js.map +1 -1
  170. package/select/parts/styles.css.js +17 -16
  171. package/select/parts/styles.scoped.css +21 -17
  172. package/select/parts/styles.selectors.js +17 -16
  173. package/split-panel/icons/styles.css.js +22 -22
  174. package/split-panel/icons/styles.scoped.css +25 -25
  175. package/split-panel/icons/styles.selectors.js +22 -22
  176. package/table/body-cell/disabled-inline-editor.js +1 -1
  177. package/table/body-cell/disabled-inline-editor.js.map +1 -1
  178. package/tabs/interfaces.d.ts +5 -0
  179. package/tabs/interfaces.d.ts.map +1 -1
  180. package/tabs/interfaces.js.map +1 -1
  181. package/tabs/styles.css.js +28 -25
  182. package/tabs/styles.scoped.css +60 -49
  183. package/tabs/styles.selectors.js +28 -25
  184. package/tabs/tab-header-bar.d.ts.map +1 -1
  185. package/tabs/tab-header-bar.js +38 -14
  186. package/tabs/tab-header-bar.js.map +1 -1
  187. package/test-utils/dom/button/index.d.ts +1 -0
  188. package/test-utils/dom/button/index.js +6 -2
  189. package/test-utils/dom/button/index.js.map +1 -1
  190. package/test-utils/dom/button-dropdown/index.d.ts +2 -1
  191. package/test-utils/dom/button-dropdown/index.js +5 -1
  192. package/test-utils/dom/button-dropdown/index.js.map +1 -1
  193. package/test-utils/dom/calendar/index.d.ts +4 -1
  194. package/test-utils/dom/calendar/index.js +8 -1
  195. package/test-utils/dom/calendar/index.js.map +1 -1
  196. package/test-utils/dom/date-range-picker/index.d.ts +4 -1
  197. package/test-utils/dom/date-range-picker/index.js +8 -2
  198. package/test-utils/dom/date-range-picker/index.js.map +1 -1
  199. package/test-utils/dom/index.d.ts +3 -0
  200. package/test-utils/dom/index.js +10 -2
  201. package/test-utils/dom/index.js.map +1 -1
  202. package/test-utils/dom/internal/dropdown-host.js.map +1 -1
  203. package/test-utils/dom/internal/option.d.ts +1 -0
  204. package/test-utils/dom/internal/option.js +4 -0
  205. package/test-utils/dom/internal/option.js.map +1 -1
  206. package/test-utils/dom/key-value-pairs/index.d.ts +14 -0
  207. package/test-utils/dom/key-value-pairs/index.js +38 -0
  208. package/test-utils/dom/key-value-pairs/index.js.map +1 -0
  209. package/test-utils/dom/segmented-control/index.d.ts +9 -0
  210. package/test-utils/dom/segmented-control/index.js +15 -0
  211. package/test-utils/dom/segmented-control/index.js.map +1 -1
  212. package/test-utils/dom/tabs/index.d.ts +9 -2
  213. package/test-utils/dom/tabs/index.js +15 -2
  214. package/test-utils/dom/tabs/index.js.map +1 -1
  215. package/test-utils/selectors/button/index.d.ts +1 -0
  216. package/test-utils/selectors/button/index.js +6 -2
  217. package/test-utils/selectors/button/index.js.map +1 -1
  218. package/test-utils/selectors/button-dropdown/index.d.ts +2 -1
  219. package/test-utils/selectors/button-dropdown/index.js +5 -1
  220. package/test-utils/selectors/button-dropdown/index.js.map +1 -1
  221. package/test-utils/selectors/calendar/index.d.ts +4 -1
  222. package/test-utils/selectors/calendar/index.js +8 -1
  223. package/test-utils/selectors/calendar/index.js.map +1 -1
  224. package/test-utils/selectors/date-range-picker/index.d.ts +4 -1
  225. package/test-utils/selectors/date-range-picker/index.js +8 -2
  226. package/test-utils/selectors/date-range-picker/index.js.map +1 -1
  227. package/test-utils/selectors/index.d.ts +3 -0
  228. package/test-utils/selectors/index.js +10 -2
  229. package/test-utils/selectors/index.js.map +1 -1
  230. package/test-utils/selectors/internal/dropdown-host.js.map +1 -1
  231. package/test-utils/selectors/internal/option.d.ts +1 -0
  232. package/test-utils/selectors/internal/option.js +4 -0
  233. package/test-utils/selectors/internal/option.js.map +1 -1
  234. package/test-utils/selectors/key-value-pairs/index.d.ts +14 -0
  235. package/test-utils/selectors/key-value-pairs/index.js +38 -0
  236. package/test-utils/selectors/key-value-pairs/index.js.map +1 -0
  237. package/test-utils/selectors/segmented-control/index.d.ts +9 -0
  238. package/test-utils/selectors/segmented-control/index.js +15 -0
  239. package/test-utils/selectors/segmented-control/index.js.map +1 -1
  240. package/test-utils/selectors/tabs/index.d.ts +9 -2
  241. package/test-utils/selectors/tabs/index.js +15 -2
  242. package/test-utils/selectors/tabs/index.js.map +1 -1
  243. package/test-utils/tsconfig.tsbuildinfo +1 -1
  244. package/button-dropdown/utils/use-hidden-description.d.ts.map +0 -1
  245. package/button-dropdown/utils/use-hidden-description.js.map +0 -1
@@ -6,18 +6,113 @@
6
6
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
7
7
  SPDX-License-Identifier: Apache-2.0
8
8
  */
9
- .awsui_css-grid_zqq3x_19h7g_9:not(#\9) {
9
+ /*
10
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
11
+ SPDX-License-Identifier: Apache-2.0
12
+ */
13
+ /*
14
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
15
+ SPDX-License-Identifier: Apache-2.0
16
+ */
17
+ /*
18
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
19
+ SPDX-License-Identifier: Apache-2.0
20
+ */
21
+ /*
22
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
23
+ SPDX-License-Identifier: Apache-2.0
24
+ */
25
+ /*
26
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
27
+ SPDX-License-Identifier: Apache-2.0
28
+ */
29
+ /*
30
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
31
+ SPDX-License-Identifier: Apache-2.0
32
+ */
33
+ /*
34
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
35
+ SPDX-License-Identifier: Apache-2.0
36
+ */
37
+ /*
38
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
39
+ SPDX-License-Identifier: Apache-2.0
40
+ */
41
+ /*
42
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
43
+ SPDX-License-Identifier: Apache-2.0
44
+ */
45
+ /*
46
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
47
+ SPDX-License-Identifier: Apache-2.0
48
+ */
49
+ /*
50
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
51
+ SPDX-License-Identifier: Apache-2.0
52
+ */
53
+ /*
54
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
55
+ SPDX-License-Identifier: Apache-2.0
56
+ */
57
+ /*
58
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
59
+ SPDX-License-Identifier: Apache-2.0
60
+ */
61
+ /*
62
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
63
+ SPDX-License-Identifier: Apache-2.0
64
+ */
65
+ /*
66
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
67
+ SPDX-License-Identifier: Apache-2.0
68
+ */
69
+ /* stylelint-disable @cloudscape-design/no-motion-outside-of-mixin, selector-combinator-disallowed-list, selector-pseudo-class-no-unknown, selector-class-pattern */
70
+ /* stylelint-enable @cloudscape-design/no-motion-outside-of-mixin, selector-combinator-disallowed-list, selector-pseudo-class-no-unknown, selector-class-pattern */
71
+ /*
72
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
73
+ SPDX-License-Identifier: Apache-2.0
74
+ */
75
+ /*
76
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
77
+ SPDX-License-Identifier: Apache-2.0
78
+ */
79
+ /*
80
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
81
+ SPDX-License-Identifier: Apache-2.0
82
+ */
83
+ /*
84
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
85
+ SPDX-License-Identifier: Apache-2.0
86
+ */
87
+ /* Style used for links in slots/components that are text heavy, to help links stand out among
88
+ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
89
+ /*
90
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
91
+ SPDX-License-Identifier: Apache-2.0
92
+ */
93
+ /*
94
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
95
+ SPDX-License-Identifier: Apache-2.0
96
+ */
97
+ dl.awsui_css-grid_zqq3x_kjrw2_97:not(#\9) {
98
+ margin-block-start: 0;
99
+ margin-block-end: 0;
100
+ margin-inline-start: 0;
101
+ margin-inline-end: 0;
102
+ }
103
+
104
+ .awsui_css-grid_zqq3x_kjrw2_97:not(#\9) {
10
105
  display: grid;
11
106
  gap: var(--space-grid-gutter-ieqn7e, 20px);
12
107
  }
13
- .awsui_css-grid_zqq3x_19h7g_9.awsui_grid-no-gutters_zqq3x_19h7g_13:not(#\9) {
108
+ .awsui_css-grid_zqq3x_kjrw2_97.awsui_grid-no-gutters_zqq3x_kjrw2_108:not(#\9) {
14
109
  gap: 0;
15
110
  }
16
- .awsui_css-grid_zqq3x_19h7g_9.awsui_grid-variant-text-grid_zqq3x_19h7g_16 > .awsui_item_zqq3x_19h7g_16:not(#\9) {
111
+ .awsui_css-grid_zqq3x_kjrw2_97.awsui_grid-variant-text-grid_zqq3x_kjrw2_111 > .awsui_item_zqq3x_kjrw2_111:not(#\9) {
17
112
  border-inline-start: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-divider-default-j74lyz, #b6bec9);
18
113
  padding-inline: var(--space-grid-gutter-ieqn7e, 20px);
19
114
  }
20
- .awsui_css-grid_zqq3x_19h7g_9.awsui_grid-variant-text-grid_zqq3x_19h7g_16 > .awsui_item_zqq3x_19h7g_16.awsui_first-column_zqq3x_19h7g_20:not(#\9) {
115
+ .awsui_css-grid_zqq3x_kjrw2_97.awsui_grid-variant-text-grid_zqq3x_kjrw2_111 > .awsui_item_zqq3x_kjrw2_111.awsui_first-column_zqq3x_kjrw2_115:not(#\9) {
21
116
  border-inline-start: 0;
22
117
  padding-inline-start: 0;
23
118
  }
@@ -2,10 +2,10 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "css-grid": "awsui_css-grid_zqq3x_19h7g_9",
6
- "grid-no-gutters": "awsui_grid-no-gutters_zqq3x_19h7g_13",
7
- "grid-variant-text-grid": "awsui_grid-variant-text-grid_zqq3x_19h7g_16",
8
- "item": "awsui_item_zqq3x_19h7g_16",
9
- "first-column": "awsui_first-column_zqq3x_19h7g_20"
5
+ "css-grid": "awsui_css-grid_zqq3x_kjrw2_97",
6
+ "grid-no-gutters": "awsui_grid-no-gutters_zqq3x_kjrw2_108",
7
+ "grid-variant-text-grid": "awsui_grid-variant-text-grid_zqq3x_kjrw2_111",
8
+ "item": "awsui_item_zqq3x_kjrw2_111",
9
+ "first-column": "awsui_first-column_zqq3x_kjrw2_115"
10
10
  };
11
11
 
@@ -1,10 +1,10 @@
1
1
  import React from 'react';
2
2
  import { InternalColumnLayoutProps } from './interfaces';
3
3
  import { ColumnLayoutBreakpoint } from './internal';
4
- interface GridColumnLayoutProps extends Required<Pick<InternalColumnLayoutProps, 'columns' | 'variant' | 'borders' | 'disableGutters'>> {
4
+ interface GridColumnLayoutProps extends Required<Pick<InternalColumnLayoutProps, 'columns' | 'variant' | 'borders' | 'disableGutters'>>, Pick<InternalColumnLayoutProps, '__tagOverride'> {
5
5
  children: React.ReactNode;
6
6
  __breakpoint?: ColumnLayoutBreakpoint;
7
7
  }
8
- export default function GridColumnLayout({ columns, variant, borders, disableGutters, __breakpoint, children, }: GridColumnLayoutProps): JSX.Element;
8
+ export default function GridColumnLayout({ columns, variant, borders, disableGutters, __breakpoint, children, __tagOverride, }: GridColumnLayoutProps): JSX.Element;
9
9
  export {};
10
10
  //# sourceMappingURL=grid-column-layout.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"grid-column-layout.d.ts","sourceRoot":"","sources":["../../../src/column-layout/grid-column-layout.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,EAAE,yBAAyB,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,EAAmB,sBAAsB,EAAE,MAAM,YAAY,CAAC;AAUrE,UAAU,qBACR,SAAQ,QAAQ,CAAC,IAAI,CAAC,yBAAyB,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,gBAAgB,CAAC,CAAC;IACvG,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,YAAY,CAAC,EAAE,sBAAsB,CAAC;CACvC;AAED,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,OAAO,EACP,OAAO,EACP,OAAO,EACP,cAAc,EACd,YAAY,EACZ,QAAQ,GACT,EAAE,qBAAqB,eA2BvB"}
1
+ {"version":3,"file":"grid-column-layout.d.ts","sourceRoot":"","sources":["../../../src/column-layout/grid-column-layout.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,EAAE,yBAAyB,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,EAAmB,sBAAsB,EAAE,MAAM,YAAY,CAAC;AAUrE,UAAU,qBACR,SAAQ,QAAQ,CAAC,IAAI,CAAC,yBAAyB,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,gBAAgB,CAAC,CAAC,EACrG,IAAI,CAAC,yBAAyB,EAAE,eAAe,CAAC;IAClD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,YAAY,CAAC,EAAE,sBAAsB,CAAC;CACvC;AAED,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,OAAO,EACP,OAAO,EACP,OAAO,EACP,cAAc,EACd,YAAY,EACZ,QAAQ,EACR,aAAa,GACd,EAAE,qBAAqB,eA4BvB"}
@@ -14,7 +14,7 @@ const COLUMN_DEFS = {
14
14
  3: { colspan: { default: 12, xxs: 6, xs: 4 } },
15
15
  4: { colspan: { default: 12, xxs: 6, xs: 3 } },
16
16
  };
17
- export default function GridColumnLayout({ columns, variant, borders, disableGutters, __breakpoint, children, }) {
17
+ export default function GridColumnLayout({ columns, variant, borders, disableGutters, __breakpoint, children, __tagOverride, }) {
18
18
  var _a;
19
19
  const isTextGridVariant = variant === 'text-grid';
20
20
  const shouldDisableGutters = !isTextGridVariant && disableGutters;
@@ -27,6 +27,6 @@ export default function GridColumnLayout({ columns, variant, borders, disableGut
27
27
  [styles['grid-horizontal-borders']]: shouldHaveHorizontalBorders,
28
28
  [styles['grid-vertical-borders']]: shouldHaveVerticalBorders,
29
29
  [styles['grid-no-gutters']]: shouldDisableGutters,
30
- }), __breakpoint: __breakpoint || breakpoint, __responsiveClassName: breakpoint => breakpoint && styles[`grid-breakpoint-${breakpoint}`] }, children));
30
+ }), __breakpoint: __breakpoint || breakpoint, __responsiveClassName: breakpoint => breakpoint && styles[`grid-breakpoint-${breakpoint}`], __tagOverride: __tagOverride }, children));
31
31
  }
32
32
  //# sourceMappingURL=grid-column-layout.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"grid-column-layout.js","sourceRoot":"","sources":["../../../src/column-layout/grid-column-layout.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,eAAe,MAAM,8BAA8B,CAAC;AAC3D,OAAO,YAAY,MAAM,kBAAkB,CAAC;AAE5C,OAAO,EAAE,uBAAuB,EAAE,MAAM,qCAAqC,CAAC;AAC9E,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAEhC,OAAO,EAAE,eAAe,EAA0B,MAAM,YAAY,CAAC;AACrE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,MAAM,WAAW,GAA4D;IAC3E,CAAC,EAAE,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE;IAChD,CAAC,EAAE,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE;IAC9C,CAAC,EAAE,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE;IAC9C,CAAC,EAAE,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE;CAC/C,CAAC;AAQF,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,OAAO,EACP,OAAO,EACP,OAAO,EACP,cAAc,EACd,YAAY,EACZ,QAAQ,GACc;;IACtB,MAAM,iBAAiB,GAAG,OAAO,KAAK,WAAW,CAAC;IAClD,MAAM,oBAAoB,GAAG,CAAC,iBAAiB,IAAI,cAAc,CAAC;IAClE,MAAM,2BAA2B,GAAG,CAAC,iBAAiB,IAAI,CAAC,OAAO,KAAK,YAAY,IAAI,OAAO,KAAK,KAAK,CAAC,CAAC;IAC1G,MAAM,yBAAyB,GAAG,CAAC,iBAAiB,IAAI,CAAC,OAAO,KAAK,UAAU,IAAI,OAAO,KAAK,KAAK,CAAC,CAAC;IAEtG,wFAAwF;IACxF,MAAM,iBAAiB,GAAG,eAAe,CAAC,QAAQ,CAAC,CAAC;IAEpD,MAAM,CAAC,UAAU,EAAE,GAAG,CAAC,GAAG,uBAAuB,CAAC,eAAe,CAAC,CAAC;IAEnE,OAAO,CACL,oBAAC,YAAY,IACX,GAAG,EAAE,GAAG,EACR,cAAc,EAAE,IAAI,EACpB,cAAc,EAAE,MAAM,CAAC,MAAA,WAAW,CAAC,OAAO,CAAC,mCAAI,EAAE,EAAE,iBAAiB,CAAC,MAAM,CAAC,EAC5E,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,gBAAgB,OAAO,EAAE,CAAC,EAAE,MAAM,CAAC,gBAAgB,OAAO,EAAE,CAAC,EAAE;YACjG,CAAC,MAAM,CAAC,yBAAyB,CAAC,CAAC,EAAE,2BAA2B;YAChE,CAAC,MAAM,CAAC,uBAAuB,CAAC,CAAC,EAAE,yBAAyB;YAC5D,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAC,EAAE,oBAAoB;SAClD,CAAC,EACF,YAAY,EAAE,YAAY,IAAI,UAAU,EACxC,qBAAqB,EAAE,UAAU,CAAC,EAAE,CAAC,UAAU,IAAI,MAAM,CAAC,mBAAmB,UAAU,EAAE,CAAC,IAEzF,QAAQ,CACI,CAChB,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\nimport flattenChildren from 'react-keyed-flatten-children';\nimport InternalGrid from '../grid/internal';\nimport { GridProps } from '../grid/interfaces';\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport { repeat } from './util';\nimport { InternalColumnLayoutProps } from './interfaces';\nimport { COLUMN_TRIGGERS, ColumnLayoutBreakpoint } from './internal';\nimport styles from './styles.css.js';\n\nconst COLUMN_DEFS: Record<number, GridProps.ElementDefinition | undefined> = {\n 1: { colspan: { default: 12, xxs: 12, xs: 12 } },\n 2: { colspan: { default: 12, xxs: 6, xs: 6 } },\n 3: { colspan: { default: 12, xxs: 6, xs: 4 } },\n 4: { colspan: { default: 12, xxs: 6, xs: 3 } },\n};\n\ninterface GridColumnLayoutProps\n extends Required<Pick<InternalColumnLayoutProps, 'columns' | 'variant' | 'borders' | 'disableGutters'>> {\n children: React.ReactNode;\n __breakpoint?: ColumnLayoutBreakpoint;\n}\n\nexport default function GridColumnLayout({\n columns,\n variant,\n borders,\n disableGutters,\n __breakpoint,\n children,\n}: GridColumnLayoutProps) {\n const isTextGridVariant = variant === 'text-grid';\n const shouldDisableGutters = !isTextGridVariant && disableGutters;\n const shouldHaveHorizontalBorders = !isTextGridVariant && (borders === 'horizontal' || borders === 'all');\n const shouldHaveVerticalBorders = !isTextGridVariant && (borders === 'vertical' || borders === 'all');\n\n // Flattening the children allows us to \"see through\" React Fragments and nested arrays.\n const flattenedChildren = flattenChildren(children);\n\n const [breakpoint, ref] = useContainerBreakpoints(COLUMN_TRIGGERS);\n\n return (\n <InternalGrid\n ref={ref}\n disableGutters={true}\n gridDefinition={repeat(COLUMN_DEFS[columns] ?? {}, flattenedChildren.length)}\n className={clsx(styles.grid, styles[`grid-columns-${columns}`], styles[`grid-variant-${variant}`], {\n [styles['grid-horizontal-borders']]: shouldHaveHorizontalBorders,\n [styles['grid-vertical-borders']]: shouldHaveVerticalBorders,\n [styles['grid-no-gutters']]: shouldDisableGutters,\n })}\n __breakpoint={__breakpoint || breakpoint}\n __responsiveClassName={breakpoint => breakpoint && styles[`grid-breakpoint-${breakpoint}`]}\n >\n {children}\n </InternalGrid>\n );\n}\n"]}
1
+ {"version":3,"file":"grid-column-layout.js","sourceRoot":"","sources":["../../../src/column-layout/grid-column-layout.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,eAAe,MAAM,8BAA8B,CAAC;AAC3D,OAAO,YAAY,MAAM,kBAAkB,CAAC;AAE5C,OAAO,EAAE,uBAAuB,EAAE,MAAM,qCAAqC,CAAC;AAC9E,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAEhC,OAAO,EAAE,eAAe,EAA0B,MAAM,YAAY,CAAC;AACrE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,MAAM,WAAW,GAA4D;IAC3E,CAAC,EAAE,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE;IAChD,CAAC,EAAE,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE;IAC9C,CAAC,EAAE,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE;IAC9C,CAAC,EAAE,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE;CAC/C,CAAC;AASF,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,OAAO,EACP,OAAO,EACP,OAAO,EACP,cAAc,EACd,YAAY,EACZ,QAAQ,EACR,aAAa,GACS;;IACtB,MAAM,iBAAiB,GAAG,OAAO,KAAK,WAAW,CAAC;IAClD,MAAM,oBAAoB,GAAG,CAAC,iBAAiB,IAAI,cAAc,CAAC;IAClE,MAAM,2BAA2B,GAAG,CAAC,iBAAiB,IAAI,CAAC,OAAO,KAAK,YAAY,IAAI,OAAO,KAAK,KAAK,CAAC,CAAC;IAC1G,MAAM,yBAAyB,GAAG,CAAC,iBAAiB,IAAI,CAAC,OAAO,KAAK,UAAU,IAAI,OAAO,KAAK,KAAK,CAAC,CAAC;IAEtG,wFAAwF;IACxF,MAAM,iBAAiB,GAAG,eAAe,CAAC,QAAQ,CAAC,CAAC;IAEpD,MAAM,CAAC,UAAU,EAAE,GAAG,CAAC,GAAG,uBAAuB,CAAC,eAAe,CAAC,CAAC;IAEnE,OAAO,CACL,oBAAC,YAAY,IACX,GAAG,EAAE,GAAG,EACR,cAAc,EAAE,IAAI,EACpB,cAAc,EAAE,MAAM,CAAC,MAAA,WAAW,CAAC,OAAO,CAAC,mCAAI,EAAE,EAAE,iBAAiB,CAAC,MAAM,CAAC,EAC5E,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,gBAAgB,OAAO,EAAE,CAAC,EAAE,MAAM,CAAC,gBAAgB,OAAO,EAAE,CAAC,EAAE;YACjG,CAAC,MAAM,CAAC,yBAAyB,CAAC,CAAC,EAAE,2BAA2B;YAChE,CAAC,MAAM,CAAC,uBAAuB,CAAC,CAAC,EAAE,yBAAyB;YAC5D,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAC,EAAE,oBAAoB;SAClD,CAAC,EACF,YAAY,EAAE,YAAY,IAAI,UAAU,EACxC,qBAAqB,EAAE,UAAU,CAAC,EAAE,CAAC,UAAU,IAAI,MAAM,CAAC,mBAAmB,UAAU,EAAE,CAAC,EAC1F,aAAa,EAAE,aAAa,IAE3B,QAAQ,CACI,CAChB,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\nimport flattenChildren from 'react-keyed-flatten-children';\nimport InternalGrid from '../grid/internal';\nimport { GridProps } from '../grid/interfaces';\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport { repeat } from './util';\nimport { InternalColumnLayoutProps } from './interfaces';\nimport { COLUMN_TRIGGERS, ColumnLayoutBreakpoint } from './internal';\nimport styles from './styles.css.js';\n\nconst COLUMN_DEFS: Record<number, GridProps.ElementDefinition | undefined> = {\n 1: { colspan: { default: 12, xxs: 12, xs: 12 } },\n 2: { colspan: { default: 12, xxs: 6, xs: 6 } },\n 3: { colspan: { default: 12, xxs: 6, xs: 4 } },\n 4: { colspan: { default: 12, xxs: 6, xs: 3 } },\n};\n\ninterface GridColumnLayoutProps\n extends Required<Pick<InternalColumnLayoutProps, 'columns' | 'variant' | 'borders' | 'disableGutters'>>,\n Pick<InternalColumnLayoutProps, '__tagOverride'> {\n children: React.ReactNode;\n __breakpoint?: ColumnLayoutBreakpoint;\n}\n\nexport default function GridColumnLayout({\n columns,\n variant,\n borders,\n disableGutters,\n __breakpoint,\n children,\n __tagOverride,\n}: GridColumnLayoutProps) {\n const isTextGridVariant = variant === 'text-grid';\n const shouldDisableGutters = !isTextGridVariant && disableGutters;\n const shouldHaveHorizontalBorders = !isTextGridVariant && (borders === 'horizontal' || borders === 'all');\n const shouldHaveVerticalBorders = !isTextGridVariant && (borders === 'vertical' || borders === 'all');\n\n // Flattening the children allows us to \"see through\" React Fragments and nested arrays.\n const flattenedChildren = flattenChildren(children);\n\n const [breakpoint, ref] = useContainerBreakpoints(COLUMN_TRIGGERS);\n\n return (\n <InternalGrid\n ref={ref}\n disableGutters={true}\n gridDefinition={repeat(COLUMN_DEFS[columns] ?? {}, flattenedChildren.length)}\n className={clsx(styles.grid, styles[`grid-columns-${columns}`], styles[`grid-variant-${variant}`], {\n [styles['grid-horizontal-borders']]: shouldHaveHorizontalBorders,\n [styles['grid-vertical-borders']]: shouldHaveVerticalBorders,\n [styles['grid-no-gutters']]: shouldDisableGutters,\n })}\n __breakpoint={__breakpoint || breakpoint}\n __responsiveClassName={breakpoint => breakpoint && styles[`grid-breakpoint-${breakpoint}`]}\n __tagOverride={__tagOverride}\n >\n {children}\n </InternalGrid>\n );\n}\n"]}
@@ -40,5 +40,9 @@ export declare namespace ColumnLayoutProps {
40
40
  }
41
41
  export interface InternalColumnLayoutProps extends ColumnLayoutProps, InternalBaseComponentProps {
42
42
  __breakpoint?: ColumnLayoutBreakpoint;
43
+ /**
44
+ * Overrides the default wrapper HTML tag.
45
+ */
46
+ __tagOverride?: 'dl';
43
47
  }
44
48
  //# sourceMappingURL=interfaces.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/column-layout/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAClF,OAAO,EAAE,sBAAsB,EAAE,MAAM,YAAY,CAAC;AAEpD,MAAM,WAAW,iBAAkB,SAAQ,kBAAkB;IAC3D;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,OAAO,CAAC;IAEpC;;;;OAIG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,OAAO,CAAC;IAEpC;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;;;OAKG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,yBAAiB,iBAAiB,CAAC;IACjC,KAAY,OAAO,GAAG,SAAS,GAAG,WAAW,CAAC;IAC9C,KAAY,OAAO,GAAG,MAAM,GAAG,UAAU,GAAG,YAAY,GAAG,KAAK,CAAC;CAClE;AAED,MAAM,WAAW,yBAA0B,SAAQ,iBAAiB,EAAE,0BAA0B;IAC9F,YAAY,CAAC,EAAE,sBAAsB,CAAC;CACvC"}
1
+ {"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/column-layout/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAClF,OAAO,EAAE,sBAAsB,EAAE,MAAM,YAAY,CAAC;AAEpD,MAAM,WAAW,iBAAkB,SAAQ,kBAAkB;IAC3D;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,OAAO,CAAC;IAEpC;;;;OAIG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,OAAO,CAAC;IAEpC;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;;;OAKG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,yBAAiB,iBAAiB,CAAC;IACjC,KAAY,OAAO,GAAG,SAAS,GAAG,WAAW,CAAC;IAC9C,KAAY,OAAO,GAAG,MAAM,GAAG,UAAU,GAAG,YAAY,GAAG,KAAK,CAAC;CAClE;AAED,MAAM,WAAW,yBAA0B,SAAQ,iBAAiB,EAAE,0BAA0B;IAC9F,YAAY,CAAC,EAAE,sBAAsB,CAAC;IACtC;;OAEG;IACH,aAAa,CAAC,EAAE,IAAI,CAAC;CACtB"}
@@ -1 +1 @@
1
- {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/column-layout/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\nimport React from 'react';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { ColumnLayoutBreakpoint } from './internal';\n\nexport interface ColumnLayoutProps extends BaseComponentProps {\n /**\n * Specifies the number of columns in each grid row.\n * When `minColumnWidth` is not set, only up to 4 columns are supported.\n */\n columns?: number;\n\n /**\n * Specifies the content type. This determines the spacing of the grid.\n */\n variant?: ColumnLayoutProps.Variant;\n\n /**\n * Controls whether dividers are placed between rows and columns.\n *\n * Note: This is not supported when used with `minColumnWidth`.\n */\n borders?: ColumnLayoutProps.Borders;\n\n /**\n * Determines whether the default gutters between columns are removed.\n */\n disableGutters?: boolean;\n\n /**\n * Use together with `columns` to specify the desired minimum width for each column in pixels.\n *\n * The number of columns is determined by the value of this property, the available space,\n * and the maximum number of columns as defined by the `columns` property.\n */\n minColumnWidth?: number;\n\n /**\n * The columns to render.\n */\n children?: React.ReactNode;\n}\n\nexport namespace ColumnLayoutProps {\n export type Variant = 'default' | 'text-grid';\n export type Borders = 'none' | 'vertical' | 'horizontal' | 'all';\n}\n\nexport interface InternalColumnLayoutProps extends ColumnLayoutProps, InternalBaseComponentProps {\n __breakpoint?: ColumnLayoutBreakpoint;\n}\n"]}
1
+ {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/column-layout/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\nimport React from 'react';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { ColumnLayoutBreakpoint } from './internal';\n\nexport interface ColumnLayoutProps extends BaseComponentProps {\n /**\n * Specifies the number of columns in each grid row.\n * When `minColumnWidth` is not set, only up to 4 columns are supported.\n */\n columns?: number;\n\n /**\n * Specifies the content type. This determines the spacing of the grid.\n */\n variant?: ColumnLayoutProps.Variant;\n\n /**\n * Controls whether dividers are placed between rows and columns.\n *\n * Note: This is not supported when used with `minColumnWidth`.\n */\n borders?: ColumnLayoutProps.Borders;\n\n /**\n * Determines whether the default gutters between columns are removed.\n */\n disableGutters?: boolean;\n\n /**\n * Use together with `columns` to specify the desired minimum width for each column in pixels.\n *\n * The number of columns is determined by the value of this property, the available space,\n * and the maximum number of columns as defined by the `columns` property.\n */\n minColumnWidth?: number;\n\n /**\n * The columns to render.\n */\n children?: React.ReactNode;\n}\n\nexport namespace ColumnLayoutProps {\n export type Variant = 'default' | 'text-grid';\n export type Borders = 'none' | 'vertical' | 'horizontal' | 'all';\n}\n\nexport interface InternalColumnLayoutProps extends ColumnLayoutProps, InternalBaseComponentProps {\n __breakpoint?: ColumnLayoutBreakpoint;\n /**\n * Overrides the default wrapper HTML tag.\n */\n __tagOverride?: 'dl';\n}\n"]}
@@ -5,5 +5,5 @@ export type ColumnLayoutBreakpoint = (typeof COLUMN_TRIGGERS)[number] | null;
5
5
  /**
6
6
  * A responsive grid layout.
7
7
  */
8
- export default function ColumnLayout({ columns, variant, borders, disableGutters, minColumnWidth, children, __breakpoint, __internalRootRef, ...restProps }: InternalColumnLayoutProps): JSX.Element;
8
+ export default function ColumnLayout({ columns, variant, borders, disableGutters, minColumnWidth, children, __tagOverride, __breakpoint, __internalRootRef, ...restProps }: InternalColumnLayoutProps): JSX.Element;
9
9
  //# sourceMappingURL=internal.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/column-layout/internal.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,yBAAyB,EAAE,MAAM,cAAc,CAAC;AAKzD,eAAO,MAAM,eAAe,mCAAoC,CAAC;AACjE,MAAM,MAAM,sBAAsB,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC;AAE7E;;GAEG;AACH,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,OAAW,EACX,OAAmB,EACnB,OAAgB,EAChB,cAAsB,EACtB,cAAc,EACd,QAAQ,EACR,YAAY,EACZ,iBAAiB,EACjB,GAAG,SAAS,EACb,EAAE,yBAAyB,eA4B3B"}
1
+ {"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/column-layout/internal.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,yBAAyB,EAAE,MAAM,cAAc,CAAC;AAKzD,eAAO,MAAM,eAAe,mCAAoC,CAAC;AACjE,MAAM,MAAM,sBAAsB,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC;AAE7E;;GAEG;AACH,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,OAAW,EACX,OAAmB,EACnB,OAAgB,EAChB,cAAsB,EACtB,cAAc,EACd,QAAQ,EACR,aAAa,EACb,YAAY,EACZ,iBAAiB,EACjB,GAAG,SAAS,EACb,EAAE,yBAAyB,eA8B3B"}
@@ -12,8 +12,8 @@ export const COLUMN_TRIGGERS = ['default', 'xxs', 'xs'];
12
12
  * A responsive grid layout.
13
13
  */
14
14
  export default function ColumnLayout(_a) {
15
- var { columns = 1, variant = 'default', borders = 'none', disableGutters = false, minColumnWidth, children, __breakpoint, __internalRootRef } = _a, restProps = __rest(_a, ["columns", "variant", "borders", "disableGutters", "minColumnWidth", "children", "__breakpoint", "__internalRootRef"]);
15
+ var { columns = 1, variant = 'default', borders = 'none', disableGutters = false, minColumnWidth, children, __tagOverride, __breakpoint, __internalRootRef } = _a, restProps = __rest(_a, ["columns", "variant", "borders", "disableGutters", "minColumnWidth", "children", "__tagOverride", "__breakpoint", "__internalRootRef"]);
16
16
  const baseProps = getBaseProps(restProps);
17
- return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles['column-layout']), ref: __internalRootRef }), minColumnWidth ? (React.createElement(FlexibleColumnLayout, { columns: columns, borders: borders, variant: variant, minColumnWidth: minColumnWidth, disableGutters: disableGutters }, children)) : (React.createElement(GridColumnLayout, { columns: columns, variant: variant, borders: borders, disableGutters: disableGutters, __breakpoint: __breakpoint }, children))));
17
+ return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles['column-layout']), ref: __internalRootRef }), minColumnWidth ? (React.createElement(FlexibleColumnLayout, { columns: columns, borders: borders, variant: variant, minColumnWidth: minColumnWidth, disableGutters: disableGutters, __tagOverride: __tagOverride }, children)) : (React.createElement(GridColumnLayout, { columns: columns, variant: variant, borders: borders, disableGutters: disableGutters, __breakpoint: __breakpoint, __tagOverride: __tagOverride }, children))));
18
18
  }
19
19
  //# sourceMappingURL=internal.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/column-layout/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D,OAAO,oBAAoB,MAAM,0BAA0B,CAAC;AAC5D,OAAO,gBAAgB,MAAM,sBAAsB,CAAC;AACpD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,SAAS,EAAE,KAAK,EAAE,IAAI,CAAU,CAAC;AAGjE;;GAEG;AACH,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EAUT;QAVS,EACnC,OAAO,GAAG,CAAC,EACX,OAAO,GAAG,SAAS,EACnB,OAAO,GAAG,MAAM,EAChB,cAAc,GAAG,KAAK,EACtB,cAAc,EACd,QAAQ,EACR,YAAY,EACZ,iBAAiB,OAES,EADvB,SAAS,cATuB,sHAUpC,CADa;IAEZ,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAE1C,OAAO,CACL,6CAAS,SAAS,IAAE,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,GAAG,EAAE,iBAAiB,KACtG,cAAc,CAAC,CAAC,CAAC,CAChB,oBAAC,oBAAoB,IACnB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,cAAc,EAC9B,cAAc,EAAE,cAAc,IAE7B,QAAQ,CACY,CACxB,CAAC,CAAC,CAAC,CACF,oBAAC,gBAAgB,IACf,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,cAAc,EAC9B,YAAY,EAAE,YAAY,IAEzB,QAAQ,CACQ,CACpB,CACG,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\nimport { getBaseProps } from '../internal/base-component';\nimport { InternalColumnLayoutProps } from './interfaces';\nimport FlexibleColumnLayout from './flexible-column-layout';\nimport GridColumnLayout from './grid-column-layout';\nimport styles from './styles.css.js';\n\nexport const COLUMN_TRIGGERS = ['default', 'xxs', 'xs'] as const;\nexport type ColumnLayoutBreakpoint = (typeof COLUMN_TRIGGERS)[number] | null;\n\n/**\n * A responsive grid layout.\n */\nexport default function ColumnLayout({\n columns = 1,\n variant = 'default',\n borders = 'none',\n disableGutters = false,\n minColumnWidth,\n children,\n __breakpoint,\n __internalRootRef,\n ...restProps\n}: InternalColumnLayoutProps) {\n const baseProps = getBaseProps(restProps);\n\n return (\n <div {...baseProps} className={clsx(baseProps.className, styles['column-layout'])} ref={__internalRootRef}>\n {minColumnWidth ? (\n <FlexibleColumnLayout\n columns={columns}\n borders={borders}\n variant={variant}\n minColumnWidth={minColumnWidth}\n disableGutters={disableGutters}\n >\n {children}\n </FlexibleColumnLayout>\n ) : (\n <GridColumnLayout\n columns={columns}\n variant={variant}\n borders={borders}\n disableGutters={disableGutters}\n __breakpoint={__breakpoint}\n >\n {children}\n </GridColumnLayout>\n )}\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/column-layout/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D,OAAO,oBAAoB,MAAM,0BAA0B,CAAC;AAC5D,OAAO,gBAAgB,MAAM,sBAAsB,CAAC;AACpD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,SAAS,EAAE,KAAK,EAAE,IAAI,CAAU,CAAC;AAGjE;;GAEG;AACH,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EAWT;QAXS,EACnC,OAAO,GAAG,CAAC,EACX,OAAO,GAAG,SAAS,EACnB,OAAO,GAAG,MAAM,EAChB,cAAc,GAAG,KAAK,EACtB,cAAc,EACd,QAAQ,EACR,aAAa,EACb,YAAY,EACZ,iBAAiB,OAES,EADvB,SAAS,cAVuB,uIAWpC,CADa;IAEZ,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAE1C,OAAO,CACL,6CAAS,SAAS,IAAE,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,GAAG,EAAE,iBAAiB,KACtG,cAAc,CAAC,CAAC,CAAC,CAChB,oBAAC,oBAAoB,IACnB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,cAAc,EAC9B,cAAc,EAAE,cAAc,EAC9B,aAAa,EAAE,aAAa,IAE3B,QAAQ,CACY,CACxB,CAAC,CAAC,CAAC,CACF,oBAAC,gBAAgB,IACf,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,cAAc,EAC9B,YAAY,EAAE,YAAY,EAC1B,aAAa,EAAE,aAAa,IAE3B,QAAQ,CACQ,CACpB,CACG,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\nimport { getBaseProps } from '../internal/base-component';\nimport { InternalColumnLayoutProps } from './interfaces';\nimport FlexibleColumnLayout from './flexible-column-layout';\nimport GridColumnLayout from './grid-column-layout';\nimport styles from './styles.css.js';\n\nexport const COLUMN_TRIGGERS = ['default', 'xxs', 'xs'] as const;\nexport type ColumnLayoutBreakpoint = (typeof COLUMN_TRIGGERS)[number] | null;\n\n/**\n * A responsive grid layout.\n */\nexport default function ColumnLayout({\n columns = 1,\n variant = 'default',\n borders = 'none',\n disableGutters = false,\n minColumnWidth,\n children,\n __tagOverride,\n __breakpoint,\n __internalRootRef,\n ...restProps\n}: InternalColumnLayoutProps) {\n const baseProps = getBaseProps(restProps);\n\n return (\n <div {...baseProps} className={clsx(baseProps.className, styles['column-layout'])} ref={__internalRootRef}>\n {minColumnWidth ? (\n <FlexibleColumnLayout\n columns={columns}\n borders={borders}\n variant={variant}\n minColumnWidth={minColumnWidth}\n disableGutters={disableGutters}\n __tagOverride={__tagOverride}\n >\n {children}\n </FlexibleColumnLayout>\n ) : (\n <GridColumnLayout\n columns={columns}\n variant={variant}\n borders={borders}\n disableGutters={disableGutters}\n __breakpoint={__breakpoint}\n __tagOverride={__tagOverride}\n >\n {children}\n </GridColumnLayout>\n )}\n </div>\n );\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/date-picker/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA6C,MAAM,OAAO,CAAC;AAElE,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAyB/C,OAAO,EAAE,eAAe,EAAE,CAAC;AAE3B,QAAA,MAAM,UAAU,6FA8Lf,CAAC;AAGF,eAAe,UAAU,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/date-picker/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA6C,MAAM,OAAO,CAAC;AAElE,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAyB/C,OAAO,EAAE,eAAe,EAAE,CAAC;AAE3B,QAAA,MAAM,UAAU,6FAgMf,CAAC;AAGF,eAAe,UAAU,CAAC"}
@@ -27,7 +27,7 @@ import { useLocale } from '../i18n/context.js';
27
27
  import { getBaseDateLabel, getSelectedDateLabel, isValidFullDate } from './utils';
28
28
  const DatePicker = React.forwardRef((_a, ref) => {
29
29
  var _b, _c, _d;
30
- var { locale = '', startOfWeek, isDateEnabled, nextMonthAriaLabel, previousMonthAriaLabel, todayAriaLabel, i18nStrings, placeholder = '', value = '', readOnly = false, disabled = false, onBlur, autoFocus = false, onChange, onFocus, name, ariaLabel, ariaRequired, controlId, invalid, warning, openCalendarAriaLabel, expandToViewport, granularity = 'day' } = _a, restProps = __rest(_a, ["locale", "startOfWeek", "isDateEnabled", "nextMonthAriaLabel", "previousMonthAriaLabel", "todayAriaLabel", "i18nStrings", "placeholder", "value", "readOnly", "disabled", "onBlur", "autoFocus", "onChange", "onFocus", "name", "ariaLabel", "ariaRequired", "controlId", "invalid", "warning", "openCalendarAriaLabel", "expandToViewport", "granularity"]);
30
+ var { locale = '', startOfWeek, isDateEnabled, dateDisabledReason, nextMonthAriaLabel, previousMonthAriaLabel, todayAriaLabel, i18nStrings, placeholder = '', value = '', readOnly = false, disabled = false, onBlur, autoFocus = false, onChange, onFocus, name, ariaLabel, ariaRequired, controlId, invalid, warning, openCalendarAriaLabel, expandToViewport, granularity = 'day' } = _a, restProps = __rest(_a, ["locale", "startOfWeek", "isDateEnabled", "dateDisabledReason", "nextMonthAriaLabel", "previousMonthAriaLabel", "todayAriaLabel", "i18nStrings", "placeholder", "value", "readOnly", "disabled", "onBlur", "autoFocus", "onChange", "onFocus", "name", "ariaLabel", "ariaRequired", "controlId", "invalid", "warning", "openCalendarAriaLabel", "expandToViewport", "granularity"]);
31
31
  const { __internalRootRef } = useBaseComponent('DatePicker', {
32
32
  props: { autoFocus, expandToViewport, granularity, readOnly },
33
33
  });
@@ -92,7 +92,7 @@ const DatePicker = React.forwardRef((_a, ref) => {
92
92
  fireNonCancelableEvent(onChange, e.detail);
93
93
  (_a = buttonRef === null || buttonRef === void 0 ? void 0 : buttonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
94
94
  setIsDropDownOpen(false);
95
- }, locale: normalizedLocale, startOfWeek: startOfWeek, ariaDescribedby: calendarDescriptionId, ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledby, granularity: granularity, isDateEnabled: isDateEnabled, i18nStrings: Object.assign(Object.assign({}, i18nStrings), { todayAriaLabel: (_b = i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.todayAriaLabel) !== null && _b !== void 0 ? _b : todayAriaLabel, nextMonthAriaLabel: (_c = i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.nextMonthAriaLabel) !== null && _c !== void 0 ? _c : nextMonthAriaLabel, previousMonthAriaLabel: (_d = i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.previousMonthAriaLabel) !== null && _d !== void 0 ? _d : previousMonthAriaLabel }) }),
95
+ }, locale: normalizedLocale, startOfWeek: startOfWeek, ariaDescribedby: calendarDescriptionId, ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledby, granularity: granularity, isDateEnabled: isDateEnabled, dateDisabledReason: dateDisabledReason, i18nStrings: Object.assign(Object.assign({}, i18nStrings), { todayAriaLabel: (_b = i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.todayAriaLabel) !== null && _b !== void 0 ? _b : todayAriaLabel, nextMonthAriaLabel: (_c = i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.nextMonthAriaLabel) !== null && _c !== void 0 ? _c : nextMonthAriaLabel, previousMonthAriaLabel: (_d = i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.previousMonthAriaLabel) !== null && _d !== void 0 ? _d : previousMonthAriaLabel }) }),
96
96
  React.createElement(LiveRegion, { id: calendarDescriptionId }, getBaseDateLabel({ date: baseDate, granularity, locale: normalizedLocale })))))))));
97
97
  });
98
98
  applyDisplayName(DatePicker, 'DatePicker');
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/date-picker/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { Ref, useCallback, useRef, useState } from 'react';\nimport styles from './styles.css.js';\nimport { DatePickerProps } from './interfaces';\nimport InternalCalendar from '../calendar/internal';\nimport { normalizeLocale } from '../internal/utils/locale';\nimport { InputProps } from '../input/interfaces';\nimport { KeyCode } from '../internal/keycode';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport Dropdown from '../internal/components/dropdown';\nimport InternalDateInput from '../date-input/internal';\nimport { getBaseProps } from '../internal/base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name.js';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport { useFocusTracker } from '../internal/hooks/use-focus-tracker.js';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport FocusLock from '../internal/components/focus-lock';\nimport { parseDate } from '../internal/utils/date-time';\nimport LiveRegion from '../internal/components/live-region';\nimport { useFormFieldContext } from '../contexts/form-field.js';\nimport { useLocale } from '../i18n/context.js';\nimport { getBaseDateLabel, getSelectedDateLabel, isValidFullDate } from './utils';\n\nexport { DatePickerProps };\n\nconst DatePicker = React.forwardRef(\n (\n {\n locale = '',\n startOfWeek,\n isDateEnabled,\n nextMonthAriaLabel,\n previousMonthAriaLabel,\n todayAriaLabel,\n i18nStrings,\n placeholder = '',\n value = '',\n readOnly = false,\n disabled = false,\n onBlur,\n autoFocus = false,\n onChange,\n onFocus,\n name,\n ariaLabel,\n ariaRequired,\n controlId,\n invalid,\n warning,\n openCalendarAriaLabel,\n expandToViewport,\n granularity = 'day',\n ...restProps\n }: DatePickerProps,\n ref: Ref<DatePickerProps.Ref>\n ) => {\n const { __internalRootRef } = useBaseComponent('DatePicker', {\n props: { autoFocus, expandToViewport, granularity, readOnly },\n });\n checkControlled('DatePicker', 'value', value, 'onChange', onChange);\n\n const contextLocale = useLocale();\n const normalizedLocale = normalizeLocale('DatePicker', locale || contextLocale);\n\n const baseProps = getBaseProps(restProps);\n const [isDropDownOpen, setIsDropDownOpen] = useState<boolean>(false);\n const { ariaLabelledby, ariaDescribedby } = useFormFieldContext(restProps);\n\n const internalInputRef = useRef<HTMLInputElement>(null);\n const buttonRef = useRef<ButtonProps.Ref>(null);\n useForwardFocus(ref, internalInputRef);\n\n const rootRef = useRef<HTMLDivElement>(null);\n const dropdownId = useUniqueId('calender');\n const calendarDescriptionId = useUniqueId('calendar-description-');\n const mergedRef = useMergeRefs(rootRef, __internalRootRef);\n\n useFocusTracker({ rootRef, onBlur, onFocus });\n\n const onDropdownCloseHandler = useCallback(() => setIsDropDownOpen(false), [setIsDropDownOpen]);\n\n const onButtonClickHandler = () => {\n if (!isDropDownOpen) {\n setIsDropDownOpen(true);\n }\n };\n\n const onWrapperKeyDownHandler = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (event.keyCode === KeyCode.escape && isDropDownOpen) {\n event.stopPropagation();\n buttonRef.current?.focus();\n setIsDropDownOpen(false);\n }\n };\n\n const onInputChangeHandler: InputProps['onChange'] = event => {\n fireNonCancelableEvent(onChange, { value: event.detail.value });\n };\n\n const onInputBlurHandler: InputProps['onBlur'] = () => {\n if (!isDropDownOpen) {\n setIsDropDownOpen(false);\n }\n };\n\n // Set displayed date to value if defined or to current date otherwise.\n const parsedValue = value && value.length >= 4 ? parseDate(value) : null;\n const baseDate = parsedValue || new Date();\n\n const hasFullValue = isValidFullDate({ date: value, granularity });\n\n const buttonAriaLabel =\n openCalendarAriaLabel &&\n openCalendarAriaLabel(\n hasFullValue && parsedValue\n ? getSelectedDateLabel({ date: parsedValue, granularity, locale: normalizedLocale })\n : null\n );\n\n const trigger = (\n <div className={styles['date-picker-trigger']}>\n <div className={styles['date-picker-input']}>\n <InternalDateInput\n name={name}\n invalid={invalid}\n warning={warning}\n controlId={controlId}\n ariaLabelledby={ariaLabelledby}\n ariaDescribedby={ariaDescribedby}\n ariaLabel={ariaLabel}\n ariaRequired={ariaRequired}\n value={value}\n disabled={disabled}\n readOnly={readOnly}\n onChange={onInputChangeHandler}\n onBlur={onInputBlurHandler}\n placeholder={placeholder}\n ref={internalInputRef}\n autoFocus={autoFocus}\n onFocus={onDropdownCloseHandler}\n granularity={granularity}\n />\n </div>\n <div>\n <InternalButton\n iconName=\"calendar\"\n className={styles['open-calendar-button']}\n onClick={onButtonClickHandler}\n ref={buttonRef}\n ariaLabel={buttonAriaLabel}\n disabled={disabled || readOnly}\n formAction=\"none\"\n />\n </div>\n </div>\n );\n\n baseProps.className = clsx(baseProps.className, styles.root, styles['date-picker-container']);\n\n const handleMouseDown = (event: React.MouseEvent) => {\n // prevent currently focused element from losing it\n event.preventDefault();\n };\n\n return (\n <div {...baseProps} ref={mergedRef} onKeyDown={!disabled && !readOnly ? onWrapperKeyDownHandler : undefined}>\n {disabled || readOnly ? (\n trigger\n ) : (\n <Dropdown\n stretchWidth={true}\n stretchHeight={true}\n open={isDropDownOpen}\n onDropdownClose={onDropdownCloseHandler}\n onMouseDown={handleMouseDown}\n trigger={trigger}\n expandToViewport={expandToViewport}\n scrollable={false}\n dropdownId={dropdownId}\n >\n {isDropDownOpen && (\n <FocusLock className={styles['focus-lock']} autoFocus={true}>\n <div tabIndex={0} className={styles.calendar} role=\"dialog\" aria-modal=\"true\">\n <InternalCalendar\n value={value}\n onChange={e => {\n fireNonCancelableEvent(onChange, e.detail);\n buttonRef?.current?.focus();\n setIsDropDownOpen(false);\n }}\n locale={normalizedLocale}\n startOfWeek={startOfWeek}\n ariaDescribedby={calendarDescriptionId}\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n granularity={granularity}\n isDateEnabled={isDateEnabled}\n i18nStrings={{\n ...i18nStrings,\n todayAriaLabel: i18nStrings?.todayAriaLabel ?? todayAriaLabel,\n nextMonthAriaLabel: i18nStrings?.nextMonthAriaLabel ?? nextMonthAriaLabel,\n previousMonthAriaLabel: i18nStrings?.previousMonthAriaLabel ?? previousMonthAriaLabel,\n }}\n />\n <LiveRegion id={calendarDescriptionId}>\n {getBaseDateLabel({ date: baseDate, granularity, locale: normalizedLocale })}\n </LiveRegion>\n </div>\n </FocusLock>\n )}\n </Dropdown>\n )}\n </div>\n );\n }\n);\n\napplyDisplayName(DatePicker, 'DatePicker');\nexport default DatePicker;\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/date-picker/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { Ref, useCallback, useRef, useState } from 'react';\nimport styles from './styles.css.js';\nimport { DatePickerProps } from './interfaces';\nimport InternalCalendar from '../calendar/internal';\nimport { normalizeLocale } from '../internal/utils/locale';\nimport { InputProps } from '../input/interfaces';\nimport { KeyCode } from '../internal/keycode';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport Dropdown from '../internal/components/dropdown';\nimport InternalDateInput from '../date-input/internal';\nimport { getBaseProps } from '../internal/base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name.js';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport { useFocusTracker } from '../internal/hooks/use-focus-tracker.js';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport FocusLock from '../internal/components/focus-lock';\nimport { parseDate } from '../internal/utils/date-time';\nimport LiveRegion from '../internal/components/live-region';\nimport { useFormFieldContext } from '../contexts/form-field.js';\nimport { useLocale } from '../i18n/context.js';\nimport { getBaseDateLabel, getSelectedDateLabel, isValidFullDate } from './utils';\n\nexport { DatePickerProps };\n\nconst DatePicker = React.forwardRef(\n (\n {\n locale = '',\n startOfWeek,\n isDateEnabled,\n dateDisabledReason,\n nextMonthAriaLabel,\n previousMonthAriaLabel,\n todayAriaLabel,\n i18nStrings,\n placeholder = '',\n value = '',\n readOnly = false,\n disabled = false,\n onBlur,\n autoFocus = false,\n onChange,\n onFocus,\n name,\n ariaLabel,\n ariaRequired,\n controlId,\n invalid,\n warning,\n openCalendarAriaLabel,\n expandToViewport,\n granularity = 'day',\n ...restProps\n }: DatePickerProps,\n ref: Ref<DatePickerProps.Ref>\n ) => {\n const { __internalRootRef } = useBaseComponent('DatePicker', {\n props: { autoFocus, expandToViewport, granularity, readOnly },\n });\n checkControlled('DatePicker', 'value', value, 'onChange', onChange);\n\n const contextLocale = useLocale();\n const normalizedLocale = normalizeLocale('DatePicker', locale || contextLocale);\n\n const baseProps = getBaseProps(restProps);\n const [isDropDownOpen, setIsDropDownOpen] = useState<boolean>(false);\n const { ariaLabelledby, ariaDescribedby } = useFormFieldContext(restProps);\n\n const internalInputRef = useRef<HTMLInputElement>(null);\n const buttonRef = useRef<ButtonProps.Ref>(null);\n useForwardFocus(ref, internalInputRef);\n\n const rootRef = useRef<HTMLDivElement>(null);\n const dropdownId = useUniqueId('calender');\n const calendarDescriptionId = useUniqueId('calendar-description-');\n const mergedRef = useMergeRefs(rootRef, __internalRootRef);\n\n useFocusTracker({ rootRef, onBlur, onFocus });\n\n const onDropdownCloseHandler = useCallback(() => setIsDropDownOpen(false), [setIsDropDownOpen]);\n\n const onButtonClickHandler = () => {\n if (!isDropDownOpen) {\n setIsDropDownOpen(true);\n }\n };\n\n const onWrapperKeyDownHandler = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (event.keyCode === KeyCode.escape && isDropDownOpen) {\n event.stopPropagation();\n buttonRef.current?.focus();\n setIsDropDownOpen(false);\n }\n };\n\n const onInputChangeHandler: InputProps['onChange'] = event => {\n fireNonCancelableEvent(onChange, { value: event.detail.value });\n };\n\n const onInputBlurHandler: InputProps['onBlur'] = () => {\n if (!isDropDownOpen) {\n setIsDropDownOpen(false);\n }\n };\n\n // Set displayed date to value if defined or to current date otherwise.\n const parsedValue = value && value.length >= 4 ? parseDate(value) : null;\n const baseDate = parsedValue || new Date();\n\n const hasFullValue = isValidFullDate({ date: value, granularity });\n\n const buttonAriaLabel =\n openCalendarAriaLabel &&\n openCalendarAriaLabel(\n hasFullValue && parsedValue\n ? getSelectedDateLabel({ date: parsedValue, granularity, locale: normalizedLocale })\n : null\n );\n\n const trigger = (\n <div className={styles['date-picker-trigger']}>\n <div className={styles['date-picker-input']}>\n <InternalDateInput\n name={name}\n invalid={invalid}\n warning={warning}\n controlId={controlId}\n ariaLabelledby={ariaLabelledby}\n ariaDescribedby={ariaDescribedby}\n ariaLabel={ariaLabel}\n ariaRequired={ariaRequired}\n value={value}\n disabled={disabled}\n readOnly={readOnly}\n onChange={onInputChangeHandler}\n onBlur={onInputBlurHandler}\n placeholder={placeholder}\n ref={internalInputRef}\n autoFocus={autoFocus}\n onFocus={onDropdownCloseHandler}\n granularity={granularity}\n />\n </div>\n <div>\n <InternalButton\n iconName=\"calendar\"\n className={styles['open-calendar-button']}\n onClick={onButtonClickHandler}\n ref={buttonRef}\n ariaLabel={buttonAriaLabel}\n disabled={disabled || readOnly}\n formAction=\"none\"\n />\n </div>\n </div>\n );\n\n baseProps.className = clsx(baseProps.className, styles.root, styles['date-picker-container']);\n\n const handleMouseDown = (event: React.MouseEvent) => {\n // prevent currently focused element from losing it\n event.preventDefault();\n };\n\n return (\n <div {...baseProps} ref={mergedRef} onKeyDown={!disabled && !readOnly ? onWrapperKeyDownHandler : undefined}>\n {disabled || readOnly ? (\n trigger\n ) : (\n <Dropdown\n stretchWidth={true}\n stretchHeight={true}\n open={isDropDownOpen}\n onDropdownClose={onDropdownCloseHandler}\n onMouseDown={handleMouseDown}\n trigger={trigger}\n expandToViewport={expandToViewport}\n scrollable={false}\n dropdownId={dropdownId}\n >\n {isDropDownOpen && (\n <FocusLock className={styles['focus-lock']} autoFocus={true}>\n <div tabIndex={0} className={styles.calendar} role=\"dialog\" aria-modal=\"true\">\n <InternalCalendar\n value={value}\n onChange={e => {\n fireNonCancelableEvent(onChange, e.detail);\n buttonRef?.current?.focus();\n setIsDropDownOpen(false);\n }}\n locale={normalizedLocale}\n startOfWeek={startOfWeek}\n ariaDescribedby={calendarDescriptionId}\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n granularity={granularity}\n isDateEnabled={isDateEnabled}\n dateDisabledReason={dateDisabledReason}\n i18nStrings={{\n ...i18nStrings,\n todayAriaLabel: i18nStrings?.todayAriaLabel ?? todayAriaLabel,\n nextMonthAriaLabel: i18nStrings?.nextMonthAriaLabel ?? nextMonthAriaLabel,\n previousMonthAriaLabel: i18nStrings?.previousMonthAriaLabel ?? previousMonthAriaLabel,\n }}\n />\n <LiveRegion id={calendarDescriptionId}>\n {getBaseDateLabel({ date: baseDate, granularity, locale: normalizedLocale })}\n </LiveRegion>\n </div>\n </FocusLock>\n )}\n </Dropdown>\n )}\n </div>\n );\n }\n);\n\napplyDisplayName(DatePicker, 'DatePicker');\nexport default DatePicker;\n"]}
@@ -26,11 +26,12 @@ export interface GridProps {
26
26
  onGridKeyDownHandler: (e: React.KeyboardEvent<HTMLElement>) => void;
27
27
  onFocusedDateChange: React.Dispatch<React.SetStateAction<Date | null>>;
28
28
  isDateEnabled: DateRangePickerProps.IsDateEnabledFunction;
29
+ dateDisabledReason: DateRangePickerProps.DateDisabledReasonFunction;
29
30
  locale: string;
30
31
  startOfWeek: DayIndex;
31
32
  todayAriaLabel?: string;
32
33
  ariaLabelledby: string;
33
34
  className?: string;
34
35
  }
35
- export declare function Grid({ baseDate, selectedStartDate, selectedEndDate, rangeStartDate, rangeEndDate, focusedDate, focusedDateRef, onSelectDate, onGridKeyDownHandler, onFocusedDateChange, isDateEnabled, locale, startOfWeek, todayAriaLabel, ariaLabelledby, className, }: GridProps): JSX.Element;
36
+ export declare function Grid({ baseDate, selectedStartDate, selectedEndDate, rangeStartDate, rangeEndDate, focusedDate, focusedDateRef, onSelectDate, onGridKeyDownHandler, onFocusedDateChange, isDateEnabled, dateDisabledReason, locale, startOfWeek, todayAriaLabel, ariaLabelledby, className, }: GridProps): JSX.Element;
36
37
  //# sourceMappingURL=grid.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"grid.d.ts","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/grids/grid.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAcvC,OAAO,EAAE,oBAAoB,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAMlE;;;;;;;;;;;;;GAaG;AAEH,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,IAAI,CAAC;IACf,iBAAiB,EAAE,IAAI,GAAG,IAAI,CAAC;IAC/B,eAAe,EAAE,IAAI,GAAG,IAAI,CAAC;IAE7B,cAAc,EAAE,IAAI,GAAG,IAAI,CAAC;IAC5B,YAAY,EAAE,IAAI,GAAG,IAAI,CAAC;IAE1B,WAAW,EAAE,IAAI,GAAG,IAAI,CAAC;IACzB,cAAc,EAAE,KAAK,CAAC,SAAS,CAAC,oBAAoB,CAAC,CAAC;IAEtD,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,oBAAoB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACpE,mBAAmB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC,CAAC;IAEvE,aAAa,EAAE,oBAAoB,CAAC,qBAAqB,CAAC;IAE1D,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,QAAQ,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,EAAE,MAAM,CAAC;IAEvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,iBAAiB,EACjB,eAAe,EACf,cAAc,EACd,YAAY,EACZ,WAAW,EAEX,cAAc,EAEd,YAAY,EACZ,oBAAoB,EACpB,mBAAmB,EAEnB,aAAa,EAEb,MAAM,EACN,WAAW,EACX,cAAc,EACd,cAAc,EAEd,SAAS,GACV,EAAE,SAAS,eAsIX"}
1
+ {"version":3,"file":"grid.d.ts","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/grids/grid.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkE,MAAM,OAAO,CAAC;AAcvF,OAAO,EAAE,oBAAoB,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAUlE;;;;;;;;;;;;;GAaG;AAEH,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,IAAI,CAAC;IACf,iBAAiB,EAAE,IAAI,GAAG,IAAI,CAAC;IAC/B,eAAe,EAAE,IAAI,GAAG,IAAI,CAAC;IAE7B,cAAc,EAAE,IAAI,GAAG,IAAI,CAAC;IAC5B,YAAY,EAAE,IAAI,GAAG,IAAI,CAAC;IAE1B,WAAW,EAAE,IAAI,GAAG,IAAI,CAAC;IACzB,cAAc,EAAE,KAAK,CAAC,SAAS,CAAC,oBAAoB,CAAC,CAAC;IAEtD,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,oBAAoB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACpE,mBAAmB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC,CAAC;IAEvE,aAAa,EAAE,oBAAoB,CAAC,qBAAqB,CAAC;IAC1D,kBAAkB,EAAE,oBAAoB,CAAC,0BAA0B,CAAC;IAEpE,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,QAAQ,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,EAAE,MAAM,CAAC;IAEvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAsED,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,iBAAiB,EACjB,eAAe,EACf,cAAc,EACd,YAAY,EACZ,WAAW,EAEX,cAAc,EAEd,YAAY,EACZ,oBAAoB,EACpB,mBAAmB,EAEnB,aAAa,EACb,kBAAkB,EAElB,MAAM,EACN,WAAW,EACX,cAAc,EACd,cAAc,EAEd,SAAS,GACV,EAAE,SAAS,eAyIX"}
@@ -1,6 +1,7 @@
1
+ import { __rest } from "tslib";
1
2
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
3
  // SPDX-License-Identifier: Apache-2.0
3
- import React, { useMemo } from 'react';
4
+ import React, { useMemo, forwardRef, useRef, useState } from 'react';
4
5
  import styles from './styles.css.js';
5
6
  import { isSameMonth, isAfter, isBefore, isSameDay, addWeeks, addDays, isLastDayOfMonth, getDaysInMonth, isToday, } from 'date-fns';
6
7
  import { getCalendarMonth } from 'mnth';
@@ -8,7 +9,52 @@ import { getDateLabel, renderDayName } from '../../../calendar/utils/intl';
8
9
  import clsx from 'clsx';
9
10
  import { formatDate } from '../../../internal/utils/date-time';
10
11
  import ScreenreaderOnly from '../../../internal/components/screenreader-only/index.js';
11
- export function Grid({ baseDate, selectedStartDate, selectedEndDate, rangeStartDate, rangeEndDate, focusedDate, focusedDateRef, onSelectDate, onGridKeyDownHandler, onFocusedDateChange, isDateEnabled, locale, startOfWeek, todayAriaLabel, ariaLabelledby, className, }) {
12
+ import { applyDisplayName } from '../../../internal/utils/apply-display-name';
13
+ import useHiddenDescription from '../../../internal/hooks/use-hidden-description';
14
+ import Tooltip from '../../../internal/components/tooltip';
15
+ import { useMergeRefs } from '../../../internal/hooks/use-merge-refs';
16
+ const GridCell = forwardRef((props, focusedDateRef) => {
17
+ const { disabledReason } = props, rest = __rest(props, ["disabledReason"]);
18
+ const isDisabledWithReason = !!disabledReason;
19
+ const { targetProps, descriptionEl } = useHiddenDescription(disabledReason);
20
+ const ref = useRef(null);
21
+ const [showTooltip, setShowTooltip] = useState(false);
22
+ return (React.createElement("td", Object.assign({ ref: useMergeRefs(focusedDateRef, ref) }, rest, (isDisabledWithReason ? targetProps : {}), { onFocus: event => {
23
+ if (rest.onFocus) {
24
+ rest.onFocus(event);
25
+ }
26
+ if (isDisabledWithReason) {
27
+ setShowTooltip(true);
28
+ }
29
+ }, onBlur: event => {
30
+ if (rest.onBlur) {
31
+ rest.onBlur(event);
32
+ }
33
+ if (isDisabledWithReason) {
34
+ setShowTooltip(false);
35
+ }
36
+ }, onMouseEnter: event => {
37
+ if (rest.onMouseEnter) {
38
+ rest.onMouseEnter(event);
39
+ }
40
+ if (isDisabledWithReason) {
41
+ setShowTooltip(true);
42
+ }
43
+ }, onMouseLeave: event => {
44
+ if (rest.onMouseLeave) {
45
+ rest.onMouseLeave(event);
46
+ }
47
+ if (isDisabledWithReason) {
48
+ setShowTooltip(false);
49
+ }
50
+ } }),
51
+ props.children,
52
+ isDisabledWithReason && (React.createElement(React.Fragment, null,
53
+ descriptionEl,
54
+ showTooltip && (React.createElement(Tooltip, { className: styles['disabled-reason-tooltip'], trackRef: ref, value: disabledReason }))))));
55
+ });
56
+ applyDisplayName(GridCell, 'GridCell');
57
+ export function Grid({ baseDate, selectedStartDate, selectedEndDate, rangeStartDate, rangeEndDate, focusedDate, focusedDateRef, onSelectDate, onGridKeyDownHandler, onFocusedDateChange, isDateEnabled, dateDisabledReason, locale, startOfWeek, todayAriaLabel, ariaLabelledby, className, }) {
12
58
  const baseDateTime = baseDate === null || baseDate === void 0 ? void 0 : baseDate.getTime();
13
59
  // `baseDateTime` is used as a more stable replacement for baseDate
14
60
  const weeks = useMemo(() => getCalendarMonth(baseDate, { firstDayOfWeek: startOfWeek }),
@@ -35,7 +81,9 @@ export function Grid({ baseDate, selectedStartDate, selectedEndDate, rangeStartD
35
81
  ? isSameDay(rangeStartDate, rangeEndDate)
36
82
  : !selectedStartDate || !selectedEndDate;
37
83
  const isEnabled = !isDateEnabled || isDateEnabled(date);
38
- const isFocusable = isFocused && isEnabled;
84
+ const disabledReason = dateDisabledReason(date);
85
+ const isDisabledWithReason = !isEnabled && !!disabledReason;
86
+ const isFocusable = isFocused && (isEnabled || isDisabledWithReason);
39
87
  const baseClasses = {
40
88
  [styles.day]: true,
41
89
  [styles['grid-cell']]: true,
@@ -56,11 +104,11 @@ export function Grid({ baseDate, selectedStartDate, selectedEndDate, rangeStartD
56
104
  }
57
105
  // Can't be focused.
58
106
  let tabIndex = undefined;
59
- if (isFocusable && isEnabled) {
107
+ if (isFocusable && (isEnabled || isDisabledWithReason)) {
60
108
  // Next focus target.
61
109
  tabIndex = 0;
62
110
  }
63
- else if (isEnabled) {
111
+ else if (isEnabled || isDisabledWithReason) {
64
112
  // Can be focused programmatically.
65
113
  tabIndex = -1;
66
114
  }
@@ -69,7 +117,7 @@ export function Grid({ baseDate, selectedStartDate, selectedEndDate, rangeStartD
69
117
  if (isToday(date)) {
70
118
  dayAnnouncement += '. ' + todayAriaLabel;
71
119
  }
72
- return (React.createElement("td", Object.assign({ ref: isFocused ? focusedDateRef : undefined, key: `${weekIndex}:${dateIndex}`, className: clsx(baseClasses, {
120
+ return (React.createElement(GridCell, Object.assign({ ref: isFocused ? focusedDateRef : undefined, key: `${weekIndex}:${dateIndex}`, className: clsx(baseClasses, {
73
121
  [styles['in-current-month']]: isSameMonth(date, baseDate),
74
122
  [styles.enabled]: isEnabled,
75
123
  [styles.selected]: isSelected,
@@ -84,7 +132,7 @@ export function Grid({ baseDate, selectedStartDate, selectedEndDate, rangeStartD
84
132
  [styles['in-range-border-inline-start']]: dateIndex === 0 || date.getDate() === 1 || isRangeStartDate,
85
133
  [styles['in-range-border-inline-end']]: dateIndex === week.length - 1 || isLastDayOfMonth(date) || isRangeEndDate,
86
134
  [styles.today]: isToday(date),
87
- }), "aria-selected": isEnabled ? isSelected || dateIsInRange : undefined, "aria-current": isToday(date) ? 'date' : undefined, "data-date": formatDate(date), "aria-disabled": !isEnabled, tabIndex: tabIndex }, handlers),
135
+ }), "aria-selected": isEnabled ? isSelected || dateIsInRange : undefined, "aria-current": isToday(date) ? 'date' : undefined, "data-date": formatDate(date), "aria-disabled": !isEnabled, tabIndex: tabIndex, disabledReason: isDisabledWithReason ? disabledReason : undefined }, handlers),
88
136
  React.createElement("span", { className: styles['day-inner'], "aria-hidden": "true" }, date.getDate()),
89
137
  React.createElement(ScreenreaderOnly, null, dayAnnouncement)));
90
138
  })));
@@ -1 +1 @@
1
- {"version":3,"file":"grid.js","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/grids/grid.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useMemo } from 'react';\nimport styles from './styles.css.js';\nimport {\n isSameMonth,\n isAfter,\n isBefore,\n isSameDay,\n addWeeks,\n addDays,\n isLastDayOfMonth,\n getDaysInMonth,\n isToday,\n} from 'date-fns';\nimport { getCalendarMonth } from 'mnth';\nimport { DateRangePickerProps, DayIndex } from '../../interfaces';\nimport { getDateLabel, renderDayName } from '../../../calendar/utils/intl';\nimport clsx from 'clsx';\nimport { formatDate } from '../../../internal/utils/date-time';\nimport ScreenreaderOnly from '../../../internal/components/screenreader-only/index.js';\n\n/**\n * Calendar grid supports two mechanisms of keyboard navigation:\n * - Native screen-reader table navigation (semantic table markup);\n * - Keyboard arrow-keys navigation (a custom key-down handler).\n *\n * The implementation largely follows the w3 example (https://www.w3.org/WAI/ARIA/apg/example-index/dialog-modal/datepicker-dialog) and shares the following issues:\n * - (table navigation) Chrome+VO - weekday is announced twice when navigating to the calendar's header;\n * - (table navigation) Safari+VO - \"dimmed\" state is announced twice;\n * - (table navigation) Firefox/Chrome+NVDA - cannot use table navigation if any cell has a focus;\n * - (keyboard navigation) Firefox+NVDA - every day is announced as \"not selected\";\n * - (keyboard navigation) Safari/Chrome+VO - weekdays are not announced;\n * - (keyboard navigation) Safari/Chrome+VO - days are not announced as interactive (clickable or selectable);\n * - (keyboard navigation) Safari/Chrome+VO - day announcements are not interruptive and can be missed if navigating fast.\n */\n\nexport interface GridProps {\n baseDate: Date;\n selectedStartDate: Date | null;\n selectedEndDate: Date | null;\n\n rangeStartDate: Date | null;\n rangeEndDate: Date | null;\n\n focusedDate: Date | null;\n focusedDateRef: React.RefObject<HTMLTableCellElement>;\n\n onSelectDate: (date: Date) => void;\n onGridKeyDownHandler: (e: React.KeyboardEvent<HTMLElement>) => void;\n onFocusedDateChange: React.Dispatch<React.SetStateAction<Date | null>>;\n\n isDateEnabled: DateRangePickerProps.IsDateEnabledFunction;\n\n locale: string;\n startOfWeek: DayIndex;\n todayAriaLabel?: string;\n ariaLabelledby: string;\n\n className?: string;\n}\n\nexport function Grid({\n baseDate,\n selectedStartDate,\n selectedEndDate,\n rangeStartDate,\n rangeEndDate,\n focusedDate,\n\n focusedDateRef,\n\n onSelectDate,\n onGridKeyDownHandler,\n onFocusedDateChange,\n\n isDateEnabled,\n\n locale,\n startOfWeek,\n todayAriaLabel,\n ariaLabelledby,\n\n className,\n}: GridProps) {\n const baseDateTime = baseDate?.getTime();\n // `baseDateTime` is used as a more stable replacement for baseDate\n const weeks = useMemo<Date[][]>(\n () => getCalendarMonth(baseDate, { firstDayOfWeek: startOfWeek }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [baseDateTime, startOfWeek]\n );\n const weekdays = weeks[0].map(date => date.getDay());\n\n return (\n <table role=\"grid\" aria-labelledby={ariaLabelledby} className={clsx(styles.grid, className)}>\n <thead>\n <tr>\n {weekdays.map(dayIndex => (\n <th key={dayIndex} scope=\"col\" className={clsx(styles['grid-cell'], styles['day-header'])}>\n <span aria-hidden=\"true\">{renderDayName(locale, dayIndex, 'short')}</span>\n <ScreenreaderOnly>{renderDayName(locale, dayIndex, 'long')}</ScreenreaderOnly>\n </th>\n ))}\n </tr>\n </thead>\n <tbody onKeyDown={onGridKeyDownHandler}>\n {weeks.map((week, weekIndex) => {\n return (\n <tr key={weekIndex} className={styles.week}>\n {week.map((date, dateIndex) => {\n const isStartDate = !!selectedStartDate && isSameDay(date, selectedStartDate);\n const isEndDate = !!selectedEndDate && isSameDay(date, selectedEndDate);\n const isSelected = isStartDate || isEndDate;\n const isRangeStartDate = !!rangeStartDate && isSameDay(date, rangeStartDate);\n const isRangeEndDate = !!rangeEndDate && isSameDay(date, rangeEndDate);\n\n const isFocused = !!focusedDate && isSameDay(date, focusedDate) && isSameMonth(date, baseDate);\n\n const dateIsInRange = isStartDate || isEndDate || isInRange(date, rangeStartDate, rangeEndDate);\n const inRangeStartWeek =\n rangeStartDate && isInRange(date, rangeStartDate, addDays(addWeeks(rangeStartDate, 1), -1));\n const inRangeEndWeek =\n rangeEndDate && isInRange(date, rangeEndDate, addDays(addWeeks(rangeEndDate, -1), 1));\n const onlyOneSelected =\n !!rangeStartDate && !!rangeEndDate\n ? isSameDay(rangeStartDate, rangeEndDate)\n : !selectedStartDate || !selectedEndDate;\n\n const isEnabled = !isDateEnabled || isDateEnabled(date);\n const isFocusable = isFocused && isEnabled;\n\n const baseClasses = {\n [styles.day]: true,\n [styles['grid-cell']]: true,\n [styles['in-first-row']]: weekIndex === 0,\n [styles['in-first-column']]: dateIndex === 0,\n };\n\n if (!isSameMonth(date, baseDate)) {\n return (\n <td\n key={`${weekIndex}:${dateIndex}`}\n ref={isFocused ? focusedDateRef : undefined}\n className={clsx(baseClasses, {\n [styles['in-previous-month']]: isBefore(date, baseDate),\n [styles['last-day-of-month']]: isLastDayOfMonth(date),\n [styles['in-next-month']]: isAfter(date, baseDate),\n })}\n ></td>\n );\n }\n\n const handlers: React.HTMLAttributes<HTMLDivElement> = {};\n if (isEnabled) {\n handlers.onClick = () => onSelectDate(date);\n handlers.onFocus = () => onFocusedDateChange(date);\n }\n\n // Can't be focused.\n let tabIndex = undefined;\n if (isFocusable && isEnabled) {\n // Next focus target.\n tabIndex = 0;\n } else if (isEnabled) {\n // Can be focused programmatically.\n tabIndex = -1;\n }\n\n // Screen-reader announcement for the focused day.\n let dayAnnouncement = getDateLabel(locale, date, 'short');\n if (isToday(date)) {\n dayAnnouncement += '. ' + todayAriaLabel;\n }\n\n return (\n <td\n ref={isFocused ? focusedDateRef : undefined}\n key={`${weekIndex}:${dateIndex}`}\n className={clsx(baseClasses, {\n [styles['in-current-month']]: isSameMonth(date, baseDate),\n [styles.enabled]: isEnabled,\n [styles.selected]: isSelected,\n [styles['start-date']]: isStartDate,\n [styles['end-date']]: isEndDate,\n [styles['range-start-date']]: isRangeStartDate,\n [styles['range-end-date']]: isRangeEndDate,\n [styles['no-range']]: isSelected && onlyOneSelected,\n [styles['in-range']]: dateIsInRange,\n [styles['in-range-border-block-start']]: !!inRangeStartWeek || date.getDate() <= 7,\n [styles['in-range-border-block-end']]:\n !!inRangeEndWeek || date.getDate() > getDaysInMonth(date) - 7,\n [styles['in-range-border-inline-start']]:\n dateIndex === 0 || date.getDate() === 1 || isRangeStartDate,\n [styles['in-range-border-inline-end']]:\n dateIndex === week.length - 1 || isLastDayOfMonth(date) || isRangeEndDate,\n [styles.today]: isToday(date),\n })}\n aria-selected={isEnabled ? isSelected || dateIsInRange : undefined}\n aria-current={isToday(date) ? 'date' : undefined}\n data-date={formatDate(date)}\n aria-disabled={!isEnabled}\n tabIndex={tabIndex}\n {...handlers}\n >\n <span className={styles['day-inner']} aria-hidden=\"true\">\n {date.getDate()}\n </span>\n <ScreenreaderOnly>{dayAnnouncement}</ScreenreaderOnly>\n </td>\n );\n })}\n </tr>\n );\n })}\n </tbody>\n </table>\n );\n}\n\nfunction isInRange(date: Date, dateOne: Date | null, dateTwo: Date | null) {\n if (!dateOne || !dateTwo || isSameDay(dateOne, dateTwo)) {\n return false;\n }\n\n const inRange =\n (isAfter(date, dateOne) && isBefore(date, dateTwo)) || (isAfter(date, dateTwo) && isBefore(date, dateOne));\n\n return inRange || isSameDay(date, dateOne) || isSameDay(date, dateTwo);\n}\n"]}
1
+ {"version":3,"file":"grid.js","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/grids/grid.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useMemo, forwardRef, useRef, useState, TdHTMLAttributes } from 'react';\nimport styles from './styles.css.js';\nimport {\n isSameMonth,\n isAfter,\n isBefore,\n isSameDay,\n addWeeks,\n addDays,\n isLastDayOfMonth,\n getDaysInMonth,\n isToday,\n} from 'date-fns';\nimport { getCalendarMonth } from 'mnth';\nimport { DateRangePickerProps, DayIndex } from '../../interfaces';\nimport { getDateLabel, renderDayName } from '../../../calendar/utils/intl';\nimport clsx from 'clsx';\nimport { formatDate } from '../../../internal/utils/date-time';\nimport ScreenreaderOnly from '../../../internal/components/screenreader-only/index.js';\nimport { applyDisplayName } from '../../../internal/utils/apply-display-name';\nimport useHiddenDescription from '../../../internal/hooks/use-hidden-description';\nimport Tooltip from '../../../internal/components/tooltip';\nimport { useMergeRefs } from '../../../internal/hooks/use-merge-refs';\n\n/**\n * Calendar grid supports two mechanisms of keyboard navigation:\n * - Native screen-reader table navigation (semantic table markup);\n * - Keyboard arrow-keys navigation (a custom key-down handler).\n *\n * The implementation largely follows the w3 example (https://www.w3.org/WAI/ARIA/apg/example-index/dialog-modal/datepicker-dialog) and shares the following issues:\n * - (table navigation) Chrome+VO - weekday is announced twice when navigating to the calendar's header;\n * - (table navigation) Safari+VO - \"dimmed\" state is announced twice;\n * - (table navigation) Firefox/Chrome+NVDA - cannot use table navigation if any cell has a focus;\n * - (keyboard navigation) Firefox+NVDA - every day is announced as \"not selected\";\n * - (keyboard navigation) Safari/Chrome+VO - weekdays are not announced;\n * - (keyboard navigation) Safari/Chrome+VO - days are not announced as interactive (clickable or selectable);\n * - (keyboard navigation) Safari/Chrome+VO - day announcements are not interruptive and can be missed if navigating fast.\n */\n\nexport interface GridProps {\n baseDate: Date;\n selectedStartDate: Date | null;\n selectedEndDate: Date | null;\n\n rangeStartDate: Date | null;\n rangeEndDate: Date | null;\n\n focusedDate: Date | null;\n focusedDateRef: React.RefObject<HTMLTableCellElement>;\n\n onSelectDate: (date: Date) => void;\n onGridKeyDownHandler: (e: React.KeyboardEvent<HTMLElement>) => void;\n onFocusedDateChange: React.Dispatch<React.SetStateAction<Date | null>>;\n\n isDateEnabled: DateRangePickerProps.IsDateEnabledFunction;\n dateDisabledReason: DateRangePickerProps.DateDisabledReasonFunction;\n\n locale: string;\n startOfWeek: DayIndex;\n todayAriaLabel?: string;\n ariaLabelledby: string;\n\n className?: string;\n}\n\ninterface GridCellProps extends TdHTMLAttributes<HTMLTableCellElement> {\n disabledReason?: string;\n}\n\nconst GridCell = forwardRef((props: GridCellProps, focusedDateRef: React.Ref<HTMLTableCellElement>) => {\n const { disabledReason, ...rest } = props;\n const isDisabledWithReason = !!disabledReason;\n const { targetProps, descriptionEl } = useHiddenDescription(disabledReason);\n const ref = useRef<HTMLTableCellElement>(null);\n const [showTooltip, setShowTooltip] = useState(false);\n\n return (\n <td\n ref={useMergeRefs(focusedDateRef, ref)}\n {...rest}\n {...(isDisabledWithReason ? targetProps : {})}\n onFocus={event => {\n if (rest.onFocus) {\n rest.onFocus(event);\n }\n\n if (isDisabledWithReason) {\n setShowTooltip(true);\n }\n }}\n onBlur={event => {\n if (rest.onBlur) {\n rest.onBlur(event);\n }\n\n if (isDisabledWithReason) {\n setShowTooltip(false);\n }\n }}\n onMouseEnter={event => {\n if (rest.onMouseEnter) {\n rest.onMouseEnter(event);\n }\n\n if (isDisabledWithReason) {\n setShowTooltip(true);\n }\n }}\n onMouseLeave={event => {\n if (rest.onMouseLeave) {\n rest.onMouseLeave(event);\n }\n\n if (isDisabledWithReason) {\n setShowTooltip(false);\n }\n }}\n >\n {props.children}\n {isDisabledWithReason && (\n <>\n {descriptionEl}\n {showTooltip && (\n <Tooltip className={styles['disabled-reason-tooltip']} trackRef={ref} value={disabledReason!} />\n )}\n </>\n )}\n </td>\n );\n});\n\napplyDisplayName(GridCell, 'GridCell');\n\nexport function Grid({\n baseDate,\n selectedStartDate,\n selectedEndDate,\n rangeStartDate,\n rangeEndDate,\n focusedDate,\n\n focusedDateRef,\n\n onSelectDate,\n onGridKeyDownHandler,\n onFocusedDateChange,\n\n isDateEnabled,\n dateDisabledReason,\n\n locale,\n startOfWeek,\n todayAriaLabel,\n ariaLabelledby,\n\n className,\n}: GridProps) {\n const baseDateTime = baseDate?.getTime();\n // `baseDateTime` is used as a more stable replacement for baseDate\n const weeks = useMemo<Date[][]>(\n () => getCalendarMonth(baseDate, { firstDayOfWeek: startOfWeek }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [baseDateTime, startOfWeek]\n );\n const weekdays = weeks[0].map(date => date.getDay());\n\n return (\n <table role=\"grid\" aria-labelledby={ariaLabelledby} className={clsx(styles.grid, className)}>\n <thead>\n <tr>\n {weekdays.map(dayIndex => (\n <th key={dayIndex} scope=\"col\" className={clsx(styles['grid-cell'], styles['day-header'])}>\n <span aria-hidden=\"true\">{renderDayName(locale, dayIndex, 'short')}</span>\n <ScreenreaderOnly>{renderDayName(locale, dayIndex, 'long')}</ScreenreaderOnly>\n </th>\n ))}\n </tr>\n </thead>\n <tbody onKeyDown={onGridKeyDownHandler}>\n {weeks.map((week, weekIndex) => {\n return (\n <tr key={weekIndex} className={styles.week}>\n {week.map((date, dateIndex) => {\n const isStartDate = !!selectedStartDate && isSameDay(date, selectedStartDate);\n const isEndDate = !!selectedEndDate && isSameDay(date, selectedEndDate);\n const isSelected = isStartDate || isEndDate;\n const isRangeStartDate = !!rangeStartDate && isSameDay(date, rangeStartDate);\n const isRangeEndDate = !!rangeEndDate && isSameDay(date, rangeEndDate);\n\n const isFocused = !!focusedDate && isSameDay(date, focusedDate) && isSameMonth(date, baseDate);\n\n const dateIsInRange = isStartDate || isEndDate || isInRange(date, rangeStartDate, rangeEndDate);\n const inRangeStartWeek =\n rangeStartDate && isInRange(date, rangeStartDate, addDays(addWeeks(rangeStartDate, 1), -1));\n const inRangeEndWeek =\n rangeEndDate && isInRange(date, rangeEndDate, addDays(addWeeks(rangeEndDate, -1), 1));\n const onlyOneSelected =\n !!rangeStartDate && !!rangeEndDate\n ? isSameDay(rangeStartDate, rangeEndDate)\n : !selectedStartDate || !selectedEndDate;\n\n const isEnabled = !isDateEnabled || isDateEnabled(date);\n const disabledReason = dateDisabledReason(date);\n const isDisabledWithReason = !isEnabled && !!disabledReason;\n const isFocusable = isFocused && (isEnabled || isDisabledWithReason);\n\n const baseClasses = {\n [styles.day]: true,\n [styles['grid-cell']]: true,\n [styles['in-first-row']]: weekIndex === 0,\n [styles['in-first-column']]: dateIndex === 0,\n };\n\n if (!isSameMonth(date, baseDate)) {\n return (\n <td\n key={`${weekIndex}:${dateIndex}`}\n ref={isFocused ? focusedDateRef : undefined}\n className={clsx(baseClasses, {\n [styles['in-previous-month']]: isBefore(date, baseDate),\n [styles['last-day-of-month']]: isLastDayOfMonth(date),\n [styles['in-next-month']]: isAfter(date, baseDate),\n })}\n ></td>\n );\n }\n\n const handlers: React.HTMLAttributes<HTMLDivElement> = {};\n if (isEnabled) {\n handlers.onClick = () => onSelectDate(date);\n handlers.onFocus = () => onFocusedDateChange(date);\n }\n\n // Can't be focused.\n let tabIndex = undefined;\n if (isFocusable && (isEnabled || isDisabledWithReason)) {\n // Next focus target.\n tabIndex = 0;\n } else if (isEnabled || isDisabledWithReason) {\n // Can be focused programmatically.\n tabIndex = -1;\n }\n\n // Screen-reader announcement for the focused day.\n let dayAnnouncement = getDateLabel(locale, date, 'short');\n if (isToday(date)) {\n dayAnnouncement += '. ' + todayAriaLabel;\n }\n\n return (\n <GridCell\n ref={isFocused ? focusedDateRef : undefined}\n key={`${weekIndex}:${dateIndex}`}\n className={clsx(baseClasses, {\n [styles['in-current-month']]: isSameMonth(date, baseDate),\n [styles.enabled]: isEnabled,\n [styles.selected]: isSelected,\n [styles['start-date']]: isStartDate,\n [styles['end-date']]: isEndDate,\n [styles['range-start-date']]: isRangeStartDate,\n [styles['range-end-date']]: isRangeEndDate,\n [styles['no-range']]: isSelected && onlyOneSelected,\n [styles['in-range']]: dateIsInRange,\n [styles['in-range-border-block-start']]: !!inRangeStartWeek || date.getDate() <= 7,\n [styles['in-range-border-block-end']]:\n !!inRangeEndWeek || date.getDate() > getDaysInMonth(date) - 7,\n [styles['in-range-border-inline-start']]:\n dateIndex === 0 || date.getDate() === 1 || isRangeStartDate,\n [styles['in-range-border-inline-end']]:\n dateIndex === week.length - 1 || isLastDayOfMonth(date) || isRangeEndDate,\n [styles.today]: isToday(date),\n })}\n aria-selected={isEnabled ? isSelected || dateIsInRange : undefined}\n aria-current={isToday(date) ? 'date' : undefined}\n data-date={formatDate(date)}\n aria-disabled={!isEnabled}\n tabIndex={tabIndex}\n disabledReason={isDisabledWithReason ? disabledReason : undefined}\n {...handlers}\n >\n <span className={styles['day-inner']} aria-hidden=\"true\">\n {date.getDate()}\n </span>\n <ScreenreaderOnly>{dayAnnouncement}</ScreenreaderOnly>\n </GridCell>\n );\n })}\n </tr>\n );\n })}\n </tbody>\n </table>\n );\n}\n\nfunction isInRange(date: Date, dateOne: Date | null, dateTwo: Date | null) {\n if (!dateOne || !dateTwo || isSameDay(dateOne, dateTwo)) {\n return false;\n }\n\n const inRange =\n (isAfter(date, dateOne) && isBefore(date, dateTwo)) || (isAfter(date, dateTwo) && isBefore(date, dateOne));\n\n return inRange || isSameDay(date, dateOne) || isSameDay(date, dateTwo);\n}\n"]}