@cloudscape-design/components-themeable 3.0.942 → 3.0.943
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/internal/manifest.json +1 -1
- package/lib/internal/scss/internal/components/selectable-item/styles.scss +4 -0
- package/lib/internal/template/internal/components/option/interfaces.d.ts +1 -1
- package/lib/internal/template/internal/components/option/interfaces.d.ts.map +1 -1
- package/lib/internal/template/internal/components/option/interfaces.js.map +1 -1
- package/lib/internal/template/internal/components/option/utils/prepare-options.d.ts +1 -0
- package/lib/internal/template/internal/components/option/utils/prepare-options.d.ts.map +1 -1
- package/lib/internal/template/internal/components/option/utils/prepare-options.js +1 -0
- package/lib/internal/template/internal/components/option/utils/prepare-options.js.map +1 -1
- package/lib/internal/template/internal/components/options-list/index.d.ts +1 -0
- package/lib/internal/template/internal/components/options-list/index.d.ts.map +1 -1
- package/lib/internal/template/internal/components/options-list/index.js +2 -2
- package/lib/internal/template/internal/components/options-list/index.js.map +1 -1
- package/lib/internal/template/internal/components/selectable-item/index.d.ts.map +1 -1
- package/lib/internal/template/internal/components/selectable-item/index.js +2 -1
- package/lib/internal/template/internal/components/selectable-item/index.js.map +1 -1
- package/lib/internal/template/internal/components/selectable-item/interfaces.d.ts +1 -0
- package/lib/internal/template/internal/components/selectable-item/interfaces.d.ts.map +1 -1
- package/lib/internal/template/internal/components/selectable-item/interfaces.js.map +1 -1
- package/lib/internal/template/internal/components/selectable-item/styles.css.js +20 -19
- package/lib/internal/template/internal/components/selectable-item/styles.scoped.css +41 -37
- package/lib/internal/template/internal/components/selectable-item/styles.selectors.js +20 -19
- package/lib/internal/template/internal/environment.js +1 -1
- package/lib/internal/template/internal/environment.json +1 -1
- package/lib/internal/template/multiselect/interfaces.d.ts +11 -2
- package/lib/internal/template/multiselect/interfaces.d.ts.map +1 -1
- package/lib/internal/template/multiselect/interfaces.js.map +1 -1
- package/lib/internal/template/multiselect/internal.d.ts.map +1 -1
- package/lib/internal/template/multiselect/internal.js +5 -3
- package/lib/internal/template/multiselect/internal.js.map +1 -1
- package/lib/internal/template/multiselect/use-multiselect.d.ts +7 -4
- package/lib/internal/template/multiselect/use-multiselect.d.ts.map +1 -1
- package/lib/internal/template/multiselect/use-multiselect.js +33 -9
- package/lib/internal/template/multiselect/use-multiselect.js.map +1 -1
- package/lib/internal/template/select/parts/common.d.ts +2 -0
- package/lib/internal/template/select/parts/common.d.ts.map +1 -0
- package/lib/internal/template/select/parts/common.js +4 -0
- package/lib/internal/template/select/parts/common.js.map +1 -0
- package/lib/internal/template/select/parts/multiselect-item.d.ts.map +1 -1
- package/lib/internal/template/select/parts/multiselect-item.js +3 -2
- package/lib/internal/template/select/parts/multiselect-item.js.map +1 -1
- package/lib/internal/template/select/parts/plain-list.d.ts.map +1 -1
- package/lib/internal/template/select/parts/plain-list.js +22 -14
- package/lib/internal/template/select/parts/plain-list.js.map +1 -1
- package/lib/internal/template/select/parts/virtual-list.d.ts.map +1 -1
- package/lib/internal/template/select/parts/virtual-list.js +26 -9
- package/lib/internal/template/select/parts/virtual-list.js.map +1 -1
- package/lib/internal/template/select/utils/render-options.d.ts +4 -3
- package/lib/internal/template/select/utils/render-options.d.ts.map +1 -1
- package/lib/internal/template/select/utils/render-options.js +5 -5
- package/lib/internal/template/select/utils/render-options.js.map +1 -1
- package/lib/internal/template/select/utils/scroll-to-index.d.ts +5 -0
- package/lib/internal/template/select/utils/scroll-to-index.d.ts.map +1 -0
- package/lib/internal/template/select/utils/scroll-to-index.js +14 -0
- package/lib/internal/template/select/utils/scroll-to-index.js.map +1 -0
- package/lib/internal/template/select/utils/use-select.d.ts +4 -1
- package/lib/internal/template/select/utils/use-select.d.ts.map +1 -1
- package/lib/internal/template/select/utils/use-select.js +18 -9
- package/lib/internal/template/select/utils/use-select.js.map +1 -1
- package/lib/internal/template/test-utils/dom/internal/dropdown-host.d.ts +20 -2
- package/lib/internal/template/test-utils/dom/internal/dropdown-host.js +33 -2
- package/lib/internal/template/test-utils/dom/internal/dropdown-host.js.map +1 -1
- package/lib/internal/template/test-utils/selectors/internal/dropdown-host.d.ts +1 -0
- package/lib/internal/template/test-utils/selectors/internal/dropdown-host.js +6 -0
- package/lib/internal/template/test-utils/selectors/internal/dropdown-host.js.map +1 -1
- package/lib/internal/template/test-utils/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"plain-list.js","sourceRoot":"","sources":["../../../../src/select/parts/plain-list.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"plain-list.js","sourceRoot":"","sources":["../../../../src/select/parts/plain-list.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,mBAAmB,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjF,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAC;AAGzE,OAAO,WAAW,MAAM,wCAAwC,CAAC;AAEjE,OAAO,EAAE,YAAY,EAAE,MAAM,qCAAqC,CAAC;AACnE,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AACxD,OAAO,aAAa,MAAM,0BAA0B,CAAC;AAErD,OAAO,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAE9C,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAoBrC,MAAM,SAAS,GAAG,CAChB,EACE,SAAS,EACT,cAAc,EACd,eAAe,EACf,cAAc,EACd,aAAa,EACb,UAAU,EACV,iBAAiB,EACjB,UAAU,EACV,oBAAoB,EACpB,mBAAmB,EACnB,iBAAiB,GACD,EAClB,GAA6C,EAC7C,EAAE;IACF,MAAM,eAAe,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACrD,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GAAG,QAAQ,CAAC,iBAAiB,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAE/G,MAAM,CAAC,KAAK,EAAE,cAAc,CAAC,GAAG,iBAAiB,CAAC,IAAI,CAAC,EAAE;QACvD,IAAI,eAAe,CAAC,OAAO,EAAE;YAC3B,sHAAsH;YACtH,0FAA0F;YAE1F,qHAAqH;YACrH,uBAAuB;YACvB,wBAAwB,CAAC,eAAe,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;SAChE;QACD,OAAO,EAAE,KAAK,EAAE,IAAI,CAAC,eAAe,EAAE,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE,CAAC;IACrE,CAAC,CAAC,CAAC;IAEH,MAAM,OAAO,GAAG,SAAS,CAAC,GAAG,CAAC;IAE9B,MAAM,SAAS,GAAG,YAAY,CAAC,cAAc,EAAE,OAAO,CAAC,CAAC;IAExD,mBAAmB,CACjB,GAAG,EACH,GAAG,EAAE,CAAC,CAAC,KAAa,EAAE,EAAE;QACtB,MAAM,QAAQ,GAAG,iBAAiB,IAAI,KAAK,KAAK,CAAC,CAAC;QAClD,IAAI,aAAa,CAAC,SAAS,IAAI,OAAO,CAAC,OAAO,IAAI,CAAC,QAAQ,EAAE;YAC3D,aAAa,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,CAAC,OAAO,EAAE,CAAC,CAAC;SACnD;IACH,CAAC,EACD,CAAC,iBAAiB,EAAE,aAAa,CAAC,SAAS,EAAE,OAAO,CAAC,CACtD,CAAC;IAEF,MAAM,aAAa,GAAG,CAAC,CAAC,KAAK,IAAI,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;IAE3D,OAAO,CACL,oBAAC,WAAW,oBAAK,SAAS,IAAE,GAAG,EAAE,SAAS,EAAE,mBAAmB,EAAE,qBAAqB;QACnF,aAAa,CAAC;YACb,OAAO,EAAE,eAAe;YACxB,cAAc;YACd,cAAc;YACd,aAAa;YACb,UAAU;YACV,iBAAiB;YACjB,oBAAoB;YACpB,mBAAmB;YACnB,iBAAiB;YACjB,eAAe;YACf,aAAa;SACd,CAAC;QACD,UAAU,CAAC,CAAC,CAAC,CACZ,4BAAI,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAE,MAAM,CAAC,aAAa,CAAC,IAC/C,UAAU,CACR,CACN,CAAC,CAAC,CAAC,IAAI,CACI,CACf,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC,SAAS,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { forwardRef, useImperativeHandle, useRef, useState } from 'react';\n\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\n\nimport { DropdownOption } from '../../internal/components/option/interfaces';\nimport OptionsList from '../../internal/components/options-list';\nimport { HighlightType } from '../../internal/components/options-list/utils/use-highlight-option';\nimport { useMergeRefs } from '../../internal/hooks/use-merge-refs';\nimport { renderOptions } from '../utils/render-options';\nimport scrollToIndex from '../utils/scroll-to-index';\nimport { GetOptionProps, MenuProps } from '../utils/use-select';\nimport { fallbackItemHeight } from './common';\n\nimport styles from './styles.css.js';\n\nexport interface SelectListProps {\n menuProps: MenuProps;\n getOptionProps: GetOptionProps;\n filteredOptions: ReadonlyArray<DropdownOption>;\n filteringValue: string;\n highlightType: HighlightType;\n checkboxes?: boolean;\n hasDropdownStatus?: boolean;\n listBottom?: React.ReactNode;\n useInteractiveGroups?: boolean;\n screenReaderContent?: string;\n firstOptionSticky?: boolean;\n}\n\nexport namespace SelectListProps {\n export type SelectListRef = (index: number) => void;\n}\n\nconst PlainList = (\n {\n menuProps,\n getOptionProps,\n filteredOptions,\n filteringValue,\n highlightType,\n checkboxes,\n hasDropdownStatus,\n listBottom,\n useInteractiveGroups,\n screenReaderContent,\n firstOptionSticky,\n }: SelectListProps,\n ref: React.Ref<SelectListProps.SelectListRef>\n) => {\n const stickyOptionRef = useRef<HTMLDivElement>(null);\n const [stickyOptionBlockSize, setStickyOptionBlockSize] = useState(firstOptionSticky ? fallbackItemHeight : 0);\n\n const [width, menuMeasureRef] = useContainerQuery(rect => {\n if (stickyOptionRef.current) {\n // Cannot use container query on the sticky option individually because it is not rendered until the dropdown is open.\n // Not expecting the sticky option to change size without the dropdown also changing size.\n\n // The effects of using the sticky option block size to set the menu scroll padding are covered by integration tests.\n // istanbul ignore next\n setStickyOptionBlockSize(stickyOptionRef.current.clientHeight);\n }\n return { inner: rect.contentBoxWidth, outer: rect.borderBoxWidth };\n });\n\n const menuRef = menuProps.ref;\n\n const mergedRef = useMergeRefs(menuMeasureRef, menuRef);\n\n useImperativeHandle(\n ref,\n () => (index: number) => {\n const isSticky = firstOptionSticky && index === 0;\n if (highlightType.moveFocus && menuRef.current && !isSticky) {\n scrollToIndex({ index, menuEl: menuRef.current });\n }\n },\n [firstOptionSticky, highlightType.moveFocus, menuRef]\n );\n\n const withScrollbar = !!width && width.inner < width.outer;\n\n return (\n <OptionsList {...menuProps} ref={mergedRef} stickyItemBlockSize={stickyOptionBlockSize}>\n {renderOptions({\n options: filteredOptions,\n getOptionProps,\n filteringValue,\n highlightType,\n checkboxes,\n hasDropdownStatus,\n useInteractiveGroups,\n screenReaderContent,\n firstOptionSticky,\n stickyOptionRef,\n withScrollbar,\n })}\n {listBottom ? (\n <li role=\"option\" className={styles['list-bottom']}>\n {listBottom}\n </li>\n ) : null}\n </OptionsList>\n );\n};\n\nexport default forwardRef(PlainList);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"virtual-list.d.ts","sourceRoot":"","sources":["../../../../src/select/parts/virtual-list.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA+D,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"virtual-list.d.ts","sourceRoot":"","sources":["../../../../src/select/parts/virtual-list.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA+D,MAAM,OAAO,CAAC;AAUpF,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;;AA0H/C,wBAAuC"}
|
|
@@ -6,6 +6,8 @@ import OptionsList from '../../internal/components/options-list';
|
|
|
6
6
|
import { useMergeRefs } from '../../internal/hooks/use-merge-refs';
|
|
7
7
|
import { useVirtual } from '../../internal/hooks/use-virtual';
|
|
8
8
|
import { renderOptions } from '../utils/render-options';
|
|
9
|
+
import customScrollToIndex from '../utils/scroll-to-index';
|
|
10
|
+
import { fallbackItemHeight } from './common';
|
|
9
11
|
import styles from './styles.css.js';
|
|
10
12
|
const VirtualList = (props, ref) => {
|
|
11
13
|
return props.menuProps.open ? React.createElement(VirtualListOpen, Object.assign({}, props, { ref: ref })) : React.createElement(VirtualListClosed, Object.assign({}, props, { ref: ref }));
|
|
@@ -15,6 +17,7 @@ const VirtualListOpen = forwardRef(({ menuProps, getOptionProps, filteredOptions
|
|
|
15
17
|
const [width, menuMeasureRef] = useContainerQuery(rect => ({ inner: rect.contentBoxWidth, outer: rect.borderBoxWidth }), []);
|
|
16
18
|
const menuRefObject = useRef(null);
|
|
17
19
|
const menuRef = useMergeRefs(menuMeasureRef, menuRefObject, menuProps.ref);
|
|
20
|
+
const previousHighlightedIndex = useRef();
|
|
18
21
|
const { virtualItems, totalSize, scrollToIndex } = useVirtual({
|
|
19
22
|
items: filteredOptions,
|
|
20
23
|
parentRef: menuRefObject,
|
|
@@ -23,17 +26,32 @@ const VirtualListOpen = forwardRef(({ menuProps, getOptionProps, filteredOptions
|
|
|
23
26
|
// 1: because the component got resized (width property got updated)
|
|
24
27
|
// 2: because the option changed its content (filteringValue property controls the highlight and the visibility of hidden tags)
|
|
25
28
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
26
|
-
estimateSize: useCallback(() =>
|
|
29
|
+
estimateSize: useCallback(() => fallbackItemHeight, [width === null || width === void 0 ? void 0 : width.inner, filteringValue]),
|
|
27
30
|
firstItemSticky: firstOptionSticky,
|
|
28
31
|
});
|
|
29
32
|
useImperativeHandle(ref, () => (index) => {
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
+
if (highlightType.moveFocus) {
|
|
34
|
+
const movingUp = previousHighlightedIndex.current !== undefined && index < previousHighlightedIndex.current;
|
|
35
|
+
if (firstOptionSticky && movingUp && index !== 0 && menuRefObject.current) {
|
|
36
|
+
// React-Virtual v2 does not offer a proper way to handle sticky elements when scrolling,
|
|
37
|
+
// so until we upgrade to v3, use our own scroll implementation
|
|
38
|
+
// to prevent newly highlighted element from being covered by the sticky element
|
|
39
|
+
// when moving the highlight upwards in the list.
|
|
40
|
+
// Scrolling behavior is covered by integration tests.
|
|
41
|
+
// istanbul ignore next
|
|
42
|
+
customScrollToIndex({
|
|
43
|
+
index,
|
|
44
|
+
menuEl: menuRefObject === null || menuRefObject === void 0 ? void 0 : menuRefObject.current,
|
|
45
|
+
});
|
|
46
|
+
}
|
|
47
|
+
else {
|
|
48
|
+
scrollToIndex(index);
|
|
49
|
+
}
|
|
33
50
|
}
|
|
34
|
-
|
|
51
|
+
previousHighlightedIndex.current = index;
|
|
52
|
+
}, [firstOptionSticky, highlightType.moveFocus, scrollToIndex]);
|
|
35
53
|
const stickySize = firstOptionSticky ? virtualItems[0].size : 0;
|
|
36
|
-
const
|
|
54
|
+
const withScrollbar = !!width && width.inner < width.outer;
|
|
37
55
|
const finalOptions = renderOptions({
|
|
38
56
|
options: virtualItems.map(({ index }) => filteredOptions[index]),
|
|
39
57
|
getOptionProps,
|
|
@@ -44,11 +62,10 @@ const VirtualListOpen = forwardRef(({ menuProps, getOptionProps, filteredOptions
|
|
|
44
62
|
virtualItems,
|
|
45
63
|
useInteractiveGroups,
|
|
46
64
|
screenReaderContent,
|
|
47
|
-
ariaSetsize: filteredOptions.length,
|
|
48
|
-
withScrollbar: hasScrollbar,
|
|
49
65
|
firstOptionSticky,
|
|
66
|
+
withScrollbar,
|
|
50
67
|
});
|
|
51
|
-
return (React.createElement(OptionsList, Object.assign({}, menuProps, { ref: menuRef }),
|
|
68
|
+
return (React.createElement(OptionsList, Object.assign({}, menuProps, { stickyItemBlockSize: stickySize, ref: menuRef }),
|
|
52
69
|
finalOptions,
|
|
53
70
|
React.createElement("div", { "aria-hidden": "true", key: "total-size", className: styles['layout-strut'], style: { height: totalSize - stickySize } }),
|
|
54
71
|
listBottom ? (React.createElement("li", { role: "option", className: styles['list-bottom'] }, listBottom)) : null));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"virtual-list.js","sourceRoot":"","sources":["../../../../src/select/parts/virtual-list.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,WAAW,EAAE,mBAAmB,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEpF,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAC;AAEzE,OAAO,WAAW,MAAM,wCAAwC,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,qCAAqC,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,kCAAkC,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;
|
|
1
|
+
{"version":3,"file":"virtual-list.js","sourceRoot":"","sources":["../../../../src/select/parts/virtual-list.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,WAAW,EAAE,mBAAmB,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEpF,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAC;AAEzE,OAAO,WAAW,MAAM,wCAAwC,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,qCAAqC,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,kCAAkC,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AACxD,OAAO,mBAAmB,MAAM,0BAA0B,CAAC;AAC3D,OAAO,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAG9C,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,MAAM,WAAW,GAAG,CAAC,KAAsB,EAAE,GAA6C,EAAE,EAAE;IAC5F,OAAO,KAAK,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,oBAAC,eAAe,oBAAK,KAAK,IAAE,GAAG,EAAE,GAAG,IAAI,CAAC,CAAC,CAAC,oBAAC,iBAAiB,oBAAK,KAAK,IAAE,GAAG,EAAE,GAAG,IAAI,CAAC;AACtH,CAAC,CAAC;AAEF,MAAM,eAAe,GAAG,UAAU,CAChC,CACE,EACE,SAAS,EACT,cAAc,EACd,eAAe,EACf,cAAc,EACd,aAAa,EACb,UAAU,EACV,iBAAiB,EACjB,UAAU,EACV,oBAAoB,EACpB,mBAAmB,EACnB,iBAAiB,GACD,EAClB,GAA6C,EAC7C,EAAE;IACF,uEAAuE;IACvE,MAAM,CAAC,KAAK,EAAE,cAAc,CAAC,GAAG,iBAAiB,CAC/C,IAAI,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,eAAe,EAAE,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE,CAAC,EACrE,EAAE,CACH,CAAC;IACF,MAAM,aAAa,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IACnC,MAAM,OAAO,GAAG,YAAY,CAAC,cAAc,EAAE,aAAa,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IAC3E,MAAM,wBAAwB,GAAG,MAAM,EAAU,CAAC;IAClD,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,aAAa,EAAE,GAAG,UAAU,CAAC;QAC5D,KAAK,EAAE,eAAe;QACtB,SAAS,EAAE,aAAa;QACxB,8FAA8F;QAC9F,oDAAoD;QACpD,oEAAoE;QACpE,+HAA+H;QAC/H,uDAAuD;QACvD,YAAY,EAAE,WAAW,CAAC,GAAG,EAAE,CAAC,kBAAkB,EAAE,CAAC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,EAAE,cAAc,CAAC,CAAC;QACnF,eAAe,EAAE,iBAAiB;KACnC,CAAC,CAAC;IAEH,mBAAmB,CACjB,GAAG,EACH,GAAG,EAAE,CAAC,CAAC,KAAa,EAAE,EAAE;QACtB,IAAI,aAAa,CAAC,SAAS,EAAE;YAC3B,MAAM,QAAQ,GAAG,wBAAwB,CAAC,OAAO,KAAK,SAAS,IAAI,KAAK,GAAG,wBAAwB,CAAC,OAAO,CAAC;YAC5G,IAAI,iBAAiB,IAAI,QAAQ,IAAI,KAAK,KAAK,CAAC,IAAI,aAAa,CAAC,OAAO,EAAE;gBACzE,yFAAyF;gBACzF,+DAA+D;gBAC/D,gFAAgF;gBAChF,iDAAiD;gBAEjD,sDAAsD;gBACtD,uBAAuB;gBACvB,mBAAmB,CAAC;oBAClB,KAAK;oBACL,MAAM,EAAE,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,OAAO;iBAC/B,CAAC,CAAC;aACJ;iBAAM;gBACL,aAAa,CAAC,KAAK,CAAC,CAAC;aACtB;SACF;QACD,wBAAwB,CAAC,OAAO,GAAG,KAAK,CAAC;IAC3C,CAAC,EACD,CAAC,iBAAiB,EAAE,aAAa,CAAC,SAAS,EAAE,aAAa,CAAC,CAC5D,CAAC;IAEF,MAAM,UAAU,GAAG,iBAAiB,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;IAChE,MAAM,aAAa,GAAG,CAAC,CAAC,KAAK,IAAI,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;IAE3D,MAAM,YAAY,GAAG,aAAa,CAAC;QACjC,OAAO,EAAE,YAAY,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC;QAChE,cAAc;QACd,cAAc;QACd,aAAa;QACb,UAAU;QACV,iBAAiB;QACjB,YAAY;QACZ,oBAAoB;QACpB,mBAAmB;QACnB,iBAAiB;QACjB,aAAa;KACd,CAAC,CAAC;IAEH,OAAO,CACL,oBAAC,WAAW,oBAAK,SAAS,IAAE,mBAAmB,EAAE,UAAU,EAAE,GAAG,EAAE,OAAO;QACtE,YAAY;QACb,4CACc,MAAM,EAClB,GAAG,EAAC,YAAY,EAChB,SAAS,EAAE,MAAM,CAAC,cAAc,CAAC,EACjC,KAAK,EAAE,EAAE,MAAM,EAAE,SAAS,GAAG,UAAU,EAAE,GACzC;QACD,UAAU,CAAC,CAAC,CAAC,CACZ,4BAAI,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAE,MAAM,CAAC,aAAa,CAAC,IAC/C,UAAU,CACR,CACN,CAAC,CAAC,CAAC,IAAI,CACI,CACf,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,MAAM,iBAAiB,GAAG,UAAU,CAClC,CAAC,EAAE,SAAS,EAAE,UAAU,EAAmB,EAAE,GAA6C,EAAE,EAAE;IAC5F,mBAAmB,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,GAAG,EAAE,GAAE,CAAC,EAAE,EAAE,CAAC,CAAC;IAC7C,OAAO,CACL,oBAAC,WAAW,oBAAK,SAAS,IAAE,GAAG,EAAE,SAAS,CAAC,GAAG,KAC3C,UAAU,CAAC,CAAC,CAAC,CACZ,4BAAI,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAE,MAAM,CAAC,aAAa,CAAC,IAC/C,UAAU,CACR,CACN,CAAC,CAAC,CAAC,IAAI,CACI,CACf,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,UAAU,CAAC,WAAW,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { forwardRef, useCallback, useImperativeHandle, useRef } from 'react';\n\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\n\nimport OptionsList from '../../internal/components/options-list';\nimport { useMergeRefs } from '../../internal/hooks/use-merge-refs';\nimport { useVirtual } from '../../internal/hooks/use-virtual';\nimport { renderOptions } from '../utils/render-options';\nimport customScrollToIndex from '../utils/scroll-to-index';\nimport { fallbackItemHeight } from './common';\nimport { SelectListProps } from './plain-list';\n\nimport styles from './styles.css.js';\n\nconst VirtualList = (props: SelectListProps, ref: React.Ref<SelectListProps.SelectListRef>) => {\n return props.menuProps.open ? <VirtualListOpen {...props} ref={ref} /> : <VirtualListClosed {...props} ref={ref} />;\n};\n\nconst VirtualListOpen = forwardRef(\n (\n {\n menuProps,\n getOptionProps,\n filteredOptions,\n filteringValue,\n highlightType,\n checkboxes,\n hasDropdownStatus,\n listBottom,\n useInteractiveGroups,\n screenReaderContent,\n firstOptionSticky,\n }: SelectListProps,\n ref: React.Ref<SelectListProps.SelectListRef>\n ) => {\n // update component, when it gets wider or narrower to reposition items\n const [width, menuMeasureRef] = useContainerQuery(\n rect => ({ inner: rect.contentBoxWidth, outer: rect.borderBoxWidth }),\n []\n );\n const menuRefObject = useRef(null);\n const menuRef = useMergeRefs(menuMeasureRef, menuRefObject, menuProps.ref);\n const previousHighlightedIndex = useRef<number>();\n const { virtualItems, totalSize, scrollToIndex } = useVirtual({\n items: filteredOptions,\n parentRef: menuRefObject,\n // estimateSize is a dependency of measurements memo. We update it to force full recalculation\n // when the height of any option could have changed:\n // 1: because the component got resized (width property got updated)\n // 2: because the option changed its content (filteringValue property controls the highlight and the visibility of hidden tags)\n // eslint-disable-next-line react-hooks/exhaustive-deps\n estimateSize: useCallback(() => fallbackItemHeight, [width?.inner, filteringValue]),\n firstItemSticky: firstOptionSticky,\n });\n\n useImperativeHandle(\n ref,\n () => (index: number) => {\n if (highlightType.moveFocus) {\n const movingUp = previousHighlightedIndex.current !== undefined && index < previousHighlightedIndex.current;\n if (firstOptionSticky && movingUp && index !== 0 && menuRefObject.current) {\n // React-Virtual v2 does not offer a proper way to handle sticky elements when scrolling,\n // so until we upgrade to v3, use our own scroll implementation\n // to prevent newly highlighted element from being covered by the sticky element\n // when moving the highlight upwards in the list.\n\n // Scrolling behavior is covered by integration tests.\n // istanbul ignore next\n customScrollToIndex({\n index,\n menuEl: menuRefObject?.current,\n });\n } else {\n scrollToIndex(index);\n }\n }\n previousHighlightedIndex.current = index;\n },\n [firstOptionSticky, highlightType.moveFocus, scrollToIndex]\n );\n\n const stickySize = firstOptionSticky ? virtualItems[0].size : 0;\n const withScrollbar = !!width && width.inner < width.outer;\n\n const finalOptions = renderOptions({\n options: virtualItems.map(({ index }) => filteredOptions[index]),\n getOptionProps,\n filteringValue,\n highlightType,\n checkboxes,\n hasDropdownStatus,\n virtualItems,\n useInteractiveGroups,\n screenReaderContent,\n firstOptionSticky,\n withScrollbar,\n });\n\n return (\n <OptionsList {...menuProps} stickyItemBlockSize={stickySize} ref={menuRef}>\n {finalOptions}\n <div\n aria-hidden=\"true\"\n key=\"total-size\"\n className={styles['layout-strut']}\n style={{ height: totalSize - stickySize }}\n />\n {listBottom ? (\n <li role=\"option\" className={styles['list-bottom']}>\n {listBottom}\n </li>\n ) : null}\n </OptionsList>\n );\n }\n);\n\nconst VirtualListClosed = forwardRef(\n ({ menuProps, listBottom }: SelectListProps, ref: React.Ref<SelectListProps.SelectListRef>) => {\n useImperativeHandle(ref, () => () => {}, []);\n return (\n <OptionsList {...menuProps} ref={menuProps.ref}>\n {listBottom ? (\n <li role=\"option\" className={styles['list-bottom']}>\n {listBottom}\n </li>\n ) : null}\n </OptionsList>\n );\n }\n);\n\nexport default forwardRef(VirtualList);\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
import React from 'react';
|
|
2
2
|
import { DropdownOption } from '../../internal/components/option/interfaces';
|
|
3
3
|
import { HighlightType } from '../../internal/components/options-list/utils/use-highlight-option';
|
|
4
4
|
import { VirtualItem } from '../../internal/vendor/react-virtual';
|
|
@@ -13,9 +13,10 @@ interface RenderOptionProps {
|
|
|
13
13
|
useInteractiveGroups?: boolean;
|
|
14
14
|
screenReaderContent?: string;
|
|
15
15
|
ariaSetsize?: number;
|
|
16
|
-
withScrollbar
|
|
16
|
+
withScrollbar: boolean;
|
|
17
17
|
firstOptionSticky?: boolean;
|
|
18
|
+
stickyOptionRef?: React.Ref<HTMLDivElement>;
|
|
18
19
|
}
|
|
19
|
-
export declare const renderOptions: ({ options, getOptionProps, filteringValue, highlightType, checkboxes, hasDropdownStatus, virtualItems, useInteractiveGroups, screenReaderContent, ariaSetsize, withScrollbar, firstOptionSticky, }: RenderOptionProps) => JSX.Element[];
|
|
20
|
+
export declare const renderOptions: ({ options, getOptionProps, filteringValue, highlightType, checkboxes, hasDropdownStatus, virtualItems, useInteractiveGroups, screenReaderContent, ariaSetsize, withScrollbar, firstOptionSticky, stickyOptionRef, }: RenderOptionProps) => JSX.Element[];
|
|
20
21
|
export {};
|
|
21
22
|
//# sourceMappingURL=render-options.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"render-options.d.ts","sourceRoot":"","sources":["../../../../src/select/utils/render-options.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"render-options.d.ts","sourceRoot":"","sources":["../../../../src/select/utils/render-options.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,6CAA6C,CAAC;AAC7E,OAAO,EAAE,aAAa,EAAE,MAAM,mEAAmE,CAAC;AAClG,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAKlE,UAAU,iBAAiB;IACzB,OAAO,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;IACvC,cAAc,EAAE,GAAG,CAAC;IACpB,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,EAAE,aAAa,CAAC;IAC7B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,YAAY,CAAC,EAAE,WAAW,EAAE,CAAC;IAC7B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,OAAO,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;CAC7C;AAED,eAAO,MAAM,aAAa,wNAcvB,iBAAiB,kBAiCnB,CAAC"}
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
// SPDX-License-Identifier: Apache-2.0
|
|
3
3
|
import React from 'react';
|
|
4
4
|
import Item from '../parts/item';
|
|
5
|
-
import
|
|
5
|
+
import MultiselectItem from '../parts/multiselect-item';
|
|
6
6
|
import { getItemProps } from './get-item-props';
|
|
7
|
-
export const renderOptions = ({ options, getOptionProps, filteringValue, highlightType, checkboxes = false, hasDropdownStatus, virtualItems, useInteractiveGroups, screenReaderContent, ariaSetsize, withScrollbar, firstOptionSticky, }) => {
|
|
7
|
+
export const renderOptions = ({ options, getOptionProps, filteringValue, highlightType, checkboxes = false, hasDropdownStatus, virtualItems, useInteractiveGroups, screenReaderContent, ariaSetsize, withScrollbar, firstOptionSticky, stickyOptionRef, }) => {
|
|
8
8
|
return options.map((option, index) => {
|
|
9
9
|
const virtualItem = virtualItems && virtualItems[index];
|
|
10
10
|
const globalIndex = virtualItem ? virtualItem.index : index;
|
|
@@ -12,14 +12,14 @@ export const renderOptions = ({ options, getOptionProps, filteringValue, highlig
|
|
|
12
12
|
option,
|
|
13
13
|
index: globalIndex,
|
|
14
14
|
getOptionProps,
|
|
15
|
-
filteringValue,
|
|
15
|
+
filteringValue: option.type === 'select-all' ? '' : filteringValue,
|
|
16
16
|
checkboxes,
|
|
17
17
|
});
|
|
18
18
|
const isLastItem = index === options.length - 1;
|
|
19
19
|
const padBottom = !hasDropdownStatus && isLastItem;
|
|
20
|
-
const ListItem = useInteractiveGroups ?
|
|
20
|
+
const ListItem = useInteractiveGroups ? MultiselectItem : Item;
|
|
21
21
|
const isSticky = firstOptionSticky && globalIndex === 0;
|
|
22
|
-
return (React.createElement(ListItem, Object.assign({ key: globalIndex }, props, { virtualPosition:
|
|
22
|
+
return (React.createElement(ListItem, Object.assign({ key: globalIndex }, props, { virtualPosition: virtualItem && virtualItem.start, ref: isSticky && stickyOptionRef ? stickyOptionRef : virtualItem && virtualItem.measureRef, padBottom: padBottom, screenReaderContent: screenReaderContent, ariaPosinset: globalIndex + 1, ariaSetsize: ariaSetsize, highlightType: highlightType.type, withScrollbar: withScrollbar, sticky: isSticky })));
|
|
23
23
|
});
|
|
24
24
|
};
|
|
25
25
|
//# sourceMappingURL=render-options.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"render-options.js","sourceRoot":"","sources":["../../../../src/select/utils/render-options.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,IAAI,MAAM,eAAe,CAAC;AACjC,OAAO,eAAe,MAAM,2BAA2B,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"render-options.js","sourceRoot":"","sources":["../../../../src/select/utils/render-options.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,IAAI,MAAM,eAAe,CAAC;AACjC,OAAO,eAAe,MAAM,2BAA2B,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAkBhD,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAC5B,OAAO,EACP,cAAc,EACd,cAAc,EACd,aAAa,EACb,UAAU,GAAG,KAAK,EAClB,iBAAiB,EACjB,YAAY,EACZ,oBAAoB,EACpB,mBAAmB,EACnB,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,eAAe,GACG,EAAE,EAAE;IACtB,OAAO,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;QACnC,MAAM,WAAW,GAAG,YAAY,IAAI,YAAY,CAAC,KAAK,CAAC,CAAC;QACxD,MAAM,WAAW,GAAG,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC;QAC5D,MAAM,KAAK,GAAG,YAAY,CAAC;YACzB,MAAM;YACN,KAAK,EAAE,WAAW;YAClB,cAAc;YACd,cAAc,EAAE,MAAM,CAAC,IAAI,KAAK,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,cAAc;YAClE,UAAU;SACX,CAAC,CAAC;QAEH,MAAM,UAAU,GAAG,KAAK,KAAK,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC;QAChD,MAAM,SAAS,GAAG,CAAC,iBAAiB,IAAI,UAAU,CAAC;QACnD,MAAM,QAAQ,GAAG,oBAAoB,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,IAAI,CAAC;QAC/D,MAAM,QAAQ,GAAG,iBAAiB,IAAI,WAAW,KAAK,CAAC,CAAC;QAExD,OAAO,CACL,oBAAC,QAAQ,kBACP,GAAG,EAAE,WAAW,IACZ,KAAK,IACT,eAAe,EAAE,WAAW,IAAI,WAAW,CAAC,KAAK,EACjD,GAAG,EAAE,QAAQ,IAAI,eAAe,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,WAAW,IAAI,WAAW,CAAC,UAAU,EAC1F,SAAS,EAAE,SAAS,EACpB,mBAAmB,EAAE,mBAAmB,EACxC,YAAY,EAAE,WAAW,GAAG,CAAC,EAC7B,WAAW,EAAE,WAAW,EACxB,aAAa,EAAE,aAAa,CAAC,IAAI,EACjC,aAAa,EAAE,aAAa,EAC5B,MAAM,EAAE,QAAQ,IAChB,CACH,CAAC;IACJ,CAAC,CAAC,CAAC;AACL,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { DropdownOption } from '../../internal/components/option/interfaces';\nimport { HighlightType } from '../../internal/components/options-list/utils/use-highlight-option';\nimport { VirtualItem } from '../../internal/vendor/react-virtual';\nimport Item from '../parts/item';\nimport MultiselectItem from '../parts/multiselect-item';\nimport { getItemProps } from './get-item-props';\n\ninterface RenderOptionProps {\n options: ReadonlyArray<DropdownOption>;\n getOptionProps: any;\n filteringValue: string;\n highlightType: HighlightType;\n checkboxes?: boolean;\n hasDropdownStatus?: boolean;\n virtualItems?: VirtualItem[];\n useInteractiveGroups?: boolean;\n screenReaderContent?: string;\n ariaSetsize?: number;\n withScrollbar: boolean;\n firstOptionSticky?: boolean;\n stickyOptionRef?: React.Ref<HTMLDivElement>;\n}\n\nexport const renderOptions = ({\n options,\n getOptionProps,\n filteringValue,\n highlightType,\n checkboxes = false,\n hasDropdownStatus,\n virtualItems,\n useInteractiveGroups,\n screenReaderContent,\n ariaSetsize,\n withScrollbar,\n firstOptionSticky,\n stickyOptionRef,\n}: RenderOptionProps) => {\n return options.map((option, index) => {\n const virtualItem = virtualItems && virtualItems[index];\n const globalIndex = virtualItem ? virtualItem.index : index;\n const props = getItemProps({\n option,\n index: globalIndex,\n getOptionProps,\n filteringValue: option.type === 'select-all' ? '' : filteringValue,\n checkboxes,\n });\n\n const isLastItem = index === options.length - 1;\n const padBottom = !hasDropdownStatus && isLastItem;\n const ListItem = useInteractiveGroups ? MultiselectItem : Item;\n const isSticky = firstOptionSticky && globalIndex === 0;\n\n return (\n <ListItem\n key={globalIndex}\n {...props}\n virtualPosition={virtualItem && virtualItem.start}\n ref={isSticky && stickyOptionRef ? stickyOptionRef : virtualItem && virtualItem.measureRef}\n padBottom={padBottom}\n screenReaderContent={screenReaderContent}\n ariaPosinset={globalIndex + 1}\n ariaSetsize={ariaSetsize}\n highlightType={highlightType.type}\n withScrollbar={withScrollbar}\n sticky={isSticky}\n />\n );\n });\n};\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"scroll-to-index.d.ts","sourceRoot":"","sources":["../../../../src/select/utils/scroll-to-index.ts"],"names":[],"mappings":"AAKA,MAAM,CAAC,OAAO,WAAW,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,WAAW,CAAA;CAAE,QAUjF"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
+
import { scrollElementIntoView } from '../../internal/utils/scrollable-containers';
|
|
4
|
+
export default function ({ index, menuEl }) {
|
|
5
|
+
const item = menuEl.querySelector(`[data-mouse-target="${index}"]`);
|
|
6
|
+
if (item) {
|
|
7
|
+
// In edge case dropdown can be very small, scrolling can cause side effect AWSUI-60318
|
|
8
|
+
if (menuEl.clientHeight !== undefined && menuEl.clientHeight > 15) {
|
|
9
|
+
/* istanbul ignore next: clientHeight always returns 0 in JSDOM, the line is covered by integ tests */
|
|
10
|
+
scrollElementIntoView(item);
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
}
|
|
14
|
+
//# sourceMappingURL=scroll-to-index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"scroll-to-index.js","sourceRoot":"","sources":["../../../../src/select/utils/scroll-to-index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,qBAAqB,EAAE,MAAM,4CAA4C,CAAC;AAEnF,MAAM,CAAC,OAAO,WAAW,EAAE,KAAK,EAAE,MAAM,EAA0C;IAChF,MAAM,IAAI,GAAG,MAAM,CAAC,aAAa,CAAc,uBAAuB,KAAK,IAAI,CAAC,CAAC;IAEjF,IAAI,IAAI,EAAE;QACR,uFAAuF;QACvF,IAAI,MAAM,CAAC,YAAY,KAAK,SAAS,IAAI,MAAM,CAAC,YAAY,GAAG,EAAE,EAAE;YACjE,sGAAsG;YACtG,qBAAqB,CAAC,IAAI,CAAC,CAAC;SAC7B;KACF;AACH,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { scrollElementIntoView } from '../../internal/utils/scrollable-containers';\n\nexport default function ({ index, menuEl }: { index: number; menuEl: HTMLElement }) {\n const item = menuEl.querySelector<HTMLElement>(`[data-mouse-target=\"${index}\"]`);\n\n if (item) {\n // In edge case dropdown can be very small, scrolling can cause side effect AWSUI-60318\n if (menuEl.clientHeight !== undefined && menuEl.clientHeight > 15) {\n /* istanbul ignore next: clientHeight always returns 0 in JSDOM, the line is covered by integ tests */\n scrollElementIntoView(item);\n }\n }\n}\n"]}
|
|
@@ -25,11 +25,14 @@ interface UseSelectProps {
|
|
|
25
25
|
setFilteringValue?: (filteringText: string) => void;
|
|
26
26
|
useInteractiveGroups?: boolean;
|
|
27
27
|
statusType: DropdownStatusProps.StatusType;
|
|
28
|
+
isAllSelected?: boolean;
|
|
29
|
+
isSomeSelected?: boolean;
|
|
30
|
+
toggleAll?: () => void;
|
|
28
31
|
}
|
|
29
32
|
export interface SelectTriggerProps extends ButtonTriggerProps {
|
|
30
33
|
ref: RefObject<HTMLButtonElement>;
|
|
31
34
|
}
|
|
32
|
-
export declare function useSelect({ selectedOptions, updateSelectedOption, options, filteringType, onBlur, onFocus, externalRef, keepOpen, embedded, fireLoadItems, setFilteringValue, useInteractiveGroups, statusType, }: UseSelectProps): {
|
|
35
|
+
export declare function useSelect({ selectedOptions, updateSelectedOption, options, filteringType, onBlur, onFocus, externalRef, keepOpen, embedded, fireLoadItems, setFilteringValue, useInteractiveGroups, statusType, isAllSelected, isSomeSelected, toggleAll, }: UseSelectProps): {
|
|
33
36
|
isOpen: boolean;
|
|
34
37
|
highlightedOption: DropdownOption | undefined;
|
|
35
38
|
highlightedIndex: number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-select.d.ts","sourceRoot":"","sources":["../../../../src/select/utils/use-select.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,0CAA0C,CAAC;AAC9E,OAAO,EAAE,aAAa,EAAE,MAAM,+CAA+C,CAAC;AAC9E,OAAO,EAAE,mBAAmB,EAAE,MAAM,2CAA2C,CAAC;AAChF,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAe,MAAM,6CAA6C,CAAC;AAE5G,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAK1E,OAAO,EAA0B,yBAAyB,EAAE,MAAM,uBAAuB,CAAC;AAI1F,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAG1C,MAAM,MAAM,SAAS,GAAG,IAAI,CAAC,gBAAgB,EAAE,UAAU,CAAC,GAAG;IAAE,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAA;CAAE,CAAC;AACxG,MAAM,MAAM,cAAc,GAAG,CAAC,MAAM,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;AAElF,UAAU,cAAc;IACtB,eAAe,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;IACjD,oBAAoB,EAAE,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACzD,OAAO,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;IACvC,aAAa,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,yBAAyB,CAAC;IACnC,OAAO,CAAC,EAAE,yBAAyB,CAAC;IACpC,WAAW,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC5B,aAAa,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,iBAAiB,CAAC,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAC;IACpD,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,UAAU,EAAE,mBAAmB,CAAC,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"use-select.d.ts","sourceRoot":"","sources":["../../../../src/select/utils/use-select.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,0CAA0C,CAAC;AAC9E,OAAO,EAAE,aAAa,EAAE,MAAM,+CAA+C,CAAC;AAC9E,OAAO,EAAE,mBAAmB,EAAE,MAAM,2CAA2C,CAAC;AAChF,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAe,MAAM,6CAA6C,CAAC;AAE5G,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAK1E,OAAO,EAA0B,yBAAyB,EAAE,MAAM,uBAAuB,CAAC;AAI1F,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAG1C,MAAM,MAAM,SAAS,GAAG,IAAI,CAAC,gBAAgB,EAAE,UAAU,CAAC,GAAG;IAAE,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAA;CAAE,CAAC;AACxG,MAAM,MAAM,cAAc,GAAG,CAAC,MAAM,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;AAElF,UAAU,cAAc;IACtB,eAAe,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;IACjD,oBAAoB,EAAE,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACzD,OAAO,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;IACvC,aAAa,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,yBAAyB,CAAC;IACnC,OAAO,CAAC,EAAE,yBAAyB,CAAC;IACpC,WAAW,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC5B,aAAa,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,iBAAiB,CAAC,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAC;IACpD,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,UAAU,EAAE,mBAAmB,CAAC,UAAU,CAAC;IAC3C,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,MAAM,WAAW,kBAAmB,SAAQ,kBAAkB;IAC5D,GAAG,EAAE,SAAS,CAAC,iBAAiB,CAAC,CAAC;CACnC;AAED,wBAAgB,SAAS,CAAC,EACxB,eAAe,EACf,oBAAoB,EACpB,OAAO,EACP,aAAa,EACb,MAAM,EACN,OAAO,EACP,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,aAAa,EACb,iBAAiB,EACjB,oBAA4B,EAC5B,UAAU,EACV,aAAa,EACb,cAAc,EACd,SAAS,GACV,EAAE,cAAc;;;;;;4BA4Ge,KAC5B,aAAa,EACb,SAAS,GAAG,QAAQ,GAAG,mBAAmB,GAAG,qBAAqB,CACnE;;0BA4B0B,QAAQ,WAAW,CAAC;6BAoEf,cAAc,SAAS,MAAM;;4BApJ9B,cAAc;;;EAiO9C"}
|
|
@@ -9,7 +9,7 @@ import useForwardFocus from '../../internal/hooks/forward-focus';
|
|
|
9
9
|
import { usePrevious } from '../../internal/hooks/use-previous';
|
|
10
10
|
import { useUniqueId } from '../../internal/hooks/use-unique-id';
|
|
11
11
|
import { connectOptionsByValue } from './connect-options';
|
|
12
|
-
export function useSelect({ selectedOptions, updateSelectedOption, options, filteringType, onBlur, onFocus, externalRef, keepOpen, embedded, fireLoadItems, setFilteringValue, useInteractiveGroups = false, statusType, }) {
|
|
12
|
+
export function useSelect({ selectedOptions, updateSelectedOption, options, filteringType, onBlur, onFocus, externalRef, keepOpen, embedded, fireLoadItems, setFilteringValue, useInteractiveGroups = false, statusType, isAllSelected, isSomeSelected, toggleAll, }) {
|
|
13
13
|
const interactivityCheck = useInteractiveGroups ? isGroupInteractive : isInteractive;
|
|
14
14
|
const isHighlightable = (option) => !!option && (useInteractiveGroups || option.type !== 'parent');
|
|
15
15
|
const filterRef = useRef(null);
|
|
@@ -24,7 +24,7 @@ export function useSelect({ selectedOptions, updateSelectedOption, options, filt
|
|
|
24
24
|
}
|
|
25
25
|
return selectedValuesSet;
|
|
26
26
|
}, new Set());
|
|
27
|
-
const [{ highlightType, highlightedOption, highlightedIndex }, { moveHighlightWithKeyboard, resetHighlightWithKeyboard, setHighlightedIndexWithMouse, highlightOptionWithKeyboard, goHomeWithKeyboard, goEndWithKeyboard, },] = useHighlightedOption({ options, isHighlightable });
|
|
27
|
+
const [{ highlightType, highlightedOption, highlightedIndex }, { moveHighlightWithKeyboard, resetHighlightWithKeyboard, setHighlightedIndexWithMouse, highlightOptionWithKeyboard, goHomeWithKeyboard, goEndWithKeyboard, },] = useHighlightedOption({ options: options, isHighlightable });
|
|
28
28
|
const { isOpen, openDropdown, closeDropdown, toggleDropdown, openedWithKeyboard } = useOpenState({
|
|
29
29
|
defaultOpen: embedded,
|
|
30
30
|
onOpen: () => fireLoadItems(''),
|
|
@@ -44,17 +44,25 @@ export function useSelect({ selectedOptions, updateSelectedOption, options, filt
|
|
|
44
44
|
const menuId = useUniqueId('option-list');
|
|
45
45
|
const dialogId = useUniqueId('dialog');
|
|
46
46
|
const highlightedOptionId = getOptionId(menuId, highlightedIndex);
|
|
47
|
-
const
|
|
47
|
+
const closeDropdownIfNecessary = () => {
|
|
48
48
|
var _a;
|
|
49
|
+
if (!keepOpen) {
|
|
50
|
+
(_a = triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
51
|
+
closeDropdown();
|
|
52
|
+
}
|
|
53
|
+
};
|
|
54
|
+
const selectOption = (option) => {
|
|
49
55
|
const optionToSelect = option || highlightedOption;
|
|
50
56
|
if (!optionToSelect || !interactivityCheck(optionToSelect)) {
|
|
51
57
|
return;
|
|
52
58
|
}
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
59
|
+
if (optionToSelect.type === 'select-all' && toggleAll) {
|
|
60
|
+
toggleAll();
|
|
61
|
+
}
|
|
62
|
+
else {
|
|
63
|
+
updateSelectedOption(optionToSelect.option);
|
|
57
64
|
}
|
|
65
|
+
closeDropdownIfNecessary();
|
|
58
66
|
};
|
|
59
67
|
const activeKeyDownHandler = useMenuKeyboard({
|
|
60
68
|
goUp: () => {
|
|
@@ -182,9 +190,10 @@ export function useSelect({ selectedOptions, updateSelectedOption, options, filt
|
|
|
182
190
|
};
|
|
183
191
|
const getOptionProps = (option, index) => {
|
|
184
192
|
var _a;
|
|
193
|
+
const isSelectAll = option.type === 'select-all';
|
|
185
194
|
const highlighted = option === highlightedOption;
|
|
186
195
|
const groupState = isGroup(option.option) ? getGroupState(option.option) : undefined;
|
|
187
|
-
const selected = __selectedOptions.indexOf(option) > -1 || !!(groupState === null || groupState === void 0 ? void 0 : groupState.selected);
|
|
196
|
+
const selected = isSelectAll ? isAllSelected : __selectedOptions.indexOf(option) > -1 || !!(groupState === null || groupState === void 0 ? void 0 : groupState.selected);
|
|
188
197
|
const nextOption = (_a = options[index + 1]) === null || _a === void 0 ? void 0 : _a.option;
|
|
189
198
|
const isNextSelected = !!nextOption && isGroup(nextOption)
|
|
190
199
|
? getGroupState(nextOption).selected
|
|
@@ -195,7 +204,7 @@ export function useSelect({ selectedOptions, updateSelectedOption, options, filt
|
|
|
195
204
|
highlighted,
|
|
196
205
|
selected,
|
|
197
206
|
isNextSelected,
|
|
198
|
-
indeterminate: !!(groupState === null || groupState === void 0 ? void 0 : groupState.indeterminate),
|
|
207
|
+
indeterminate: !!(groupState === null || groupState === void 0 ? void 0 : groupState.indeterminate) || (isSelectAll && !isAllSelected && isSomeSelected),
|
|
199
208
|
['data-mouse-target']: isHighlightable(option) ? index : -1,
|
|
200
209
|
id: getOptionId(menuId, index),
|
|
201
210
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-select.js","sourceRoot":"","sources":["../../../../src/select/utils/use-select.ts"],"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, { RefObject } from 'react';\nimport { useEffect, useRef } from 'react';\n\nimport { ButtonTriggerProps } from '../../internal/components/button-trigger';\nimport { DropdownProps } from '../../internal/components/dropdown/interfaces';\nimport { DropdownStatusProps } from '../../internal/components/dropdown-status';\nimport { DropdownOption, OptionDefinition, OptionGroup } from '../../internal/components/option/interfaces';\nimport { isGroup, isGroupInteractive, isInteractive } from '../../internal/components/option/utils/filter-options';\nimport { OptionsListProps } from '../../internal/components/options-list';\nimport { useHighlightedOption } from '../../internal/components/options-list/utils/use-highlight-option';\nimport { getOptionId } from '../../internal/components/options-list/utils/use-ids';\nimport { useMenuKeyboard, useTriggerKeyboard } from '../../internal/components/options-list/utils/use-keyboard';\nimport { useOpenState } from '../../internal/components/options-list/utils/use-open-state';\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../../internal/events';\nimport useForwardFocus from '../../internal/hooks/forward-focus';\nimport { usePrevious } from '../../internal/hooks/use-previous';\nimport { useUniqueId } from '../../internal/hooks/use-unique-id';\nimport { FilterProps } from '../parts/filter';\nimport { ItemProps } from '../parts/item';\nimport { connectOptionsByValue } from './connect-options';\n\nexport type MenuProps = Omit<OptionsListProps, 'children'> & { ref: React.RefObject<HTMLUListElement> };\nexport type GetOptionProps = (option: DropdownOption, index: number) => ItemProps;\n\ninterface UseSelectProps {\n selectedOptions: ReadonlyArray<OptionDefinition>;\n updateSelectedOption: (option: OptionDefinition) => void;\n options: ReadonlyArray<DropdownOption>;\n filteringType: string;\n keepOpen?: boolean;\n embedded?: boolean;\n onBlur?: NonCancelableEventHandler;\n onFocus?: NonCancelableEventHandler;\n externalRef: React.Ref<any>;\n fireLoadItems: (filteringText: string) => void;\n setFilteringValue?: (filteringText: string) => void;\n useInteractiveGroups?: boolean;\n statusType: DropdownStatusProps.StatusType;\n}\n\nexport interface SelectTriggerProps extends ButtonTriggerProps {\n ref: RefObject<HTMLButtonElement>;\n}\n\nexport function useSelect({\n selectedOptions,\n updateSelectedOption,\n options,\n filteringType,\n onBlur,\n onFocus,\n externalRef,\n keepOpen,\n embedded,\n fireLoadItems,\n setFilteringValue,\n useInteractiveGroups = false,\n statusType,\n}: UseSelectProps) {\n const interactivityCheck = useInteractiveGroups ? isGroupInteractive : isInteractive;\n\n const isHighlightable = (option?: DropdownOption) => !!option && (useInteractiveGroups || option.type !== 'parent');\n\n const filterRef = useRef<HTMLInputElement>(null);\n const triggerRef = useRef<HTMLButtonElement>(null);\n const menuRef = useRef<HTMLUListElement>(null);\n const hasFilter = filteringType !== 'none' && !embedded;\n const activeRef = hasFilter ? filterRef : menuRef;\n const __selectedOptions = connectOptionsByValue(options, selectedOptions);\n const __selectedValuesSet = selectedOptions.reduce((selectedValuesSet: Set<string>, item: OptionDefinition) => {\n if (item.value) {\n selectedValuesSet.add(item.value);\n }\n return selectedValuesSet;\n }, new Set<string>());\n const [\n { highlightType, highlightedOption, highlightedIndex },\n {\n moveHighlightWithKeyboard,\n resetHighlightWithKeyboard,\n setHighlightedIndexWithMouse,\n highlightOptionWithKeyboard,\n goHomeWithKeyboard,\n goEndWithKeyboard,\n },\n ] = useHighlightedOption({ options, isHighlightable });\n\n const { isOpen, openDropdown, closeDropdown, toggleDropdown, openedWithKeyboard } = useOpenState({\n defaultOpen: embedded,\n onOpen: () => fireLoadItems(''),\n onClose: () => {\n resetHighlightWithKeyboard();\n setFilteringValue?.('');\n },\n });\n\n const handleFocus = () => {\n fireNonCancelableEvent(onFocus, {});\n };\n\n const handleBlur = () => {\n fireNonCancelableEvent(onBlur, {});\n closeDropdown();\n };\n\n const hasSelectedOption = __selectedOptions.length > 0;\n const menuId = useUniqueId('option-list');\n const dialogId = useUniqueId('dialog');\n const highlightedOptionId = getOptionId(menuId, highlightedIndex);\n\n const selectOption = (option?: DropdownOption) => {\n const optionToSelect = option || highlightedOption;\n if (!optionToSelect || !interactivityCheck(optionToSelect)) {\n return;\n }\n updateSelectedOption(optionToSelect.option);\n if (!keepOpen) {\n triggerRef.current?.focus();\n closeDropdown();\n }\n };\n\n const activeKeyDownHandler = useMenuKeyboard({\n goUp: () => {\n if (\n (!useInteractiveGroups && highlightedOption?.type === 'child' && highlightedIndex === 1) ||\n highlightedIndex === 0\n ) {\n goEndWithKeyboard();\n return;\n }\n\n moveHighlightWithKeyboard(-1);\n },\n goDown: () => {\n if (highlightedIndex === options.length - 1) {\n goHomeWithKeyboard();\n return;\n }\n\n moveHighlightWithKeyboard(1);\n },\n selectOption,\n goHome: goHomeWithKeyboard,\n goEnd: goEndWithKeyboard,\n closeDropdown: () => {\n if (!embedded) {\n triggerRef.current?.focus();\n closeDropdown();\n }\n },\n preventNativeSpace: !hasFilter || !!highlightedOption,\n });\n\n const triggerKeyDownHandler = useTriggerKeyboard({\n openDropdown: () => openDropdown(true),\n goHome: goHomeWithKeyboard,\n });\n\n const getDropdownProps: () => Pick<\n DropdownProps,\n 'onFocus' | 'onBlur' | 'dropdownContentId' | 'dropdownContentRole'\n > = () => ({\n onFocus: handleFocus,\n onBlur: handleBlur,\n dropdownContentId: dialogId,\n dropdownContentRole: hasFilter ? 'dialog' : undefined,\n });\n\n const getTriggerProps = (disabled = false, autoFocus = false) => {\n const triggerProps: SelectTriggerProps = {\n ref: triggerRef,\n onFocus: () => closeDropdown(),\n autoFocus,\n ariaHasPopup: hasFilter ? 'dialog' : 'listbox',\n ariaControls: isOpen ? (hasFilter ? dialogId : menuId) : undefined,\n };\n if (!disabled) {\n triggerProps.onMouseDown = (event: CustomEvent) => {\n event.preventDefault(); // prevent current focus from blurring as it immediately closes the dropdown\n if (isOpen) {\n triggerRef.current?.focus();\n }\n toggleDropdown();\n };\n triggerProps.onKeyDown = triggerKeyDownHandler;\n }\n return triggerProps;\n };\n\n const getFilterProps = (): Partial<FilterProps> => {\n if (!hasFilter || !setFilteringValue) {\n return {};\n }\n\n return {\n ref: filterRef,\n onKeyDown: activeKeyDownHandler,\n onChange: event => {\n setFilteringValue(event.detail.value);\n resetHighlightWithKeyboard();\n },\n __onDelayedInput: event => {\n fireLoadItems(event.detail.value);\n },\n __nativeAttributes: {\n 'aria-activedescendant': highlightedOptionId,\n ['aria-owns']: menuId,\n ['aria-controls']: menuId,\n },\n };\n };\n\n const getMenuProps = () => {\n const menuProps: MenuProps = {\n id: menuId,\n ref: menuRef,\n open: isOpen,\n onMouseUp: itemIndex => {\n if (itemIndex > -1) {\n selectOption(options[itemIndex]);\n }\n },\n onMouseMove: itemIndex => {\n if (itemIndex > -1) {\n setHighlightedIndexWithMouse(itemIndex);\n }\n },\n statusType,\n };\n if (!hasFilter) {\n menuProps.onKeyDown = activeKeyDownHandler;\n menuProps.nativeAttributes = {\n 'aria-activedescendant': highlightedOptionId,\n };\n }\n if (embedded) {\n menuProps.onFocus = () => {\n if (!highlightedOption) {\n goHomeWithKeyboard();\n }\n };\n menuProps.onBlur = () => {\n resetHighlightWithKeyboard();\n };\n }\n return menuProps;\n };\n const getGroupState = (option: OptionGroup) => {\n const totalSelected = option.options.filter(item => !!item.value && __selectedValuesSet.has(item.value)).length;\n const hasSelected = totalSelected > 0;\n const allSelected = totalSelected === option.options.length;\n return {\n selected: hasSelected && allSelected && useInteractiveGroups,\n indeterminate: hasSelected && !allSelected,\n };\n };\n\n const getOptionProps = (option: DropdownOption, index: number) => {\n const highlighted = option === highlightedOption;\n const groupState = isGroup(option.option) ? getGroupState(option.option) : undefined;\n const selected = __selectedOptions.indexOf(option) > -1 || !!groupState?.selected;\n const nextOption = options[index + 1]?.option;\n const isNextSelected =\n !!nextOption && isGroup(nextOption)\n ? getGroupState(nextOption).selected\n : __selectedOptions.indexOf(options[index + 1]) > -1;\n const optionProps: any = {\n key: index,\n option,\n highlighted,\n selected,\n isNextSelected,\n indeterminate: !!groupState?.indeterminate,\n ['data-mouse-target']: isHighlightable(option) ? index : -1,\n id: getOptionId(menuId, index),\n };\n\n return optionProps;\n };\n\n const prevOpen = usePrevious<boolean>(isOpen);\n useEffect(() => {\n // highlight the first selected option, when opening the Select component without filter input\n // keep the focus in the filter input when opening, so that screenreader can recognize the combobox\n if (isOpen && !prevOpen && hasSelectedOption && !hasFilter) {\n if (openedWithKeyboard) {\n highlightOptionWithKeyboard(__selectedOptions[0]);\n } else {\n setHighlightedIndexWithMouse(options.indexOf(__selectedOptions[0]), true);\n }\n }\n }, [\n isOpen,\n __selectedOptions,\n hasSelectedOption,\n setHighlightedIndexWithMouse,\n highlightOptionWithKeyboard,\n openedWithKeyboard,\n options,\n prevOpen,\n hasFilter,\n ]);\n\n useEffect(() => {\n if (isOpen && !embedded) {\n // dropdown-fit calculations ensure that the dropdown will fit inside the current\n // viewport, so prevent the browser from trying to scroll it into view (e.g. if\n // scroll-padding-top is set on a parent)\n activeRef.current?.focus({ preventScroll: true });\n }\n }, [isOpen, activeRef, embedded]);\n\n useForwardFocus(externalRef, triggerRef as React.RefObject<HTMLElement>);\n const highlightedGroupSelected =\n !!highlightedOption && isGroup(highlightedOption.option) && getGroupState(highlightedOption.option).selected;\n const announceSelected =\n !!highlightedOption && (__selectedOptions.indexOf(highlightedOption) > -1 || highlightedGroupSelected);\n\n return {\n isOpen,\n highlightedOption,\n highlightedIndex,\n highlightType,\n getTriggerProps,\n getDropdownProps,\n getMenuProps,\n getFilterProps,\n getOptionProps,\n highlightOption: highlightOptionWithKeyboard,\n selectOption,\n announceSelected,\n dialogId,\n };\n}\n"]}
|
|
1
|
+
{"version":3,"file":"use-select.js","sourceRoot":"","sources":["../../../../src/select/utils/use-select.ts"],"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, { RefObject } from 'react';\nimport { useEffect, useRef } from 'react';\n\nimport { ButtonTriggerProps } from '../../internal/components/button-trigger';\nimport { DropdownProps } from '../../internal/components/dropdown/interfaces';\nimport { DropdownStatusProps } from '../../internal/components/dropdown-status';\nimport { DropdownOption, OptionDefinition, OptionGroup } from '../../internal/components/option/interfaces';\nimport { isGroup, isGroupInteractive, isInteractive } from '../../internal/components/option/utils/filter-options';\nimport { OptionsListProps } from '../../internal/components/options-list';\nimport { useHighlightedOption } from '../../internal/components/options-list/utils/use-highlight-option';\nimport { getOptionId } from '../../internal/components/options-list/utils/use-ids';\nimport { useMenuKeyboard, useTriggerKeyboard } from '../../internal/components/options-list/utils/use-keyboard';\nimport { useOpenState } from '../../internal/components/options-list/utils/use-open-state';\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../../internal/events';\nimport useForwardFocus from '../../internal/hooks/forward-focus';\nimport { usePrevious } from '../../internal/hooks/use-previous';\nimport { useUniqueId } from '../../internal/hooks/use-unique-id';\nimport { FilterProps } from '../parts/filter';\nimport { ItemProps } from '../parts/item';\nimport { connectOptionsByValue } from './connect-options';\n\nexport type MenuProps = Omit<OptionsListProps, 'children'> & { ref: React.RefObject<HTMLUListElement> };\nexport type GetOptionProps = (option: DropdownOption, index: number) => ItemProps;\n\ninterface UseSelectProps {\n selectedOptions: ReadonlyArray<OptionDefinition>;\n updateSelectedOption: (option: OptionDefinition) => void;\n options: ReadonlyArray<DropdownOption>;\n filteringType: string;\n keepOpen?: boolean;\n embedded?: boolean;\n onBlur?: NonCancelableEventHandler;\n onFocus?: NonCancelableEventHandler;\n externalRef: React.Ref<any>;\n fireLoadItems: (filteringText: string) => void;\n setFilteringValue?: (filteringText: string) => void;\n useInteractiveGroups?: boolean;\n statusType: DropdownStatusProps.StatusType;\n isAllSelected?: boolean;\n isSomeSelected?: boolean;\n toggleAll?: () => void;\n}\n\nexport interface SelectTriggerProps extends ButtonTriggerProps {\n ref: RefObject<HTMLButtonElement>;\n}\n\nexport function useSelect({\n selectedOptions,\n updateSelectedOption,\n options,\n filteringType,\n onBlur,\n onFocus,\n externalRef,\n keepOpen,\n embedded,\n fireLoadItems,\n setFilteringValue,\n useInteractiveGroups = false,\n statusType,\n isAllSelected,\n isSomeSelected,\n toggleAll,\n}: UseSelectProps) {\n const interactivityCheck = useInteractiveGroups ? isGroupInteractive : isInteractive;\n\n const isHighlightable = (option?: DropdownOption) => !!option && (useInteractiveGroups || option.type !== 'parent');\n\n const filterRef = useRef<HTMLInputElement>(null);\n const triggerRef = useRef<HTMLButtonElement>(null);\n const menuRef = useRef<HTMLUListElement>(null);\n const hasFilter = filteringType !== 'none' && !embedded;\n const activeRef = hasFilter ? filterRef : menuRef;\n const __selectedOptions = connectOptionsByValue(options, selectedOptions);\n const __selectedValuesSet = selectedOptions.reduce((selectedValuesSet: Set<string>, item: OptionDefinition) => {\n if (item.value) {\n selectedValuesSet.add(item.value);\n }\n return selectedValuesSet;\n }, new Set<string>());\n const [\n { highlightType, highlightedOption, highlightedIndex },\n {\n moveHighlightWithKeyboard,\n resetHighlightWithKeyboard,\n setHighlightedIndexWithMouse,\n highlightOptionWithKeyboard,\n goHomeWithKeyboard,\n goEndWithKeyboard,\n },\n ] = useHighlightedOption({ options: options, isHighlightable });\n\n const { isOpen, openDropdown, closeDropdown, toggleDropdown, openedWithKeyboard } = useOpenState({\n defaultOpen: embedded,\n onOpen: () => fireLoadItems(''),\n onClose: () => {\n resetHighlightWithKeyboard();\n setFilteringValue?.('');\n },\n });\n\n const handleFocus = () => {\n fireNonCancelableEvent(onFocus, {});\n };\n\n const handleBlur = () => {\n fireNonCancelableEvent(onBlur, {});\n closeDropdown();\n };\n\n const hasSelectedOption = __selectedOptions.length > 0;\n const menuId = useUniqueId('option-list');\n const dialogId = useUniqueId('dialog');\n const highlightedOptionId = getOptionId(menuId, highlightedIndex);\n\n const closeDropdownIfNecessary = () => {\n if (!keepOpen) {\n triggerRef.current?.focus();\n closeDropdown();\n }\n };\n\n const selectOption = (option?: DropdownOption) => {\n const optionToSelect = option || highlightedOption;\n if (!optionToSelect || !interactivityCheck(optionToSelect)) {\n return;\n }\n if (optionToSelect.type === 'select-all' && toggleAll) {\n toggleAll();\n } else {\n updateSelectedOption(optionToSelect.option);\n }\n closeDropdownIfNecessary();\n };\n\n const activeKeyDownHandler = useMenuKeyboard({\n goUp: () => {\n if (\n (!useInteractiveGroups && highlightedOption?.type === 'child' && highlightedIndex === 1) ||\n highlightedIndex === 0\n ) {\n goEndWithKeyboard();\n return;\n }\n moveHighlightWithKeyboard(-1);\n },\n goDown: () => {\n if (highlightedIndex === options.length - 1) {\n goHomeWithKeyboard();\n return;\n }\n\n moveHighlightWithKeyboard(1);\n },\n selectOption,\n goHome: goHomeWithKeyboard,\n goEnd: goEndWithKeyboard,\n closeDropdown: () => {\n if (!embedded) {\n triggerRef.current?.focus();\n closeDropdown();\n }\n },\n preventNativeSpace: !hasFilter || !!highlightedOption,\n });\n\n const triggerKeyDownHandler = useTriggerKeyboard({\n openDropdown: () => openDropdown(true),\n goHome: goHomeWithKeyboard,\n });\n\n const getDropdownProps: () => Pick<\n DropdownProps,\n 'onFocus' | 'onBlur' | 'dropdownContentId' | 'dropdownContentRole'\n > = () => ({\n onFocus: handleFocus,\n onBlur: handleBlur,\n dropdownContentId: dialogId,\n dropdownContentRole: hasFilter ? 'dialog' : undefined,\n });\n\n const getTriggerProps = (disabled = false, autoFocus = false) => {\n const triggerProps: SelectTriggerProps = {\n ref: triggerRef,\n onFocus: () => closeDropdown(),\n autoFocus,\n ariaHasPopup: hasFilter ? 'dialog' : 'listbox',\n ariaControls: isOpen ? (hasFilter ? dialogId : menuId) : undefined,\n };\n if (!disabled) {\n triggerProps.onMouseDown = (event: CustomEvent) => {\n event.preventDefault(); // prevent current focus from blurring as it immediately closes the dropdown\n if (isOpen) {\n triggerRef.current?.focus();\n }\n toggleDropdown();\n };\n triggerProps.onKeyDown = triggerKeyDownHandler;\n }\n return triggerProps;\n };\n\n const getFilterProps = (): Partial<FilterProps> => {\n if (!hasFilter || !setFilteringValue) {\n return {};\n }\n\n return {\n ref: filterRef,\n onKeyDown: activeKeyDownHandler,\n onChange: event => {\n setFilteringValue(event.detail.value);\n resetHighlightWithKeyboard();\n },\n __onDelayedInput: event => {\n fireLoadItems(event.detail.value);\n },\n __nativeAttributes: {\n 'aria-activedescendant': highlightedOptionId,\n ['aria-owns']: menuId,\n ['aria-controls']: menuId,\n },\n };\n };\n\n const getMenuProps = () => {\n const menuProps: MenuProps = {\n id: menuId,\n ref: menuRef,\n open: isOpen,\n onMouseUp: itemIndex => {\n if (itemIndex > -1) {\n selectOption(options[itemIndex]);\n }\n },\n onMouseMove: itemIndex => {\n if (itemIndex > -1) {\n setHighlightedIndexWithMouse(itemIndex);\n }\n },\n statusType,\n };\n if (!hasFilter) {\n menuProps.onKeyDown = activeKeyDownHandler;\n menuProps.nativeAttributes = {\n 'aria-activedescendant': highlightedOptionId,\n };\n }\n if (embedded) {\n menuProps.onFocus = () => {\n if (!highlightedOption) {\n goHomeWithKeyboard();\n }\n };\n menuProps.onBlur = () => {\n resetHighlightWithKeyboard();\n };\n }\n return menuProps;\n };\n const getGroupState = (option: OptionGroup) => {\n const totalSelected = option.options.filter(item => !!item.value && __selectedValuesSet.has(item.value)).length;\n const hasSelected = totalSelected > 0;\n const allSelected = totalSelected === option.options.length;\n return {\n selected: hasSelected && allSelected && useInteractiveGroups,\n indeterminate: hasSelected && !allSelected,\n };\n };\n\n const getOptionProps = (option: DropdownOption, index: number) => {\n const isSelectAll = option.type === 'select-all';\n const highlighted = option === highlightedOption;\n const groupState = isGroup(option.option) ? getGroupState(option.option) : undefined;\n const selected = isSelectAll ? isAllSelected : __selectedOptions.indexOf(option) > -1 || !!groupState?.selected;\n const nextOption = options[index + 1]?.option;\n const isNextSelected =\n !!nextOption && isGroup(nextOption)\n ? getGroupState(nextOption).selected\n : __selectedOptions.indexOf(options[index + 1]) > -1;\n const optionProps: any = {\n key: index,\n option,\n highlighted,\n selected,\n isNextSelected,\n indeterminate: !!groupState?.indeterminate || (isSelectAll && !isAllSelected && isSomeSelected),\n ['data-mouse-target']: isHighlightable(option) ? index : -1,\n id: getOptionId(menuId, index),\n };\n\n return optionProps;\n };\n\n const prevOpen = usePrevious<boolean>(isOpen);\n useEffect(() => {\n // highlight the first selected option, when opening the Select component without filter input\n // keep the focus in the filter input when opening, so that screenreader can recognize the combobox\n if (isOpen && !prevOpen && hasSelectedOption && !hasFilter) {\n if (openedWithKeyboard) {\n highlightOptionWithKeyboard(__selectedOptions[0]);\n } else {\n setHighlightedIndexWithMouse(options.indexOf(__selectedOptions[0]), true);\n }\n }\n }, [\n isOpen,\n __selectedOptions,\n hasSelectedOption,\n setHighlightedIndexWithMouse,\n highlightOptionWithKeyboard,\n openedWithKeyboard,\n options,\n prevOpen,\n hasFilter,\n ]);\n\n useEffect(() => {\n if (isOpen && !embedded) {\n // dropdown-fit calculations ensure that the dropdown will fit inside the current\n // viewport, so prevent the browser from trying to scroll it into view (e.g. if\n // scroll-padding-top is set on a parent)\n activeRef.current?.focus({ preventScroll: true });\n }\n }, [isOpen, activeRef, embedded]);\n\n useForwardFocus(externalRef, triggerRef as React.RefObject<HTMLElement>);\n const highlightedGroupSelected =\n !!highlightedOption && isGroup(highlightedOption.option) && getGroupState(highlightedOption.option).selected;\n const announceSelected =\n !!highlightedOption && (__selectedOptions.indexOf(highlightedOption) > -1 || highlightedGroupSelected);\n\n return {\n isOpen,\n highlightedOption,\n highlightedIndex,\n highlightType,\n getTriggerProps,\n getDropdownProps,\n getMenuProps,\n getFilterProps,\n getOptionProps,\n highlightOption: highlightOptionWithKeyboard,\n selectOption,\n announceSelected,\n dialogId,\n };\n}\n"]}
|
|
@@ -25,7 +25,7 @@ export default abstract class DropdownHostComponentWrapper extends ComponentWrap
|
|
|
25
25
|
/**
|
|
26
26
|
* Selects an option for the given index by triggering corresponding events.
|
|
27
27
|
*
|
|
28
|
-
* This utility does not open the dropdown of the given select
|
|
28
|
+
* This utility does not open the dropdown of the given select. You will need to call `openDropdown` first in your test.
|
|
29
29
|
* On selection the dropdown will close automatically.
|
|
30
30
|
*
|
|
31
31
|
* Example:
|
|
@@ -44,7 +44,7 @@ export default abstract class DropdownHostComponentWrapper extends ComponentWrap
|
|
|
44
44
|
/**
|
|
45
45
|
* Selects an option for the given value by triggering corresponding events.
|
|
46
46
|
*
|
|
47
|
-
* This utility does not open the dropdown of the given select
|
|
47
|
+
* This utility does not open the dropdown of the given select. You will need to call `openDropdown` first in your test.
|
|
48
48
|
* On selection the dropdown will close automatically.
|
|
49
49
|
*
|
|
50
50
|
* Example:
|
|
@@ -60,6 +60,23 @@ export default abstract class DropdownHostComponentWrapper extends ComponentWrap
|
|
|
60
60
|
selectOptionByValue(value: string, options?: {
|
|
61
61
|
expandToViewport: boolean;
|
|
62
62
|
}): void;
|
|
63
|
+
/**
|
|
64
|
+
* Selects all options by triggering corresponding events on the element that selects or deselects all options in Multiselect when using the `enableSelectAll` flag.
|
|
65
|
+
*
|
|
66
|
+
* This utility does not open the dropdown of the given select. You will need to call `openDropdown` first in your test.
|
|
67
|
+
*
|
|
68
|
+
* Example:
|
|
69
|
+
* ```
|
|
70
|
+
* wrapper.openDropdown();
|
|
71
|
+
* wrapper.clickSelectAll();
|
|
72
|
+
* ```
|
|
73
|
+
*
|
|
74
|
+
* @param options
|
|
75
|
+
* * expandToViewport (boolean) - Use this when the component under test is rendered with an `expandToViewport` flag.
|
|
76
|
+
*/
|
|
77
|
+
clickSelectAll(options?: {
|
|
78
|
+
expandToViewport: boolean;
|
|
79
|
+
}): void;
|
|
63
80
|
}
|
|
64
81
|
export declare class DropdownContentWrapper extends ComponentWrapper {
|
|
65
82
|
findDisabledOptions(): Array<OptionWrapper>;
|
|
@@ -102,6 +119,7 @@ export declare class DropdownContentWrapper extends ComponentWrapper {
|
|
|
102
119
|
* Returns all option groups in the dropdown.
|
|
103
120
|
*/
|
|
104
121
|
findGroups(): Array<ElementWrapper>;
|
|
122
|
+
findSelectAll(): ElementWrapper | null;
|
|
105
123
|
}
|
|
106
124
|
export declare class PortalDropdownContentWrapper extends DropdownContentWrapper {
|
|
107
125
|
findOpenDropdown(): ElementWrapper | null;
|
|
@@ -63,7 +63,7 @@ class DropdownHostComponentWrapper extends dom_1.ComponentWrapper {
|
|
|
63
63
|
/**
|
|
64
64
|
* Selects an option for the given index by triggering corresponding events.
|
|
65
65
|
*
|
|
66
|
-
* This utility does not open the dropdown of the given select
|
|
66
|
+
* This utility does not open the dropdown of the given select. You will need to call `openDropdown` first in your test.
|
|
67
67
|
* On selection the dropdown will close automatically.
|
|
68
68
|
*
|
|
69
69
|
* Example:
|
|
@@ -92,7 +92,7 @@ class DropdownHostComponentWrapper extends dom_1.ComponentWrapper {
|
|
|
92
92
|
/**
|
|
93
93
|
* Selects an option for the given value by triggering corresponding events.
|
|
94
94
|
*
|
|
95
|
-
* This utility does not open the dropdown of the given select
|
|
95
|
+
* This utility does not open the dropdown of the given select. You will need to call `openDropdown` first in your test.
|
|
96
96
|
* On selection the dropdown will close automatically.
|
|
97
97
|
*
|
|
98
98
|
* Example:
|
|
@@ -115,6 +115,28 @@ class DropdownHostComponentWrapper extends dom_1.ComponentWrapper {
|
|
|
115
115
|
option.fireEvent(new MouseEvent('mouseup', { bubbles: true }));
|
|
116
116
|
});
|
|
117
117
|
}
|
|
118
|
+
/**
|
|
119
|
+
* Selects all options by triggering corresponding events on the element that selects or deselects all options in Multiselect when using the `enableSelectAll` flag.
|
|
120
|
+
*
|
|
121
|
+
* This utility does not open the dropdown of the given select. You will need to call `openDropdown` first in your test.
|
|
122
|
+
*
|
|
123
|
+
* Example:
|
|
124
|
+
* ```
|
|
125
|
+
* wrapper.openDropdown();
|
|
126
|
+
* wrapper.clickSelectAll();
|
|
127
|
+
* ```
|
|
128
|
+
*
|
|
129
|
+
* @param options
|
|
130
|
+
* * expandToViewport (boolean) - Use this when the component under test is rendered with an `expandToViewport` flag.
|
|
131
|
+
*/
|
|
132
|
+
clickSelectAll(options = { expandToViewport: false }) {
|
|
133
|
+
this.assertOpenDropdown(options);
|
|
134
|
+
const selectAll = this.findDropdown().findSelectAll();
|
|
135
|
+
if (!selectAll) {
|
|
136
|
+
throw new Error('Can\'t select all options, because there is no "select all" option. Make sure that this Multiselect has the `enableSelectAll` property set to true.');
|
|
137
|
+
}
|
|
138
|
+
selectAll.fireEvent(new MouseEvent('mouseup', { bubbles: true }));
|
|
139
|
+
}
|
|
118
140
|
}
|
|
119
141
|
__decorate([
|
|
120
142
|
dom_1.usesDom
|
|
@@ -128,6 +150,9 @@ __decorate([
|
|
|
128
150
|
__decorate([
|
|
129
151
|
dom_1.usesDom
|
|
130
152
|
], DropdownHostComponentWrapper.prototype, "selectOptionByValue", null);
|
|
153
|
+
__decorate([
|
|
154
|
+
dom_1.usesDom
|
|
155
|
+
], DropdownHostComponentWrapper.prototype, "clickSelectAll", null);
|
|
131
156
|
exports.default = DropdownHostComponentWrapper;
|
|
132
157
|
class DropdownContentWrapper extends dom_1.ComponentWrapper {
|
|
133
158
|
findDisabledOptions() {
|
|
@@ -200,6 +225,12 @@ class DropdownContentWrapper extends dom_1.ComponentWrapper {
|
|
|
200
225
|
findGroups() {
|
|
201
226
|
return this.findAll(`.${styles_selectors_js_4.default['selectable-item']}[data-group-index]:not([data-test-index])`);
|
|
202
227
|
}
|
|
228
|
+
/*
|
|
229
|
+
* Returns the element that selects or deselects all options in Multiselect when using the `enableSelectAll` flag.
|
|
230
|
+
*/
|
|
231
|
+
findSelectAll() {
|
|
232
|
+
return this.find(`.${styles_selectors_js_4.default['select-all']}`);
|
|
233
|
+
}
|
|
203
234
|
}
|
|
204
235
|
exports.DropdownContentWrapper = DropdownContentWrapper;
|
|
205
236
|
class PortalDropdownContentWrapper extends DropdownContentWrapper {
|