@cloudscape-design/components 3.0.17 → 3.0.18
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../src/date-range-picker/dropdown.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,oBAAoB,EAAa,MAAM,cAAc,CAAC;AAC/D,OAAiB,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAiChD,MAAM,WAAW,4BACf,SAAQ,IAAI,CACV,QAAQ,CAAC,oBAAoB,CAAC,EAC5B,QAAQ,GACR,eAAe,GACf,cAAc,GACd,OAAO,GACP,iBAAiB,GACjB,iBAAiB,GACjB,aAAa,GACb,UAAU,GACV,iBAAiB,GACjB,mBAAmB,CACtB;IACD,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,EAAE,CAAC,KAAK,EAAE,IAAI,GAAG,oBAAoB,CAAC,KAAK,KAAK,oBAAoB,CAAC,gBAAgB,CAAC;IAC7F,WAAW,EAAE,QAAQ,CAAC;IACtB,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,YAAY,EAAE,OAAO,CAAC;IAEtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAmBD,wBAAgB,uBAAuB,CAAC,EACtC,MAAW,EACX,WAAW,EACX,aAAa,EACb,YAAY,EACZ,KAAK,EACL,OAAO,EAAE,UAAU,EACnB,OAAO,EAAE,UAAU,EACnB,eAAe,EACf,eAAe,EACf,eAAe,EACf,YAAY,EACZ,WAAW,EACX,QAAQ,EACR,eAAe,EACf,iBAAiB,EACjB,cAAc,EACd,eAAe,GAChB,EAAE,4BAA4B,
|
|
1
|
+
{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../src/date-range-picker/dropdown.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,oBAAoB,EAAa,MAAM,cAAc,CAAC;AAC/D,OAAiB,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAiChD,MAAM,WAAW,4BACf,SAAQ,IAAI,CACV,QAAQ,CAAC,oBAAoB,CAAC,EAC5B,QAAQ,GACR,eAAe,GACf,cAAc,GACd,OAAO,GACP,iBAAiB,GACjB,iBAAiB,GACjB,aAAa,GACb,UAAU,GACV,iBAAiB,GACjB,mBAAmB,CACtB;IACD,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,EAAE,CAAC,KAAK,EAAE,IAAI,GAAG,oBAAoB,CAAC,KAAK,KAAK,oBAAoB,CAAC,gBAAgB,CAAC;IAC7F,WAAW,EAAE,QAAQ,CAAC;IACtB,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,YAAY,EAAE,OAAO,CAAC;IAEtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAmBD,wBAAgB,uBAAuB,CAAC,EACtC,MAAW,EACX,WAAW,EACX,aAAa,EACb,YAAY,EACZ,KAAK,EACL,OAAO,EAAE,UAAU,EACnB,OAAO,EAAE,UAAU,EACnB,eAAe,EACf,eAAe,EACf,eAAe,EACf,YAAY,EACZ,WAAW,EACX,QAAQ,EACR,eAAe,EACf,iBAAiB,EACjB,cAAc,EACd,eAAe,GAChB,EAAE,4BAA4B,eA4L9B"}
|
|
@@ -4,7 +4,7 @@ import { __assign } from "tslib";
|
|
|
4
4
|
import React, { useEffect, useRef, useState } from 'react';
|
|
5
5
|
import Calendar from './calendar';
|
|
6
6
|
import { InternalButton } from '../button/internal';
|
|
7
|
-
import
|
|
7
|
+
import FocusLock from '../internal/components/focus-lock';
|
|
8
8
|
import InternalBox from '../box/internal';
|
|
9
9
|
import SpaceBetween from '../space-between/index.js';
|
|
10
10
|
import styles from './styles.css.js';
|
|
@@ -83,35 +83,34 @@ export function DateRangePickerDropdown(_a) {
|
|
|
83
83
|
};
|
|
84
84
|
useEffect(function () { var _a; return (_a = scrollableContainerRef.current) === null || _a === void 0 ? void 0 : _a.focus(); }, [scrollableContainerRef]);
|
|
85
85
|
return (React.createElement(React.Fragment, null,
|
|
86
|
-
React.createElement(
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
React.createElement(TabTrap, { focusNextCallback: function () { var _a; return (_a = scrollableContainerRef.current) === null || _a === void 0 ? void 0 : _a.focus(); } })))));
|
|
86
|
+
React.createElement(FocusLock, { autoFocus: true },
|
|
87
|
+
React.createElement("div", __assign({}, focusVisible, { ref: scrollableContainerRef, className: styles.dropdown, tabIndex: 0, role: "dialog", "aria-modal": "true", "aria-label": i18nStrings.ariaLabel, "aria-labelledby": ariaLabelledby !== null && ariaLabelledby !== void 0 ? ariaLabelledby : i18nStrings.ariaLabelledby, "aria-describedby": ariaDescribedby !== null && ariaDescribedby !== void 0 ? ariaDescribedby : i18nStrings.ariaDescribedby }),
|
|
88
|
+
React.createElement("div", { className: clsx(styles['dropdown-content'], (_b = {},
|
|
89
|
+
_b[styles['one-grid']] = isSingleGrid,
|
|
90
|
+
_b)) },
|
|
91
|
+
React.createElement(SpaceBetween, { size: "l" },
|
|
92
|
+
React.createElement(InternalBox, { padding: { top: 'm', horizontal: 'l' } },
|
|
93
|
+
React.createElement(SpaceBetween, { direction: "vertical", size: "s" },
|
|
94
|
+
rangeSelectorMode === 'default' && (React.createElement(ModeSwitcher, { ref: focusRefs["default"], mode: rangeSelectionMode, onChange: function (mode) {
|
|
95
|
+
setRangeSelectionMode(mode);
|
|
96
|
+
setApplyClicked(false);
|
|
97
|
+
setValidationResult(VALID_RANGE);
|
|
98
|
+
}, i18nStrings: i18nStrings })),
|
|
99
|
+
rangeSelectionMode === 'absolute' && (React.createElement(Calendar, { ref: focusRefs['absolute-only'], isSingleGrid: isSingleGrid, initialEndDate: selectedAbsoluteRange === null || selectedAbsoluteRange === void 0 ? void 0 : selectedAbsoluteRange.endDate, initialStartDate: selectedAbsoluteRange === null || selectedAbsoluteRange === void 0 ? void 0 : selectedAbsoluteRange.startDate, locale: locale, startOfWeek: startOfWeek, isDateEnabled: isDateEnabled, i18nStrings: i18nStrings, onSelectDateRange: setSelectedAbsoluteRange, dateOnly: dateOnly, timeInputFormat: timeInputFormat })),
|
|
100
|
+
rangeSelectionMode === 'relative' && (React.createElement(RelativeRangePicker, { ref: focusRefs['relative-only'], isSingleGrid: isSingleGrid, options: relativeOptions, dateOnly: dateOnly, initialSelection: selectedRelativeRange, onChange: function (range) { return setSelectedRelativeRange(range); }, i18nStrings: i18nStrings }))),
|
|
101
|
+
React.createElement(InternalBox, { className: styles['validation-section'], margin: !validationResult.valid ? { top: 's' } : undefined }, !validationResult.valid && (React.createElement(React.Fragment, null,
|
|
102
|
+
React.createElement(InternalAlert, { type: "error" },
|
|
103
|
+
React.createElement("span", { className: styles['validation-error'] }, validationResult.errorMessage)),
|
|
104
|
+
React.createElement(LiveRegion, null, validationResult.errorMessage))))),
|
|
105
|
+
React.createElement("div", { className: clsx(styles.footer, (_c = {},
|
|
106
|
+
_c[styles['one-grid']] = isSingleGrid,
|
|
107
|
+
_c[styles['has-clear-button']] = showClearButton,
|
|
108
|
+
_c)) },
|
|
109
|
+
showClearButton && (React.createElement("div", { className: styles['footer-button-wrapper'] },
|
|
110
|
+
React.createElement(InternalButton, { onClick: onClear, className: styles['clear-button'], variant: "link", formAction: "none" }, i18nStrings.clearButtonLabel))),
|
|
111
|
+
React.createElement("div", { className: styles['footer-button-wrapper'] },
|
|
112
|
+
React.createElement(SpaceBetween, { size: "xs", direction: "horizontal" },
|
|
113
|
+
React.createElement(InternalButton, { onClick: closeDropdown, className: styles['cancel-button'], variant: "link", formAction: "none" }, i18nStrings.cancelButtonLabel),
|
|
114
|
+
React.createElement(InternalButton, { onClick: onApply, className: styles['apply-button'], ref: applyButtonRef, formAction: "none" }, i18nStrings.applyButtonLabel))))))))));
|
|
116
115
|
}
|
|
117
116
|
//# sourceMappingURL=dropdown.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../src/date-range-picker/dropdown.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, { useEffect, useRef, useState } from 'react';\nimport { DateRangePickerProps, Focusable } from './interfaces';\nimport Calendar, { DayIndex } from './calendar';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\nimport TabTrap from '../internal/components/tab-trap';\nimport InternalBox from '../box/internal';\nimport SpaceBetween from '../space-between/index.js';\n\nimport styles from './styles.css.js';\nimport RelativeRangePicker from './relative-range';\nimport ModeSwitcher from './mode-switcher';\nimport clsx from 'clsx';\nimport InternalAlert from '../alert/internal';\nimport LiveRegion from '../internal/components/live-region';\nimport useFocusVisible from '../internal/hooks/focus-visible';\n\nconst VALID_RANGE: DateRangePickerProps.ValidRangeResult = { valid: true };\n\n/**\n * This function fills in a start and end time if they are missing.\n */\nfunction fillMissingTime(value: DateRangePickerProps.AbsoluteValue | null) {\n if (!value) {\n return value;\n }\n const [startDate, startTime] = value.startDate.split('T');\n const [endDate, endTime] = value.endDate.split('T');\n return {\n ...value,\n startDate: startTime ? value.startDate : `${startDate}T00:00:00`,\n endDate: endTime ? value.endDate : `${endDate}T23:59:59`,\n };\n}\n\nexport interface DateRangePickerDropdownProps\n extends Pick<\n Required<DateRangePickerProps>,\n | 'locale'\n | 'isDateEnabled'\n | 'isValidRange'\n | 'value'\n | 'relativeOptions'\n | 'showClearButton'\n | 'i18nStrings'\n | 'dateOnly'\n | 'timeInputFormat'\n | 'rangeSelectorMode'\n > {\n onClear: () => void;\n onApply: (value: null | DateRangePickerProps.Value) => DateRangePickerProps.ValidationResult;\n startOfWeek: DayIndex;\n onDropdownClose: () => void;\n isSingleGrid: boolean;\n\n ariaLabelledby?: string;\n ariaDescribedby?: string;\n}\n\nfunction getDefaultMode(\n value: null | DateRangePickerProps.Value,\n relativeOptions: readonly DateRangePickerProps.RelativeOption[],\n rangeSelectorMode: DateRangePickerProps.RangeSelectorMode\n) {\n if (value && value.type) {\n return value.type;\n }\n if (rangeSelectorMode === 'relative-only') {\n return 'relative';\n }\n if (rangeSelectorMode === 'absolute-only') {\n return 'absolute';\n }\n return relativeOptions.length > 0 ? 'relative' : 'absolute';\n}\n\nexport function DateRangePickerDropdown({\n locale = '',\n startOfWeek,\n isDateEnabled,\n isValidRange,\n value,\n onClear: clearValue,\n onApply: applyValue,\n onDropdownClose,\n relativeOptions,\n showClearButton,\n isSingleGrid,\n i18nStrings,\n dateOnly,\n timeInputFormat,\n rangeSelectorMode,\n ariaLabelledby,\n ariaDescribedby,\n}: DateRangePickerDropdownProps) {\n const focusVisible = useFocusVisible();\n const scrollableContainerRef = useRef<HTMLDivElement | null>(null);\n const applyButtonRef = useRef<ButtonProps.Ref>(null);\n\n const [rangeSelectionMode, setRangeSelectionMode] = useState<'absolute' | 'relative'>(\n getDefaultMode(value, relativeOptions, rangeSelectorMode)\n );\n\n const [selectedAbsoluteRange, setSelectedAbsoluteRange] = useState<DateRangePickerProps.AbsoluteValue | null>(\n value?.type === 'absolute' ? value : null\n );\n\n const [selectedRelativeRange, setSelectedRelativeRange] = useState<DateRangePickerProps.RelativeValue | null>(\n value?.type === 'relative' ? value : null\n );\n\n const [applyClicked, setApplyClicked] = useState<boolean>(false);\n\n const [validationResult, setValidationResult] = useState<\n DateRangePickerProps.ValidRangeResult | DateRangePickerProps.InvalidRangeResult\n >(VALID_RANGE);\n\n const closeDropdown = () => {\n setApplyClicked(false);\n onDropdownClose();\n };\n\n const onClear = () => {\n closeDropdown();\n clearValue();\n };\n\n const onApply = () => {\n const newValue = rangeSelectionMode === 'relative' ? selectedRelativeRange : fillMissingTime(selectedAbsoluteRange);\n const newValidationResult = applyValue(newValue);\n if (newValidationResult.valid === false) {\n setApplyClicked(true);\n setValidationResult(newValidationResult);\n } else {\n setApplyClicked(false);\n closeDropdown();\n }\n };\n\n useEffect(() => {\n if (applyClicked) {\n const visibleRange =\n rangeSelectionMode === 'relative' ? selectedRelativeRange : fillMissingTime(selectedAbsoluteRange);\n\n const newValidationResult = isValidRange(visibleRange);\n setValidationResult(newValidationResult || VALID_RANGE);\n }\n }, [applyClicked, isValidRange, rangeSelectionMode, selectedRelativeRange, selectedAbsoluteRange]);\n\n const focusRefs = {\n default: useRef<Focusable>(null),\n 'absolute-only': useRef<Focusable>(null),\n 'relative-only': useRef<Focusable>(null),\n };\n\n useEffect(() => scrollableContainerRef.current?.focus(), [scrollableContainerRef]);\n\n return (\n <>\n <TabTrap focusNextCallback={() => applyButtonRef.current?.focus()} />\n <div\n {...focusVisible}\n ref={scrollableContainerRef}\n className={styles.dropdown}\n tabIndex={0}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={i18nStrings.ariaLabel}\n aria-labelledby={ariaLabelledby ?? i18nStrings.ariaLabelledby}\n aria-describedby={ariaDescribedby ?? i18nStrings.ariaDescribedby}\n >\n <div\n className={clsx(styles['dropdown-content'], {\n [styles['one-grid']]: isSingleGrid,\n })}\n >\n <SpaceBetween size=\"l\">\n <InternalBox padding={{ top: 'm', horizontal: 'l' }}>\n <SpaceBetween direction=\"vertical\" size=\"s\">\n {rangeSelectorMode === 'default' && (\n <ModeSwitcher\n ref={focusRefs.default}\n mode={rangeSelectionMode}\n onChange={(mode: 'absolute' | 'relative') => {\n setRangeSelectionMode(mode);\n setApplyClicked(false);\n setValidationResult(VALID_RANGE);\n }}\n i18nStrings={i18nStrings}\n />\n )}\n\n {rangeSelectionMode === 'absolute' && (\n <Calendar\n ref={focusRefs['absolute-only']}\n isSingleGrid={isSingleGrid}\n initialEndDate={selectedAbsoluteRange?.endDate}\n initialStartDate={selectedAbsoluteRange?.startDate}\n locale={locale}\n startOfWeek={startOfWeek}\n isDateEnabled={isDateEnabled}\n i18nStrings={i18nStrings}\n onSelectDateRange={setSelectedAbsoluteRange}\n dateOnly={dateOnly}\n timeInputFormat={timeInputFormat}\n />\n )}\n\n {rangeSelectionMode === 'relative' && (\n <RelativeRangePicker\n ref={focusRefs['relative-only']}\n isSingleGrid={isSingleGrid}\n options={relativeOptions}\n dateOnly={dateOnly}\n initialSelection={selectedRelativeRange}\n onChange={range => setSelectedRelativeRange(range)}\n i18nStrings={i18nStrings}\n />\n )}\n </SpaceBetween>\n\n <InternalBox\n className={styles['validation-section']}\n margin={!validationResult.valid ? { top: 's' } : undefined}\n >\n {!validationResult.valid && (\n <>\n <InternalAlert type=\"error\">\n <span className={styles['validation-error']}>{validationResult.errorMessage}</span>\n </InternalAlert>\n <LiveRegion>{validationResult.errorMessage}</LiveRegion>\n </>\n )}\n </InternalBox>\n </InternalBox>\n\n <div\n className={clsx(styles.footer, {\n [styles['one-grid']]: isSingleGrid,\n [styles['has-clear-button']]: showClearButton,\n })}\n >\n {showClearButton && (\n <div className={styles['footer-button-wrapper']}>\n <InternalButton onClick={onClear} className={styles['clear-button']} variant=\"link\" formAction=\"none\">\n {i18nStrings.clearButtonLabel}\n </InternalButton>\n </div>\n )}\n <div className={styles['footer-button-wrapper']}>\n <SpaceBetween size=\"xs\" direction=\"horizontal\">\n <InternalButton\n onClick={closeDropdown}\n className={styles['cancel-button']}\n variant=\"link\"\n formAction=\"none\"\n >\n {i18nStrings.cancelButtonLabel}\n </InternalButton>\n\n <InternalButton\n onClick={onApply}\n className={styles['apply-button']}\n ref={applyButtonRef}\n formAction=\"none\"\n >\n {i18nStrings.applyButtonLabel}\n </InternalButton>\n </SpaceBetween>\n </div>\n </div>\n </SpaceBetween>\n\n <TabTrap focusNextCallback={() => scrollableContainerRef.current?.focus()} />\n </div>\n </div>\n </>\n );\n}\n"]}
|
|
1
|
+
{"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../src/date-range-picker/dropdown.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, { useEffect, useRef, useState } from 'react';\nimport { DateRangePickerProps, Focusable } from './interfaces';\nimport Calendar, { DayIndex } from './calendar';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\nimport FocusLock from '../internal/components/focus-lock';\nimport InternalBox from '../box/internal';\nimport SpaceBetween from '../space-between/index.js';\n\nimport styles from './styles.css.js';\nimport RelativeRangePicker from './relative-range';\nimport ModeSwitcher from './mode-switcher';\nimport clsx from 'clsx';\nimport InternalAlert from '../alert/internal';\nimport LiveRegion from '../internal/components/live-region';\nimport useFocusVisible from '../internal/hooks/focus-visible';\n\nconst VALID_RANGE: DateRangePickerProps.ValidRangeResult = { valid: true };\n\n/**\n * This function fills in a start and end time if they are missing.\n */\nfunction fillMissingTime(value: DateRangePickerProps.AbsoluteValue | null) {\n if (!value) {\n return value;\n }\n const [startDate, startTime] = value.startDate.split('T');\n const [endDate, endTime] = value.endDate.split('T');\n return {\n ...value,\n startDate: startTime ? value.startDate : `${startDate}T00:00:00`,\n endDate: endTime ? value.endDate : `${endDate}T23:59:59`,\n };\n}\n\nexport interface DateRangePickerDropdownProps\n extends Pick<\n Required<DateRangePickerProps>,\n | 'locale'\n | 'isDateEnabled'\n | 'isValidRange'\n | 'value'\n | 'relativeOptions'\n | 'showClearButton'\n | 'i18nStrings'\n | 'dateOnly'\n | 'timeInputFormat'\n | 'rangeSelectorMode'\n > {\n onClear: () => void;\n onApply: (value: null | DateRangePickerProps.Value) => DateRangePickerProps.ValidationResult;\n startOfWeek: DayIndex;\n onDropdownClose: () => void;\n isSingleGrid: boolean;\n\n ariaLabelledby?: string;\n ariaDescribedby?: string;\n}\n\nfunction getDefaultMode(\n value: null | DateRangePickerProps.Value,\n relativeOptions: readonly DateRangePickerProps.RelativeOption[],\n rangeSelectorMode: DateRangePickerProps.RangeSelectorMode\n) {\n if (value && value.type) {\n return value.type;\n }\n if (rangeSelectorMode === 'relative-only') {\n return 'relative';\n }\n if (rangeSelectorMode === 'absolute-only') {\n return 'absolute';\n }\n return relativeOptions.length > 0 ? 'relative' : 'absolute';\n}\n\nexport function DateRangePickerDropdown({\n locale = '',\n startOfWeek,\n isDateEnabled,\n isValidRange,\n value,\n onClear: clearValue,\n onApply: applyValue,\n onDropdownClose,\n relativeOptions,\n showClearButton,\n isSingleGrid,\n i18nStrings,\n dateOnly,\n timeInputFormat,\n rangeSelectorMode,\n ariaLabelledby,\n ariaDescribedby,\n}: DateRangePickerDropdownProps) {\n const focusVisible = useFocusVisible();\n const scrollableContainerRef = useRef<HTMLDivElement | null>(null);\n const applyButtonRef = useRef<ButtonProps.Ref>(null);\n\n const [rangeSelectionMode, setRangeSelectionMode] = useState<'absolute' | 'relative'>(\n getDefaultMode(value, relativeOptions, rangeSelectorMode)\n );\n\n const [selectedAbsoluteRange, setSelectedAbsoluteRange] = useState<DateRangePickerProps.AbsoluteValue | null>(\n value?.type === 'absolute' ? value : null\n );\n\n const [selectedRelativeRange, setSelectedRelativeRange] = useState<DateRangePickerProps.RelativeValue | null>(\n value?.type === 'relative' ? value : null\n );\n\n const [applyClicked, setApplyClicked] = useState<boolean>(false);\n\n const [validationResult, setValidationResult] = useState<\n DateRangePickerProps.ValidRangeResult | DateRangePickerProps.InvalidRangeResult\n >(VALID_RANGE);\n\n const closeDropdown = () => {\n setApplyClicked(false);\n onDropdownClose();\n };\n\n const onClear = () => {\n closeDropdown();\n clearValue();\n };\n\n const onApply = () => {\n const newValue = rangeSelectionMode === 'relative' ? selectedRelativeRange : fillMissingTime(selectedAbsoluteRange);\n const newValidationResult = applyValue(newValue);\n if (newValidationResult.valid === false) {\n setApplyClicked(true);\n setValidationResult(newValidationResult);\n } else {\n setApplyClicked(false);\n closeDropdown();\n }\n };\n\n useEffect(() => {\n if (applyClicked) {\n const visibleRange =\n rangeSelectionMode === 'relative' ? selectedRelativeRange : fillMissingTime(selectedAbsoluteRange);\n\n const newValidationResult = isValidRange(visibleRange);\n setValidationResult(newValidationResult || VALID_RANGE);\n }\n }, [applyClicked, isValidRange, rangeSelectionMode, selectedRelativeRange, selectedAbsoluteRange]);\n\n const focusRefs = {\n default: useRef<Focusable>(null),\n 'absolute-only': useRef<Focusable>(null),\n 'relative-only': useRef<Focusable>(null),\n };\n\n useEffect(() => scrollableContainerRef.current?.focus(), [scrollableContainerRef]);\n\n return (\n <>\n <FocusLock autoFocus={true}>\n <div\n {...focusVisible}\n ref={scrollableContainerRef}\n className={styles.dropdown}\n tabIndex={0}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={i18nStrings.ariaLabel}\n aria-labelledby={ariaLabelledby ?? i18nStrings.ariaLabelledby}\n aria-describedby={ariaDescribedby ?? i18nStrings.ariaDescribedby}\n >\n <div\n className={clsx(styles['dropdown-content'], {\n [styles['one-grid']]: isSingleGrid,\n })}\n >\n <SpaceBetween size=\"l\">\n <InternalBox padding={{ top: 'm', horizontal: 'l' }}>\n <SpaceBetween direction=\"vertical\" size=\"s\">\n {rangeSelectorMode === 'default' && (\n <ModeSwitcher\n ref={focusRefs.default}\n mode={rangeSelectionMode}\n onChange={(mode: 'absolute' | 'relative') => {\n setRangeSelectionMode(mode);\n setApplyClicked(false);\n setValidationResult(VALID_RANGE);\n }}\n i18nStrings={i18nStrings}\n />\n )}\n\n {rangeSelectionMode === 'absolute' && (\n <Calendar\n ref={focusRefs['absolute-only']}\n isSingleGrid={isSingleGrid}\n initialEndDate={selectedAbsoluteRange?.endDate}\n initialStartDate={selectedAbsoluteRange?.startDate}\n locale={locale}\n startOfWeek={startOfWeek}\n isDateEnabled={isDateEnabled}\n i18nStrings={i18nStrings}\n onSelectDateRange={setSelectedAbsoluteRange}\n dateOnly={dateOnly}\n timeInputFormat={timeInputFormat}\n />\n )}\n\n {rangeSelectionMode === 'relative' && (\n <RelativeRangePicker\n ref={focusRefs['relative-only']}\n isSingleGrid={isSingleGrid}\n options={relativeOptions}\n dateOnly={dateOnly}\n initialSelection={selectedRelativeRange}\n onChange={range => setSelectedRelativeRange(range)}\n i18nStrings={i18nStrings}\n />\n )}\n </SpaceBetween>\n\n <InternalBox\n className={styles['validation-section']}\n margin={!validationResult.valid ? { top: 's' } : undefined}\n >\n {!validationResult.valid && (\n <>\n <InternalAlert type=\"error\">\n <span className={styles['validation-error']}>{validationResult.errorMessage}</span>\n </InternalAlert>\n <LiveRegion>{validationResult.errorMessage}</LiveRegion>\n </>\n )}\n </InternalBox>\n </InternalBox>\n\n <div\n className={clsx(styles.footer, {\n [styles['one-grid']]: isSingleGrid,\n [styles['has-clear-button']]: showClearButton,\n })}\n >\n {showClearButton && (\n <div className={styles['footer-button-wrapper']}>\n <InternalButton\n onClick={onClear}\n className={styles['clear-button']}\n variant=\"link\"\n formAction=\"none\"\n >\n {i18nStrings.clearButtonLabel}\n </InternalButton>\n </div>\n )}\n <div className={styles['footer-button-wrapper']}>\n <SpaceBetween size=\"xs\" direction=\"horizontal\">\n <InternalButton\n onClick={closeDropdown}\n className={styles['cancel-button']}\n variant=\"link\"\n formAction=\"none\"\n >\n {i18nStrings.cancelButtonLabel}\n </InternalButton>\n\n <InternalButton\n onClick={onApply}\n className={styles['apply-button']}\n ref={applyButtonRef}\n formAction=\"none\"\n >\n {i18nStrings.applyButtonLabel}\n </InternalButton>\n </SpaceBetween>\n </div>\n </div>\n </SpaceBetween>\n </div>\n </div>\n </FocusLock>\n </>\n );\n}\n"]}
|
package/internal/environment.js
CHANGED