@cloudscape-design/components-themeable 3.0.57 → 3.0.59
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/scss/{date-picker → calendar}/motion.scss +0 -0
- package/lib/internal/scss/calendar/styles.scss +170 -0
- package/lib/internal/scss/date-picker/styles.scss +13 -163
- package/lib/internal/template/autosuggest/internal.d.ts.map +1 -1
- package/lib/internal/template/autosuggest/internal.js +1 -5
- package/lib/internal/template/autosuggest/internal.js.map +1 -1
- package/lib/internal/template/{date-picker/calendar → calendar}/grid/day/index.d.ts +1 -1
- package/lib/internal/template/calendar/grid/day/index.d.ts.map +1 -0
- package/lib/internal/template/{date-picker/calendar → calendar}/grid/day/index.js +1 -1
- package/lib/internal/template/calendar/grid/day/index.js.map +1 -0
- package/lib/internal/template/{date-picker/calendar → calendar}/grid/index.d.ts +2 -2
- package/lib/internal/template/calendar/grid/index.d.ts.map +1 -0
- package/lib/internal/template/{date-picker/calendar → calendar}/grid/index.js +2 -2
- package/lib/internal/template/calendar/grid/index.js.map +1 -0
- package/lib/internal/template/{date-picker/calendar → calendar}/header/button/index.d.ts +0 -0
- package/lib/internal/template/calendar/header/button/index.d.ts.map +1 -0
- package/lib/internal/template/{date-picker/calendar → calendar}/header/button/index.js +2 -2
- package/lib/internal/template/calendar/header/button/index.js.map +1 -0
- package/lib/internal/template/{date-picker/calendar → calendar}/header/index.d.ts +1 -2
- package/lib/internal/template/calendar/header/index.d.ts.map +1 -0
- package/lib/internal/template/{date-picker/calendar → calendar}/header/index.js +3 -3
- package/lib/internal/template/calendar/header/index.js.map +1 -0
- package/lib/internal/template/calendar/index.d.ts +4 -0
- package/lib/internal/template/calendar/index.d.ts.map +1 -0
- package/lib/internal/template/calendar/index.js +14 -0
- package/lib/internal/template/calendar/index.js.map +1 -0
- package/lib/internal/template/calendar/interfaces.d.ts +56 -0
- package/lib/internal/template/calendar/interfaces.d.ts.map +1 -0
- package/lib/internal/template/calendar/interfaces.js +4 -0
- package/lib/internal/template/calendar/interfaces.js.map +1 -0
- package/lib/internal/template/calendar/internal.d.ts +4 -0
- package/lib/internal/template/calendar/internal.d.ts.map +1 -0
- package/lib/internal/template/{date-picker/calendar/index.js → calendar/internal.js} +9 -13
- package/lib/internal/template/calendar/internal.js.map +1 -0
- package/lib/internal/template/calendar/styles.css.js +25 -0
- package/lib/internal/template/calendar/styles.scoped.css +291 -0
- package/lib/internal/template/calendar/styles.selectors.js +26 -0
- package/lib/internal/template/{date-picker/calendar → calendar}/utils/intl.d.ts +2 -2
- package/lib/internal/template/calendar/utils/intl.d.ts.map +1 -0
- package/lib/internal/template/{date-picker/calendar → calendar}/utils/intl.js +2 -0
- package/lib/internal/template/calendar/utils/intl.js.map +1 -0
- package/lib/internal/template/{date-picker/calendar → calendar}/utils/locales.d.ts +1 -1
- package/lib/internal/template/calendar/utils/locales.d.ts.map +1 -0
- package/lib/internal/template/{date-picker/calendar → calendar}/utils/locales.js +1 -1
- package/lib/internal/template/calendar/utils/locales.js.map +1 -0
- package/lib/internal/template/{date-picker/calendar → calendar}/utils/memoized-date.d.ts +0 -0
- package/lib/internal/template/calendar/utils/memoized-date.d.ts.map +1 -0
- package/lib/internal/template/{date-picker/calendar → calendar}/utils/memoized-date.js +1 -1
- package/lib/internal/template/calendar/utils/memoized-date.js.map +1 -0
- package/lib/internal/template/{date-picker/calendar → calendar}/utils/move-focus-handler.d.ts +1 -1
- package/lib/internal/template/calendar/utils/move-focus-handler.d.ts.map +1 -0
- package/lib/internal/template/{date-picker/calendar → calendar}/utils/move-focus-handler.js +0 -0
- package/lib/internal/template/calendar/utils/move-focus-handler.js.map +1 -0
- package/lib/internal/template/calendar/utils/rotate-day-indexes.d.ts +3 -0
- package/lib/internal/template/calendar/utils/rotate-day-indexes.d.ts.map +1 -0
- package/lib/internal/template/{date-picker/calendar → calendar}/utils/rotate-day-indexes.js +2 -0
- package/lib/internal/template/calendar/utils/rotate-day-indexes.js.map +1 -0
- package/lib/internal/template/date-picker/index.d.ts.map +1 -1
- package/lib/internal/template/date-picker/index.js +16 -10
- package/lib/internal/template/date-picker/index.js.map +1 -1
- package/lib/internal/template/date-picker/interfaces.d.ts +2 -44
- package/lib/internal/template/date-picker/interfaces.d.ts.map +1 -1
- package/lib/internal/template/date-picker/interfaces.js.map +1 -1
- package/lib/internal/template/date-picker/styles.css.js +7 -24
- package/lib/internal/template/date-picker/styles.scoped.css +21 -210
- package/lib/internal/template/date-picker/styles.selectors.js +7 -24
- package/lib/internal/template/date-range-picker/calendar/get-base-date.js +1 -1
- package/lib/internal/template/date-range-picker/calendar/get-base-date.js.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/grids/day/index.js +1 -1
- package/lib/internal/template/date-range-picker/calendar/grids/day/index.js.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/grids/grid.js +2 -2
- package/lib/internal/template/date-range-picker/calendar/grids/grid.js.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/grids/index.d.ts +1 -1
- package/lib/internal/template/date-range-picker/calendar/grids/index.d.ts.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/grids/index.js.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/header/index.js +1 -1
- package/lib/internal/template/date-range-picker/calendar/header/index.js.map +1 -1
- package/lib/internal/template/date-range-picker/calendar/index.js +3 -3
- package/lib/internal/template/date-range-picker/calendar/index.js.map +1 -1
- package/lib/internal/template/date-range-picker/index.js +1 -1
- package/lib/internal/template/date-range-picker/index.js.map +1 -1
- package/lib/internal/template/internal/components/autosuggest-input/index.d.ts +1 -1
- package/lib/internal/template/internal/components/autosuggest-input/index.d.ts.map +1 -1
- package/lib/internal/template/internal/components/autosuggest-input/index.js +42 -6
- package/lib/internal/template/internal/components/autosuggest-input/index.js.map +1 -1
- package/lib/internal/template/internal/environment.js +1 -1
- package/lib/internal/template/property-filter/property-filter-autosuggest.d.ts.map +1 -1
- package/lib/internal/template/property-filter/property-filter-autosuggest.js +1 -5
- package/lib/internal/template/property-filter/property-filter-autosuggest.js.map +1 -1
- package/lib/internal/template/test-utils/dom/calendar/index.d.ts +16 -0
- package/lib/internal/template/test-utils/dom/calendar/index.js +53 -0
- package/lib/internal/template/test-utils/dom/calendar/index.js.map +1 -0
- package/lib/internal/template/test-utils/dom/date-picker/index.d.ts +2 -14
- package/lib/internal/template/test-utils/dom/date-picker/index.js +4 -33
- package/lib/internal/template/test-utils/dom/date-picker/index.js.map +1 -1
- package/lib/internal/template/test-utils/selectors/calendar/index.d.ts +16 -0
- package/lib/internal/template/test-utils/selectors/calendar/index.js +53 -0
- package/lib/internal/template/test-utils/selectors/calendar/index.js.map +1 -0
- package/lib/internal/template/test-utils/selectors/date-picker/index.d.ts +2 -14
- package/lib/internal/template/test-utils/selectors/date-picker/index.js +2 -31
- package/lib/internal/template/test-utils/selectors/date-picker/index.js.map +1 -1
- package/lib/internal/template/test-utils/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
- package/lib/internal/template/date-picker/calendar/grid/day/index.d.ts.map +0 -1
- package/lib/internal/template/date-picker/calendar/grid/day/index.js.map +0 -1
- package/lib/internal/template/date-picker/calendar/grid/index.d.ts.map +0 -1
- package/lib/internal/template/date-picker/calendar/grid/index.js.map +0 -1
- package/lib/internal/template/date-picker/calendar/header/button/index.d.ts.map +0 -1
- package/lib/internal/template/date-picker/calendar/header/button/index.js.map +0 -1
- package/lib/internal/template/date-picker/calendar/header/index.d.ts.map +0 -1
- package/lib/internal/template/date-picker/calendar/header/index.js.map +0 -1
- package/lib/internal/template/date-picker/calendar/index.d.ts +0 -17
- package/lib/internal/template/date-picker/calendar/index.d.ts.map +0 -1
- package/lib/internal/template/date-picker/calendar/index.js.map +0 -1
- package/lib/internal/template/date-picker/calendar/utils/intl.d.ts.map +0 -1
- package/lib/internal/template/date-picker/calendar/utils/intl.js.map +0 -1
- package/lib/internal/template/date-picker/calendar/utils/locales.d.ts.map +0 -1
- package/lib/internal/template/date-picker/calendar/utils/locales.js.map +0 -1
- package/lib/internal/template/date-picker/calendar/utils/memoized-date.d.ts.map +0 -1
- package/lib/internal/template/date-picker/calendar/utils/memoized-date.js.map +0 -1
- package/lib/internal/template/date-picker/calendar/utils/move-focus-handler.d.ts.map +0 -1
- package/lib/internal/template/date-picker/calendar/utils/move-focus-handler.js.map +0 -1
- package/lib/internal/template/date-picker/calendar/utils/rotate-day-indexes.d.ts +0 -3
- package/lib/internal/template/date-picker/calendar/utils/rotate-day-indexes.d.ts.map +0 -1
- package/lib/internal/template/date-picker/calendar/utils/rotate-day-indexes.js.map +0 -1
|
File without changes
|
|
@@ -0,0 +1,170 @@
|
|
|
1
|
+
/*
|
|
2
|
+
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
3
|
+
SPDX-License-Identifier: Apache-2.0
|
|
4
|
+
*/
|
|
5
|
+
|
|
6
|
+
@use '../internal/styles/index' as styles;
|
|
7
|
+
@use '../internal/styles/tokens' as awsui;
|
|
8
|
+
@use '../internal/hooks/focus-visible' as focus-visible;
|
|
9
|
+
@use '../internal/styles/typography/index' as typographyConstants;
|
|
10
|
+
@use './motion';
|
|
11
|
+
|
|
12
|
+
$calendar-header-color: awsui.$color-text-dropdown-item-default;
|
|
13
|
+
$calendar-grid-border-color: awsui.$color-border-calendar-grid;
|
|
14
|
+
$calendar-grid-day-color: awsui.$color-text-dropdown-item-default;
|
|
15
|
+
$calendar-grid-day-name-color: awsui.$color-text-calendar-month;
|
|
16
|
+
$calendar-grid-disabled-day-color: awsui.$color-text-dropdown-item-disabled;
|
|
17
|
+
$calendar-grid-nonmonth-day-color: awsui.$color-text-dropdown-item-secondary;
|
|
18
|
+
$calendar-grid-hover-background-color: awsui.$color-background-dropdown-item-hover;
|
|
19
|
+
$calendar-grid-hover-border-color: awsui.$color-border-dropdown-item-hover;
|
|
20
|
+
$calendar-grid-today-background-color: awsui.$color-background-calendar-today;
|
|
21
|
+
$calendar-grid-selected-background-color: awsui.$color-background-dropdown-item-selected;
|
|
22
|
+
$calendar-grid-selected-border-color: awsui.$color-border-dropdown-item-selected;
|
|
23
|
+
$calendar-grid-border: 1px solid $calendar-grid-border-color;
|
|
24
|
+
|
|
25
|
+
.root {
|
|
26
|
+
/* used in test-utils */
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
.calendar {
|
|
30
|
+
display: block;
|
|
31
|
+
// IE11 does not calculate the height correctly when in nested flex containers (@see https://github.com/philipwalton/flexbugs#flexbug-3)
|
|
32
|
+
width: 234px;
|
|
33
|
+
overflow: auto;
|
|
34
|
+
|
|
35
|
+
&-inner {
|
|
36
|
+
margin: awsui.$space-xs;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
&-header {
|
|
40
|
+
display: flex;
|
|
41
|
+
justify-content: space-between;
|
|
42
|
+
align-items: center;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
&-header-month {
|
|
46
|
+
@include styles.font-body-m;
|
|
47
|
+
font-weight: typographyConstants.$font-weight-bold;
|
|
48
|
+
color: $calendar-header-color;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
&-next-month-btn {
|
|
52
|
+
/* used for identifying element */
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
&-prev-month-btn {
|
|
56
|
+
/* used for identifying element */
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
&-day-names {
|
|
60
|
+
display: flex;
|
|
61
|
+
justify-content: stretch;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
&-day-name {
|
|
65
|
+
flex: 1 1 0%;
|
|
66
|
+
width: 0;
|
|
67
|
+
word-break: break-word;
|
|
68
|
+
text-align: center;
|
|
69
|
+
padding: awsui.$space-s 0 awsui.$space-xxs;
|
|
70
|
+
color: $calendar-grid-day-name-color;
|
|
71
|
+
@include styles.font-body-s;
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
&-dates {
|
|
75
|
+
border: $calendar-grid-border;
|
|
76
|
+
}
|
|
77
|
+
&-week {
|
|
78
|
+
display: flex;
|
|
79
|
+
justify-content: stretch;
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
&-day {
|
|
83
|
+
flex: 1 1 0%;
|
|
84
|
+
width: 0;
|
|
85
|
+
word-break: break-word;
|
|
86
|
+
text-align: center;
|
|
87
|
+
border-bottom: $calendar-grid-border;
|
|
88
|
+
border-right: $calendar-grid-border;
|
|
89
|
+
border-radius: awsui.$border-radius-item;
|
|
90
|
+
padding: awsui.$space-xxs 0;
|
|
91
|
+
color: $calendar-grid-disabled-day-color;
|
|
92
|
+
position: relative;
|
|
93
|
+
|
|
94
|
+
&:last-child {
|
|
95
|
+
border-right: none;
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
&-in-last-week {
|
|
99
|
+
border-bottom: none;
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
&-focusable {
|
|
103
|
+
/* used for identifying element */
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
&-enabled {
|
|
107
|
+
cursor: pointer;
|
|
108
|
+
color: $calendar-grid-nonmonth-day-color;
|
|
109
|
+
|
|
110
|
+
&.calendar-day-current-month {
|
|
111
|
+
color: $calendar-grid-day-color;
|
|
112
|
+
&:hover {
|
|
113
|
+
color: awsui.$color-text-calendar-day-hover;
|
|
114
|
+
background-color: $calendar-grid-hover-background-color;
|
|
115
|
+
&:not(.calendar-day-selected) {
|
|
116
|
+
&::after {
|
|
117
|
+
border: awsui.$border-item-width solid $calendar-grid-hover-border-color;
|
|
118
|
+
border-radius: awsui.$border-radius-item;
|
|
119
|
+
}
|
|
120
|
+
}
|
|
121
|
+
}
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
|
|
125
|
+
&-today {
|
|
126
|
+
background-color: $calendar-grid-today-background-color;
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
&::after {
|
|
130
|
+
content: '';
|
|
131
|
+
position: absolute;
|
|
132
|
+
top: -1px;
|
|
133
|
+
left: -1px;
|
|
134
|
+
bottom: -1px;
|
|
135
|
+
right: -1px;
|
|
136
|
+
background-color: transparent;
|
|
137
|
+
}
|
|
138
|
+
> .day-inner {
|
|
139
|
+
position: relative;
|
|
140
|
+
z-index: 1;
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
&:focus {
|
|
144
|
+
outline: none;
|
|
145
|
+
@include styles.focus-highlight(
|
|
146
|
+
awsui.$space-calendar-grid-focus-outline-gutter,
|
|
147
|
+
awsui.$border-radius-calendar-day-focus-ring
|
|
148
|
+
);
|
|
149
|
+
&::before {
|
|
150
|
+
z-index: 2;
|
|
151
|
+
}
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
&-selected {
|
|
155
|
+
border-color: transparent;
|
|
156
|
+
position: relative;
|
|
157
|
+
&::after {
|
|
158
|
+
background-color: $calendar-grid-selected-background-color;
|
|
159
|
+
border: awsui.$border-item-width solid $calendar-grid-selected-border-color;
|
|
160
|
+
border-radius: awsui.$border-radius-item;
|
|
161
|
+
}
|
|
162
|
+
> .day-inner {
|
|
163
|
+
color: awsui.$color-text-calendar-day-selected;
|
|
164
|
+
position: relative;
|
|
165
|
+
}
|
|
166
|
+
}
|
|
167
|
+
}
|
|
168
|
+
|
|
169
|
+
@include styles.styles-reset;
|
|
170
|
+
}
|
|
@@ -7,25 +7,24 @@
|
|
|
7
7
|
@use '../internal/styles/tokens' as awsui;
|
|
8
8
|
@use '../internal/hooks/focus-visible' as focus-visible;
|
|
9
9
|
@use '../internal/styles/typography/index' as typographyConstants;
|
|
10
|
-
@use './motion';
|
|
11
|
-
|
|
12
|
-
$calendar-header-color: awsui.$color-text-dropdown-item-default;
|
|
13
|
-
$calendar-grid-border-color: awsui.$color-border-calendar-grid;
|
|
14
|
-
$calendar-grid-day-color: awsui.$color-text-dropdown-item-default;
|
|
15
|
-
$calendar-grid-day-name-color: awsui.$color-text-calendar-month;
|
|
16
|
-
$calendar-grid-disabled-day-color: awsui.$color-text-dropdown-item-disabled;
|
|
17
|
-
$calendar-grid-nonmonth-day-color: awsui.$color-text-dropdown-item-secondary;
|
|
18
|
-
$calendar-grid-hover-background-color: awsui.$color-background-dropdown-item-hover;
|
|
19
|
-
$calendar-grid-hover-border-color: awsui.$color-border-dropdown-item-hover;
|
|
20
|
-
$calendar-grid-today-background-color: awsui.$color-background-calendar-today;
|
|
21
|
-
$calendar-grid-selected-background-color: awsui.$color-background-dropdown-item-selected;
|
|
22
|
-
$calendar-grid-selected-border-color: awsui.$color-border-dropdown-item-selected;
|
|
23
|
-
$calendar-grid-border: 1px solid $calendar-grid-border-color;
|
|
24
10
|
|
|
25
11
|
.root {
|
|
26
12
|
@include styles.styles-reset;
|
|
27
13
|
}
|
|
28
14
|
|
|
15
|
+
.calendar {
|
|
16
|
+
&:focus {
|
|
17
|
+
outline: none;
|
|
18
|
+
}
|
|
19
|
+
@include focus-visible.when-visible {
|
|
20
|
+
@include styles.container-focus(awsui.$border-radius-dropdown);
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.screenreader-only {
|
|
25
|
+
@include styles.awsui-util-hide;
|
|
26
|
+
}
|
|
27
|
+
|
|
29
28
|
.date-picker-container {
|
|
30
29
|
position: relative;
|
|
31
30
|
max-width: 234px;
|
|
@@ -43,152 +42,3 @@ $calendar-grid-border: 1px solid $calendar-grid-border-color;
|
|
|
43
42
|
.open-calendar-button {
|
|
44
43
|
/* used in test-utils */
|
|
45
44
|
}
|
|
46
|
-
|
|
47
|
-
.calendar {
|
|
48
|
-
display: block;
|
|
49
|
-
// IE11 does not calculate the height correctly when in nested flex containers (@see https://github.com/philipwalton/flexbugs#flexbug-3)
|
|
50
|
-
width: 234px;
|
|
51
|
-
overflow: auto;
|
|
52
|
-
&:focus {
|
|
53
|
-
outline: none;
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
&-inner {
|
|
57
|
-
margin: awsui.$space-xs;
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
&-header {
|
|
61
|
-
display: flex;
|
|
62
|
-
justify-content: space-between;
|
|
63
|
-
align-items: center;
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
&-header-month {
|
|
67
|
-
@include styles.font-body-m;
|
|
68
|
-
font-weight: typographyConstants.$font-weight-bold;
|
|
69
|
-
color: $calendar-header-color;
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
&-next-month-btn {
|
|
73
|
-
/* used for identifying element */
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
&-prev-month-btn {
|
|
77
|
-
/* used for identifying element */
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
&-day-names {
|
|
81
|
-
display: flex;
|
|
82
|
-
justify-content: stretch;
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
&-day-name {
|
|
86
|
-
flex: 1 1 0%;
|
|
87
|
-
width: 0;
|
|
88
|
-
word-break: break-word;
|
|
89
|
-
text-align: center;
|
|
90
|
-
padding: awsui.$space-s 0 awsui.$space-xxs;
|
|
91
|
-
color: $calendar-grid-day-name-color;
|
|
92
|
-
@include styles.font-body-s;
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
&-dates {
|
|
96
|
-
border: $calendar-grid-border;
|
|
97
|
-
}
|
|
98
|
-
&-week {
|
|
99
|
-
display: flex;
|
|
100
|
-
justify-content: stretch;
|
|
101
|
-
}
|
|
102
|
-
|
|
103
|
-
&-day {
|
|
104
|
-
flex: 1 1 0%;
|
|
105
|
-
width: 0;
|
|
106
|
-
word-break: break-word;
|
|
107
|
-
text-align: center;
|
|
108
|
-
border-bottom: $calendar-grid-border;
|
|
109
|
-
border-right: $calendar-grid-border;
|
|
110
|
-
border-radius: awsui.$border-radius-item;
|
|
111
|
-
padding: awsui.$space-xxs 0;
|
|
112
|
-
color: $calendar-grid-disabled-day-color;
|
|
113
|
-
position: relative;
|
|
114
|
-
|
|
115
|
-
&:last-child {
|
|
116
|
-
border-right: none;
|
|
117
|
-
}
|
|
118
|
-
|
|
119
|
-
&-in-last-week {
|
|
120
|
-
border-bottom: none;
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
&-focusable {
|
|
124
|
-
/* used for identifying element */
|
|
125
|
-
}
|
|
126
|
-
|
|
127
|
-
&-enabled {
|
|
128
|
-
cursor: pointer;
|
|
129
|
-
color: $calendar-grid-nonmonth-day-color;
|
|
130
|
-
|
|
131
|
-
&.calendar-day-current-month {
|
|
132
|
-
color: $calendar-grid-day-color;
|
|
133
|
-
&:hover {
|
|
134
|
-
color: awsui.$color-text-calendar-day-hover;
|
|
135
|
-
background-color: $calendar-grid-hover-background-color;
|
|
136
|
-
&:not(.calendar-day-selected) {
|
|
137
|
-
&::after {
|
|
138
|
-
border: awsui.$border-item-width solid $calendar-grid-hover-border-color;
|
|
139
|
-
border-radius: awsui.$border-radius-item;
|
|
140
|
-
}
|
|
141
|
-
}
|
|
142
|
-
}
|
|
143
|
-
}
|
|
144
|
-
}
|
|
145
|
-
|
|
146
|
-
&-today {
|
|
147
|
-
background-color: $calendar-grid-today-background-color;
|
|
148
|
-
}
|
|
149
|
-
|
|
150
|
-
&::after {
|
|
151
|
-
content: '';
|
|
152
|
-
position: absolute;
|
|
153
|
-
top: -1px;
|
|
154
|
-
left: -1px;
|
|
155
|
-
bottom: -1px;
|
|
156
|
-
right: -1px;
|
|
157
|
-
background-color: transparent;
|
|
158
|
-
}
|
|
159
|
-
> .day-inner {
|
|
160
|
-
position: relative;
|
|
161
|
-
z-index: 1;
|
|
162
|
-
}
|
|
163
|
-
|
|
164
|
-
&:focus {
|
|
165
|
-
outline: none;
|
|
166
|
-
@include styles.focus-highlight(
|
|
167
|
-
awsui.$space-calendar-grid-focus-outline-gutter,
|
|
168
|
-
awsui.$border-radius-calendar-day-focus-ring
|
|
169
|
-
);
|
|
170
|
-
&::before {
|
|
171
|
-
z-index: 2;
|
|
172
|
-
}
|
|
173
|
-
}
|
|
174
|
-
|
|
175
|
-
&-selected {
|
|
176
|
-
border-color: transparent;
|
|
177
|
-
position: relative;
|
|
178
|
-
&::after {
|
|
179
|
-
background-color: $calendar-grid-selected-background-color;
|
|
180
|
-
border: awsui.$border-item-width solid $calendar-grid-selected-border-color;
|
|
181
|
-
border-radius: awsui.$border-radius-item;
|
|
182
|
-
}
|
|
183
|
-
> .day-inner {
|
|
184
|
-
color: awsui.$color-text-calendar-day-selected;
|
|
185
|
-
position: relative;
|
|
186
|
-
}
|
|
187
|
-
}
|
|
188
|
-
}
|
|
189
|
-
|
|
190
|
-
@include styles.styles-reset;
|
|
191
|
-
@include focus-visible.when-visible {
|
|
192
|
-
@include styles.container-focus(awsui.$border-radius-dropdown);
|
|
193
|
-
}
|
|
194
|
-
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/autosuggest/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAGhE,OAAO,EAAmB,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAYjE,OAAO,EAAoB,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAInE,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAQlF,MAAM,WAAW,wBAAyB,SAAQ,gBAAgB,EAAE,0BAA0B;CAAG;AAEjG,QAAA,MAAM,mBAAmB,
|
|
1
|
+
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/autosuggest/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAGhE,OAAO,EAAmB,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAYjE,OAAO,EAAoB,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAInE,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAQlF,MAAM,WAAW,wBAAyB,SAAQ,gBAAgB,EAAE,0BAA0B;CAAG;AAEjG,QAAA,MAAM,mBAAmB,iGA+KvB,CAAC;AAEH,eAAe,mBAAmB,CAAC"}
|
|
@@ -83,10 +83,6 @@ var InternalAutosuggest = React.forwardRef(function (props, ref) {
|
|
|
83
83
|
autosuggestLoadMoreHandlers.fireLoadMoreOnRecoveryClick();
|
|
84
84
|
(_a = autosuggestInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
85
85
|
};
|
|
86
|
-
var handleDropdownMouseDown = function (event) {
|
|
87
|
-
// Prevent currently focused element from losing focus.
|
|
88
|
-
event.preventDefault();
|
|
89
|
-
};
|
|
90
86
|
var formFieldContext = useFormFieldContext(restProps);
|
|
91
87
|
var selfControlId = useUniqueId('input');
|
|
92
88
|
var controlId = (_a = formFieldContext.controlId) !== null && _a !== void 0 ? _a : selfControlId;
|
|
@@ -94,7 +90,7 @@ var InternalAutosuggest = React.forwardRef(function (props, ref) {
|
|
|
94
90
|
var highlightedOptionId = autosuggestItemsState.highlightedOption ? generateUniqueId() : undefined;
|
|
95
91
|
var isEmpty = !value && !autosuggestItemsState.items.length;
|
|
96
92
|
var dropdownStatus = useDropdownStatus(__assign(__assign({}, props), { isEmpty: isEmpty, onRecoveryClick: handleRecoveryClick }));
|
|
97
|
-
return (React.createElement(AutosuggestInput, __assign({}, restProps, { className: clsx(styles.root, restProps.className), ref: autosuggestInputRef, __internalRootRef: __internalRootRef, value: value, onChange: handleChange, onBlur: handleBlur, onFocus: handleFocus, onKeyUp: handleKeyUp, onKeyDown: handleKeyDown, name: name, controlId: controlId, placeholder: placeholder, disabled: disabled, readOnly: readOnly, autoFocus: autoFocus, ariaLabel: ariaLabel, ariaRequired: ariaRequired, disableBrowserAutocorrect: disableBrowserAutocorrect, expandToViewport: expandToViewport, ariaControls: listId, ariaActivedescendant: highlightedOptionId, dropdownExpanded: autosuggestItemsState.items.length > 1 || dropdownStatus.content !== null, dropdownContent: React.createElement(AutosuggestOptionsList, { autosuggestItemsState: autosuggestItemsState, autosuggestItemsHandlers: autosuggestItemsHandlers, highlightedOptionId: highlightedOptionId, highlightText: value, listId: listId, controlId: controlId, enteredTextLabel: enteredTextLabel, handleLoadMore: autosuggestLoadMoreHandlers.fireLoadMoreOnScroll, hasDropdownStatus: dropdownStatus.content !== null, virtualScroll: virtualScroll, selectedAriaLabel: selectedAriaLabel, renderHighlightedAriaLive: renderHighlightedAriaLive, listBottom: !dropdownStatus.isSticky ? React.createElement(DropdownFooter, { content: dropdownStatus.content }) : null }), dropdownFooter: dropdownStatus.isSticky ? (React.createElement(DropdownFooter, { content: dropdownStatus.content, hasItems: autosuggestItemsState.items.length >= 1 })) : null,
|
|
93
|
+
return (React.createElement(AutosuggestInput, __assign({}, restProps, { className: clsx(styles.root, restProps.className), ref: autosuggestInputRef, __internalRootRef: __internalRootRef, value: value, onChange: handleChange, onBlur: handleBlur, onFocus: handleFocus, onKeyUp: handleKeyUp, onKeyDown: handleKeyDown, name: name, controlId: controlId, placeholder: placeholder, disabled: disabled, readOnly: readOnly, autoFocus: autoFocus, ariaLabel: ariaLabel, ariaRequired: ariaRequired, disableBrowserAutocorrect: disableBrowserAutocorrect, expandToViewport: expandToViewport, ariaControls: listId, ariaActivedescendant: highlightedOptionId, dropdownExpanded: autosuggestItemsState.items.length > 1 || dropdownStatus.content !== null, dropdownContent: React.createElement(AutosuggestOptionsList, { autosuggestItemsState: autosuggestItemsState, autosuggestItemsHandlers: autosuggestItemsHandlers, highlightedOptionId: highlightedOptionId, highlightText: value, listId: listId, controlId: controlId, enteredTextLabel: enteredTextLabel, handleLoadMore: autosuggestLoadMoreHandlers.fireLoadMoreOnScroll, hasDropdownStatus: dropdownStatus.content !== null, virtualScroll: virtualScroll, selectedAriaLabel: selectedAriaLabel, renderHighlightedAriaLive: renderHighlightedAriaLive, listBottom: !dropdownStatus.isSticky ? React.createElement(DropdownFooter, { content: dropdownStatus.content }) : null }), dropdownFooter: dropdownStatus.isSticky ? (React.createElement(DropdownFooter, { content: dropdownStatus.content, hasItems: autosuggestItemsState.items.length >= 1 })) : null, onCloseDropdown: handleCloseDropdown, onDelayedInput: handleDelayedInput, onPressArrowDown: handlePressArrowDown, onPressArrowUp: handlePressArrowUp, onPressEnter: handlePressEnter })));
|
|
98
94
|
});
|
|
99
95
|
export default InternalAutosuggest;
|
|
100
96
|
//# sourceMappingURL=internal.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/autosuggest/internal.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;;AAEtC,OAAO,KAAK,EAAE,EAAO,mBAAmB,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEhE,OAAO,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAG3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,wCAAwC,CAAC;AAC3E,OAAO,cAAc,MAAM,wCAAwC,CAAC;AAEpE,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAChF,OAAO,EAEL,mBAAmB,EACnB,sBAAsB,GAEvB,MAAM,oBAAoB,CAAC;AAE5B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,qBAAqB,EAAE,MAAM,0CAA0C,CAAC;AACjF,OAAO,eAAe,MAAM,oCAAoC,CAAC;AAEjE,OAAO,sBAAsB,MAAM,gBAAgB,CAAC;AACpD,OAAO,EAAE,sBAAsB,EAAE,MAAM,wBAAwB,CAAC;AAEhE,OAAO,gBAAyC,MAAM,0CAA0C,CAAC;AACjG,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAC7D,OAAO,IAAI,MAAM,MAAM,CAAC;AAIxB,IAAM,mBAAmB,GAAG,KAAK,CAAC,UAAU,CAAC,UAAC,KAA+B,EAAE,GAAwB;;IAEnG,IAAA,KAAK,GA0BH,KAAK,MA1BF,EACL,QAAQ,GAyBN,KAAK,SAzBC,EACR,MAAM,GAwBJ,KAAK,OAxBD,EACN,OAAO,GAuBL,KAAK,QAvBA,EACP,OAAO,GAsBL,KAAK,QAtBA,EACP,WAAW,GAqBT,KAAK,YArBI,EACX,OAAO,GAoBL,KAAK,QApBA,EACP,KAmBE,KAAK,cAnBe,EAAtB,aAAa,mBAAG,MAAM,KAAA,EACtB,KAkBE,KAAK,WAlBgB,EAAvB,UAAU,mBAAG,UAAU,KAAA,EACvB,WAAW,GAiBT,KAAK,YAjBI,EACX,IAAI,GAgBF,KAAK,KAhBH,EACJ,QAAQ,GAeN,KAAK,SAfC,EACR,KAcE,KAAK,0BAd0B,EAAjC,yBAAyB,mBAAG,KAAK,KAAA,EACjC,SAAS,GAaP,KAAK,UAbE,EACT,QAAQ,GAYN,KAAK,SAZC,EACR,SAAS,GAWP,KAAK,UAXE,EACT,YAAY,GAUV,KAAK,aAVK,EACZ,gBAAgB,GASd,KAAK,iBATS,EAChB,SAAS,GAQP,KAAK,UARE,EACT,aAAa,GAOX,KAAK,cAPM,EACb,gBAAgB,GAMd,KAAK,iBANS,EAChB,QAAQ,GAKN,KAAK,SALC,EACR,iBAAiB,GAIf,KAAK,kBAJU,EACjB,yBAAyB,GAGvB,KAAK,0BAHkB,EACzB,iBAAiB,GAEf,KAAK,kBAFU,EACd,SAAS,UACV,KAAK,EA3BH,6XA2BL,CADa,CACJ;IAEV,eAAe,CAAC,aAAa,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,CAAC,CAAC;IACrE,qBAAqB,CAAC,aAAa,EAAE,SAAS,EAAE,OAAO,CAAC,CAAC;IAEzD,IAAM,mBAAmB,GAAG,MAAM,CAAsB,IAAI,CAAC,CAAC;IAC9D,mBAAmB,CACjB,GAAG,EACH,cAAM,OAAA,CAAC;QACL,KAAK,EAAE,sBAAM,OAAA,MAAA,mBAAmB,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAA,EAAA;QACjD,MAAM,EAAE,sBAAM,OAAA,MAAA,mBAAmB,CAAC,OAAO,0CAAE,MAAM,EAAE,CAAA,EAAA;KACpD,CAAC,EAHI,CAGJ,EACF,EAAE,CACH,CAAC;IAEI,IAAA,KAAoD,mBAAmB,CAAC;QAC5E,OAAO,EAAE,OAAO,IAAI,EAAE;QACtB,WAAW,EAAE,KAAK;QAClB,UAAU,EAAE,KAAK;QACjB,aAAa,eAAA;QACb,oBAAoB,EAAE,KAAK;QAC3B,YAAY,EAAE,UAAC,MAAuB;;YACpC,IAAM,KAAK,GAAG,MAAM,CAAC,KAAK,IAAI,EAAE,CAAC;YACjC,sBAAsB,CAAC,QAAQ,EAAE,EAAE,KAAK,OAAA,EAAE,CAAC,CAAC;YAC5C,sBAAsB,CAAC,QAAQ,EAAE,EAAE,KAAK,OAAA,EAAE,CAAC,CAAC;YAC5C,MAAA,mBAAmB,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;QACvC,CAAC;KACF,CAAC,EAZK,qBAAqB,QAAA,EAAE,wBAAwB,QAYpD,CAAC;IAEH,IAAM,2BAA2B,GAAG,sBAAsB,CAAC;QACzD,OAAO,SAAA;QACP,UAAU,YAAA;QACV,WAAW,EAAE,UAAC,MAA8B,IAAK,OAAA,sBAAsB,CAAC,WAAW,EAAE,MAAM,CAAC,EAA3C,CAA2C;KAC7F,CAAC,CAAC;IAEH,IAAM,YAAY,GAAG,UAAC,KAAiD;QACrE,wBAAwB,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;QAC3C,wBAAwB,CAAC,0BAA0B,EAAE,CAAC;QACtD,sBAAsB,CAAC,QAAQ,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACjD,CAAC,CAAC;IAEF,IAAM,kBAAkB,GAAG,UAAC,KAAiD;QAC3E,2BAA2B,CAAC,yBAAyB,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAC5E,CAAC,CAAC;IAEF,IAAM,UAAU,GAAG;QACjB,sBAAsB,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IACvC,CAAC,CAAC;IAEF,IAAM,WAAW,GAAG;QAClB,wBAAwB,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QAC1C,2BAA2B,CAAC,wBAAwB,EAAE,CAAC;QACvD,sBAAsB,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;IACxC,CAAC,CAAC;IAEF,IAAM,WAAW,GAAG,UAAC,CAA6B;QAChD,mBAAmB,CAAC,OAAO,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC;IACzC,CAAC,CAAC;IAEF,IAAM,aAAa,GAAG,UAAC,CAA6B;QAClD,mBAAmB,CAAC,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC;IAC3C,CAAC,CAAC;IAEF,IAAM,oBAAoB,GAAG;QAC3B,wBAAwB,CAAC,yBAAyB,CAAC,CAAC,CAAC,CAAC;IACxD,CAAC,CAAC;IAEF,IAAM,kBAAkB,GAAG;QACzB,wBAAwB,CAAC,yBAAyB,CAAC,CAAC,CAAC,CAAC,CAAC;IACzD,CAAC,CAAC;IAEF,IAAM,gBAAgB,GAAG;QACvB,OAAO,wBAAwB,CAAC,mCAAmC,EAAE,CAAC;IACxE,CAAC,CAAC;IAEF,IAAM,mBAAmB,GAAG;QAC1B,wBAAwB,CAAC,0BAA0B,EAAE,CAAC;IACxD,CAAC,CAAC;IAEF,IAAM,mBAAmB,GAAG;;QAC1B,2BAA2B,CAAC,2BAA2B,EAAE,CAAC;QAC1D,MAAA,mBAAmB,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;IACvC,CAAC,CAAC;IAEF,IAAM,uBAAuB,GAA4B,UAAA,KAAK;QAC5D,uDAAuD;QACvD,KAAK,CAAC,cAAc,EAAE,CAAC;IACzB,CAAC,CAAC;IAEF,IAAM,gBAAgB,GAAG,mBAAmB,CAAC,SAAS,CAAC,CAAC;IACxD,IAAM,aAAa,GAAG,WAAW,CAAC,OAAO,CAAC,CAAC;IAC3C,IAAM,SAAS,GAAG,MAAA,gBAAgB,CAAC,SAAS,mCAAI,aAAa,CAAC;IAC9D,IAAM,MAAM,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC;IACnC,IAAM,mBAAmB,GAAG,qBAAqB,CAAC,iBAAiB,CAAC,CAAC,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;IAErG,IAAM,OAAO,GAAG,CAAC,KAAK,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,MAAM,CAAC;IAC9D,IAAM,cAAc,GAAG,iBAAiB,uBAAM,KAAK,KAAE,OAAO,SAAA,EAAE,eAAe,EAAE,mBAAmB,IAAG,CAAC;IAEtG,OAAO,CACL,oBAAC,gBAAgB,eACX,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,SAAS,CAAC,EACjD,GAAG,EAAE,mBAAmB,EACxB,iBAAiB,EAAE,iBAAiB,EACpC,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,YAAY,EACtB,MAAM,EAAE,UAAU,EAClB,OAAO,EAAE,WAAW,EACpB,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,YAAY,EAC1B,yBAAyB,EAAE,yBAAyB,EACpD,gBAAgB,EAAE,gBAAgB,EAClC,YAAY,EAAE,MAAM,EACpB,oBAAoB,EAAE,mBAAmB,EACzC,gBAAgB,EAAE,qBAAqB,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,cAAc,CAAC,OAAO,KAAK,IAAI,EAC3F,eAAe,EACb,oBAAC,sBAAsB,IACrB,qBAAqB,EAAE,qBAAqB,EAC5C,wBAAwB,EAAE,wBAAwB,EAClD,mBAAmB,EAAE,mBAAmB,EACxC,aAAa,EAAE,KAAK,EACpB,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,EACpB,gBAAgB,EAAE,gBAAgB,EAClC,cAAc,EAAE,2BAA2B,CAAC,oBAAoB,EAChE,iBAAiB,EAAE,cAAc,CAAC,OAAO,KAAK,IAAI,EAClD,aAAa,EAAE,aAAa,EAC5B,iBAAiB,EAAE,iBAAiB,EACpC,yBAAyB,EAAE,yBAAyB,EACpD,UAAU,EAAE,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC,CAAC,oBAAC,cAAc,IAAC,OAAO,EAAE,cAAc,CAAC,OAAO,GAAI,CAAC,CAAC,CAAC,IAAI,GACjG,EAEJ,cAAc,EACZ,cAAc,CAAC,QAAQ,CAAC,CAAC,CAAC,CACxB,oBAAC,cAAc,IAAC,OAAO,EAAE,cAAc,CAAC,OAAO,EAAE,QAAQ,EAAE,qBAAqB,CAAC,KAAK,CAAC,MAAM,IAAI,CAAC,GAAI,CACvG,CAAC,CAAC,CAAC,IAAI,EAEV,mBAAmB,EAAE,uBAAuB,EAC5C,eAAe,EAAE,mBAAmB,EACpC,cAAc,EAAE,kBAAkB,EAClC,gBAAgB,EAAE,oBAAoB,EACtC,cAAc,EAAE,kBAAkB,EAClC,YAAY,EAAE,gBAAgB,IAC9B,CACH,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,mBAAmB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { Ref, useImperativeHandle, useRef } from 'react';\n\nimport { useAutosuggestItems } from './options-controller';\nimport { AutosuggestItem, AutosuggestProps } from './interfaces';\n\nimport { useDropdownStatus } from '../internal/components/dropdown-status';\nimport DropdownFooter from '../internal/components/dropdown-footer';\n\nimport { generateUniqueId, useUniqueId } from '../internal/hooks/use-unique-id';\nimport {\n BaseKeyDetail,\n fireCancelableEvent,\n fireNonCancelableEvent,\n NonCancelableCustomEvent,\n} from '../internal/events';\nimport { BaseChangeDetail, InputProps } from '../input/interfaces';\nimport styles from './styles.css.js';\nimport { checkOptionValueField } from '../select/utils/check-option-value-field';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport AutosuggestOptionsList from './options-list';\nimport { useAutosuggestLoadMore } from './load-more-controller';\nimport { OptionsLoadItemsDetail } from '../internal/components/dropdown/interfaces';\nimport AutosuggestInput, { AutosuggestInputRef } from '../internal/components/autosuggest-input';\nimport { useFormFieldContext } from '../contexts/form-field';\nimport clsx from 'clsx';\n\nexport interface InternalAutosuggestProps extends AutosuggestProps, InternalBaseComponentProps {}\n\nconst InternalAutosuggest = React.forwardRef((props: InternalAutosuggestProps, ref: Ref<InputProps.Ref>) => {\n const {\n value,\n onChange,\n onBlur,\n onFocus,\n onKeyUp,\n onLoadItems,\n options,\n filteringType = 'auto',\n statusType = 'finished',\n placeholder,\n name,\n disabled,\n disableBrowserAutocorrect = false,\n autoFocus,\n readOnly,\n ariaLabel,\n ariaRequired,\n enteredTextLabel,\n onKeyDown,\n virtualScroll,\n expandToViewport,\n onSelect,\n selectedAriaLabel,\n renderHighlightedAriaLive,\n __internalRootRef,\n ...restProps\n } = props;\n\n checkControlled('Autosuggest', 'value', value, 'onChange', onChange);\n checkOptionValueField('Autosuggest', 'options', options);\n\n const autosuggestInputRef = useRef<AutosuggestInputRef>(null);\n useImperativeHandle(\n ref,\n () => ({\n focus: () => autosuggestInputRef.current?.focus(),\n select: () => autosuggestInputRef.current?.select(),\n }),\n []\n );\n\n const [autosuggestItemsState, autosuggestItemsHandlers] = useAutosuggestItems({\n options: options || [],\n filterValue: value,\n filterText: value,\n filteringType,\n hideEnteredTextLabel: false,\n onSelectItem: (option: AutosuggestItem) => {\n const value = option.value || '';\n fireNonCancelableEvent(onChange, { value });\n fireNonCancelableEvent(onSelect, { value });\n autosuggestInputRef.current?.close();\n },\n });\n\n const autosuggestLoadMoreHandlers = useAutosuggestLoadMore({\n options,\n statusType,\n onLoadItems: (detail: OptionsLoadItemsDetail) => fireNonCancelableEvent(onLoadItems, detail),\n });\n\n const handleChange = (event: NonCancelableCustomEvent<BaseChangeDetail>) => {\n autosuggestItemsHandlers.setShowAll(false);\n autosuggestItemsHandlers.resetHighlightWithKeyboard();\n fireNonCancelableEvent(onChange, event.detail);\n };\n\n const handleDelayedInput = (event: NonCancelableCustomEvent<BaseChangeDetail>) => {\n autosuggestLoadMoreHandlers.fireLoadMoreOnInputChange(event.detail.value);\n };\n\n const handleBlur = () => {\n fireNonCancelableEvent(onBlur, null);\n };\n\n const handleFocus = () => {\n autosuggestItemsHandlers.setShowAll(true);\n autosuggestLoadMoreHandlers.fireLoadMoreOnInputFocus();\n fireNonCancelableEvent(onFocus, null);\n };\n\n const handleKeyUp = (e: CustomEvent<BaseKeyDetail>) => {\n fireCancelableEvent(onKeyUp, e.detail);\n };\n\n const handleKeyDown = (e: CustomEvent<BaseKeyDetail>) => {\n fireCancelableEvent(onKeyDown, e.detail);\n };\n\n const handlePressArrowDown = () => {\n autosuggestItemsHandlers.moveHighlightWithKeyboard(1);\n };\n\n const handlePressArrowUp = () => {\n autosuggestItemsHandlers.moveHighlightWithKeyboard(-1);\n };\n\n const handlePressEnter = () => {\n return autosuggestItemsHandlers.selectHighlightedOptionWithKeyboard();\n };\n\n const handleCloseDropdown = () => {\n autosuggestItemsHandlers.resetHighlightWithKeyboard();\n };\n\n const handleRecoveryClick = () => {\n autosuggestLoadMoreHandlers.fireLoadMoreOnRecoveryClick();\n autosuggestInputRef.current?.focus();\n };\n\n const handleDropdownMouseDown: React.MouseEventHandler = event => {\n // Prevent currently focused element from losing focus.\n event.preventDefault();\n };\n\n const formFieldContext = useFormFieldContext(restProps);\n const selfControlId = useUniqueId('input');\n const controlId = formFieldContext.controlId ?? selfControlId;\n const listId = useUniqueId('list');\n const highlightedOptionId = autosuggestItemsState.highlightedOption ? generateUniqueId() : undefined;\n\n const isEmpty = !value && !autosuggestItemsState.items.length;\n const dropdownStatus = useDropdownStatus({ ...props, isEmpty, onRecoveryClick: handleRecoveryClick });\n\n return (\n <AutosuggestInput\n {...restProps}\n className={clsx(styles.root, restProps.className)}\n ref={autosuggestInputRef}\n __internalRootRef={__internalRootRef}\n value={value}\n onChange={handleChange}\n onBlur={handleBlur}\n onFocus={handleFocus}\n onKeyUp={handleKeyUp}\n onKeyDown={handleKeyDown}\n name={name}\n controlId={controlId}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n autoFocus={autoFocus}\n ariaLabel={ariaLabel}\n ariaRequired={ariaRequired}\n disableBrowserAutocorrect={disableBrowserAutocorrect}\n expandToViewport={expandToViewport}\n ariaControls={listId}\n ariaActivedescendant={highlightedOptionId}\n dropdownExpanded={autosuggestItemsState.items.length > 1 || dropdownStatus.content !== null}\n dropdownContent={\n <AutosuggestOptionsList\n autosuggestItemsState={autosuggestItemsState}\n autosuggestItemsHandlers={autosuggestItemsHandlers}\n highlightedOptionId={highlightedOptionId}\n highlightText={value}\n listId={listId}\n controlId={controlId}\n enteredTextLabel={enteredTextLabel}\n handleLoadMore={autosuggestLoadMoreHandlers.fireLoadMoreOnScroll}\n hasDropdownStatus={dropdownStatus.content !== null}\n virtualScroll={virtualScroll}\n selectedAriaLabel={selectedAriaLabel}\n renderHighlightedAriaLive={renderHighlightedAriaLive}\n listBottom={!dropdownStatus.isSticky ? <DropdownFooter content={dropdownStatus.content} /> : null}\n />\n }\n dropdownFooter={\n dropdownStatus.isSticky ? (\n <DropdownFooter content={dropdownStatus.content} hasItems={autosuggestItemsState.items.length >= 1} />\n ) : null\n }\n onDropdownMouseDown={handleDropdownMouseDown}\n onCloseDropdown={handleCloseDropdown}\n onDelayedInput={handleDelayedInput}\n onPressArrowDown={handlePressArrowDown}\n onPressArrowUp={handlePressArrowUp}\n onPressEnter={handlePressEnter}\n />\n );\n});\n\nexport default InternalAutosuggest;\n"]}
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/autosuggest/internal.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\n\nimport React, { Ref, useImperativeHandle, useRef } from 'react';\n\nimport { useAutosuggestItems } from './options-controller';\nimport { AutosuggestItem, AutosuggestProps } from './interfaces';\n\nimport { useDropdownStatus } from '../internal/components/dropdown-status';\nimport DropdownFooter from '../internal/components/dropdown-footer';\n\nimport { generateUniqueId, useUniqueId } from '../internal/hooks/use-unique-id';\nimport {\n BaseKeyDetail,\n fireCancelableEvent,\n fireNonCancelableEvent,\n NonCancelableCustomEvent,\n} from '../internal/events';\nimport { BaseChangeDetail, InputProps } from '../input/interfaces';\nimport styles from './styles.css.js';\nimport { checkOptionValueField } from '../select/utils/check-option-value-field';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport AutosuggestOptionsList from './options-list';\nimport { useAutosuggestLoadMore } from './load-more-controller';\nimport { OptionsLoadItemsDetail } from '../internal/components/dropdown/interfaces';\nimport AutosuggestInput, { AutosuggestInputRef } from '../internal/components/autosuggest-input';\nimport { useFormFieldContext } from '../contexts/form-field';\nimport clsx from 'clsx';\n\nexport interface InternalAutosuggestProps extends AutosuggestProps, InternalBaseComponentProps {}\n\nconst InternalAutosuggest = React.forwardRef((props: InternalAutosuggestProps, ref: Ref<InputProps.Ref>) => {\n const {\n value,\n onChange,\n onBlur,\n onFocus,\n onKeyUp,\n onLoadItems,\n options,\n filteringType = 'auto',\n statusType = 'finished',\n placeholder,\n name,\n disabled,\n disableBrowserAutocorrect = false,\n autoFocus,\n readOnly,\n ariaLabel,\n ariaRequired,\n enteredTextLabel,\n onKeyDown,\n virtualScroll,\n expandToViewport,\n onSelect,\n selectedAriaLabel,\n renderHighlightedAriaLive,\n __internalRootRef,\n ...restProps\n } = props;\n\n checkControlled('Autosuggest', 'value', value, 'onChange', onChange);\n checkOptionValueField('Autosuggest', 'options', options);\n\n const autosuggestInputRef = useRef<AutosuggestInputRef>(null);\n useImperativeHandle(\n ref,\n () => ({\n focus: () => autosuggestInputRef.current?.focus(),\n select: () => autosuggestInputRef.current?.select(),\n }),\n []\n );\n\n const [autosuggestItemsState, autosuggestItemsHandlers] = useAutosuggestItems({\n options: options || [],\n filterValue: value,\n filterText: value,\n filteringType,\n hideEnteredTextLabel: false,\n onSelectItem: (option: AutosuggestItem) => {\n const value = option.value || '';\n fireNonCancelableEvent(onChange, { value });\n fireNonCancelableEvent(onSelect, { value });\n autosuggestInputRef.current?.close();\n },\n });\n\n const autosuggestLoadMoreHandlers = useAutosuggestLoadMore({\n options,\n statusType,\n onLoadItems: (detail: OptionsLoadItemsDetail) => fireNonCancelableEvent(onLoadItems, detail),\n });\n\n const handleChange = (event: NonCancelableCustomEvent<BaseChangeDetail>) => {\n autosuggestItemsHandlers.setShowAll(false);\n autosuggestItemsHandlers.resetHighlightWithKeyboard();\n fireNonCancelableEvent(onChange, event.detail);\n };\n\n const handleDelayedInput = (event: NonCancelableCustomEvent<BaseChangeDetail>) => {\n autosuggestLoadMoreHandlers.fireLoadMoreOnInputChange(event.detail.value);\n };\n\n const handleBlur = () => {\n fireNonCancelableEvent(onBlur, null);\n };\n\n const handleFocus = () => {\n autosuggestItemsHandlers.setShowAll(true);\n autosuggestLoadMoreHandlers.fireLoadMoreOnInputFocus();\n fireNonCancelableEvent(onFocus, null);\n };\n\n const handleKeyUp = (e: CustomEvent<BaseKeyDetail>) => {\n fireCancelableEvent(onKeyUp, e.detail);\n };\n\n const handleKeyDown = (e: CustomEvent<BaseKeyDetail>) => {\n fireCancelableEvent(onKeyDown, e.detail);\n };\n\n const handlePressArrowDown = () => {\n autosuggestItemsHandlers.moveHighlightWithKeyboard(1);\n };\n\n const handlePressArrowUp = () => {\n autosuggestItemsHandlers.moveHighlightWithKeyboard(-1);\n };\n\n const handlePressEnter = () => {\n return autosuggestItemsHandlers.selectHighlightedOptionWithKeyboard();\n };\n\n const handleCloseDropdown = () => {\n autosuggestItemsHandlers.resetHighlightWithKeyboard();\n };\n\n const handleRecoveryClick = () => {\n autosuggestLoadMoreHandlers.fireLoadMoreOnRecoveryClick();\n autosuggestInputRef.current?.focus();\n };\n\n const formFieldContext = useFormFieldContext(restProps);\n const selfControlId = useUniqueId('input');\n const controlId = formFieldContext.controlId ?? selfControlId;\n const listId = useUniqueId('list');\n const highlightedOptionId = autosuggestItemsState.highlightedOption ? generateUniqueId() : undefined;\n\n const isEmpty = !value && !autosuggestItemsState.items.length;\n const dropdownStatus = useDropdownStatus({ ...props, isEmpty, onRecoveryClick: handleRecoveryClick });\n\n return (\n <AutosuggestInput\n {...restProps}\n className={clsx(styles.root, restProps.className)}\n ref={autosuggestInputRef}\n __internalRootRef={__internalRootRef}\n value={value}\n onChange={handleChange}\n onBlur={handleBlur}\n onFocus={handleFocus}\n onKeyUp={handleKeyUp}\n onKeyDown={handleKeyDown}\n name={name}\n controlId={controlId}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n autoFocus={autoFocus}\n ariaLabel={ariaLabel}\n ariaRequired={ariaRequired}\n disableBrowserAutocorrect={disableBrowserAutocorrect}\n expandToViewport={expandToViewport}\n ariaControls={listId}\n ariaActivedescendant={highlightedOptionId}\n dropdownExpanded={autosuggestItemsState.items.length > 1 || dropdownStatus.content !== null}\n dropdownContent={\n <AutosuggestOptionsList\n autosuggestItemsState={autosuggestItemsState}\n autosuggestItemsHandlers={autosuggestItemsHandlers}\n highlightedOptionId={highlightedOptionId}\n highlightText={value}\n listId={listId}\n controlId={controlId}\n enteredTextLabel={enteredTextLabel}\n handleLoadMore={autosuggestLoadMoreHandlers.fireLoadMoreOnScroll}\n hasDropdownStatus={dropdownStatus.content !== null}\n virtualScroll={virtualScroll}\n selectedAriaLabel={selectedAriaLabel}\n renderHighlightedAriaLive={renderHighlightedAriaLive}\n listBottom={!dropdownStatus.isSticky ? <DropdownFooter content={dropdownStatus.content} /> : null}\n />\n }\n dropdownFooter={\n dropdownStatus.isSticky ? (\n <DropdownFooter content={dropdownStatus.content} hasItems={autosuggestItemsState.items.length >= 1} />\n ) : null\n }\n onCloseDropdown={handleCloseDropdown}\n onDelayedInput={handleDelayedInput}\n onPressArrowDown={handlePressArrowDown}\n onPressArrowUp={handlePressArrowUp}\n onPressEnter={handlePressEnter}\n />\n );\n});\n\nexport default InternalAutosuggest;\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/calendar/grid/day/index.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAKlE,UAAU,YAAY;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,IAAI,CAAC;IACf,IAAI,EAAE,IAAI,CAAC;IACX,YAAY,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IAC3B,WAAW,EAAE,IAAI,GAAG,IAAI,CAAC;IACzB,aAAa,CAAC,EAAE,eAAe,CAAC,qBAAqB,CAAC;IACtD,cAAc,EAAE,MAAM,CAAC;IACvB,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,gBAAgB,EAAE,OAAO,CAAC;CAC3B;AAED,QAAA,MAAM,OAAO,0HAUV,YAAY,gBAwCd,CAAC;AAEF,eAAe,OAAO,CAAC"}
|
|
@@ -2,7 +2,7 @@ import { __assign } from "tslib";
|
|
|
2
2
|
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
3
3
|
// SPDX-License-Identifier: Apache-2.0
|
|
4
4
|
import React from 'react';
|
|
5
|
-
import styles from '
|
|
5
|
+
import styles from '../../styles.css.js';
|
|
6
6
|
import { isSameDay, isSameMonth } from 'date-fns';
|
|
7
7
|
import { getDateLabel } from '../../utils/intl';
|
|
8
8
|
import clsx from 'clsx';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/calendar/grid/day/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,qBAAqB,CAAC;AAEzC,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,IAAI,MAAM,MAAM,CAAC;AAcxB,IAAM,OAAO,GAAG,UAAC,EAUF;;QATb,MAAM,YAAA,EACN,QAAQ,cAAA,EACR,IAAI,UAAA,EACJ,YAAY,kBAAA,EACZ,WAAW,iBAAA,EACX,aAAa,mBAAA,EACb,cAAc,oBAAA,EACd,YAAY,kBAAA,EACZ,gBAAgB,sBAAA;IAEhB,IAAM,MAAM,GAAG,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC;IAC5C,IAAM,WAAW,GAAG,CAAC,CAAC,WAAW,IAAI,SAAS,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;IAClE,IAAM,UAAU,GAAG,CAAC,CAAC,YAAY,IAAI,SAAS,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC;IACnE,IAAM,SAAS,GAAG,CAAC,aAAa,IAAI,aAAa,CAAC,IAAI,CAAC,CAAC;IACxD,IAAM,eAAe,GAAG,SAAS,CAAC,IAAI,EAAE,IAAI,IAAI,EAAE,CAAC,CAAC;IACpD,IAAM,kBAAkB,GAAyC,EAAE,CAAC;IACpE,IAAM,UAAU,GAAG,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC;QAC5C,GAAC,MAAM,CAAC,2BAA2B,CAAC,IAAG,gBAAgB;QACvD,GAAC,MAAM,CAAC,4BAA4B,CAAC,IAAG,WAAW,CAAC,IAAI,EAAE,QAAQ,CAAC;QACnE,GAAC,MAAM,CAAC,sBAAsB,CAAC,IAAG,SAAS;QAC3C,GAAC,MAAM,CAAC,uBAAuB,CAAC,IAAG,UAAU;QAC7C,GAAC,MAAM,CAAC,oBAAoB,CAAC,IAAG,eAAe;QAC/C,GAAC,MAAM,CAAC,wBAAwB,CAAC,IAAG,WAAW,IAAI,SAAS;YAC5D,CAAC;IAEH,IAAI,UAAU,EAAE;QACd,kBAAkB,CAAC,cAAc,CAAC,GAAG,MAAM,CAAC;KAC7C;IAED,IAAI,eAAe,EAAE;QACnB,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;KAC7B;IAED,IAAI,SAAS,EAAE;QACb,kBAAkB,CAAC,OAAO,GAAG,cAAM,OAAA,YAAY,CAAC,IAAI,CAAC,EAAlB,CAAkB,CAAC;QACtD,kBAAkB,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;KAClC;SAAM;QACL,kBAAkB,CAAC,eAAe,CAAC,GAAG,IAAI,CAAC;KAC5C;IAED,IAAI,WAAW,IAAI,SAAS,EAAE;QAC5B,kBAAkB,CAAC,QAAQ,GAAG,CAAC,CAAC;KACjC;IAED,OAAO,CACL,sCAAK,SAAS,EAAE,UAAU,gBAAc,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,EAAC,QAAQ,IAAK,kBAAkB;QAC7F,8BAAM,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,IAAG,IAAI,CAAC,OAAO,EAAE,CAAQ,CACzD,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,OAAO,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport styles from '../../styles.css.js';\nimport { DatePickerProps } from '../../../date-picker/interfaces';\nimport { isSameDay, isSameMonth } from 'date-fns';\nimport { getDateLabel } from '../../utils/intl';\nimport clsx from 'clsx';\n\ninterface GridDayProps {\n locale: string;\n baseDate: Date;\n date: Date;\n selectedDate?: Date | null;\n focusedDate: Date | null;\n isDateEnabled?: DatePickerProps.IsDateEnabledFunction;\n todayAriaLabel: string;\n onSelectDate: (date: Date) => void;\n isDateInLastWeek: boolean;\n}\n\nconst GridDay = ({\n locale,\n baseDate,\n date,\n selectedDate,\n focusedDate,\n isDateEnabled,\n todayAriaLabel,\n onSelectDate,\n isDateInLastWeek,\n}: GridDayProps) => {\n const labels = [getDateLabel(locale, date)];\n const isFocusable = !!focusedDate && isSameDay(date, focusedDate);\n const isSelected = !!selectedDate && isSameDay(date, selectedDate);\n const isEnabled = !isDateEnabled || isDateEnabled(date);\n const isDateOnSameDay = isSameDay(date, new Date());\n const computedAttributes: React.HTMLAttributes<HTMLDivElement> = {};\n const classNames = clsx(styles['calendar-day'], {\n [styles['calendar-day-in-last-week']]: isDateInLastWeek,\n [styles['calendar-day-current-month']]: isSameMonth(date, baseDate),\n [styles['calendar-day-enabled']]: isEnabled,\n [styles['calendar-day-selected']]: isSelected,\n [styles['calendar-day-today']]: isDateOnSameDay,\n [styles['calendar-day-focusable']]: isFocusable && isEnabled,\n });\n\n if (isSelected) {\n computedAttributes['aria-current'] = 'date';\n }\n\n if (isDateOnSameDay) {\n labels.push(todayAriaLabel);\n }\n\n if (isEnabled) {\n computedAttributes.onClick = () => onSelectDate(date);\n computedAttributes.tabIndex = -1;\n } else {\n computedAttributes['aria-disabled'] = true;\n }\n\n if (isFocusable && isEnabled) {\n computedAttributes.tabIndex = 0;\n }\n\n return (\n <div className={classNames} aria-label={labels.join('. ')} role=\"button\" {...computedAttributes}>\n <span className={styles['day-inner']}>{date.getDate()}</span>\n </div>\n );\n};\n\nexport default GridDay;\n"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { DayIndex } from '../
|
|
1
|
+
import { DayIndex } from '../internal';
|
|
2
2
|
import { MoveFocusHandler } from '../utils/move-focus-handler';
|
|
3
|
-
import { DatePickerProps } from '../../interfaces';
|
|
3
|
+
import { DatePickerProps } from '../../date-picker/interfaces';
|
|
4
4
|
export interface GridProps {
|
|
5
5
|
locale: string;
|
|
6
6
|
baseDate: Date;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/calendar/grid/index.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AAC/D,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAI/D,MAAM,WAAW,SAAS;IACxB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,IAAI,CAAC;IACf,aAAa,EAAE,eAAe,CAAC,qBAAqB,CAAC;IACrD,WAAW,EAAE,IAAI,GAAG,IAAI,CAAC;IACzB,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,WAAW,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IACzC,aAAa,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACpC,WAAW,EAAE,QAAQ,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;IACvB,YAAY,EAAE,IAAI,GAAG,IAAI,CAAC;IAC1B,eAAe,EAAE,gBAAgB,CAAC;CACnC;AAED,QAAA,MAAM,IAAI,4JAYP,SAAS,gBAoFX,CAAC;AAEF,eAAe,IAAI,CAAC"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
2
|
// SPDX-License-Identifier: Apache-2.0
|
|
3
3
|
import React, { useMemo } from 'react';
|
|
4
|
-
import styles from '
|
|
4
|
+
import styles from '../styles.css.js';
|
|
5
5
|
import GridDay from './day';
|
|
6
|
-
import { KeyCode } from '
|
|
6
|
+
import { KeyCode } from '../../internal/keycode';
|
|
7
7
|
import { addDays, addWeeks, isSameMonth } from 'date-fns';
|
|
8
8
|
import { getCalendarMonth } from 'mnth';
|
|
9
9
|
import rotateDayIndexes from '../utils/rotate-day-indexes';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/calendar/grid/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useMemo } from 'react';\nimport styles from '../styles.css.js';\nimport GridDay from './day';\nimport { KeyCode } from '../../internal/keycode';\nimport { addDays, addWeeks, isSameMonth } from 'date-fns';\nimport { getCalendarMonth } from 'mnth';\nimport { DayIndex } from '../internal';\nimport { MoveFocusHandler } from '../utils/move-focus-handler';\nimport { DatePickerProps } from '../../date-picker/interfaces';\nimport rotateDayIndexes from '../utils/rotate-day-indexes';\nimport { renderDayName } from '../utils/intl';\n\nexport interface GridProps {\n locale: string;\n baseDate: Date;\n isDateEnabled: DatePickerProps.IsDateEnabledFunction;\n focusedDate: Date | null;\n onSelectDate: (date: Date) => void;\n onFocusDate: (date: null | Date) => void;\n onChangeMonth: (date: Date) => void;\n startOfWeek: DayIndex;\n todayAriaLabel: string;\n selectedDate: Date | null;\n handleFocusMove: MoveFocusHandler;\n}\n\nconst Grid = ({\n locale,\n baseDate,\n isDateEnabled,\n focusedDate,\n onSelectDate,\n onFocusDate,\n onChangeMonth,\n startOfWeek,\n todayAriaLabel,\n selectedDate,\n handleFocusMove,\n}: GridProps) => {\n const onGridKeyDownHandler = (event: React.KeyboardEvent) => {\n let updatedFocusDate;\n\n if (focusedDate === null) {\n return;\n }\n\n switch (event.keyCode) {\n case KeyCode.enter:\n event.preventDefault();\n if (focusedDate) {\n onFocusDate(null);\n onSelectDate(focusedDate);\n }\n return;\n case KeyCode.right:\n event.preventDefault();\n updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addDays(date, 1));\n break;\n case KeyCode.left:\n event.preventDefault();\n updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addDays(date, -1));\n break;\n case KeyCode.up:\n event.preventDefault();\n updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addWeeks(date, -1));\n break;\n case KeyCode.down:\n event.preventDefault();\n updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addWeeks(date, 1));\n break;\n default:\n return;\n }\n\n if (!isSameMonth(updatedFocusDate, baseDate)) {\n onChangeMonth(updatedFocusDate);\n }\n onFocusDate(updatedFocusDate);\n };\n\n const weeks = useMemo<Date[][]>(\n () => getCalendarMonth(baseDate, { firstDayOfWeek: startOfWeek }),\n [baseDate, startOfWeek]\n );\n\n return (\n <div>\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 const isDateInLastWeek = weeks.length - 1 === weekIndex;\n\n return (\n <div key={`week-${weekIndex}`} className={styles['calendar-week']}>\n {week.map((date, dateIndex) => {\n return (\n <GridDay\n key={`date-${weekIndex}-${dateIndex}`}\n locale={locale}\n baseDate={baseDate}\n selectedDate={selectedDate}\n date={date}\n focusedDate={focusedDate}\n todayAriaLabel={todayAriaLabel}\n onSelectDate={date => onSelectDate(date)}\n isDateEnabled={isDateEnabled}\n isDateInLastWeek={isDateInLastWeek}\n />\n );\n })}\n </div>\n );\n })}\n </div>\n </div>\n );\n};\n\nexport default Grid;\n"]}
|
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/calendar/header/button/index.tsx"],"names":[],"mappings":"AAQA,UAAU,iBAAiB;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;CAC9C;AAED,QAAA,MAAM,YAAY,6CAA8C,iBAAiB,gBAoBhF,CAAC;AAEF,eAAe,YAAY,CAAC"}
|
|
@@ -2,8 +2,8 @@ import { __assign } from "tslib";
|
|
|
2
2
|
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
3
3
|
// SPDX-License-Identifier: Apache-2.0
|
|
4
4
|
import React from 'react';
|
|
5
|
-
import { InternalButton } from '
|
|
6
|
-
import styles from '
|
|
5
|
+
import { InternalButton } from '../../../button/internal';
|
|
6
|
+
import styles from '../../styles.css.js';
|
|
7
7
|
var HeaderButton = function (_a) {
|
|
8
8
|
var ariaLabel = _a.ariaLabel, isPrevious = _a.isPrevious, onChangeMonth = _a.onChangeMonth;
|
|
9
9
|
var iconName = isPrevious ? 'angle-left' : 'angle-right';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/calendar/header/button/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAC1D,OAAO,MAAM,MAAM,qBAAqB,CAAC;AAQzC,IAAM,YAAY,GAAG,UAAC,EAA2D;QAAzD,SAAS,eAAA,EAAE,UAAU,gBAAA,EAAE,aAAa,mBAAA;IAC1D,IAAM,QAAQ,GAAG,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,aAAa,CAAC;IAC3D,IAAM,oBAAoB,GAA4C;QACpE,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,yBAAyB,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,yBAAyB,CAAC;KAC9F,CAAC;IAEF,IAAM,OAAO,GAAoD,UAAA,CAAC;QAChE,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,aAAa,CAAC,UAAU,CAAC,CAAC;IAC5B,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,cAAc,eACT,oBAAoB,IACxB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,MAAM,EACf,OAAO,EAAE,OAAO,IAChB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { CancelableEventHandler } from '../../../internal/events';\nimport { ButtonProps } from '../../../button/interfaces';\nimport { InternalButton } from '../../../button/internal';\nimport styles from '../../styles.css.js';\n\ninterface HeaderButtonProps {\n ariaLabel: string;\n isPrevious: boolean;\n onChangeMonth: (isPrevious: boolean) => void;\n}\n\nconst HeaderButton = ({ ariaLabel, isPrevious, onChangeMonth }: HeaderButtonProps) => {\n const iconName = isPrevious ? 'angle-left' : 'angle-right';\n const additionalAttributes: React.HTMLAttributes<HTMLButtonElement> = {\n className: isPrevious ? styles['calendar-prev-month-btn'] : styles['calendar-next-month-btn'],\n };\n\n const onClick: CancelableEventHandler<ButtonProps.ClickDetail> = e => {\n e.preventDefault();\n onChangeMonth(isPrevious);\n };\n\n return (\n <InternalButton\n {...additionalAttributes}\n iconName={iconName}\n ariaLabel={ariaLabel}\n variant={'icon'}\n onClick={onClick}\n />\n );\n};\n\nexport default HeaderButton;\n"]}
|
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
interface CalendarHeaderProps {
|
|
2
|
-
headerId: string;
|
|
3
2
|
baseDate: Date;
|
|
4
3
|
locale: string;
|
|
5
4
|
onChangeMonth: (prev?: boolean) => void;
|
|
6
5
|
previousMonthLabel: string;
|
|
7
6
|
nextMonthLabel: string;
|
|
8
7
|
}
|
|
9
|
-
declare const CalendarHeader: ({
|
|
8
|
+
declare const CalendarHeader: ({ baseDate, locale, onChangeMonth, previousMonthLabel, nextMonthLabel, }: CalendarHeaderProps) => JSX.Element;
|
|
10
9
|
export default CalendarHeader;
|
|
11
10
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/calendar/header/index.tsx"],"names":[],"mappings":"AAOA,UAAU,mBAAmB;IAC3B,QAAQ,EAAE,IAAI,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,aAAa,EAAE,CAAC,IAAI,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,kBAAkB,EAAE,MAAM,CAAC;IAC3B,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,QAAA,MAAM,cAAc,6EAMjB,mBAAmB,gBAQrB,CAAC;AAEF,eAAe,cAAc,CAAC"}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
2
|
// SPDX-License-Identifier: Apache-2.0
|
|
3
3
|
import React from 'react';
|
|
4
|
-
import styles from '
|
|
4
|
+
import styles from '../styles.css.js';
|
|
5
5
|
import { renderMonthAndYear } from '../utils/intl';
|
|
6
6
|
import HeaderButton from './button';
|
|
7
7
|
var CalendarHeader = function (_a) {
|
|
8
|
-
var
|
|
8
|
+
var baseDate = _a.baseDate, locale = _a.locale, onChangeMonth = _a.onChangeMonth, previousMonthLabel = _a.previousMonthLabel, nextMonthLabel = _a.nextMonthLabel;
|
|
9
9
|
return (React.createElement("div", { className: styles['calendar-header'] },
|
|
10
10
|
React.createElement(HeaderButton, { ariaLabel: previousMonthLabel, isPrevious: true, onChangeMonth: onChangeMonth }),
|
|
11
|
-
React.createElement("div", { className: styles['calendar-header-month']
|
|
11
|
+
React.createElement("div", { className: styles['calendar-header-month'] }, renderMonthAndYear(locale, baseDate)),
|
|
12
12
|
React.createElement(HeaderButton, { ariaLabel: nextMonthLabel, isPrevious: false, onChangeMonth: onChangeMonth })));
|
|
13
13
|
};
|
|
14
14
|
export default CalendarHeader;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/calendar/header/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,YAAY,MAAM,UAAU,CAAC;AAUpC,IAAM,cAAc,GAAG,UAAC,EAMF;QALpB,QAAQ,cAAA,EACR,MAAM,YAAA,EACN,aAAa,mBAAA,EACb,kBAAkB,wBAAA,EAClB,cAAc,oBAAA;IAEd,OAAO,CACL,6BAAK,SAAS,EAAE,MAAM,CAAC,iBAAiB,CAAC;QACvC,oBAAC,YAAY,IAAC,SAAS,EAAE,kBAAkB,EAAE,UAAU,EAAE,IAAI,EAAE,aAAa,EAAE,aAAa,GAAI;QAC/F,6BAAK,SAAS,EAAE,MAAM,CAAC,uBAAuB,CAAC,IAAG,kBAAkB,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAO;QAC7F,oBAAC,YAAY,IAAC,SAAS,EAAE,cAAc,EAAE,UAAU,EAAE,KAAK,EAAE,aAAa,EAAE,aAAa,GAAI,CACxF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport styles from '../styles.css.js';\nimport { renderMonthAndYear } from '../utils/intl';\nimport HeaderButton from './button';\n\ninterface CalendarHeaderProps {\n baseDate: Date;\n locale: string;\n onChangeMonth: (prev?: boolean) => void;\n previousMonthLabel: string;\n nextMonthLabel: string;\n}\n\nconst CalendarHeader = ({\n baseDate,\n locale,\n onChangeMonth,\n previousMonthLabel,\n nextMonthLabel,\n}: CalendarHeaderProps) => {\n return (\n <div className={styles['calendar-header']}>\n <HeaderButton ariaLabel={previousMonthLabel} isPrevious={true} onChangeMonth={onChangeMonth} />\n <div className={styles['calendar-header-month']}>{renderMonthAndYear(locale, baseDate)}</div>\n <HeaderButton ariaLabel={nextMonthLabel} isPrevious={false} onChangeMonth={onChangeMonth} />\n </div>\n );\n};\n\nexport default CalendarHeader;\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/calendar/index.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAG7C,OAAO,EAAE,aAAa,EAAE,CAAC;AAEzB,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAAE,MAAW,EAAE,aAA0B,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,eAGpG"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
+
import { __assign, __rest } from "tslib";
|
|
4
|
+
import React from 'react';
|
|
5
|
+
import useBaseComponent from '../internal/hooks/use-base-component';
|
|
6
|
+
import { applyDisplayName } from '../internal/utils/apply-display-name';
|
|
7
|
+
import InternalCalendar from './internal';
|
|
8
|
+
export default function Calendar(_a) {
|
|
9
|
+
var _b = _a.locale, locale = _b === void 0 ? '' : _b, _c = _a.isDateEnabled, isDateEnabled = _c === void 0 ? function () { return true; } : _c, props = __rest(_a, ["locale", "isDateEnabled"]);
|
|
10
|
+
var baseComponentProps = useBaseComponent('Calendar');
|
|
11
|
+
return React.createElement(InternalCalendar, __assign({}, props, baseComponentProps, { locale: locale, isDateEnabled: isDateEnabled }));
|
|
12
|
+
}
|
|
13
|
+
applyDisplayName(Calendar, 'Calendar');
|
|
14
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/calendar/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;;AAEtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,gBAAgB,MAAM,YAAY,CAAC;AAI1C,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAAoE;IAAlE,IAAA,cAAW,EAAX,MAAM,mBAAG,EAAE,KAAA,EAAE,qBAA0B,EAA1B,aAAa,mBAAG,cAAM,OAAA,IAAI,EAAJ,CAAI,KAAA,EAAK,KAAK,cAAnD,2BAAqD,CAAF;IAClF,IAAM,kBAAkB,GAAG,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxD,OAAO,oBAAC,gBAAgB,eAAK,KAAK,EAAM,kBAAkB,IAAE,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,aAAa,IAAI,CAAC;AAC/G,CAAC;AAED,gBAAgB,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React from 'react';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { CalendarProps } from './interfaces';\nimport InternalCalendar from './internal';\n\nexport { CalendarProps };\n\nexport default function Calendar({ locale = '', isDateEnabled = () => true, ...props }: CalendarProps) {\n const baseComponentProps = useBaseComponent('Calendar');\n return <InternalCalendar {...props} {...baseComponentProps} locale={locale} isDateEnabled={isDateEnabled} />;\n}\n\napplyDisplayName(Calendar, 'Calendar');\n"]}
|