@cloudscape-design/components 3.0.12 → 3.0.15
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/alert/styles.scoped.css +0 -2
- package/annotation-context/annotation/styles.scoped.css +0 -1
- package/area-chart/styles.scoped.css +0 -1
- package/attribute-editor/styles.scoped.css +0 -1
- package/autosuggest/internal.d.ts.map +1 -1
- package/autosuggest/internal.js +19 -33
- package/autosuggest/internal.js.map +1 -1
- package/autosuggest/options-list.d.ts +19 -0
- package/autosuggest/options-list.d.ts.map +1 -0
- package/autosuggest/options-list.js +37 -0
- package/autosuggest/options-list.js.map +1 -0
- package/autosuggest/plain-list.d.ts +3 -5
- package/autosuggest/plain-list.d.ts.map +1 -1
- package/autosuggest/plain-list.js +7 -7
- package/autosuggest/plain-list.js.map +1 -1
- package/autosuggest/virtual-list.d.ts +2 -6
- package/autosuggest/virtual-list.d.ts.map +1 -1
- package/autosuggest/virtual-list.js +7 -7
- package/autosuggest/virtual-list.js.map +1 -1
- package/badge/styles.scoped.css +0 -1
- package/breadcrumb-group/styles.scoped.css +0 -2
- package/button/styles.scoped.css +0 -1
- package/button-dropdown/mobile-expandable-group/styles.scoped.css +0 -2
- package/cards/styles.scoped.css +0 -1
- package/checkbox/styles.scoped.css +0 -1
- package/code-editor/styles.scoped.css +0 -1
- package/column-layout/styles.scoped.css +0 -1
- package/container/styles.scoped.css +0 -1
- package/date-picker/calendar/index.d.ts +1 -1
- package/date-picker/calendar/index.d.ts.map +1 -1
- package/date-picker/calendar/index.js +3 -1
- package/date-picker/calendar/index.js.map +1 -1
- package/date-picker/embedded.d.ts +3 -0
- package/date-picker/embedded.d.ts.map +1 -0
- package/date-picker/embedded.js +15 -0
- package/date-picker/embedded.js.map +1 -0
- package/date-picker/index.d.ts.map +1 -1
- package/date-picker/index.js +14 -39
- package/date-picker/index.js.map +1 -1
- package/date-picker/interfaces.d.ts +12 -10
- package/date-picker/interfaces.d.ts.map +1 -1
- package/date-picker/interfaces.js.map +1 -1
- package/date-picker/styles.scoped.css +0 -2
- package/date-picker/use-date-picker.d.ts +17 -0
- package/date-picker/use-date-picker.d.ts.map +1 -0
- package/date-picker/use-date-picker.js +48 -0
- package/date-picker/use-date-picker.js.map +1 -0
- package/date-range-picker/calendar/header/button/index.d.ts +1 -2
- package/date-range-picker/calendar/header/button/index.d.ts.map +1 -1
- package/date-range-picker/calendar/header/button/index.js +2 -3
- package/date-range-picker/calendar/header/button/index.js.map +1 -1
- package/date-range-picker/calendar/header/index.d.ts +1 -2
- package/date-range-picker/calendar/header/index.d.ts.map +1 -1
- package/date-range-picker/calendar/header/index.js +3 -3
- package/date-range-picker/calendar/header/index.js.map +1 -1
- package/date-range-picker/calendar/index.js +1 -1
- package/date-range-picker/calendar/index.js.map +1 -1
- package/date-range-picker/styles.scoped.css +0 -3
- package/expandable-section/styles.scoped.css +0 -1
- package/flashbar/styles.scoped.css +0 -1
- package/form/styles.scoped.css +0 -1
- package/form-field/styles.scoped.css +0 -1
- package/grid/styles.scoped.css +0 -1
- package/header/styles.scoped.css +0 -1
- package/help-panel/styles.scoped.css +0 -1
- package/input/styles.scoped.css +0 -1
- package/internal/components/abstract-switch/styles.scoped.css +0 -1
- package/internal/components/button-trigger/styles.scoped.css +0 -1
- package/internal/components/chart-filter/styles.scoped.css +0 -1
- package/internal/components/chart-legend/styles.scoped.css +0 -1
- package/internal/components/chart-popover/styles.scoped.css +0 -1
- package/internal/components/chart-series-details/styles.scoped.css +0 -2
- package/internal/components/chart-series-marker/styles.scoped.css +0 -1
- package/internal/components/dropdown/styles.scoped.css +0 -2
- package/internal/components/dropdown-footer/styles.scoped.css +0 -1
- package/internal/components/dropdown-status/styles.scoped.css +0 -1
- package/internal/components/menu-dropdown/styles.scoped.css +0 -1
- package/internal/components/option/styles.scoped.css +0 -1
- package/internal/components/options-list/styles.scoped.css +0 -1
- package/internal/environment.js +1 -1
- package/link/styles.scoped.css +0 -1
- package/mixed-line-bar-chart/styles.scoped.css +0 -1
- package/modal/styles.scoped.css +0 -2
- package/multiselect/styles.scoped.css +0 -1
- package/package.json +1 -1
- package/pagination/styles.scoped.css +0 -1
- package/pie-chart/styles.scoped.css +0 -1
- package/popover/styles.scoped.css +0 -2
- package/progress-bar/styles.scoped.css +0 -1
- package/property-filter/styles.scoped.css +0 -1
- package/radio-group/styles.scoped.css +0 -1
- package/segmented-control/styles.scoped.css +0 -7
- package/select/styles.scoped.css +0 -1
- package/side-navigation/styles.scoped.css +0 -1
- package/split-panel/styles.scoped.css +0 -2
- package/table/resizer/styles.scoped.css +0 -1
- package/tabs/styles.scoped.css +0 -1
- package/text-content/styles.scoped.css +0 -1
- package/text-filter/styles.scoped.css +0 -1
- package/textarea/styles.scoped.css +0 -12
- package/tiles/styles.scoped.css +0 -2
- package/toggle/styles.scoped.css +0 -1
- package/token-group/styles.scoped.css +0 -2
- package/top-navigation/1.0-beta/styles.scoped.css +0 -1
- package/top-navigation/styles.scoped.css +0 -3
- package/tutorial-panel/components/tutorial-detail-view/styles.scoped.css +0 -1
- package/tutorial-panel/components/tutorial-list/styles.scoped.css +0 -3
- package/tutorial-panel/styles.scoped.css +0 -1
- package/wizard/styles.scoped.css +0 -1
- package/autosuggest/hooks/a11y.d.ts +0 -5
- package/autosuggest/hooks/a11y.d.ts.map +0 -1
- package/autosuggest/hooks/a11y.js +0 -24
- package/autosuggest/hooks/a11y.js.map +0 -1
package/cards/styles.scoped.css
CHANGED
|
@@ -132,7 +132,6 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
132
132
|
font-stretch: normal;
|
|
133
133
|
line-height: normal;
|
|
134
134
|
-webkit-hyphens: none;
|
|
135
|
-
-ms-hyphens: none;
|
|
136
135
|
hyphens: none;
|
|
137
136
|
letter-spacing: normal;
|
|
138
137
|
list-style: disc outside none;
|
|
@@ -493,7 +493,6 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
493
493
|
font-stretch: normal;
|
|
494
494
|
line-height: normal;
|
|
495
495
|
-webkit-hyphens: none;
|
|
496
|
-
-ms-hyphens: none;
|
|
497
496
|
hyphens: none;
|
|
498
497
|
letter-spacing: normal;
|
|
499
498
|
list-style: disc outside none;
|
|
@@ -110,7 +110,6 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
110
110
|
font-stretch: normal;
|
|
111
111
|
line-height: normal;
|
|
112
112
|
-webkit-hyphens: none;
|
|
113
|
-
-ms-hyphens: none;
|
|
114
113
|
hyphens: none;
|
|
115
114
|
letter-spacing: normal;
|
|
116
115
|
list-style: disc outside none;
|
|
@@ -10,7 +10,7 @@ export interface MonthChangeHandler {
|
|
|
10
10
|
export declare type DayIndex = 0 | 1 | 2 | 3 | 4 | 5 | 6;
|
|
11
11
|
interface CalendarProps extends BaseComponentProps {
|
|
12
12
|
locale: string;
|
|
13
|
-
startOfWeek:
|
|
13
|
+
startOfWeek: number | undefined;
|
|
14
14
|
selectedDate: Date | null;
|
|
15
15
|
displayedDate: Date;
|
|
16
16
|
isDateEnabled: DatePickerProps.IsDateEnabledFunction;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/date-picker/calendar/index.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AAEnE,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/date-picker/calendar/index.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AAEnE,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAS9C,MAAM,WAAW,iBAAiB;IAChC,CAAC,MAAM,EAAE,aAAa,CAAC,UAAU,GAAG,IAAI,CAAC;CAC1C;AAED,MAAM,WAAW,kBAAkB;IACjC,CAAC,QAAQ,EAAE,IAAI,GAAG,IAAI,CAAC;CACxB;AAED,oBAAY,QAAQ,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAMjD,UAAU,aAAc,SAAQ,kBAAkB;IAChD,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,YAAY,EAAE,IAAI,GAAG,IAAI,CAAC;IAC1B,aAAa,EAAE,IAAI,CAAC;IACpB,aAAa,EAAE,eAAe,CAAC,qBAAqB,CAAC;IACrD,cAAc,EAAE,MAAM,CAAC;IACvB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,cAAc,EAAE,MAAM,CAAC;IAEvB,aAAa,EAAE,kBAAkB,CAAC;IAClC,YAAY,EAAE,iBAAiB,CAAC;CACjC;AAED,QAAA,MAAM,QAAQ,0JAWX,aAAa,gBA4Gf,CAAC;AAEF,eAAe,QAAQ,CAAC"}
|
|
@@ -11,8 +11,10 @@ import moveFocusHandler from './utils/move-focus-handler';
|
|
|
11
11
|
import { useUniqueId } from '../../internal/hooks/use-unique-id/index.js';
|
|
12
12
|
import { formatDate, memoizedDate } from './utils/date.js';
|
|
13
13
|
import { useEffectOnUpdate } from '../../internal/hooks/use-effect-on-update.js';
|
|
14
|
+
import { getWeekStartByLocale } from 'weekstart';
|
|
14
15
|
var Calendar = function (_a) {
|
|
15
16
|
var locale = _a.locale, startOfWeek = _a.startOfWeek, displayedDate = _a.displayedDate, todayAriaLabel = _a.todayAriaLabel, selectedDate = _a.selectedDate, isDateEnabled = _a.isDateEnabled, onChangeMonth = _a.onChangeMonth, onSelectDate = _a.onSelectDate, previousMonthLabel = _a.previousMonthLabel, nextMonthLabel = _a.nextMonthLabel;
|
|
17
|
+
var normalizedStartOfWeek = (typeof startOfWeek === 'number' ? startOfWeek : getWeekStartByLocale(locale));
|
|
16
18
|
var focusVisible = useFocusVisible();
|
|
17
19
|
var headerId = useUniqueId('calendar-dialog-title-');
|
|
18
20
|
var elementRef = useRef(null);
|
|
@@ -78,7 +80,7 @@ var Calendar = function (_a) {
|
|
|
78
80
|
React.createElement("div", { className: styles['calendar-inner'] },
|
|
79
81
|
React.createElement(CalendarHeader, { headerId: headerId, baseDate: baseDate, locale: locale, onChangeMonth: onHeaderChangeMonthHandler, previousMonthLabel: previousMonthLabel, nextMonthLabel: nextMonthLabel }),
|
|
80
82
|
React.createElement("div", { onBlur: onGridBlur, ref: gridWrapperRef },
|
|
81
|
-
React.createElement(Grid, { locale: locale, baseDate: baseDate, isDateEnabled: isDateEnabled, focusedDate: focusedOrSelectedDate, onSelectDate: onGridSelectDateHandler, onFocusDate: onGridFocusDateHandler, onChangeMonth: onGridChangeMonthHandler, startOfWeek:
|
|
83
|
+
React.createElement(Grid, { locale: locale, baseDate: baseDate, isDateEnabled: isDateEnabled, focusedDate: focusedOrSelectedDate, onSelectDate: onGridSelectDateHandler, onFocusDate: onGridFocusDateHandler, onChangeMonth: onGridChangeMonthHandler, startOfWeek: normalizedStartOfWeek, todayAriaLabel: todayAriaLabel, selectedDate: selectedDate, handleFocusMove: moveFocusHandler })))));
|
|
82
84
|
};
|
|
83
85
|
export default Calendar;
|
|
84
86
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/date-picker/calendar/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACzE,OAAO,MAAM,MAAM,kBAAkB,CAAC;AAEtC,OAAO,eAAe,MAAM,6CAA6C,CAAC;AAG1E,OAAO,cAAc,MAAM,UAAU,CAAC;AACtC,OAAO,IAAmC,MAAM,QAAQ,CAAC;AACzD,OAAO,gBAAgB,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,WAAW,EAAE,MAAM,6CAA6C,CAAC;AAC1E,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,8CAA8C,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/date-picker/calendar/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, { useRef, useState } from 'react';\nimport { addDays, addMonths, isSameMonth, startOfMonth } from 'date-fns';\nimport styles from '../styles.css.js';\nimport { BaseComponentProps } from '../../internal/base-component';\nimport useFocusVisible from '../../internal/hooks/focus-visible/index.js';\nimport { DatePickerProps } from '../interfaces';\nimport { CalendarTypes } from './definitions';\nimport CalendarHeader from './header';\nimport Grid, { DateChangeHandlerNullable } from './grid';\nimport moveFocusHandler from './utils/move-focus-handler';\nimport { useUniqueId } from '../../internal/hooks/use-unique-id/index.js';\nimport { formatDate, memoizedDate } from './utils/date.js';\nimport { useEffectOnUpdate } from '../../internal/hooks/use-effect-on-update.js';\nimport { getWeekStartByLocale } from 'weekstart';\n\nexport interface DateChangeHandler {\n (detail: CalendarTypes.DateDetail): void;\n}\n\nexport interface MonthChangeHandler {\n (newMonth: Date): void;\n}\n\nexport type DayIndex = 0 | 1 | 2 | 3 | 4 | 5 | 6;\n\ninterface HeaderChangeMonthHandler {\n (isPreviousButtonClick?: boolean): void;\n}\n\ninterface CalendarProps extends BaseComponentProps {\n locale: string;\n startOfWeek: number | undefined;\n selectedDate: Date | null;\n displayedDate: Date;\n isDateEnabled: DatePickerProps.IsDateEnabledFunction;\n nextMonthLabel: string;\n previousMonthLabel: string;\n todayAriaLabel: string;\n\n onChangeMonth: MonthChangeHandler;\n onSelectDate: DateChangeHandler;\n}\n\nconst Calendar = ({\n locale,\n startOfWeek,\n displayedDate,\n todayAriaLabel,\n selectedDate,\n isDateEnabled,\n onChangeMonth,\n onSelectDate,\n previousMonthLabel,\n nextMonthLabel,\n}: CalendarProps) => {\n const normalizedStartOfWeek = (\n typeof startOfWeek === 'number' ? startOfWeek : getWeekStartByLocale(locale)\n ) as DayIndex;\n const focusVisible = useFocusVisible();\n const headerId = useUniqueId('calendar-dialog-title-');\n const elementRef = useRef<HTMLDivElement>(null);\n const gridWrapperRef = useRef<HTMLDivElement>(null);\n const [focusedDate, setFocusedDate] = useState<Date | null>(null);\n\n const selectFocusedDate = (selected: Date | null, baseDate: Date): Date | null => {\n if (selected && isDateEnabled(selected) && isSameMonth(selected, baseDate)) {\n return selected;\n }\n const today = new Date();\n if (isDateEnabled(today) && isSameMonth(today, baseDate)) {\n return today;\n }\n if (isDateEnabled(baseDate)) {\n return baseDate;\n }\n return null;\n };\n\n const getBaseDate = (date: Date) => {\n const startDate = startOfMonth(date);\n if (isDateEnabled(startDate)) {\n return startDate;\n }\n return moveFocusHandler(startDate, isDateEnabled, (date: Date) => addDays(date, 1));\n };\n\n const baseDate: Date = getBaseDate(displayedDate);\n const focusedOrSelectedDate = focusedDate || selectFocusedDate(selectedDate, baseDate);\n\n const onHeaderChangeMonthHandler: HeaderChangeMonthHandler = isPrevious => {\n onChangeMonth(addMonths(baseDate, isPrevious ? -1 : 1));\n setFocusedDate(null);\n };\n\n const onGridChangeMonthHandler: MonthChangeHandler = newMonth => {\n onChangeMonth(newMonth);\n setFocusedDate(null);\n };\n\n const onGridFocusDateHandler: DateChangeHandlerNullable = ({ date }) => {\n if (date) {\n const value = memoizedDate('focused', formatDate(date));\n setFocusedDate(value);\n }\n };\n\n const onGridSelectDateHandler: DateChangeHandler = detail => {\n onSelectDate(detail);\n setFocusedDate(null);\n };\n\n // The focused date changes as a feedback to keyboard navigation in the grid.\n // Once changed, the corresponding day button needs to receive the actual focus.\n useEffectOnUpdate(() => {\n if (focusedDate) {\n (elementRef.current?.querySelector(`.${styles['calendar-day-focusable']}`) as HTMLDivElement)?.focus();\n }\n }, [focusedDate]);\n\n const onGridBlur = (event: React.FocusEvent) => {\n const newFocusTargetIsInGrid = event.relatedTarget && gridWrapperRef.current?.contains(event.relatedTarget as Node);\n if (!newFocusTargetIsInGrid) {\n setFocusedDate(null);\n }\n };\n\n return (\n <div\n {...focusVisible}\n className={styles.calendar}\n tabIndex={0}\n role=\"application\"\n aria-describedby={headerId}\n ref={elementRef}\n >\n <div className={styles['calendar-inner']}>\n <CalendarHeader\n headerId={headerId}\n baseDate={baseDate}\n locale={locale}\n onChangeMonth={onHeaderChangeMonthHandler}\n previousMonthLabel={previousMonthLabel}\n nextMonthLabel={nextMonthLabel}\n />\n <div onBlur={onGridBlur} ref={gridWrapperRef}>\n <Grid\n locale={locale}\n baseDate={baseDate}\n isDateEnabled={isDateEnabled}\n focusedDate={focusedOrSelectedDate}\n onSelectDate={onGridSelectDateHandler}\n onFocusDate={onGridFocusDateHandler}\n onChangeMonth={onGridChangeMonthHandler}\n startOfWeek={normalizedStartOfWeek}\n todayAriaLabel={todayAriaLabel}\n selectedDate={selectedDate}\n handleFocusMove={moveFocusHandler}\n />\n </div>\n </div>\n </div>\n );\n};\n\nexport default Calendar;\n"]}
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { DatePickerBaseProps } from './interfaces';
|
|
2
|
+
export declare const DatePickerEmbedded: ({ value, locale, startOfWeek, isDateEnabled, nextMonthAriaLabel, previousMonthAriaLabel, todayAriaLabel, onChange, }: DatePickerBaseProps) => JSX.Element;
|
|
3
|
+
//# sourceMappingURL=embedded.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"embedded.d.ts","sourceRoot":"","sources":["../../../src/date-picker/embedded.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAKnD,eAAO,MAAM,kBAAkB,yHAS5B,mBAAmB,gBAoBrB,CAAC"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
+
import React from 'react';
|
|
4
|
+
import Calendar from './calendar';
|
|
5
|
+
import { memoizedDate } from './calendar/utils/date';
|
|
6
|
+
import { useDatePicker } from './use-date-picker';
|
|
7
|
+
export var DatePickerEmbedded = function (_a) {
|
|
8
|
+
var value = _a.value, _b = _a.locale, locale = _b === void 0 ? '' : _b, startOfWeek = _a.startOfWeek, isDateEnabled = _a.isDateEnabled, nextMonthAriaLabel = _a.nextMonthAriaLabel, previousMonthAriaLabel = _a.previousMonthAriaLabel, todayAriaLabel = _a.todayAriaLabel, onChange = _a.onChange;
|
|
9
|
+
var _c = useDatePicker({
|
|
10
|
+
value: value,
|
|
11
|
+
onChange: onChange
|
|
12
|
+
}), displayedDate = _c.displayedDate, selectedDate = _c.selectedDate, onChangeMonthHandler = _c.onChangeMonthHandler, onSelectDateHandler = _c.onSelectDateHandler;
|
|
13
|
+
return (React.createElement(Calendar, { selectedDate: memoizedDate('value', selectedDate), displayedDate: memoizedDate('displayed', displayedDate), locale: locale, startOfWeek: startOfWeek, isDateEnabled: isDateEnabled ? isDateEnabled : function () { return true; }, nextMonthLabel: nextMonthAriaLabel, previousMonthLabel: previousMonthAriaLabel, todayAriaLabel: todayAriaLabel, onChangeMonth: onChangeMonthHandler, onSelectDate: onSelectDateHandler }));
|
|
14
|
+
};
|
|
15
|
+
//# sourceMappingURL=embedded.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"embedded.js","sourceRoot":"","sources":["../../../src/date-picker/embedded.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD,MAAM,CAAC,IAAM,kBAAkB,GAAG,UAAC,EASb;QARpB,KAAK,WAAA,EACL,cAAW,EAAX,MAAM,mBAAG,EAAE,KAAA,EACX,WAAW,iBAAA,EACX,aAAa,mBAAA,EACb,kBAAkB,wBAAA,EAClB,sBAAsB,4BAAA,EACtB,cAAc,oBAAA,EACd,QAAQ,cAAA;IAEF,IAAA,KAA6E,aAAa,CAAC;QAC/F,KAAK,OAAA;QACL,QAAQ,UAAA;KACT,CAAC,EAHM,aAAa,mBAAA,EAAE,YAAY,kBAAA,EAAE,oBAAoB,0BAAA,EAAE,mBAAmB,yBAG5E,CAAC;IAEH,OAAO,CACL,oBAAC,QAAQ,IACP,YAAY,EAAE,YAAY,CAAC,OAAO,EAAE,YAAY,CAAC,EACjD,aAAa,EAAE,YAAY,CAAC,WAAW,EAAE,aAAa,CAAC,EACvD,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,WAAW,EACxB,aAAa,EAAE,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,cAAM,OAAA,IAAI,EAAJ,CAAI,EACzD,cAAc,EAAE,kBAAkB,EAClC,kBAAkB,EAAE,sBAAsB,EAC1C,cAAc,EAAE,cAAc,EAC9B,aAAa,EAAE,oBAAoB,EACnC,YAAY,EAAE,mBAAmB,GACjC,CACH,CAAC;AACJ,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 { DatePickerBaseProps } from './interfaces';\nimport Calendar from './calendar';\nimport { memoizedDate } from './calendar/utils/date';\nimport { useDatePicker } from './use-date-picker';\n\nexport const DatePickerEmbedded = ({\n value,\n locale = '',\n startOfWeek,\n isDateEnabled,\n nextMonthAriaLabel,\n previousMonthAriaLabel,\n todayAriaLabel,\n onChange,\n}: DatePickerBaseProps) => {\n const { displayedDate, selectedDate, onChangeMonthHandler, onSelectDateHandler } = useDatePicker({\n value,\n onChange,\n });\n\n return (\n <Calendar\n selectedDate={memoizedDate('value', selectedDate)}\n displayedDate={memoizedDate('displayed', displayedDate)}\n locale={locale}\n startOfWeek={startOfWeek}\n isDateEnabled={isDateEnabled ? isDateEnabled : () => true}\n nextMonthLabel={nextMonthAriaLabel}\n previousMonthLabel={previousMonthAriaLabel}\n todayAriaLabel={todayAriaLabel}\n onChangeMonth={onChangeMonthHandler}\n onSelectDate={onSelectDateHandler}\n />\n );\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/date-picker/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA6C,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/date-picker/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA6C,MAAM,OAAO,CAAC;AAElE,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAuB/C,OAAO,EAAE,eAAe,EAAE,CAAC;AAE3B,QAAA,MAAM,UAAU,6FAqLf,CAAC;AAGF,eAAe,UAAU,CAAC"}
|
package/date-picker/index.js
CHANGED
|
@@ -3,12 +3,11 @@ import { __assign, __rest } from "tslib";
|
|
|
3
3
|
// SPDX-License-Identifier: Apache-2.0
|
|
4
4
|
import clsx from 'clsx';
|
|
5
5
|
import React, { useCallback, useRef, useState } from 'react';
|
|
6
|
-
import { getWeekStartByLocale } from 'weekstart';
|
|
7
6
|
import styles from './styles.css.js';
|
|
8
7
|
import Calendar from './calendar';
|
|
9
8
|
import { normalizeLocale } from './calendar/utils/locales';
|
|
10
9
|
import { getDateLabel } from './calendar/utils/intl';
|
|
11
|
-
import { displayToIso,
|
|
10
|
+
import { displayToIso, isoToDisplay, memoizedDate } from './calendar/utils/date';
|
|
12
11
|
import { KeyCode } from '../internal/keycode';
|
|
13
12
|
import { fireNonCancelableEvent } from '../internal/events';
|
|
14
13
|
import Dropdown from '../internal/components/dropdown';
|
|
@@ -18,23 +17,22 @@ import { applyDisplayName } from '../internal/utils/apply-display-name.js';
|
|
|
18
17
|
import checkControlled from '../internal/hooks/check-controlled';
|
|
19
18
|
import { useFocusTracker } from '../internal/hooks/use-focus-tracker.js';
|
|
20
19
|
import useForwardFocus from '../internal/hooks/forward-focus';
|
|
21
|
-
import { usePrevious } from '../internal/hooks/use-previous';
|
|
22
20
|
import { InternalButton } from '../button/internal';
|
|
23
21
|
import useBaseComponent from '../internal/hooks/use-base-component';
|
|
24
22
|
import { useUniqueId } from '../internal/hooks/use-unique-id';
|
|
25
23
|
import { useMergeRefs } from '../internal/hooks/use-merge-refs';
|
|
26
24
|
import FocusLock from '../internal/components/focus-lock';
|
|
25
|
+
import { useDatePicker } from './use-date-picker.js';
|
|
27
26
|
var DatePicker = React.forwardRef(function (_a, ref) {
|
|
28
27
|
var _b = _a.locale, locale = _b === void 0 ? '' : _b, startOfWeek = _a.startOfWeek, isDateEnabled = _a.isDateEnabled, nextMonthAriaLabel = _a.nextMonthAriaLabel, previousMonthAriaLabel = _a.previousMonthAriaLabel, todayAriaLabel = _a.todayAriaLabel, _c = _a.placeholder, placeholder = _c === void 0 ? '' : _c, _d = _a.value, value = _d === void 0 ? '' : _d, _e = _a.readOnly, readOnly = _e === void 0 ? false : _e, _f = _a.disabled, disabled = _f === void 0 ? false : _f, onBlur = _a.onBlur, _g = _a.autoFocus, autoFocus = _g === void 0 ? false : _g, onChange = _a.onChange, onFocus = _a.onFocus, name = _a.name, ariaLabel = _a.ariaLabel, ariaRequired = _a.ariaRequired, ariaLabelledby = _a.ariaLabelledby, ariaDescribedby = _a.ariaDescribedby, controlId = _a.controlId, invalid = _a.invalid, openCalendarAriaLabel = _a.openCalendarAriaLabel, expandToViewport = _a.expandToViewport, rest = __rest(_a, ["locale", "startOfWeek", "isDateEnabled", "nextMonthAriaLabel", "previousMonthAriaLabel", "todayAriaLabel", "placeholder", "value", "readOnly", "disabled", "onBlur", "autoFocus", "onChange", "onFocus", "name", "ariaLabel", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "controlId", "invalid", "openCalendarAriaLabel", "expandToViewport"]);
|
|
29
28
|
var __internalRootRef = useBaseComponent('DatePicker').__internalRootRef;
|
|
29
|
+
var _h = useDatePicker({
|
|
30
|
+
value: value,
|
|
31
|
+
onChange: onChange
|
|
32
|
+
}), defaultDisplayedDate = _h.defaultDisplayedDate, displayedDate = _h.displayedDate, setDisplayedDate = _h.setDisplayedDate, selectedDate = _h.selectedDate, onChangeMonthHandler = _h.onChangeMonthHandler, onSelectDateHandler = _h.onSelectDateHandler;
|
|
30
33
|
var baseProps = getBaseProps(rest);
|
|
31
|
-
var
|
|
34
|
+
var _j = useState(false), isDropDownOpen = _j[0], setIsDropDownOpen = _j[1];
|
|
32
35
|
var normalizedLocale = normalizeLocale('DatePicker', locale !== null && locale !== void 0 ? locale : '');
|
|
33
|
-
var normalizedStartOfWeek = (typeof startOfWeek === 'number' ? startOfWeek : getWeekStartByLocale(normalizedLocale));
|
|
34
|
-
var defaultSelectedDate = value.length >= 10 ? value : null;
|
|
35
|
-
var _j = useState(defaultSelectedDate), selectedDate = _j[0], setSelectedDate = _j[1];
|
|
36
|
-
var defaultDisplayedDate = value.length >= 10 ? value : formatDate(new Date());
|
|
37
|
-
var _k = useState(defaultDisplayedDate), displayedDate = _k[0], setDisplayedDate = _k[1];
|
|
38
36
|
var internalInputRef = useRef(null);
|
|
39
37
|
var buttonRef = useRef(null);
|
|
40
38
|
useForwardFocus(ref, internalInputRef);
|
|
@@ -42,23 +40,10 @@ var DatePicker = React.forwardRef(function (_a, ref) {
|
|
|
42
40
|
var dropdownId = useUniqueId('calender');
|
|
43
41
|
var mergedRef = useMergeRefs(rootRef, __internalRootRef);
|
|
44
42
|
useFocusTracker({ rootRef: rootRef, onBlur: onBlur, onFocus: onFocus, viewportId: expandToViewport ? dropdownId : '' });
|
|
45
|
-
var onChangeMonthHandler = function (newMonth) {
|
|
46
|
-
setDisplayedDate(formatDate(newMonth));
|
|
47
|
-
};
|
|
48
|
-
var onSelectDateHandler = function (_a) {
|
|
49
|
-
var _b;
|
|
50
|
-
var date = _a.date;
|
|
51
|
-
var formattedDate = formatDate(date);
|
|
52
|
-
(_b = buttonRef.current) === null || _b === void 0 ? void 0 : _b.focus();
|
|
53
|
-
setIsDropDownOpen(false);
|
|
54
|
-
setSelectedDate(formattedDate);
|
|
55
|
-
setDisplayedDate(formattedDate);
|
|
56
|
-
fireNonCancelableEvent(onChange, { value: formattedDate });
|
|
57
|
-
};
|
|
58
43
|
var onDropdownCloseHandler = useCallback(function () {
|
|
59
44
|
setDisplayedDate(defaultDisplayedDate);
|
|
60
45
|
setIsDropDownOpen(false);
|
|
61
|
-
}, [defaultDisplayedDate]);
|
|
46
|
+
}, [defaultDisplayedDate, setDisplayedDate, setIsDropDownOpen]);
|
|
62
47
|
var onButtonClickHandler = function () {
|
|
63
48
|
if (!isDropDownOpen) {
|
|
64
49
|
setIsDropDownOpen(true);
|
|
@@ -81,21 +66,6 @@ var DatePicker = React.forwardRef(function (_a, ref) {
|
|
|
81
66
|
setIsDropDownOpen(false);
|
|
82
67
|
}
|
|
83
68
|
};
|
|
84
|
-
var prevValue = usePrevious(value);
|
|
85
|
-
if (prevValue !== value) {
|
|
86
|
-
if (value === '' && selectedDate !== value) {
|
|
87
|
-
setSelectedDate(value);
|
|
88
|
-
}
|
|
89
|
-
// update the displayedDate when inputValue changes in order to
|
|
90
|
-
// display the correct month when the date picker gets open again.
|
|
91
|
-
if (value.length >= 4 && displayedDate !== value) {
|
|
92
|
-
setDisplayedDate(value);
|
|
93
|
-
}
|
|
94
|
-
// set the selected date only when a full date (yyyy-mm-dd) is entered
|
|
95
|
-
if (value.length >= 10 && selectedDate !== value) {
|
|
96
|
-
setSelectedDate(value);
|
|
97
|
-
}
|
|
98
|
-
}
|
|
99
69
|
var DateInputElement = (React.createElement("div", { className: styles['date-picker-trigger'] },
|
|
100
70
|
React.createElement("div", { className: styles['date-picker-input'] },
|
|
101
71
|
React.createElement(DateInput, { name: name, invalid: invalid, controlId: controlId, ariaLabelledby: ariaLabelledby, ariaDescribedby: ariaDescribedby, ariaLabel: ariaLabel, ariaRequired: ariaRequired, value: isoToDisplay(value), autoComplete: false, disableBrowserAutocorrect: true, disableAutocompleteOnBlur: isDropDownOpen, disabled: disabled, readOnly: readOnly, onChange: onInputChangeHandler, onBlur: onInputBlurHandler, placeholder: placeholder, ref: internalInputRef, autoFocus: autoFocus })),
|
|
@@ -113,7 +83,12 @@ var DatePicker = React.forwardRef(function (_a, ref) {
|
|
|
113
83
|
};
|
|
114
84
|
return (React.createElement("div", __assign({}, baseProps, { ref: mergedRef, onKeyDown: onWrapperKeyDownHandler }),
|
|
115
85
|
React.createElement(Dropdown, { stretchWidth: true, stretchHeight: true, open: isDropDownOpen, onDropdownClose: onDropdownCloseHandler, onMouseDown: handleMouseDown, trigger: DateInputElement, expandToViewport: expandToViewport, scrollable: false, dropdownId: dropdownId }, isDropDownOpen && (React.createElement(FocusLock, { autoFocus: true },
|
|
116
|
-
React.createElement(Calendar, { selectedDate: memoizedDate('value', selectedDate), displayedDate: memoizedDate('displayed', displayedDate), locale: normalizedLocale, startOfWeek:
|
|
86
|
+
React.createElement(Calendar, { selectedDate: memoizedDate('value', selectedDate), displayedDate: memoizedDate('displayed', displayedDate), locale: normalizedLocale, startOfWeek: startOfWeek, isDateEnabled: isDateEnabled ? isDateEnabled : function () { return true; }, nextMonthLabel: nextMonthAriaLabel, previousMonthLabel: previousMonthAriaLabel, todayAriaLabel: todayAriaLabel, onChangeMonth: onChangeMonthHandler, onSelectDate: function (e) {
|
|
87
|
+
var _a;
|
|
88
|
+
onSelectDateHandler(e);
|
|
89
|
+
(_a = buttonRef === null || buttonRef === void 0 ? void 0 : buttonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
90
|
+
setIsDropDownOpen(false);
|
|
91
|
+
} }))))));
|
|
117
92
|
});
|
|
118
93
|
applyDisplayName(DatePicker, 'DatePicker');
|
|
119
94
|
export default DatePicker;
|
package/date-picker/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/date-picker/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { Ref, useCallback, useRef, useState } from 'react';\nimport { getWeekStartByLocale } from 'weekstart';\nimport styles from './styles.css.js';\nimport { DatePickerProps } from './interfaces';\nimport Calendar, { DayIndex } from './calendar';\nimport { normalizeLocale } from './calendar/utils/locales';\nimport { getDateLabel } from './calendar/utils/intl';\nimport { CalendarTypes } from './calendar/definitions';\nimport { displayToIso, formatDate, isoToDisplay, memoizedDate } from './calendar/utils/date';\nimport { InputProps } from '../input/interfaces';\nimport { KeyCode } from '../internal/keycode';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport Dropdown from '../internal/components/dropdown';\nimport DateInput from '../internal/components/date-input';\nimport { getBaseProps } from '../internal/base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name.js';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport { useFocusTracker } from '../internal/hooks/use-focus-tracker.js';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport { usePrevious } from '../internal/hooks/use-previous';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport FocusLock from '../internal/components/focus-lock';\n\nexport { DatePickerProps };\n\nconst DatePicker = React.forwardRef(\n (\n {\n locale = '',\n startOfWeek,\n isDateEnabled,\n nextMonthAriaLabel,\n previousMonthAriaLabel,\n todayAriaLabel,\n placeholder = '',\n value = '',\n readOnly = false,\n disabled = false,\n onBlur,\n autoFocus = false,\n onChange,\n onFocus,\n name,\n ariaLabel,\n ariaRequired,\n ariaLabelledby,\n ariaDescribedby,\n controlId,\n invalid,\n openCalendarAriaLabel,\n expandToViewport,\n ...rest\n }: DatePickerProps,\n ref: Ref<DatePickerProps.Ref>\n ) => {\n const { __internalRootRef } = useBaseComponent('DatePicker');\n\n const baseProps = getBaseProps(rest);\n const [isDropDownOpen, setIsDropDownOpen] = useState<boolean>(false);\n const normalizedLocale = normalizeLocale('DatePicker', locale ?? '');\n const normalizedStartOfWeek = (\n typeof startOfWeek === 'number' ? startOfWeek : getWeekStartByLocale(normalizedLocale)\n ) as DayIndex;\n\n const defaultSelectedDate = value.length >= 10 ? value : null;\n const [selectedDate, setSelectedDate] = useState<string | null>(defaultSelectedDate);\n\n const defaultDisplayedDate = value.length >= 10 ? value : formatDate(new Date());\n const [displayedDate, setDisplayedDate] = useState<string>(defaultDisplayedDate);\n\n const internalInputRef = useRef<HTMLInputElement>(null);\n const buttonRef = useRef<ButtonProps.Ref>(null);\n useForwardFocus(ref, internalInputRef);\n\n const rootRef = useRef<HTMLDivElement>(null);\n const dropdownId = useUniqueId('calender');\n const mergedRef = useMergeRefs(rootRef, __internalRootRef);\n\n useFocusTracker({ rootRef, onBlur, onFocus, viewportId: expandToViewport ? dropdownId : '' });\n\n const onChangeMonthHandler = (newMonth: Date) => {\n setDisplayedDate(formatDate(newMonth));\n };\n\n const onSelectDateHandler = ({ date }: CalendarTypes.DateDetail) => {\n const formattedDate = formatDate(date);\n buttonRef.current?.focus();\n setIsDropDownOpen(false);\n setSelectedDate(formattedDate);\n setDisplayedDate(formattedDate);\n fireNonCancelableEvent(onChange, { value: formattedDate });\n };\n\n const onDropdownCloseHandler = useCallback(() => {\n setDisplayedDate(defaultDisplayedDate);\n setIsDropDownOpen(false);\n }, [defaultDisplayedDate]);\n\n const onButtonClickHandler = () => {\n if (!isDropDownOpen) {\n setIsDropDownOpen(true);\n }\n };\n\n const onWrapperKeyDownHandler = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (event.keyCode === KeyCode.escape && isDropDownOpen) {\n buttonRef.current?.focus();\n setIsDropDownOpen(false);\n }\n };\n\n const onInputChangeHandler: InputProps['onChange'] = event => {\n const isoDateString = displayToIso(event.detail.value);\n fireNonCancelableEvent(onChange, { value: isoDateString });\n };\n\n const onInputBlurHandler: InputProps['onBlur'] = () => {\n if (!isDropDownOpen) {\n setDisplayedDate(defaultDisplayedDate);\n setIsDropDownOpen(false);\n }\n };\n\n const prevValue = usePrevious(value);\n if (prevValue !== value) {\n if (value === '' && selectedDate !== value) {\n setSelectedDate(value);\n }\n // update the displayedDate when inputValue changes in order to\n // display the correct month when the date picker gets open again.\n if (value.length >= 4 && displayedDate !== value) {\n setDisplayedDate(value);\n }\n // set the selected date only when a full date (yyyy-mm-dd) is entered\n if (value.length >= 10 && selectedDate !== value) {\n setSelectedDate(value);\n }\n }\n\n const DateInputElement = (\n <div className={styles['date-picker-trigger']}>\n <div className={styles['date-picker-input']}>\n <DateInput\n name={name}\n invalid={invalid}\n controlId={controlId}\n ariaLabelledby={ariaLabelledby}\n ariaDescribedby={ariaDescribedby}\n ariaLabel={ariaLabel}\n ariaRequired={ariaRequired}\n value={isoToDisplay(value)}\n autoComplete={false}\n disableBrowserAutocorrect={true}\n disableAutocompleteOnBlur={isDropDownOpen}\n disabled={disabled}\n readOnly={readOnly}\n onChange={onInputChangeHandler}\n onBlur={onInputBlurHandler}\n placeholder={placeholder}\n ref={internalInputRef}\n autoFocus={autoFocus}\n />\n </div>\n <div>\n <InternalButton\n iconName=\"calendar\"\n className={styles['open-calendar-button']}\n onClick={onButtonClickHandler}\n ref={buttonRef}\n ariaLabel={\n openCalendarAriaLabel &&\n openCalendarAriaLabel(\n value.length === 10 ? getDateLabel(normalizedLocale, memoizedDate('value', value)) : null\n )\n }\n disabled={disabled || readOnly}\n formAction=\"none\"\n />\n </div>\n </div>\n );\n\n baseProps.className = clsx(baseProps.className, styles.root, styles['date-picker-container']);\n\n if (readOnly || disabled) {\n return <div {...baseProps}>{DateInputElement}</div>;\n }\n\n checkControlled('DatePicker', 'value', value, 'onChange', onChange);\n\n const handleMouseDown = (event: React.MouseEvent) => {\n // prevent currently focused element from losing it\n event.preventDefault();\n };\n\n return (\n <div {...baseProps} ref={mergedRef} onKeyDown={onWrapperKeyDownHandler}>\n <Dropdown\n stretchWidth={true}\n stretchHeight={true}\n open={isDropDownOpen}\n onDropdownClose={onDropdownCloseHandler}\n onMouseDown={handleMouseDown}\n trigger={DateInputElement}\n expandToViewport={expandToViewport}\n scrollable={false}\n dropdownId={dropdownId}\n >\n {isDropDownOpen && (\n <FocusLock autoFocus={true}>\n <Calendar\n selectedDate={memoizedDate('value', selectedDate)}\n displayedDate={memoizedDate('displayed', displayedDate)}\n locale={normalizedLocale}\n startOfWeek={normalizedStartOfWeek}\n isDateEnabled={isDateEnabled ? isDateEnabled : () => true}\n nextMonthLabel={nextMonthAriaLabel}\n previousMonthLabel={previousMonthAriaLabel}\n todayAriaLabel={todayAriaLabel}\n onChangeMonth={onChangeMonthHandler}\n onSelectDate={onSelectDateHandler}\n />\n </FocusLock>\n )}\n </Dropdown>\n </div>\n );\n }\n);\n\napplyDisplayName(DatePicker, 'DatePicker');\nexport default DatePicker;\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/date-picker/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { Ref, useCallback, useRef, useState } from 'react';\nimport styles from './styles.css.js';\nimport { DatePickerProps } from './interfaces';\nimport Calendar from './calendar';\nimport { normalizeLocale } from './calendar/utils/locales';\nimport { getDateLabel } from './calendar/utils/intl';\nimport { displayToIso, isoToDisplay, memoizedDate } from './calendar/utils/date';\nimport { InputProps } from '../input/interfaces';\nimport { KeyCode } from '../internal/keycode';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport Dropdown from '../internal/components/dropdown';\nimport DateInput from '../internal/components/date-input';\nimport { getBaseProps } from '../internal/base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name.js';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport { useFocusTracker } from '../internal/hooks/use-focus-tracker.js';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport FocusLock from '../internal/components/focus-lock';\nimport { useDatePicker } from './use-date-picker.js';\n\nexport { DatePickerProps };\n\nconst DatePicker = React.forwardRef(\n (\n {\n locale = '',\n startOfWeek,\n isDateEnabled,\n nextMonthAriaLabel,\n previousMonthAriaLabel,\n todayAriaLabel,\n placeholder = '',\n value = '',\n readOnly = false,\n disabled = false,\n onBlur,\n autoFocus = false,\n onChange,\n onFocus,\n name,\n ariaLabel,\n ariaRequired,\n ariaLabelledby,\n ariaDescribedby,\n controlId,\n invalid,\n openCalendarAriaLabel,\n expandToViewport,\n ...rest\n }: DatePickerProps,\n ref: Ref<DatePickerProps.Ref>\n ) => {\n const { __internalRootRef } = useBaseComponent('DatePicker');\n\n const {\n defaultDisplayedDate,\n displayedDate,\n setDisplayedDate,\n selectedDate,\n onChangeMonthHandler,\n onSelectDateHandler,\n } = useDatePicker({\n value,\n onChange,\n });\n\n const baseProps = getBaseProps(rest);\n const [isDropDownOpen, setIsDropDownOpen] = useState<boolean>(false);\n const normalizedLocale = normalizeLocale('DatePicker', locale ?? '');\n\n const internalInputRef = useRef<HTMLInputElement>(null);\n const buttonRef = useRef<ButtonProps.Ref>(null);\n useForwardFocus(ref, internalInputRef);\n\n const rootRef = useRef<HTMLDivElement>(null);\n const dropdownId = useUniqueId('calender');\n const mergedRef = useMergeRefs(rootRef, __internalRootRef);\n\n useFocusTracker({ rootRef, onBlur, onFocus, viewportId: expandToViewport ? dropdownId : '' });\n\n const onDropdownCloseHandler = useCallback(() => {\n setDisplayedDate(defaultDisplayedDate);\n setIsDropDownOpen(false);\n }, [defaultDisplayedDate, setDisplayedDate, setIsDropDownOpen]);\n\n const onButtonClickHandler = () => {\n if (!isDropDownOpen) {\n setIsDropDownOpen(true);\n }\n };\n\n const onWrapperKeyDownHandler = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (event.keyCode === KeyCode.escape && isDropDownOpen) {\n buttonRef.current?.focus();\n setIsDropDownOpen(false);\n }\n };\n\n const onInputChangeHandler: InputProps['onChange'] = event => {\n const isoDateString = displayToIso(event.detail.value);\n fireNonCancelableEvent(onChange, { value: isoDateString });\n };\n\n const onInputBlurHandler: InputProps['onBlur'] = () => {\n if (!isDropDownOpen) {\n setDisplayedDate(defaultDisplayedDate);\n setIsDropDownOpen(false);\n }\n };\n\n const DateInputElement = (\n <div className={styles['date-picker-trigger']}>\n <div className={styles['date-picker-input']}>\n <DateInput\n name={name}\n invalid={invalid}\n controlId={controlId}\n ariaLabelledby={ariaLabelledby}\n ariaDescribedby={ariaDescribedby}\n ariaLabel={ariaLabel}\n ariaRequired={ariaRequired}\n value={isoToDisplay(value)}\n autoComplete={false}\n disableBrowserAutocorrect={true}\n disableAutocompleteOnBlur={isDropDownOpen}\n disabled={disabled}\n readOnly={readOnly}\n onChange={onInputChangeHandler}\n onBlur={onInputBlurHandler}\n placeholder={placeholder}\n ref={internalInputRef}\n autoFocus={autoFocus}\n />\n </div>\n <div>\n <InternalButton\n iconName=\"calendar\"\n className={styles['open-calendar-button']}\n onClick={onButtonClickHandler}\n ref={buttonRef}\n ariaLabel={\n openCalendarAriaLabel &&\n openCalendarAriaLabel(\n value.length === 10 ? getDateLabel(normalizedLocale, memoizedDate('value', value)) : null\n )\n }\n disabled={disabled || readOnly}\n formAction=\"none\"\n />\n </div>\n </div>\n );\n\n baseProps.className = clsx(baseProps.className, styles.root, styles['date-picker-container']);\n\n if (readOnly || disabled) {\n return <div {...baseProps}>{DateInputElement}</div>;\n }\n\n checkControlled('DatePicker', 'value', value, 'onChange', onChange);\n\n const handleMouseDown = (event: React.MouseEvent) => {\n // prevent currently focused element from losing it\n event.preventDefault();\n };\n\n return (\n <div {...baseProps} ref={mergedRef} onKeyDown={onWrapperKeyDownHandler}>\n <Dropdown\n stretchWidth={true}\n stretchHeight={true}\n open={isDropDownOpen}\n onDropdownClose={onDropdownCloseHandler}\n onMouseDown={handleMouseDown}\n trigger={DateInputElement}\n expandToViewport={expandToViewport}\n scrollable={false}\n dropdownId={dropdownId}\n >\n {isDropDownOpen && (\n <FocusLock autoFocus={true}>\n <Calendar\n selectedDate={memoizedDate('value', selectedDate)}\n displayedDate={memoizedDate('displayed', displayedDate)}\n locale={normalizedLocale}\n startOfWeek={startOfWeek}\n isDateEnabled={isDateEnabled ? isDateEnabled : () => true}\n nextMonthLabel={nextMonthAriaLabel}\n previousMonthLabel={previousMonthAriaLabel}\n todayAriaLabel={todayAriaLabel}\n onChangeMonth={onChangeMonthHandler}\n onSelectDate={e => {\n onSelectDateHandler(e);\n buttonRef?.current?.focus();\n setIsDropDownOpen(false);\n }}\n />\n </FocusLock>\n )}\n </Dropdown>\n </div>\n );\n }\n);\n\napplyDisplayName(DatePicker, 'DatePicker');\nexport default DatePicker;\n"]}
|
|
@@ -2,15 +2,11 @@ import { BaseComponentProps } from '../internal/base-component';
|
|
|
2
2
|
import { FormFieldValidationControlProps } from '../internal/context/form-field-context';
|
|
3
3
|
import { ExpandToViewport } from '../internal/components/dropdown/interfaces';
|
|
4
4
|
import { NonCancelableEventHandler } from '../internal/events';
|
|
5
|
-
export interface
|
|
5
|
+
export interface DatePickerBaseProps {
|
|
6
6
|
/**
|
|
7
7
|
* The current input value, in YYYY-MM-DD format.
|
|
8
8
|
*/
|
|
9
9
|
value: string;
|
|
10
|
-
/**
|
|
11
|
-
* Specifies the placeholder text rendered when the value is an empty string.
|
|
12
|
-
*/
|
|
13
|
-
placeholder?: string;
|
|
14
10
|
/**
|
|
15
11
|
* Defines whether a particular date is enabled in the calendar or not.
|
|
16
12
|
* If you disable a date in the calendar, users can still enter this date using a keyboard.
|
|
@@ -43,6 +39,17 @@ export interface DatePickerProps extends BaseComponentProps, FormFieldValidation
|
|
|
43
39
|
* Specifies an `aria-label` for the 'previous month' button.
|
|
44
40
|
*/
|
|
45
41
|
previousMonthAriaLabel: string;
|
|
42
|
+
/**
|
|
43
|
+
* Called whenever a user changes the input value (by typing, pasting, or selecting a value).
|
|
44
|
+
* The event `detail` contains the current value of the field.
|
|
45
|
+
*/
|
|
46
|
+
onChange?: NonCancelableEventHandler<DatePickerProps.ChangeDetail>;
|
|
47
|
+
}
|
|
48
|
+
export interface DatePickerProps extends BaseComponentProps, FormFieldValidationControlProps, ExpandToViewport, DatePickerBaseProps {
|
|
49
|
+
/**
|
|
50
|
+
* Specifies the placeholder text rendered when the value is an empty string.
|
|
51
|
+
*/
|
|
52
|
+
placeholder?: string;
|
|
46
53
|
/**
|
|
47
54
|
* Specifies a function that generates the `aria-label` for the 'open calendar' button. The `selectedDate` parameter is
|
|
48
55
|
* a human-readable localised string representing the current value of the input.
|
|
@@ -94,11 +101,6 @@ export interface DatePickerProps extends BaseComponentProps, FormFieldValidation
|
|
|
94
101
|
* Called when input focus is removed from the UI control.
|
|
95
102
|
*/
|
|
96
103
|
onBlur?: NonCancelableEventHandler<null>;
|
|
97
|
-
/**
|
|
98
|
-
* Called whenever a user changes the input value (by typing, pasting, or selecting a value).
|
|
99
|
-
* The event `detail` contains the current value of the field.
|
|
100
|
-
*/
|
|
101
|
-
onChange?: NonCancelableEventHandler<DatePickerProps.ChangeDetail>;
|
|
102
104
|
}
|
|
103
105
|
export declare namespace DatePickerProps {
|
|
104
106
|
interface ChangeDetail {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/date-picker/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,+BAA+B,EAAE,MAAM,wCAAwC,CAAC;AACzF,OAAO,EAAE,gBAAgB,EAAE,MAAM,4CAA4C,CAAC;AAC9E,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAE/D,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/date-picker/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,+BAA+B,EAAE,MAAM,wCAAwC,CAAC;AACzF,OAAO,EAAE,gBAAgB,EAAE,MAAM,4CAA4C,CAAC;AAC9E,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAE/D,MAAM,WAAW,mBAAmB;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,eAAe,CAAC,qBAAqB,CAAC;IAEtD;;;;;OAKG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,cAAc,EAAE,MAAM,CAAC;IAEvB;;OAEG;IACH,kBAAkB,EAAE,MAAM,CAAC;IAE3B;;OAEG;IACH,sBAAsB,EAAE,MAAM,CAAC;IAE/B;;;OAGG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC,eAAe,CAAC,YAAY,CAAC,CAAC;CACpE;AAED,MAAM,WAAW,eACf,SAAQ,kBAAkB,EACxB,+BAA+B,EAC/B,gBAAgB,EAChB,mBAAmB;IACrB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,eAAe,CAAC,qBAAqB,CAAC;IAE9D;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;OAEG;IACH,OAAO,CAAC,EAAE,yBAAyB,CAAC,IAAI,CAAC,CAAC;IAE1C;;OAEG;IACH,MAAM,CAAC,EAAE,yBAAyB,CAAC,IAAI,CAAC,CAAC;CAC1C;AAED,yBAAiB,eAAe,CAAC;IAC/B,UAAiB,YAAY;QAC3B;;WAEG;QACH,KAAK,EAAE,MAAM,CAAC;KACf;IAED,UAAiB,qBAAqB;QACpC,CAAC,IAAI,EAAE,IAAI,GAAG,OAAO,CAAC;KACvB;IAED,UAAiB,qBAAqB;QACpC,CAAC,YAAY,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,CAAC;KACvC;IAED,UAAiB,GAAG;QAClB;;WAEG;QACH,KAAK,IAAI,IAAI,CAAC;KACf;CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/date-picker/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\nimport { FormFieldValidationControlProps } from '../internal/context/form-field-context';\nimport { ExpandToViewport } from '../internal/components/dropdown/interfaces';\nimport { NonCancelableEventHandler } from '../internal/events';\n\nexport interface
|
|
1
|
+
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/date-picker/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\nimport { FormFieldValidationControlProps } from '../internal/context/form-field-context';\nimport { ExpandToViewport } from '../internal/components/dropdown/interfaces';\nimport { NonCancelableEventHandler } from '../internal/events';\n\nexport interface DatePickerBaseProps {\n /**\n * The current input value, in YYYY-MM-DD format.\n */\n value: string;\n\n /**\n * Defines whether a particular date is enabled in the calendar or not.\n * If you disable a date in the calendar, users can still enter this date using a keyboard.\n * We recommend that you also validate these constraints on the client-side and server-side\n * as you would for other form elements.\n * @param date\n */\n isDateEnabled?: DatePickerProps.IsDateEnabledFunction;\n\n /**\n * Specifies the locale to use to render month names and determine the starting day of the week.\n * If you don't provide this, the locale is determined by the page and browser locales.\n * Supported values and formats are listed in the\n * [JavaScript Intl API specification](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#Locale_identification_and_negotiation).\n */\n locale?: string;\n\n /**\n * Determines the starting day of the week. The values 0-6 map to Sunday-Saturday.\n * By default the starting day of the week is defined by the locale, but you can use this property to override it.\n */\n startOfWeek?: number;\n\n /**\n * Used as part of the `aria-label` for today's date in the calendar.\n */\n todayAriaLabel: string;\n\n /**\n * Specifies an `aria-label` for the 'next month' button.\n */\n nextMonthAriaLabel: string;\n\n /**\n * Specifies an `aria-label` for the 'previous month' button.\n */\n previousMonthAriaLabel: string;\n\n /**\n * Called whenever a user changes the input value (by typing, pasting, or selecting a value).\n * The event `detail` contains the current value of the field.\n */\n onChange?: NonCancelableEventHandler<DatePickerProps.ChangeDetail>;\n}\n\nexport interface DatePickerProps\n extends BaseComponentProps,\n FormFieldValidationControlProps,\n ExpandToViewport,\n DatePickerBaseProps {\n /**\n * Specifies the placeholder text rendered when the value is an empty string.\n */\n placeholder?: string;\n\n /**\n * Specifies a function that generates the `aria-label` for the 'open calendar' button. The `selectedDate` parameter is\n * a human-readable localised string representing the current value of the input.\n * (for example, ``selectedDate => 'Choose Date' + (selectedDate ? `, selected date is ${selectedDate}` : '')``)\n */\n openCalendarAriaLabel?: DatePickerProps.OpenCalendarAriaLabel;\n\n /**\n * Specifies the name of the control used in HTML forms.\n */\n name?: string;\n\n /**\n * Specifies if the control is disabled, which prevents the\n * user from modifying the value and prevents the value from\n * being included in a form submission. A disabled control can't\n * receive focus.\n */\n disabled?: boolean;\n\n /**\n * Specifies if the control is read only, which prevents the\n * user from modifying the value but includes it in a form\n * submission. A read-only control can receive focus.\n *\n * Do not use read-only inputs outside of a form.\n */\n readOnly?: boolean;\n\n /**\n * Indicates whether the control should be focused as\n * soon as the page loads, which enables the user to\n * start typing without having to manually focus the control. Don't\n * use this option on pages where the control may be\n * scrolled out of the viewport.\n */\n autoFocus?: boolean;\n\n /**\n * Adds an `aria-label` to the native control.\n *\n * Use this if you don't have a visible label for this control.\n */\n ariaLabel?: string;\n\n /**\n * Specifies whether to add `aria-required` to the native control.\n */\n ariaRequired?: boolean;\n\n /**\n * Called when input focus is moved to the UI control.\n */\n onFocus?: NonCancelableEventHandler<null>;\n\n /**\n * Called when input focus is removed from the UI control.\n */\n onBlur?: NonCancelableEventHandler<null>;\n}\n\nexport namespace DatePickerProps {\n export interface ChangeDetail {\n /**\n * The new value of this date-picker.\n */\n value: string;\n }\n\n export interface IsDateEnabledFunction {\n (date: Date): boolean;\n }\n\n export interface OpenCalendarAriaLabel {\n (selectedDate: string | null): string;\n }\n\n export interface Ref {\n /**\n * Sets the browser focus on the UI control\n */\n focus(): void;\n }\n}\n"]}
|
|
@@ -134,7 +134,6 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
134
134
|
font-stretch: normal;
|
|
135
135
|
line-height: normal;
|
|
136
136
|
-webkit-hyphens: none;
|
|
137
|
-
-ms-hyphens: none;
|
|
138
137
|
hyphens: none;
|
|
139
138
|
letter-spacing: normal;
|
|
140
139
|
list-style: disc outside none;
|
|
@@ -198,7 +197,6 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
198
197
|
font-stretch: normal;
|
|
199
198
|
line-height: normal;
|
|
200
199
|
-webkit-hyphens: none;
|
|
201
|
-
-ms-hyphens: none;
|
|
202
200
|
hyphens: none;
|
|
203
201
|
letter-spacing: normal;
|
|
204
202
|
list-style: disc outside none;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { CalendarTypes } from './calendar/definitions';
|
|
2
|
+
import { NonCancelableEventHandler } from '../internal/events';
|
|
3
|
+
import { DatePickerProps } from './interfaces';
|
|
4
|
+
export declare function useDatePicker({ value, onChange }: UseDatePickerProps): {
|
|
5
|
+
defaultDisplayedDate: string;
|
|
6
|
+
displayedDate: string;
|
|
7
|
+
setDisplayedDate: import("react").Dispatch<import("react").SetStateAction<string>>;
|
|
8
|
+
selectedDate: string | null;
|
|
9
|
+
setSelectedDate: import("react").Dispatch<import("react").SetStateAction<string | null>>;
|
|
10
|
+
onChangeMonthHandler: (newMonth: Date) => void;
|
|
11
|
+
onSelectDateHandler: ({ date }: CalendarTypes.DateDetail) => void;
|
|
12
|
+
};
|
|
13
|
+
export interface UseDatePickerProps {
|
|
14
|
+
value: string;
|
|
15
|
+
onChange: NonCancelableEventHandler<DatePickerProps.ChangeDetail> | undefined;
|
|
16
|
+
}
|
|
17
|
+
//# sourceMappingURL=use-date-picker.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-date-picker.d.ts","sourceRoot":"","sources":["../../../src/date-picker/use-date-picker.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAGvD,OAAO,EAA0B,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AACvF,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAE/C,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,kBAAkB;;;;;;qCAO3B,IAAI;oCAIL,cAAc,UAAU;EAgChE;AAED,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,yBAAyB,CAAC,eAAe,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC;CAC/E"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import { formatDate } from './calendar/utils/date';
|
|
5
|
+
import { usePrevious } from '../internal/hooks/use-previous';
|
|
6
|
+
import { fireNonCancelableEvent } from '../internal/events';
|
|
7
|
+
export function useDatePicker(_a) {
|
|
8
|
+
var value = _a.value, onChange = _a.onChange;
|
|
9
|
+
var defaultSelectedDate = value.length >= 10 ? value : null;
|
|
10
|
+
var _b = useState(defaultSelectedDate), selectedDate = _b[0], setSelectedDate = _b[1];
|
|
11
|
+
var defaultDisplayedDate = value.length >= 10 ? value : formatDate(new Date());
|
|
12
|
+
var _c = useState(defaultDisplayedDate), displayedDate = _c[0], setDisplayedDate = _c[1];
|
|
13
|
+
var onChangeMonthHandler = function (newMonth) {
|
|
14
|
+
setDisplayedDate(formatDate(newMonth));
|
|
15
|
+
};
|
|
16
|
+
var onSelectDateHandler = function (_a) {
|
|
17
|
+
var date = _a.date;
|
|
18
|
+
var formattedDate = formatDate(date);
|
|
19
|
+
setSelectedDate(formattedDate);
|
|
20
|
+
setDisplayedDate(formattedDate);
|
|
21
|
+
fireNonCancelableEvent(onChange, { value: formattedDate });
|
|
22
|
+
};
|
|
23
|
+
var prevValue = usePrevious(value);
|
|
24
|
+
if (prevValue !== value) {
|
|
25
|
+
if (value === '' && selectedDate !== value) {
|
|
26
|
+
setSelectedDate(value);
|
|
27
|
+
}
|
|
28
|
+
// update the displayedDate when inputValue changes in order to
|
|
29
|
+
// display the correct month when the date picker gets open again.
|
|
30
|
+
if (value.length >= 4 && displayedDate !== value) {
|
|
31
|
+
setDisplayedDate(value);
|
|
32
|
+
}
|
|
33
|
+
// set the selected date only when a full date (yyyy-mm-dd) is entered
|
|
34
|
+
if (value.length >= 10 && selectedDate !== value) {
|
|
35
|
+
setSelectedDate(value);
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
return {
|
|
39
|
+
defaultDisplayedDate: defaultDisplayedDate,
|
|
40
|
+
displayedDate: displayedDate,
|
|
41
|
+
setDisplayedDate: setDisplayedDate,
|
|
42
|
+
selectedDate: selectedDate,
|
|
43
|
+
setSelectedDate: setSelectedDate,
|
|
44
|
+
onChangeMonthHandler: onChangeMonthHandler,
|
|
45
|
+
onSelectDateHandler: onSelectDateHandler
|
|
46
|
+
};
|
|
47
|
+
}
|
|
48
|
+
//# sourceMappingURL=use-date-picker.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-date-picker.js","sourceRoot":"","sources":["../../../src/date-picker/use-date-picker.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7D,OAAO,EAAE,sBAAsB,EAA6B,MAAM,oBAAoB,CAAC;AAGvF,MAAM,UAAU,aAAa,CAAC,EAAuC;QAArC,KAAK,WAAA,EAAE,QAAQ,cAAA;IAC7C,IAAM,mBAAmB,GAAG,KAAK,CAAC,MAAM,IAAI,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC;IACxD,IAAA,KAAkC,QAAQ,CAAgB,mBAAmB,CAAC,EAA7E,YAAY,QAAA,EAAE,eAAe,QAAgD,CAAC;IAErF,IAAM,oBAAoB,GAAG,KAAK,CAAC,MAAM,IAAI,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC;IAC3E,IAAA,KAAoC,QAAQ,CAAS,oBAAoB,CAAC,EAAzE,aAAa,QAAA,EAAE,gBAAgB,QAA0C,CAAC;IAEjF,IAAM,oBAAoB,GAAG,UAAC,QAAc;QAC1C,gBAAgB,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC;IACzC,CAAC,CAAC;IAEF,IAAM,mBAAmB,GAAG,UAAC,EAAkC;YAAhC,IAAI,UAAA;QACjC,IAAM,aAAa,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC;QACvC,eAAe,CAAC,aAAa,CAAC,CAAC;QAC/B,gBAAgB,CAAC,aAAa,CAAC,CAAC;QAChC,sBAAsB,CAAC,QAAQ,EAAE,EAAE,KAAK,EAAE,aAAa,EAAE,CAAC,CAAC;IAC7D,CAAC,CAAC;IAEF,IAAM,SAAS,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;IACrC,IAAI,SAAS,KAAK,KAAK,EAAE;QACvB,IAAI,KAAK,KAAK,EAAE,IAAI,YAAY,KAAK,KAAK,EAAE;YAC1C,eAAe,CAAC,KAAK,CAAC,CAAC;SACxB;QACD,+DAA+D;QAC/D,kEAAkE;QAClE,IAAI,KAAK,CAAC,MAAM,IAAI,CAAC,IAAI,aAAa,KAAK,KAAK,EAAE;YAChD,gBAAgB,CAAC,KAAK,CAAC,CAAC;SACzB;QACD,sEAAsE;QACtE,IAAI,KAAK,CAAC,MAAM,IAAI,EAAE,IAAI,YAAY,KAAK,KAAK,EAAE;YAChD,eAAe,CAAC,KAAK,CAAC,CAAC;SACxB;KACF;IAED,OAAO;QACL,oBAAoB,sBAAA;QACpB,aAAa,eAAA;QACb,gBAAgB,kBAAA;QAChB,YAAY,cAAA;QACZ,eAAe,iBAAA;QACf,oBAAoB,sBAAA;QACpB,mBAAmB,qBAAA;KACpB,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { useState } from 'react';\nimport { CalendarTypes } from './calendar/definitions';\nimport { formatDate } from './calendar/utils/date';\nimport { usePrevious } from '../internal/hooks/use-previous';\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../internal/events';\nimport { DatePickerProps } from './interfaces';\n\nexport function useDatePicker({ value, onChange }: UseDatePickerProps) {\n const defaultSelectedDate = value.length >= 10 ? value : null;\n const [selectedDate, setSelectedDate] = useState<string | null>(defaultSelectedDate);\n\n const defaultDisplayedDate = value.length >= 10 ? value : formatDate(new Date());\n const [displayedDate, setDisplayedDate] = useState<string>(defaultDisplayedDate);\n\n const onChangeMonthHandler = (newMonth: Date) => {\n setDisplayedDate(formatDate(newMonth));\n };\n\n const onSelectDateHandler = ({ date }: CalendarTypes.DateDetail) => {\n const formattedDate = formatDate(date);\n setSelectedDate(formattedDate);\n setDisplayedDate(formattedDate);\n fireNonCancelableEvent(onChange, { value: formattedDate });\n };\n\n const prevValue = usePrevious(value);\n if (prevValue !== value) {\n if (value === '' && selectedDate !== value) {\n setSelectedDate(value);\n }\n // update the displayedDate when inputValue changes in order to\n // display the correct month when the date picker gets open again.\n if (value.length >= 4 && displayedDate !== value) {\n setDisplayedDate(value);\n }\n // set the selected date only when a full date (yyyy-mm-dd) is entered\n if (value.length >= 10 && selectedDate !== value) {\n setSelectedDate(value);\n }\n }\n\n return {\n defaultDisplayedDate,\n displayedDate,\n setDisplayedDate,\n selectedDate,\n setSelectedDate,\n onChangeMonthHandler,\n onSelectDateHandler,\n };\n}\n\nexport interface UseDatePickerProps {\n value: string;\n onChange: NonCancelableEventHandler<DatePickerProps.ChangeDetail> | undefined;\n}\n"]}
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
interface HeaderButtonProps {
|
|
2
2
|
ariaLabel: string;
|
|
3
3
|
isPrevious: boolean;
|
|
4
|
-
focusable: boolean;
|
|
5
4
|
onChangeMonth: (isPrevious: boolean) => void;
|
|
6
5
|
}
|
|
7
|
-
declare const HeaderButton: ({ ariaLabel, isPrevious, onChangeMonth
|
|
6
|
+
declare const HeaderButton: ({ ariaLabel, isPrevious, onChangeMonth }: HeaderButtonProps) => JSX.Element;
|
|
8
7
|
export default HeaderButton;
|
|
9
8
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/date-range-picker/calendar/header/button/index.tsx"],"names":[],"mappings":"AAMA,UAAU,iBAAiB;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,OAAO,CAAC;IACpB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/date-range-picker/calendar/header/button/index.tsx"],"names":[],"mappings":"AAMA,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,gBAkBhF,CAAC;AAEF,eAAe,YAAY,CAAC"}
|
|
@@ -5,11 +5,10 @@ import React from 'react';
|
|
|
5
5
|
import { InternalButton } from '../../../../button/internal';
|
|
6
6
|
import styles from '../../../styles.css.js';
|
|
7
7
|
var HeaderButton = function (_a) {
|
|
8
|
-
var ariaLabel = _a.ariaLabel, isPrevious = _a.isPrevious, onChangeMonth = _a.onChangeMonth
|
|
8
|
+
var ariaLabel = _a.ariaLabel, isPrevious = _a.isPrevious, onChangeMonth = _a.onChangeMonth;
|
|
9
9
|
var iconName = isPrevious ? 'angle-left' : 'angle-right';
|
|
10
10
|
var additionalAttributes = {
|
|
11
|
-
className: isPrevious ? styles['calendar-prev-month-btn'] : styles['calendar-next-month-btn']
|
|
12
|
-
tabIndex: focusable ? 0 : -1
|
|
11
|
+
className: isPrevious ? styles['calendar-prev-month-btn'] : styles['calendar-next-month-btn']
|
|
13
12
|
};
|
|
14
13
|
var onClick = function () { return onChangeMonth(isPrevious); };
|
|
15
14
|
return (React.createElement(InternalButton, __assign({}, additionalAttributes, { iconName: iconName, ariaLabel: ariaLabel, variant: 'icon', onClick: onClick, formAction: "none" })));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/date-range-picker/calendar/header/button/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,MAAM,MAAM,wBAAwB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/date-range-picker/calendar/header/button/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,MAAM,MAAM,wBAAwB,CAAC;AAQ5C,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,GAAG,cAAM,OAAA,aAAa,CAAC,UAAU,CAAC,EAAzB,CAAyB,CAAC;IAEhD,OAAO,CACL,oBAAC,cAAc,eACT,oBAAoB,IACxB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,MAAM,EACf,OAAO,EAAE,OAAO,EAChB,UAAU,EAAC,MAAM,IACjB,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 { 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 = () => onChangeMonth(isPrevious);\n\n return (\n <InternalButton\n {...additionalAttributes}\n iconName={iconName}\n ariaLabel={ariaLabel}\n variant={'icon'}\n onClick={onClick}\n formAction=\"none\"\n />\n );\n};\n\nexport default HeaderButton;\n"]}
|
|
@@ -4,9 +4,8 @@ interface CalendarHeaderProps {
|
|
|
4
4
|
onChangeMonth: (prev?: boolean) => void;
|
|
5
5
|
previousMonthLabel: string;
|
|
6
6
|
nextMonthLabel: string;
|
|
7
|
-
calendarHasFocus: boolean;
|
|
8
7
|
isSingleGrid: boolean;
|
|
9
8
|
}
|
|
10
|
-
declare const CalendarHeader: ({ baseDate, locale, onChangeMonth, previousMonthLabel, nextMonthLabel,
|
|
9
|
+
declare const CalendarHeader: ({ baseDate, locale, onChangeMonth, previousMonthLabel, nextMonthLabel, isSingleGrid, }: CalendarHeaderProps) => JSX.Element;
|
|
11
10
|
export default CalendarHeader;
|
|
12
11
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/header/index.tsx"],"names":[],"mappings":"AAQA,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;IACvB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/header/index.tsx"],"names":[],"mappings":"AAQA,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;IACvB,YAAY,EAAE,OAAO,CAAC;CACvB;AAED,QAAA,MAAM,cAAc,2FAOjB,mBAAmB,gBAerB,CAAC;AAEF,eAAe,cAAc,CAAC"}
|