@cloudscape-design/components-themeable 3.0.542 → 3.0.543
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.
- package/lib/internal/manifest.json +1 -1
- package/lib/internal/scss/calendar/styles.scss +11 -12
- package/lib/internal/template/calendar/styles.css.js +18 -18
- package/lib/internal/template/calendar/styles.scoped.css +46 -42
- package/lib/internal/template/calendar/styles.selectors.js +18 -18
- package/lib/internal/template/internal/components/options-list/utils/use-highlight-option.d.ts.map +1 -1
- package/lib/internal/template/internal/components/options-list/utils/use-highlight-option.js +2 -1
- package/lib/internal/template/internal/components/options-list/utils/use-highlight-option.js.map +1 -1
- package/lib/internal/template/internal/environment.js +1 -1
- package/lib/internal/template/internal/environment.json +1 -1
- package/package.json +1 -1
|
@@ -15,6 +15,13 @@
|
|
|
15
15
|
/* used in test-utils */
|
|
16
16
|
}
|
|
17
17
|
|
|
18
|
+
@mixin item-border-radius {
|
|
19
|
+
border-start-start-radius: awsui.$border-radius-item;
|
|
20
|
+
border-start-end-radius: awsui.$border-radius-item;
|
|
21
|
+
border-end-start-radius: awsui.$border-radius-item;
|
|
22
|
+
border-end-end-radius: awsui.$border-radius-item;
|
|
23
|
+
}
|
|
24
|
+
|
|
18
25
|
.calendar {
|
|
19
26
|
display: block;
|
|
20
27
|
inline-size: awsui.$size-calendar-grid-width;
|
|
@@ -83,14 +90,12 @@
|
|
|
83
90
|
cursor: pointer;
|
|
84
91
|
color: calendar.$grid-nonmonth-day-color;
|
|
85
92
|
&::after {
|
|
86
|
-
|
|
87
|
-
border-start-end-radius: awsui.$border-radius-item;
|
|
88
|
-
border-end-start-radius: awsui.$border-radius-item;
|
|
89
|
-
border-end-end-radius: awsui.$border-radius-item;
|
|
93
|
+
@include item-border-radius;
|
|
90
94
|
}
|
|
91
95
|
&.calendar-date-current-page {
|
|
92
96
|
color: calendar.$grid-date-color;
|
|
93
97
|
&:hover {
|
|
98
|
+
@include item-border-radius;
|
|
94
99
|
color: awsui.$color-text-calendar-date-hover;
|
|
95
100
|
background-color: calendar.$grid-hover-background-color;
|
|
96
101
|
&:not(.calendar-date-selected) {
|
|
@@ -104,11 +109,8 @@
|
|
|
104
109
|
}
|
|
105
110
|
|
|
106
111
|
&-current {
|
|
112
|
+
@include item-border-radius;
|
|
107
113
|
background-color: calendar.$grid-current-date-background-color;
|
|
108
|
-
border-start-start-radius: awsui.$border-radius-item;
|
|
109
|
-
border-start-end-radius: awsui.$border-radius-item;
|
|
110
|
-
border-end-start-radius: awsui.$border-radius-item;
|
|
111
|
-
border-end-end-radius: awsui.$border-radius-item;
|
|
112
114
|
font-weight: styles.$font-weight-bold;
|
|
113
115
|
}
|
|
114
116
|
|
|
@@ -158,13 +160,10 @@
|
|
|
158
160
|
}
|
|
159
161
|
}
|
|
160
162
|
&::after {
|
|
163
|
+
@include item-border-radius;
|
|
161
164
|
background-color: calendar.$grid-selected-background-color;
|
|
162
165
|
border-block: awsui.$border-item-width solid calendar.$grid-selected-border-color;
|
|
163
166
|
border-inline: awsui.$border-item-width solid calendar.$grid-selected-border-color;
|
|
164
|
-
border-start-start-radius: awsui.$border-radius-item;
|
|
165
|
-
border-start-end-radius: awsui.$border-radius-item;
|
|
166
|
-
border-end-start-radius: awsui.$border-radius-item;
|
|
167
|
-
border-end-end-radius: awsui.$border-radius-item;
|
|
168
167
|
}
|
|
169
168
|
> .date-inner {
|
|
170
169
|
z-index: 2;
|
|
@@ -1,23 +1,23 @@
|
|
|
1
1
|
|
|
2
2
|
import './styles.scoped.css';
|
|
3
3
|
export default {
|
|
4
|
-
"calendar": "
|
|
5
|
-
"awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-
|
|
6
|
-
"root": "
|
|
7
|
-
"calendar-inner": "awsui_calendar-
|
|
8
|
-
"calendar-header": "awsui_calendar-
|
|
9
|
-
"calendar-header-month": "awsui_calendar-header-
|
|
10
|
-
"calendar-next-btn": "awsui_calendar-next-
|
|
11
|
-
"calendar-prev-btn": "awsui_calendar-prev-
|
|
12
|
-
"calendar-grid": "awsui_calendar-
|
|
13
|
-
"calendar-grid-cell": "awsui_calendar-grid-
|
|
14
|
-
"calendar-date-header": "awsui_calendar-date-
|
|
15
|
-
"calendar-date": "awsui_calendar-
|
|
16
|
-
"calendar-date-enabled": "awsui_calendar-date-
|
|
17
|
-
"calendar-date-current-page": "awsui_calendar-date-current-
|
|
18
|
-
"calendar-date-selected": "awsui_calendar-date-
|
|
19
|
-
"calendar-date-current": "awsui_calendar-date-
|
|
20
|
-
"date-inner": "awsui_date-
|
|
21
|
-
"calendar-row": "awsui_calendar-
|
|
4
|
+
"calendar": "awsui_calendar_1ykar_1ln6p_93",
|
|
5
|
+
"awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1ykar_1ln6p_1",
|
|
6
|
+
"root": "awsui_root_1ykar_1ln6p_124",
|
|
7
|
+
"calendar-inner": "awsui_calendar-inner_1ykar_1ln6p_165",
|
|
8
|
+
"calendar-header": "awsui_calendar-header_1ykar_1ln6p_169",
|
|
9
|
+
"calendar-header-month": "awsui_calendar-header-month_1ykar_1ln6p_174",
|
|
10
|
+
"calendar-next-btn": "awsui_calendar-next-btn_1ykar_1ln6p_182",
|
|
11
|
+
"calendar-prev-btn": "awsui_calendar-prev-btn_1ykar_1ln6p_185",
|
|
12
|
+
"calendar-grid": "awsui_calendar-grid_1ykar_1ln6p_188",
|
|
13
|
+
"calendar-grid-cell": "awsui_calendar-grid-cell_1ykar_1ln6p_192",
|
|
14
|
+
"calendar-date-header": "awsui_calendar-date-header_1ykar_1ln6p_198",
|
|
15
|
+
"calendar-date": "awsui_calendar-date_1ykar_1ln6p_198",
|
|
16
|
+
"calendar-date-enabled": "awsui_calendar-date-enabled_1ykar_1ln6p_218",
|
|
17
|
+
"calendar-date-current-page": "awsui_calendar-date-current-page_1ykar_1ln6p_228",
|
|
18
|
+
"calendar-date-selected": "awsui_calendar-date-selected_1ykar_1ln6p_239",
|
|
19
|
+
"calendar-date-current": "awsui_calendar-date-current_1ykar_1ln6p_228",
|
|
20
|
+
"date-inner": "awsui_date-inner_1ykar_1ln6p_261",
|
|
21
|
+
"calendar-row": "awsui_calendar-row_1ykar_1ln6p_336"
|
|
22
22
|
};
|
|
23
23
|
|
|
@@ -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
|
-
.
|
|
94
|
-
animation: awsui_awsui-motion-fade-in-
|
|
93
|
+
.awsui_calendar_1ykar_1ln6p_93:not(#\9) {
|
|
94
|
+
animation: awsui_awsui-motion-fade-in-0_1ykar_1ln6p_1 var(--motion-duration-show-quick-kypzaj, 135ms) var(--motion-easing-show-quick-lvi5i8, ease-out);
|
|
95
95
|
animation-fill-mode: both;
|
|
96
96
|
}
|
|
97
|
-
@keyframes awsui_awsui-motion-fade-in-
|
|
97
|
+
@keyframes awsui_awsui-motion-fade-in-0_1ykar_1ln6p_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
|
-
.
|
|
106
|
+
.awsui_calendar_1ykar_1ln6p_93:not(#\9) {
|
|
107
107
|
animation: none;
|
|
108
108
|
transition: none;
|
|
109
109
|
}
|
|
110
110
|
}
|
|
111
|
-
.awsui-motion-disabled .
|
|
111
|
+
.awsui-motion-disabled .awsui_calendar_1ykar_1ln6p_93:not(#\9), .awsui-mode-entering .awsui_calendar_1ykar_1ln6p_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
|
-
.
|
|
124
|
+
.awsui_root_1ykar_1ln6p_124:not(#\9) {
|
|
125
125
|
/* used in test-utils */
|
|
126
126
|
}
|
|
127
127
|
|
|
128
|
-
.
|
|
128
|
+
.awsui_calendar_1ykar_1ln6p_93:not(#\9) {
|
|
129
129
|
display: block;
|
|
130
130
|
inline-size: var(--size-calendar-grid-width-m7rthz, 234px);
|
|
131
131
|
overflow: auto;
|
|
@@ -163,16 +163,16 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
163
163
|
-webkit-font-smoothing: auto;
|
|
164
164
|
-moz-osx-font-smoothing: auto;
|
|
165
165
|
}
|
|
166
|
-
.awsui_calendar-
|
|
166
|
+
.awsui_calendar-inner_1ykar_1ln6p_165:not(#\9) {
|
|
167
167
|
margin-block: var(--space-xs-xf5ch3, 8px);
|
|
168
168
|
margin-inline: var(--space-xs-xf5ch3, 8px);
|
|
169
169
|
}
|
|
170
|
-
.awsui_calendar-
|
|
170
|
+
.awsui_calendar-header_1ykar_1ln6p_169:not(#\9) {
|
|
171
171
|
display: flex;
|
|
172
172
|
justify-content: space-between;
|
|
173
173
|
align-items: center;
|
|
174
174
|
}
|
|
175
|
-
.awsui_calendar-header-
|
|
175
|
+
.awsui_calendar-header-month_1ykar_1ln6p_174:not(#\9) {
|
|
176
176
|
font-size: var(--font-size-body-m-pa3mqb, 14px);
|
|
177
177
|
line-height: var(--line-height-body-m-2zx78l, 22px);
|
|
178
178
|
font-weight: 700;
|
|
@@ -180,23 +180,23 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
180
180
|
margin-block: 0;
|
|
181
181
|
margin-inline: 0;
|
|
182
182
|
}
|
|
183
|
-
.awsui_calendar-next-
|
|
183
|
+
.awsui_calendar-next-btn_1ykar_1ln6p_182:not(#\9) {
|
|
184
184
|
/* used for identifying element */
|
|
185
185
|
}
|
|
186
|
-
.awsui_calendar-prev-
|
|
186
|
+
.awsui_calendar-prev-btn_1ykar_1ln6p_185:not(#\9) {
|
|
187
187
|
/* used for identifying element */
|
|
188
188
|
}
|
|
189
|
-
.awsui_calendar-
|
|
189
|
+
.awsui_calendar-grid_1ykar_1ln6p_188:not(#\9) {
|
|
190
190
|
inline-size: 100%;
|
|
191
191
|
border-spacing: 0;
|
|
192
192
|
}
|
|
193
|
-
.awsui_calendar-grid-
|
|
193
|
+
.awsui_calendar-grid-cell_1ykar_1ln6p_192:not(#\9) {
|
|
194
194
|
inline-size: 14.2857142857%;
|
|
195
195
|
word-break: break-word;
|
|
196
196
|
text-align: center;
|
|
197
197
|
font-weight: unset;
|
|
198
198
|
}
|
|
199
|
-
.awsui_calendar-date-
|
|
199
|
+
.awsui_calendar-date-header_1ykar_1ln6p_198:not(#\9) {
|
|
200
200
|
padding-block-start: var(--space-s-2025hl, 12px);
|
|
201
201
|
padding-block-end: var(--space-xxs-9rrxti, 4px);
|
|
202
202
|
padding-inline: 0;
|
|
@@ -205,7 +205,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
205
205
|
line-height: var(--line-height-body-s-n0pazd, 16px);
|
|
206
206
|
letter-spacing: var(--letter-spacing-body-s-nkvets, normal);
|
|
207
207
|
}
|
|
208
|
-
.awsui_calendar-
|
|
208
|
+
.awsui_calendar-date_1ykar_1ln6p_198:not(#\9) {
|
|
209
209
|
border-block-end: 1px solid var(--color-border-calendar-grid-2ab4m1, #eaeded);
|
|
210
210
|
border-inline-end: 1px solid var(--color-border-calendar-grid-2ab4m1, #eaeded);
|
|
211
211
|
padding-block: var(--space-xxs-9rrxti, 4px);
|
|
@@ -213,39 +213,43 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
213
213
|
color: var(--color-text-dropdown-item-disabled-nf1b1j, #aab7b8);
|
|
214
214
|
position: relative;
|
|
215
215
|
}
|
|
216
|
-
.awsui_calendar-
|
|
216
|
+
.awsui_calendar-date_1ykar_1ln6p_198:not(#\9):first-child {
|
|
217
217
|
border-inline-start: 1px solid var(--color-border-calendar-grid-2ab4m1, #eaeded);
|
|
218
218
|
}
|
|
219
|
-
.awsui_calendar-date-
|
|
219
|
+
.awsui_calendar-date-enabled_1ykar_1ln6p_218:not(#\9) {
|
|
220
220
|
cursor: pointer;
|
|
221
221
|
color: var(--color-text-dropdown-item-secondary-x5katv, #687078);
|
|
222
222
|
}
|
|
223
|
-
.awsui_calendar-date-
|
|
223
|
+
.awsui_calendar-date-enabled_1ykar_1ln6p_218:not(#\9)::after {
|
|
224
224
|
border-start-start-radius: var(--border-radius-item-jsz3j8, 0px);
|
|
225
225
|
border-start-end-radius: var(--border-radius-item-jsz3j8, 0px);
|
|
226
226
|
border-end-start-radius: var(--border-radius-item-jsz3j8, 0px);
|
|
227
227
|
border-end-end-radius: var(--border-radius-item-jsz3j8, 0px);
|
|
228
228
|
}
|
|
229
|
-
.awsui_calendar-date-
|
|
229
|
+
.awsui_calendar-date-enabled_1ykar_1ln6p_218.awsui_calendar-date-current-page_1ykar_1ln6p_228:not(#\9) {
|
|
230
230
|
color: var(--color-text-dropdown-item-default-d4af6n, #16191f);
|
|
231
231
|
}
|
|
232
|
-
.awsui_calendar-date-
|
|
232
|
+
.awsui_calendar-date-enabled_1ykar_1ln6p_218.awsui_calendar-date-current-page_1ykar_1ln6p_228:not(#\9):hover {
|
|
233
|
+
border-start-start-radius: var(--border-radius-item-jsz3j8, 0px);
|
|
234
|
+
border-start-end-radius: var(--border-radius-item-jsz3j8, 0px);
|
|
235
|
+
border-end-start-radius: var(--border-radius-item-jsz3j8, 0px);
|
|
236
|
+
border-end-end-radius: var(--border-radius-item-jsz3j8, 0px);
|
|
233
237
|
color: var(--color-text-calendar-date-hover-ti96oo, #16191f);
|
|
234
238
|
background-color: var(--color-background-dropdown-item-hover-i8ac7r, #f2f3f3);
|
|
235
239
|
}
|
|
236
|
-
.awsui_calendar-date-
|
|
240
|
+
.awsui_calendar-date-enabled_1ykar_1ln6p_218.awsui_calendar-date-current-page_1ykar_1ln6p_228:not(#\9):hover:not(.awsui_calendar-date-selected_1ykar_1ln6p_239)::after {
|
|
237
241
|
border-block: var(--border-item-width-0zxiwv, 1px) solid var(--color-border-dropdown-item-hover-gqjku2, #879596);
|
|
238
242
|
border-inline: var(--border-item-width-0zxiwv, 1px) solid var(--color-border-dropdown-item-hover-gqjku2, #879596);
|
|
239
243
|
}
|
|
240
|
-
.awsui_calendar-date-
|
|
241
|
-
background-color: var(--color-background-calendar-current-date-wm9kva, #f2f3f3);
|
|
244
|
+
.awsui_calendar-date-current_1ykar_1ln6p_228:not(#\9) {
|
|
242
245
|
border-start-start-radius: var(--border-radius-item-jsz3j8, 0px);
|
|
243
246
|
border-start-end-radius: var(--border-radius-item-jsz3j8, 0px);
|
|
244
247
|
border-end-start-radius: var(--border-radius-item-jsz3j8, 0px);
|
|
245
248
|
border-end-end-radius: var(--border-radius-item-jsz3j8, 0px);
|
|
249
|
+
background-color: var(--color-background-calendar-current-date-wm9kva, #f2f3f3);
|
|
246
250
|
font-weight: 700;
|
|
247
251
|
}
|
|
248
|
-
.awsui_calendar-
|
|
252
|
+
.awsui_calendar-date_1ykar_1ln6p_198:not(#\9)::after {
|
|
249
253
|
content: "";
|
|
250
254
|
position: absolute;
|
|
251
255
|
z-index: 1;
|
|
@@ -255,21 +259,21 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
255
259
|
inset-inline-end: calc(-1 * var(--border-item-width-0zxiwv, 1px));
|
|
256
260
|
background-color: transparent;
|
|
257
261
|
}
|
|
258
|
-
.awsui_calendar-
|
|
262
|
+
.awsui_calendar-date_1ykar_1ln6p_198 > .awsui_date-inner_1ykar_1ln6p_261:not(#\9) {
|
|
259
263
|
position: relative;
|
|
260
264
|
z-index: 1;
|
|
261
265
|
}
|
|
262
|
-
.awsui_calendar-
|
|
266
|
+
.awsui_calendar-date_1ykar_1ln6p_198:not(#\9):focus {
|
|
263
267
|
outline: none;
|
|
264
268
|
}
|
|
265
|
-
body[data-awsui-focus-visible=true] .awsui_calendar-
|
|
269
|
+
body[data-awsui-focus-visible=true] .awsui_calendar-date_1ykar_1ln6p_198:not(#\9):focus:focus {
|
|
266
270
|
position: relative;
|
|
267
271
|
}
|
|
268
|
-
body[data-awsui-focus-visible=true] .awsui_calendar-
|
|
272
|
+
body[data-awsui-focus-visible=true] .awsui_calendar-date_1ykar_1ln6p_198:not(#\9):focus:focus {
|
|
269
273
|
outline: 2px dotted transparent;
|
|
270
274
|
outline-offset: calc(var(--space-calendar-grid-focus-outline-gutter-pkb6ov, 0px) - 1px);
|
|
271
275
|
}
|
|
272
|
-
body[data-awsui-focus-visible=true] .awsui_calendar-
|
|
276
|
+
body[data-awsui-focus-visible=true] .awsui_calendar-date_1ykar_1ln6p_198:not(#\9):focus:focus::before {
|
|
273
277
|
content: " ";
|
|
274
278
|
display: block;
|
|
275
279
|
position: absolute;
|
|
@@ -283,23 +287,23 @@ body[data-awsui-focus-visible=true] .awsui_calendar-date_1ykar_641py_198:not(#\9
|
|
|
283
287
|
border-end-end-radius: var(--border-radius-calendar-day-focus-ring-6ckim2, 2px);
|
|
284
288
|
box-shadow: 0 0 0 2px var(--color-border-item-focused-v8nq2m, #0073bb);
|
|
285
289
|
}
|
|
286
|
-
body[data-awsui-focus-visible=true] .awsui_calendar-
|
|
290
|
+
body[data-awsui-focus-visible=true] .awsui_calendar-date_1ykar_1ln6p_198:not(#\9):focus:focus::before {
|
|
287
291
|
z-index: 2;
|
|
288
292
|
}
|
|
289
|
-
.awsui_calendar-date-
|
|
293
|
+
.awsui_calendar-date-selected_1ykar_1ln6p_239:not(#\9) {
|
|
290
294
|
border-color: transparent;
|
|
291
295
|
position: relative;
|
|
292
296
|
z-index: 2;
|
|
293
297
|
font-weight: 700;
|
|
294
298
|
}
|
|
295
|
-
body[data-awsui-focus-visible=true] .awsui_calendar-date-
|
|
299
|
+
body[data-awsui-focus-visible=true] .awsui_calendar-date-selected_1ykar_1ln6p_239:not(#\9):focus:focus {
|
|
296
300
|
position: relative;
|
|
297
301
|
}
|
|
298
|
-
body[data-awsui-focus-visible=true] .awsui_calendar-date-
|
|
302
|
+
body[data-awsui-focus-visible=true] .awsui_calendar-date-selected_1ykar_1ln6p_239:not(#\9):focus:focus {
|
|
299
303
|
outline: 2px dotted transparent;
|
|
300
304
|
outline-offset: calc(var(--space-calendar-grid-focus-outline-gutter-pkb6ov, 0px) - 1px);
|
|
301
305
|
}
|
|
302
|
-
body[data-awsui-focus-visible=true] .awsui_calendar-date-
|
|
306
|
+
body[data-awsui-focus-visible=true] .awsui_calendar-date-selected_1ykar_1ln6p_239:not(#\9):focus:focus::before {
|
|
303
307
|
content: " ";
|
|
304
308
|
display: block;
|
|
305
309
|
position: absolute;
|
|
@@ -313,23 +317,23 @@ body[data-awsui-focus-visible=true] .awsui_calendar-date-selected_1ykar_641py_23
|
|
|
313
317
|
border-end-end-radius: var(--border-radius-calendar-day-focus-ring-6ckim2, 2px);
|
|
314
318
|
box-shadow: 0 0 0 2px var(--color-border-calendar-grid-selected-focus-ring-hhlvy8, #0073bb);
|
|
315
319
|
}
|
|
316
|
-
body[data-awsui-focus-visible=true] .awsui_calendar-date-
|
|
320
|
+
body[data-awsui-focus-visible=true] .awsui_calendar-date-selected_1ykar_1ln6p_239:not(#\9):focus:focus::before {
|
|
317
321
|
z-index: 2;
|
|
318
322
|
}
|
|
319
|
-
.awsui_calendar-date-
|
|
320
|
-
background-color: var(--color-background-control-checked-pvanxo, #0073bb);
|
|
321
|
-
border-block: var(--border-item-width-0zxiwv, 1px) solid var(--color-background-control-checked-pvanxo, #0073bb);
|
|
322
|
-
border-inline: var(--border-item-width-0zxiwv, 1px) solid var(--color-background-control-checked-pvanxo, #0073bb);
|
|
323
|
+
.awsui_calendar-date-selected_1ykar_1ln6p_239:not(#\9)::after {
|
|
323
324
|
border-start-start-radius: var(--border-radius-item-jsz3j8, 0px);
|
|
324
325
|
border-start-end-radius: var(--border-radius-item-jsz3j8, 0px);
|
|
325
326
|
border-end-start-radius: var(--border-radius-item-jsz3j8, 0px);
|
|
326
327
|
border-end-end-radius: var(--border-radius-item-jsz3j8, 0px);
|
|
328
|
+
background-color: var(--color-background-control-checked-pvanxo, #0073bb);
|
|
329
|
+
border-block: var(--border-item-width-0zxiwv, 1px) solid var(--color-background-control-checked-pvanxo, #0073bb);
|
|
330
|
+
border-inline: var(--border-item-width-0zxiwv, 1px) solid var(--color-background-control-checked-pvanxo, #0073bb);
|
|
327
331
|
}
|
|
328
|
-
.awsui_calendar-date-
|
|
332
|
+
.awsui_calendar-date-selected_1ykar_1ln6p_239 > .awsui_date-inner_1ykar_1ln6p_261:not(#\9) {
|
|
329
333
|
z-index: 2;
|
|
330
334
|
color: var(--color-background-control-default-n6yadr, #ffffff);
|
|
331
335
|
position: relative;
|
|
332
336
|
}
|
|
333
|
-
.awsui_calendar-
|
|
337
|
+
.awsui_calendar-row_1ykar_1ln6p_336:not(#\9):first-child > .awsui_calendar-date_1ykar_1ln6p_198 {
|
|
334
338
|
border-block-start: 1px solid var(--color-border-calendar-grid-2ab4m1, #eaeded);
|
|
335
339
|
}
|
|
@@ -2,23 +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": "
|
|
6
|
-
"awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-
|
|
7
|
-
"root": "
|
|
8
|
-
"calendar-inner": "awsui_calendar-
|
|
9
|
-
"calendar-header": "awsui_calendar-
|
|
10
|
-
"calendar-header-month": "awsui_calendar-header-
|
|
11
|
-
"calendar-next-btn": "awsui_calendar-next-
|
|
12
|
-
"calendar-prev-btn": "awsui_calendar-prev-
|
|
13
|
-
"calendar-grid": "awsui_calendar-
|
|
14
|
-
"calendar-grid-cell": "awsui_calendar-grid-
|
|
15
|
-
"calendar-date-header": "awsui_calendar-date-
|
|
16
|
-
"calendar-date": "awsui_calendar-
|
|
17
|
-
"calendar-date-enabled": "awsui_calendar-date-
|
|
18
|
-
"calendar-date-current-page": "awsui_calendar-date-current-
|
|
19
|
-
"calendar-date-selected": "awsui_calendar-date-
|
|
20
|
-
"calendar-date-current": "awsui_calendar-date-
|
|
21
|
-
"date-inner": "awsui_date-
|
|
22
|
-
"calendar-row": "awsui_calendar-
|
|
5
|
+
"calendar": "awsui_calendar_1ykar_1ln6p_93",
|
|
6
|
+
"awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1ykar_1ln6p_1",
|
|
7
|
+
"root": "awsui_root_1ykar_1ln6p_124",
|
|
8
|
+
"calendar-inner": "awsui_calendar-inner_1ykar_1ln6p_165",
|
|
9
|
+
"calendar-header": "awsui_calendar-header_1ykar_1ln6p_169",
|
|
10
|
+
"calendar-header-month": "awsui_calendar-header-month_1ykar_1ln6p_174",
|
|
11
|
+
"calendar-next-btn": "awsui_calendar-next-btn_1ykar_1ln6p_182",
|
|
12
|
+
"calendar-prev-btn": "awsui_calendar-prev-btn_1ykar_1ln6p_185",
|
|
13
|
+
"calendar-grid": "awsui_calendar-grid_1ykar_1ln6p_188",
|
|
14
|
+
"calendar-grid-cell": "awsui_calendar-grid-cell_1ykar_1ln6p_192",
|
|
15
|
+
"calendar-date-header": "awsui_calendar-date-header_1ykar_1ln6p_198",
|
|
16
|
+
"calendar-date": "awsui_calendar-date_1ykar_1ln6p_198",
|
|
17
|
+
"calendar-date-enabled": "awsui_calendar-date-enabled_1ykar_1ln6p_218",
|
|
18
|
+
"calendar-date-current-page": "awsui_calendar-date-current-page_1ykar_1ln6p_228",
|
|
19
|
+
"calendar-date-selected": "awsui_calendar-date-selected_1ykar_1ln6p_239",
|
|
20
|
+
"calendar-date-current": "awsui_calendar-date-current_1ykar_1ln6p_228",
|
|
21
|
+
"date-inner": "awsui_date-inner_1ykar_1ln6p_261",
|
|
22
|
+
"calendar-row": "awsui_calendar-row_1ykar_1ln6p_336"
|
|
23
23
|
};
|
|
24
24
|
|
package/lib/internal/template/internal/components/options-list/utils/use-highlight-option.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-highlight-option.d.ts","sourceRoot":"lib/default/","sources":["internal/components/options-list/utils/use-highlight-option.ts"],"names":[],"mappings":"AAIA,qBAAa,aAAa;IACL,IAAI,EAAE,UAAU,GAAG,OAAO;IAAS,SAAS,EAAE,OAAO;gBAArD,IAAI,EAAE,UAAU,GAAG,OAAO,EAAS,SAAS,GAAE,OAA6B;CAC/F;AAED,MAAM,WAAW,sBAAsB,CAAC,UAAU;IAChD,OAAO,EAAE,SAAS,UAAU,EAAE,CAAC;IAC/B,eAAe,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK,OAAO,CAAC;CAClD;AAED,MAAM,WAAW,sBAAsB,CAAC,UAAU;IAChD,aAAa,EAAE,aAAa,CAAC;IAC7B,gBAAgB,EAAE,MAAM,CAAC;IACzB,iBAAiB,CAAC,EAAE,UAAU,CAAC;CAChC;AAED,MAAM,WAAW,yBAAyB,CAAC,UAAU;IAEnD,4BAA4B,CAAC,KAAK,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAEvE,yBAAyB,CAAC,SAAS,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IACnD,2BAA2B,CAAC,MAAM,EAAE,UAAU,GAAG,IAAI,CAAC;IACtD,0BAA0B,IAAI,IAAI,CAAC;IACnC,kBAAkB,IAAI,IAAI,CAAC;IAC3B,iBAAiB,IAAI,IAAI,CAAC;CAC3B;AAED,wBAAgB,oBAAoB,CAAC,UAAU,EAAE,EAC/C,OAAO,EACP,eAAe,GAChB,EAAE,sBAAsB,CAAC,UAAU,CAAC,GAAG,CAAC,sBAAsB,CAAC,UAAU,CAAC,EAAE,yBAAyB,CAAC,UAAU,CAAC,CAAC,
|
|
1
|
+
{"version":3,"file":"use-highlight-option.d.ts","sourceRoot":"lib/default/","sources":["internal/components/options-list/utils/use-highlight-option.ts"],"names":[],"mappings":"AAIA,qBAAa,aAAa;IACL,IAAI,EAAE,UAAU,GAAG,OAAO;IAAS,SAAS,EAAE,OAAO;gBAArD,IAAI,EAAE,UAAU,GAAG,OAAO,EAAS,SAAS,GAAE,OAA6B;CAC/F;AAED,MAAM,WAAW,sBAAsB,CAAC,UAAU;IAChD,OAAO,EAAE,SAAS,UAAU,EAAE,CAAC;IAC/B,eAAe,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK,OAAO,CAAC;CAClD;AAED,MAAM,WAAW,sBAAsB,CAAC,UAAU;IAChD,aAAa,EAAE,aAAa,CAAC;IAC7B,gBAAgB,EAAE,MAAM,CAAC;IACzB,iBAAiB,CAAC,EAAE,UAAU,CAAC;CAChC;AAED,MAAM,WAAW,yBAAyB,CAAC,UAAU;IAEnD,4BAA4B,CAAC,KAAK,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAEvE,yBAAyB,CAAC,SAAS,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IACnD,2BAA2B,CAAC,MAAM,EAAE,UAAU,GAAG,IAAI,CAAC;IACtD,0BAA0B,IAAI,IAAI,CAAC;IACnC,kBAAkB,IAAI,IAAI,CAAC;IAC3B,iBAAiB,IAAI,IAAI,CAAC;CAC3B;AAED,wBAAgB,oBAAoB,CAAC,UAAU,EAAE,EAC/C,OAAO,EACP,eAAe,GAChB,EAAE,sBAAsB,CAAC,UAAU,CAAC,GAAG,CAAC,sBAAsB,CAAC,UAAU,CAAC,EAAE,yBAAyB,CAAC,UAAU,CAAC,CAAC,CA8ClH"}
|
package/lib/internal/template/internal/components/options-list/utils/use-highlight-option.js
CHANGED
|
@@ -16,7 +16,8 @@ export function useHighlightedOption({ options, isHighlightable, }) {
|
|
|
16
16
|
}, []);
|
|
17
17
|
const highlightedOption = options[highlightedIndex] && isHighlightable(options[highlightedIndex]) ? options[highlightedIndex] : undefined;
|
|
18
18
|
const moveHighlightFrom = (direction, startIndex = highlightedIndex, highlightType) => {
|
|
19
|
-
|
|
19
|
+
const fromBottomEnd = startIndex === -1 && direction === -1;
|
|
20
|
+
let newIndex = fromBottomEnd ? options.length : startIndex;
|
|
20
21
|
do {
|
|
21
22
|
newIndex += direction;
|
|
22
23
|
} while (options[newIndex] && !isHighlightable(options[newIndex]));
|
package/lib/internal/template/internal/components/options-list/utils/use-highlight-option.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-highlight-option.js","sourceRoot":"lib/default/","sources":["internal/components/options-list/utils/use-highlight-option.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE9C,MAAM,OAAO,aAAa;IACxB,YAAmB,IAA0B,EAAS,YAAqB,IAAI,KAAK,UAAU;QAA3E,SAAI,GAAJ,IAAI,CAAsB;QAAS,cAAS,GAAT,SAAS,CAA+B;IAAG,CAAC;CACnG;AAwBD,MAAM,UAAU,oBAAoB,CAAa,EAC/C,OAAO,EACP,eAAe,GACoB;IACnC,MAAM,CAAC,gBAAgB,EAAE,wBAAwB,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;IAClE,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAgB,IAAI,aAAa,CAAC,UAAU,CAAC,CAAC,CAAC;IACjG,MAAM,mBAAmB,GAAG,WAAW,CAAC,CAAC,KAAa,EAAE,aAA4B,EAAE,EAAE;QACtF,wBAAwB,CAAC,KAAK,CAAC,CAAC;QAChC,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAClC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,iBAAiB,GACrB,OAAO,CAAC,gBAAgB,CAAC,IAAI,eAAe,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAElH,MAAM,iBAAiB,GAAG,CAAC,SAAiB,EAAE,UAAU,GAAG,gBAAgB,EAAE,aAA4B,EAAE,EAAE;QAC3G,IAAI,QAAQ,GAAG,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"use-highlight-option.js","sourceRoot":"lib/default/","sources":["internal/components/options-list/utils/use-highlight-option.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE9C,MAAM,OAAO,aAAa;IACxB,YAAmB,IAA0B,EAAS,YAAqB,IAAI,KAAK,UAAU;QAA3E,SAAI,GAAJ,IAAI,CAAsB;QAAS,cAAS,GAAT,SAAS,CAA+B;IAAG,CAAC;CACnG;AAwBD,MAAM,UAAU,oBAAoB,CAAa,EAC/C,OAAO,EACP,eAAe,GACoB;IACnC,MAAM,CAAC,gBAAgB,EAAE,wBAAwB,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;IAClE,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAgB,IAAI,aAAa,CAAC,UAAU,CAAC,CAAC,CAAC;IACjG,MAAM,mBAAmB,GAAG,WAAW,CAAC,CAAC,KAAa,EAAE,aAA4B,EAAE,EAAE;QACtF,wBAAwB,CAAC,KAAK,CAAC,CAAC;QAChC,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAClC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,iBAAiB,GACrB,OAAO,CAAC,gBAAgB,CAAC,IAAI,eAAe,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAElH,MAAM,iBAAiB,GAAG,CAAC,SAAiB,EAAE,UAAU,GAAG,gBAAgB,EAAE,aAA4B,EAAE,EAAE;QAC3G,MAAM,aAAa,GAAG,UAAU,KAAK,CAAC,CAAC,IAAI,SAAS,KAAK,CAAC,CAAC,CAAC;QAC5D,IAAI,QAAQ,GAAG,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC;QAC3D,GAAG;YACD,QAAQ,IAAI,SAAS,CAAC;SACvB,QAAQ,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,EAAE;QAEnE,IAAI,OAAO,CAAC,QAAQ,CAAC,EAAE;YACrB,mBAAmB,CAAC,QAAQ,EAAE,aAAa,CAAC,CAAC;SAC9C;IACH,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,CAAC,SAAiB,EAAE,aAA4B,EAAE,EAAE,CACxE,iBAAiB,CAAC,SAAS,EAAE,gBAAgB,EAAE,aAAa,CAAC,CAAC;IAEhE,MAAM,eAAe,GAAG,WAAW,CACjC,CAAC,MAAkB,EAAE,aAA4B,EAAE,EAAE;QACnD,MAAM,KAAK,GAAG,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;QACtC,mBAAmB,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC;IAC5C,CAAC,EACD,CAAC,OAAO,EAAE,mBAAmB,CAAC,CAC/B,CAAC;IAEF,OAAO;QACL,EAAE,aAAa,EAAE,gBAAgB,EAAE,iBAAiB,EAAE;QACtD;YACE,4BAA4B,EAAE,CAAC,KAAa,EAAE,SAAS,GAAG,KAAK,EAAE,EAAE,CACjE,mBAAmB,CAAC,KAAK,EAAE,IAAI,aAAa,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;YACnE,yBAAyB,EAAE,CAAC,SAAiB,EAAE,EAAE,CAAC,aAAa,CAAC,SAAS,EAAE,IAAI,aAAa,CAAC,UAAU,CAAC,CAAC;YACzG,2BAA2B,EAAE,CAAC,MAAkB,EAAE,EAAE,CAAC,eAAe,CAAC,MAAM,EAAE,IAAI,aAAa,CAAC,UAAU,CAAC,CAAC;YAC3G,0BAA0B,EAAE,GAAG,EAAE,CAAC,mBAAmB,CAAC,CAAC,CAAC,EAAE,IAAI,aAAa,CAAC,UAAU,CAAC,CAAC;YACxF,kBAAkB,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,IAAI,aAAa,CAAC,UAAU,CAAC,CAAC;YACjF,iBAAiB,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,MAAM,EAAE,IAAI,aAAa,CAAC,UAAU,CAAC,CAAC;SAC9F;KACF,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { useCallback, useState } from 'react';\n\nexport class HighlightType {\n constructor(public type: 'keyboard' | 'mouse', public moveFocus: boolean = type === 'keyboard') {}\n}\n\nexport interface HighlightedOptionProps<OptionType> {\n options: readonly OptionType[];\n isHighlightable: (option: OptionType) => boolean;\n}\n\nexport interface HighlightedOptionState<OptionType> {\n highlightType: HighlightType;\n highlightedIndex: number;\n highlightedOption?: OptionType;\n}\n\nexport interface HighlightedOptionHandlers<OptionType> {\n // Mouse handlers\n setHighlightedIndexWithMouse(index: number, moveFocus?: boolean): void;\n // Keyboard handlers\n moveHighlightWithKeyboard(direction: -1 | 1): void;\n highlightOptionWithKeyboard(option: OptionType): void;\n resetHighlightWithKeyboard(): void;\n goHomeWithKeyboard(): void;\n goEndWithKeyboard(): void;\n}\n\nexport function useHighlightedOption<OptionType>({\n options,\n isHighlightable,\n}: HighlightedOptionProps<OptionType>): [HighlightedOptionState<OptionType>, HighlightedOptionHandlers<OptionType>] {\n const [highlightedIndex, setHighlightedIndexState] = useState(-1);\n const [highlightType, setHighlightType] = useState<HighlightType>(new HighlightType('keyboard'));\n const setHighlightedIndex = useCallback((index: number, highlightType: HighlightType) => {\n setHighlightedIndexState(index);\n setHighlightType(highlightType);\n }, []);\n\n const highlightedOption =\n options[highlightedIndex] && isHighlightable(options[highlightedIndex]) ? options[highlightedIndex] : undefined;\n\n const moveHighlightFrom = (direction: -1 | 1, startIndex = highlightedIndex, highlightType: HighlightType) => {\n const fromBottomEnd = startIndex === -1 && direction === -1;\n let newIndex = fromBottomEnd ? options.length : startIndex;\n do {\n newIndex += direction;\n } while (options[newIndex] && !isHighlightable(options[newIndex]));\n\n if (options[newIndex]) {\n setHighlightedIndex(newIndex, highlightType);\n }\n };\n\n const moveHighlight = (direction: -1 | 1, highlightType: HighlightType) =>\n moveHighlightFrom(direction, highlightedIndex, highlightType);\n\n const highlightOption = useCallback(\n (option: OptionType, highlightType: HighlightType) => {\n const index = options.indexOf(option);\n setHighlightedIndex(index, highlightType);\n },\n [options, setHighlightedIndex]\n );\n\n return [\n { highlightType, highlightedIndex, highlightedOption },\n {\n setHighlightedIndexWithMouse: (index: number, moveFocus = false) =>\n setHighlightedIndex(index, new HighlightType('mouse', moveFocus)),\n moveHighlightWithKeyboard: (direction: -1 | 1) => moveHighlight(direction, new HighlightType('keyboard')),\n highlightOptionWithKeyboard: (option: OptionType) => highlightOption(option, new HighlightType('keyboard')),\n resetHighlightWithKeyboard: () => setHighlightedIndex(-1, new HighlightType('keyboard')),\n goHomeWithKeyboard: () => moveHighlightFrom(1, -1, new HighlightType('keyboard')),\n goEndWithKeyboard: () => moveHighlightFrom(-1, options.length, new HighlightType('keyboard')),\n },\n ];\n}\n"]}
|