@cloudscape-design/components 3.0.29 → 3.0.30
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/app-layout/visual-refresh/styles.css.js +59 -59
- package/app-layout/visual-refresh/styles.scoped.css +146 -146
- package/app-layout/visual-refresh/styles.selectors.js +59 -59
- package/autosuggest/controller.d.ts +1 -4
- package/autosuggest/controller.d.ts.map +1 -1
- package/autosuggest/controller.js +1 -45
- package/autosuggest/controller.js.map +1 -1
- package/autosuggest/internal.d.ts.map +1 -1
- package/autosuggest/internal.js +16 -23
- package/autosuggest/internal.js.map +1 -1
- package/autosuggest/options-controller.d.ts +22 -0
- package/autosuggest/options-controller.d.ts.map +1 -0
- package/autosuggest/options-controller.js +63 -0
- package/autosuggest/options-controller.js.map +1 -0
- package/autosuggest/options-list.d.ts.map +1 -1
- package/autosuggest/options-list.js +2 -1
- package/autosuggest/options-list.js.map +1 -1
- package/button-dropdown/category-elements/category-element.d.ts +1 -1
- package/button-dropdown/category-elements/category-element.d.ts.map +1 -1
- package/button-dropdown/category-elements/category-element.js +2 -2
- package/button-dropdown/category-elements/category-element.js.map +1 -1
- package/button-dropdown/category-elements/expandable-category-element.d.ts +1 -1
- package/button-dropdown/category-elements/expandable-category-element.d.ts.map +1 -1
- package/button-dropdown/category-elements/expandable-category-element.js +4 -2
- package/button-dropdown/category-elements/expandable-category-element.js.map +1 -1
- package/button-dropdown/category-elements/mobile-expandable-category-element.d.ts +1 -1
- package/button-dropdown/category-elements/mobile-expandable-category-element.d.ts.map +1 -1
- package/button-dropdown/category-elements/mobile-expandable-category-element.js +4 -2
- package/button-dropdown/category-elements/mobile-expandable-category-element.js.map +1 -1
- package/button-dropdown/category-elements/styles.css.js +13 -12
- package/button-dropdown/category-elements/styles.scoped.css +26 -22
- package/button-dropdown/category-elements/styles.selectors.js +13 -12
- package/button-dropdown/interfaces.d.ts +2 -0
- package/button-dropdown/interfaces.d.ts.map +1 -1
- package/button-dropdown/interfaces.js.map +1 -1
- package/button-dropdown/internal.d.ts.map +1 -1
- package/button-dropdown/internal.js +5 -10
- package/button-dropdown/internal.js.map +1 -1
- package/button-dropdown/item-element/index.d.ts +1 -1
- package/button-dropdown/item-element/index.d.ts.map +1 -1
- package/button-dropdown/item-element/index.js +2 -1
- package/button-dropdown/item-element/index.js.map +1 -1
- package/button-dropdown/item-element/styles.css.js +14 -13
- package/button-dropdown/item-element/styles.scoped.css +21 -17
- package/button-dropdown/item-element/styles.selectors.js +14 -13
- package/button-dropdown/items-list.d.ts +1 -1
- package/button-dropdown/items-list.d.ts.map +1 -1
- package/button-dropdown/items-list.js +4 -4
- package/button-dropdown/items-list.js.map +1 -1
- package/button-dropdown/utils/use-button-dropdown.d.ts +2 -2
- package/button-dropdown/utils/use-button-dropdown.d.ts.map +1 -1
- package/button-dropdown/utils/use-button-dropdown.js +7 -5
- package/button-dropdown/utils/use-button-dropdown.js.map +1 -1
- package/button-dropdown/utils/use-highlighted-menu.d.ts +1 -0
- package/button-dropdown/utils/use-highlighted-menu.d.ts.map +1 -1
- package/button-dropdown/utils/use-highlighted-menu.js +11 -3
- package/button-dropdown/utils/use-highlighted-menu.js.map +1 -1
- package/checkbox/styles.css.js +3 -3
- package/checkbox/styles.scoped.css +6 -6
- package/checkbox/styles.selectors.js +3 -3
- package/date-range-picker/dropdown.d.ts +1 -0
- package/date-range-picker/dropdown.d.ts.map +1 -1
- package/date-range-picker/dropdown.js +18 -30
- package/date-range-picker/dropdown.js.map +1 -1
- package/date-range-picker/embedded.d.ts +7 -0
- package/date-range-picker/embedded.d.ts.map +1 -0
- package/date-range-picker/embedded.js +46 -0
- package/date-range-picker/embedded.js.map +1 -0
- package/date-range-picker/index.d.ts.map +1 -1
- package/date-range-picker/index.js +2 -15
- package/date-range-picker/index.js.map +1 -1
- package/date-range-picker/interfaces.d.ts +46 -44
- package/date-range-picker/interfaces.d.ts.map +1 -1
- package/date-range-picker/interfaces.js.map +1 -1
- package/date-range-picker/use-date-range-picker.d.ts +29 -0
- package/date-range-picker/use-date-range-picker.d.ts.map +1 -0
- package/date-range-picker/use-date-range-picker.js +58 -0
- package/date-range-picker/use-date-range-picker.js.map +1 -0
- package/internal/components/abstract-switch/index.d.ts.map +1 -1
- package/internal/components/abstract-switch/index.js +5 -5
- package/internal/components/abstract-switch/index.js.map +1 -1
- package/internal/components/abstract-switch/styles.css.js +11 -11
- package/internal/components/abstract-switch/styles.scoped.css +20 -13
- package/internal/components/abstract-switch/styles.selectors.js +11 -11
- package/internal/environment.js +1 -1
- package/package.json +1 -1
- package/radio-group/styles.css.js +9 -9
- package/radio-group/styles.scoped.css +16 -16
- package/radio-group/styles.selectors.js +9 -9
- package/toggle/internal.d.ts.map +1 -1
- package/toggle/internal.js +3 -1
- package/toggle/internal.js.map +1 -1
- package/toggle/styles.css.js +8 -8
- package/toggle/styles.scoped.css +15 -14
- package/toggle/styles.selectors.js +8 -8
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/date-range-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,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAC1D,OAAO,EAAE,gBAAgB,EAAE,MAAM,4CAA4C,CAAC;AAE9E,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/date-range-picker/interfaces.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/date-range-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 { NonCancelableEventHandler } from '../internal/events';\nimport { TimeInputProps } from '../time-input/interfaces';\nimport { ExpandToViewport } from '../internal/components/dropdown/interfaces';\n\nexport interface DateRangePickerProps extends BaseComponentProps, FormFieldValidationControlProps, ExpandToViewport {\n /**\n * The current date range value. Can be either an absolute time range\n * or a relative time range.\n */\n value: null | DateRangePickerProps.Value;\n\n /**\n * A list of relative time ranges that are shown as suggestions.\n */\n relativeOptions: ReadonlyArray<DateRangePickerProps.RelativeOption>;\n\n /**\n * Specifies the placeholder text that is rendered when the value is empty.\n */\n placeholder?: string;\n\n /**\n * A function that defines whether a particular date should be enabled\n * in the calendar or not. Note that disabling a date in the calendar\n * still allows users to enter this date via keyboard. We therefore\n * recommend that you also validate these constraints client- and\n * server-side, in the same way as for other form elements.\n */\n isDateEnabled?: DateRangePickerProps.IsDateEnabledFunction;\n\n /**\n * The locale to be used for rendering month names and defining the\n * starting date of the week. If not provided, it will be determined\n * from the page and browser locales. Supported values and formats\n * are as-per the [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 * Starting day of the week. [0-6] maps to [Sunday-Saturday].\n * By default the starting day of the week is defined by the locale,\n * but you can override it using this property.\n */\n startOfWeek?: number;\n\n /**\n * Specifies that the component is disabled, preventing the user from\n * modifying the value. A disabled component cannot receive focus.\n */\n disabled?: boolean;\n\n /**\n * Specifies that the component is read-only, preventing the user from\n * modifying the value. A read-only component can receive focus.\n */\n readOnly?: boolean;\n\n /**\n * Fired when keyboard focus is set onto the UI control.\n */\n onFocus?: NonCancelableEventHandler<null>;\n\n /**\n * Fired when keyboard focus is removed from the UI control.\n */\n onBlur?: NonCancelableEventHandler<null>;\n\n /**\n * Fired whenever a user changes the component's value.\n * The event `detail` contains the current value of the field.\n */\n onChange?: NonCancelableEventHandler<DateRangePickerProps.ChangeDetail>;\n\n /**\n * A function that defines whether a particular range is valid or not.\n *\n * Ensure that your function checks for missing fields in the value.\n */\n isValidRange: DateRangePickerProps.ValidationFunction;\n\n /**\n * An object containing all the necessary localized strings required by the component.\n */\n i18nStrings: DateRangePickerProps.I18nStrings;\n\n /**\n * Specifies whether the component should show a button that\n * allows the user to clear the selected value.\n */\n showClearButton?: boolean;\n\n /**\n * Hides time inputs and changes the input format to date-only, e.g. 2021-04-06.\n *\n * Do not use `dateOnly` flag conditionally. The component does not trigger the value update\n * when the flag changes which means the value format can become inconsistent.\n *\n * Default: `false`.\n */\n dateOnly?: boolean;\n\n /**\n * Determines the range selector mode as follows:\n * * `default` for combined absolute/relative range selector.\n * * `absolute-only` for absolute-only range selector.\n * * `relative-only` for relative-only range selector.\n *\n * By default, the range selector mode is `default`.\n */\n rangeSelectorMode?: DateRangePickerProps.RangeSelectorMode;\n\n /**\n * The time offset from UTC in minutes that should be used to\n * display and produce values.\n *\n * Has no effect when `dateOnly` is true.\n *\n * Default: the user's current time offset as provided by the browser.\n */\n timeOffset?: number;\n\n /**\n * Specifies the format of the time input for absolute ranges.\n *\n * Use to restrict the granularity of time that the user can enter.\n *\n * Has no effect when `dateOnly` is true.\n */\n timeInputFormat?: TimeInputProps.Format;\n}\n\nexport namespace DateRangePickerProps {\n export type Value = AbsoluteValue | RelativeValue;\n export interface AbsoluteValue {\n /**\n * In ISO8601 format, e.g.: 2021-04-06T17:23:50+02:00 (or 2021-04-06 when `dateOnly` is true)\n */\n startDate: string;\n /**\n * In ISO8601 format, e.g.: 2021-04-06T17:23:50+02:00 (or 2021-04-06 when `dateOnly` is true)\n */\n endDate: string;\n type: 'absolute';\n }\n\n export interface RelativeValue {\n /**\n * If provided, used to match this value\n * to a provided relative option.\n */\n key?: string;\n amount: number;\n unit: TimeUnit;\n type: 'relative';\n }\n export interface RelativeOption {\n /**\n * Used to uniquely identify this relative option.\n */\n key: string;\n amount: number;\n unit: TimeUnit;\n type: 'relative';\n }\n\n export type TimeUnit = 'second' | 'minute' | 'hour' | 'day' | 'week' | 'month' | 'year';\n\n export type ValidationFunction = (value: Value | null) => ValidationResult;\n\n export type ValidationResult = ValidRangeResult | InvalidRangeResult;\n\n export interface ValidRangeResult {\n valid: true;\n }\n\n export interface InvalidRangeResult {\n valid: false;\n errorMessage: string;\n }\n\n export interface ChangeDetail {\n /**\n * The newly selected range of this date range picker.\n */\n value: null | Value;\n }\n\n export interface IsDateEnabledFunction {\n (date: Date): boolean;\n }\n\n export type RangeSelectorMode = 'default' | 'absolute-only' | 'relative-only';\n\n export interface Ref {\n /**\n * Sets the browser focus on the UI control\n */\n focus(): void;\n }\n\n export interface I18nStrings {\n /**\n * Adds `aria-label` to the trigger and dropdown.\n */\n ariaLabel?: string;\n\n /**\n * Adds `aria-labelledby` to the trigger and dropdown.\n */\n ariaLabelledby?: string;\n\n /**\n * Adds `aria-describedby` to the trigger and dropdown.\n */\n ariaDescribedby?: string;\n\n /**\n * Segment title of the relative range selection mode\n */\n relativeModeTitle: string;\n\n /**\n * Segment title of the absolute range selection mode\n */\n absoluteModeTitle: string;\n\n /**\n * Heading for the relative range selection area\n */\n relativeRangeSelectionHeading: string;\n\n /**\n * Visible label of the Cancel button\n */\n cancelButtonLabel: string;\n /**\n * Visible label of the Clear and dismiss button\n */\n clearButtonLabel: string;\n /**\n * Visible label of the Apply button\n */\n applyButtonLabel: string;\n\n /**\n * Formatting function for relative ranges.\n * This function must convert a relative range to a human-readable string.\n */\n formatRelativeRange: (value: RelativeValue) => string;\n\n /**\n * Formatting function for time units.\n *\n * This function must return a localized form of the unit that fits the provided time value.\n */\n formatUnit: (unit: TimeUnit, value: number) => string;\n\n /**\n * Visible label for the option for selecting\n * a custom relative range.\n */\n customRelativeRangeOptionLabel: string;\n\n /**\n * Visible description for the option for selecting\n * a custom relative range.\n */\n customRelativeRangeOptionDescription: string;\n\n /**\n * Visible label for the duration selector for\n * the custom relative range.\n */\n customRelativeRangeDurationLabel: string;\n /**\n * Placeholder for the duration selector for\n * the custom relative range.\n */\n customRelativeRangeDurationPlaceholder: string;\n /**\n * Visible label for the unit selector for the\n * custom relative range.\n */\n customRelativeRangeUnitLabel: string;\n\n /**\n * Used as part of the aria label for today's date in the calendar.\n */\n todayAriaLabel: string;\n\n /**\n * An aria label for the 'next month' button.\n */\n nextMonthAriaLabel: string;\n\n /**\n * An aria label for the 'previous month' button.\n */\n previousMonthAriaLabel: string;\n\n /**\n * Visible label for the Start Date input for the\n * absolute range.\n */\n startDateLabel: string;\n /**\n * Visible label for the Start Time input for the\n * absolute range.\n */\n startTimeLabel: string;\n /**\n * Visible label for the End Date input for the\n * absolute range.\n */\n endDateLabel: string;\n /**\n * Visible label for the End Time input for the\n * absolute range.\n */\n endTimeLabel: string;\n\n /**\n * Constraint text for the input fields for the\n * absolute range.\n */\n dateTimeConstraintText?: string;\n\n /**\n * When the property is set, screen readers announce the selected range when the absolute range gets selected.\n */\n renderSelectedAbsoluteRangeAriaLive?: (startDate: string, endDate: string) => string;\n }\n}\n\nexport interface Focusable {\n focus(): void;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/date-range-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 { NonCancelableEventHandler } from '../internal/events';\nimport { TimeInputProps } from '../time-input/interfaces';\nimport { ExpandToViewport } from '../internal/components/dropdown/interfaces';\n\nexport interface DateRangePickerBaseProps {\n /**\n * The current date range value. Can be either an absolute time range\n * or a relative time range.\n */\n value: null | DateRangePickerProps.Value;\n\n /**\n * A list of relative time ranges that are shown as suggestions.\n */\n relativeOptions: ReadonlyArray<DateRangePickerProps.RelativeOption>;\n\n /**\n * A function that defines whether a particular date should be enabled\n * in the calendar or not. Note that disabling a date in the calendar\n * still allows users to enter this date via keyboard. We therefore\n * recommend that you also validate these constraints client- and\n * server-side, in the same way as for other form elements.\n */\n isDateEnabled?: DateRangePickerProps.IsDateEnabledFunction;\n\n /**\n * The locale to be used for rendering month names and defining the\n * starting date of the week. If not provided, it will be determined\n * from the page and browser locales. Supported values and formats\n * are as-per the [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 * Starting day of the week. [0-6] maps to [Sunday-Saturday].\n * By default the starting day of the week is defined by the locale,\n * but you can override it using this property.\n */\n startOfWeek?: number;\n\n /**\n * An object containing all the necessary localized strings required by the component.\n */\n i18nStrings: DateRangePickerProps.I18nStrings;\n\n /**\n * Hides time inputs and changes the input format to date-only, e.g. 2021-04-06.\n *\n * Do not use `dateOnly` flag conditionally. The component does not trigger the value update\n * when the flag changes which means the value format can become inconsistent.\n *\n * Default: `false`.\n */\n dateOnly?: boolean;\n\n /**\n * Determines the range selector mode as follows:\n * * `default` for combined absolute/relative range selector.\n * * `absolute-only` for absolute-only range selector.\n * * `relative-only` for relative-only range selector.\n *\n * By default, the range selector mode is `default`.\n */\n rangeSelectorMode?: DateRangePickerProps.RangeSelectorMode;\n\n /**\n * Specifies the format of the time input for absolute ranges.\n *\n * Use to restrict the granularity of time that the user can enter.\n *\n * Has no effect when `dateOnly` is true.\n */\n timeInputFormat?: TimeInputProps.Format;\n\n /**\n * Fired whenever a user changes the component's value.\n * The event `detail` contains the current value of the field.\n */\n onChange?: NonCancelableEventHandler<DateRangePickerProps.ChangeDetail>;\n\n /**\n * The time offset from UTC in minutes that should be used to\n * display and produce values.\n *\n * Has no effect when `dateOnly` is true.\n *\n * Default: the user's current time offset as provided by the browser.\n */\n timeOffset?: number;\n}\nexport interface DateRangePickerProps\n extends BaseComponentProps,\n FormFieldValidationControlProps,\n ExpandToViewport,\n DateRangePickerBaseProps {\n /**\n * Specifies the placeholder text that is rendered when the value is empty.\n */\n placeholder?: string;\n\n /**\n * Specifies that the component is disabled, preventing the user from\n * modifying the value. A disabled component cannot receive focus.\n */\n disabled?: boolean;\n\n /**\n * Specifies that the component is read-only, preventing the user from\n * modifying the value. A read-only component can receive focus.\n */\n readOnly?: boolean;\n\n /**\n * Fired when keyboard focus is set onto the UI control.\n */\n onFocus?: NonCancelableEventHandler<null>;\n\n /**\n * Fired when keyboard focus is removed from the UI control.\n */\n onBlur?: NonCancelableEventHandler<null>;\n\n /**\n * A function that defines whether a particular range is valid or not.\n *\n * Ensure that your function checks for missing fields in the value.\n */\n isValidRange: DateRangePickerProps.ValidationFunction;\n\n /**\n * Specifies whether the component should show a button that\n * allows the user to clear the selected value.\n */\n showClearButton?: boolean;\n}\n\nexport namespace DateRangePickerProps {\n export type Value = AbsoluteValue | RelativeValue;\n export interface AbsoluteValue {\n /**\n * In ISO8601 format, e.g.: 2021-04-06T17:23:50+02:00 (or 2021-04-06 when `dateOnly` is true)\n */\n startDate: string;\n /**\n * In ISO8601 format, e.g.: 2021-04-06T17:23:50+02:00 (or 2021-04-06 when `dateOnly` is true)\n */\n endDate: string;\n type: 'absolute';\n }\n\n export interface RelativeValue {\n /**\n * If provided, used to match this value\n * to a provided relative option.\n */\n key?: string;\n amount: number;\n unit: TimeUnit;\n type: 'relative';\n }\n export interface RelativeOption {\n /**\n * Used to uniquely identify this relative option.\n */\n key: string;\n amount: number;\n unit: TimeUnit;\n type: 'relative';\n }\n\n export type TimeUnit = 'second' | 'minute' | 'hour' | 'day' | 'week' | 'month' | 'year';\n\n export type ValidationFunction = (value: Value | null) => ValidationResult;\n\n export type ValidationResult = ValidRangeResult | InvalidRangeResult;\n\n export interface ValidRangeResult {\n valid: true;\n }\n\n export interface InvalidRangeResult {\n valid: false;\n errorMessage: string;\n }\n\n export interface ChangeDetail {\n /**\n * The newly selected range of this date range picker.\n */\n value: null | Value;\n }\n\n export interface IsDateEnabledFunction {\n (date: Date): boolean;\n }\n\n export type RangeSelectorMode = 'default' | 'absolute-only' | 'relative-only';\n\n export interface Ref {\n /**\n * Sets the browser focus on the UI control\n */\n focus(): void;\n }\n\n export interface I18nStrings {\n /**\n * Adds `aria-label` to the trigger and dropdown.\n */\n ariaLabel?: string;\n\n /**\n * Adds `aria-labelledby` to the trigger and dropdown.\n */\n ariaLabelledby?: string;\n\n /**\n * Adds `aria-describedby` to the trigger and dropdown.\n */\n ariaDescribedby?: string;\n\n /**\n * Segment title of the relative range selection mode\n */\n relativeModeTitle: string;\n\n /**\n * Segment title of the absolute range selection mode\n */\n absoluteModeTitle: string;\n\n /**\n * Heading for the relative range selection area\n */\n relativeRangeSelectionHeading: string;\n\n /**\n * Visible label of the Cancel button\n */\n cancelButtonLabel: string;\n /**\n * Visible label of the Clear and dismiss button\n */\n clearButtonLabel: string;\n /**\n * Visible label of the Apply button\n */\n applyButtonLabel: string;\n\n /**\n * Formatting function for relative ranges.\n * This function must convert a relative range to a human-readable string.\n */\n formatRelativeRange: (value: RelativeValue) => string;\n\n /**\n * Formatting function for time units.\n *\n * This function must return a localized form of the unit that fits the provided time value.\n */\n formatUnit: (unit: TimeUnit, value: number) => string;\n\n /**\n * Visible label for the option for selecting\n * a custom relative range.\n */\n customRelativeRangeOptionLabel: string;\n\n /**\n * Visible description for the option for selecting\n * a custom relative range.\n */\n customRelativeRangeOptionDescription: string;\n\n /**\n * Visible label for the duration selector for\n * the custom relative range.\n */\n customRelativeRangeDurationLabel: string;\n /**\n * Placeholder for the duration selector for\n * the custom relative range.\n */\n customRelativeRangeDurationPlaceholder: string;\n /**\n * Visible label for the unit selector for the\n * custom relative range.\n */\n customRelativeRangeUnitLabel: string;\n\n /**\n * Used as part of the aria label for today's date in the calendar.\n */\n todayAriaLabel: string;\n\n /**\n * An aria label for the 'next month' button.\n */\n nextMonthAriaLabel: string;\n\n /**\n * An aria label for the 'previous month' button.\n */\n previousMonthAriaLabel: string;\n\n /**\n * Visible label for the Start Date input for the\n * absolute range.\n */\n startDateLabel: string;\n /**\n * Visible label for the Start Time input for the\n * absolute range.\n */\n startTimeLabel: string;\n /**\n * Visible label for the End Date input for the\n * absolute range.\n */\n endDateLabel: string;\n /**\n * Visible label for the End Time input for the\n * absolute range.\n */\n endTimeLabel: string;\n\n /**\n * Constraint text for the input fields for the\n * absolute range.\n */\n dateTimeConstraintText?: string;\n\n /**\n * When the property is set, screen readers announce the selected range when the absolute range gets selected.\n */\n renderSelectedAbsoluteRangeAriaLive?: (startDate: string, endDate: string) => string;\n }\n}\n\nexport interface Focusable {\n focus(): void;\n}\n"]}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { DateRangePickerProps } from './interfaces';
|
|
2
|
+
/**
|
|
3
|
+
* This function fills in a start and end time if they are missing.
|
|
4
|
+
*/
|
|
5
|
+
declare function fillMissingTime(value: DateRangePickerProps.AbsoluteValue | null): {
|
|
6
|
+
startDate: string;
|
|
7
|
+
endDate: string;
|
|
8
|
+
type: "absolute";
|
|
9
|
+
} | null;
|
|
10
|
+
export declare function formatValue(value: null | DateRangePickerProps.Value, { timeOffset, dateOnly }: {
|
|
11
|
+
timeOffset: number;
|
|
12
|
+
dateOnly: boolean;
|
|
13
|
+
}): null | DateRangePickerProps.Value;
|
|
14
|
+
export declare function useDateRangePicker({ value, relativeOptions, rangeSelectorMode }: UseDateRangePickerProps): {
|
|
15
|
+
fillMissingTime: typeof fillMissingTime;
|
|
16
|
+
rangeSelectionMode: "absolute" | "relative";
|
|
17
|
+
setRangeSelectionMode: import("react").Dispatch<import("react").SetStateAction<"absolute" | "relative">>;
|
|
18
|
+
selectedAbsoluteRange: DateRangePickerProps.AbsoluteValue | null;
|
|
19
|
+
setSelectedAbsoluteRange: import("react").Dispatch<import("react").SetStateAction<DateRangePickerProps.AbsoluteValue | null>>;
|
|
20
|
+
selectedRelativeRange: DateRangePickerProps.RelativeValue | null;
|
|
21
|
+
setSelectedRelativeRange: import("react").Dispatch<import("react").SetStateAction<DateRangePickerProps.RelativeValue | null>>;
|
|
22
|
+
};
|
|
23
|
+
export interface UseDateRangePickerProps {
|
|
24
|
+
value: null | DateRangePickerProps.Value;
|
|
25
|
+
relativeOptions: ReadonlyArray<DateRangePickerProps.RelativeOption>;
|
|
26
|
+
rangeSelectorMode: DateRangePickerProps.RangeSelectorMode;
|
|
27
|
+
}
|
|
28
|
+
export {};
|
|
29
|
+
//# sourceMappingURL=use-date-range-picker.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-date-range-picker.d.ts","sourceRoot":"","sources":["../../../src/date-range-picker/use-date-range-picker.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAEpD;;GAEG;AACH,iBAAS,eAAe,CAAC,KAAK,EAAE,oBAAoB,CAAC,aAAa,GAAG,IAAI;;;;SAWxE;AAED,wBAAgB,WAAW,CACzB,KAAK,EAAE,IAAI,GAAG,oBAAoB,CAAC,KAAK,EACxC,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE;IAAE,UAAU,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,OAAO,CAAA;CAAE,GAClE,IAAI,GAAG,oBAAoB,CAAC,KAAK,CAYnC;AAmBD,wBAAgB,kBAAkB,CAAC,EAAE,KAAK,EAAE,eAAe,EAAE,iBAAiB,EAAE,EAAE,uBAAuB;;;;;;;;EAsBxG;AAED,MAAM,WAAW,uBAAuB;IACtC,KAAK,EAAE,IAAI,GAAG,oBAAoB,CAAC,KAAK,CAAC;IACzC,eAAe,EAAE,aAAa,CAAC,oBAAoB,CAAC,cAAc,CAAC,CAAC;IACpE,iBAAiB,EAAE,oBAAoB,CAAC,iBAAiB,CAAC;CAC3D"}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import { __assign } from "tslib";
|
|
2
|
+
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
3
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
4
|
+
import { useState } from 'react';
|
|
5
|
+
import { setTimeOffset } from './time-offset';
|
|
6
|
+
/**
|
|
7
|
+
* This function fills in a start and end time if they are missing.
|
|
8
|
+
*/
|
|
9
|
+
function fillMissingTime(value) {
|
|
10
|
+
if (!value) {
|
|
11
|
+
return value;
|
|
12
|
+
}
|
|
13
|
+
var _a = value.startDate.split('T'), startDate = _a[0], startTime = _a[1];
|
|
14
|
+
var _b = value.endDate.split('T'), endDate = _b[0], endTime = _b[1];
|
|
15
|
+
return __assign(__assign({}, value), { startDate: startTime ? value.startDate : "".concat(startDate, "T00:00:00"), endDate: endTime ? value.endDate : "".concat(endDate, "T23:59:59") });
|
|
16
|
+
}
|
|
17
|
+
export function formatValue(value, _a) {
|
|
18
|
+
var timeOffset = _a.timeOffset, dateOnly = _a.dateOnly;
|
|
19
|
+
if (!value || value.type === 'relative') {
|
|
20
|
+
return value;
|
|
21
|
+
}
|
|
22
|
+
if (dateOnly) {
|
|
23
|
+
return {
|
|
24
|
+
type: 'absolute',
|
|
25
|
+
startDate: value.startDate.split('T')[0],
|
|
26
|
+
endDate: value.endDate.split('T')[0]
|
|
27
|
+
};
|
|
28
|
+
}
|
|
29
|
+
return setTimeOffset(value, timeOffset);
|
|
30
|
+
}
|
|
31
|
+
function getDefaultMode(value, relativeOptions, rangeSelectorMode) {
|
|
32
|
+
if (value && value.type) {
|
|
33
|
+
return value.type;
|
|
34
|
+
}
|
|
35
|
+
if (rangeSelectorMode === 'relative-only') {
|
|
36
|
+
return 'relative';
|
|
37
|
+
}
|
|
38
|
+
if (rangeSelectorMode === 'absolute-only') {
|
|
39
|
+
return 'absolute';
|
|
40
|
+
}
|
|
41
|
+
return relativeOptions.length > 0 ? 'relative' : 'absolute';
|
|
42
|
+
}
|
|
43
|
+
export function useDateRangePicker(_a) {
|
|
44
|
+
var value = _a.value, relativeOptions = _a.relativeOptions, rangeSelectorMode = _a.rangeSelectorMode;
|
|
45
|
+
var _b = useState(getDefaultMode(value, relativeOptions, rangeSelectorMode)), rangeSelectionMode = _b[0], setRangeSelectionMode = _b[1];
|
|
46
|
+
var _c = useState((value === null || value === void 0 ? void 0 : value.type) === 'absolute' ? value : null), selectedAbsoluteRange = _c[0], setSelectedAbsoluteRange = _c[1];
|
|
47
|
+
var _d = useState((value === null || value === void 0 ? void 0 : value.type) === 'relative' ? value : null), selectedRelativeRange = _d[0], setSelectedRelativeRange = _d[1];
|
|
48
|
+
return {
|
|
49
|
+
fillMissingTime: fillMissingTime,
|
|
50
|
+
rangeSelectionMode: rangeSelectionMode,
|
|
51
|
+
setRangeSelectionMode: setRangeSelectionMode,
|
|
52
|
+
selectedAbsoluteRange: selectedAbsoluteRange,
|
|
53
|
+
setSelectedAbsoluteRange: setSelectedAbsoluteRange,
|
|
54
|
+
selectedRelativeRange: selectedRelativeRange,
|
|
55
|
+
setSelectedRelativeRange: setSelectedRelativeRange
|
|
56
|
+
};
|
|
57
|
+
}
|
|
58
|
+
//# sourceMappingURL=use-date-range-picker.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-date-range-picker.js","sourceRoot":"","sources":["../../../src/date-range-picker/use-date-range-picker.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 { useState } from 'react';\nimport { DateRangePickerProps } from './interfaces';\nimport { setTimeOffset } from './time-offset';\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 function formatValue(\n value: null | DateRangePickerProps.Value,\n { timeOffset, dateOnly }: { timeOffset: number; dateOnly: boolean }\n): null | DateRangePickerProps.Value {\n if (!value || value.type === 'relative') {\n return value;\n }\n if (dateOnly) {\n return {\n type: 'absolute',\n startDate: value.startDate.split('T')[0],\n endDate: value.endDate.split('T')[0],\n };\n }\n return setTimeOffset(value, timeOffset);\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 useDateRangePicker({ value, relativeOptions, rangeSelectorMode }: UseDateRangePickerProps) {\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 return {\n fillMissingTime,\n rangeSelectionMode,\n setRangeSelectionMode,\n selectedAbsoluteRange,\n setSelectedAbsoluteRange,\n selectedRelativeRange,\n setSelectedRelativeRange,\n };\n}\n\nexport interface UseDateRangePickerProps {\n value: null | DateRangePickerProps.Value;\n relativeOptions: ReadonlyArray<DateRangePickerProps.RelativeOption>;\n rangeSelectorMode: DateRangePickerProps.RangeSelectorMode;\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/abstract-switch/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAE,0BAA0B,EAAE,MAAM,yCAAyC,CAAC;AAErF,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,0BAA0B;IACxG,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,KAAK,KAAK,CAAC,YAAY,CAAC;IAC1F,aAAa,EAAE,KAAK,CAAC,YAAY,CAAC;IAClC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAMD,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,SAAS,EACT,gBAAgB,EAChB,QAAQ,EACR,aAAa,EACb,aAAa,EACb,KAAK,EACL,WAAW,EACX,wBAAwB,EACxB,SAAS,EACT,cAAc,EACd,eAAe,EACf,YAAY,EACZ,iBAAiB,EACjB,GAAG,IAAI,EACR,EAAE,mBAAmB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/abstract-switch/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAE,0BAA0B,EAAE,MAAM,yCAAyC,CAAC;AAErF,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,0BAA0B;IACxG,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,KAAK,KAAK,CAAC,YAAY,CAAC;IAC1F,aAAa,EAAE,KAAK,CAAC,YAAY,CAAC;IAClC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAMD,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,SAAS,EACT,gBAAgB,EAChB,QAAQ,EACR,aAAa,EACb,aAAa,EACb,KAAK,EACL,WAAW,EACX,wBAAwB,EACxB,SAAS,EACT,cAAc,EACd,eAAe,EACf,YAAY,EACZ,iBAAiB,EACjB,GAAG,IAAI,EACR,EAAE,mBAAmB,eA4ErB"}
|
|
@@ -40,13 +40,13 @@ export default function AbstractSwitch(_a) {
|
|
|
40
40
|
}
|
|
41
41
|
return (React.createElement("div", __assign({}, rest, { className: clsx(styles.wrapper, rest.className), ref: __internalRootRef }),
|
|
42
42
|
React.createElement(WrapperElement, __assign({}, wrapperAttributes, { className: styles['label-wrapper'], "aria-disabled": disabled ? 'true' : undefined }),
|
|
43
|
-
React.createElement("
|
|
43
|
+
React.createElement("span", { className: clsx(styles.control, controlClassName) },
|
|
44
44
|
styledControl,
|
|
45
45
|
nativeControl(__assign(__assign({}, focusVisible), { id: id, disabled: disabled, 'aria-describedby': ariaDescriptons.length ? joinString(ariaDescriptons) : undefined, 'aria-labelledby': ariaLabelledByIds.length ? joinString(ariaLabelledByIds) : undefined, 'aria-label': ariaLabel })),
|
|
46
|
-
React.createElement("
|
|
47
|
-
React.createElement("
|
|
48
|
-
label && (React.createElement("
|
|
49
|
-
description && (React.createElement("
|
|
46
|
+
React.createElement("span", { className: styles.outline })),
|
|
47
|
+
React.createElement("span", { className: clsx(styles.content, !label && !description && styles['empty-content']) },
|
|
48
|
+
label && (React.createElement("span", { id: labelId, className: clsx(styles.label, (_b = {}, _b[styles['label-disabled']] = disabled, _b)) }, label)),
|
|
49
|
+
description && (React.createElement("span", { id: descriptionId, className: clsx(styles.description, (_c = {},
|
|
50
50
|
_c[styles['description-disabled']] = disabled,
|
|
51
51
|
_c[styles['description-bottom-padding']] = descriptionBottomPadding,
|
|
52
52
|
_c)) }, description))))));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/abstract-switch/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,eAAe,MAAM,2BAA2B,CAAC;AACxD,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAkBxD,SAAS,UAAU,CAAC,MAA8B;IAChD,OAAO,MAAM,CAAC,MAAM,CAAC,UAAC,KAAK,IAAsB,OAAA,CAAC,CAAC,KAAK,EAAP,CAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AACtE,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EAejB;;IAdpB,IAAA,SAAS,eAAA,EACT,gBAAgB,sBAAA,EAChB,QAAQ,cAAA,EACR,aAAa,mBAAA,EACb,aAAa,mBAAA,EACb,KAAK,WAAA,EACL,WAAW,iBAAA,EACX,wBAAwB,8BAAA,EACxB,SAAS,eAAA,EACT,cAAc,oBAAA,EACd,eAAe,qBAAA,EACf,YAAY,kBAAA,EACZ,iBAAiB,uBAAA,EACd,IAAI,cAd8B,0NAetC,CADQ;IAEP,IAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,IAAM,EAAE,GAAG,SAAS,IAAI,QAAQ,CAAC;IAEjC,IAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IACvC,IAAM,SAAS,GAAG,UAAG,EAAE,aAAU,CAAC;IAClC,IAAM,OAAO,GAAG,UAAG,EAAE,WAAQ,CAAC;IAC9B,IAAM,aAAa,GAAG,UAAG,EAAE,iBAAc,CAAC;IAE1C,IAAM,cAAc,GAAG,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC;IACtD,IAAM,iBAAiB,GAAuC,EAAE,CAAC;IACjE,IAAI,CAAC,YAAY,EAAE;QACjB,iBAAiB,CAAC,EAAE,GAAG,SAAS,CAAC;QACjC,iBAAiB,CAAC,OAAO,GAAG,EAAE,CAAC;KAChC;IAED,IAAM,iBAAiB,GAAG,EAAE,CAAC;IAC7B,IAAI,KAAK,EAAE;QACT,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KACjC;IACD,IAAI,cAAc,EAAE;QAClB,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;KACxC;IAED,IAAM,eAAe,GAAG,EAAE,CAAC;IAC3B,IAAI,eAAe,EAAE;QACnB,eAAe,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;KACvC;IACD,IAAI,WAAW,EAAE;QACf,eAAe,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;KACrC;IAED,OAAO,CACL,wCAAS,IAAI,IAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,IAAI,CAAC,SAAS,CAAC,EAAE,GAAG,EAAE,iBAAiB;QACpF,oBAAC,cAAc,eACT,iBAAiB,IACrB,SAAS,EAAE,MAAM,CAAC,eAAe,CAAC,mBACnB,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;YAE5C,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/abstract-switch/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 from 'react';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport useFocusVisible from '../../hooks/focus-visible';\nimport { useUniqueId } from '../../hooks/use-unique-id';\nimport { InternalBaseComponentProps } from '../../hooks/use-base-component/index.js';\n\nexport interface AbstractSwitchProps extends React.HTMLAttributes<HTMLElement>, InternalBaseComponentProps {\n controlId?: string;\n controlClassName: string;\n disabled?: boolean;\n nativeControl: (props: React.InputHTMLAttributes<HTMLInputElement>) => React.ReactElement;\n styledControl: React.ReactElement;\n label?: React.ReactNode;\n description?: React.ReactNode;\n descriptionBottomPadding?: boolean;\n ariaLabel?: string;\n ariaLabelledby?: string;\n ariaDescribedby?: string;\n withoutLabel?: boolean;\n}\n\nfunction joinString(values: (string | undefined)[]) {\n return values.filter((value): value is string => !!value).join(' ');\n}\n\nexport default function AbstractSwitch({\n controlId,\n controlClassName,\n disabled,\n nativeControl,\n styledControl,\n label,\n description,\n descriptionBottomPadding,\n ariaLabel,\n ariaLabelledby,\n ariaDescribedby,\n withoutLabel,\n __internalRootRef,\n ...rest\n}: AbstractSwitchProps) {\n const uniqueId = useUniqueId();\n const id = controlId || uniqueId;\n\n const focusVisible = useFocusVisible();\n const wrapperId = `${id}-wrapper`;\n const labelId = `${id}-label`;\n const descriptionId = `${id}-description`;\n\n const WrapperElement = withoutLabel ? 'div' : 'label';\n const wrapperAttributes: Record<string, string | undefined> = {};\n if (!withoutLabel) {\n wrapperAttributes.id = wrapperId;\n wrapperAttributes.htmlFor = id;\n }\n\n const ariaLabelledByIds = [];\n if (label) {\n ariaLabelledByIds.push(labelId);\n }\n if (ariaLabelledby) {\n ariaLabelledByIds.push(ariaLabelledby);\n }\n\n const ariaDescriptons = [];\n if (ariaDescribedby) {\n ariaDescriptons.push(ariaDescribedby);\n }\n if (description) {\n ariaDescriptons.push(descriptionId);\n }\n\n return (\n <div {...rest} className={clsx(styles.wrapper, rest.className)} ref={__internalRootRef}>\n <WrapperElement\n {...wrapperAttributes}\n className={styles['label-wrapper']}\n aria-disabled={disabled ? 'true' : undefined}\n >\n <span className={clsx(styles.control, controlClassName)}>\n {styledControl}\n {nativeControl({\n ...focusVisible,\n id,\n disabled,\n 'aria-describedby': ariaDescriptons.length ? joinString(ariaDescriptons) : undefined,\n 'aria-labelledby': ariaLabelledByIds.length ? joinString(ariaLabelledByIds) : undefined,\n 'aria-label': ariaLabel,\n })}\n {/*\n An empty element to display the outline, because the native control is invisible.\n Note: There is a CSS selector in src/toggle/styles.scss that relies on a span element selector to show focus.\n */}\n <span className={styles.outline} />\n </span>\n <span className={clsx(styles.content, !label && !description && styles['empty-content'])}>\n {label && (\n <span id={labelId} className={clsx(styles.label, { [styles['label-disabled']]: disabled })}>\n {label}\n </span>\n )}\n {description && (\n <span\n id={descriptionId}\n className={clsx(styles.description, {\n [styles['description-disabled']]: disabled,\n [styles['description-bottom-padding']]: descriptionBottomPadding,\n })}\n >\n {description}\n </span>\n )}\n </span>\n </WrapperElement>\n </div>\n );\n}\n"]}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
|
|
2
2
|
import './styles.scoped.css';
|
|
3
3
|
export default {
|
|
4
|
-
"
|
|
5
|
-
"
|
|
6
|
-
"
|
|
7
|
-
"
|
|
8
|
-
"
|
|
9
|
-
"
|
|
10
|
-
"
|
|
11
|
-
"
|
|
12
|
-
"
|
|
13
|
-
"
|
|
14
|
-
"
|
|
4
|
+
"content": "awsui_content_1wepg_dwz1x_93",
|
|
5
|
+
"description": "awsui_description_1wepg_dwz1x_94",
|
|
6
|
+
"label": "awsui_label_1wepg_dwz1x_95",
|
|
7
|
+
"outline": "awsui_outline_1wepg_dwz1x_96",
|
|
8
|
+
"wrapper": "awsui_wrapper_1wepg_dwz1x_100",
|
|
9
|
+
"label-wrapper": "awsui_label-wrapper_1wepg_dwz1x_107",
|
|
10
|
+
"empty-content": "awsui_empty-content_1wepg_dwz1x_118",
|
|
11
|
+
"description-bottom-padding": "awsui_description-bottom-padding_1wepg_dwz1x_128",
|
|
12
|
+
"label-disabled": "awsui_label-disabled_1wepg_dwz1x_136",
|
|
13
|
+
"description-disabled": "awsui_description-disabled_1wepg_dwz1x_137",
|
|
14
|
+
"control": "awsui_control_1wepg_dwz1x_142"
|
|
15
15
|
};
|
|
16
16
|
|
|
@@ -90,59 +90,66 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
90
90
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
91
91
|
SPDX-License-Identifier: Apache-2.0
|
|
92
92
|
*/
|
|
93
|
-
.
|
|
93
|
+
.awsui_content_1wepg_dwz1x_93:not(#\9),
|
|
94
|
+
.awsui_description_1wepg_dwz1x_94:not(#\9),
|
|
95
|
+
.awsui_label_1wepg_dwz1x_95:not(#\9),
|
|
96
|
+
.awsui_outline_1wepg_dwz1x_96:not(#\9) {
|
|
97
|
+
display: block;
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
.awsui_wrapper_1wepg_dwz1x_100:not(#\9) {
|
|
94
101
|
min-width: 0;
|
|
95
102
|
-ms-word-break: break-all;
|
|
96
103
|
word-break: break-word;
|
|
97
104
|
display: flex;
|
|
98
105
|
}
|
|
99
106
|
|
|
100
|
-
.awsui_label-
|
|
107
|
+
.awsui_label-wrapper_1wepg_dwz1x_107:not(#\9) {
|
|
101
108
|
position: relative;
|
|
102
109
|
display: flex;
|
|
103
110
|
}
|
|
104
111
|
|
|
105
|
-
.
|
|
112
|
+
.awsui_content_1wepg_dwz1x_93:not(#\9) {
|
|
106
113
|
min-width: 0;
|
|
107
114
|
-ms-word-break: break-all;
|
|
108
115
|
word-break: break-word;
|
|
109
116
|
}
|
|
110
117
|
|
|
111
|
-
.awsui_empty-
|
|
118
|
+
.awsui_empty-content_1wepg_dwz1x_118:not(#\9) {
|
|
112
119
|
width: 0px;
|
|
113
120
|
}
|
|
114
121
|
|
|
115
|
-
.
|
|
122
|
+
.awsui_description_1wepg_dwz1x_94:not(#\9) {
|
|
116
123
|
color: var(--color-text-form-secondary-ih9x7l, #5f6b7a);
|
|
117
124
|
font-size: var(--font-body-s-size-ukw2p9, 12px);
|
|
118
125
|
line-height: var(--font-body-s-line-height-kdsbrl, 16px);
|
|
119
126
|
letter-spacing: var(--font-body-s-letter-spacing-cy0oxj, 0.005em);
|
|
120
127
|
}
|
|
121
|
-
.awsui_description-bottom-
|
|
128
|
+
.awsui_description-bottom-padding_1wepg_dwz1x_128:not(#\9) {
|
|
122
129
|
padding-bottom: var(--space-scaled-xxs-95dhkm, 4px);
|
|
123
130
|
}
|
|
124
131
|
|
|
125
|
-
.
|
|
126
|
-
.
|
|
132
|
+
.awsui_label_1wepg_dwz1x_95:not(#\9),
|
|
133
|
+
.awsui_description_1wepg_dwz1x_94:not(#\9) {
|
|
127
134
|
padding-left: var(--space-xs-rsr2qu, 8px);
|
|
128
135
|
}
|
|
129
|
-
.awsui_label-
|
|
130
|
-
.awsui_description-
|
|
136
|
+
.awsui_label-disabled_1wepg_dwz1x_136:not(#\9),
|
|
137
|
+
.awsui_description-disabled_1wepg_dwz1x_137:not(#\9) {
|
|
131
138
|
color: var(--color-text-control-disabled-3z3eul, #9ba7b6);
|
|
132
139
|
}
|
|
133
140
|
|
|
134
141
|
/* stylelint-disable selector-max-type */
|
|
135
|
-
.
|
|
142
|
+
.awsui_control_1wepg_dwz1x_142:not(#\9) {
|
|
136
143
|
position: relative;
|
|
137
144
|
}
|
|
138
|
-
.
|
|
145
|
+
.awsui_control_1wepg_dwz1x_142 > input:not(#\9), .awsui_control_1wepg_dwz1x_142 > svg:not(#\9), .awsui_control_1wepg_dwz1x_142 > .awsui_outline_1wepg_dwz1x_96:not(#\9) {
|
|
139
146
|
position: absolute;
|
|
140
147
|
width: 100%;
|
|
141
148
|
height: 100%;
|
|
142
149
|
top: 0;
|
|
143
150
|
left: 0;
|
|
144
151
|
}
|
|
145
|
-
.
|
|
152
|
+
.awsui_control_1wepg_dwz1x_142 > input:not(#\9) {
|
|
146
153
|
opacity: 0;
|
|
147
154
|
z-index: 1;
|
|
148
155
|
-webkit-user-select: none;
|
|
@@ -2,16 +2,16 @@
|
|
|
2
2
|
// es-module interop with Babel and Typescript
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
module.exports.default = {
|
|
5
|
-
"
|
|
6
|
-
"
|
|
7
|
-
"
|
|
8
|
-
"
|
|
9
|
-
"
|
|
10
|
-
"
|
|
11
|
-
"
|
|
12
|
-
"
|
|
13
|
-
"
|
|
14
|
-
"
|
|
15
|
-
"
|
|
5
|
+
"content": "awsui_content_1wepg_dwz1x_93",
|
|
6
|
+
"description": "awsui_description_1wepg_dwz1x_94",
|
|
7
|
+
"label": "awsui_label_1wepg_dwz1x_95",
|
|
8
|
+
"outline": "awsui_outline_1wepg_dwz1x_96",
|
|
9
|
+
"wrapper": "awsui_wrapper_1wepg_dwz1x_100",
|
|
10
|
+
"label-wrapper": "awsui_label-wrapper_1wepg_dwz1x_107",
|
|
11
|
+
"empty-content": "awsui_empty-content_1wepg_dwz1x_118",
|
|
12
|
+
"description-bottom-padding": "awsui_description-bottom-padding_1wepg_dwz1x_128",
|
|
13
|
+
"label-disabled": "awsui_label-disabled_1wepg_dwz1x_136",
|
|
14
|
+
"description-disabled": "awsui_description-disabled_1wepg_dwz1x_137",
|
|
15
|
+
"control": "awsui_control_1wepg_dwz1x_142"
|
|
16
16
|
};
|
|
17
17
|
|
package/internal/environment.js
CHANGED
package/package.json
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
|
|
2
2
|
import './styles.scoped.css';
|
|
3
3
|
export default {
|
|
4
|
-
"root": "
|
|
5
|
-
"radio": "
|
|
6
|
-
"radio--has-description": "awsui_radio--has-
|
|
7
|
-
"radio-control": "awsui_radio-
|
|
8
|
-
"input": "
|
|
9
|
-
"styled-circle-border": "awsui_styled-circle-
|
|
10
|
-
"styled-circle-disabled": "awsui_styled-circle-
|
|
11
|
-
"styled-circle-fill": "awsui_styled-circle-
|
|
12
|
-
"styled-circle-checked": "awsui_styled-circle-
|
|
4
|
+
"root": "awsui_root_1mabk_r7q1e_93",
|
|
5
|
+
"radio": "awsui_radio_1mabk_r7q1e_105",
|
|
6
|
+
"radio--has-description": "awsui_radio--has-description_1mabk_r7q1e_113",
|
|
7
|
+
"radio-control": "awsui_radio-control_1mabk_r7q1e_117",
|
|
8
|
+
"input": "awsui_input_1mabk_r7q1e_125",
|
|
9
|
+
"styled-circle-border": "awsui_styled-circle-border_1mabk_r7q1e_147",
|
|
10
|
+
"styled-circle-disabled": "awsui_styled-circle-disabled_1mabk_r7q1e_151",
|
|
11
|
+
"styled-circle-fill": "awsui_styled-circle-fill_1mabk_r7q1e_156",
|
|
12
|
+
"styled-circle-checked": "awsui_styled-circle-checked_1mabk_r7q1e_162"
|
|
13
13
|
};
|
|
14
14
|
|
|
@@ -90,7 +90,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
90
90
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
91
91
|
SPDX-License-Identifier: Apache-2.0
|
|
92
92
|
*/
|
|
93
|
-
.
|
|
93
|
+
.awsui_root_1mabk_r7q1e_93:not(#\9) {
|
|
94
94
|
/* stylelint-disable-next-line plugin/no-unsupported-browser-features */
|
|
95
95
|
border-collapse: separate;
|
|
96
96
|
border-spacing: 0;
|
|
@@ -128,19 +128,19 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
128
128
|
display: block;
|
|
129
129
|
}
|
|
130
130
|
|
|
131
|
-
.
|
|
131
|
+
.awsui_radio_1mabk_r7q1e_105:not(#\9) {
|
|
132
132
|
/*used in test-utils*/
|
|
133
133
|
}
|
|
134
134
|
|
|
135
|
-
.
|
|
135
|
+
.awsui_radio_1mabk_r7q1e_105 + .awsui_radio_1mabk_r7q1e_105:not(#\9) {
|
|
136
136
|
margin-top: var(--space-scaled-xxs-95dhkm, 4px);
|
|
137
137
|
}
|
|
138
138
|
|
|
139
|
-
.awsui_radio--has-
|
|
139
|
+
.awsui_radio--has-description_1mabk_r7q1e_113 + .awsui_radio_1mabk_r7q1e_105:not(#\9) {
|
|
140
140
|
margin-top: var(--space-scaled-xs-6859qs, 8px);
|
|
141
141
|
}
|
|
142
142
|
|
|
143
|
-
.awsui_radio-
|
|
143
|
+
.awsui_radio-control_1mabk_r7q1e_117:not(#\9) {
|
|
144
144
|
margin-top: calc((var(--font-body-m-line-height-i7xxvv, 22px) - var(--size-control-n9i4yo, 16px)) / 2);
|
|
145
145
|
min-height: var(--size-control-n9i4yo, 16px);
|
|
146
146
|
min-width: var(--size-control-n9i4yo, 16px);
|
|
@@ -148,17 +148,17 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
148
148
|
width: var(--size-control-n9i4yo, 16px);
|
|
149
149
|
}
|
|
150
150
|
|
|
151
|
-
.
|
|
151
|
+
.awsui_input_1mabk_r7q1e_125[data-awsui-focus-visible=true]:not(#\9):focus {
|
|
152
152
|
/* stylelint-disable-next-line selector-max-type, @cloudscape-design/no-implicit-descendant */
|
|
153
153
|
}
|
|
154
|
-
.
|
|
154
|
+
.awsui_input_1mabk_r7q1e_125[data-awsui-focus-visible=true]:not(#\9):focus + span {
|
|
155
155
|
position: relative;
|
|
156
156
|
}
|
|
157
|
-
.
|
|
157
|
+
.awsui_input_1mabk_r7q1e_125[data-awsui-focus-visible=true]:not(#\9):focus + span {
|
|
158
158
|
outline: 2px dotted transparent;
|
|
159
159
|
outline-offset: calc(2px - 1px);
|
|
160
160
|
}
|
|
161
|
-
.
|
|
161
|
+
.awsui_input_1mabk_r7q1e_125[data-awsui-focus-visible=true]:not(#\9):focus + span::before {
|
|
162
162
|
content: " ";
|
|
163
163
|
display: block;
|
|
164
164
|
position: absolute;
|
|
@@ -170,35 +170,35 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
170
170
|
box-shadow: 0 0 0 2px var(--color-border-item-focused-ap3b6s, #0972d3);
|
|
171
171
|
}
|
|
172
172
|
|
|
173
|
-
.awsui_styled-circle-
|
|
173
|
+
.awsui_styled-circle-border_1mabk_r7q1e_147:not(#\9) {
|
|
174
174
|
stroke: var(--color-border-control-default-m3lmsh, #7d8998);
|
|
175
175
|
fill: var(--color-background-control-default-4pa05r, #ffffff);
|
|
176
176
|
}
|
|
177
|
-
.awsui_styled-circle-
|
|
177
|
+
.awsui_styled-circle-border_1mabk_r7q1e_147.awsui_styled-circle-disabled_1mabk_r7q1e_151:not(#\9) {
|
|
178
178
|
fill: var(--color-background-control-disabled-zplipy, #d1d5db);
|
|
179
179
|
stroke: var(--color-background-control-disabled-zplipy, #d1d5db);
|
|
180
180
|
}
|
|
181
181
|
|
|
182
|
-
.awsui_styled-circle-
|
|
182
|
+
.awsui_styled-circle-fill_1mabk_r7q1e_156:not(#\9) {
|
|
183
183
|
stroke: var(--color-background-control-checked-9admlu, #0972d3);
|
|
184
184
|
fill: var(--color-foreground-control-default-7ajdem, #ffffff);
|
|
185
185
|
opacity: 0;
|
|
186
186
|
transition: opacity var(--motion-duration-transition-quick-x85tae, 90ms) var(--motion-easing-transition-quick-lukbd8, linear);
|
|
187
187
|
}
|
|
188
|
-
.awsui_styled-circle-
|
|
188
|
+
.awsui_styled-circle-fill_1mabk_r7q1e_156.awsui_styled-circle-checked_1mabk_r7q1e_162:not(#\9) {
|
|
189
189
|
opacity: 1;
|
|
190
190
|
}
|
|
191
|
-
.awsui_styled-circle-
|
|
191
|
+
.awsui_styled-circle-fill_1mabk_r7q1e_156.awsui_styled-circle-disabled_1mabk_r7q1e_151:not(#\9) {
|
|
192
192
|
fill: var(--color-foreground-control-disabled-v6a97u, #ffffff);
|
|
193
193
|
stroke: var(--color-background-control-disabled-zplipy, #d1d5db);
|
|
194
194
|
}
|
|
195
195
|
@media (prefers-reduced-motion: reduce) {
|
|
196
|
-
.awsui_styled-circle-
|
|
196
|
+
.awsui_styled-circle-fill_1mabk_r7q1e_156:not(#\9) {
|
|
197
197
|
animation: none;
|
|
198
198
|
transition: none;
|
|
199
199
|
}
|
|
200
200
|
}
|
|
201
|
-
.awsui-motion-disabled .awsui_styled-circle-
|
|
201
|
+
.awsui-motion-disabled .awsui_styled-circle-fill_1mabk_r7q1e_156:not(#\9), .awsui-mode-entering .awsui_styled-circle-fill_1mabk_r7q1e_156:not(#\9) {
|
|
202
202
|
animation: none;
|
|
203
203
|
transition: none;
|
|
204
204
|
}
|
|
@@ -2,14 +2,14 @@
|
|
|
2
2
|
// es-module interop with Babel and Typescript
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
module.exports.default = {
|
|
5
|
-
"root": "
|
|
6
|
-
"radio": "
|
|
7
|
-
"radio--has-description": "awsui_radio--has-
|
|
8
|
-
"radio-control": "awsui_radio-
|
|
9
|
-
"input": "
|
|
10
|
-
"styled-circle-border": "awsui_styled-circle-
|
|
11
|
-
"styled-circle-disabled": "awsui_styled-circle-
|
|
12
|
-
"styled-circle-fill": "awsui_styled-circle-
|
|
13
|
-
"styled-circle-checked": "awsui_styled-circle-
|
|
5
|
+
"root": "awsui_root_1mabk_r7q1e_93",
|
|
6
|
+
"radio": "awsui_radio_1mabk_r7q1e_105",
|
|
7
|
+
"radio--has-description": "awsui_radio--has-description_1mabk_r7q1e_113",
|
|
8
|
+
"radio-control": "awsui_radio-control_1mabk_r7q1e_117",
|
|
9
|
+
"input": "awsui_input_1mabk_r7q1e_125",
|
|
10
|
+
"styled-circle-border": "awsui_styled-circle-border_1mabk_r7q1e_147",
|
|
11
|
+
"styled-circle-disabled": "awsui_styled-circle-disabled_1mabk_r7q1e_151",
|
|
12
|
+
"styled-circle-fill": "awsui_styled-circle-fill_1mabk_r7q1e_156",
|
|
13
|
+
"styled-circle-checked": "awsui_styled-circle-checked_1mabk_r7q1e_162"
|
|
14
14
|
};
|
|
15
15
|
|
package/toggle/internal.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/toggle/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAMtC,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAClF,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAI3C,QAAA,MAAM,cAAc,
|
|
1
|
+
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/toggle/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAMtC,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAClF,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAI3C,QAAA,MAAM,cAAc,kHAiEnB,CAAC;AAEF,eAAe,cAAc,CAAC"}
|
package/toggle/internal.js
CHANGED
|
@@ -17,7 +17,9 @@ var InternalToggle = React.forwardRef(function (_a, ref) {
|
|
|
17
17
|
return (React.createElement(AbstractSwitch, __assign({}, baseProps, { className: clsx(styles.root, baseProps.className), controlClassName: clsx(styles['toggle-control'], (_b = {},
|
|
18
18
|
_b[styles['toggle-control-checked']] = checked,
|
|
19
19
|
_b[styles['toggle-control-disabled']] = disabled,
|
|
20
|
-
_b)), controlId: controlId, disabled: disabled, label: children, description: description, descriptionBottomPadding: true, ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledby, ariaDescribedby: ariaDescribedby, nativeControl: function (nativeControlProps) { return (React.createElement("input", __assign({}, nativeControlProps, { ref: checkboxRef, className: styles.input, type: "checkbox", checked: checked, name: name, onFocus: onFocus && (function () { return fireNonCancelableEvent(onFocus); }), onBlur: onBlur && (function () { return fireNonCancelableEvent(onBlur); }), onChange: onChange && (function (event) { return fireNonCancelableEvent(onChange, { checked: event.target.checked }); }) }))); }, styledControl:
|
|
20
|
+
_b)), controlId: controlId, disabled: disabled, label: children, description: description, descriptionBottomPadding: true, ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledby, ariaDescribedby: ariaDescribedby, nativeControl: function (nativeControlProps) { return (React.createElement("input", __assign({}, nativeControlProps, { ref: checkboxRef, className: styles.input, type: "checkbox", checked: checked, name: name, onFocus: onFocus && (function () { return fireNonCancelableEvent(onFocus); }), onBlur: onBlur && (function () { return fireNonCancelableEvent(onBlur); }), onChange: onChange && (function (event) { return fireNonCancelableEvent(onChange, { checked: event.target.checked }); }) }))); }, styledControl:
|
|
21
|
+
/*Using span, not div for HTML validity*/
|
|
22
|
+
React.createElement("span", { className: clsx(styles['toggle-handle'], (_c = {},
|
|
21
23
|
_c[styles['toggle-handle-checked']] = checked,
|
|
22
24
|
_c[styles['toggle-handle-disabled']] = disabled,
|
|
23
25
|
_c)) }), __internalRootRef: __internalRootRef })));
|
package/toggle/internal.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/toggle/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,cAAc,MAAM,wCAAwC,CAAC;AACpE,OAAO,eAAe,MAAM,iCAAiC,CAAC;AAC9D,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAMrC,IAAM,cAAc,GAAG,KAAK,CAAC,UAAU,CACrC,UACE,EAeC,EACD,GAAG;;IAfD,IAAA,SAAS,eAAA,EACT,OAAO,aAAA,EACP,IAAI,UAAA,EACJ,QAAQ,cAAA,EACR,QAAQ,cAAA,EACR,WAAW,iBAAA,EACX,SAAS,eAAA,EACT,eAAe,qBAAA,EACf,cAAc,oBAAA,EACd,OAAO,aAAA,EACP,MAAM,YAAA,EACN,QAAQ,cAAA,EACR,yBAAwB,EAAxB,iBAAiB,mBAAG,IAAI,KAAA,EACrB,IAAI,cAdT,+KAeC,CADQ;IAIT,IAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IACrC,IAAM,WAAW,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IACnD,eAAe,CAAC,GAAG,EAAE,WAAW,CAAC,CAAC;IAClC,OAAO,CACL,oBAAC,cAAc,eACT,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,SAAS,CAAC,EACjD,gBAAgB,EAAE,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC;YAC7C,GAAC,MAAM,CAAC,wBAAwB,CAAC,IAAG,OAAO;YAC3C,GAAC,MAAM,CAAC,yBAAyB,CAAC,IAAG,QAAQ;gBAC7C,EACF,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,QAAQ,EACf,WAAW,EAAE,WAAW,EACxB,wBAAwB,EAAE,IAAI,EAC9B,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,cAAc,EAC9B,eAAe,EAAE,eAAe,EAChC,aAAa,EAAE,UAAA,kBAAkB,IAAI,OAAA,CACnC,0CACM,kBAAkB,IACtB,GAAG,EAAE,WAAW,EAChB,SAAS,EAAE,MAAM,CAAC,KAAK,EACvB,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,IAAI,CAAC,cAAM,OAAA,sBAAsB,CAAC,OAAO,CAAC,EAA/B,CAA+B,CAAC,EAC3D,MAAM,EAAE,MAAM,IAAI,CAAC,cAAM,OAAA,sBAAsB,CAAC,MAAM,CAAC,EAA9B,CAA8B,CAAC,EACxD,QAAQ,EAAE,QAAQ,IAAI,CAAC,UAAA,KAAK,IAAI,OAAA,sBAAsB,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC,EAAnE,CAAmE,CAAC,IACpG,CACH,EAZoC,CAYpC,EACD,aAAa,
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/toggle/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,cAAc,MAAM,wCAAwC,CAAC;AACpE,OAAO,eAAe,MAAM,iCAAiC,CAAC;AAC9D,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAMrC,IAAM,cAAc,GAAG,KAAK,CAAC,UAAU,CACrC,UACE,EAeC,EACD,GAAG;;IAfD,IAAA,SAAS,eAAA,EACT,OAAO,aAAA,EACP,IAAI,UAAA,EACJ,QAAQ,cAAA,EACR,QAAQ,cAAA,EACR,WAAW,iBAAA,EACX,SAAS,eAAA,EACT,eAAe,qBAAA,EACf,cAAc,oBAAA,EACd,OAAO,aAAA,EACP,MAAM,YAAA,EACN,QAAQ,cAAA,EACR,yBAAwB,EAAxB,iBAAiB,mBAAG,IAAI,KAAA,EACrB,IAAI,cAdT,+KAeC,CADQ;IAIT,IAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IACrC,IAAM,WAAW,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IACnD,eAAe,CAAC,GAAG,EAAE,WAAW,CAAC,CAAC;IAClC,OAAO,CACL,oBAAC,cAAc,eACT,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,SAAS,CAAC,EACjD,gBAAgB,EAAE,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC;YAC7C,GAAC,MAAM,CAAC,wBAAwB,CAAC,IAAG,OAAO;YAC3C,GAAC,MAAM,CAAC,yBAAyB,CAAC,IAAG,QAAQ;gBAC7C,EACF,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,QAAQ,EACf,WAAW,EAAE,WAAW,EACxB,wBAAwB,EAAE,IAAI,EAC9B,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,cAAc,EAC9B,eAAe,EAAE,eAAe,EAChC,aAAa,EAAE,UAAA,kBAAkB,IAAI,OAAA,CACnC,0CACM,kBAAkB,IACtB,GAAG,EAAE,WAAW,EAChB,SAAS,EAAE,MAAM,CAAC,KAAK,EACvB,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,IAAI,CAAC,cAAM,OAAA,sBAAsB,CAAC,OAAO,CAAC,EAA/B,CAA+B,CAAC,EAC3D,MAAM,EAAE,MAAM,IAAI,CAAC,cAAM,OAAA,sBAAsB,CAAC,MAAM,CAAC,EAA9B,CAA8B,CAAC,EACxD,QAAQ,EAAE,QAAQ,IAAI,CAAC,UAAA,KAAK,IAAI,OAAA,sBAAsB,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC,EAAnE,CAAmE,CAAC,IACpG,CACH,EAZoC,CAYpC,EACD,aAAa;QACX,yCAAyC;QACzC,8BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,eAAe,CAAC;gBACrC,GAAC,MAAM,CAAC,uBAAuB,CAAC,IAAG,OAAO;gBAC1C,GAAC,MAAM,CAAC,wBAAwB,CAAC,IAAG,QAAQ;oBAC5C,GACF,EAEJ,iBAAiB,EAAE,iBAAiB,IACpC,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React, { useRef } from 'react';\nimport AbstractSwitch from '../internal/components/abstract-switch';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { getBaseProps } from '../internal/base-component';\nimport styles from './styles.css.js';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { ToggleProps } from './interfaces';\n\ntype InternalToggleProps = ToggleProps & InternalBaseComponentProps;\n\nconst InternalToggle = React.forwardRef<ToggleProps.Ref, InternalToggleProps>(\n (\n {\n controlId,\n checked,\n name,\n disabled,\n children,\n description,\n ariaLabel,\n ariaDescribedby,\n ariaLabelledby,\n onFocus,\n onBlur,\n onChange,\n __internalRootRef = null,\n ...rest\n },\n ref\n ) => {\n const baseProps = getBaseProps(rest);\n const checkboxRef = useRef<HTMLInputElement>(null);\n useForwardFocus(ref, checkboxRef);\n return (\n <AbstractSwitch\n {...baseProps}\n className={clsx(styles.root, baseProps.className)}\n controlClassName={clsx(styles['toggle-control'], {\n [styles['toggle-control-checked']]: checked,\n [styles['toggle-control-disabled']]: disabled,\n })}\n controlId={controlId}\n disabled={disabled}\n label={children}\n description={description}\n descriptionBottomPadding={true}\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n ariaDescribedby={ariaDescribedby}\n nativeControl={nativeControlProps => (\n <input\n {...nativeControlProps}\n ref={checkboxRef}\n className={styles.input}\n type=\"checkbox\"\n checked={checked}\n name={name}\n onFocus={onFocus && (() => fireNonCancelableEvent(onFocus))}\n onBlur={onBlur && (() => fireNonCancelableEvent(onBlur))}\n onChange={onChange && (event => fireNonCancelableEvent(onChange, { checked: event.target.checked }))}\n />\n )}\n styledControl={\n /*Using span, not div for HTML validity*/\n <span\n className={clsx(styles['toggle-handle'], {\n [styles['toggle-handle-checked']]: checked,\n [styles['toggle-handle-disabled']]: disabled,\n })}\n />\n }\n __internalRootRef={__internalRootRef}\n />\n );\n }\n);\n\nexport default InternalToggle;\n"]}
|