@cloudscape-design/components-themeable 3.0.72 → 3.0.74

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 (154) hide show
  1. package/lib/internal/scss/breadcrumb-group/item/styles.scss +1 -0
  2. package/lib/internal/scss/calendar/styles.scss +19 -28
  3. package/lib/internal/scss/date-range-picker/calendar/grids/{day/styles.scss → styles.scss} +23 -7
  4. package/lib/internal/scss/date-range-picker/styles.scss +5 -27
  5. package/lib/internal/scss/property-filter/styles.scss +16 -6
  6. package/lib/internal/scss/tabs/tab-header-bar.scss +1 -0
  7. package/lib/internal/template/app-layout/toggles/index.d.ts.map +1 -1
  8. package/lib/internal/template/app-layout/toggles/index.js +2 -2
  9. package/lib/internal/template/app-layout/toggles/index.js.map +1 -1
  10. package/lib/internal/template/app-layout/visual-refresh/app-bar.d.ts.map +1 -1
  11. package/lib/internal/template/app-layout/visual-refresh/app-bar.js +2 -2
  12. package/lib/internal/template/app-layout/visual-refresh/app-bar.js.map +1 -1
  13. package/lib/internal/template/app-layout/visual-refresh/navigation.d.ts.map +1 -1
  14. package/lib/internal/template/app-layout/visual-refresh/navigation.js +1 -1
  15. package/lib/internal/template/app-layout/visual-refresh/navigation.js.map +1 -1
  16. package/lib/internal/template/app-layout/visual-refresh/tools.d.ts.map +1 -1
  17. package/lib/internal/template/app-layout/visual-refresh/tools.js +1 -1
  18. package/lib/internal/template/app-layout/visual-refresh/tools.js.map +1 -1
  19. package/lib/internal/template/app-layout/visual-refresh/trigger-button.d.ts.map +1 -1
  20. package/lib/internal/template/app-layout/visual-refresh/trigger-button.js +1 -1
  21. package/lib/internal/template/app-layout/visual-refresh/trigger-button.js.map +1 -1
  22. package/lib/internal/template/breadcrumb-group/item/styles.css.js +7 -7
  23. package/lib/internal/template/breadcrumb-group/item/styles.scoped.css +16 -15
  24. package/lib/internal/template/breadcrumb-group/item/styles.selectors.js +7 -7
  25. package/lib/internal/template/calendar/grid/index.d.ts +2 -2
  26. package/lib/internal/template/calendar/grid/index.d.ts.map +1 -1
  27. package/lib/internal/template/calendar/grid/index.js +64 -23
  28. package/lib/internal/template/calendar/grid/index.js.map +1 -1
  29. package/lib/internal/template/calendar/internal.d.ts.map +1 -1
  30. package/lib/internal/template/calendar/internal.js +3 -15
  31. package/lib/internal/template/calendar/internal.js.map +1 -1
  32. package/lib/internal/template/calendar/styles.css.js +18 -20
  33. package/lib/internal/template/calendar/styles.scoped.css +46 -58
  34. package/lib/internal/template/calendar/styles.selectors.js +18 -20
  35. package/lib/internal/template/date-range-picker/calendar/grids/grid.d.ts +1 -1
  36. package/lib/internal/template/date-range-picker/calendar/grids/grid.d.ts.map +1 -1
  37. package/lib/internal/template/date-range-picker/calendar/grids/grid.js +65 -9
  38. package/lib/internal/template/date-range-picker/calendar/grids/grid.js.map +1 -1
  39. package/lib/internal/template/date-range-picker/calendar/grids/index.d.ts.map +1 -1
  40. package/lib/internal/template/date-range-picker/calendar/grids/index.js +1 -0
  41. package/lib/internal/template/date-range-picker/calendar/grids/index.js.map +1 -1
  42. package/lib/internal/template/date-range-picker/calendar/grids/styles.css.js +30 -0
  43. package/lib/internal/template/date-range-picker/calendar/grids/{day/styles.scoped.css → styles.scoped.css} +60 -40
  44. package/lib/internal/template/date-range-picker/calendar/grids/styles.selectors.js +31 -0
  45. package/lib/internal/template/date-range-picker/index.js +2 -2
  46. package/lib/internal/template/date-range-picker/index.js.map +1 -1
  47. package/lib/internal/template/date-range-picker/styles.css.js +37 -40
  48. package/lib/internal/template/date-range-picker/styles.scoped.css +48 -67
  49. package/lib/internal/template/date-range-picker/styles.selectors.js +37 -40
  50. package/lib/internal/template/expandable-section/expandable-section-header.d.ts +3 -2
  51. package/lib/internal/template/expandable-section/expandable-section-header.d.ts.map +1 -1
  52. package/lib/internal/template/expandable-section/expandable-section-header.js +3 -3
  53. package/lib/internal/template/expandable-section/expandable-section-header.js.map +1 -1
  54. package/lib/internal/template/expandable-section/interfaces.d.ts +5 -0
  55. package/lib/internal/template/expandable-section/interfaces.d.ts.map +1 -1
  56. package/lib/internal/template/expandable-section/interfaces.js.map +1 -1
  57. package/lib/internal/template/expandable-section/internal.d.ts +1 -1
  58. package/lib/internal/template/expandable-section/internal.d.ts.map +1 -1
  59. package/lib/internal/template/expandable-section/internal.js +4 -3
  60. package/lib/internal/template/expandable-section/internal.js.map +1 -1
  61. package/lib/internal/template/internal/base-component/styles.scoped.css +13 -13
  62. package/lib/internal/template/internal/components/dropdown-status/index.d.ts +3 -1
  63. package/lib/internal/template/internal/components/dropdown-status/index.d.ts.map +1 -1
  64. package/lib/internal/template/internal/components/dropdown-status/index.js +7 -4
  65. package/lib/internal/template/internal/components/dropdown-status/index.js.map +1 -1
  66. package/lib/internal/template/internal/components/live-region/index.d.ts.map +1 -1
  67. package/lib/internal/template/internal/components/live-region/index.js +1 -0
  68. package/lib/internal/template/internal/components/live-region/index.js.map +1 -1
  69. package/lib/internal/template/internal/environment.js +1 -1
  70. package/lib/internal/template/internal/generated/styles/tokens.js +2 -2
  71. package/lib/internal/template/internal/generated/theming/index.cjs +3 -3
  72. package/lib/internal/template/internal/generated/theming/index.js +3 -3
  73. package/lib/internal/template/modal/internal.d.ts.map +1 -1
  74. package/lib/internal/template/modal/internal.js +6 -10
  75. package/lib/internal/template/modal/internal.js.map +1 -1
  76. package/lib/internal/template/multiselect/internal.d.ts.map +1 -1
  77. package/lib/internal/template/multiselect/internal.js +3 -2
  78. package/lib/internal/template/multiselect/internal.js.map +1 -1
  79. package/lib/internal/template/package-lock.json +3 -3
  80. package/lib/internal/template/property-filter/controller.d.ts +2 -0
  81. package/lib/internal/template/property-filter/controller.d.ts.map +1 -1
  82. package/lib/internal/template/property-filter/controller.js +37 -0
  83. package/lib/internal/template/property-filter/controller.js.map +1 -1
  84. package/lib/internal/template/property-filter/index.d.ts.map +1 -1
  85. package/lib/internal/template/property-filter/index.js +21 -6
  86. package/lib/internal/template/property-filter/index.js.map +1 -1
  87. package/lib/internal/template/property-filter/interfaces.d.ts +9 -2
  88. package/lib/internal/template/property-filter/interfaces.d.ts.map +1 -1
  89. package/lib/internal/template/property-filter/interfaces.js +2 -0
  90. package/lib/internal/template/property-filter/interfaces.js.map +1 -1
  91. package/lib/internal/template/property-filter/property-editor.d.ts +13 -0
  92. package/lib/internal/template/property-filter/property-editor.d.ts.map +1 -0
  93. package/lib/internal/template/property-filter/property-editor.js +18 -0
  94. package/lib/internal/template/property-filter/property-editor.js.map +1 -0
  95. package/lib/internal/template/property-filter/property-filter-autosuggest.d.ts +1 -0
  96. package/lib/internal/template/property-filter/property-filter-autosuggest.d.ts.map +1 -1
  97. package/lib/internal/template/property-filter/property-filter-autosuggest.js +17 -3
  98. package/lib/internal/template/property-filter/property-filter-autosuggest.js.map +1 -1
  99. package/lib/internal/template/property-filter/styles.css.js +32 -24
  100. package/lib/internal/template/property-filter/styles.scoped.css +45 -27
  101. package/lib/internal/template/property-filter/styles.selectors.js +32 -24
  102. package/lib/internal/template/property-filter/token-editor.d.ts.map +1 -1
  103. package/lib/internal/template/property-filter/token-editor.js +17 -4
  104. package/lib/internal/template/property-filter/token-editor.js.map +1 -1
  105. package/lib/internal/template/property-filter/token.d.ts.map +1 -1
  106. package/lib/internal/template/property-filter/token.js +6 -3
  107. package/lib/internal/template/property-filter/token.js.map +1 -1
  108. package/lib/internal/template/select/internal.d.ts.map +1 -1
  109. package/lib/internal/template/select/internal.js +3 -2
  110. package/lib/internal/template/select/internal.js.map +1 -1
  111. package/lib/internal/template/select/parts/filter.d.ts +1 -1
  112. package/lib/internal/template/select/utils/use-select.d.ts +15 -1
  113. package/lib/internal/template/select/utils/use-select.d.ts.map +1 -1
  114. package/lib/internal/template/select/utils/use-select.js +11 -1
  115. package/lib/internal/template/select/utils/use-select.js.map +1 -1
  116. package/lib/internal/template/split-panel/index.d.ts.map +1 -1
  117. package/lib/internal/template/split-panel/index.js +8 -6
  118. package/lib/internal/template/split-panel/index.js.map +1 -1
  119. package/lib/internal/template/split-panel/interfaces.d.ts +1 -0
  120. package/lib/internal/template/split-panel/interfaces.d.ts.map +1 -1
  121. package/lib/internal/template/split-panel/interfaces.js.map +1 -1
  122. package/lib/internal/template/split-panel/utils/use-pointer-events.d.ts +1 -1
  123. package/lib/internal/template/split-panel/utils/use-pointer-events.d.ts.map +1 -1
  124. package/lib/internal/template/split-panel/utils/use-pointer-events.js +9 -5
  125. package/lib/internal/template/split-panel/utils/use-pointer-events.js.map +1 -1
  126. package/lib/internal/template/table/header-cell/styles.css.js +14 -14
  127. package/lib/internal/template/table/header-cell/styles.scoped.css +25 -25
  128. package/lib/internal/template/table/header-cell/styles.selectors.js +14 -14
  129. package/lib/internal/template/table/internal.d.ts.map +1 -1
  130. package/lib/internal/template/table/internal.js +8 -1
  131. package/lib/internal/template/table/internal.js.map +1 -1
  132. package/lib/internal/template/table/use-mouse-down-target.d.ts +6 -0
  133. package/lib/internal/template/table/use-mouse-down-target.d.ts.map +1 -0
  134. package/lib/internal/template/table/use-mouse-down-target.js +30 -0
  135. package/lib/internal/template/table/use-mouse-down-target.js.map +1 -0
  136. package/lib/internal/template/tabs/styles.css.js +21 -21
  137. package/lib/internal/template/tabs/styles.scoped.css +38 -37
  138. package/lib/internal/template/tabs/styles.selectors.js +21 -21
  139. package/lib/internal/template/test-utils/dom/date-range-picker/index.js +2 -2
  140. package/lib/internal/template/test-utils/dom/date-range-picker/index.js.map +1 -1
  141. package/lib/internal/template/test-utils/selectors/date-range-picker/index.js +2 -2
  142. package/lib/internal/template/test-utils/selectors/date-range-picker/index.js.map +1 -1
  143. package/lib/internal/template/test-utils/tsconfig.tsbuildinfo +1 -1
  144. package/package.json +1 -1
  145. package/lib/internal/template/calendar/grid/day/index.d.ts +0 -15
  146. package/lib/internal/template/calendar/grid/day/index.d.ts.map +0 -1
  147. package/lib/internal/template/calendar/grid/day/index.js +0 -47
  148. package/lib/internal/template/calendar/grid/day/index.js.map +0 -1
  149. package/lib/internal/template/date-range-picker/calendar/grids/day/index.d.ts +0 -27
  150. package/lib/internal/template/date-range-picker/calendar/grids/day/index.d.ts.map +0 -1
  151. package/lib/internal/template/date-range-picker/calendar/grids/day/index.js +0 -95
  152. package/lib/internal/template/date-range-picker/calendar/grids/day/index.js.map +0 -1
  153. package/lib/internal/template/date-range-picker/calendar/grids/day/styles.css.js +0 -26
  154. package/lib/internal/template/date-range-picker/calendar/grids/day/styles.selectors.js +0 -27
@@ -90,11 +90,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
90
90
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
91
91
  SPDX-License-Identifier: Apache-2.0
92
92
  */
93
- .awsui_calendar_1ykar_16ssf_93:not(#\9) {
94
- animation: awsui_awsui-motion-fade-in-0_1ykar_16ssf_1 var(--motion-duration-show-quick-tyaalm, 135ms) var(--motion-easing-show-quick-1fcgbv, ease-out);
93
+ .awsui_calendar_1ykar_1y06z_93:not(#\9) {
94
+ animation: awsui_awsui-motion-fade-in-0_1ykar_1y06z_1 var(--motion-duration-show-quick-tyaalm, 135ms) var(--motion-easing-show-quick-1fcgbv, ease-out);
95
95
  animation-fill-mode: both;
96
96
  }
97
- @keyframes awsui_awsui-motion-fade-in-0_1ykar_16ssf_1 {
97
+ @keyframes awsui_awsui-motion-fade-in-0_1ykar_1y06z_1 {
98
98
  from {
99
99
  opacity: 0;
100
100
  }
@@ -103,12 +103,12 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
103
103
  }
104
104
  }
105
105
  @media (prefers-reduced-motion: reduce) {
106
- .awsui_calendar_1ykar_16ssf_93:not(#\9) {
106
+ .awsui_calendar_1ykar_1y06z_93:not(#\9) {
107
107
  animation: none;
108
108
  transition: none;
109
109
  }
110
110
  }
111
- .awsui-motion-disabled .awsui_calendar_1ykar_16ssf_93:not(#\9), .awsui-mode-entering .awsui_calendar_1ykar_16ssf_93:not(#\9) {
111
+ .awsui-motion-disabled .awsui_calendar_1ykar_1y06z_93:not(#\9), .awsui-mode-entering .awsui_calendar_1ykar_1y06z_93:not(#\9) {
112
112
  animation: none;
113
113
  transition: none;
114
114
  }
@@ -121,11 +121,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
121
121
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
122
122
  SPDX-License-Identifier: Apache-2.0
123
123
  */
124
- .awsui_root_1ykar_16ssf_124:not(#\9) {
124
+ .awsui_root_1ykar_1y06z_124:not(#\9) {
125
125
  /* used in test-utils */
126
126
  }
127
127
 
128
- .awsui_calendar_1ykar_16ssf_93:not(#\9) {
128
+ .awsui_calendar_1ykar_1y06z_93:not(#\9) {
129
129
  display: block;
130
130
  width: var(--size-calendar-grid-width-luenzs, 234px);
131
131
  overflow: auto;
@@ -164,90 +164,75 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
164
164
  font-weight: 400;
165
165
  font-family: var(--font-family-base-mylvzb, "Noto Sans", "Helvetica Neue", Roboto, Arial, sans-serif);
166
166
  }
167
- .awsui_calendar-inner_1ykar_16ssf_141:not(#\9) {
167
+ .awsui_calendar-inner_1ykar_1y06z_141:not(#\9) {
168
168
  margin: var(--space-xs-rsr2qu, 8px);
169
169
  }
170
- .awsui_calendar-header_1ykar_16ssf_144:not(#\9) {
170
+ .awsui_calendar-header_1ykar_1y06z_144:not(#\9) {
171
171
  display: flex;
172
172
  justify-content: space-between;
173
173
  align-items: center;
174
174
  }
175
- .awsui_calendar-header-month_1ykar_16ssf_149:not(#\9) {
175
+ .awsui_calendar-header-month_1ykar_1y06z_149:not(#\9) {
176
176
  font-size: var(--font-body-m-size-sregvd, 14px);
177
177
  line-height: var(--font-body-m-line-height-i7xxvv, 22px);
178
178
  font-weight: 700;
179
179
  color: var(--color-text-dropdown-item-default-ki8ao1, #16191f);
180
180
  }
181
- .awsui_calendar-next-month-btn_1ykar_16ssf_155:not(#\9) {
181
+ .awsui_calendar-next-month-btn_1ykar_1y06z_155:not(#\9) {
182
182
  /* used for identifying element */
183
183
  }
184
- .awsui_calendar-prev-month-btn_1ykar_16ssf_158:not(#\9) {
184
+ .awsui_calendar-prev-month-btn_1ykar_1y06z_158:not(#\9) {
185
185
  /* used for identifying element */
186
186
  }
187
- .awsui_calendar-day-names_1ykar_16ssf_161:not(#\9) {
188
- display: flex;
189
- justify-content: stretch;
187
+ .awsui_calendar-grid_1ykar_1y06z_161:not(#\9) {
188
+ width: 100%;
189
+ border-spacing: 0;
190
190
  }
191
- .awsui_calendar-day-name_1ykar_16ssf_161:not(#\9) {
192
- flex: 1 1 0%;
193
- width: 0;
191
+ .awsui_calendar-grid-cell_1ykar_1y06z_165:not(#\9) {
192
+ width: 14.2857142857%;
194
193
  word-break: break-word;
195
194
  text-align: center;
195
+ font-weight: unset;
196
+ }
197
+ .awsui_calendar-day-header_1ykar_1y06z_171:not(#\9) {
196
198
  padding: var(--space-s-hv8c1d, 12px) 0 var(--space-xxs-ynfts5, 4px);
197
199
  color: var(--color-text-calendar-month-cx7jxx, #545b64);
198
200
  font-size: var(--font-body-s-size-ukw2p9, 12px);
199
201
  line-height: var(--font-body-s-line-height-kdsbrl, 16px);
200
202
  letter-spacing: var(--font-body-s-letter-spacing-p88gax, normal);
201
203
  }
202
- .awsui_calendar-dates_1ykar_16ssf_176:not(#\9) {
203
- border: 1px solid var(--color-border-calendar-grid-54zscx, #eaeded);
204
- }
205
- .awsui_calendar-week_1ykar_16ssf_179:not(#\9) {
206
- display: flex;
207
- justify-content: stretch;
208
- }
209
- .awsui_calendar-day_1ykar_16ssf_161:not(#\9) {
210
- flex: 1 1 0%;
211
- width: 0;
212
- word-break: break-word;
213
- text-align: center;
204
+ .awsui_calendar-day_1ykar_1y06z_171:not(#\9) {
214
205
  border-bottom: 1px solid var(--color-border-calendar-grid-54zscx, #eaeded);
215
206
  border-right: 1px solid var(--color-border-calendar-grid-54zscx, #eaeded);
216
207
  padding: var(--space-xxs-ynfts5, 4px) 0;
217
208
  color: var(--color-text-dropdown-item-disabled-dgi2f4, #aab7b8);
218
209
  position: relative;
219
210
  }
220
- .awsui_calendar-day_1ykar_16ssf_161:not(#\9):last-child {
221
- border-right: none;
222
- }
223
- .awsui_calendar-day-in-last-week_1ykar_16ssf_197:not(#\9) {
224
- border-bottom: none;
211
+ .awsui_calendar-day_1ykar_1y06z_171:not(#\9):first-child {
212
+ border-left: 1px solid var(--color-border-calendar-grid-54zscx, #eaeded);
225
213
  }
226
- .awsui_calendar-day-focusable_1ykar_16ssf_200:not(#\9) {
227
- /* used for identifying element */
228
- }
229
- .awsui_calendar-day-enabled_1ykar_16ssf_203:not(#\9) {
214
+ .awsui_calendar-day-enabled_1ykar_1y06z_188:not(#\9) {
230
215
  cursor: pointer;
231
216
  color: var(--color-text-dropdown-item-secondary-8hw5go, #687078);
232
217
  }
233
- .awsui_calendar-day-enabled_1ykar_16ssf_203:not(#\9)::after {
218
+ .awsui_calendar-day-enabled_1ykar_1y06z_188:not(#\9)::after {
234
219
  border-radius: var(--border-radius-item-wjpc1f, 0px);
235
220
  }
236
- .awsui_calendar-day-enabled_1ykar_16ssf_203.awsui_calendar-day-current-month_1ykar_16ssf_210:not(#\9) {
221
+ .awsui_calendar-day-enabled_1ykar_1y06z_188.awsui_calendar-day-current-month_1ykar_1y06z_195:not(#\9) {
237
222
  color: var(--color-text-dropdown-item-default-ki8ao1, #16191f);
238
223
  }
239
- .awsui_calendar-day-enabled_1ykar_16ssf_203.awsui_calendar-day-current-month_1ykar_16ssf_210:not(#\9):hover {
224
+ .awsui_calendar-day-enabled_1ykar_1y06z_188.awsui_calendar-day-current-month_1ykar_1y06z_195:not(#\9):hover {
240
225
  color: var(--color-text-calendar-day-hover-p7s945, #16191f);
241
226
  background-color: var(--color-background-dropdown-item-hover-hgdj8r, #f2f3f3);
242
227
  }
243
- .awsui_calendar-day-enabled_1ykar_16ssf_203.awsui_calendar-day-current-month_1ykar_16ssf_210:not(#\9):hover:not(.awsui_calendar-day-selected_1ykar_16ssf_217)::after {
228
+ .awsui_calendar-day-enabled_1ykar_1y06z_188.awsui_calendar-day-current-month_1ykar_1y06z_195:not(#\9):hover:not(.awsui_calendar-day-selected_1ykar_1y06z_202)::after {
244
229
  border: var(--border-item-width-yvnixs, 1px) solid var(--color-border-dropdown-item-hover-d32f3f, #879596);
245
230
  }
246
- .awsui_calendar-day-today_1ykar_16ssf_220:not(#\9) {
231
+ .awsui_calendar-day-today_1ykar_1y06z_205:not(#\9) {
247
232
  background-color: var(--color-background-calendar-today-wm2baz, #f2f3f3);
248
233
  border-radius: var(--border-radius-item-wjpc1f, 0px);
249
234
  }
250
- .awsui_calendar-day_1ykar_16ssf_161:not(#\9)::after {
235
+ .awsui_calendar-day_1ykar_1y06z_171:not(#\9)::after {
251
236
  content: "";
252
237
  position: absolute;
253
238
  z-index: 1;
@@ -257,21 +242,21 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
257
242
  right: calc(-1 * var(--border-item-width-yvnixs, 1px));
258
243
  background-color: transparent;
259
244
  }
260
- .awsui_calendar-day_1ykar_16ssf_161 > .awsui_day-inner_1ykar_16ssf_234:not(#\9) {
245
+ .awsui_calendar-day_1ykar_1y06z_171 > .awsui_day-inner_1ykar_1y06z_219:not(#\9) {
261
246
  position: relative;
262
247
  z-index: 1;
263
248
  }
264
- .awsui_calendar-day_1ykar_16ssf_161:not(#\9):focus {
249
+ .awsui_calendar-day_1ykar_1y06z_171:not(#\9):focus {
265
250
  outline: none;
266
251
  }
267
- .awsui_calendar-day_1ykar_16ssf_161:not(#\9):focus[data-awsui-focus-visible=true]:focus {
252
+ .awsui_calendar-day_1ykar_1y06z_171:not(#\9):focus[data-awsui-focus-visible=true]:focus {
268
253
  position: relative;
269
254
  }
270
- .awsui_calendar-day_1ykar_16ssf_161:not(#\9):focus[data-awsui-focus-visible=true]:focus {
255
+ .awsui_calendar-day_1ykar_1y06z_171:not(#\9):focus[data-awsui-focus-visible=true]:focus {
271
256
  outline: 2px dotted transparent;
272
257
  outline-offset: calc(var(--space-calendar-grid-focus-outline-gutter-lbmex4, 0px) - 1px);
273
258
  }
274
- .awsui_calendar-day_1ykar_16ssf_161:not(#\9):focus[data-awsui-focus-visible=true]:focus::before {
259
+ .awsui_calendar-day_1ykar_1y06z_171:not(#\9):focus[data-awsui-focus-visible=true]:focus::before {
275
260
  content: " ";
276
261
  display: block;
277
262
  position: absolute;
@@ -282,22 +267,22 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
282
267
  border-radius: var(--border-radius-calendar-day-focus-ring-16ha5s, 2px);
283
268
  box-shadow: 0 0 0 2px var(--color-border-item-focused-n5kd8g, #0073bb);
284
269
  }
285
- .awsui_calendar-day_1ykar_16ssf_161:not(#\9):focus[data-awsui-focus-visible=true]:focus::before {
270
+ .awsui_calendar-day_1ykar_1y06z_171:not(#\9):focus[data-awsui-focus-visible=true]:focus::before {
286
271
  z-index: 2;
287
272
  }
288
- .awsui_calendar-day-selected_1ykar_16ssf_217:not(#\9) {
273
+ .awsui_calendar-day-selected_1ykar_1y06z_202:not(#\9) {
289
274
  border-color: transparent;
290
275
  position: relative;
291
276
  z-index: 2;
292
277
  }
293
- .awsui_calendar-day-selected_1ykar_16ssf_217:not(#\9):focus[data-awsui-focus-visible=true]:focus {
278
+ .awsui_calendar-day-selected_1ykar_1y06z_202:not(#\9):focus[data-awsui-focus-visible=true]:focus {
294
279
  position: relative;
295
280
  }
296
- .awsui_calendar-day-selected_1ykar_16ssf_217:not(#\9):focus[data-awsui-focus-visible=true]:focus {
281
+ .awsui_calendar-day-selected_1ykar_1y06z_202:not(#\9):focus[data-awsui-focus-visible=true]:focus {
297
282
  outline: 2px dotted transparent;
298
283
  outline-offset: calc(var(--space-calendar-grid-focus-outline-gutter-lbmex4, 0px) - 1px);
299
284
  }
300
- .awsui_calendar-day-selected_1ykar_16ssf_217:not(#\9):focus[data-awsui-focus-visible=true]:focus::before {
285
+ .awsui_calendar-day-selected_1ykar_1y06z_202:not(#\9):focus[data-awsui-focus-visible=true]:focus::before {
301
286
  content: " ";
302
287
  display: block;
303
288
  position: absolute;
@@ -308,16 +293,19 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
308
293
  border-radius: var(--border-radius-calendar-day-focus-ring-16ha5s, 2px);
309
294
  box-shadow: 0 0 0 2px var(--color-border-calendar-grid-selected-focus-ring-vzbqhb, #0073bb);
310
295
  }
311
- .awsui_calendar-day-selected_1ykar_16ssf_217:not(#\9):focus[data-awsui-focus-visible=true]:focus::before {
296
+ .awsui_calendar-day-selected_1ykar_1y06z_202:not(#\9):focus[data-awsui-focus-visible=true]:focus::before {
312
297
  z-index: 2;
313
298
  }
314
- .awsui_calendar-day-selected_1ykar_16ssf_217:not(#\9)::after {
299
+ .awsui_calendar-day-selected_1ykar_1y06z_202:not(#\9)::after {
315
300
  background-color: var(--color-background-control-checked-dyuc53, #0073bb);
316
301
  border: var(--border-item-width-yvnixs, 1px) solid var(--color-background-control-checked-dyuc53, #0073bb);
317
302
  border-radius: var(--border-radius-item-wjpc1f, 0px);
318
303
  }
319
- .awsui_calendar-day-selected_1ykar_16ssf_217 > .awsui_day-inner_1ykar_16ssf_234:not(#\9) {
304
+ .awsui_calendar-day-selected_1ykar_1y06z_202 > .awsui_day-inner_1ykar_1y06z_219:not(#\9) {
320
305
  z-index: 2;
321
306
  color: var(--color-background-control-default-8xmy94, #ffffff);
322
307
  position: relative;
308
+ }
309
+ .awsui_calendar-week_1ykar_1y06z_283:not(#\9):first-child > .awsui_calendar-day_1ykar_1y06z_171 {
310
+ border-top: 1px solid var(--color-border-calendar-grid-54zscx, #eaeded);
323
311
  }
@@ -2,25 +2,23 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "calendar": "awsui_calendar_1ykar_16ssf_93",
6
- "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1ykar_16ssf_1",
7
- "root": "awsui_root_1ykar_16ssf_124",
8
- "calendar-inner": "awsui_calendar-inner_1ykar_16ssf_141",
9
- "calendar-header": "awsui_calendar-header_1ykar_16ssf_144",
10
- "calendar-header-month": "awsui_calendar-header-month_1ykar_16ssf_149",
11
- "calendar-next-month-btn": "awsui_calendar-next-month-btn_1ykar_16ssf_155",
12
- "calendar-prev-month-btn": "awsui_calendar-prev-month-btn_1ykar_16ssf_158",
13
- "calendar-day-names": "awsui_calendar-day-names_1ykar_16ssf_161",
14
- "calendar-day-name": "awsui_calendar-day-name_1ykar_16ssf_161",
15
- "calendar-dates": "awsui_calendar-dates_1ykar_16ssf_176",
16
- "calendar-week": "awsui_calendar-week_1ykar_16ssf_179",
17
- "calendar-day": "awsui_calendar-day_1ykar_16ssf_161",
18
- "calendar-day-in-last-week": "awsui_calendar-day-in-last-week_1ykar_16ssf_197",
19
- "calendar-day-focusable": "awsui_calendar-day-focusable_1ykar_16ssf_200",
20
- "calendar-day-enabled": "awsui_calendar-day-enabled_1ykar_16ssf_203",
21
- "calendar-day-current-month": "awsui_calendar-day-current-month_1ykar_16ssf_210",
22
- "calendar-day-selected": "awsui_calendar-day-selected_1ykar_16ssf_217",
23
- "calendar-day-today": "awsui_calendar-day-today_1ykar_16ssf_220",
24
- "day-inner": "awsui_day-inner_1ykar_16ssf_234"
5
+ "calendar": "awsui_calendar_1ykar_1y06z_93",
6
+ "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1ykar_1y06z_1",
7
+ "root": "awsui_root_1ykar_1y06z_124",
8
+ "calendar-inner": "awsui_calendar-inner_1ykar_1y06z_141",
9
+ "calendar-header": "awsui_calendar-header_1ykar_1y06z_144",
10
+ "calendar-header-month": "awsui_calendar-header-month_1ykar_1y06z_149",
11
+ "calendar-next-month-btn": "awsui_calendar-next-month-btn_1ykar_1y06z_155",
12
+ "calendar-prev-month-btn": "awsui_calendar-prev-month-btn_1ykar_1y06z_158",
13
+ "calendar-grid": "awsui_calendar-grid_1ykar_1y06z_161",
14
+ "calendar-grid-cell": "awsui_calendar-grid-cell_1ykar_1y06z_165",
15
+ "calendar-day-header": "awsui_calendar-day-header_1ykar_1y06z_171",
16
+ "calendar-day": "awsui_calendar-day_1ykar_1y06z_171",
17
+ "calendar-day-enabled": "awsui_calendar-day-enabled_1ykar_1y06z_188",
18
+ "calendar-day-current-month": "awsui_calendar-day-current-month_1ykar_1y06z_195",
19
+ "calendar-day-selected": "awsui_calendar-day-selected_1ykar_1y06z_202",
20
+ "calendar-day-today": "awsui_calendar-day-today_1ykar_1y06z_205",
21
+ "day-inner": "awsui_day-inner_1ykar_1y06z_219",
22
+ "calendar-week": "awsui_calendar-week_1ykar_1y06z_283"
25
23
  };
26
24
 
@@ -8,7 +8,7 @@ export interface GridProps {
8
8
  rangeStartDate: Date | null;
9
9
  rangeEndDate: Date | null;
10
10
  focusedDate: Date | null;
11
- focusedDateRef: React.RefObject<HTMLDivElement>;
11
+ focusedDateRef: React.RefObject<HTMLTableCellElement>;
12
12
  onSelectDate: DateChangeHandler;
13
13
  onGridKeyDownHandler: (e: React.KeyboardEvent) => void;
14
14
  onFocusedDateChange: React.Dispatch<React.SetStateAction<Date | null>>;
@@ -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;AAKvC,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AACvD,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAKxD,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,cAAc,CAAC,CAAC;IAEhD,YAAY,EAAE,iBAAiB,CAAC;IAChC,oBAAoB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,CAAC;IACvD,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,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,EAEd,SAAS,GACV,EAAE,SAAS,eA0EX"}
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,iBAAiB,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AACvD,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAOxD,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,iBAAiB,CAAC;IAChC,oBAAoB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,CAAC;IACvD,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,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,EAEd,SAAS,GACV,EAAE,SAAS,eAmIX"}
@@ -1,13 +1,15 @@
1
+ import { __assign } from "tslib";
1
2
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
3
  // SPDX-License-Identifier: Apache-2.0
3
4
  import React, { useMemo } from 'react';
4
- import styles from '../../styles.css.js';
5
- import GridDay from './day';
6
- import { isSameMonth, isAfter, isBefore, isSameDay, addWeeks, addDays } from 'date-fns';
5
+ import styles from './styles.css.js';
6
+ import { isSameMonth, isAfter, isBefore, isSameDay, addWeeks, addDays, isLastDayOfMonth, getDaysInMonth, isToday, } from 'date-fns';
7
7
  import { getCalendarMonth } from 'mnth';
8
8
  import rotateDayIndexes from '../../../calendar/utils/rotate-day-indexes';
9
- import { renderDayName } from '../../../calendar/utils/intl';
9
+ import { getDateLabel, renderDayName } from '../../../calendar/utils/intl';
10
10
  import clsx from 'clsx';
11
+ import { formatDate } from '../../../internal/utils/date-time';
12
+ import useFocusVisible from '../../../internal/hooks/focus-visible/index.js';
11
13
  export function Grid(_a) {
12
14
  var baseDate = _a.baseDate, selectedStartDate = _a.selectedStartDate, selectedEndDate = _a.selectedEndDate, rangeStartDate = _a.rangeStartDate, rangeEndDate = _a.rangeEndDate, focusedDate = _a.focusedDate, focusedDateRef = _a.focusedDateRef, onSelectDate = _a.onSelectDate, onGridKeyDownHandler = _a.onGridKeyDownHandler, onFocusedDateChange = _a.onFocusedDateChange, isDateEnabled = _a.isDateEnabled, locale = _a.locale, startOfWeek = _a.startOfWeek, todayAriaLabel = _a.todayAriaLabel, className = _a.className;
13
15
  var baseDateTime = baseDate === null || baseDate === void 0 ? void 0 : baseDate.getTime();
@@ -15,10 +17,13 @@ export function Grid(_a) {
15
17
  var weeks = useMemo(function () { return getCalendarMonth(baseDate, { firstDayOfWeek: startOfWeek }); },
16
18
  // eslint-disable-next-line react-hooks/exhaustive-deps
17
19
  [baseDateTime, startOfWeek]);
18
- return (React.createElement("div", { className: clsx(styles.grid, className) },
19
- React.createElement("div", { className: styles['calendar-day-names'] }, rotateDayIndexes(startOfWeek).map(function (i) { return (React.createElement("div", { key: "day-name-".concat(i), className: styles['calendar-day-name'] }, renderDayName(locale, i))); })),
20
- React.createElement("div", { className: styles['calendar-dates'], onKeyDown: onGridKeyDownHandler }, weeks.map(function (week, weekIndex) {
21
- return (React.createElement("div", { key: "week-".concat(weekIndex), className: styles['calendar-week'] }, week.map(function (date, dateIndex) {
20
+ var focusVisible = useFocusVisible();
21
+ return (React.createElement("table", { role: "none", className: clsx(styles.grid, className) },
22
+ React.createElement("thead", null,
23
+ React.createElement("tr", null, rotateDayIndexes(startOfWeek).map(function (dayIndex) { return (React.createElement("th", { key: dayIndex, scope: "col", className: clsx(styles['grid-cell'], styles['day-header']) }, renderDayName(locale, dayIndex))); }))),
24
+ React.createElement("tbody", { onKeyDown: onGridKeyDownHandler }, weeks.map(function (week, weekIndex) {
25
+ return (React.createElement("tr", { key: weekIndex, className: styles.week }, week.map(function (date, dateIndex) {
26
+ var _a, _b, _c;
22
27
  var isStartDate = !!selectedStartDate && isSameDay(date, selectedStartDate);
23
28
  var isEndDate = !!selectedEndDate && isSameDay(date, selectedEndDate);
24
29
  var isSelected = isStartDate || isEndDate;
@@ -31,7 +36,58 @@ export function Grid(_a) {
31
36
  var onlyOneSelected = !!rangeStartDate && !!rangeEndDate
32
37
  ? isSameDay(rangeStartDate, rangeEndDate)
33
38
  : !selectedStartDate || !selectedEndDate;
34
- return (React.createElement(GridDay, { key: "date-".concat(weekIndex, "-").concat(dateIndex), locale: locale, baseDate: baseDate, isSelected: isSelected, isStartDate: isStartDate, isEndDate: isEndDate, onlyOneSelected: onlyOneSelected, isRangeStartDate: isRangeStartDate, isRangeEndDate: isRangeEndDate, date: date, isFocusedDate: isFocused, ref: isFocused ? focusedDateRef : undefined, todayAriaLabel: todayAriaLabel, onSelectDate: onSelectDate, onFocusDate: onFocusedDateChange, isInRange: dateIsInRange, isDateEnabled: isDateEnabled, isDateInFirstRow: weekIndex === 0, isDateInFirstColumn: dateIndex === 0, isDateInLastColumn: dateIndex === week.length - 1, isDateInSelectionStartWeek: !!inRangeStartWeek, isDateInSelectionEndWeek: !!inRangeEndWeek }));
39
+ var isEnabled = !isDateEnabled || isDateEnabled(date);
40
+ var isFocusable = isFocused && isEnabled;
41
+ var baseClasses = (_a = {},
42
+ _a[styles.day] = true,
43
+ _a[styles['grid-cell']] = true,
44
+ _a[styles['in-first-row']] = weekIndex === 0,
45
+ _a[styles['in-first-column']] = dateIndex === 0,
46
+ _a);
47
+ if (!isSameMonth(date, baseDate)) {
48
+ return (React.createElement("td", { key: "".concat(weekIndex, ":").concat(dateIndex), ref: isFocused ? focusedDateRef : undefined, className: clsx(baseClasses, (_b = {},
49
+ _b[styles['in-previous-month']] = isBefore(date, baseDate),
50
+ _b[styles['last-day-of-month']] = isLastDayOfMonth(date),
51
+ _b[styles['in-next-month']] = isAfter(date, baseDate),
52
+ _b)) }));
53
+ }
54
+ var handlers = {};
55
+ if (isEnabled) {
56
+ handlers.onClick = function () { return onSelectDate(date); };
57
+ handlers.onFocus = function () { return onFocusedDateChange(date); };
58
+ }
59
+ // Can't be focused.
60
+ var tabIndex = undefined;
61
+ if (isFocusable && isEnabled) {
62
+ // Next focus target.
63
+ tabIndex = 0;
64
+ }
65
+ else if (isEnabled) {
66
+ // Can be focused programmatically.
67
+ tabIndex = -1;
68
+ }
69
+ // Screen-reader announcement for the focused day.
70
+ var dayAnnouncement = getDateLabel(locale, date);
71
+ if (isToday(date)) {
72
+ dayAnnouncement += '. ' + todayAriaLabel;
73
+ }
74
+ return (React.createElement("td", __assign({ ref: isFocused ? focusedDateRef : undefined, key: "".concat(weekIndex, ":").concat(dateIndex), className: clsx(baseClasses, (_c = {},
75
+ _c[styles['in-current-month']] = isSameMonth(date, baseDate),
76
+ _c[styles.enabled] = isEnabled,
77
+ _c[styles.selected] = isSelected,
78
+ _c[styles['start-date']] = isStartDate,
79
+ _c[styles['end-date']] = isEndDate,
80
+ _c[styles['range-start-date']] = isRangeStartDate,
81
+ _c[styles['range-end-date']] = isRangeEndDate,
82
+ _c[styles['no-range']] = isSelected && onlyOneSelected,
83
+ _c[styles['in-range']] = dateIsInRange,
84
+ _c[styles['in-range-border-top']] = !!inRangeStartWeek || date.getDate() <= 7,
85
+ _c[styles['in-range-border-bottom']] = !!inRangeEndWeek || date.getDate() > getDaysInMonth(date) - 7,
86
+ _c[styles['in-range-border-left']] = dateIndex === 0 || date.getDate() === 1 || isRangeStartDate,
87
+ _c[styles['in-range-border-right']] = dateIndex === week.length - 1 || isLastDayOfMonth(date) || isRangeEndDate,
88
+ _c[styles.today] = isToday(date),
89
+ _c)), "aria-label": dayAnnouncement, "aria-pressed": isSelected || dateIsInRange, "aria-current": isToday(date) ? 'date' : undefined, "data-date": formatDate(date), role: "button", tabIndex: tabIndex }, handlers, focusVisible),
90
+ React.createElement("span", { className: styles['day-inner'] }, date.getDate())));
35
91
  })));
36
92
  }))));
37
93
  }
@@ -1 +1 @@
1
- {"version":3,"file":"grid.js","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/grids/grid.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,MAAM,MAAM,qBAAqB,CAAC;AACzC,OAAO,OAAO,MAAM,OAAO,CAAC;AAC5B,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACxF,OAAO,EAAE,gBAAgB,EAAE,MAAM,MAAM,CAAC;AAGxC,OAAO,gBAAgB,MAAM,4CAA4C,CAAC;AAC1E,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAC7D,OAAO,IAAI,MAAM,MAAM,CAAC;AA0BxB,MAAM,UAAU,IAAI,CAAC,EAqBT;QApBV,QAAQ,cAAA,EACR,iBAAiB,uBAAA,EACjB,eAAe,qBAAA,EACf,cAAc,oBAAA,EACd,YAAY,kBAAA,EACZ,WAAW,iBAAA,EAEX,cAAc,oBAAA,EAEd,YAAY,kBAAA,EACZ,oBAAoB,0BAAA,EACpB,mBAAmB,yBAAA,EAEnB,aAAa,mBAAA,EAEb,MAAM,YAAA,EACN,WAAW,iBAAA,EACX,cAAc,oBAAA,EAEd,SAAS,eAAA;IAET,IAAM,YAAY,GAAG,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,OAAO,EAAE,CAAC;IACzC,mEAAmE;IACnE,IAAM,KAAK,GAAG,OAAO,CACnB,cAAM,OAAA,gBAAgB,CAAC,QAAQ,EAAE,EAAE,cAAc,EAAE,WAAW,EAAE,CAAC,EAA3D,CAA2D;IACjE,uDAAuD;IACvD,CAAC,YAAY,EAAE,WAAW,CAAC,CAC5B,CAAC;IAEF,OAAO,CACL,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC;QAC1C,6BAAK,SAAS,EAAE,MAAM,CAAC,oBAAoB,CAAC,IACzC,gBAAgB,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,UAAA,CAAC,IAAI,OAAA,CACtC,6BAAK,GAAG,EAAE,mBAAY,CAAC,CAAE,EAAE,SAAS,EAAE,MAAM,CAAC,mBAAmB,CAAC,IAC9D,aAAa,CAAC,MAAM,EAAE,CAAC,CAAC,CACrB,CACP,EAJuC,CAIvC,CAAC,CACE;QACN,6BAAK,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC,EAAE,SAAS,EAAE,oBAAoB,IACtE,KAAK,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,SAAS;YACzB,OAAO,CACL,6BAAK,GAAG,EAAE,eAAQ,SAAS,CAAE,EAAE,SAAS,EAAE,MAAM,CAAC,eAAe,CAAC,IAC9D,IAAI,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,SAAS;gBACxB,IAAM,WAAW,GAAG,CAAC,CAAC,iBAAiB,IAAI,SAAS,CAAC,IAAI,EAAE,iBAAiB,CAAC,CAAC;gBAC9E,IAAM,SAAS,GAAG,CAAC,CAAC,eAAe,IAAI,SAAS,CAAC,IAAI,EAAE,eAAe,CAAC,CAAC;gBACxE,IAAM,UAAU,GAAG,WAAW,IAAI,SAAS,CAAC;gBAC5C,IAAM,gBAAgB,GAAG,CAAC,CAAC,cAAc,IAAI,SAAS,CAAC,IAAI,EAAE,cAAc,CAAC,CAAC;gBAC7E,IAAM,cAAc,GAAG,CAAC,CAAC,YAAY,IAAI,SAAS,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC;gBAEvE,IAAM,SAAS,GAAG,CAAC,CAAC,WAAW,IAAI,SAAS,CAAC,IAAI,EAAE,WAAW,CAAC,IAAI,WAAW,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;gBAE/F,IAAM,aAAa,GAAG,WAAW,IAAI,SAAS,IAAI,SAAS,CAAC,IAAI,EAAE,cAAc,EAAE,YAAY,CAAC,CAAC;gBAChG,IAAM,gBAAgB,GACpB,cAAc,IAAI,SAAS,CAAC,IAAI,EAAE,cAAc,EAAE,OAAO,CAAC,QAAQ,CAAC,cAAc,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;gBAC9F,IAAM,cAAc,GAClB,YAAY,IAAI,SAAS,CAAC,IAAI,EAAE,YAAY,EAAE,OAAO,CAAC,QAAQ,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;gBACxF,IAAM,eAAe,GACnB,CAAC,CAAC,cAAc,IAAI,CAAC,CAAC,YAAY;oBAChC,CAAC,CAAC,SAAS,CAAC,cAAc,EAAE,YAAY,CAAC;oBACzC,CAAC,CAAC,CAAC,iBAAiB,IAAI,CAAC,eAAe,CAAC;gBAE7C,OAAO,CACL,oBAAC,OAAO,IACN,GAAG,EAAE,eAAQ,SAAS,cAAI,SAAS,CAAE,EACrC,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,eAAe,EAAE,eAAe,EAChC,gBAAgB,EAAE,gBAAgB,EAClC,cAAc,EAAE,cAAc,EAC9B,IAAI,EAAE,IAAI,EACV,aAAa,EAAE,SAAS,EACxB,GAAG,EAAE,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS,EAC3C,cAAc,EAAE,cAAc,EAC9B,YAAY,EAAE,YAAY,EAC1B,WAAW,EAAE,mBAAmB,EAChC,SAAS,EAAE,aAAa,EACxB,aAAa,EAAE,aAAa,EAC5B,gBAAgB,EAAE,SAAS,KAAK,CAAC,EACjC,mBAAmB,EAAE,SAAS,KAAK,CAAC,EACpC,kBAAkB,EAAE,SAAS,KAAK,IAAI,CAAC,MAAM,GAAG,CAAC,EACjD,0BAA0B,EAAE,CAAC,CAAC,gBAAgB,EAC9C,wBAAwB,EAAE,CAAC,CAAC,cAAc,GAC1C,CACH,CAAC;YACJ,CAAC,CAAC,CACE,CACP,CAAC;QACJ,CAAC,CAAC,CACE,CACF,CACP,CAAC;AACJ,CAAC;AAED,SAAS,SAAS,CAAC,IAAU,EAAE,OAAoB,EAAE,OAAoB;IACvE,IAAI,CAAC,OAAO,IAAI,CAAC,OAAO,IAAI,SAAS,CAAC,OAAO,EAAE,OAAO,CAAC,EAAE;QACvD,OAAO,KAAK,CAAC;KACd;IAED,IAAM,OAAO,GACX,CAAC,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,IAAI,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,IAAI,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC;IAE7G,OAAO,OAAO,IAAI,SAAS,CAAC,IAAI,EAAE,OAAO,CAAC,IAAI,SAAS,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;AACzE,CAAC","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 GridDay from './day';\nimport { isSameMonth, isAfter, isBefore, isSameDay, addWeeks, addDays } from 'date-fns';\nimport { getCalendarMonth } from 'mnth';\nimport { DateChangeHandler, DayIndex } from '../index';\nimport { DateRangePickerProps } from '../../interfaces';\nimport rotateDayIndexes from '../../../calendar/utils/rotate-day-indexes';\nimport { renderDayName } from '../../../calendar/utils/intl';\nimport clsx from 'clsx';\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<HTMLDivElement>;\n\n onSelectDate: DateChangeHandler;\n onGridKeyDownHandler: (e: React.KeyboardEvent) => 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\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\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\n return (\n <div className={clsx(styles.grid, className)}>\n <div className={styles['calendar-day-names']}>\n {rotateDayIndexes(startOfWeek).map(i => (\n <div key={`day-name-${i}`} className={styles['calendar-day-name']}>\n {renderDayName(locale, i)}\n </div>\n ))}\n </div>\n <div className={styles['calendar-dates']} onKeyDown={onGridKeyDownHandler}>\n {weeks.map((week, weekIndex) => {\n return (\n <div key={`week-${weekIndex}`} className={styles['calendar-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 return (\n <GridDay\n key={`date-${weekIndex}-${dateIndex}`}\n locale={locale}\n baseDate={baseDate}\n isSelected={isSelected}\n isStartDate={isStartDate}\n isEndDate={isEndDate}\n onlyOneSelected={onlyOneSelected}\n isRangeStartDate={isRangeStartDate}\n isRangeEndDate={isRangeEndDate}\n date={date}\n isFocusedDate={isFocused}\n ref={isFocused ? focusedDateRef : undefined}\n todayAriaLabel={todayAriaLabel}\n onSelectDate={onSelectDate}\n onFocusDate={onFocusedDateChange}\n isInRange={dateIsInRange}\n isDateEnabled={isDateEnabled}\n isDateInFirstRow={weekIndex === 0}\n isDateInFirstColumn={dateIndex === 0}\n isDateInLastColumn={dateIndex === week.length - 1}\n isDateInSelectionStartWeek={!!inRangeStartWeek}\n isDateInSelectionEndWeek={!!inRangeEndWeek}\n />\n );\n })}\n </div>\n );\n })}\n </div>\n </div>\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 } 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 { DateChangeHandler, DayIndex } from '../index';\nimport { DateRangePickerProps } from '../../interfaces';\nimport rotateDayIndexes from '../../../calendar/utils/rotate-day-indexes';\nimport { getDateLabel, renderDayName } from '../../../calendar/utils/intl';\nimport clsx from 'clsx';\nimport { formatDate } from '../../../internal/utils/date-time';\nimport useFocusVisible from '../../../internal/hooks/focus-visible/index.js';\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: DateChangeHandler;\n onGridKeyDownHandler: (e: React.KeyboardEvent) => 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\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\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\n const focusVisible = useFocusVisible();\n\n return (\n <table role=\"none\" className={clsx(styles.grid, className)}>\n <thead>\n <tr>\n {rotateDayIndexes(startOfWeek).map(dayIndex => (\n <th key={dayIndex} scope=\"col\" className={clsx(styles['grid-cell'], styles['day-header'])}>\n {renderDayName(locale, dayIndex)}\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);\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-top']]: !!inRangeStartWeek || date.getDate() <= 7,\n [styles['in-range-border-bottom']]: !!inRangeEndWeek || date.getDate() > getDaysInMonth(date) - 7,\n [styles['in-range-border-left']]: dateIndex === 0 || date.getDate() === 1 || isRangeStartDate,\n [styles['in-range-border-right']]:\n dateIndex === week.length - 1 || isLastDayOfMonth(date) || isRangeEndDate,\n [styles.today]: isToday(date),\n })}\n aria-label={dayAnnouncement}\n aria-pressed={isSelected || dateIsInRange}\n aria-current={isToday(date) ? 'date' : undefined}\n data-date={formatDate(date)}\n role=\"button\"\n tabIndex={tabIndex}\n {...handlers}\n {...focusVisible}\n >\n <span className={styles['day-inner']}>{date.getDate()}</span>\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 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/grids/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAI3D,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAC3E,OAAO,EAAE,gBAAgB,EAAE,MAAM,4CAA4C,CAAC;AAC9E,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAmBxD,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,IAAI,CAAC;IACf,iBAAiB,EAAE,IAAI,GAAG,IAAI,CAAC;IAC/B,eAAe,EAAE,IAAI,GAAG,IAAI,CAAC;IAE7B,WAAW,EAAE,IAAI,GAAG,IAAI,CAAC;IACzB,mBAAmB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC,CAAC;IAEvE,aAAa,EAAE,oBAAoB,CAAC,qBAAqB,CAAC;IAC1D,YAAY,EAAE,OAAO,CAAC;IAEtB,YAAY,EAAE,iBAAiB,CAAC;IAChC,aAAa,EAAE,kBAAkB,CAAC;IAClC,eAAe,EAAE,gBAAgB,CAAC;IAElC,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,QAAQ,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,wBAAgB,iBAAiB,CAC/B,QAAQ,EAAE,IAAI,GAAG,IAAI,EACrB,QAAQ,EAAE,IAAI,EACd,aAAa,EAAE,oBAAoB,CAAC,qBAAqB,eAa1D;AAED,eAAO,MAAM,KAAK,wMAkBf,SAAS,gBA0JX,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/grids/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAI3D,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAC3E,OAAO,EAAE,gBAAgB,EAAE,MAAM,4CAA4C,CAAC;AAC9E,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAmBxD,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,IAAI,CAAC;IACf,iBAAiB,EAAE,IAAI,GAAG,IAAI,CAAC;IAC/B,eAAe,EAAE,IAAI,GAAG,IAAI,CAAC;IAE7B,WAAW,EAAE,IAAI,GAAG,IAAI,CAAC;IACzB,mBAAmB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC,CAAC;IAEvE,aAAa,EAAE,oBAAoB,CAAC,qBAAqB,CAAC;IAC1D,YAAY,EAAE,OAAO,CAAC;IAEtB,YAAY,EAAE,iBAAiB,CAAC;IAChC,aAAa,EAAE,kBAAkB,CAAC;IAClC,eAAe,EAAE,gBAAgB,CAAC;IAElC,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,QAAQ,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,wBAAgB,iBAAiB,CAC/B,QAAQ,EAAE,IAAI,GAAG,IAAI,EACrB,QAAQ,EAAE,IAAI,EACd,aAAa,EAAE,oBAAoB,CAAC,qBAAqB,eAa1D;AAED,eAAO,MAAM,KAAK,wMAkBf,SAAS,gBA2JX,CAAC"}
@@ -54,6 +54,7 @@ export var Grids = function (_a) {
54
54
  return;
55
55
  }
56
56
  switch (e.keyCode) {
57
+ case KeyCode.space:
57
58
  case KeyCode.enter:
58
59
  e.preventDefault();
59
60
  if (focusedDate) {
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/grids/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AACpD,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAKlG,OAAO,oBAAoB,MAAM,iCAAiC,CAAC;AACnE,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,MAAM,MAAM,qBAAqB,CAAC;AAEzC,OAAO,eAAe,MAAM,6CAA6C,CAAC;AAC1E,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,mCAAmC,CAAC;AAE7D,SAAS,SAAS,CAAC,IAAU,EAAE,QAAc,EAAE,YAAqB;IAClE,IAAI,YAAY,EAAE;QAChB,OAAO,WAAW,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;KACpC;IAED,IAAM,aAAa,GAAG,SAAS,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAC;IAE9C,OAAO,WAAW,CAAC,IAAI,EAAE,aAAa,CAAC,IAAI,WAAW,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;AACzE,CAAC;AAsBD,MAAM,UAAU,iBAAiB,CAC/B,QAAqB,EACrB,QAAc,EACd,aAAyD;IAEzD,IAAI,QAAQ,IAAI,aAAa,CAAC,QAAQ,CAAC,IAAI,WAAW,CAAC,QAAQ,EAAE,QAAQ,CAAC,EAAE;QAC1E,OAAO,QAAQ,CAAC;KACjB;IACD,IAAM,KAAK,GAAG,IAAI,IAAI,EAAE,CAAC;IACzB,IAAI,aAAa,CAAC,KAAK,CAAC,IAAI,WAAW,CAAC,KAAK,EAAE,QAAQ,CAAC,EAAE;QACxD,OAAO,KAAK,CAAC;KACd;IACD,IAAI,aAAa,CAAC,QAAQ,CAAC,EAAE;QAC3B,OAAO,QAAQ,CAAC;KACjB;IACD,OAAO,IAAI,CAAC;AACd,CAAC;AAED,MAAM,CAAC,IAAM,KAAK,GAAG,UAAC,EAkBV;QAjBV,QAAQ,cAAA,EACR,iBAAiB,uBAAA,EACjB,eAAe,qBAAA,EAEf,WAAW,iBAAA,EACX,mBAAmB,yBAAA,EAEnB,aAAa,mBAAA,EACb,YAAY,kBAAA,EAEZ,YAAY,kBAAA,EACZ,aAAa,mBAAA,EACb,eAAe,qBAAA,EAEf,MAAM,YAAA,EACN,WAAW,iBAAA,EACX,cAAc,oBAAA;IAEd,IAAM,YAAY,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC5C,IAAA,KAAkC,QAAQ,CAAC,KAAK,CAAC,EAAhD,YAAY,QAAA,EAAE,eAAe,QAAmB,CAAC;IAExD,IAAM,cAAc,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEpD,IAAM,YAAY,GAAG,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,OAAO,EAAE,CAAC;IACzC,IAAM,eAAe,GAAG,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,OAAO,EAAE,CAAC;IAE/C,SAAS,CAAC;QACR,IAAI,WAAW,IAAI,CAAC,SAAS,CAAC,WAAW,EAAE,QAAQ,EAAE,YAAY,CAAC,EAAE;YAClE,mEAAmE;YACnE,IAAM,SAAS,GAAG,OAAO,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,UAAU,CAAC;YAE5E,IAAM,QAAQ,GAAG,CAAC,YAAY,IAAI,SAAS,KAAK,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC;YACjG,IAAM,eAAe,GAAG,WAAW,CAAC,QAAQ,EAAE,SAAS,KAAK,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,aAAa,CAAC,CAAC;YAEjG,IAAM,cAAc,GAAG,iBAAiB,CAAC,WAAW,EAAE,eAAe,EAAE,aAAa,CAAC,CAAC;YAEtF,mBAAmB,CAAC,cAAc,CAAC,CAAC;SACrC;QACD,yGAAyG;QACzG,uDAAuD;IACzD,CAAC,EAAE,CAAC,eAAe,EAAE,YAAY,EAAE,YAAY,EAAE,aAAa,EAAE,mBAAmB,CAAC,CAAC,CAAC;IAEtF,IAAM,oBAAoB,GAAG,UAAC,CAAsB;QAClD,IAAI,gBAAgB,CAAC;QAErB,IAAI,WAAW,KAAK,IAAI,EAAE;YACxB,OAAO;SACR;QAED,QAAQ,CAAC,CAAC,OAAO,EAAE;YACjB,KAAK,OAAO,CAAC,KAAK;gBAChB,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,IAAI,WAAW,EAAE;oBACf,YAAY,CAAC,WAAW,CAAC,CAAC;iBAC3B;gBACD,OAAO;YACT,KAAK,OAAO,CAAC,KAAK;gBAChB,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,gBAAgB,GAAG,eAAe,CAAC,WAAW,EAAE,aAAa,EAAE,UAAA,IAAI,IAAI,OAAA,OAAO,CAAC,IAAI,EAAE,CAAC,CAAC,EAAhB,CAAgB,CAAC,CAAC;gBACzF,MAAM;YACR,KAAK,OAAO,CAAC,IAAI;gBACf,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,gBAAgB,GAAG,eAAe,CAAC,WAAW,EAAE,aAAa,EAAE,UAAA,IAAI,IAAI,OAAA,OAAO,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,EAAjB,CAAiB,CAAC,CAAC;gBAC1F,MAAM;YACR,KAAK,OAAO,CAAC,EAAE;gBACb,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,gBAAgB,GAAG,eAAe,CAAC,WAAW,EAAE,aAAa,EAAE,UAAA,IAAI,IAAI,OAAA,QAAQ,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,EAAlB,CAAkB,CAAC,CAAC;gBAC3F,MAAM;YACR,KAAK,OAAO,CAAC,IAAI;gBACf,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,gBAAgB,GAAG,eAAe,CAAC,WAAW,EAAE,aAAa,EAAE,UAAA,IAAI,IAAI,OAAA,QAAQ,CAAC,IAAI,EAAE,CAAC,CAAC,EAAjB,CAAiB,CAAC,CAAC;gBAC1F,MAAM;YACR;gBACE,OAAO;SACV;QAED,IAAM,oBAAoB,GAAG,SAAS,CAAC,gBAAgB,EAAE,QAAQ,EAAE,YAAY,CAAC,CAAC;QAEjF,IAAI,CAAC,oBAAoB,EAAE;YACzB,IAAM,oBAAoB,GAAG,CAAC,YAAY,IAAI,QAAQ,CAAC,gBAAgB,EAAE,QAAQ,CAAC,CAAC;YAEnF,aAAa,CAAC,oBAAoB,CAAC,CAAC,CAAC,SAAS,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC;SACzF;QACD,mBAAmB,CAAC,gBAAgB,CAAC,CAAC;IACxC,CAAC,CAAC;IAEF,SAAS,CAAC;QACR,iEAAiE;QACjE,IAAI,WAAW,KAAK,IAAI,IAAI,YAAY,EAAE;YACxC,IAAI,cAAc,CAAC,OAAO,IAAI,cAAc,CAAC,OAAO,KAAK,QAAQ,CAAC,aAAa,EAAE;gBAC/E,cAAc,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;aAChC;SACF;QACD,yEAAyE;QACzE,uDAAuD;IACzD,CAAC,EAAE,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC,CAAC;IAEpC,IAAM,UAAU,GAAG,UAAC,KAAuB;;QACzC;;;;;;;WAOG;QACH,IAAM,cAAc,GAAG,KAAK,CAAC,aAAa,IAAI,QAAQ,CAAC,aAAa,CAAC;QACrE,IAAM,sBAAsB,GAAG,MAAA,YAAY,CAAC,OAAO,0CAAE,QAAQ,CAAC,cAAsB,CAAC,CAAC;QACtF,IAAI,cAAc,IAAI,CAAC,sBAAsB,IAAI,YAAY,EAAE;YAC7D,eAAe,CAAC,KAAK,CAAC,CAAC;SACxB;IACH,CAAC,CAAC;IAEF,IAAM,WAAW,GAAG;QAClB,IAAI,CAAC,YAAY,EAAE;YACjB,eAAe,CAAC,IAAI,CAAC,CAAC;SACvB;IACH,CAAC,CAAC;IAEF,IAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IAEvC,IAAM,cAAc,GAClB,CAAC,iBAAiB,IAAI,eAAe,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,CAAC,YAAY,CAAC,0BAA0B,CAAC,CAAC,CAAC;IAEzG,IAAM,SAAS,GAAW,CAAC,iBAAiB,aAAjB,iBAAiB,cAAjB,iBAAiB,GAAI,WAAW,EAAE,eAAe,aAAf,eAAe,cAAf,eAAe,GAAI,WAAW,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;IAE9G,IAAM,cAAc,GAAG,GAAG,CAAC,SAAS,CAAC,CAAC;IACtC,IAAM,YAAY,GAAG,GAAG,CAAC,SAAS,CAAC,CAAC;IAEpC,OAAO,CACL,6BAAK,GAAG,EAAE,YAAY,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,UAAU;QAC9D,oBAAC,oBAAoB,IAAC,IAAI,EAAC,IAAI,EAAC,SAAS,EAAC,YAAY;YACnD,CAAC,YAAY,IAAI,CAChB,oBAAC,IAAI,IACH,SAAS,EAAE,MAAM,CAAC,YAAY,CAAC,EAC/B,QAAQ,EAAE,SAAS,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,EACjC,eAAe,EAAE,eAAe,EAChC,iBAAiB,EAAE,iBAAiB,EACpC,cAAc,EAAE,cAAc,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,IAAI,EACtD,YAAY,EAAE,cAAc,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,EAClD,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,cAAc,EAC9B,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,YAAY,EAC1B,oBAAoB,EAAE,oBAAoB,EAC1C,mBAAmB,EAAE,mBAAmB,EACxC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,cAAc,GAC9B,CACH;YACD,oBAAC,IAAI,IACH,SAAS,EAAE,MAAM,CAAC,aAAa,CAAC,EAChC,QAAQ,EAAE,QAAQ,EAClB,eAAe,EAAE,eAAe,EAChC,iBAAiB,EAAE,iBAAiB,EACpC,cAAc,EAAE,cAAc,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,IAAI,EACtD,YAAY,EAAE,cAAc,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,EAClD,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,cAAc,EAC9B,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,YAAY,EAC1B,oBAAoB,EAAE,oBAAoB,EAC1C,mBAAmB,EAAE,mBAAmB,EACxC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,cAAc,GAC9B,CACmB,CACnB,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef, useState } from 'react';\nimport { KeyCode } from '../../../internal/keycode';\nimport { addDays, addWeeks, isSameMonth, isAfter, isBefore, addMonths, min, max } from 'date-fns';\n\nimport { DateChangeHandler, DayIndex, MonthChangeHandler } from '../index';\nimport { MoveFocusHandler } from '../../../calendar/utils/move-focus-handler';\nimport { DateRangePickerProps } from '../../interfaces';\nimport InternalSpaceBetween from '../../../space-between/internal';\nimport { Grid } from './grid';\nimport styles from '../../styles.css.js';\n\nimport useFocusVisible from '../../../internal/hooks/focus-visible/index';\nimport { getBaseDate } from '../get-base-date';\nimport { hasValue } from '../../../internal/utils/has-value';\n\nfunction isVisible(date: Date, baseDate: Date, isSingleGrid: boolean) {\n if (isSingleGrid) {\n return isSameMonth(date, baseDate);\n }\n\n const previousMonth = addMonths(baseDate, -1);\n\n return isSameMonth(date, previousMonth) || isSameMonth(date, baseDate);\n}\n\nexport interface GridProps {\n baseDate: Date;\n selectedStartDate: Date | null;\n selectedEndDate: Date | null;\n\n focusedDate: Date | null;\n onFocusedDateChange: React.Dispatch<React.SetStateAction<Date | null>>;\n\n isDateEnabled: DateRangePickerProps.IsDateEnabledFunction;\n isSingleGrid: boolean;\n\n onSelectDate: DateChangeHandler;\n onChangeMonth: MonthChangeHandler;\n handleFocusMove: MoveFocusHandler;\n\n locale: string;\n startOfWeek: DayIndex;\n todayAriaLabel: string;\n}\n\nexport function selectFocusedDate(\n selected: Date | null,\n baseDate: Date,\n isDateEnabled: DateRangePickerProps.IsDateEnabledFunction\n) {\n if (selected && isDateEnabled(selected) && isSameMonth(selected, baseDate)) {\n return selected;\n }\n const today = new Date();\n if (isDateEnabled(today) && isSameMonth(today, baseDate)) {\n return today;\n }\n if (isDateEnabled(baseDate)) {\n return baseDate;\n }\n return null;\n}\n\nexport const Grids = ({\n baseDate,\n selectedStartDate,\n selectedEndDate,\n\n focusedDate,\n onFocusedDateChange,\n\n isDateEnabled,\n isSingleGrid,\n\n onSelectDate,\n onChangeMonth,\n handleFocusMove,\n\n locale,\n startOfWeek,\n todayAriaLabel,\n}: GridProps) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const [gridHasFocus, setGridHasFocus] = useState(false);\n\n const focusedDateRef = useRef<HTMLDivElement>(null);\n\n const baseDateTime = baseDate?.getTime();\n const focusedDateTime = focusedDate?.getTime();\n\n useEffect(() => {\n if (focusedDate && !isVisible(focusedDate, baseDate, isSingleGrid)) {\n // The nearestBaseDate depends on the direction of the month change\n const direction = isAfter(focusedDate, baseDate) ? 'backwards' : 'forwards';\n\n const newMonth = !isSingleGrid && direction === 'backwards' ? addMonths(baseDate, -1) : baseDate;\n const nearestBaseDate = getBaseDate(newMonth, direction === 'backwards' ? -1 : 1, isDateEnabled);\n\n const newFocusedDate = selectFocusedDate(focusedDate, nearestBaseDate, isDateEnabled);\n\n onFocusedDateChange(newFocusedDate);\n }\n // `baseDateTime` and `focusedDateTime` are used as more stable replacements for baseDate and focusedDate\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [focusedDateTime, baseDateTime, isSingleGrid, isDateEnabled, onFocusedDateChange]);\n\n const onGridKeyDownHandler = (e: React.KeyboardEvent) => {\n let updatedFocusDate;\n\n if (focusedDate === null) {\n return;\n }\n\n switch (e.keyCode) {\n case KeyCode.enter:\n e.preventDefault();\n if (focusedDate) {\n onSelectDate(focusedDate);\n }\n return;\n case KeyCode.right:\n e.preventDefault();\n updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addDays(date, 1));\n break;\n case KeyCode.left:\n e.preventDefault();\n updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addDays(date, -1));\n break;\n case KeyCode.up:\n e.preventDefault();\n updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addWeeks(date, -1));\n break;\n case KeyCode.down:\n e.preventDefault();\n updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addWeeks(date, 1));\n break;\n default:\n return;\n }\n\n const updatedDateIsVisible = isVisible(updatedFocusDate, baseDate, isSingleGrid);\n\n if (!updatedDateIsVisible) {\n const newMonthIsOnLeftSide = !isSingleGrid && isBefore(updatedFocusDate, baseDate);\n\n onChangeMonth(newMonthIsOnLeftSide ? addMonths(updatedFocusDate, 1) : updatedFocusDate);\n }\n onFocusedDateChange(updatedFocusDate);\n };\n\n useEffect(() => {\n // focus current date if the focus is already inside the calendar\n if (focusedDate !== null && gridHasFocus) {\n if (focusedDateRef.current && focusedDateRef.current !== document.activeElement) {\n focusedDateRef.current.focus();\n }\n }\n // `focusedDateTime` is used as a more stable replacement for focusedDate\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [focusedDateTime, gridHasFocus]);\n\n const onGridBlur = (event: React.FocusEvent) => {\n /*\n IE11 does not support event.relatedTarget, but sets document.activeElement to the newly\n focused element before the onBlur handler is called.\n\n However, other browsers do not make any guarantees for the value of document.activeElement\n during the execution of an onBlur handler. Therefore, we have to use event.relatedTarget\n instead.\n */\n const newFocusTarget = event.relatedTarget || document.activeElement;\n const newFocusTargetIsInGrid = containerRef.current?.contains(newFocusTarget as Node);\n if (newFocusTarget && !newFocusTargetIsInGrid && gridHasFocus) {\n setGridHasFocus(false);\n }\n };\n\n const onGridFocus = () => {\n if (!gridHasFocus) {\n setGridHasFocus(true);\n }\n };\n\n const focusVisible = useFocusVisible();\n\n const isRangeVisible =\n (selectedStartDate && selectedEndDate) || (gridHasFocus && !!focusVisible['data-awsui-focus-visible']);\n\n const rangeEnds: Date[] = [selectedStartDate ?? focusedDate, selectedEndDate ?? focusedDate].filter(hasValue);\n\n const rangeStartDate = min(rangeEnds);\n const rangeEndDate = max(rangeEnds);\n\n return (\n <div ref={containerRef} onFocus={onGridFocus} onBlur={onGridBlur}>\n <InternalSpaceBetween size=\"xs\" direction=\"horizontal\">\n {!isSingleGrid && (\n <Grid\n className={styles['first-grid']}\n baseDate={addMonths(baseDate, -1)}\n selectedEndDate={selectedEndDate}\n selectedStartDate={selectedStartDate}\n rangeStartDate={isRangeVisible ? rangeStartDate : null}\n rangeEndDate={isRangeVisible ? rangeEndDate : null}\n focusedDate={focusedDate}\n focusedDateRef={focusedDateRef}\n isDateEnabled={isDateEnabled}\n onSelectDate={onSelectDate}\n onGridKeyDownHandler={onGridKeyDownHandler}\n onFocusedDateChange={onFocusedDateChange}\n locale={locale}\n startOfWeek={startOfWeek}\n todayAriaLabel={todayAriaLabel}\n />\n )}\n <Grid\n className={styles['second-grid']}\n baseDate={baseDate}\n selectedEndDate={selectedEndDate}\n selectedStartDate={selectedStartDate}\n rangeStartDate={isRangeVisible ? rangeStartDate : null}\n rangeEndDate={isRangeVisible ? rangeEndDate : null}\n focusedDate={focusedDate}\n focusedDateRef={focusedDateRef}\n isDateEnabled={isDateEnabled}\n onSelectDate={onSelectDate}\n onGridKeyDownHandler={onGridKeyDownHandler}\n onFocusedDateChange={onFocusedDateChange}\n locale={locale}\n startOfWeek={startOfWeek}\n todayAriaLabel={todayAriaLabel}\n />\n </InternalSpaceBetween>\n </div>\n );\n};\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/grids/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AACpD,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAKlG,OAAO,oBAAoB,MAAM,iCAAiC,CAAC;AACnE,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,MAAM,MAAM,qBAAqB,CAAC;AAEzC,OAAO,eAAe,MAAM,6CAA6C,CAAC;AAC1E,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,mCAAmC,CAAC;AAE7D,SAAS,SAAS,CAAC,IAAU,EAAE,QAAc,EAAE,YAAqB;IAClE,IAAI,YAAY,EAAE;QAChB,OAAO,WAAW,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;KACpC;IAED,IAAM,aAAa,GAAG,SAAS,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAC;IAE9C,OAAO,WAAW,CAAC,IAAI,EAAE,aAAa,CAAC,IAAI,WAAW,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;AACzE,CAAC;AAsBD,MAAM,UAAU,iBAAiB,CAC/B,QAAqB,EACrB,QAAc,EACd,aAAyD;IAEzD,IAAI,QAAQ,IAAI,aAAa,CAAC,QAAQ,CAAC,IAAI,WAAW,CAAC,QAAQ,EAAE,QAAQ,CAAC,EAAE;QAC1E,OAAO,QAAQ,CAAC;KACjB;IACD,IAAM,KAAK,GAAG,IAAI,IAAI,EAAE,CAAC;IACzB,IAAI,aAAa,CAAC,KAAK,CAAC,IAAI,WAAW,CAAC,KAAK,EAAE,QAAQ,CAAC,EAAE;QACxD,OAAO,KAAK,CAAC;KACd;IACD,IAAI,aAAa,CAAC,QAAQ,CAAC,EAAE;QAC3B,OAAO,QAAQ,CAAC;KACjB;IACD,OAAO,IAAI,CAAC;AACd,CAAC;AAED,MAAM,CAAC,IAAM,KAAK,GAAG,UAAC,EAkBV;QAjBV,QAAQ,cAAA,EACR,iBAAiB,uBAAA,EACjB,eAAe,qBAAA,EAEf,WAAW,iBAAA,EACX,mBAAmB,yBAAA,EAEnB,aAAa,mBAAA,EACb,YAAY,kBAAA,EAEZ,YAAY,kBAAA,EACZ,aAAa,mBAAA,EACb,eAAe,qBAAA,EAEf,MAAM,YAAA,EACN,WAAW,iBAAA,EACX,cAAc,oBAAA;IAEd,IAAM,YAAY,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC5C,IAAA,KAAkC,QAAQ,CAAC,KAAK,CAAC,EAAhD,YAAY,QAAA,EAAE,eAAe,QAAmB,CAAC;IAExD,IAAM,cAAc,GAAG,MAAM,CAAuB,IAAI,CAAC,CAAC;IAE1D,IAAM,YAAY,GAAG,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,OAAO,EAAE,CAAC;IACzC,IAAM,eAAe,GAAG,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,OAAO,EAAE,CAAC;IAE/C,SAAS,CAAC;QACR,IAAI,WAAW,IAAI,CAAC,SAAS,CAAC,WAAW,EAAE,QAAQ,EAAE,YAAY,CAAC,EAAE;YAClE,mEAAmE;YACnE,IAAM,SAAS,GAAG,OAAO,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,UAAU,CAAC;YAE5E,IAAM,QAAQ,GAAG,CAAC,YAAY,IAAI,SAAS,KAAK,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC;YACjG,IAAM,eAAe,GAAG,WAAW,CAAC,QAAQ,EAAE,SAAS,KAAK,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,aAAa,CAAC,CAAC;YAEjG,IAAM,cAAc,GAAG,iBAAiB,CAAC,WAAW,EAAE,eAAe,EAAE,aAAa,CAAC,CAAC;YAEtF,mBAAmB,CAAC,cAAc,CAAC,CAAC;SACrC;QACD,yGAAyG;QACzG,uDAAuD;IACzD,CAAC,EAAE,CAAC,eAAe,EAAE,YAAY,EAAE,YAAY,EAAE,aAAa,EAAE,mBAAmB,CAAC,CAAC,CAAC;IAEtF,IAAM,oBAAoB,GAAG,UAAC,CAAsB;QAClD,IAAI,gBAAgB,CAAC;QAErB,IAAI,WAAW,KAAK,IAAI,EAAE;YACxB,OAAO;SACR;QAED,QAAQ,CAAC,CAAC,OAAO,EAAE;YACjB,KAAK,OAAO,CAAC,KAAK,CAAC;YACnB,KAAK,OAAO,CAAC,KAAK;gBAChB,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,IAAI,WAAW,EAAE;oBACf,YAAY,CAAC,WAAW,CAAC,CAAC;iBAC3B;gBACD,OAAO;YACT,KAAK,OAAO,CAAC,KAAK;gBAChB,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,gBAAgB,GAAG,eAAe,CAAC,WAAW,EAAE,aAAa,EAAE,UAAA,IAAI,IAAI,OAAA,OAAO,CAAC,IAAI,EAAE,CAAC,CAAC,EAAhB,CAAgB,CAAC,CAAC;gBACzF,MAAM;YACR,KAAK,OAAO,CAAC,IAAI;gBACf,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,gBAAgB,GAAG,eAAe,CAAC,WAAW,EAAE,aAAa,EAAE,UAAA,IAAI,IAAI,OAAA,OAAO,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,EAAjB,CAAiB,CAAC,CAAC;gBAC1F,MAAM;YACR,KAAK,OAAO,CAAC,EAAE;gBACb,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,gBAAgB,GAAG,eAAe,CAAC,WAAW,EAAE,aAAa,EAAE,UAAA,IAAI,IAAI,OAAA,QAAQ,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,EAAlB,CAAkB,CAAC,CAAC;gBAC3F,MAAM;YACR,KAAK,OAAO,CAAC,IAAI;gBACf,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,gBAAgB,GAAG,eAAe,CAAC,WAAW,EAAE,aAAa,EAAE,UAAA,IAAI,IAAI,OAAA,QAAQ,CAAC,IAAI,EAAE,CAAC,CAAC,EAAjB,CAAiB,CAAC,CAAC;gBAC1F,MAAM;YACR;gBACE,OAAO;SACV;QAED,IAAM,oBAAoB,GAAG,SAAS,CAAC,gBAAgB,EAAE,QAAQ,EAAE,YAAY,CAAC,CAAC;QAEjF,IAAI,CAAC,oBAAoB,EAAE;YACzB,IAAM,oBAAoB,GAAG,CAAC,YAAY,IAAI,QAAQ,CAAC,gBAAgB,EAAE,QAAQ,CAAC,CAAC;YAEnF,aAAa,CAAC,oBAAoB,CAAC,CAAC,CAAC,SAAS,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC;SACzF;QACD,mBAAmB,CAAC,gBAAgB,CAAC,CAAC;IACxC,CAAC,CAAC;IAEF,SAAS,CAAC;QACR,iEAAiE;QACjE,IAAI,WAAW,KAAK,IAAI,IAAI,YAAY,EAAE;YACxC,IAAI,cAAc,CAAC,OAAO,IAAI,cAAc,CAAC,OAAO,KAAK,QAAQ,CAAC,aAAa,EAAE;gBAC/E,cAAc,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;aAChC;SACF;QACD,yEAAyE;QACzE,uDAAuD;IACzD,CAAC,EAAE,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC,CAAC;IAEpC,IAAM,UAAU,GAAG,UAAC,KAAuB;;QACzC;;;;;;;WAOG;QACH,IAAM,cAAc,GAAG,KAAK,CAAC,aAAa,IAAI,QAAQ,CAAC,aAAa,CAAC;QACrE,IAAM,sBAAsB,GAAG,MAAA,YAAY,CAAC,OAAO,0CAAE,QAAQ,CAAC,cAAsB,CAAC,CAAC;QACtF,IAAI,cAAc,IAAI,CAAC,sBAAsB,IAAI,YAAY,EAAE;YAC7D,eAAe,CAAC,KAAK,CAAC,CAAC;SACxB;IACH,CAAC,CAAC;IAEF,IAAM,WAAW,GAAG;QAClB,IAAI,CAAC,YAAY,EAAE;YACjB,eAAe,CAAC,IAAI,CAAC,CAAC;SACvB;IACH,CAAC,CAAC;IAEF,IAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IAEvC,IAAM,cAAc,GAClB,CAAC,iBAAiB,IAAI,eAAe,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,CAAC,YAAY,CAAC,0BAA0B,CAAC,CAAC,CAAC;IAEzG,IAAM,SAAS,GAAW,CAAC,iBAAiB,aAAjB,iBAAiB,cAAjB,iBAAiB,GAAI,WAAW,EAAE,eAAe,aAAf,eAAe,cAAf,eAAe,GAAI,WAAW,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;IAE9G,IAAM,cAAc,GAAG,GAAG,CAAC,SAAS,CAAC,CAAC;IACtC,IAAM,YAAY,GAAG,GAAG,CAAC,SAAS,CAAC,CAAC;IAEpC,OAAO,CACL,6BAAK,GAAG,EAAE,YAAY,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,UAAU;QAC9D,oBAAC,oBAAoB,IAAC,IAAI,EAAC,IAAI,EAAC,SAAS,EAAC,YAAY;YACnD,CAAC,YAAY,IAAI,CAChB,oBAAC,IAAI,IACH,SAAS,EAAE,MAAM,CAAC,YAAY,CAAC,EAC/B,QAAQ,EAAE,SAAS,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,EACjC,eAAe,EAAE,eAAe,EAChC,iBAAiB,EAAE,iBAAiB,EACpC,cAAc,EAAE,cAAc,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,IAAI,EACtD,YAAY,EAAE,cAAc,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,EAClD,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,cAAc,EAC9B,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,YAAY,EAC1B,oBAAoB,EAAE,oBAAoB,EAC1C,mBAAmB,EAAE,mBAAmB,EACxC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,cAAc,GAC9B,CACH;YACD,oBAAC,IAAI,IACH,SAAS,EAAE,MAAM,CAAC,aAAa,CAAC,EAChC,QAAQ,EAAE,QAAQ,EAClB,eAAe,EAAE,eAAe,EAChC,iBAAiB,EAAE,iBAAiB,EACpC,cAAc,EAAE,cAAc,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,IAAI,EACtD,YAAY,EAAE,cAAc,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,EAClD,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,cAAc,EAC9B,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,YAAY,EAC1B,oBAAoB,EAAE,oBAAoB,EAC1C,mBAAmB,EAAE,mBAAmB,EACxC,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,cAAc,GAC9B,CACmB,CACnB,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef, useState } from 'react';\nimport { KeyCode } from '../../../internal/keycode';\nimport { addDays, addWeeks, isSameMonth, isAfter, isBefore, addMonths, min, max } from 'date-fns';\n\nimport { DateChangeHandler, DayIndex, MonthChangeHandler } from '../index';\nimport { MoveFocusHandler } from '../../../calendar/utils/move-focus-handler';\nimport { DateRangePickerProps } from '../../interfaces';\nimport InternalSpaceBetween from '../../../space-between/internal';\nimport { Grid } from './grid';\nimport styles from '../../styles.css.js';\n\nimport useFocusVisible from '../../../internal/hooks/focus-visible/index';\nimport { getBaseDate } from '../get-base-date';\nimport { hasValue } from '../../../internal/utils/has-value';\n\nfunction isVisible(date: Date, baseDate: Date, isSingleGrid: boolean) {\n if (isSingleGrid) {\n return isSameMonth(date, baseDate);\n }\n\n const previousMonth = addMonths(baseDate, -1);\n\n return isSameMonth(date, previousMonth) || isSameMonth(date, baseDate);\n}\n\nexport interface GridProps {\n baseDate: Date;\n selectedStartDate: Date | null;\n selectedEndDate: Date | null;\n\n focusedDate: Date | null;\n onFocusedDateChange: React.Dispatch<React.SetStateAction<Date | null>>;\n\n isDateEnabled: DateRangePickerProps.IsDateEnabledFunction;\n isSingleGrid: boolean;\n\n onSelectDate: DateChangeHandler;\n onChangeMonth: MonthChangeHandler;\n handleFocusMove: MoveFocusHandler;\n\n locale: string;\n startOfWeek: DayIndex;\n todayAriaLabel: string;\n}\n\nexport function selectFocusedDate(\n selected: Date | null,\n baseDate: Date,\n isDateEnabled: DateRangePickerProps.IsDateEnabledFunction\n) {\n if (selected && isDateEnabled(selected) && isSameMonth(selected, baseDate)) {\n return selected;\n }\n const today = new Date();\n if (isDateEnabled(today) && isSameMonth(today, baseDate)) {\n return today;\n }\n if (isDateEnabled(baseDate)) {\n return baseDate;\n }\n return null;\n}\n\nexport const Grids = ({\n baseDate,\n selectedStartDate,\n selectedEndDate,\n\n focusedDate,\n onFocusedDateChange,\n\n isDateEnabled,\n isSingleGrid,\n\n onSelectDate,\n onChangeMonth,\n handleFocusMove,\n\n locale,\n startOfWeek,\n todayAriaLabel,\n}: GridProps) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const [gridHasFocus, setGridHasFocus] = useState(false);\n\n const focusedDateRef = useRef<HTMLTableCellElement>(null);\n\n const baseDateTime = baseDate?.getTime();\n const focusedDateTime = focusedDate?.getTime();\n\n useEffect(() => {\n if (focusedDate && !isVisible(focusedDate, baseDate, isSingleGrid)) {\n // The nearestBaseDate depends on the direction of the month change\n const direction = isAfter(focusedDate, baseDate) ? 'backwards' : 'forwards';\n\n const newMonth = !isSingleGrid && direction === 'backwards' ? addMonths(baseDate, -1) : baseDate;\n const nearestBaseDate = getBaseDate(newMonth, direction === 'backwards' ? -1 : 1, isDateEnabled);\n\n const newFocusedDate = selectFocusedDate(focusedDate, nearestBaseDate, isDateEnabled);\n\n onFocusedDateChange(newFocusedDate);\n }\n // `baseDateTime` and `focusedDateTime` are used as more stable replacements for baseDate and focusedDate\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [focusedDateTime, baseDateTime, isSingleGrid, isDateEnabled, onFocusedDateChange]);\n\n const onGridKeyDownHandler = (e: React.KeyboardEvent) => {\n let updatedFocusDate;\n\n if (focusedDate === null) {\n return;\n }\n\n switch (e.keyCode) {\n case KeyCode.space:\n case KeyCode.enter:\n e.preventDefault();\n if (focusedDate) {\n onSelectDate(focusedDate);\n }\n return;\n case KeyCode.right:\n e.preventDefault();\n updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addDays(date, 1));\n break;\n case KeyCode.left:\n e.preventDefault();\n updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addDays(date, -1));\n break;\n case KeyCode.up:\n e.preventDefault();\n updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addWeeks(date, -1));\n break;\n case KeyCode.down:\n e.preventDefault();\n updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addWeeks(date, 1));\n break;\n default:\n return;\n }\n\n const updatedDateIsVisible = isVisible(updatedFocusDate, baseDate, isSingleGrid);\n\n if (!updatedDateIsVisible) {\n const newMonthIsOnLeftSide = !isSingleGrid && isBefore(updatedFocusDate, baseDate);\n\n onChangeMonth(newMonthIsOnLeftSide ? addMonths(updatedFocusDate, 1) : updatedFocusDate);\n }\n onFocusedDateChange(updatedFocusDate);\n };\n\n useEffect(() => {\n // focus current date if the focus is already inside the calendar\n if (focusedDate !== null && gridHasFocus) {\n if (focusedDateRef.current && focusedDateRef.current !== document.activeElement) {\n focusedDateRef.current.focus();\n }\n }\n // `focusedDateTime` is used as a more stable replacement for focusedDate\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [focusedDateTime, gridHasFocus]);\n\n const onGridBlur = (event: React.FocusEvent) => {\n /*\n IE11 does not support event.relatedTarget, but sets document.activeElement to the newly\n focused element before the onBlur handler is called.\n\n However, other browsers do not make any guarantees for the value of document.activeElement\n during the execution of an onBlur handler. Therefore, we have to use event.relatedTarget\n instead.\n */\n const newFocusTarget = event.relatedTarget || document.activeElement;\n const newFocusTargetIsInGrid = containerRef.current?.contains(newFocusTarget as Node);\n if (newFocusTarget && !newFocusTargetIsInGrid && gridHasFocus) {\n setGridHasFocus(false);\n }\n };\n\n const onGridFocus = () => {\n if (!gridHasFocus) {\n setGridHasFocus(true);\n }\n };\n\n const focusVisible = useFocusVisible();\n\n const isRangeVisible =\n (selectedStartDate && selectedEndDate) || (gridHasFocus && !!focusVisible['data-awsui-focus-visible']);\n\n const rangeEnds: Date[] = [selectedStartDate ?? focusedDate, selectedEndDate ?? focusedDate].filter(hasValue);\n\n const rangeStartDate = min(rangeEnds);\n const rangeEndDate = max(rangeEnds);\n\n return (\n <div ref={containerRef} onFocus={onGridFocus} onBlur={onGridBlur}>\n <InternalSpaceBetween size=\"xs\" direction=\"horizontal\">\n {!isSingleGrid && (\n <Grid\n className={styles['first-grid']}\n baseDate={addMonths(baseDate, -1)}\n selectedEndDate={selectedEndDate}\n selectedStartDate={selectedStartDate}\n rangeStartDate={isRangeVisible ? rangeStartDate : null}\n rangeEndDate={isRangeVisible ? rangeEndDate : null}\n focusedDate={focusedDate}\n focusedDateRef={focusedDateRef}\n isDateEnabled={isDateEnabled}\n onSelectDate={onSelectDate}\n onGridKeyDownHandler={onGridKeyDownHandler}\n onFocusedDateChange={onFocusedDateChange}\n locale={locale}\n startOfWeek={startOfWeek}\n todayAriaLabel={todayAriaLabel}\n />\n )}\n <Grid\n className={styles['second-grid']}\n baseDate={baseDate}\n selectedEndDate={selectedEndDate}\n selectedStartDate={selectedStartDate}\n rangeStartDate={isRangeVisible ? rangeStartDate : null}\n rangeEndDate={isRangeVisible ? rangeEndDate : null}\n focusedDate={focusedDate}\n focusedDateRef={focusedDateRef}\n isDateEnabled={isDateEnabled}\n onSelectDate={onSelectDate}\n onGridKeyDownHandler={onGridKeyDownHandler}\n onFocusedDateChange={onFocusedDateChange}\n locale={locale}\n startOfWeek={startOfWeek}\n todayAriaLabel={todayAriaLabel}\n />\n </InternalSpaceBetween>\n </div>\n );\n};\n"]}
@@ -0,0 +1,30 @@
1
+
2
+ import './styles.scoped.css';
3
+ export default {
4
+ "grid": "awsui_grid_1mfbn_161ai_97",
5
+ "grid-cell": "awsui_grid-cell_1mfbn_161ai_102",
6
+ "day-header": "awsui_day-header_1mfbn_161ai_109",
7
+ "week": "awsui_week_1mfbn_161ai_117",
8
+ "day": "awsui_day_1mfbn_161ai_109",
9
+ "day-inner": "awsui_day-inner_1mfbn_161ai_160",
10
+ "in-first-row": "awsui_in-first-row_1mfbn_161ai_165",
11
+ "in-previous-month": "awsui_in-previous-month_1mfbn_161ai_165",
12
+ "last-day-of-month": "awsui_last-day-of-month_1mfbn_161ai_169",
13
+ "in-next-month": "awsui_in-next-month_1mfbn_161ai_173",
14
+ "in-first-column": "awsui_in-first-column_1mfbn_161ai_177",
15
+ "in-current-month": "awsui_in-current-month_1mfbn_161ai_180",
16
+ "enabled": "awsui_enabled_1mfbn_161ai_184",
17
+ "in-range": "awsui_in-range_1mfbn_161ai_190",
18
+ "end-date": "awsui_end-date_1mfbn_161ai_190",
19
+ "start-date": "awsui_start-date_1mfbn_161ai_190",
20
+ "no-range": "awsui_no-range_1mfbn_161ai_190",
21
+ "selected": "awsui_selected_1mfbn_161ai_197",
22
+ "today": "awsui_today_1mfbn_161ai_201",
23
+ "range-start-date": "awsui_range-start-date_1mfbn_161ai_237",
24
+ "in-range-border-bottom": "awsui_in-range-border-bottom_1mfbn_161ai_240",
25
+ "range-end-date": "awsui_range-end-date_1mfbn_161ai_243",
26
+ "in-range-border-top": "awsui_in-range-border-top_1mfbn_161ai_246",
27
+ "in-range-border-right": "awsui_in-range-border-right_1mfbn_161ai_261",
28
+ "in-range-border-left": "awsui_in-range-border-left_1mfbn_161ai_267"
29
+ };
30
+