@cloudscape-design/components 3.0.242 → 3.0.244
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/drawer/index.d.ts.map +1 -1
- package/app-layout/drawer/index.js +6 -3
- package/app-layout/drawer/index.js.map +1 -1
- package/attribute-editor/row.js +2 -2
- package/attribute-editor/row.js.map +1 -1
- package/autosuggest/internal.d.ts.map +1 -1
- package/autosuggest/internal.js +3 -2
- package/autosuggest/internal.js.map +1 -1
- package/expandable-section/expandable-section-header.js +2 -2
- package/expandable-section/expandable-section-header.js.map +1 -1
- package/internal/environment.js +1 -1
- package/internal/hooks/use-unique-id/index.d.ts +0 -1
- package/internal/hooks/use-unique-id/index.d.ts.map +1 -1
- package/internal/hooks/use-unique-id/index.js +8 -6
- package/internal/hooks/use-unique-id/index.js.map +1 -1
- package/internal/manifest.json +1 -1
- package/package.json +1 -1
- package/property-filter/property-filter-autosuggest.d.ts.map +1 -1
- package/property-filter/property-filter-autosuggest.js +3 -2
- package/property-filter/property-filter-autosuggest.js.map +1 -1
- package/select/parts/trigger.d.ts.map +1 -1
- package/select/parts/trigger.js +5 -4
- package/select/parts/trigger.js.map +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["app-layout/drawer/index.tsx"],"names":[],"mappings":"AAGA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["app-layout/drawer/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAiB,MAAM,OAAO,CAAC;AACtC,OAAO,EAAgC,aAAa,EAAE,MAAM,YAAY,CAAC;AACzE,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAG/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAE9D,MAAM,WAAW,kBAAkB;IACjC,gBAAgB,EAAE,MAAM,CAAC;IACzB,eAAe,EAAE,MAAM,CAAC;IACxB,cAAc,EAAE,MAAM,CAAC;IACvB,UAAU,EAAE,gBAAgB,CAAC;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;IAC9B,YAAY,EAAE,MAAM,GAAG,SAAS,CAAC;IACjC,UAAU,EAAE,cAAc,CAAC,MAAM,GAAG,SAAS,CAAC;IAC9C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,IAAI,EAAE,MAAM,OAAO,aAAa,CAAC;IACjC,QAAQ,EAAE,OAAO,CAAC;IAClB,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACpC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC5C,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;CACjD;AAmBD,wBAAgB,MAAM,CAAC,EACrB,gBAAgB,EAChB,eAAe,EACf,cAAc,EACd,KAAK,EACL,IAAI,EACJ,UAAU,EACV,SAAS,EACT,YAAY,EACZ,UAAU,EACV,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,WAAW,GACZ,EAAE,kBAAkB,eAsEpB"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
2
|
// SPDX-License-Identifier: Apache-2.0
|
|
3
3
|
import clsx from 'clsx';
|
|
4
|
-
import React from 'react';
|
|
4
|
+
import React, { useRef } from 'react';
|
|
5
5
|
import { AppLayoutButton, CloseButton, togglesConfig } from '../toggles';
|
|
6
6
|
import testutilStyles from '../test-classes/styles.css.js';
|
|
7
7
|
import styles from './styles.css.js';
|
|
@@ -26,7 +26,8 @@ export function Drawer({ contentClassName, toggleClassName, closeClassName, widt
|
|
|
26
26
|
const { mainLabel, closeLabel, openLabel } = getLabels(ariaLabels);
|
|
27
27
|
const drawerContentWidthOpen = isMobile ? undefined : width;
|
|
28
28
|
const drawerContentWidth = isOpen ? drawerContentWidthOpen : undefined;
|
|
29
|
-
const
|
|
29
|
+
const openButtonWrapperRef = useRef(null);
|
|
30
|
+
const regularOpenButton = (React.createElement(TagName, { ref: openButtonWrapperRef, "aria-label": mainLabel, className: styles.toggle, "aria-hidden": isOpen },
|
|
30
31
|
React.createElement(AppLayoutButton, { ref: toggleRefs.toggle, className: toggleClassName, iconName: iconName, ariaLabel: openLabel, onClick: () => onToggle(true), ariaExpanded: false })));
|
|
31
32
|
return (React.createElement("div", { className: clsx(styles.drawer, {
|
|
32
33
|
[styles['drawer-closed']]: !isOpen,
|
|
@@ -39,12 +40,14 @@ export function Drawer({ contentClassName, toggleClassName, closeClassName, widt
|
|
|
39
40
|
}
|
|
40
41
|
}
|
|
41
42
|
: undefined, onClick: event => {
|
|
43
|
+
var _a;
|
|
42
44
|
if (onClick) {
|
|
43
45
|
onClick(event);
|
|
44
46
|
}
|
|
45
47
|
if (!isOpen) {
|
|
46
48
|
// to prevent calling onToggle from the drawer when it's called from the toggle button
|
|
47
|
-
if (event.target
|
|
49
|
+
if (openButtonWrapperRef.current === event.target ||
|
|
50
|
+
!((_a = openButtonWrapperRef.current) === null || _a === void 0 ? void 0 : _a.contains(event.target))) {
|
|
48
51
|
onToggle(true);
|
|
49
52
|
}
|
|
50
53
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["app-layout/drawer/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["app-layout/drawer/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, { useRef } from 'react';\nimport { AppLayoutButton, CloseButton, togglesConfig } from '../toggles';\nimport { AppLayoutProps } from '../interfaces';\nimport testutilStyles from '../test-classes/styles.css.js';\nimport styles from './styles.css.js';\nimport { FocusControlRefs } from '../utils/use-focus-control';\n\nexport interface DesktopDrawerProps {\n contentClassName: string;\n toggleClassName: string;\n closeClassName: string;\n toggleRefs: FocusControlRefs;\n width: number;\n topOffset: number | undefined;\n bottomOffset: number | undefined;\n ariaLabels: AppLayoutProps.Labels | undefined;\n children: React.ReactNode;\n type: keyof typeof togglesConfig;\n isMobile: boolean;\n isOpen: boolean;\n onToggle: (isOpen: boolean) => void;\n onClick?: (event: React.MouseEvent) => void;\n onLoseFocus?: (event: React.FocusEvent) => void;\n}\n\n// We are using two landmarks per drawer, i.e. two NAVs and two ASIDEs, because of several\n// known bugs in NVDA that cause focus changes within a container to sometimes not be\n// announced. As a result, we use one region for the open button and one region for the\n// actual drawer content, always hiding the other one when it's not visible.\n// An alternative solution to follow a more classic implementation here to only have one\n// button that triggers the opening/closing of the drawer also did not work due to another\n// series of bugs in NVDA (together with Firefox) which prevent the changed expanded state\n// from being announced.\n// Even with this workaround in place, the announcement of the close button when opening a\n// panel in NVDA is not working correctly. The suspected root cause is one of the bugs below\n// as well.\n// Relevant tickets:\n// * https://github.com/nvaccess/nvda/issues/6606\n// * https://github.com/nvaccess/nvda/issues/5825\n// * https://github.com/nvaccess/nvda/issues/5247\n// * https://github.com/nvaccess/nvda/pull/8869 (reverted PR that was going to fix it)\n\nexport function Drawer({\n contentClassName,\n toggleClassName,\n closeClassName,\n width,\n type,\n toggleRefs,\n topOffset,\n bottomOffset,\n ariaLabels,\n children,\n isOpen,\n isMobile,\n onToggle,\n onClick,\n onLoseFocus,\n}: DesktopDrawerProps) {\n const { TagName, iconName, getLabels } = togglesConfig[type];\n const { mainLabel, closeLabel, openLabel } = getLabels(ariaLabels);\n const drawerContentWidthOpen = isMobile ? undefined : width;\n const drawerContentWidth = isOpen ? drawerContentWidthOpen : undefined;\n const openButtonWrapperRef = useRef<HTMLElement | null>(null);\n\n const regularOpenButton = (\n <TagName ref={openButtonWrapperRef} aria-label={mainLabel} className={styles.toggle} aria-hidden={isOpen}>\n <AppLayoutButton\n ref={toggleRefs.toggle}\n className={toggleClassName}\n iconName={iconName}\n ariaLabel={openLabel}\n onClick={() => onToggle(true)}\n ariaExpanded={false}\n />\n </TagName>\n );\n\n return (\n <div\n className={clsx(styles.drawer, {\n [styles['drawer-closed']]: !isOpen,\n [testutilStyles['drawer-closed']]: !isOpen,\n [styles['drawer-mobile']]: isMobile,\n })}\n style={{ width: drawerContentWidth }}\n onBlur={\n onLoseFocus\n ? e => {\n if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {\n onLoseFocus(e);\n }\n }\n : undefined\n }\n onClick={event => {\n if (onClick) {\n onClick(event);\n }\n\n if (!isOpen) {\n // to prevent calling onToggle from the drawer when it's called from the toggle button\n if (\n openButtonWrapperRef.current === event.target ||\n !openButtonWrapperRef.current?.contains(event.target as Node)\n ) {\n onToggle(true);\n }\n }\n }}\n >\n <div\n style={{ width: drawerContentWidth, top: topOffset, bottom: bottomOffset }}\n className={clsx(styles['drawer-content'], contentClassName)}\n >\n {!isMobile && regularOpenButton}\n <TagName aria-label={mainLabel} aria-hidden={!isOpen}>\n <CloseButton\n ref={toggleRefs.close}\n className={closeClassName}\n ariaLabel={closeLabel}\n onClick={() => onToggle(false)}\n />\n {children}\n </TagName>\n </div>\n </div>\n );\n}\n"]}
|
package/attribute-editor/row.js
CHANGED
|
@@ -9,7 +9,7 @@ import { fireNonCancelableEvent } from '../internal/events';
|
|
|
9
9
|
import InternalGrid from '../grid/internal';
|
|
10
10
|
import { InternalButton } from '../button/internal';
|
|
11
11
|
import clsx from 'clsx';
|
|
12
|
-
import {
|
|
12
|
+
import { useUniqueId } from '../internal/hooks/use-unique-id';
|
|
13
13
|
const Divider = () => React.createElement(InternalBox, { className: styles.divider, padding: { top: 'l' } });
|
|
14
14
|
function render(item, itemIndex, slot) {
|
|
15
15
|
return typeof slot === 'function' ? slot(item, itemIndex) : slot;
|
|
@@ -22,7 +22,7 @@ export const Row = React.memo(({ breakpoint, item, definition, i18nStrings = {},
|
|
|
22
22
|
const handleRemoveClick = useCallback(() => {
|
|
23
23
|
fireNonCancelableEvent(onRemoveButtonClick, { itemIndex: index });
|
|
24
24
|
}, [onRemoveButtonClick, index]);
|
|
25
|
-
const firstControlId =
|
|
25
|
+
const firstControlId = useUniqueId('first-control-id-');
|
|
26
26
|
return (React.createElement(InternalBox, { className: styles.row, margin: { bottom: 's' } },
|
|
27
27
|
React.createElement("div", { role: "group", "aria-labelledby": `${firstControlId}-label ${firstControlId}` },
|
|
28
28
|
React.createElement(InternalGrid, { __breakpoint: breakpoint, gridDefinition: removable ? REMOVABLE_GRID_DEFINITION : GRID_DEFINITION },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"row.js","sourceRoot":"lib/default/","sources":["attribute-editor/row.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,WAAW,MAAM,iBAAiB,CAAC;AAC1C,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,iBAAiB,MAAM,wBAAwB,CAAC;AACvD,OAAO,oBAAgD,MAAM,2BAA2B,CAAC;AAGzF,OAAO,EAAE,sBAAsB,EAA6B,MAAM,oBAAoB,CAAC;AACvF,OAAO,YAAY,MAAM,kBAAkB,CAAC;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"row.js","sourceRoot":"lib/default/","sources":["attribute-editor/row.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 InternalBox from '../box/internal';\nimport styles from './styles.css.js';\nimport React, { useCallback } from 'react';\nimport InternalFormField from '../form-field/internal';\nimport InternalColumnLayout, { ColumnLayoutBreakpoint } from '../column-layout/internal';\nimport { AttributeEditorProps } from './interfaces';\nimport { ButtonProps } from '../button/interfaces';\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../internal/events';\nimport InternalGrid from '../grid/internal';\nimport { InternalButton } from '../button/internal';\nimport clsx from 'clsx';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\n\nconst Divider = () => <InternalBox className={styles.divider} padding={{ top: 'l' }} />;\n\nexport interface RowProps<T> {\n breakpoint: ColumnLayoutBreakpoint | null;\n item: T;\n definition: ReadonlyArray<AttributeEditorProps.FieldDefinition<T>>;\n i18nStrings: AttributeEditorProps.I18nStrings | undefined;\n index: number;\n removable: boolean;\n removeButtonText: string;\n removeButtonRefs: Array<ButtonProps.Ref | undefined>;\n onRemoveButtonClick?: NonCancelableEventHandler<AttributeEditorProps.RemoveButtonClickDetail>;\n}\n\nfunction render<T>(\n item: T,\n itemIndex: number,\n slot: AttributeEditorProps.FieldRenderable<T> | React.ReactNode | undefined\n) {\n return typeof slot === 'function' ? slot(item, itemIndex) : slot;\n}\n\nconst GRID_DEFINITION = [{ colspan: { default: 12, xs: 9 } }];\nconst REMOVABLE_GRID_DEFINITION = [{ colspan: { default: 12, xs: 9 } }, { colspan: { default: 12, xs: 3 } }];\nexport const Row = React.memo(\n <T,>({\n breakpoint,\n item,\n definition,\n i18nStrings = {},\n index,\n removable,\n removeButtonText,\n removeButtonRefs,\n onRemoveButtonClick,\n }: RowProps<T>) => {\n const isNarrowViewport = breakpoint === 'default' || breakpoint === 'xxs';\n const isWideViewport = !isNarrowViewport;\n\n const handleRemoveClick = useCallback(() => {\n fireNonCancelableEvent(onRemoveButtonClick, { itemIndex: index });\n }, [onRemoveButtonClick, index]);\n\n const firstControlId = useUniqueId('first-control-id-');\n\n return (\n <InternalBox className={styles.row} margin={{ bottom: 's' }}>\n <div role=\"group\" aria-labelledby={`${firstControlId}-label ${firstControlId}`}>\n <InternalGrid\n __breakpoint={breakpoint}\n gridDefinition={removable ? REMOVABLE_GRID_DEFINITION : GRID_DEFINITION}\n >\n <InternalColumnLayout\n className={styles['row-control']}\n columns={definition.length}\n __breakpoint={breakpoint}\n >\n {definition.map(({ info, label, constraintText, errorText, control }, defIndex) => (\n <InternalFormField\n key={defIndex}\n className={styles.field}\n label={label}\n info={info}\n constraintText={render(item, index, constraintText)}\n errorText={render(item, index, errorText)}\n stretch={true}\n i18nStrings={{ errorIconAriaLabel: i18nStrings.errorIconAriaLabel }}\n __hideLabel={isWideViewport && index > 0}\n controlId={defIndex === 0 ? firstControlId : undefined}\n >\n {render(item, index, control)}\n </InternalFormField>\n ))}\n </InternalColumnLayout>\n {removable && (\n <ButtonContainer\n index={index}\n isNarrowViewport={isNarrowViewport}\n hasLabel={definition.some(row => row.label)}\n >\n <InternalButton\n className={styles['remove-button']}\n formAction=\"none\"\n ref={ref => {\n removeButtonRefs[index] = ref ?? undefined;\n }}\n onClick={handleRemoveClick}\n >\n {removeButtonText}\n </InternalButton>\n </ButtonContainer>\n )}\n </InternalGrid>\n </div>\n {isNarrowViewport && <Divider />}\n </InternalBox>\n );\n }\n);\n\ninterface ButtonContainer {\n index: number;\n children: React.ReactNode;\n isNarrowViewport: boolean;\n hasLabel: boolean;\n}\n\nconst ButtonContainer = ({ index, children, isNarrowViewport, hasLabel }: ButtonContainer) => (\n <div\n className={clsx({\n [styles['button-container-haslabel']]: !isNarrowViewport && index === 0 && hasLabel,\n [styles['button-container-nolabel']]: !isNarrowViewport && index === 0 && !hasLabel,\n [styles['right-align']]: isNarrowViewport,\n })}\n >\n {children}\n </div>\n);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["autosuggest/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAIhE,OAAO,EAAmB,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAejE,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAUlF,MAAM,WAAW,wBAAyB,SAAQ,gBAAgB,EAAE,0BAA0B;CAAG;AAEjG,QAAA,MAAM,mBAAmB,
|
|
1
|
+
{"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["autosuggest/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAIhE,OAAO,EAAmB,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAejE,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAUlF,MAAM,WAAW,wBAAyB,SAAQ,gBAAgB,EAAE,0BAA0B;CAAG;AAEjG,QAAA,MAAM,mBAAmB,uGAgMvB,CAAC;AAEH,eAAe,mBAAmB,CAAC"}
|
package/autosuggest/internal.js
CHANGED
|
@@ -6,7 +6,7 @@ import clsx from 'clsx';
|
|
|
6
6
|
import { useAutosuggestItems } from './options-controller';
|
|
7
7
|
import { useDropdownStatus } from '../internal/components/dropdown-status';
|
|
8
8
|
import DropdownFooter from '../internal/components/dropdown-footer';
|
|
9
|
-
import {
|
|
9
|
+
import { useUniqueId } from '../internal/hooks/use-unique-id';
|
|
10
10
|
import { fireCancelableEvent, fireNonCancelableEvent, } from '../internal/events';
|
|
11
11
|
import { checkOptionValueField } from '../select/utils/check-option-value-field';
|
|
12
12
|
import checkControlled from '../internal/hooks/check-controlled';
|
|
@@ -94,7 +94,8 @@ const InternalAutosuggest = React.forwardRef((props, ref) => {
|
|
|
94
94
|
const selfControlId = useUniqueId('input');
|
|
95
95
|
const controlId = (_a = formFieldContext.controlId) !== null && _a !== void 0 ? _a : selfControlId;
|
|
96
96
|
const listId = useUniqueId('list');
|
|
97
|
-
const
|
|
97
|
+
const highlightedOptionIdSource = useUniqueId();
|
|
98
|
+
const highlightedOptionId = autosuggestItemsState.highlightedOption ? highlightedOptionIdSource : undefined;
|
|
98
99
|
const isEmpty = !value && !autosuggestItemsState.items.length;
|
|
99
100
|
const dropdownStatus = useDropdownStatus(Object.assign(Object.assign({}, props), { isEmpty,
|
|
100
101
|
recoveryText,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["autosuggest/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { Ref, useImperativeHandle, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useAutosuggestItems } from './options-controller';\nimport { AutosuggestItem, AutosuggestProps } from './interfaces';\n\nimport { useDropdownStatus } from '../internal/components/dropdown-status';\nimport DropdownFooter from '../internal/components/dropdown-footer';\n\nimport { generateUniqueId, useUniqueId } from '../internal/hooks/use-unique-id';\nimport {\n BaseKeyDetail,\n fireCancelableEvent,\n fireNonCancelableEvent,\n NonCancelableCustomEvent,\n} from '../internal/events';\nimport { BaseChangeDetail } from '../input/interfaces';\nimport { checkOptionValueField } from '../select/utils/check-option-value-field';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport AutosuggestOptionsList from './options-list';\nimport { useAutosuggestLoadMore } from './load-more-controller';\nimport { OptionsLoadItemsDetail } from '../internal/components/dropdown/interfaces';\nimport AutosuggestInput, { AutosuggestInputRef } from '../internal/components/autosuggest-input';\nimport { useFormFieldContext } from '../contexts/form-field';\nimport { useInternalI18n } from '../internal/i18n/context';\n\nimport styles from './styles.css.js';\n\nexport interface InternalAutosuggestProps extends AutosuggestProps, InternalBaseComponentProps {}\n\nconst InternalAutosuggest = React.forwardRef((props: InternalAutosuggestProps, ref: Ref<AutosuggestProps.Ref>) => {\n const {\n value,\n onChange,\n onBlur,\n onFocus,\n onKeyUp,\n onLoadItems,\n options,\n filteringType = 'auto',\n statusType = 'finished',\n recoveryText,\n placeholder,\n clearAriaLabel,\n name,\n disabled,\n disableBrowserAutocorrect = false,\n autoFocus,\n readOnly,\n ariaLabel,\n ariaRequired,\n enteredTextLabel,\n onKeyDown,\n virtualScroll,\n expandToViewport,\n onSelect,\n renderHighlightedAriaLive,\n __internalRootRef,\n ...restProps\n } = props;\n\n checkControlled('Autosuggest', 'value', value, 'onChange', onChange);\n checkOptionValueField('Autosuggest', 'options', options);\n\n const autosuggestInputRef = useRef<AutosuggestInputRef>(null);\n useImperativeHandle(\n ref,\n () => ({\n focus: () => autosuggestInputRef.current?.focus(),\n select: () => autosuggestInputRef.current?.select(),\n }),\n []\n );\n\n const i18n = useInternalI18n('autosuggest');\n const errorIconAriaLabel = i18n('errorIconAriaLabel', restProps.errorIconAriaLabel);\n const selectedAriaLabel = i18n('selectedAriaLabel', restProps.selectedAriaLabel);\n\n const [autosuggestItemsState, autosuggestItemsHandlers] = useAutosuggestItems({\n options: options || [],\n filterValue: value,\n filterText: value,\n filteringType,\n hideEnteredTextLabel: false,\n onSelectItem: (option: AutosuggestItem) => {\n const value = option.value || '';\n fireNonCancelableEvent(onChange, { value });\n fireNonCancelableEvent(onSelect, {\n value,\n selectedOption: option.type !== 'use-entered' ? option.option : undefined,\n });\n autosuggestInputRef.current?.close();\n },\n });\n\n const autosuggestLoadMoreHandlers = useAutosuggestLoadMore({\n options,\n statusType,\n onLoadItems: (detail: OptionsLoadItemsDetail) => fireNonCancelableEvent(onLoadItems, detail),\n });\n\n const handleChange = (event: NonCancelableCustomEvent<BaseChangeDetail>) => {\n autosuggestItemsHandlers.setShowAll(false);\n autosuggestItemsHandlers.resetHighlightWithKeyboard();\n fireNonCancelableEvent(onChange, event.detail);\n };\n\n const handleDelayedInput = (event: NonCancelableCustomEvent<BaseChangeDetail>) => {\n autosuggestLoadMoreHandlers.fireLoadMoreOnInputChange(event.detail.value);\n };\n\n const handleBlur = () => {\n fireNonCancelableEvent(onBlur, null);\n };\n\n const handleFocus = () => {\n autosuggestItemsHandlers.setShowAll(true);\n autosuggestLoadMoreHandlers.fireLoadMoreOnInputFocus();\n fireNonCancelableEvent(onFocus, null);\n };\n\n const handleKeyUp = (e: CustomEvent<BaseKeyDetail>) => {\n fireCancelableEvent(onKeyUp, e.detail);\n };\n\n const handleKeyDown = (e: CustomEvent<BaseKeyDetail>) => {\n fireCancelableEvent(onKeyDown, e.detail);\n };\n\n const handlePressArrowDown = () => {\n autosuggestItemsHandlers.moveHighlightWithKeyboard(1);\n };\n\n const handlePressArrowUp = () => {\n autosuggestItemsHandlers.moveHighlightWithKeyboard(-1);\n };\n\n const handlePressEnter = () => {\n return autosuggestItemsHandlers.selectHighlightedOptionWithKeyboard();\n };\n\n const handleCloseDropdown = () => {\n autosuggestItemsHandlers.resetHighlightWithKeyboard();\n };\n\n const handleRecoveryClick = () => {\n autosuggestLoadMoreHandlers.fireLoadMoreOnRecoveryClick();\n autosuggestInputRef.current?.focus();\n };\n\n const formFieldContext = useFormFieldContext(restProps);\n const selfControlId = useUniqueId('input');\n const controlId = formFieldContext.controlId ?? selfControlId;\n const listId = useUniqueId('list');\n const highlightedOptionId = autosuggestItemsState.highlightedOption ? generateUniqueId() : undefined;\n\n const isEmpty = !value && !autosuggestItemsState.items.length;\n const dropdownStatus = useDropdownStatus({\n ...props,\n isEmpty,\n recoveryText,\n errorIconAriaLabel,\n onRecoveryClick: handleRecoveryClick,\n });\n\n return (\n <AutosuggestInput\n {...restProps}\n className={clsx(styles.root, restProps.className)}\n ref={autosuggestInputRef}\n __internalRootRef={__internalRootRef}\n value={value}\n onChange={handleChange}\n onBlur={handleBlur}\n onFocus={handleFocus}\n onKeyUp={handleKeyUp}\n onKeyDown={handleKeyDown}\n name={name}\n controlId={controlId}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n autoFocus={autoFocus}\n ariaLabel={ariaLabel}\n ariaRequired={ariaRequired}\n clearAriaLabel={clearAriaLabel}\n disableBrowserAutocorrect={disableBrowserAutocorrect}\n expandToViewport={expandToViewport}\n ariaControls={listId}\n ariaActivedescendant={highlightedOptionId}\n dropdownExpanded={autosuggestItemsState.items.length > 1 || dropdownStatus.content !== null}\n dropdownContent={\n <AutosuggestOptionsList\n autosuggestItemsState={autosuggestItemsState}\n autosuggestItemsHandlers={autosuggestItemsHandlers}\n highlightedOptionId={highlightedOptionId}\n highlightText={value}\n listId={listId}\n controlId={controlId}\n enteredTextLabel={enteredTextLabel}\n handleLoadMore={autosuggestLoadMoreHandlers.fireLoadMoreOnScroll}\n hasDropdownStatus={dropdownStatus.content !== null}\n virtualScroll={virtualScroll}\n selectedAriaLabel={selectedAriaLabel}\n renderHighlightedAriaLive={renderHighlightedAriaLive}\n listBottom={!dropdownStatus.isSticky ? <DropdownFooter content={dropdownStatus.content} /> : null}\n />\n }\n dropdownFooter={\n dropdownStatus.isSticky ? (\n <DropdownFooter content={dropdownStatus.content} hasItems={autosuggestItemsState.items.length >= 1} />\n ) : null\n }\n loopFocus={statusType === 'error' && !!recoveryText}\n onCloseDropdown={handleCloseDropdown}\n onDelayedInput={handleDelayedInput}\n onPressArrowDown={handlePressArrowDown}\n onPressArrowUp={handlePressArrowUp}\n onPressEnter={handlePressEnter}\n />\n );\n});\n\nexport default InternalAutosuggest;\n"]}
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["autosuggest/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { Ref, useImperativeHandle, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useAutosuggestItems } from './options-controller';\nimport { AutosuggestItem, AutosuggestProps } from './interfaces';\n\nimport { useDropdownStatus } from '../internal/components/dropdown-status';\nimport DropdownFooter from '../internal/components/dropdown-footer';\n\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport {\n BaseKeyDetail,\n fireCancelableEvent,\n fireNonCancelableEvent,\n NonCancelableCustomEvent,\n} from '../internal/events';\nimport { BaseChangeDetail } from '../input/interfaces';\nimport { checkOptionValueField } from '../select/utils/check-option-value-field';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport AutosuggestOptionsList from './options-list';\nimport { useAutosuggestLoadMore } from './load-more-controller';\nimport { OptionsLoadItemsDetail } from '../internal/components/dropdown/interfaces';\nimport AutosuggestInput, { AutosuggestInputRef } from '../internal/components/autosuggest-input';\nimport { useFormFieldContext } from '../contexts/form-field';\nimport { useInternalI18n } from '../internal/i18n/context';\n\nimport styles from './styles.css.js';\n\nexport interface InternalAutosuggestProps extends AutosuggestProps, InternalBaseComponentProps {}\n\nconst InternalAutosuggest = React.forwardRef((props: InternalAutosuggestProps, ref: Ref<AutosuggestProps.Ref>) => {\n const {\n value,\n onChange,\n onBlur,\n onFocus,\n onKeyUp,\n onLoadItems,\n options,\n filteringType = 'auto',\n statusType = 'finished',\n recoveryText,\n placeholder,\n clearAriaLabel,\n name,\n disabled,\n disableBrowserAutocorrect = false,\n autoFocus,\n readOnly,\n ariaLabel,\n ariaRequired,\n enteredTextLabel,\n onKeyDown,\n virtualScroll,\n expandToViewport,\n onSelect,\n renderHighlightedAriaLive,\n __internalRootRef,\n ...restProps\n } = props;\n\n checkControlled('Autosuggest', 'value', value, 'onChange', onChange);\n checkOptionValueField('Autosuggest', 'options', options);\n\n const autosuggestInputRef = useRef<AutosuggestInputRef>(null);\n useImperativeHandle(\n ref,\n () => ({\n focus: () => autosuggestInputRef.current?.focus(),\n select: () => autosuggestInputRef.current?.select(),\n }),\n []\n );\n\n const i18n = useInternalI18n('autosuggest');\n const errorIconAriaLabel = i18n('errorIconAriaLabel', restProps.errorIconAriaLabel);\n const selectedAriaLabel = i18n('selectedAriaLabel', restProps.selectedAriaLabel);\n\n const [autosuggestItemsState, autosuggestItemsHandlers] = useAutosuggestItems({\n options: options || [],\n filterValue: value,\n filterText: value,\n filteringType,\n hideEnteredTextLabel: false,\n onSelectItem: (option: AutosuggestItem) => {\n const value = option.value || '';\n fireNonCancelableEvent(onChange, { value });\n fireNonCancelableEvent(onSelect, {\n value,\n selectedOption: option.type !== 'use-entered' ? option.option : undefined,\n });\n autosuggestInputRef.current?.close();\n },\n });\n\n const autosuggestLoadMoreHandlers = useAutosuggestLoadMore({\n options,\n statusType,\n onLoadItems: (detail: OptionsLoadItemsDetail) => fireNonCancelableEvent(onLoadItems, detail),\n });\n\n const handleChange = (event: NonCancelableCustomEvent<BaseChangeDetail>) => {\n autosuggestItemsHandlers.setShowAll(false);\n autosuggestItemsHandlers.resetHighlightWithKeyboard();\n fireNonCancelableEvent(onChange, event.detail);\n };\n\n const handleDelayedInput = (event: NonCancelableCustomEvent<BaseChangeDetail>) => {\n autosuggestLoadMoreHandlers.fireLoadMoreOnInputChange(event.detail.value);\n };\n\n const handleBlur = () => {\n fireNonCancelableEvent(onBlur, null);\n };\n\n const handleFocus = () => {\n autosuggestItemsHandlers.setShowAll(true);\n autosuggestLoadMoreHandlers.fireLoadMoreOnInputFocus();\n fireNonCancelableEvent(onFocus, null);\n };\n\n const handleKeyUp = (e: CustomEvent<BaseKeyDetail>) => {\n fireCancelableEvent(onKeyUp, e.detail);\n };\n\n const handleKeyDown = (e: CustomEvent<BaseKeyDetail>) => {\n fireCancelableEvent(onKeyDown, e.detail);\n };\n\n const handlePressArrowDown = () => {\n autosuggestItemsHandlers.moveHighlightWithKeyboard(1);\n };\n\n const handlePressArrowUp = () => {\n autosuggestItemsHandlers.moveHighlightWithKeyboard(-1);\n };\n\n const handlePressEnter = () => {\n return autosuggestItemsHandlers.selectHighlightedOptionWithKeyboard();\n };\n\n const handleCloseDropdown = () => {\n autosuggestItemsHandlers.resetHighlightWithKeyboard();\n };\n\n const handleRecoveryClick = () => {\n autosuggestLoadMoreHandlers.fireLoadMoreOnRecoveryClick();\n autosuggestInputRef.current?.focus();\n };\n\n const formFieldContext = useFormFieldContext(restProps);\n const selfControlId = useUniqueId('input');\n const controlId = formFieldContext.controlId ?? selfControlId;\n const listId = useUniqueId('list');\n const highlightedOptionIdSource = useUniqueId();\n const highlightedOptionId = autosuggestItemsState.highlightedOption ? highlightedOptionIdSource : undefined;\n\n const isEmpty = !value && !autosuggestItemsState.items.length;\n const dropdownStatus = useDropdownStatus({\n ...props,\n isEmpty,\n recoveryText,\n errorIconAriaLabel,\n onRecoveryClick: handleRecoveryClick,\n });\n\n return (\n <AutosuggestInput\n {...restProps}\n className={clsx(styles.root, restProps.className)}\n ref={autosuggestInputRef}\n __internalRootRef={__internalRootRef}\n value={value}\n onChange={handleChange}\n onBlur={handleBlur}\n onFocus={handleFocus}\n onKeyUp={handleKeyUp}\n onKeyDown={handleKeyDown}\n name={name}\n controlId={controlId}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n autoFocus={autoFocus}\n ariaLabel={ariaLabel}\n ariaRequired={ariaRequired}\n clearAriaLabel={clearAriaLabel}\n disableBrowserAutocorrect={disableBrowserAutocorrect}\n expandToViewport={expandToViewport}\n ariaControls={listId}\n ariaActivedescendant={highlightedOptionId}\n dropdownExpanded={autosuggestItemsState.items.length > 1 || dropdownStatus.content !== null}\n dropdownContent={\n <AutosuggestOptionsList\n autosuggestItemsState={autosuggestItemsState}\n autosuggestItemsHandlers={autosuggestItemsHandlers}\n highlightedOptionId={highlightedOptionId}\n highlightText={value}\n listId={listId}\n controlId={controlId}\n enteredTextLabel={enteredTextLabel}\n handleLoadMore={autosuggestLoadMoreHandlers.fireLoadMoreOnScroll}\n hasDropdownStatus={dropdownStatus.content !== null}\n virtualScroll={virtualScroll}\n selectedAriaLabel={selectedAriaLabel}\n renderHighlightedAriaLive={renderHighlightedAriaLive}\n listBottom={!dropdownStatus.isSticky ? <DropdownFooter content={dropdownStatus.content} /> : null}\n />\n }\n dropdownFooter={\n dropdownStatus.isSticky ? (\n <DropdownFooter content={dropdownStatus.content} hasItems={autosuggestItemsState.items.length >= 1} />\n ) : null\n }\n loopFocus={statusType === 'error' && !!recoveryText}\n onCloseDropdown={handleCloseDropdown}\n onDelayedInput={handleDelayedInput}\n onPressArrowDown={handlePressArrowDown}\n onPressArrowUp={handlePressArrowUp}\n onPressEnter={handlePressEnter}\n />\n );\n});\n\nexport default InternalAutosuggest;\n"]}
|
|
@@ -5,7 +5,7 @@ import clsx from 'clsx';
|
|
|
5
5
|
import styles from './styles.css.js';
|
|
6
6
|
import InternalHeader from '../header/internal';
|
|
7
7
|
import ScreenreaderOnly from '../internal/components/screenreader-only';
|
|
8
|
-
import {
|
|
8
|
+
import { useUniqueId } from '../internal/hooks/use-unique-id';
|
|
9
9
|
import { isDevelopment } from '../internal/is-development';
|
|
10
10
|
import { warnOnce } from '../internal/logging';
|
|
11
11
|
const ExpandableDefaultHeader = ({ id, className, onClick, ariaLabel, ariaControls, expanded, children, icon, onKeyUp, onKeyDown, variant, }) => {
|
|
@@ -22,7 +22,7 @@ const ExpandableNavigationHeader = ({ id, className, onClick, ariaLabelledBy, ar
|
|
|
22
22
|
};
|
|
23
23
|
const ExpandableContainerHeader = ({ id, className, onClick, ariaLabel, ariaControls, expanded, children, icon, headerDescription, headerCounter, variant, headingTagOverride, onKeyUp, onKeyDown, }) => {
|
|
24
24
|
const focusVisible = useFocusVisible();
|
|
25
|
-
const screenreaderContentId =
|
|
25
|
+
const screenreaderContentId = useUniqueId('expandable-section-header-content-');
|
|
26
26
|
const Wrapper = variant === 'container'
|
|
27
27
|
? ({ children }) => (React.createElement(InternalHeader, { variant: "h2", description: headerDescription, counter: headerCounter, headingTagOverride: headingTagOverride }, children))
|
|
28
28
|
: ({ children }) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"expandable-section-header.js","sourceRoot":"lib/default/","sources":["expandable-section/expandable-section-header.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 { ExpandableSectionProps } from './interfaces';\nimport React, { KeyboardEventHandler, MouseEventHandler, ReactNode } from 'react';\nimport useFocusVisible from '../internal/hooks/focus-visible';\nimport InternalIcon from '../icon/internal';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport InternalHeader from '../header/internal';\nimport ScreenreaderOnly from '../internal/components/screenreader-only';\nimport { generateUniqueId } from '../internal/hooks/use-unique-id';\nimport { isDevelopment } from '../internal/is-development';\nimport { warnOnce } from '../internal/logging';\n\ninterface ExpandableDefaultHeaderProps {\n id: string;\n className?: string;\n children?: ReactNode;\n expanded: boolean;\n ariaControls: string;\n ariaLabel?: string;\n onKeyUp: KeyboardEventHandler;\n onKeyDown: KeyboardEventHandler;\n onClick: MouseEventHandler;\n icon: JSX.Element;\n variant: ExpandableSectionProps.Variant;\n}\n\ninterface ExpandableNavigationHeaderProps extends Omit<ExpandableDefaultHeaderProps, 'onKeyUp' | 'onKeyDown'> {\n ariaLabelledBy?: string;\n}\n\ninterface ExpandableContainerHeaderProps extends ExpandableDefaultHeaderProps {\n headerDescription?: ReactNode;\n headerCounter?: string;\n headingTagOverride?: ExpandableSectionProps.HeadingTag;\n}\n\ninterface ExpandableSectionHeaderProps extends Omit<ExpandableDefaultHeaderProps, 'children' | 'icon'> {\n variant: ExpandableSectionProps.Variant;\n header?: ReactNode;\n headerText?: ReactNode;\n headerDescription?: ReactNode;\n headerCounter?: string;\n headingTagOverride?: ExpandableSectionProps.HeadingTag;\n ariaLabelledBy?: string;\n}\n\nconst ExpandableDefaultHeader = ({\n id,\n className,\n onClick,\n ariaLabel,\n ariaControls,\n expanded,\n children,\n icon,\n onKeyUp,\n onKeyDown,\n variant,\n}: ExpandableDefaultHeaderProps) => {\n const focusVisible = useFocusVisible();\n return (\n <div\n id={id}\n role=\"button\"\n className={className}\n tabIndex={0}\n onKeyUp={onKeyUp}\n onKeyDown={onKeyDown}\n onClick={onClick}\n aria-label={ariaLabel}\n aria-controls={ariaControls}\n aria-expanded={expanded}\n {...focusVisible}\n >\n <div className={clsx(styles['icon-container'], styles[`icon-container-${variant}`])}>{icon}</div>\n {children}\n </div>\n );\n};\n\nconst ExpandableNavigationHeader = ({\n id,\n className,\n onClick,\n ariaLabelledBy,\n ariaLabel,\n ariaControls,\n expanded,\n children,\n icon,\n}: ExpandableNavigationHeaderProps) => {\n const focusVisible = useFocusVisible();\n return (\n <div id={id} className={className} onClick={onClick}>\n <button\n className={styles['icon-container']}\n aria-labelledby={ariaLabelledBy}\n aria-label={ariaLabel}\n aria-controls={ariaControls}\n aria-expanded={expanded}\n {...focusVisible}\n >\n {icon}\n </button>\n {children}\n </div>\n );\n};\n\nconst ExpandableContainerHeader = ({\n id,\n className,\n onClick,\n ariaLabel,\n ariaControls,\n expanded,\n children,\n icon,\n headerDescription,\n headerCounter,\n variant,\n headingTagOverride,\n onKeyUp,\n onKeyDown,\n}: ExpandableContainerHeaderProps) => {\n const focusVisible = useFocusVisible();\n const screenreaderContentId = generateUniqueId('expandable-section-header-content-');\n const Wrapper =\n variant === 'container'\n ? ({ children }: { children: ReactNode }) => (\n <InternalHeader\n variant=\"h2\"\n description={headerDescription}\n counter={headerCounter}\n headingTagOverride={headingTagOverride}\n >\n {children}\n </InternalHeader>\n )\n : ({ children }: { children: ReactNode }) => {\n const Tag = headingTagOverride || 'div';\n return <Tag className={styles['header-wrapper']}>{children}</Tag>;\n };\n return (\n <div id={id} className={className} onClick={onClick} {...focusVisible}>\n <Wrapper>\n <span\n className={styles['header-container-button']}\n role=\"button\"\n tabIndex={0}\n onKeyUp={onKeyUp}\n onKeyDown={onKeyDown}\n aria-label={ariaLabel}\n // Do not use aria-labelledby={id} but ScreenreaderOnly because safari+VO does not read headerText in this case.\n aria-labelledby={ariaLabel ? undefined : screenreaderContentId}\n aria-controls={ariaControls}\n aria-expanded={expanded}\n >\n <span className={clsx(styles['icon-container'], styles[`icon-container-${variant}`])}>{icon}</span>\n <span>{children}</span>\n </span>\n </Wrapper>\n <ScreenreaderOnly id={screenreaderContentId}>\n {children} {headerCounter} {headerDescription}\n </ScreenreaderOnly>\n </div>\n );\n};\n\nexport const ExpandableSectionHeader = ({\n id,\n className,\n variant,\n header,\n headerText,\n headerDescription,\n headerCounter,\n headingTagOverride,\n expanded,\n ariaControls,\n ariaLabel,\n ariaLabelledBy,\n onKeyUp,\n onKeyDown,\n onClick,\n}: ExpandableSectionHeaderProps) => {\n const icon = (\n <InternalIcon\n size={variant === 'container' ? 'medium' : 'normal'}\n className={clsx(styles.icon, expanded && styles.expanded)}\n name=\"caret-down-filled\"\n />\n );\n const defaultHeaderProps = {\n id: id,\n icon: icon,\n expanded: expanded,\n ariaControls: ariaControls,\n ariaLabel: ariaLabel,\n onClick: onClick,\n variant,\n };\n\n const triggerClassName = clsx(styles.trigger, styles[`trigger-${variant}`], expanded && styles['trigger-expanded']);\n if (variant === 'navigation') {\n return (\n <ExpandableNavigationHeader\n className={clsx(className, triggerClassName)}\n ariaLabelledBy={ariaLabelledBy}\n {...defaultHeaderProps}\n >\n {headerText ?? header}\n </ExpandableNavigationHeader>\n );\n }\n\n if (headerText) {\n return (\n <ExpandableContainerHeader\n className={clsx(className, triggerClassName, expanded && styles.expanded)}\n headerDescription={headerDescription}\n headerCounter={headerCounter}\n headingTagOverride={headingTagOverride}\n onKeyUp={onKeyUp}\n onKeyDown={onKeyDown}\n {...defaultHeaderProps}\n >\n {headerText}\n </ExpandableContainerHeader>\n );\n }\n\n if (variant === 'container' && header && isDevelopment) {\n warnOnce(\n 'ExpandableSection',\n 'Use `headerText` instead of `header` to provide the button within the heading for a11y.'\n );\n }\n\n return (\n <ExpandableDefaultHeader\n className={clsx(className, triggerClassName, styles.focusable, expanded && styles.expanded)}\n onKeyUp={onKeyUp}\n onKeyDown={onKeyDown}\n {...defaultHeaderProps}\n >\n {headerText ?? header}\n </ExpandableDefaultHeader>\n );\n};\n"]}
|
|
1
|
+
{"version":3,"file":"expandable-section-header.js","sourceRoot":"lib/default/","sources":["expandable-section/expandable-section-header.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 { ExpandableSectionProps } from './interfaces';\nimport React, { KeyboardEventHandler, MouseEventHandler, ReactNode } from 'react';\nimport useFocusVisible from '../internal/hooks/focus-visible';\nimport InternalIcon from '../icon/internal';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport InternalHeader from '../header/internal';\nimport ScreenreaderOnly from '../internal/components/screenreader-only';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { isDevelopment } from '../internal/is-development';\nimport { warnOnce } from '../internal/logging';\n\ninterface ExpandableDefaultHeaderProps {\n id: string;\n className?: string;\n children?: ReactNode;\n expanded: boolean;\n ariaControls: string;\n ariaLabel?: string;\n onKeyUp: KeyboardEventHandler;\n onKeyDown: KeyboardEventHandler;\n onClick: MouseEventHandler;\n icon: JSX.Element;\n variant: ExpandableSectionProps.Variant;\n}\n\ninterface ExpandableNavigationHeaderProps extends Omit<ExpandableDefaultHeaderProps, 'onKeyUp' | 'onKeyDown'> {\n ariaLabelledBy?: string;\n}\n\ninterface ExpandableContainerHeaderProps extends ExpandableDefaultHeaderProps {\n headerDescription?: ReactNode;\n headerCounter?: string;\n headingTagOverride?: ExpandableSectionProps.HeadingTag;\n}\n\ninterface ExpandableSectionHeaderProps extends Omit<ExpandableDefaultHeaderProps, 'children' | 'icon'> {\n variant: ExpandableSectionProps.Variant;\n header?: ReactNode;\n headerText?: ReactNode;\n headerDescription?: ReactNode;\n headerCounter?: string;\n headingTagOverride?: ExpandableSectionProps.HeadingTag;\n ariaLabelledBy?: string;\n}\n\nconst ExpandableDefaultHeader = ({\n id,\n className,\n onClick,\n ariaLabel,\n ariaControls,\n expanded,\n children,\n icon,\n onKeyUp,\n onKeyDown,\n variant,\n}: ExpandableDefaultHeaderProps) => {\n const focusVisible = useFocusVisible();\n return (\n <div\n id={id}\n role=\"button\"\n className={className}\n tabIndex={0}\n onKeyUp={onKeyUp}\n onKeyDown={onKeyDown}\n onClick={onClick}\n aria-label={ariaLabel}\n aria-controls={ariaControls}\n aria-expanded={expanded}\n {...focusVisible}\n >\n <div className={clsx(styles['icon-container'], styles[`icon-container-${variant}`])}>{icon}</div>\n {children}\n </div>\n );\n};\n\nconst ExpandableNavigationHeader = ({\n id,\n className,\n onClick,\n ariaLabelledBy,\n ariaLabel,\n ariaControls,\n expanded,\n children,\n icon,\n}: ExpandableNavigationHeaderProps) => {\n const focusVisible = useFocusVisible();\n return (\n <div id={id} className={className} onClick={onClick}>\n <button\n className={styles['icon-container']}\n aria-labelledby={ariaLabelledBy}\n aria-label={ariaLabel}\n aria-controls={ariaControls}\n aria-expanded={expanded}\n {...focusVisible}\n >\n {icon}\n </button>\n {children}\n </div>\n );\n};\n\nconst ExpandableContainerHeader = ({\n id,\n className,\n onClick,\n ariaLabel,\n ariaControls,\n expanded,\n children,\n icon,\n headerDescription,\n headerCounter,\n variant,\n headingTagOverride,\n onKeyUp,\n onKeyDown,\n}: ExpandableContainerHeaderProps) => {\n const focusVisible = useFocusVisible();\n const screenreaderContentId = useUniqueId('expandable-section-header-content-');\n const Wrapper =\n variant === 'container'\n ? ({ children }: { children: ReactNode }) => (\n <InternalHeader\n variant=\"h2\"\n description={headerDescription}\n counter={headerCounter}\n headingTagOverride={headingTagOverride}\n >\n {children}\n </InternalHeader>\n )\n : ({ children }: { children: ReactNode }) => {\n const Tag = headingTagOverride || 'div';\n return <Tag className={styles['header-wrapper']}>{children}</Tag>;\n };\n return (\n <div id={id} className={className} onClick={onClick} {...focusVisible}>\n <Wrapper>\n <span\n className={styles['header-container-button']}\n role=\"button\"\n tabIndex={0}\n onKeyUp={onKeyUp}\n onKeyDown={onKeyDown}\n aria-label={ariaLabel}\n // Do not use aria-labelledby={id} but ScreenreaderOnly because safari+VO does not read headerText in this case.\n aria-labelledby={ariaLabel ? undefined : screenreaderContentId}\n aria-controls={ariaControls}\n aria-expanded={expanded}\n >\n <span className={clsx(styles['icon-container'], styles[`icon-container-${variant}`])}>{icon}</span>\n <span>{children}</span>\n </span>\n </Wrapper>\n <ScreenreaderOnly id={screenreaderContentId}>\n {children} {headerCounter} {headerDescription}\n </ScreenreaderOnly>\n </div>\n );\n};\n\nexport const ExpandableSectionHeader = ({\n id,\n className,\n variant,\n header,\n headerText,\n headerDescription,\n headerCounter,\n headingTagOverride,\n expanded,\n ariaControls,\n ariaLabel,\n ariaLabelledBy,\n onKeyUp,\n onKeyDown,\n onClick,\n}: ExpandableSectionHeaderProps) => {\n const icon = (\n <InternalIcon\n size={variant === 'container' ? 'medium' : 'normal'}\n className={clsx(styles.icon, expanded && styles.expanded)}\n name=\"caret-down-filled\"\n />\n );\n const defaultHeaderProps = {\n id: id,\n icon: icon,\n expanded: expanded,\n ariaControls: ariaControls,\n ariaLabel: ariaLabel,\n onClick: onClick,\n variant,\n };\n\n const triggerClassName = clsx(styles.trigger, styles[`trigger-${variant}`], expanded && styles['trigger-expanded']);\n if (variant === 'navigation') {\n return (\n <ExpandableNavigationHeader\n className={clsx(className, triggerClassName)}\n ariaLabelledBy={ariaLabelledBy}\n {...defaultHeaderProps}\n >\n {headerText ?? header}\n </ExpandableNavigationHeader>\n );\n }\n\n if (headerText) {\n return (\n <ExpandableContainerHeader\n className={clsx(className, triggerClassName, expanded && styles.expanded)}\n headerDescription={headerDescription}\n headerCounter={headerCounter}\n headingTagOverride={headingTagOverride}\n onKeyUp={onKeyUp}\n onKeyDown={onKeyDown}\n {...defaultHeaderProps}\n >\n {headerText}\n </ExpandableContainerHeader>\n );\n }\n\n if (variant === 'container' && header && isDevelopment) {\n warnOnce(\n 'ExpandableSection',\n 'Use `headerText` instead of `header` to provide the button within the heading for a11y.'\n );\n }\n\n return (\n <ExpandableDefaultHeader\n className={clsx(className, triggerClassName, styles.focusable, expanded && styles.expanded)}\n onKeyUp={onKeyUp}\n onKeyDown={onKeyDown}\n {...defaultHeaderProps}\n >\n {headerText ?? header}\n </ExpandableDefaultHeader>\n );\n};\n"]}
|
package/internal/environment.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/hooks/use-unique-id/index.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/hooks/use-unique-id/index.ts"],"names":[],"mappings":"AAeA,wBAAgB,WAAW,CAAC,MAAM,CAAC,EAAE,MAAM,UAE1C"}
|
|
@@ -1,15 +1,17 @@
|
|
|
1
|
+
var _a;
|
|
1
2
|
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
3
|
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
-
import { useRef } from 'react';
|
|
4
|
+
import React, { useRef } from 'react';
|
|
4
5
|
let counter = 0;
|
|
5
|
-
|
|
6
|
-
return `${prefix ? prefix : ''}${counter++}-${Date.now()}-${Math.round(Math.random() * 10000)}`;
|
|
7
|
-
}
|
|
8
|
-
export function useUniqueId(prefix) {
|
|
6
|
+
const useIdFallback = () => {
|
|
9
7
|
const idRef = useRef(null);
|
|
10
8
|
if (!idRef.current) {
|
|
11
|
-
idRef.current =
|
|
9
|
+
idRef.current = `${counter++}-${Date.now()}-${Math.round(Math.random() * 10000)}`;
|
|
12
10
|
}
|
|
13
11
|
return idRef.current;
|
|
12
|
+
};
|
|
13
|
+
const useId = (_a = React.useId) !== null && _a !== void 0 ? _a : useIdFallback;
|
|
14
|
+
export function useUniqueId(prefix) {
|
|
15
|
+
return `${prefix ? prefix : ''}` + useId();
|
|
14
16
|
}
|
|
15
17
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/hooks/use-unique-id/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/hooks/use-unique-id/index.ts"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEtC,IAAI,OAAO,GAAG,CAAC,CAAC;AAChB,MAAM,aAAa,GAAG,GAAG,EAAE;IACzB,MAAM,KAAK,GAAG,MAAM,CAAgB,IAAI,CAAC,CAAC;IAC1C,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE;QAClB,KAAK,CAAC,OAAO,GAAG,GAAG,OAAO,EAAE,IAAI,IAAI,CAAC,GAAG,EAAE,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,KAAK,CAAC,EAAE,CAAC;KACnF;IACD,OAAO,KAAK,CAAC,OAAO,CAAC;AACvB,CAAC,CAAC;AAEF,MAAM,KAAK,GAAyB,MAAC,KAAa,CAAC,KAAK,mCAAI,aAAa,CAAC;AAE1E,MAAM,UAAU,WAAW,CAAC,MAAe;IACzC,OAAO,GAAG,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,GAAG,KAAK,EAAE,CAAC;AAC7C,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\n\nlet counter = 0;\nconst useIdFallback = () => {\n const idRef = useRef<string | null>(null);\n if (!idRef.current) {\n idRef.current = `${counter++}-${Date.now()}-${Math.round(Math.random() * 10000)}`;\n }\n return idRef.current;\n};\n\nconst useId: typeof useIdFallback = (React as any).useId ?? useIdFallback;\n\nexport function useUniqueId(prefix?: string) {\n return `${prefix ? prefix : ''}` + useId();\n}\n"]}
|
package/internal/manifest.json
CHANGED
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"property-filter-autosuggest.d.ts","sourceRoot":"lib/default/","sources":["property-filter/property-filter-autosuggest.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAGpD,OAAO,EAAmB,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAM9E,OAAO,EAEL,sBAAsB,EAGvB,MAAM,oBAAoB,CAAC;AAK5B,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAIlF,OAAyB,EAAE,mBAAmB,EAAE,MAAM,0CAA0C,CAAC;AASjG,MAAM,WAAW,8BAA+B,SAAQ,gBAAgB,EAAE,0BAA0B;IAClG,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,sBAAsB,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChE,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,QAAA,MAAM,yBAAyB,
|
|
1
|
+
{"version":3,"file":"property-filter-autosuggest.d.ts","sourceRoot":"lib/default/","sources":["property-filter/property-filter-autosuggest.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAGpD,OAAO,EAAmB,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAM9E,OAAO,EAEL,sBAAsB,EAGvB,MAAM,oBAAoB,CAAC;AAK5B,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAIlF,OAAyB,EAAE,mBAAmB,EAAE,MAAM,0CAA0C,CAAC;AASjG,MAAM,WAAW,8BAA+B,SAAQ,gBAAgB,EAAE,0BAA0B;IAClG,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,sBAAsB,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChE,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,QAAA,MAAM,yBAAyB,4GA2K9B,CAAC;AAEF,eAAe,yBAAyB,CAAC"}
|
|
@@ -5,7 +5,7 @@ import React, { useMemo, useRef } from 'react';
|
|
|
5
5
|
import { useAutosuggestItems } from '../autosuggest/options-controller';
|
|
6
6
|
import { useDropdownStatus } from '../internal/components/dropdown-status';
|
|
7
7
|
import DropdownFooter from '../internal/components/dropdown-footer';
|
|
8
|
-
import {
|
|
8
|
+
import { useUniqueId } from '../internal/hooks/use-unique-id';
|
|
9
9
|
import { fireNonCancelableEvent, } from '../internal/events';
|
|
10
10
|
import autosuggestStyles from '../autosuggest/styles.css.js';
|
|
11
11
|
import styles from './styles.css.js';
|
|
@@ -92,7 +92,8 @@ const PropertyFilterAutosuggest = React.forwardRef((props, ref) => {
|
|
|
92
92
|
const selfControlId = useUniqueId('input');
|
|
93
93
|
const controlId = (_a = rest.controlId) !== null && _a !== void 0 ? _a : selfControlId;
|
|
94
94
|
const listId = useUniqueId('list');
|
|
95
|
-
const
|
|
95
|
+
const highlightedOptionIdSource = useUniqueId();
|
|
96
|
+
const highlightedOptionId = autosuggestItemsState.highlightedOption ? highlightedOptionIdSource : undefined;
|
|
96
97
|
const isEmpty = !value && !autosuggestItemsState.items.length;
|
|
97
98
|
const dropdownStatus = useDropdownStatus(Object.assign(Object.assign({}, props), { isEmpty, onRecoveryClick: handleRecoveryClick }));
|
|
98
99
|
let content = null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"property-filter-autosuggest.js","sourceRoot":"lib/default/","sources":["property-filter/property-filter-autosuggest.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { Ref, useMemo, useRef } from 'react';\n\nimport { useAutosuggestItems } from '../autosuggest/options-controller';\nimport { AutosuggestItem, AutosuggestProps } from '../autosuggest/interfaces';\n\nimport { useDropdownStatus } from '../internal/components/dropdown-status';\nimport DropdownFooter from '../internal/components/dropdown-footer';\n\nimport { generateUniqueId, useUniqueId } from '../internal/hooks/use-unique-id';\nimport {\n fireNonCancelableEvent,\n CancelableEventHandler,\n NonCancelableCustomEvent,\n BaseKeyDetail,\n} from '../internal/events';\nimport { BaseChangeDetail } from '../input/interfaces';\nimport autosuggestStyles from '../autosuggest/styles.css.js';\nimport styles from './styles.css.js';\nimport { fireCancelableEvent } from '../internal/events/index';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport AutosuggestOptionsList from '../autosuggest/options-list';\nimport { useAutosuggestLoadMore } from '../autosuggest/load-more-controller';\nimport { OptionsLoadItemsDetail } from '../internal/components/dropdown/interfaces';\nimport AutosuggestInput, { AutosuggestInputRef } from '../internal/components/autosuggest-input';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport clsx from 'clsx';\nimport { getFirstFocusable } from '../internal/components/focus-lock/utils';\nimport { filterOptions } from './filter-options';\n\nconst DROPDOWN_WIDTH_OPTIONS_LIST = 300;\nconst DROPDOWN_WIDTH_CUSTOM_FORM = 200;\n\nexport interface PropertyFilterAutosuggestProps extends AutosuggestProps, InternalBaseComponentProps {\n customForm?: React.ReactNode;\n filterText?: string;\n onOptionClick?: CancelableEventHandler<AutosuggestProps.Option>;\n hideEnteredTextOption?: boolean;\n searchResultsId?: string;\n}\n\nconst PropertyFilterAutosuggest = React.forwardRef(\n (props: PropertyFilterAutosuggestProps, ref: Ref<AutosuggestInputRef>) => {\n const {\n value,\n onChange,\n onFocus,\n onBlur,\n onLoadItems,\n options,\n statusType = 'finished',\n placeholder,\n disabled,\n ariaLabel,\n enteredTextLabel,\n onKeyDown,\n virtualScroll,\n expandToViewport,\n customForm,\n filterText,\n onOptionClick,\n hideEnteredTextOption,\n searchResultsId,\n ...rest\n } = props;\n const highlightText = filterText === undefined ? value : filterText;\n\n const customFormRef = useRef<HTMLDivElement>(null);\n const autosuggestInputRef = useRef<AutosuggestInputRef>(null);\n const mergedRef = useMergeRefs(autosuggestInputRef, ref);\n\n const filteredOptions = useMemo(() => filterOptions(options || [], highlightText), [options, highlightText]);\n const [autosuggestItemsState, autosuggestItemsHandlers] = useAutosuggestItems({\n options: filteredOptions,\n filterValue: value,\n filterText: highlightText,\n filteringType: 'manual',\n hideEnteredTextLabel: hideEnteredTextOption,\n onSelectItem: (option: AutosuggestItem) => {\n const value = option.value || '';\n fireNonCancelableEvent(onChange, { value });\n const selectedCancelled = fireCancelableEvent(onOptionClick, option);\n if (!selectedCancelled) {\n autosuggestInputRef.current?.close();\n } else {\n autosuggestItemsHandlers.resetHighlightWithKeyboard();\n }\n },\n });\n\n const autosuggestLoadMoreHandlers = useAutosuggestLoadMore({\n options,\n statusType,\n onLoadItems: (detail: OptionsLoadItemsDetail) => fireNonCancelableEvent(onLoadItems, detail),\n });\n\n const handleChange = (event: NonCancelableCustomEvent<BaseChangeDetail>) => {\n autosuggestItemsHandlers.resetHighlightWithKeyboard();\n fireNonCancelableEvent(onChange, event.detail);\n };\n\n const handleDelayedInput = (event: NonCancelableCustomEvent<BaseChangeDetail>) => {\n autosuggestLoadMoreHandlers.fireLoadMoreOnInputChange(event.detail.value);\n };\n\n const handleFocus = () => {\n autosuggestLoadMoreHandlers.fireLoadMoreOnInputFocus();\n fireCancelableEvent(onFocus, null);\n };\n\n const handleBlur = () => {\n fireCancelableEvent(onBlur, null);\n };\n\n const handleKeyDown = (e: CustomEvent<BaseKeyDetail>) => {\n fireCancelableEvent(onKeyDown, e.detail);\n };\n\n const handlePressArrowDown = () => {\n autosuggestItemsHandlers.moveHighlightWithKeyboard(1);\n if (customFormRef.current) {\n getFirstFocusable(customFormRef.current)?.focus();\n }\n };\n\n const handlePressArrowUp = () => {\n autosuggestItemsHandlers.moveHighlightWithKeyboard(-1);\n };\n\n const handlePressEnter = () => {\n return autosuggestItemsHandlers.selectHighlightedOptionWithKeyboard();\n };\n\n const handleCloseDropdown = () => {\n autosuggestItemsHandlers.resetHighlightWithKeyboard();\n };\n\n const handleRecoveryClick = () => {\n autosuggestLoadMoreHandlers.fireLoadMoreOnRecoveryClick();\n autosuggestInputRef.current?.focus();\n };\n\n const selfControlId = useUniqueId('input');\n const controlId = rest.controlId ?? selfControlId;\n const listId = useUniqueId('list');\n const highlightedOptionId = autosuggestItemsState.highlightedOption ? generateUniqueId() : undefined;\n\n const isEmpty = !value && !autosuggestItemsState.items.length;\n const dropdownStatus = useDropdownStatus({ ...props, isEmpty, onRecoveryClick: handleRecoveryClick });\n\n let content = null;\n if (customForm) {\n content = (\n <div ref={customFormRef} className={styles['custom-content-wrapper']}>\n {customForm}\n </div>\n );\n } else if (autosuggestItemsState.items.length > 0) {\n content = (\n <AutosuggestOptionsList\n autosuggestItemsState={autosuggestItemsState}\n autosuggestItemsHandlers={autosuggestItemsHandlers}\n highlightedOptionId={highlightedOptionId}\n highlightText={highlightText}\n listId={listId}\n controlId={controlId}\n enteredTextLabel={enteredTextLabel}\n handleLoadMore={autosuggestLoadMoreHandlers.fireLoadMoreOnScroll}\n hasDropdownStatus={dropdownStatus.content !== null}\n virtualScroll={virtualScroll}\n listBottom={!dropdownStatus.isSticky ? <DropdownFooter content={dropdownStatus.content} /> : null}\n />\n );\n }\n\n return (\n <AutosuggestInput\n ref={mergedRef}\n {...rest}\n className={clsx(autosuggestStyles.root, styles.input)}\n value={value}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n controlId={controlId}\n placeholder={placeholder}\n disabled={disabled}\n ariaLabel={ariaLabel}\n expandToViewport={expandToViewport}\n ariaControls={listId}\n ariaActivedescendant={highlightedOptionId}\n ariaDescribedby={searchResultsId}\n dropdownExpanded={autosuggestItemsState.items.length > 1 || dropdownStatus.content !== null || !!customForm}\n dropdownContentKey={customForm ? 'custom' : 'options'}\n dropdownContent={content}\n dropdownFooter={\n dropdownStatus.isSticky ? (\n <DropdownFooter content={dropdownStatus.content} hasItems={autosuggestItemsState.items.length >= 1} />\n ) : null\n }\n dropdownWidth={customForm ? DROPDOWN_WIDTH_CUSTOM_FORM : DROPDOWN_WIDTH_OPTIONS_LIST}\n dropdownContentFocusable={!!customForm}\n onCloseDropdown={handleCloseDropdown}\n onDelayedInput={handleDelayedInput}\n onPressArrowDown={handlePressArrowDown}\n onPressArrowUp={handlePressArrowUp}\n onPressEnter={handlePressEnter}\n />\n );\n }\n);\n\nexport default PropertyFilterAutosuggest;\n"]}
|
|
1
|
+
{"version":3,"file":"property-filter-autosuggest.js","sourceRoot":"lib/default/","sources":["property-filter/property-filter-autosuggest.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { Ref, useMemo, useRef } from 'react';\n\nimport { useAutosuggestItems } from '../autosuggest/options-controller';\nimport { AutosuggestItem, AutosuggestProps } from '../autosuggest/interfaces';\n\nimport { useDropdownStatus } from '../internal/components/dropdown-status';\nimport DropdownFooter from '../internal/components/dropdown-footer';\n\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport {\n fireNonCancelableEvent,\n CancelableEventHandler,\n NonCancelableCustomEvent,\n BaseKeyDetail,\n} from '../internal/events';\nimport { BaseChangeDetail } from '../input/interfaces';\nimport autosuggestStyles from '../autosuggest/styles.css.js';\nimport styles from './styles.css.js';\nimport { fireCancelableEvent } from '../internal/events/index';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport AutosuggestOptionsList from '../autosuggest/options-list';\nimport { useAutosuggestLoadMore } from '../autosuggest/load-more-controller';\nimport { OptionsLoadItemsDetail } from '../internal/components/dropdown/interfaces';\nimport AutosuggestInput, { AutosuggestInputRef } from '../internal/components/autosuggest-input';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport clsx from 'clsx';\nimport { getFirstFocusable } from '../internal/components/focus-lock/utils';\nimport { filterOptions } from './filter-options';\n\nconst DROPDOWN_WIDTH_OPTIONS_LIST = 300;\nconst DROPDOWN_WIDTH_CUSTOM_FORM = 200;\n\nexport interface PropertyFilterAutosuggestProps extends AutosuggestProps, InternalBaseComponentProps {\n customForm?: React.ReactNode;\n filterText?: string;\n onOptionClick?: CancelableEventHandler<AutosuggestProps.Option>;\n hideEnteredTextOption?: boolean;\n searchResultsId?: string;\n}\n\nconst PropertyFilterAutosuggest = React.forwardRef(\n (props: PropertyFilterAutosuggestProps, ref: Ref<AutosuggestInputRef>) => {\n const {\n value,\n onChange,\n onFocus,\n onBlur,\n onLoadItems,\n options,\n statusType = 'finished',\n placeholder,\n disabled,\n ariaLabel,\n enteredTextLabel,\n onKeyDown,\n virtualScroll,\n expandToViewport,\n customForm,\n filterText,\n onOptionClick,\n hideEnteredTextOption,\n searchResultsId,\n ...rest\n } = props;\n const highlightText = filterText === undefined ? value : filterText;\n\n const customFormRef = useRef<HTMLDivElement>(null);\n const autosuggestInputRef = useRef<AutosuggestInputRef>(null);\n const mergedRef = useMergeRefs(autosuggestInputRef, ref);\n\n const filteredOptions = useMemo(() => filterOptions(options || [], highlightText), [options, highlightText]);\n const [autosuggestItemsState, autosuggestItemsHandlers] = useAutosuggestItems({\n options: filteredOptions,\n filterValue: value,\n filterText: highlightText,\n filteringType: 'manual',\n hideEnteredTextLabel: hideEnteredTextOption,\n onSelectItem: (option: AutosuggestItem) => {\n const value = option.value || '';\n fireNonCancelableEvent(onChange, { value });\n const selectedCancelled = fireCancelableEvent(onOptionClick, option);\n if (!selectedCancelled) {\n autosuggestInputRef.current?.close();\n } else {\n autosuggestItemsHandlers.resetHighlightWithKeyboard();\n }\n },\n });\n\n const autosuggestLoadMoreHandlers = useAutosuggestLoadMore({\n options,\n statusType,\n onLoadItems: (detail: OptionsLoadItemsDetail) => fireNonCancelableEvent(onLoadItems, detail),\n });\n\n const handleChange = (event: NonCancelableCustomEvent<BaseChangeDetail>) => {\n autosuggestItemsHandlers.resetHighlightWithKeyboard();\n fireNonCancelableEvent(onChange, event.detail);\n };\n\n const handleDelayedInput = (event: NonCancelableCustomEvent<BaseChangeDetail>) => {\n autosuggestLoadMoreHandlers.fireLoadMoreOnInputChange(event.detail.value);\n };\n\n const handleFocus = () => {\n autosuggestLoadMoreHandlers.fireLoadMoreOnInputFocus();\n fireCancelableEvent(onFocus, null);\n };\n\n const handleBlur = () => {\n fireCancelableEvent(onBlur, null);\n };\n\n const handleKeyDown = (e: CustomEvent<BaseKeyDetail>) => {\n fireCancelableEvent(onKeyDown, e.detail);\n };\n\n const handlePressArrowDown = () => {\n autosuggestItemsHandlers.moveHighlightWithKeyboard(1);\n if (customFormRef.current) {\n getFirstFocusable(customFormRef.current)?.focus();\n }\n };\n\n const handlePressArrowUp = () => {\n autosuggestItemsHandlers.moveHighlightWithKeyboard(-1);\n };\n\n const handlePressEnter = () => {\n return autosuggestItemsHandlers.selectHighlightedOptionWithKeyboard();\n };\n\n const handleCloseDropdown = () => {\n autosuggestItemsHandlers.resetHighlightWithKeyboard();\n };\n\n const handleRecoveryClick = () => {\n autosuggestLoadMoreHandlers.fireLoadMoreOnRecoveryClick();\n autosuggestInputRef.current?.focus();\n };\n\n const selfControlId = useUniqueId('input');\n const controlId = rest.controlId ?? selfControlId;\n const listId = useUniqueId('list');\n const highlightedOptionIdSource = useUniqueId();\n const highlightedOptionId = autosuggestItemsState.highlightedOption ? highlightedOptionIdSource : undefined;\n\n const isEmpty = !value && !autosuggestItemsState.items.length;\n const dropdownStatus = useDropdownStatus({ ...props, isEmpty, onRecoveryClick: handleRecoveryClick });\n\n let content = null;\n if (customForm) {\n content = (\n <div ref={customFormRef} className={styles['custom-content-wrapper']}>\n {customForm}\n </div>\n );\n } else if (autosuggestItemsState.items.length > 0) {\n content = (\n <AutosuggestOptionsList\n autosuggestItemsState={autosuggestItemsState}\n autosuggestItemsHandlers={autosuggestItemsHandlers}\n highlightedOptionId={highlightedOptionId}\n highlightText={highlightText}\n listId={listId}\n controlId={controlId}\n enteredTextLabel={enteredTextLabel}\n handleLoadMore={autosuggestLoadMoreHandlers.fireLoadMoreOnScroll}\n hasDropdownStatus={dropdownStatus.content !== null}\n virtualScroll={virtualScroll}\n listBottom={!dropdownStatus.isSticky ? <DropdownFooter content={dropdownStatus.content} /> : null}\n />\n );\n }\n\n return (\n <AutosuggestInput\n ref={mergedRef}\n {...rest}\n className={clsx(autosuggestStyles.root, styles.input)}\n value={value}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n controlId={controlId}\n placeholder={placeholder}\n disabled={disabled}\n ariaLabel={ariaLabel}\n expandToViewport={expandToViewport}\n ariaControls={listId}\n ariaActivedescendant={highlightedOptionId}\n ariaDescribedby={searchResultsId}\n dropdownExpanded={autosuggestItemsState.items.length > 1 || dropdownStatus.content !== null || !!customForm}\n dropdownContentKey={customForm ? 'custom' : 'options'}\n dropdownContent={content}\n dropdownFooter={\n dropdownStatus.isSticky ? (\n <DropdownFooter content={dropdownStatus.content} hasItems={autosuggestItemsState.items.length >= 1} />\n ) : null\n }\n dropdownWidth={customForm ? DROPDOWN_WIDTH_CUSTOM_FORM : DROPDOWN_WIDTH_OPTIONS_LIST}\n dropdownContentFocusable={!!customForm}\n onCloseDropdown={handleCloseDropdown}\n onDelayedInput={handleDelayedInput}\n onPressArrowDown={handlePressArrowDown}\n onPressArrowUp={handlePressArrowUp}\n onPressEnter={handlePressEnter}\n />\n );\n }\n);\n\nexport default PropertyFilterAutosuggest;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"trigger.d.ts","sourceRoot":"lib/default/","sources":["select/parts/trigger.tsx"],"names":[],"mappings":"AAEA,OAAO,
|
|
1
|
+
{"version":3,"file":"trigger.d.ts","sourceRoot":"lib/default/","sources":["select/parts/trigger.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,6CAA6C,CAAC;AAC/E,OAAO,EAAE,+BAA+B,EAAE,MAAM,2CAA2C,CAAC;AAG5F,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAGzD,MAAM,WAAW,YAAa,SAAQ,+BAA+B;IACnE,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,QAAQ,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B,YAAY,EAAE,kBAAkB,CAAC;IACjC,cAAc,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACxC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,cAAc,CAAC,EAAE,WAAW,CAAC,cAAc,CAAC;IAC5C,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,QAAA,MAAM,OAAO,wFAwDZ,CAAC;AAEF,eAAe,OAAO,CAAC"}
|
package/select/parts/trigger.js
CHANGED
|
@@ -1,16 +1,17 @@
|
|
|
1
1
|
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
2
|
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
-
import React
|
|
3
|
+
import React from 'react';
|
|
4
4
|
import { useMergeRefs } from '../../internal/hooks/use-merge-refs';
|
|
5
5
|
import clsx from 'clsx';
|
|
6
6
|
import ButtonTrigger from '../../internal/components/button-trigger';
|
|
7
7
|
import styles from './styles.css.js';
|
|
8
8
|
import Option from '../../internal/components/option';
|
|
9
|
-
import {
|
|
9
|
+
import { useUniqueId } from '../../internal/hooks/use-unique-id';
|
|
10
10
|
import { joinStrings } from '../../internal/utils/strings';
|
|
11
11
|
const Trigger = React.forwardRef(({ ariaLabelledby, ariaDescribedby, controlId, invalid, triggerProps, selectedOption, triggerVariant, inFilteringToken, isOpen, placeholder, disabled, }, ref) => {
|
|
12
|
-
const
|
|
13
|
-
const
|
|
12
|
+
const generatedId = useUniqueId();
|
|
13
|
+
const id = controlId !== null && controlId !== void 0 ? controlId : generatedId;
|
|
14
|
+
const triggerContentId = useUniqueId('trigger-content-');
|
|
14
15
|
let triggerContent = null;
|
|
15
16
|
if (!selectedOption) {
|
|
16
17
|
triggerContent = (React.createElement("span", { "aria-disabled": "true", className: clsx(styles.placeholder, styles.trigger), id: triggerContentId }, placeholder));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"trigger.js","sourceRoot":"lib/default/","sources":["select/parts/trigger.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"trigger.js","sourceRoot":"lib/default/","sources":["select/parts/trigger.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,YAAY,EAAE,MAAM,qCAAqC,CAAC;AACnE,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,aAAa,MAAM,0CAA0C,CAAC;AAErE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAGrC,OAAO,MAAM,MAAM,kCAAkC,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,oCAAoC,CAAC;AAEjE,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAY3D,MAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CAC9B,CACE,EACE,cAAc,EACd,eAAe,EACf,SAAS,EACT,OAAO,EACP,YAAY,EACZ,cAAc,EACd,cAAc,EACd,gBAAgB,EAChB,MAAM,EACN,WAAW,EACX,QAAQ,GACK,EACf,GAAiC,EACjC,EAAE;IACF,MAAM,WAAW,GAAG,WAAW,EAAE,CAAC;IAClC,MAAM,EAAE,GAAG,SAAS,aAAT,SAAS,cAAT,SAAS,GAAI,WAAW,CAAC;IACpC,MAAM,gBAAgB,GAAG,WAAW,CAAC,kBAAkB,CAAC,CAAC;IAEzD,IAAI,cAAc,GAAG,IAAI,CAAC;IAC1B,IAAI,CAAC,cAAc,EAAE;QACnB,cAAc,GAAG,CACf,+CAAoB,MAAM,EAAC,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,WAAW,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,EAAE,EAAE,gBAAgB,IACjG,WAAW,CACP,CACR,CAAC;KACH;SAAM,IAAI,cAAc,KAAK,QAAQ,EAAE;QACtC,cAAc,GAAG,oBAAC,MAAM,IAAC,EAAE,EAAE,gBAAgB,EAAE,MAAM,kCAAO,cAAc,KAAE,QAAQ,KAAI,cAAc,EAAE,IAAI,GAAI,CAAC;KAClH;SAAM;QACL,cAAc,GAAG,CACf,8BAAM,EAAE,EAAE,gBAAgB,EAAE,SAAS,EAAE,MAAM,CAAC,OAAO,IAClD,cAAc,CAAC,KAAK,IAAI,cAAc,CAAC,KAAK,CACxC,CACR,CAAC;KACH;IAED,MAAM,SAAS,GAAG,YAAY,CAAC,YAAY,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;IAEtD,OAAO,CACL,oBAAC,aAAa,oBACR,YAAY,IAChB,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,SAAS,EACd,OAAO,EAAE,MAAM,EACf,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,gBAAgB,EAAE,gBAAgB,EAClC,eAAe,EAAE,eAAe,EAChC,cAAc,EAAE,WAAW,CAAC,cAAc,EAAE,gBAAgB,CAAC,KAE5D,cAAc,CACD,CACjB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,OAAO,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { useMergeRefs } from '../../internal/hooks/use-merge-refs';\nimport clsx from 'clsx';\nimport ButtonTrigger from '../../internal/components/button-trigger';\nimport { SelectProps } from '../interfaces';\nimport styles from './styles.css.js';\nimport { OptionDefinition } from '../../internal/components/option/interfaces';\nimport { FormFieldValidationControlProps } from '../../internal/context/form-field-context';\nimport Option from '../../internal/components/option';\nimport { useUniqueId } from '../../internal/hooks/use-unique-id';\nimport { SelectTriggerProps } from '../utils/use-select';\nimport { joinStrings } from '../../internal/utils/strings';\n\nexport interface TriggerProps extends FormFieldValidationControlProps {\n placeholder: string | undefined;\n disabled: boolean | undefined;\n triggerProps: SelectTriggerProps;\n selectedOption: OptionDefinition | null;\n isOpen?: boolean;\n triggerVariant?: SelectProps.TriggerVariant;\n inFilteringToken?: boolean;\n}\n\nconst Trigger = React.forwardRef(\n (\n {\n ariaLabelledby,\n ariaDescribedby,\n controlId,\n invalid,\n triggerProps,\n selectedOption,\n triggerVariant,\n inFilteringToken,\n isOpen,\n placeholder,\n disabled,\n }: TriggerProps,\n ref: React.Ref<HTMLButtonElement>\n ) => {\n const generatedId = useUniqueId();\n const id = controlId ?? generatedId;\n const triggerContentId = useUniqueId('trigger-content-');\n\n let triggerContent = null;\n if (!selectedOption) {\n triggerContent = (\n <span aria-disabled=\"true\" className={clsx(styles.placeholder, styles.trigger)} id={triggerContentId}>\n {placeholder}\n </span>\n );\n } else if (triggerVariant === 'option') {\n triggerContent = <Option id={triggerContentId} option={{ ...selectedOption, disabled }} triggerVariant={true} />;\n } else {\n triggerContent = (\n <span id={triggerContentId} className={styles.trigger}>\n {selectedOption.label || selectedOption.value}\n </span>\n );\n }\n\n const mergedRef = useMergeRefs(triggerProps.ref, ref);\n\n return (\n <ButtonTrigger\n {...triggerProps}\n id={id}\n ref={mergedRef}\n pressed={isOpen}\n disabled={disabled}\n invalid={invalid}\n inFilteringToken={inFilteringToken}\n ariaDescribedby={ariaDescribedby}\n ariaLabelledby={joinStrings(ariaLabelledby, triggerContentId)}\n >\n {triggerContent}\n </ButtonTrigger>\n );\n }\n);\n\nexport default Trigger;\n"]}
|