@cloudscape-design/components 3.0.770 → 3.0.771
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/button/analytics-metadata/interfaces.d.ts +1 -1
- package/button/analytics-metadata/interfaces.d.ts.map +1 -1
- package/button/analytics-metadata/interfaces.js.map +1 -1
- package/button/internal.d.ts +2 -0
- package/button/internal.d.ts.map +1 -1
- package/button/internal.js +2 -2
- package/button/internal.js.map +1 -1
- package/internal/components/chart-filter/index.d.ts.map +1 -1
- package/internal/components/chart-filter/index.js +1 -1
- package/internal/components/chart-filter/index.js.map +1 -1
- package/internal/components/dropdown-status/index.d.ts +1 -1
- package/internal/components/dropdown-status/index.d.ts.map +1 -1
- package/internal/components/dropdown-status/index.js.map +1 -1
- package/internal/environment.js +1 -1
- package/internal/environment.json +1 -1
- package/internal/manifest.json +1 -1
- package/multiselect/internal.d.ts +8 -1
- package/multiselect/internal.d.ts.map +1 -1
- package/multiselect/internal.js +22 -136
- package/multiselect/internal.js.map +1 -1
- package/multiselect/use-multiselect.d.ts +64 -0
- package/multiselect/use-multiselect.d.ts.map +1 -0
- package/multiselect/use-multiselect.js +163 -0
- package/multiselect/use-multiselect.js.map +1 -0
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../src/button/analytics-metadata/interfaces.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,kEAAkE,CAAC;AAEnG,UAAU,qCAAqC;IAC7C,MAAM,EAAE,
|
|
1
|
+
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../src/button/analytics-metadata/interfaces.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,kEAAkE,CAAC;AAEnG,UAAU,qCAAqC;IAC7C,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE;QACN,KAAK,EAAE,MAAM,GAAG,eAAe,CAAC;KACjC,CAAC;CACH;AAED,UAAU,yCAAyC;IACjD,IAAI,EAAE,cAAc,CAAC;IACrB,KAAK,EAAE,MAAM,GAAG,eAAe,CAAC;IAChC,UAAU,EAAE;QACV,OAAO,EAAE,MAAM,CAAC;QAChB,QAAQ,EAAE,MAAM,CAAC;KAClB,CAAC;CACH;AAED,MAAM,WAAW,wCAAyC,SAAQ,OAAO,CAAC,qCAAqC,CAAC;IAC9G,SAAS,CAAC,EAAE,yCAAyC,CAAC;CACvD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../src/button/analytics-metadata/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { LabelIdentifier } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\ninterface GeneratedAnalyticsMetadataButtonClick {\n action:
|
|
1
|
+
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../src/button/analytics-metadata/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { LabelIdentifier } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\ninterface GeneratedAnalyticsMetadataButtonClick {\n action: string;\n detail: {\n label: string | LabelIdentifier;\n };\n}\n\ninterface GeneratedAnalyticsMetadataButtonComponent {\n name: 'awsui.Button';\n label: string | LabelIdentifier;\n properties: {\n variant: string;\n disabled: string;\n };\n}\n\nexport interface GeneratedAnalyticsMetadataButtonFragment extends Partial<GeneratedAnalyticsMetadataButtonClick> {\n component?: GeneratedAnalyticsMetadataButtonComponent;\n}\n"]}
|
package/button/internal.d.ts
CHANGED
|
@@ -4,6 +4,7 @@ import { ButtonProps } from './interfaces';
|
|
|
4
4
|
export type InternalButtonProps = Omit<ButtonProps, 'variant'> & {
|
|
5
5
|
variant?: ButtonProps['variant'] | 'flashbar-icon' | 'breadcrumb-group' | 'menu-trigger' | 'modal-dismiss';
|
|
6
6
|
badge?: boolean;
|
|
7
|
+
analyticsAction?: string;
|
|
7
8
|
__nativeAttributes?: (React.HTMLAttributes<HTMLAnchorElement> & React.HTMLAttributes<HTMLButtonElement>) | Record<`data-${string}`, string>;
|
|
8
9
|
__iconClass?: string;
|
|
9
10
|
__focusable?: boolean;
|
|
@@ -14,6 +15,7 @@ export type InternalButtonProps = Omit<ButtonProps, 'variant'> & {
|
|
|
14
15
|
export declare const InternalButton: React.ForwardRefExoticComponent<Omit<ButtonProps, "variant"> & {
|
|
15
16
|
variant?: ButtonProps['variant'] | 'flashbar-icon' | 'breadcrumb-group' | 'menu-trigger' | 'modal-dismiss';
|
|
16
17
|
badge?: boolean | undefined;
|
|
18
|
+
analyticsAction?: string | undefined;
|
|
17
19
|
__nativeAttributes?: (React.HTMLAttributes<HTMLAnchorElement> & React.HTMLAttributes<HTMLButtonElement>) | Record<`data-${string}`, string> | undefined;
|
|
18
20
|
__iconClass?: string | undefined;
|
|
19
21
|
__focusable?: boolean | undefined;
|
package/button/internal.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/button/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAsB3D,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAQlF,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAM3C,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC,GAAG;IAC/D,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,GAAG,eAAe,GAAG,kBAAkB,GAAG,cAAc,GAAG,eAAe,CAAC;IAC3G,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,kBAAkB,CAAC,EACf,CAAC,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC,GAAG,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAC,GACnF,MAAM,CAAC,QAAQ,MAAM,EAAE,EAAE,MAAM,CAAC,CAAC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,kCAAkC,CAAC,EAAE,OAAO,CAAC;IAC7C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,sBAAsB,CAAC,EAAE,OAAO,CAAC;CAClC,GAAG,0BAA0B,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;AAEtE,eAAO,MAAM,cAAc;
|
|
1
|
+
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/button/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAsB3D,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAQlF,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAM3C,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC,GAAG;IAC/D,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,GAAG,eAAe,GAAG,kBAAkB,GAAG,cAAc,GAAG,eAAe,CAAC;IAC3G,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kBAAkB,CAAC,EACf,CAAC,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC,GAAG,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAC,GACnF,MAAM,CAAC,QAAQ,MAAM,EAAE,EAAE,MAAM,CAAC,CAAC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,kCAAkC,CAAC,EAAE,OAAO,CAAC;IAC7C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,sBAAsB,CAAC,EAAE,OAAO,CAAC;CAClC,GAAG,0BAA0B,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,CAAC;AAEtE,eAAO,MAAM,cAAc;cAbf,WAAW,CAAC,SAAS,CAAC,GAAG,eAAe,GAAG,kBAAkB,GAAG,cAAc,GAAG,eAAe;;;;;;;;;6GAyP3G,CAAC;AAEF,eAAe,cAAc,CAAC"}
|
package/button/internal.js
CHANGED
|
@@ -23,7 +23,7 @@ import analyticsSelectors from './analytics-metadata/styles.css.js';
|
|
|
23
23
|
import styles from './styles.css.js';
|
|
24
24
|
import testUtilStyles from './test-classes/styles.css.js';
|
|
25
25
|
export const InternalButton = React.forwardRef((_a, ref) => {
|
|
26
|
-
var { children, iconName, __iconClass, onClick, onFollow, iconAlign = 'left', iconUrl, iconSvg, iconAlt, variant = 'normal', loading = false, loadingText, disabled = false, disabledReason, wrapText = true, href, target, rel, download, formAction = 'submit', ariaLabel, ariaDescribedby, ariaExpanded, ariaControls, fullWidth, badge, __nativeAttributes, __internalRootRef = null, __focusable = false, __injectAnalyticsComponentMetadata = false, __title, __emitPerformanceMarks = true } = _a, props = __rest(_a, ["children", "iconName", "__iconClass", "onClick", "onFollow", "iconAlign", "iconUrl", "iconSvg", "iconAlt", "variant", "loading", "loadingText", "disabled", "disabledReason", "wrapText", "href", "target", "rel", "download", "formAction", "ariaLabel", "ariaDescribedby", "ariaExpanded", "ariaControls", "fullWidth", "badge", "__nativeAttributes", "__internalRootRef", "__focusable", "__injectAnalyticsComponentMetadata", "__title", "__emitPerformanceMarks"]);
|
|
26
|
+
var { children, iconName, __iconClass, onClick, onFollow, iconAlign = 'left', iconUrl, iconSvg, iconAlt, variant = 'normal', loading = false, loadingText, disabled = false, disabledReason, wrapText = true, href, target, rel, download, formAction = 'submit', ariaLabel, ariaDescribedby, ariaExpanded, ariaControls, fullWidth, badge, __nativeAttributes, __internalRootRef = null, __focusable = false, __injectAnalyticsComponentMetadata = false, __title, __emitPerformanceMarks = true, analyticsAction = 'click' } = _a, props = __rest(_a, ["children", "iconName", "__iconClass", "onClick", "onFollow", "iconAlign", "iconUrl", "iconSvg", "iconAlt", "variant", "loading", "loadingText", "disabled", "disabledReason", "wrapText", "href", "target", "rel", "download", "formAction", "ariaLabel", "ariaDescribedby", "ariaExpanded", "ariaControls", "fullWidth", "badge", "__nativeAttributes", "__internalRootRef", "__focusable", "__injectAnalyticsComponentMetadata", "__title", "__emitPerformanceMarks", "analyticsAction"]);
|
|
27
27
|
const [showTooltip, setShowTooltip] = useState(false);
|
|
28
28
|
checkSafeUrl('Button', href);
|
|
29
29
|
const isAnchor = Boolean(href);
|
|
@@ -87,7 +87,7 @@ export const InternalButton = React.forwardRef((_a, ref) => {
|
|
|
87
87
|
const analyticsMetadata = disabled
|
|
88
88
|
? {}
|
|
89
89
|
: {
|
|
90
|
-
action:
|
|
90
|
+
action: analyticsAction,
|
|
91
91
|
detail: { label: { root: 'self' } },
|
|
92
92
|
};
|
|
93
93
|
if (__injectAnalyticsComponentMetadata) {
|
package/button/internal.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/button/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\nimport React, { useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport {\n getAnalyticsLabelAttribute,\n getAnalyticsMetadataAttribute,\n} from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { FunnelMetrics } from '../internal/analytics';\nimport { useFunnel, useFunnelStep, useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport {\n DATA_ATTR_FUNNEL_VALUE,\n getFunnelValueSelector,\n getSubStepAllSelector,\n getTextFromSelector,\n} from '../internal/analytics/selectors';\nimport LiveRegion from '../internal/components/live-region';\nimport Tooltip from '../internal/components/tooltip/index.js';\nimport { useButtonContext } from '../internal/context/button-context';\nimport { useSingleTabStopNavigation } from '../internal/context/single-tab-stop-navigation-context';\nimport { fireCancelableEvent, isPlainLeftClick } from '../internal/events';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport useHiddenDescription from '../internal/hooks/use-hidden-description';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { usePerformanceMarks } from '../internal/hooks/use-performance-marks';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport { GeneratedAnalyticsMetadataButtonFragment } from './analytics-metadata/interfaces';\nimport { ButtonIconProps, LeftIcon, RightIcon } from './icon-helper';\nimport { ButtonProps } from './interfaces';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\nexport type InternalButtonProps = Omit<ButtonProps, 'variant'> & {\n variant?: ButtonProps['variant'] | 'flashbar-icon' | 'breadcrumb-group' | 'menu-trigger' | 'modal-dismiss';\n badge?: boolean;\n __nativeAttributes?:\n | (React.HTMLAttributes<HTMLAnchorElement> & React.HTMLAttributes<HTMLButtonElement>)\n | Record<`data-${string}`, string>;\n __iconClass?: string;\n __focusable?: boolean;\n __injectAnalyticsComponentMetadata?: boolean;\n __title?: string;\n __emitPerformanceMarks?: boolean;\n} & InternalBaseComponentProps<HTMLAnchorElement | HTMLButtonElement>;\n\nexport const InternalButton = React.forwardRef(\n (\n {\n children,\n iconName,\n __iconClass,\n onClick,\n onFollow,\n iconAlign = 'left',\n iconUrl,\n iconSvg,\n iconAlt,\n variant = 'normal',\n loading = false,\n loadingText,\n disabled = false,\n disabledReason,\n wrapText = true,\n href,\n target,\n rel,\n download,\n formAction = 'submit',\n ariaLabel,\n ariaDescribedby,\n ariaExpanded,\n ariaControls,\n fullWidth,\n badge,\n __nativeAttributes,\n __internalRootRef = null,\n __focusable = false,\n __injectAnalyticsComponentMetadata = false,\n __title,\n __emitPerformanceMarks = true,\n ...props\n }: InternalButtonProps,\n ref: React.Ref<ButtonProps.Ref>\n ) => {\n const [showTooltip, setShowTooltip] = useState(false);\n\n checkSafeUrl('Button', href);\n const isAnchor = Boolean(href);\n const isNotInteractive = loading || disabled;\n const isDisabledWithReason = (variant === 'normal' || variant === 'primary') && !!disabledReason && disabled;\n const hasAriaDisabled = (loading && !disabled) || (disabled && __focusable) || isDisabledWithReason;\n const shouldHaveContent =\n children && ['icon', 'inline-icon', 'flashbar-icon', 'modal-dismiss'].indexOf(variant) === -1;\n\n const buttonRef = useRef<HTMLElement>(null);\n useForwardFocus(ref, buttonRef);\n\n const buttonContext = useButtonContext();\n\n const uniqueId = useUniqueId('button');\n const { funnelInteractionId } = useFunnel();\n const { stepNumber, stepNameSelector } = useFunnelStep();\n const { subStepSelector, subStepNameSelector } = useFunnelSubStep();\n\n const performanceMarkAttributes = usePerformanceMarks(\n 'primaryButton',\n variant === 'primary' && __emitPerformanceMarks,\n buttonRef,\n () => ({\n loading,\n disabled,\n text: buttonRef.current?.innerText,\n }),\n [loading, disabled]\n );\n\n const { targetProps, descriptionEl } = useHiddenDescription(disabledReason);\n\n const handleClick = (event: React.MouseEvent) => {\n if (isNotInteractive) {\n return event.preventDefault();\n }\n\n if (isAnchor && isPlainLeftClick(event)) {\n fireCancelableEvent(onFollow, { href, target }, event);\n\n if ((iconName === 'external' || target === '_blank') && funnelInteractionId) {\n const stepName = getTextFromSelector(stepNameSelector);\n const subStepName = getTextFromSelector(subStepNameSelector);\n\n FunnelMetrics.externalLinkInteracted({\n funnelInteractionId,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepSelector,\n subStepName,\n subStepNameSelector,\n elementSelector: getFunnelValueSelector(uniqueId),\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n }\n\n const { altKey, button, ctrlKey, metaKey, shiftKey } = event;\n fireCancelableEvent(onClick, { altKey, button, ctrlKey, metaKey, shiftKey }, event);\n buttonContext.onClick({ variant });\n };\n\n const buttonClass = clsx(props.className, styles.button, styles[`variant-${variant}`], {\n [styles.disabled]: isNotInteractive,\n [styles['button-no-wrap']]: !wrapText,\n [styles['button-no-text']]: !shouldHaveContent,\n [styles['full-width']]: shouldHaveContent && fullWidth,\n [styles.link]: isAnchor,\n });\n\n const explicitTabIndex =\n __nativeAttributes && 'tabIndex' in __nativeAttributes ? __nativeAttributes.tabIndex : undefined;\n const { tabIndex } = useSingleTabStopNavigation(buttonRef, {\n tabIndex: isAnchor && isNotInteractive ? -1 : explicitTabIndex,\n });\n\n const analyticsMetadata: GeneratedAnalyticsMetadataButtonFragment = disabled\n ? {}\n : {\n action: 'click',\n detail: { label: { root: 'self' } },\n };\n if (__injectAnalyticsComponentMetadata) {\n analyticsMetadata.component = {\n name: 'awsui.Button',\n label: { root: 'self' },\n properties: { variant, disabled: `${disabled}` },\n };\n }\n\n const buttonProps = {\n ...props,\n ...__nativeAttributes,\n ...performanceMarkAttributes,\n tabIndex,\n // https://github.com/microsoft/TypeScript/issues/36659\n ref: useMergeRefs(buttonRef, __internalRootRef),\n 'aria-label': ariaLabel,\n 'aria-describedby': ariaDescribedby,\n 'aria-expanded': ariaExpanded,\n 'aria-controls': ariaControls,\n // add ariaLabel as `title` as visible hint text\n title: __title ?? ariaLabel,\n className: buttonClass,\n onClick: handleClick,\n [DATA_ATTR_FUNNEL_VALUE]: uniqueId,\n ...getAnalyticsMetadataAttribute(analyticsMetadata),\n ...getAnalyticsLabelAttribute(children ? `.${analyticsSelectors.label}` : ''),\n } as const;\n\n const iconProps: ButtonIconProps = {\n loading,\n iconName,\n iconAlign,\n iconUrl,\n iconSvg,\n iconAlt,\n variant,\n badge,\n iconClass: __iconClass,\n iconSize: variant === 'modal-dismiss' ? 'medium' : 'normal',\n };\n const buttonContent = (\n <>\n <LeftIcon {...iconProps} />\n {shouldHaveContent && <span className={clsx(styles.content, analyticsSelectors.label)}>{children}</span>}\n <RightIcon {...iconProps} />\n </>\n );\n\n const { loadingButtonCount } = useFunnel();\n useEffect(() => {\n if (loading) {\n loadingButtonCount.current++;\n return () => {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n loadingButtonCount.current--;\n };\n }\n }, [loading, loadingButtonCount]);\n\n if (isAnchor) {\n return (\n // https://github.com/yannickcr/eslint-plugin-react/issues/2962\n // eslint-disable-next-line react/jsx-no-target-blank\n <>\n <a\n {...buttonProps}\n href={href}\n target={target}\n // security recommendation: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#target\n rel={rel ?? (target === '_blank' ? 'noopener noreferrer' : undefined)}\n aria-disabled={isNotInteractive ? true : undefined}\n download={download}\n >\n {buttonContent}\n </a>\n {loading && loadingText && <LiveRegion>{loadingText}</LiveRegion>}\n </>\n );\n }\n\n return (\n <>\n <button\n {...buttonProps}\n type={formAction === 'none' ? 'button' : 'submit'}\n disabled={disabled && !__focusable && !isDisabledWithReason}\n aria-disabled={hasAriaDisabled ? true : undefined}\n onFocus={isDisabledWithReason ? () => setShowTooltip(true) : undefined}\n onBlur={isDisabledWithReason ? () => setShowTooltip(false) : undefined}\n onMouseEnter={isDisabledWithReason ? () => setShowTooltip(true) : undefined}\n onMouseLeave={isDisabledWithReason ? () => setShowTooltip(false) : undefined}\n {...(isDisabledWithReason ? targetProps : {})}\n >\n {buttonContent}\n {isDisabledWithReason && (\n <>\n {descriptionEl}\n {showTooltip && (\n <Tooltip\n className={testUtilStyles['disabled-reason-tooltip']}\n trackRef={buttonRef}\n value={disabledReason!}\n />\n )}\n </>\n )}\n </button>\n {loading && loadingText && <LiveRegion>{loadingText}</LiveRegion>}\n </>\n );\n }\n);\n\nexport default InternalButton;\n"]}
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/button/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\nimport React, { useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport {\n getAnalyticsLabelAttribute,\n getAnalyticsMetadataAttribute,\n} from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { FunnelMetrics } from '../internal/analytics';\nimport { useFunnel, useFunnelStep, useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport {\n DATA_ATTR_FUNNEL_VALUE,\n getFunnelValueSelector,\n getSubStepAllSelector,\n getTextFromSelector,\n} from '../internal/analytics/selectors';\nimport LiveRegion from '../internal/components/live-region';\nimport Tooltip from '../internal/components/tooltip/index.js';\nimport { useButtonContext } from '../internal/context/button-context';\nimport { useSingleTabStopNavigation } from '../internal/context/single-tab-stop-navigation-context';\nimport { fireCancelableEvent, isPlainLeftClick } from '../internal/events';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport useHiddenDescription from '../internal/hooks/use-hidden-description';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { usePerformanceMarks } from '../internal/hooks/use-performance-marks';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport { GeneratedAnalyticsMetadataButtonFragment } from './analytics-metadata/interfaces';\nimport { ButtonIconProps, LeftIcon, RightIcon } from './icon-helper';\nimport { ButtonProps } from './interfaces';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\nexport type InternalButtonProps = Omit<ButtonProps, 'variant'> & {\n variant?: ButtonProps['variant'] | 'flashbar-icon' | 'breadcrumb-group' | 'menu-trigger' | 'modal-dismiss';\n badge?: boolean;\n analyticsAction?: string;\n __nativeAttributes?:\n | (React.HTMLAttributes<HTMLAnchorElement> & React.HTMLAttributes<HTMLButtonElement>)\n | Record<`data-${string}`, string>;\n __iconClass?: string;\n __focusable?: boolean;\n __injectAnalyticsComponentMetadata?: boolean;\n __title?: string;\n __emitPerformanceMarks?: boolean;\n} & InternalBaseComponentProps<HTMLAnchorElement | HTMLButtonElement>;\n\nexport const InternalButton = React.forwardRef(\n (\n {\n children,\n iconName,\n __iconClass,\n onClick,\n onFollow,\n iconAlign = 'left',\n iconUrl,\n iconSvg,\n iconAlt,\n variant = 'normal',\n loading = false,\n loadingText,\n disabled = false,\n disabledReason,\n wrapText = true,\n href,\n target,\n rel,\n download,\n formAction = 'submit',\n ariaLabel,\n ariaDescribedby,\n ariaExpanded,\n ariaControls,\n fullWidth,\n badge,\n __nativeAttributes,\n __internalRootRef = null,\n __focusable = false,\n __injectAnalyticsComponentMetadata = false,\n __title,\n __emitPerformanceMarks = true,\n analyticsAction = 'click',\n ...props\n }: InternalButtonProps,\n ref: React.Ref<ButtonProps.Ref>\n ) => {\n const [showTooltip, setShowTooltip] = useState(false);\n\n checkSafeUrl('Button', href);\n const isAnchor = Boolean(href);\n const isNotInteractive = loading || disabled;\n const isDisabledWithReason = (variant === 'normal' || variant === 'primary') && !!disabledReason && disabled;\n const hasAriaDisabled = (loading && !disabled) || (disabled && __focusable) || isDisabledWithReason;\n const shouldHaveContent =\n children && ['icon', 'inline-icon', 'flashbar-icon', 'modal-dismiss'].indexOf(variant) === -1;\n\n const buttonRef = useRef<HTMLElement>(null);\n useForwardFocus(ref, buttonRef);\n\n const buttonContext = useButtonContext();\n\n const uniqueId = useUniqueId('button');\n const { funnelInteractionId } = useFunnel();\n const { stepNumber, stepNameSelector } = useFunnelStep();\n const { subStepSelector, subStepNameSelector } = useFunnelSubStep();\n\n const performanceMarkAttributes = usePerformanceMarks(\n 'primaryButton',\n variant === 'primary' && __emitPerformanceMarks,\n buttonRef,\n () => ({\n loading,\n disabled,\n text: buttonRef.current?.innerText,\n }),\n [loading, disabled]\n );\n\n const { targetProps, descriptionEl } = useHiddenDescription(disabledReason);\n\n const handleClick = (event: React.MouseEvent) => {\n if (isNotInteractive) {\n return event.preventDefault();\n }\n\n if (isAnchor && isPlainLeftClick(event)) {\n fireCancelableEvent(onFollow, { href, target }, event);\n\n if ((iconName === 'external' || target === '_blank') && funnelInteractionId) {\n const stepName = getTextFromSelector(stepNameSelector);\n const subStepName = getTextFromSelector(subStepNameSelector);\n\n FunnelMetrics.externalLinkInteracted({\n funnelInteractionId,\n stepNumber,\n stepName,\n stepNameSelector,\n subStepSelector,\n subStepName,\n subStepNameSelector,\n elementSelector: getFunnelValueSelector(uniqueId),\n subStepAllSelector: getSubStepAllSelector(),\n });\n }\n }\n\n const { altKey, button, ctrlKey, metaKey, shiftKey } = event;\n fireCancelableEvent(onClick, { altKey, button, ctrlKey, metaKey, shiftKey }, event);\n buttonContext.onClick({ variant });\n };\n\n const buttonClass = clsx(props.className, styles.button, styles[`variant-${variant}`], {\n [styles.disabled]: isNotInteractive,\n [styles['button-no-wrap']]: !wrapText,\n [styles['button-no-text']]: !shouldHaveContent,\n [styles['full-width']]: shouldHaveContent && fullWidth,\n [styles.link]: isAnchor,\n });\n\n const explicitTabIndex =\n __nativeAttributes && 'tabIndex' in __nativeAttributes ? __nativeAttributes.tabIndex : undefined;\n const { tabIndex } = useSingleTabStopNavigation(buttonRef, {\n tabIndex: isAnchor && isNotInteractive ? -1 : explicitTabIndex,\n });\n\n const analyticsMetadata: GeneratedAnalyticsMetadataButtonFragment = disabled\n ? {}\n : {\n action: analyticsAction,\n detail: { label: { root: 'self' } },\n };\n if (__injectAnalyticsComponentMetadata) {\n analyticsMetadata.component = {\n name: 'awsui.Button',\n label: { root: 'self' },\n properties: { variant, disabled: `${disabled}` },\n };\n }\n\n const buttonProps = {\n ...props,\n ...__nativeAttributes,\n ...performanceMarkAttributes,\n tabIndex,\n // https://github.com/microsoft/TypeScript/issues/36659\n ref: useMergeRefs(buttonRef, __internalRootRef),\n 'aria-label': ariaLabel,\n 'aria-describedby': ariaDescribedby,\n 'aria-expanded': ariaExpanded,\n 'aria-controls': ariaControls,\n // add ariaLabel as `title` as visible hint text\n title: __title ?? ariaLabel,\n className: buttonClass,\n onClick: handleClick,\n [DATA_ATTR_FUNNEL_VALUE]: uniqueId,\n ...getAnalyticsMetadataAttribute(analyticsMetadata),\n ...getAnalyticsLabelAttribute(children ? `.${analyticsSelectors.label}` : ''),\n } as const;\n\n const iconProps: ButtonIconProps = {\n loading,\n iconName,\n iconAlign,\n iconUrl,\n iconSvg,\n iconAlt,\n variant,\n badge,\n iconClass: __iconClass,\n iconSize: variant === 'modal-dismiss' ? 'medium' : 'normal',\n };\n const buttonContent = (\n <>\n <LeftIcon {...iconProps} />\n {shouldHaveContent && <span className={clsx(styles.content, analyticsSelectors.label)}>{children}</span>}\n <RightIcon {...iconProps} />\n </>\n );\n\n const { loadingButtonCount } = useFunnel();\n useEffect(() => {\n if (loading) {\n loadingButtonCount.current++;\n return () => {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n loadingButtonCount.current--;\n };\n }\n }, [loading, loadingButtonCount]);\n\n if (isAnchor) {\n return (\n // https://github.com/yannickcr/eslint-plugin-react/issues/2962\n // eslint-disable-next-line react/jsx-no-target-blank\n <>\n <a\n {...buttonProps}\n href={href}\n target={target}\n // security recommendation: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#target\n rel={rel ?? (target === '_blank' ? 'noopener noreferrer' : undefined)}\n aria-disabled={isNotInteractive ? true : undefined}\n download={download}\n >\n {buttonContent}\n </a>\n {loading && loadingText && <LiveRegion>{loadingText}</LiveRegion>}\n </>\n );\n }\n\n return (\n <>\n <button\n {...buttonProps}\n type={formAction === 'none' ? 'button' : 'submit'}\n disabled={disabled && !__focusable && !isDisabledWithReason}\n aria-disabled={hasAriaDisabled ? true : undefined}\n onFocus={isDisabledWithReason ? () => setShowTooltip(true) : undefined}\n onBlur={isDisabledWithReason ? () => setShowTooltip(false) : undefined}\n onMouseEnter={isDisabledWithReason ? () => setShowTooltip(true) : undefined}\n onMouseLeave={isDisabledWithReason ? () => setShowTooltip(false) : undefined}\n {...(isDisabledWithReason ? targetProps : {})}\n >\n {buttonContent}\n {isDisabledWithReason && (\n <>\n {descriptionEl}\n {showTooltip && (\n <Tooltip\n className={testUtilStyles['disabled-reason-tooltip']}\n trackRef={buttonRef}\n value={disabledReason!}\n />\n )}\n </>\n )}\n </button>\n {loading && loadingText && <LiveRegion>{loadingText}</LiveRegion>}\n </>\n );\n }\n);\n\nexport default InternalButton;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/chart-filter/index.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,kBAAkB,EAAgB,MAAM,sBAAsB,CAAC;AAExE,OAAqB,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAI7E,UAAU,WAAW;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,uBAAuB,CAAC,EAAE,MAAM,CAAC;CAClC;AAED,MAAM,WAAW,eAAe,CAAC,CAAC;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,qBAAqB,CAAC;IAC5B,KAAK,EAAE,CAAC,CAAC;CACV;AAED,MAAM,WAAW,gBAAgB,CAAC,CAAC,CAAE,SAAQ,kBAAkB;IAC7D,MAAM,EAAE,aAAa,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC;IAC1C,cAAc,CAAC,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IAClC,QAAQ,EAAE,CAAC,cAAc,EAAE,aAAa,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IACrD,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;;AAED,wBAAuD;AAEvD,iBAAS,WAAW,CAAC,CAAC,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,EAAE,gBAAgB,CAAC,CAAC,CAAC,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/chart-filter/index.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,kBAAkB,EAAgB,MAAM,sBAAsB,CAAC;AAExE,OAAqB,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAI7E,UAAU,WAAW;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,uBAAuB,CAAC,EAAE,MAAM,CAAC;CAClC;AAED,MAAM,WAAW,eAAe,CAAC,CAAC;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,qBAAqB,CAAC;IAC5B,KAAK,EAAE,CAAC,CAAC;CACV;AAED,MAAM,WAAW,gBAAgB,CAAC,CAAC,CAAE,SAAQ,kBAAkB;IAC7D,MAAM,EAAE,aAAa,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC;IAC1C,cAAc,CAAC,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IAClC,QAAQ,EAAE,CAAC,cAAc,EAAE,aAAa,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IACrD,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;;AAED,wBAAuD;AAEvD,iBAAS,WAAW,CAAC,CAAC,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,EAAE,gBAAgB,CAAC,CAAC,CAAC,eAgD3G"}
|
|
@@ -30,6 +30,6 @@ function ChartFilter(_a) {
|
|
|
30
30
|
onChange(selectedSeries);
|
|
31
31
|
}, [onChange, defaultOptions]);
|
|
32
32
|
return (React.createElement(InternalFormField, Object.assign({}, baseProps, { label: i18n('i18nStrings.filterLabel', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.filterLabel), className: className }),
|
|
33
|
-
React.createElement(InternalMultiselect, { placeholder: i18n('i18nStrings.filterPlaceholder', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.filterPlaceholder), options: defaultOptions, selectedOptions: selectedOptions, onChange: updateSelection, className: styles['chart-filter'], selectedAriaLabel: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.filterSelectedAriaLabel, hideTokens: true })));
|
|
33
|
+
React.createElement(InternalMultiselect, { placeholder: i18n('i18nStrings.filterPlaceholder', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.filterPlaceholder), options: defaultOptions, selectedOptions: selectedOptions, onChange: updateSelection, className: styles['chart-filter'], selectedAriaLabel: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.filterSelectedAriaLabel, filteringType: "none", statusType: "finished", keepOpen: true, hideTokens: true })));
|
|
34
34
|
}
|
|
35
35
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/chart-filter/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,iBAAiB,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAExD,OAAO,mBAAmB,MAAM,+BAA+B,CAAC;AAChE,OAAO,EAAsB,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAExE,OAAO,YAAuC,MAAM,wBAAwB,CAAC;AAE7E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAsBrC,eAAe,IAAI,CAAC,WAAW,CAAuB,CAAC;AAEvD,SAAS,WAAW,CAAI,EAAoF;QAApF,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,QAAQ,OAAqC,EAAhC,SAAS,cAA7D,uDAA+D,CAAF;IACnF,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC;IACzD,MAAM,IAAI,GAAG,eAAe,CAAC,UAAU,CAAC,CAAC;IAEzC,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC;QAC3C,KAAK,EAAE,CAAC,CAAC,KAAK;QACd,KAAK,EAAE,EAAE,GAAG,CAAC;QACb,KAAK,EAAE,CAAC,CAAC,KAAK;QACd,YAAY,EAAE,CACZ,8BAAM,SAAS,EAAE,MAAM,CAAC,qBAAqB,CAAC;YAC5C,oBAAC,YAAY,IAAC,KAAK,EAAE,CAAC,CAAC,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,GAAI,CACzC,CACR;KACF,CAAC,CAAC,CAAC;IAEJ,MAAM,eAAe,GAAG,cAAc,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,CAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,MAAK,CAAC,CAAC,CAAC,CAAC;IAEtG,MAAM,eAAe,GAAG,WAAW,CACjC,CAAC,EAAE,MAAM,EAAE,EAAE,eAAe,EAAE,EAAE,EAAE,EAAE;QAClC,MAAM,cAAc,GAAG,cAAc;aAClC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,eAAe,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;aACxD,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC/B,QAAQ,CAAC,cAAc,CAAC,CAAC;IAC3B,CAAC,EACD,CAAC,QAAQ,EAAE,cAAc,CAAC,CAC3B,CAAC;IAEF,OAAO,CACL,oBAAC,iBAAiB,oBACZ,SAAS,IACb,KAAK,EAAE,IAAI,CAAC,yBAAyB,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,WAAW,CAAC,EAChE,SAAS,EAAE,SAAS;QAEpB,oBAAC,mBAAmB,IAClB,WAAW,EAAE,IAAI,CAAC,+BAA+B,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,iBAAiB,CAAC,EAClF,OAAO,EAAE,cAAc,EACvB,eAAe,EAAE,eAAe,EAChC,QAAQ,EAAE,eAAe,EACzB,SAAS,EAAE,MAAM,CAAC,cAAc,CAAC,EACjC,iBAAiB,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,uBAAuB,EACvD,UAAU,EAAE,IAAI,GAChB,CACgB,CACrB,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { memo, useCallback } from 'react';\nimport clsx from 'clsx';\n\nimport InternalFormField from '../../../form-field/internal';\nimport { useInternalI18n } from '../../../i18n/context';\nimport { MultiselectProps } from '../../../multiselect/interfaces';\nimport InternalMultiselect from '../../../multiselect/internal';\nimport { BaseComponentProps, getBaseProps } from '../../base-component';\nimport { NonCancelableEventHandler } from '../../events';\nimport SeriesMarker, { ChartSeriesMarkerType } from '../chart-series-marker';\n\nimport styles from './styles.css.js';\n\ninterface I18nStrings {\n filterLabel?: string;\n filterPlaceholder?: string;\n filterSelectedAriaLabel?: string;\n}\n\nexport interface ChartFilterItem<T> {\n label: string;\n color: string;\n type: ChartSeriesMarkerType;\n datum: T;\n}\n\nexport interface ChartFilterProps<T> extends BaseComponentProps {\n series: ReadonlyArray<ChartFilterItem<T>>;\n selectedSeries?: ReadonlyArray<T>;\n onChange: (selectedSeries: ReadonlyArray<T>) => void;\n i18nStrings?: I18nStrings;\n}\n\nexport default memo(ChartFilter) as typeof ChartFilter;\n\nfunction ChartFilter<T>({ series, i18nStrings, selectedSeries, onChange, ...restProps }: ChartFilterProps<T>) {\n const baseProps = getBaseProps(restProps);\n const className = clsx(baseProps.className, styles.root);\n const i18n = useInternalI18n('[charts]');\n\n const defaultOptions = series.map((d, i) => ({\n label: d.label,\n value: '' + i,\n datum: d.datum,\n __customIcon: (\n <span className={styles['custom-icon-wrapper']}>\n <SeriesMarker color={d.color} type={d.type} />\n </span>\n ),\n }));\n\n const selectedOptions = defaultOptions.filter(option => selectedSeries?.indexOf(option.datum) !== -1);\n\n const updateSelection = useCallback<NonCancelableEventHandler<MultiselectProps.MultiselectChangeDetail>>(\n ({ detail: { selectedOptions } }) => {\n const selectedSeries = defaultOptions\n .filter(option => selectedOptions.indexOf(option) !== -1)\n .map(option => option.datum);\n onChange(selectedSeries);\n },\n [onChange, defaultOptions]\n );\n\n return (\n <InternalFormField\n {...baseProps}\n label={i18n('i18nStrings.filterLabel', i18nStrings?.filterLabel)}\n className={className}\n >\n <InternalMultiselect\n placeholder={i18n('i18nStrings.filterPlaceholder', i18nStrings?.filterPlaceholder)}\n options={defaultOptions}\n selectedOptions={selectedOptions}\n onChange={updateSelection}\n className={styles['chart-filter']}\n selectedAriaLabel={i18nStrings?.filterSelectedAriaLabel}\n hideTokens={true}\n />\n </InternalFormField>\n );\n}\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/chart-filter/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,iBAAiB,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAExD,OAAO,mBAAmB,MAAM,+BAA+B,CAAC;AAChE,OAAO,EAAsB,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAExE,OAAO,YAAuC,MAAM,wBAAwB,CAAC;AAE7E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAsBrC,eAAe,IAAI,CAAC,WAAW,CAAuB,CAAC;AAEvD,SAAS,WAAW,CAAI,EAAoF;QAApF,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,QAAQ,OAAqC,EAAhC,SAAS,cAA7D,uDAA+D,CAAF;IACnF,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC;IACzD,MAAM,IAAI,GAAG,eAAe,CAAC,UAAU,CAAC,CAAC;IAEzC,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC;QAC3C,KAAK,EAAE,CAAC,CAAC,KAAK;QACd,KAAK,EAAE,EAAE,GAAG,CAAC;QACb,KAAK,EAAE,CAAC,CAAC,KAAK;QACd,YAAY,EAAE,CACZ,8BAAM,SAAS,EAAE,MAAM,CAAC,qBAAqB,CAAC;YAC5C,oBAAC,YAAY,IAAC,KAAK,EAAE,CAAC,CAAC,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,GAAI,CACzC,CACR;KACF,CAAC,CAAC,CAAC;IAEJ,MAAM,eAAe,GAAG,cAAc,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,CAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,MAAK,CAAC,CAAC,CAAC,CAAC;IAEtG,MAAM,eAAe,GAAG,WAAW,CACjC,CAAC,EAAE,MAAM,EAAE,EAAE,eAAe,EAAE,EAAE,EAAE,EAAE;QAClC,MAAM,cAAc,GAAG,cAAc;aAClC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,eAAe,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;aACxD,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC/B,QAAQ,CAAC,cAAc,CAAC,CAAC;IAC3B,CAAC,EACD,CAAC,QAAQ,EAAE,cAAc,CAAC,CAC3B,CAAC;IAEF,OAAO,CACL,oBAAC,iBAAiB,oBACZ,SAAS,IACb,KAAK,EAAE,IAAI,CAAC,yBAAyB,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,WAAW,CAAC,EAChE,SAAS,EAAE,SAAS;QAEpB,oBAAC,mBAAmB,IAClB,WAAW,EAAE,IAAI,CAAC,+BAA+B,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,iBAAiB,CAAC,EAClF,OAAO,EAAE,cAAc,EACvB,eAAe,EAAE,eAAe,EAChC,QAAQ,EAAE,eAAe,EACzB,SAAS,EAAE,MAAM,CAAC,cAAc,CAAC,EACjC,iBAAiB,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,uBAAuB,EACvD,aAAa,EAAC,MAAM,EACpB,UAAU,EAAC,UAAU,EACrB,QAAQ,EAAE,IAAI,EACd,UAAU,EAAE,IAAI,GAChB,CACgB,CACrB,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { memo, useCallback } from 'react';\nimport clsx from 'clsx';\n\nimport InternalFormField from '../../../form-field/internal';\nimport { useInternalI18n } from '../../../i18n/context';\nimport { MultiselectProps } from '../../../multiselect/interfaces';\nimport InternalMultiselect from '../../../multiselect/internal';\nimport { BaseComponentProps, getBaseProps } from '../../base-component';\nimport { NonCancelableEventHandler } from '../../events';\nimport SeriesMarker, { ChartSeriesMarkerType } from '../chart-series-marker';\n\nimport styles from './styles.css.js';\n\ninterface I18nStrings {\n filterLabel?: string;\n filterPlaceholder?: string;\n filterSelectedAriaLabel?: string;\n}\n\nexport interface ChartFilterItem<T> {\n label: string;\n color: string;\n type: ChartSeriesMarkerType;\n datum: T;\n}\n\nexport interface ChartFilterProps<T> extends BaseComponentProps {\n series: ReadonlyArray<ChartFilterItem<T>>;\n selectedSeries?: ReadonlyArray<T>;\n onChange: (selectedSeries: ReadonlyArray<T>) => void;\n i18nStrings?: I18nStrings;\n}\n\nexport default memo(ChartFilter) as typeof ChartFilter;\n\nfunction ChartFilter<T>({ series, i18nStrings, selectedSeries, onChange, ...restProps }: ChartFilterProps<T>) {\n const baseProps = getBaseProps(restProps);\n const className = clsx(baseProps.className, styles.root);\n const i18n = useInternalI18n('[charts]');\n\n const defaultOptions = series.map((d, i) => ({\n label: d.label,\n value: '' + i,\n datum: d.datum,\n __customIcon: (\n <span className={styles['custom-icon-wrapper']}>\n <SeriesMarker color={d.color} type={d.type} />\n </span>\n ),\n }));\n\n const selectedOptions = defaultOptions.filter(option => selectedSeries?.indexOf(option.datum) !== -1);\n\n const updateSelection = useCallback<NonCancelableEventHandler<MultiselectProps.MultiselectChangeDetail>>(\n ({ detail: { selectedOptions } }) => {\n const selectedSeries = defaultOptions\n .filter(option => selectedOptions.indexOf(option) !== -1)\n .map(option => option.datum);\n onChange(selectedSeries);\n },\n [onChange, defaultOptions]\n );\n\n return (\n <InternalFormField\n {...baseProps}\n label={i18n('i18nStrings.filterLabel', i18nStrings?.filterLabel)}\n className={className}\n >\n <InternalMultiselect\n placeholder={i18n('i18nStrings.filterPlaceholder', i18nStrings?.filterPlaceholder)}\n options={defaultOptions}\n selectedOptions={selectedOptions}\n onChange={updateSelection}\n className={styles['chart-filter']}\n selectedAriaLabel={i18nStrings?.filterSelectedAriaLabel}\n filteringType=\"none\"\n statusType=\"finished\"\n keepOpen={true}\n hideTokens={true}\n />\n </InternalFormField>\n );\n}\n"]}
|
|
@@ -25,7 +25,7 @@ declare function DropdownStatus({ children }: {
|
|
|
25
25
|
children: React.ReactNode;
|
|
26
26
|
}): JSX.Element;
|
|
27
27
|
type UseDropdownStatus = ({ statusType, empty, loadingText, finishedText, filteringResultsText, errorText, recoveryText, isEmpty, isNoMatch, isFiltered, noMatch, hasRecoveryCallback, onRecoveryClick, }: DropdownStatusPropsExtended) => DropdownStatusResult;
|
|
28
|
-
interface DropdownStatusResult {
|
|
28
|
+
export interface DropdownStatusResult {
|
|
29
29
|
isSticky: boolean;
|
|
30
30
|
content: React.ReactNode | null;
|
|
31
31
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/dropdown-status/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAA0B,yBAAyB,EAAE,MAAM,cAAc,CAAC;AAEjF,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAInD,OAAO,EAAE,mBAAmB,EAAE,CAAC;AAE/B,MAAM,WAAW,2BAA4B,SAAQ,mBAAmB;IACtE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B;;;;;OAKG;IACH,eAAe,CAAC,EAAE,yBAAyB,CAAC;IAC5C;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;CAC/B;AAED,iBAAS,cAAc,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,eAElE;AAED,KAAK,iBAAiB,GAAG,CAAC,EACxB,UAAU,EACV,KAAK,EACL,WAAW,EACX,YAAY,EACZ,oBAAoB,EACpB,SAAS,EACT,YAAY,EACZ,OAAO,EACP,SAAS,EACT,UAAU,EACV,OAAO,EACP,mBAAmB,EACnB,eAAe,GAChB,EAAE,2BAA2B,KAAK,oBAAoB,CAAC;AAExD,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/dropdown-status/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAA0B,yBAAyB,EAAE,MAAM,cAAc,CAAC;AAEjF,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAInD,OAAO,EAAE,mBAAmB,EAAE,CAAC;AAE/B,MAAM,WAAW,2BAA4B,SAAQ,mBAAmB;IACtE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B;;;;;OAKG;IACH,eAAe,CAAC,EAAE,yBAAyB,CAAC;IAC5C;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;CAC/B;AAED,iBAAS,cAAc,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,eAElE;AAED,KAAK,iBAAiB,GAAG,CAAC,EACxB,UAAU,EACV,KAAK,EACL,WAAW,EACX,YAAY,EACZ,oBAAoB,EACpB,SAAS,EACT,YAAY,EACZ,OAAO,EACP,SAAS,EACT,UAAU,EACV,OAAO,EACP,mBAAmB,EACnB,eAAe,GAChB,EAAE,2BAA2B,KAAK,oBAAoB,CAAC;AAExD,MAAM,WAAW,oBAAoB;IACnC,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC;CACjC;AAED,eAAO,MAAM,iBAAiB,EAAE,iBAuD/B,CAAC;AAEF,eAAe,cAAc,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/dropdown-status/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,YAAY,MAAM,wBAAwB,CAAC;AAClD,OAAO,uBAAuB,MAAM,oCAAoC,CAAC;AACzE,OAAO,EAAE,sBAAsB,EAA6B,MAAM,cAAc,CAAC;AACjF,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAGvD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAwBrC,SAAS,cAAc,CAAC,EAAE,QAAQ,EAAiC;IACjE,OAAO,6BAAK,SAAS,EAAE,MAAM,CAAC,IAAI,IAAG,QAAQ,CAAO,CAAC;AACvD,CAAC;AAuBD,MAAM,CAAC,MAAM,iBAAiB,GAAsB,CAAC,EACnD,UAAU,EACV,KAAK,EACL,WAAW,EACX,YAAY,EACZ,oBAAoB,EACpB,SAAS,EACT,YAAY,EACZ,OAAO,EACP,SAAS,EACT,UAAU,EACV,OAAO,EACP,eAAe,EACf,mBAAmB,GAAG,KAAK,EAC3B,kBAAkB,GACnB,EAAE,EAAE;IACH,MAAM,kBAAkB,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;IACnD,MAAM,YAAY,GAAyB,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;IAE7E,IAAI,UAAU,KAAK,SAAS,EAAE;QAC5B,YAAY,CAAC,OAAO,GAAG,oBAAC,uBAAuB,IAAC,IAAI,EAAE,SAAS,IAAG,WAAW,CAA2B,CAAC;KAC1G;SAAM,IAAI,UAAU,KAAK,OAAO,EAAE;QACjC,YAAY,CAAC,OAAO,GAAG,CACrB;YACE,oBAAC,uBAAuB,IACtB,IAAI,EAAC,OAAO,EACZ,SAAS,EAAC,QAAQ,EAClB,SAAS,EAAE,kBAAkB,KAAK,OAAO,EACzC,aAAa,EAAE,kBAAkB,IAEhC,SAAS,CACc;YAAC,GAAG;YAC7B,CAAC,CAAC,YAAY,IAAI,mBAAmB,IAAI,CACxC,oBAAC,YAAY,IACX,QAAQ,EAAE,GAAG,EAAE,CAAC,sBAAsB,CAAC,eAAe,CAAC,EACvD,OAAO,EAAC,UAAU,EAClB,SAAS,EAAE,MAAM,CAAC,QAAQ,IAEzB,YAAY,CACA,CAChB,CACI,CACR,CAAC;KACH;SAAM,IAAI,OAAO,IAAI,KAAK,EAAE;QAC3B,YAAY,CAAC,OAAO,GAAG,KAAK,CAAC;KAC9B;SAAM,IAAI,SAAS,IAAI,OAAO,EAAE;QAC/B,YAAY,CAAC,OAAO,GAAG,OAAO,CAAC;KAChC;SAAM,IAAI,UAAU,IAAI,oBAAoB,EAAE;QAC7C,YAAY,CAAC,OAAO,GAAG,oBAAoB,CAAC;KAC7C;SAAM,IAAI,UAAU,KAAK,UAAU,IAAI,YAAY,EAAE;QACpD,YAAY,CAAC,OAAO,GAAG,YAAY,CAAC;QACpC,YAAY,CAAC,QAAQ,GAAG,KAAK,CAAC;KAC/B;IAED,OAAO,YAAY,CAAC;AACtB,CAAC,CAAC;AAEF,eAAe,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 InternalLink from '../../../link/internal';\nimport InternalStatusIndicator from '../../../status-indicator/internal';\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../../events';\nimport { usePrevious } from '../../hooks/use-previous';\nimport { DropdownStatusProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport { DropdownStatusProps };\n\nexport interface DropdownStatusPropsExtended extends DropdownStatusProps {\n isEmpty?: boolean;\n isNoMatch?: boolean;\n isFiltered?: boolean;\n noMatch?: React.ReactNode;\n filteringResultsText?: string;\n /**\n * Called when the user clicks the recovery button placed at the\n * bottom of the dropdown list in the error state. Use this to\n * retry a failed request or provide another option for the user\n * to recover from the error.\n */\n onRecoveryClick?: NonCancelableEventHandler;\n /**\n * Determines if retry button should be rendered\n * in case recoveryText was automatically provided by i18n.\n */\n hasRecoveryCallback?: boolean;\n}\n\nfunction DropdownStatus({ children }: { children: React.ReactNode }) {\n return <div className={styles.root}>{children}</div>;\n}\n\ntype UseDropdownStatus = ({\n statusType,\n empty,\n loadingText,\n finishedText,\n filteringResultsText,\n errorText,\n recoveryText,\n isEmpty,\n isNoMatch,\n isFiltered,\n noMatch,\n hasRecoveryCallback,\n onRecoveryClick,\n}: DropdownStatusPropsExtended) => DropdownStatusResult;\n\
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/dropdown-status/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,YAAY,MAAM,wBAAwB,CAAC;AAClD,OAAO,uBAAuB,MAAM,oCAAoC,CAAC;AACzE,OAAO,EAAE,sBAAsB,EAA6B,MAAM,cAAc,CAAC;AACjF,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAGvD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAwBrC,SAAS,cAAc,CAAC,EAAE,QAAQ,EAAiC;IACjE,OAAO,6BAAK,SAAS,EAAE,MAAM,CAAC,IAAI,IAAG,QAAQ,CAAO,CAAC;AACvD,CAAC;AAuBD,MAAM,CAAC,MAAM,iBAAiB,GAAsB,CAAC,EACnD,UAAU,EACV,KAAK,EACL,WAAW,EACX,YAAY,EACZ,oBAAoB,EACpB,SAAS,EACT,YAAY,EACZ,OAAO,EACP,SAAS,EACT,UAAU,EACV,OAAO,EACP,eAAe,EACf,mBAAmB,GAAG,KAAK,EAC3B,kBAAkB,GACnB,EAAE,EAAE;IACH,MAAM,kBAAkB,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;IACnD,MAAM,YAAY,GAAyB,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;IAE7E,IAAI,UAAU,KAAK,SAAS,EAAE;QAC5B,YAAY,CAAC,OAAO,GAAG,oBAAC,uBAAuB,IAAC,IAAI,EAAE,SAAS,IAAG,WAAW,CAA2B,CAAC;KAC1G;SAAM,IAAI,UAAU,KAAK,OAAO,EAAE;QACjC,YAAY,CAAC,OAAO,GAAG,CACrB;YACE,oBAAC,uBAAuB,IACtB,IAAI,EAAC,OAAO,EACZ,SAAS,EAAC,QAAQ,EAClB,SAAS,EAAE,kBAAkB,KAAK,OAAO,EACzC,aAAa,EAAE,kBAAkB,IAEhC,SAAS,CACc;YAAC,GAAG;YAC7B,CAAC,CAAC,YAAY,IAAI,mBAAmB,IAAI,CACxC,oBAAC,YAAY,IACX,QAAQ,EAAE,GAAG,EAAE,CAAC,sBAAsB,CAAC,eAAe,CAAC,EACvD,OAAO,EAAC,UAAU,EAClB,SAAS,EAAE,MAAM,CAAC,QAAQ,IAEzB,YAAY,CACA,CAChB,CACI,CACR,CAAC;KACH;SAAM,IAAI,OAAO,IAAI,KAAK,EAAE;QAC3B,YAAY,CAAC,OAAO,GAAG,KAAK,CAAC;KAC9B;SAAM,IAAI,SAAS,IAAI,OAAO,EAAE;QAC/B,YAAY,CAAC,OAAO,GAAG,OAAO,CAAC;KAChC;SAAM,IAAI,UAAU,IAAI,oBAAoB,EAAE;QAC7C,YAAY,CAAC,OAAO,GAAG,oBAAoB,CAAC;KAC7C;SAAM,IAAI,UAAU,KAAK,UAAU,IAAI,YAAY,EAAE;QACpD,YAAY,CAAC,OAAO,GAAG,YAAY,CAAC;QACpC,YAAY,CAAC,QAAQ,GAAG,KAAK,CAAC;KAC/B;IAED,OAAO,YAAY,CAAC;AACtB,CAAC,CAAC;AAEF,eAAe,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 InternalLink from '../../../link/internal';\nimport InternalStatusIndicator from '../../../status-indicator/internal';\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from '../../events';\nimport { usePrevious } from '../../hooks/use-previous';\nimport { DropdownStatusProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport { DropdownStatusProps };\n\nexport interface DropdownStatusPropsExtended extends DropdownStatusProps {\n isEmpty?: boolean;\n isNoMatch?: boolean;\n isFiltered?: boolean;\n noMatch?: React.ReactNode;\n filteringResultsText?: string;\n /**\n * Called when the user clicks the recovery button placed at the\n * bottom of the dropdown list in the error state. Use this to\n * retry a failed request or provide another option for the user\n * to recover from the error.\n */\n onRecoveryClick?: NonCancelableEventHandler;\n /**\n * Determines if retry button should be rendered\n * in case recoveryText was automatically provided by i18n.\n */\n hasRecoveryCallback?: boolean;\n}\n\nfunction DropdownStatus({ children }: { children: React.ReactNode }) {\n return <div className={styles.root}>{children}</div>;\n}\n\ntype UseDropdownStatus = ({\n statusType,\n empty,\n loadingText,\n finishedText,\n filteringResultsText,\n errorText,\n recoveryText,\n isEmpty,\n isNoMatch,\n isFiltered,\n noMatch,\n hasRecoveryCallback,\n onRecoveryClick,\n}: DropdownStatusPropsExtended) => DropdownStatusResult;\n\nexport interface DropdownStatusResult {\n isSticky: boolean;\n content: React.ReactNode | null;\n}\n\nexport const useDropdownStatus: UseDropdownStatus = ({\n statusType,\n empty,\n loadingText,\n finishedText,\n filteringResultsText,\n errorText,\n recoveryText,\n isEmpty,\n isNoMatch,\n isFiltered,\n noMatch,\n onRecoveryClick,\n hasRecoveryCallback = false,\n errorIconAriaLabel,\n}) => {\n const previousStatusType = usePrevious(statusType);\n const statusResult: DropdownStatusResult = { isSticky: true, content: null };\n\n if (statusType === 'loading') {\n statusResult.content = <InternalStatusIndicator type={'loading'}>{loadingText}</InternalStatusIndicator>;\n } else if (statusType === 'error') {\n statusResult.content = (\n <span>\n <InternalStatusIndicator\n type=\"error\"\n __display=\"inline\"\n __animate={previousStatusType !== 'error'}\n iconAriaLabel={errorIconAriaLabel}\n >\n {errorText}\n </InternalStatusIndicator>{' '}\n {!!recoveryText && hasRecoveryCallback && (\n <InternalLink\n onFollow={() => fireNonCancelableEvent(onRecoveryClick)}\n variant=\"recovery\"\n className={styles.recovery}\n >\n {recoveryText}\n </InternalLink>\n )}\n </span>\n );\n } else if (isEmpty && empty) {\n statusResult.content = empty;\n } else if (isNoMatch && noMatch) {\n statusResult.content = noMatch;\n } else if (isFiltered && filteringResultsText) {\n statusResult.content = filteringResultsText;\n } else if (statusType === 'finished' && finishedText) {\n statusResult.content = finishedText;\n statusResult.isSticky = false;\n }\n\n return statusResult;\n};\n\nexport default DropdownStatus;\n"]}
|
package/internal/environment.js
CHANGED
package/internal/manifest.json
CHANGED
|
@@ -1,7 +1,14 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { InternalBaseComponentProps } from '../internal/hooks/use-base-component/index.js';
|
|
3
3
|
import { MultiselectProps } from './interfaces';
|
|
4
|
-
declare const InternalMultiselect: React.ForwardRefExoticComponent<MultiselectProps &
|
|
4
|
+
declare const InternalMultiselect: React.ForwardRefExoticComponent<MultiselectProps & {
|
|
5
|
+
statusType: import("../internal/components/dropdown-status").DropdownStatusProps.StatusType;
|
|
6
|
+
options: import("..").SelectProps.Options;
|
|
7
|
+
filteringType: import("../internal/components/dropdown/interfaces").OptionsFilteringType;
|
|
8
|
+
selectedOptions: readonly import("../internal/components/option/interfaces").OptionDefinition[];
|
|
9
|
+
keepOpen: boolean;
|
|
10
|
+
hideTokens: boolean;
|
|
11
|
+
} & InternalBaseComponentProps<any> & {
|
|
5
12
|
inlineTokens?: boolean | undefined;
|
|
6
13
|
} & React.RefAttributes<MultiselectProps.Ref>>;
|
|
7
14
|
export default InternalMultiselect;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/multiselect/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,
|
|
1
|
+
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/multiselect/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmB,MAAM,OAAO,CAAC;AASxC,OAAO,EAAE,0BAA0B,EAAE,MAAM,+CAA+C,CAAC;AAU3F,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAWhD,QAAA,MAAM,mBAAmB;;;;;;;;;8CA2KxB,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
|
package/multiselect/internal.js
CHANGED
|
@@ -1,142 +1,47 @@
|
|
|
1
1
|
import { __rest } from "tslib";
|
|
2
2
|
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
3
3
|
// SPDX-License-Identifier: Apache-2.0
|
|
4
|
-
import React, {
|
|
4
|
+
import React, { useState } from 'react';
|
|
5
5
|
import clsx from 'clsx';
|
|
6
|
-
import { warnOnce } from '@cloudscape-design/component-toolkit/internal';
|
|
7
6
|
import { useInternalI18n } from '../i18n/context';
|
|
8
7
|
import { getBaseProps } from '../internal/base-component';
|
|
9
8
|
import Dropdown from '../internal/components/dropdown';
|
|
10
9
|
import DropdownFooter from '../internal/components/dropdown-footer/index.js';
|
|
11
|
-
import { useDropdownStatus } from '../internal/components/dropdown-status';
|
|
12
|
-
import { isGroup } from '../internal/components/option/utils/filter-options';
|
|
13
|
-
import { prepareOptions } from '../internal/components/option/utils/prepare-options';
|
|
14
10
|
import ScreenreaderOnly from '../internal/components/screenreader-only';
|
|
15
11
|
import { useFormFieldContext } from '../internal/context/form-field-context';
|
|
16
|
-
import { fireNonCancelableEvent } from '../internal/events';
|
|
17
|
-
import { useMergeRefs } from '../internal/hooks/use-merge-refs';
|
|
18
12
|
import { useUniqueId } from '../internal/hooks/use-unique-id';
|
|
19
13
|
import { joinStrings } from '../internal/utils/strings';
|
|
20
14
|
import Filter from '../select/parts/filter';
|
|
21
15
|
import PlainList from '../select/parts/plain-list';
|
|
22
16
|
import Trigger from '../select/parts/trigger';
|
|
23
17
|
import VirtualList from '../select/parts/virtual-list';
|
|
24
|
-
import { checkOptionValueField } from '../select/utils/check-option-value-field.js';
|
|
25
|
-
import { findOptionIndex } from '../select/utils/connect-options';
|
|
26
|
-
import { useAnnouncement } from '../select/utils/use-announcement';
|
|
27
|
-
import { useLoadItems } from '../select/utils/use-load-items';
|
|
28
|
-
import { useNativeSearch } from '../select/utils/use-native-search';
|
|
29
|
-
import { useSelect } from '../select/utils/use-select';
|
|
30
18
|
import InternalTokenGroup from '../token-group/internal';
|
|
19
|
+
import { useMultiselect } from './use-multiselect';
|
|
31
20
|
import styles from './styles.css.js';
|
|
32
21
|
const InternalMultiselect = React.forwardRef((_a, externalRef) => {
|
|
33
22
|
var _b;
|
|
34
|
-
var { options
|
|
35
|
-
checkOptionValueField('Multiselect', 'options', options);
|
|
23
|
+
var { options, filteringType, filteringPlaceholder, filteringAriaLabel, filteringClearAriaLabel, ariaRequired, placeholder, disabled, readOnly, ariaLabel, selectedOptions, deselectAriaLabel, tokenLimit, i18nStrings, virtualScroll, inlineTokens = false, hideTokens, expandToViewport, tokenLimitShowFewerAriaLabel, tokenLimitShowMoreAriaLabel, __internalRootRef = null, autoFocus } = _a, restProps = __rest(_a, ["options", "filteringType", "filteringPlaceholder", "filteringAriaLabel", "filteringClearAriaLabel", "ariaRequired", "placeholder", "disabled", "readOnly", "ariaLabel", "selectedOptions", "deselectAriaLabel", "tokenLimit", "i18nStrings", "virtualScroll", "inlineTokens", "hideTokens", "expandToViewport", "tokenLimitShowFewerAriaLabel", "tokenLimitShowMoreAriaLabel", "__internalRootRef", "autoFocus"]);
|
|
36
24
|
const baseProps = getBaseProps(restProps);
|
|
37
25
|
const formFieldContext = useFormFieldContext(restProps);
|
|
38
26
|
const i18n = useInternalI18n('multiselect');
|
|
39
|
-
const i18nCommon = useInternalI18n('select');
|
|
40
|
-
const recoveryText = i18nCommon('recoveryText', restProps.recoveryText);
|
|
41
|
-
const errorIconAriaLabel = i18nCommon('errorIconAriaLabel', restProps.errorIconAriaLabel);
|
|
42
|
-
const selectedAriaLabel = i18nCommon('selectedAriaLabel', restProps.selectedAriaLabel);
|
|
43
|
-
if (restProps.recoveryText && !onLoadItems) {
|
|
44
|
-
warnOnce('Multiselect', '`onLoadItems` must be provided for `recoveryText` to be displayed.');
|
|
45
|
-
}
|
|
46
|
-
const { handleLoadMore, handleRecoveryClick, fireLoadItems } = useLoadItems({
|
|
47
|
-
onLoadItems,
|
|
48
|
-
options,
|
|
49
|
-
statusType,
|
|
50
|
-
});
|
|
51
|
-
const useInteractiveGroups = true;
|
|
52
|
-
const [filteringValue, setFilteringValue] = useState('');
|
|
53
|
-
const { filteredOptions, parentMap, totalCount, matchesCount } = prepareOptions(options, filteringType, filteringValue);
|
|
54
|
-
const updateSelectedOption = useCallback((option) => {
|
|
55
|
-
const filtered = filteredOptions.filter(item => item.type !== 'parent').map(item => item.option);
|
|
56
|
-
// switch between selection and deselection behavior, ignores disabled options to prevent
|
|
57
|
-
// getting stuck on one behavior when an option is disabled and its state cannot be changed
|
|
58
|
-
const isAllChildrenSelected = (optionsArray) => optionsArray.every(item => findOptionIndex(selectedOptions, item) > -1 || item.disabled);
|
|
59
|
-
const intersection = (visibleOptions, options) => visibleOptions.filter(item => findOptionIndex(options, item) > -1 && !item.disabled);
|
|
60
|
-
const union = (visibleOptions, options) => visibleOptions.filter(item => findOptionIndex(options, item) === -1).concat(options);
|
|
61
|
-
const select = (options, selectedOptions) => {
|
|
62
|
-
return union(selectedOptions, options);
|
|
63
|
-
};
|
|
64
|
-
const unselect = (options, selectedOptions) => {
|
|
65
|
-
return selectedOptions.filter(option => findOptionIndex(options, option) === -1);
|
|
66
|
-
};
|
|
67
|
-
let newSelectedOptions = [...selectedOptions];
|
|
68
|
-
if (isGroup(option)) {
|
|
69
|
-
const visibleOptions = intersection([...option.options], filtered);
|
|
70
|
-
newSelectedOptions = isAllChildrenSelected(visibleOptions)
|
|
71
|
-
? unselect(visibleOptions, newSelectedOptions)
|
|
72
|
-
: select(visibleOptions, newSelectedOptions);
|
|
73
|
-
}
|
|
74
|
-
else {
|
|
75
|
-
newSelectedOptions = isAllChildrenSelected([option])
|
|
76
|
-
? unselect([option], newSelectedOptions)
|
|
77
|
-
: select([option], newSelectedOptions);
|
|
78
|
-
}
|
|
79
|
-
fireNonCancelableEvent(onChange, {
|
|
80
|
-
selectedOptions: newSelectedOptions,
|
|
81
|
-
});
|
|
82
|
-
}, [onChange, selectedOptions, filteredOptions]);
|
|
83
|
-
const rootRef = useRef(null);
|
|
84
27
|
const selfControlId = useUniqueId('trigger');
|
|
85
28
|
const controlId = (_b = formFieldContext.controlId) !== null && _b !== void 0 ? _b : selfControlId;
|
|
86
|
-
const
|
|
29
|
+
const ariaLabelId = useUniqueId('multiselect-arialabel-');
|
|
87
30
|
const footerId = useUniqueId('footer');
|
|
88
|
-
const
|
|
89
|
-
const
|
|
31
|
+
const [filteringValue, setFilteringValue] = useState('');
|
|
32
|
+
const multiselectProps = useMultiselect(Object.assign({ options,
|
|
90
33
|
selectedOptions,
|
|
91
|
-
updateSelectedOption,
|
|
92
|
-
options: filteredOptions,
|
|
93
34
|
filteringType,
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
35
|
+
disabled,
|
|
36
|
+
deselectAriaLabel,
|
|
37
|
+
controlId,
|
|
38
|
+
ariaLabelId,
|
|
39
|
+
footerId,
|
|
40
|
+
filteringValue,
|
|
99
41
|
setFilteringValue,
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
});
|
|
103
|
-
const handleNativeSearch = useNativeSearch({
|
|
104
|
-
isEnabled: filteringType === 'none' && isOpen,
|
|
105
|
-
options: filteredOptions,
|
|
106
|
-
highlightOption: highlightOption,
|
|
107
|
-
highlightedOption: highlightedOption === null || highlightedOption === void 0 ? void 0 : highlightedOption.option,
|
|
108
|
-
useInteractiveGroups,
|
|
109
|
-
});
|
|
110
|
-
const isEmpty = !options || options.length === 0;
|
|
111
|
-
const isNoMatch = filteredOptions && filteredOptions.length === 0;
|
|
112
|
-
const isFiltered = filteringType !== 'none' && filteringValue.length > 0 && filteredOptions && filteredOptions.length > 0;
|
|
113
|
-
const filteredText = isFiltered ? filteringResultsText === null || filteringResultsText === void 0 ? void 0 : filteringResultsText(matchesCount, totalCount) : undefined;
|
|
114
|
-
const dropdownStatus = useDropdownStatus({
|
|
115
|
-
statusType,
|
|
116
|
-
empty,
|
|
117
|
-
loadingText,
|
|
118
|
-
finishedText,
|
|
119
|
-
errorText,
|
|
120
|
-
recoveryText,
|
|
121
|
-
isEmpty,
|
|
122
|
-
isNoMatch,
|
|
123
|
-
noMatch,
|
|
124
|
-
isFiltered,
|
|
125
|
-
filteringResultsText: filteredText,
|
|
126
|
-
onRecoveryClick: handleRecoveryClick,
|
|
127
|
-
errorIconAriaLabel: errorIconAriaLabel,
|
|
128
|
-
hasRecoveryCallback: !!onLoadItems,
|
|
129
|
-
});
|
|
130
|
-
const filter = (React.createElement(Filter, Object.assign({ clearAriaLabel: filteringClearAriaLabel, filteringType: filteringType, placeholder: filteringPlaceholder, ariaLabel: filteringAriaLabel, ariaRequired: ariaRequired, value: filteringValue }, getFilterProps())));
|
|
131
|
-
const trigger = (React.createElement(Trigger, Object.assign({ placeholder: placeholder, disabled: disabled, readOnly: readOnly, triggerProps: getTriggerProps(disabled, autoFocus), selectedOption: null, selectedOptions: selectedOptions, triggerVariant: inlineTokens ? 'tokens' : 'placeholder', isOpen: isOpen }, formFieldContext, { controlId: controlId, ariaLabelledby: joinStrings(formFieldContext.ariaLabelledby, multiSelectAriaLabelId) })));
|
|
132
|
-
const menuProps = Object.assign(Object.assign({}, getMenuProps()), { onLoadMore: handleLoadMore, ariaLabelledby: joinStrings(multiSelectAriaLabelId, controlId), ariaDescribedby: dropdownStatus.content ? footerId : undefined });
|
|
133
|
-
const announcement = useAnnouncement({
|
|
134
|
-
announceSelected,
|
|
135
|
-
highlightedOption,
|
|
136
|
-
getParent: option => { var _a; return (_a = parentMap.get(option)) === null || _a === void 0 ? void 0 : _a.option; },
|
|
137
|
-
selectedAriaLabel,
|
|
138
|
-
renderHighlightedAriaLive,
|
|
139
|
-
});
|
|
42
|
+
externalRef }, restProps));
|
|
43
|
+
const filter = (React.createElement(Filter, Object.assign({ clearAriaLabel: filteringClearAriaLabel, filteringType: filteringType, placeholder: filteringPlaceholder, ariaLabel: filteringAriaLabel, ariaRequired: ariaRequired, value: filteringValue }, multiselectProps.getFilterProps())));
|
|
44
|
+
const trigger = (React.createElement(Trigger, Object.assign({ placeholder: placeholder, disabled: disabled, readOnly: readOnly, triggerProps: multiselectProps.getTriggerProps(disabled, autoFocus), selectedOption: null, selectedOptions: selectedOptions, triggerVariant: inlineTokens ? 'tokens' : 'placeholder', isOpen: multiselectProps.isOpen }, formFieldContext, { controlId: controlId, ariaLabelledby: joinStrings(formFieldContext.ariaLabelledby, ariaLabelId) })));
|
|
140
45
|
const tokens = selectedOptions.map(option => ({
|
|
141
46
|
label: option.label,
|
|
142
47
|
disabled: disabled || option.disabled,
|
|
@@ -149,38 +54,19 @@ const InternalMultiselect = React.forwardRef((_a, externalRef) => {
|
|
|
149
54
|
tags: option.tags,
|
|
150
55
|
dismissLabel: i18n('deselectAriaLabel', deselectAriaLabel === null || deselectAriaLabel === void 0 ? void 0 : deselectAriaLabel(option), format => { var _a; return format({ option__label: (_a = option.label) !== null && _a !== void 0 ? _a : '' }); }),
|
|
151
56
|
}));
|
|
152
|
-
useEffect(() => {
|
|
153
|
-
var _a;
|
|
154
|
-
(_a = scrollToIndex.current) === null || _a === void 0 ? void 0 : _a.call(scrollToIndex, highlightedIndex);
|
|
155
|
-
}, [highlightedIndex]);
|
|
156
57
|
const ListComponent = virtualScroll ? VirtualList : PlainList;
|
|
157
|
-
const handleMouseDown = (event) => {
|
|
158
|
-
const target = event.target;
|
|
159
|
-
if (target !== document.activeElement) {
|
|
160
|
-
// prevent currently focused element from losing it
|
|
161
|
-
event.preventDefault();
|
|
162
|
-
}
|
|
163
|
-
};
|
|
164
58
|
const showTokens = !hideTokens && !inlineTokens && tokens.length > 0;
|
|
165
|
-
const handleTokenDismiss = ({ detail }) => {
|
|
166
|
-
const optionToDeselect = selectedOptions[detail.itemIndex];
|
|
167
|
-
updateSelectedOption(optionToDeselect);
|
|
168
|
-
const targetRef = getTriggerProps().ref;
|
|
169
|
-
if (targetRef.current) {
|
|
170
|
-
targetRef.current.focus();
|
|
171
|
-
}
|
|
172
|
-
};
|
|
173
59
|
const tokenGroupI18nStrings = {
|
|
174
60
|
limitShowFewer: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.tokenLimitShowFewer,
|
|
175
61
|
limitShowMore: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.tokenLimitShowMore,
|
|
176
62
|
};
|
|
177
|
-
const
|
|
178
|
-
const dropdownProps = getDropdownProps();
|
|
179
|
-
return (React.createElement("div", Object.assign({}, baseProps, { ref:
|
|
180
|
-
React.createElement(Dropdown, Object.assign({}, dropdownProps, { ariaLabelledby: dropdownProps.dropdownContentRole ? joinStrings(
|
|
181
|
-
React.createElement(ListComponent, { listBottom: !dropdownStatus.isSticky ? (React.createElement(DropdownFooter, { content: isOpen ? dropdownStatus.content : null, id: footerId })) : null, menuProps:
|
|
182
|
-
showTokens && (React.createElement(InternalTokenGroup, { className: styles.tokens, alignment: "horizontal", limit: tokenLimit, items: tokens,
|
|
183
|
-
React.createElement(ScreenreaderOnly, { id:
|
|
63
|
+
const dropdownStatus = multiselectProps.dropdownStatus;
|
|
64
|
+
const dropdownProps = multiselectProps.getDropdownProps();
|
|
65
|
+
return (React.createElement("div", Object.assign({}, baseProps, { ref: __internalRootRef, className: clsx(styles.root, baseProps.className) }, multiselectProps.getWrapperProps()),
|
|
66
|
+
React.createElement(Dropdown, Object.assign({}, dropdownProps, { ariaLabelledby: dropdownProps.dropdownContentRole ? joinStrings(ariaLabelId, controlId) : undefined, ariaDescribedby: dropdownProps.dropdownContentRole ? (dropdownStatus.content ? footerId : undefined) : undefined, open: multiselectProps.isOpen, trigger: trigger, header: filter, footer: dropdownStatus.isSticky ? (React.createElement(DropdownFooter, { content: multiselectProps.isOpen ? dropdownStatus.content : null, id: footerId })) : null, expandToViewport: expandToViewport, stretchBeyondTriggerWidth: true }),
|
|
67
|
+
React.createElement(ListComponent, { listBottom: !dropdownStatus.isSticky ? (React.createElement(DropdownFooter, { content: multiselectProps.isOpen ? dropdownStatus.content : null, id: footerId })) : null, menuProps: multiselectProps.getMenuProps(), getOptionProps: multiselectProps.getOptionProps, filteredOptions: multiselectProps.filteredOptions, filteringValue: filteringValue, ref: multiselectProps.scrollToIndex, hasDropdownStatus: dropdownStatus.content !== null, checkboxes: true, useInteractiveGroups: true, screenReaderContent: multiselectProps.announcement, highlightType: multiselectProps.highlightType })),
|
|
68
|
+
showTokens && (React.createElement(InternalTokenGroup, Object.assign({}, multiselectProps.getTokenProps(), { className: styles.tokens, alignment: "horizontal", limit: tokenLimit, items: tokens, i18nStrings: tokenGroupI18nStrings, limitShowMoreAriaLabel: tokenLimitShowMoreAriaLabel, limitShowFewerAriaLabel: tokenLimitShowFewerAriaLabel, disableOuterPadding: true, readOnly: readOnly }))),
|
|
69
|
+
React.createElement(ScreenreaderOnly, { id: ariaLabelId }, ariaLabel)));
|
|
184
70
|
});
|
|
185
71
|
export default InternalMultiselect;
|
|
186
72
|
//# sourceMappingURL=internal.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/multiselect/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxE,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,QAAQ,EAAE,MAAM,+CAA+C,CAAC;AAEzE,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,QAAQ,MAAM,iCAAiC,CAAC;AACvD,OAAO,cAAc,MAAM,iDAAiD,CAAC;AAC7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,wCAAwC,CAAC;AAE3E,OAAO,EAAE,OAAO,EAAE,MAAM,oDAAoD,CAAC;AAC7E,OAAO,EAAE,cAAc,EAAE,MAAM,qDAAqD,CAAC;AACrF,OAAO,gBAAgB,MAAM,0CAA0C,CAAC;AACxE,OAAO,EAAE,mBAAmB,EAAE,MAAM,wCAAwC,CAAC;AAC7E,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAE5D,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAC9D,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,MAAM,MAAM,wBAAwB,CAAC;AAC5C,OAAO,SAA8B,MAAM,4BAA4B,CAAC;AACxE,OAAO,OAAO,MAAM,yBAAyB,CAAC;AAC9C,OAAO,WAAW,MAAM,8BAA8B,CAAC;AACvD,OAAO,EAAE,qBAAqB,EAAE,MAAM,6CAA6C,CAAC;AACpF,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAClE,OAAO,EAAE,eAAe,EAAE,MAAM,kCAAkC,CAAC;AACnE,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,mCAAmC,CAAC;AACpE,OAAO,EAAa,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAElE,OAAO,kBAAkB,MAAM,yBAAyB,CAAC;AAGzD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,mBAAmB,GAAG,KAAK,CAAC,UAAU,CAC1C,CACE,EAqC2B,EAC3B,WAA4C,EAC5C,EAAE;;QAvCF,EACE,OAAO,GAAG,EAAE,EACZ,aAAa,GAAG,MAAM,EACtB,oBAAoB,EACpB,kBAAkB,EAClB,uBAAuB,EACvB,oBAAoB,EACpB,YAAY,EACZ,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,UAAU,GAAG,UAAU,EACvB,KAAK,EACL,WAAW,EACX,YAAY,EACZ,SAAS,EACT,OAAO,EACP,yBAAyB,EACzB,eAAe,GAAG,EAAE,EACpB,iBAAiB,EACjB,QAAQ,GAAG,IAAI,EACf,UAAU,EACV,WAAW,EACX,MAAM,EACN,OAAO,EACP,WAAW,EACX,QAAQ,EACR,aAAa,EACb,YAAY,GAAG,KAAK,EACpB,UAAU,GAAG,KAAK,EAClB,gBAAgB,EAChB,4BAA4B,EAC5B,2BAA2B,EAC3B,iBAAiB,GAAG,IAAI,EACxB,SAAS,OAEgB,EADtB,SAAS,cApCd,ilBAqCC,CADa;IAId,qBAAqB,CAAC,aAAa,EAAE,SAAS,EAAE,OAAO,CAAC,CAAC;IAEzD,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,SAAS,CAAC,CAAC;IACxD,MAAM,IAAI,GAAG,eAAe,CAAC,aAAa,CAAC,CAAC;IAE5C,MAAM,UAAU,GAAG,eAAe,CAAC,QAAQ,CAAC,CAAC;IAC7C,MAAM,YAAY,GAAG,UAAU,CAAC,cAAc,EAAE,SAAS,CAAC,YAAY,CAAC,CAAC;IACxE,MAAM,kBAAkB,GAAG,UAAU,CAAC,oBAAoB,EAAE,SAAS,CAAC,kBAAkB,CAAC,CAAC;IAC1F,MAAM,iBAAiB,GAAG,UAAU,CAAC,mBAAmB,EAAE,SAAS,CAAC,iBAAiB,CAAC,CAAC;IAEvF,IAAI,SAAS,CAAC,YAAY,IAAI,CAAC,WAAW,EAAE;QAC1C,QAAQ,CAAC,aAAa,EAAE,oEAAoE,CAAC,CAAC;KAC/F;IAED,MAAM,EAAE,cAAc,EAAE,mBAAmB,EAAE,aAAa,EAAE,GAAG,YAAY,CAAC;QAC1E,WAAW;QACX,OAAO;QACP,UAAU;KACX,CAAC,CAAC;IACH,MAAM,oBAAoB,GAAG,IAAI,CAAC;IAClC,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACzD,MAAM,EAAE,eAAe,EAAE,SAAS,EAAE,UAAU,EAAE,YAAY,EAAE,GAAG,cAAc,CAC7E,OAAO,EACP,aAAa,EACb,cAAc,CACf,CAAC;IAEF,MAAM,oBAAoB,GAAG,WAAW,CACtC,CAAC,MAAsC,EAAE,EAAE;QACzC,MAAM,QAAQ,GAAG,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI,KAAK,QAAQ,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QAEjG,yFAAyF;QACzF,2FAA2F;QAC3F,MAAM,qBAAqB,GAAG,CAAC,YAAgC,EAAE,EAAE,CACjE,YAAY,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,eAAe,CAAC,eAAe,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC;QAC3F,MAAM,YAAY,GAAG,CAAC,cAAkC,EAAE,OAA2B,EAAE,EAAE,CACvF,cAAc,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,eAAe,CAAC,OAAO,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QACvF,MAAM,KAAK,GAAG,CAAC,cAAkC,EAAE,OAA2B,EAAE,EAAE,CAChF,cAAc,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,eAAe,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;QACvF,MAAM,MAAM,GAAG,CAAC,OAA2B,EAAE,eAAmC,EAAE,EAAE;YAClF,OAAO,KAAK,CAAC,eAAe,EAAE,OAAO,CAAC,CAAC;QACzC,CAAC,CAAC;QACF,MAAM,QAAQ,GAAG,CAAC,OAA2B,EAAE,eAAmC,EAAE,EAAE;YACpF,OAAO,eAAe,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,eAAe,CAAC,OAAO,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;QACnF,CAAC,CAAC;QACF,IAAI,kBAAkB,GAAG,CAAC,GAAG,eAAe,CAAC,CAAC;QAE9C,IAAI,OAAO,CAAC,MAAM,CAAC,EAAE;YACnB,MAAM,cAAc,GAAG,YAAY,CAAC,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,EAAE,QAAQ,CAAC,CAAC;YACnE,kBAAkB,GAAG,qBAAqB,CAAC,cAAc,CAAC;gBACxD,CAAC,CAAC,QAAQ,CAAC,cAAc,EAAE,kBAAkB,CAAC;gBAC9C,CAAC,CAAC,MAAM,CAAC,cAAc,EAAE,kBAAkB,CAAC,CAAC;SAChD;aAAM;YACL,kBAAkB,GAAG,qBAAqB,CAAC,CAAC,MAAM,CAAC,CAAC;gBAClD,CAAC,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC,EAAE,kBAAkB,CAAC;gBACxC,CAAC,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,EAAE,kBAAkB,CAAC,CAAC;SAC1C;QAED,sBAAsB,CAAC,QAAQ,EAAE;YAC/B,eAAe,EAAE,kBAAkB;SACpC,CAAC,CAAC;IACL,CAAC,EACD,CAAC,QAAQ,EAAE,eAAe,EAAE,eAAe,CAAC,CAC7C,CAAC;IAEF,MAAM,OAAO,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE7C,MAAM,aAAa,GAAG,WAAW,CAAC,SAAS,CAAC,CAAC;IAC7C,MAAM,SAAS,GAAG,MAAA,gBAAgB,CAAC,SAAS,mCAAI,aAAa,CAAC;IAE9D,MAAM,sBAAsB,GAAG,WAAW,CAAC,wBAAwB,CAAC,CAAC;IAErE,MAAM,QAAQ,GAAG,WAAW,CAAC,QAAQ,CAAC,CAAC;IAEvC,MAAM,aAAa,GAAG,MAAM,CAAgC,IAAI,CAAC,CAAC;IAClE,MAAM,EACJ,MAAM,EACN,aAAa,EACb,iBAAiB,EACjB,gBAAgB,EAChB,eAAe,EACf,gBAAgB,EAChB,cAAc,EACd,YAAY,EACZ,cAAc,EACd,eAAe,EACf,gBAAgB,GACjB,GAAG,SAAS,CAAC;QACZ,eAAe;QACf,oBAAoB;QACpB,OAAO,EAAE,eAAe;QACxB,aAAa;QACb,OAAO;QACP,MAAM;QACN,WAAW;QACX,QAAQ;QACR,aAAa;QACb,iBAAiB;QACjB,oBAAoB;QACpB,UAAU;KACX,CAAC,CAAC;IAEH,MAAM,kBAAkB,GAAG,eAAe,CAAC;QACzC,SAAS,EAAE,aAAa,KAAK,MAAM,IAAI,MAAM;QAC7C,OAAO,EAAE,eAAe;QACxB,eAAe,EAAE,eAAe;QAChC,iBAAiB,EAAE,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,MAAM;QAC5C,oBAAoB;KACrB,CAAC,CAAC;IAEH,MAAM,OAAO,GAAG,CAAC,OAAO,IAAI,OAAO,CAAC,MAAM,KAAK,CAAC,CAAC;IACjD,MAAM,SAAS,GAAG,eAAe,IAAI,eAAe,CAAC,MAAM,KAAK,CAAC,CAAC;IAClE,MAAM,UAAU,GACd,aAAa,KAAK,MAAM,IAAI,cAAc,CAAC,MAAM,GAAG,CAAC,IAAI,eAAe,IAAI,eAAe,CAAC,MAAM,GAAG,CAAC,CAAC;IACzG,MAAM,YAAY,GAAG,UAAU,CAAC,CAAC,CAAC,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAG,YAAY,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAC/F,MAAM,cAAc,GAAG,iBAAiB,CAAC;QACvC,UAAU;QACV,KAAK;QACL,WAAW;QACX,YAAY;QACZ,SAAS;QACT,YAAY;QACZ,OAAO;QACP,SAAS;QACT,OAAO;QACP,UAAU;QACV,oBAAoB,EAAE,YAAY;QAClC,eAAe,EAAE,mBAAmB;QACpC,kBAAkB,EAAE,kBAAkB;QACtC,mBAAmB,EAAE,CAAC,CAAC,WAAW;KACnC,CAAC,CAAC;IAEH,MAAM,MAAM,GAAG,CACb,oBAAC,MAAM,kBACL,cAAc,EAAE,uBAAuB,EACvC,aAAa,EAAE,aAAa,EAC5B,WAAW,EAAE,oBAAoB,EACjC,SAAS,EAAE,kBAAkB,EAC7B,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAE,cAAc,IACjB,cAAc,EAAE,EACpB,CACH,CAAC;IAEF,MAAM,OAAO,GAAG,CACd,oBAAC,OAAO,kBACN,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,eAAe,CAAC,QAAQ,EAAE,SAAS,CAAC,EAClD,cAAc,EAAE,IAAI,EACpB,eAAe,EAAE,eAAe,EAChC,cAAc,EAAE,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,aAAa,EACvD,MAAM,EAAE,MAAM,IACV,gBAAgB,IACpB,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,WAAW,CAAC,gBAAgB,CAAC,cAAc,EAAE,sBAAsB,CAAC,IACpF,CACH,CAAC;IAEF,MAAM,SAAS,mCACV,YAAY,EAAE,KACjB,UAAU,EAAE,cAAc,EAC1B,cAAc,EAAE,WAAW,CAAC,sBAAsB,EAAE,SAAS,CAAC,EAC9D,eAAe,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,GAC/D,CAAC;IAEF,MAAM,YAAY,GAAG,eAAe,CAAC;QACnC,gBAAgB;QAChB,iBAAiB;QACjB,SAAS,EAAE,MAAM,CAAC,EAAE,WAAC,OAAA,MAAA,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,0CAAE,MAAiC,CAAA,EAAA;QAC7E,iBAAiB;QACjB,yBAAyB;KAC1B,CAAC,CAAC;IAEH,MAAM,MAAM,GAA6B,eAAe,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;QACtE,KAAK,EAAE,MAAM,CAAC,KAAK;QACnB,QAAQ,EAAE,QAAQ,IAAI,MAAM,CAAC,QAAQ;QACrC,QAAQ,EAAE,MAAM,CAAC,QAAQ;QACzB,WAAW,EAAE,MAAM,CAAC,WAAW;QAC/B,OAAO,EAAE,MAAM,CAAC,OAAO;QACvB,QAAQ,EAAE,MAAM,CAAC,QAAQ;QACzB,OAAO,EAAE,MAAM,CAAC,OAAO;QACvB,OAAO,EAAE,MAAM,CAAC,OAAO;QACvB,IAAI,EAAE,MAAM,CAAC,IAAI;QACjB,YAAY,EAAE,IAAI,CAAC,mBAAmB,EAAE,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAG,MAAM,CAAC,EAAE,MAAM,CAAC,EAAE,WAC5E,OAAA,MAAM,CAAC,EAAE,aAAa,EAAE,MAAA,MAAM,CAAC,KAAK,mCAAI,EAAE,EAAE,CAAC,CAAA,EAAA,CAC9C;KACF,CAAC,CAAC,CAAC;IAEJ,SAAS,CAAC,GAAG,EAAE;;QACb,MAAA,aAAa,CAAC,OAAO,8DAAG,gBAAgB,CAAC,CAAC;IAC5C,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAEvB,MAAM,aAAa,GAAG,aAAa,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC;IAE9D,MAAM,eAAe,GAAG,CAAC,KAAuB,EAAE,EAAE;QAClD,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;QAE3C,IAAI,MAAM,KAAK,QAAQ,CAAC,aAAa,EAAE;YACrC,mDAAmD;YACnD,KAAK,CAAC,cAAc,EAAE,CAAC;SACxB;IACH,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,CAAC,UAAU,IAAI,CAAC,YAAY,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC;IACrE,MAAM,kBAAkB,GAAiC,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE;QACtE,MAAM,gBAAgB,GAAG,eAAe,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;QAC3D,oBAAoB,CAAC,gBAAgB,CAAC,CAAC;QACvC,MAAM,SAAS,GAAG,eAAe,EAAE,CAAC,GAAG,CAAC;QACxC,IAAI,SAAS,CAAC,OAAO,EAAE;YACrB,SAAS,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;SAC3B;IACH,CAAC,CAAC;IAEF,MAAM,qBAAqB,GAAgC;QACzD,cAAc,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,mBAAmB;QAChD,aAAa,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,kBAAkB;KAC/C,CAAC;IAEF,MAAM,SAAS,GAAG,YAAY,CAAC,OAAO,EAAE,iBAAiB,CAAC,CAAC;IAE3D,MAAM,aAAa,GAAG,gBAAgB,EAAE,CAAC;IAEzC,OAAO,CACL,6CACM,SAAS,IACb,GAAG,EAAE,SAAS,EACd,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,SAAS,CAAC,EACjD,UAAU,EAAE,kBAAkB;QAE9B,oBAAC,QAAQ,oBACH,aAAa,IACjB,cAAc,EACZ,aAAa,CAAC,mBAAmB,CAAC,CAAC,CAAC,WAAW,CAAC,sBAAsB,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,EAEhG,eAAe,EACb,aAAa,CAAC,mBAAmB,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,EAEjG,IAAI,EAAE,MAAM,EACZ,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,eAAe,EAC5B,MAAM,EACJ,cAAc,CAAC,QAAQ,CAAC,CAAC,CAAC,CACxB,oBAAC,cAAc,IAAC,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE,EAAE,QAAQ,GAAI,CAClF,CAAC,CAAC,CAAC,IAAI,EAEV,gBAAgB,EAAE,gBAAgB,EAClC,yBAAyB,EAAE,IAAI;YAE/B,oBAAC,aAAa,IACZ,UAAU,EACR,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC,CAAC,CACzB,oBAAC,cAAc,IAAC,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE,EAAE,QAAQ,GAAI,CAClF,CAAC,CAAC,CAAC,IAAI,EAEV,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,cAAc,EAC9B,eAAe,EAAE,eAAe,EAChC,cAAc,EAAE,cAAc,EAC9B,GAAG,EAAE,aAAa,EAClB,iBAAiB,EAAE,cAAc,CAAC,OAAO,KAAK,IAAI,EAClD,UAAU,EAAE,IAAI,EAChB,oBAAoB,EAAE,oBAAoB,EAC1C,mBAAmB,EAAE,YAAY,EACjC,aAAa,EAAE,aAAa,GAC5B,CACO;QACV,UAAU,IAAI,CACb,oBAAC,kBAAkB,IACjB,SAAS,EAAE,MAAM,CAAC,MAAM,EACxB,SAAS,EAAC,YAAY,EACtB,KAAK,EAAE,UAAU,EACjB,KAAK,EAAE,MAAM,EACb,SAAS,EAAE,kBAAkB,EAC7B,WAAW,EAAE,qBAAqB,EAClC,sBAAsB,EAAE,2BAA2B,EACnD,uBAAuB,EAAE,4BAA4B,EACrD,mBAAmB,EAAE,IAAI,EACzB,QAAQ,EAAE,QAAQ,GAClB,CACH;QACD,oBAAC,gBAAgB,IAAC,EAAE,EAAE,sBAAsB,IAAG,SAAS,CAAoB,CACxE,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,mBAAmB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport Dropdown from '../internal/components/dropdown';\nimport DropdownFooter from '../internal/components/dropdown-footer/index.js';\nimport { useDropdownStatus } from '../internal/components/dropdown-status';\nimport { OptionDefinition, OptionGroup } from '../internal/components/option/interfaces';\nimport { isGroup } from '../internal/components/option/utils/filter-options';\nimport { prepareOptions } from '../internal/components/option/utils/prepare-options';\nimport ScreenreaderOnly from '../internal/components/screenreader-only';\nimport { useFormFieldContext } from '../internal/context/form-field-context';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component/index.js';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { joinStrings } from '../internal/utils/strings';\nimport Filter from '../select/parts/filter';\nimport PlainList, { SelectListProps } from '../select/parts/plain-list';\nimport Trigger from '../select/parts/trigger';\nimport VirtualList from '../select/parts/virtual-list';\nimport { checkOptionValueField } from '../select/utils/check-option-value-field.js';\nimport { findOptionIndex } from '../select/utils/connect-options';\nimport { useAnnouncement } from '../select/utils/use-announcement';\nimport { useLoadItems } from '../select/utils/use-load-items';\nimport { useNativeSearch } from '../select/utils/use-native-search';\nimport { MenuProps, useSelect } from '../select/utils/use-select';\nimport { TokenGroupProps } from '../token-group/interfaces';\nimport InternalTokenGroup from '../token-group/internal';\nimport { MultiselectProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\ntype InternalMultiselectProps = MultiselectProps & InternalBaseComponentProps & { inlineTokens?: boolean };\n\nconst InternalMultiselect = React.forwardRef(\n (\n {\n options = [],\n filteringType = 'none',\n filteringPlaceholder,\n filteringAriaLabel,\n filteringClearAriaLabel,\n filteringResultsText,\n ariaRequired,\n placeholder,\n disabled,\n readOnly,\n ariaLabel,\n statusType = 'finished',\n empty,\n loadingText,\n finishedText,\n errorText,\n noMatch,\n renderHighlightedAriaLive,\n selectedOptions = [],\n deselectAriaLabel,\n keepOpen = true,\n tokenLimit,\n i18nStrings,\n onBlur,\n onFocus,\n onLoadItems,\n onChange,\n virtualScroll,\n inlineTokens = false,\n hideTokens = false,\n expandToViewport,\n tokenLimitShowFewerAriaLabel,\n tokenLimitShowMoreAriaLabel,\n __internalRootRef = null,\n autoFocus,\n ...restProps\n }: InternalMultiselectProps,\n externalRef: React.Ref<MultiselectProps.Ref>\n ) => {\n checkOptionValueField('Multiselect', 'options', options);\n\n const baseProps = getBaseProps(restProps);\n const formFieldContext = useFormFieldContext(restProps);\n const i18n = useInternalI18n('multiselect');\n\n const i18nCommon = useInternalI18n('select');\n const recoveryText = i18nCommon('recoveryText', restProps.recoveryText);\n const errorIconAriaLabel = i18nCommon('errorIconAriaLabel', restProps.errorIconAriaLabel);\n const selectedAriaLabel = i18nCommon('selectedAriaLabel', restProps.selectedAriaLabel);\n\n if (restProps.recoveryText && !onLoadItems) {\n warnOnce('Multiselect', '`onLoadItems` must be provided for `recoveryText` to be displayed.');\n }\n\n const { handleLoadMore, handleRecoveryClick, fireLoadItems } = useLoadItems({\n onLoadItems,\n options,\n statusType,\n });\n const useInteractiveGroups = true;\n const [filteringValue, setFilteringValue] = useState('');\n const { filteredOptions, parentMap, totalCount, matchesCount } = prepareOptions(\n options,\n filteringType,\n filteringValue\n );\n\n const updateSelectedOption = useCallback(\n (option: OptionDefinition | OptionGroup) => {\n const filtered = filteredOptions.filter(item => item.type !== 'parent').map(item => item.option);\n\n // switch between selection and deselection behavior, ignores disabled options to prevent\n // getting stuck on one behavior when an option is disabled and its state cannot be changed\n const isAllChildrenSelected = (optionsArray: OptionDefinition[]) =>\n optionsArray.every(item => findOptionIndex(selectedOptions, item) > -1 || item.disabled);\n const intersection = (visibleOptions: OptionDefinition[], options: OptionDefinition[]) =>\n visibleOptions.filter(item => findOptionIndex(options, item) > -1 && !item.disabled);\n const union = (visibleOptions: OptionDefinition[], options: OptionDefinition[]) =>\n visibleOptions.filter(item => findOptionIndex(options, item) === -1).concat(options);\n const select = (options: OptionDefinition[], selectedOptions: OptionDefinition[]) => {\n return union(selectedOptions, options);\n };\n const unselect = (options: OptionDefinition[], selectedOptions: OptionDefinition[]) => {\n return selectedOptions.filter(option => findOptionIndex(options, option) === -1);\n };\n let newSelectedOptions = [...selectedOptions];\n\n if (isGroup(option)) {\n const visibleOptions = intersection([...option.options], filtered);\n newSelectedOptions = isAllChildrenSelected(visibleOptions)\n ? unselect(visibleOptions, newSelectedOptions)\n : select(visibleOptions, newSelectedOptions);\n } else {\n newSelectedOptions = isAllChildrenSelected([option])\n ? unselect([option], newSelectedOptions)\n : select([option], newSelectedOptions);\n }\n\n fireNonCancelableEvent(onChange, {\n selectedOptions: newSelectedOptions,\n });\n },\n [onChange, selectedOptions, filteredOptions]\n );\n\n const rootRef = useRef<HTMLDivElement>(null);\n\n const selfControlId = useUniqueId('trigger');\n const controlId = formFieldContext.controlId ?? selfControlId;\n\n const multiSelectAriaLabelId = useUniqueId('multiselect-arialabel-');\n\n const footerId = useUniqueId('footer');\n\n const scrollToIndex = useRef<SelectListProps.SelectListRef>(null);\n const {\n isOpen,\n highlightType,\n highlightedOption,\n highlightedIndex,\n getTriggerProps,\n getDropdownProps,\n getFilterProps,\n getMenuProps,\n getOptionProps,\n highlightOption,\n announceSelected,\n } = useSelect({\n selectedOptions,\n updateSelectedOption,\n options: filteredOptions,\n filteringType,\n onFocus,\n onBlur,\n externalRef,\n keepOpen,\n fireLoadItems,\n setFilteringValue,\n useInteractiveGroups,\n statusType,\n });\n\n const handleNativeSearch = useNativeSearch({\n isEnabled: filteringType === 'none' && isOpen,\n options: filteredOptions,\n highlightOption: highlightOption,\n highlightedOption: highlightedOption?.option,\n useInteractiveGroups,\n });\n\n const isEmpty = !options || options.length === 0;\n const isNoMatch = filteredOptions && filteredOptions.length === 0;\n const isFiltered =\n filteringType !== 'none' && filteringValue.length > 0 && filteredOptions && filteredOptions.length > 0;\n const filteredText = isFiltered ? filteringResultsText?.(matchesCount, totalCount) : undefined;\n const dropdownStatus = useDropdownStatus({\n statusType,\n empty,\n loadingText,\n finishedText,\n errorText,\n recoveryText,\n isEmpty,\n isNoMatch,\n noMatch,\n isFiltered,\n filteringResultsText: filteredText,\n onRecoveryClick: handleRecoveryClick,\n errorIconAriaLabel: errorIconAriaLabel,\n hasRecoveryCallback: !!onLoadItems,\n });\n\n const filter = (\n <Filter\n clearAriaLabel={filteringClearAriaLabel}\n filteringType={filteringType}\n placeholder={filteringPlaceholder}\n ariaLabel={filteringAriaLabel}\n ariaRequired={ariaRequired}\n value={filteringValue}\n {...getFilterProps()}\n />\n );\n\n const trigger = (\n <Trigger\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n triggerProps={getTriggerProps(disabled, autoFocus)}\n selectedOption={null}\n selectedOptions={selectedOptions}\n triggerVariant={inlineTokens ? 'tokens' : 'placeholder'}\n isOpen={isOpen}\n {...formFieldContext}\n controlId={controlId}\n ariaLabelledby={joinStrings(formFieldContext.ariaLabelledby, multiSelectAriaLabelId)}\n />\n );\n\n const menuProps: MenuProps = {\n ...getMenuProps(),\n onLoadMore: handleLoadMore,\n ariaLabelledby: joinStrings(multiSelectAriaLabelId, controlId),\n ariaDescribedby: dropdownStatus.content ? footerId : undefined,\n };\n\n const announcement = useAnnouncement({\n announceSelected,\n highlightedOption,\n getParent: option => parentMap.get(option)?.option as undefined | OptionGroup,\n selectedAriaLabel,\n renderHighlightedAriaLive,\n });\n\n const tokens: TokenGroupProps['items'] = selectedOptions.map(option => ({\n label: option.label,\n disabled: disabled || option.disabled,\n labelTag: option.labelTag,\n description: option.description,\n iconAlt: option.iconAlt,\n iconName: option.iconName,\n iconUrl: option.iconUrl,\n iconSvg: option.iconSvg,\n tags: option.tags,\n dismissLabel: i18n('deselectAriaLabel', deselectAriaLabel?.(option), format =>\n format({ option__label: option.label ?? '' })\n ),\n }));\n\n useEffect(() => {\n scrollToIndex.current?.(highlightedIndex);\n }, [highlightedIndex]);\n\n const ListComponent = virtualScroll ? VirtualList : PlainList;\n\n const handleMouseDown = (event: React.MouseEvent) => {\n const target = event.target as HTMLElement;\n\n if (target !== document.activeElement) {\n // prevent currently focused element from losing it\n event.preventDefault();\n }\n };\n\n const showTokens = !hideTokens && !inlineTokens && tokens.length > 0;\n const handleTokenDismiss: TokenGroupProps['onDismiss'] = ({ detail }) => {\n const optionToDeselect = selectedOptions[detail.itemIndex];\n updateSelectedOption(optionToDeselect);\n const targetRef = getTriggerProps().ref;\n if (targetRef.current) {\n targetRef.current.focus();\n }\n };\n\n const tokenGroupI18nStrings: TokenGroupProps.I18nStrings = {\n limitShowFewer: i18nStrings?.tokenLimitShowFewer,\n limitShowMore: i18nStrings?.tokenLimitShowMore,\n };\n\n const mergedRef = useMergeRefs(rootRef, __internalRootRef);\n\n const dropdownProps = getDropdownProps();\n\n return (\n <div\n {...baseProps}\n ref={mergedRef}\n className={clsx(styles.root, baseProps.className)}\n onKeyPress={handleNativeSearch}\n >\n <Dropdown\n {...dropdownProps}\n ariaLabelledby={\n dropdownProps.dropdownContentRole ? joinStrings(multiSelectAriaLabelId, controlId) : undefined\n }\n ariaDescribedby={\n dropdownProps.dropdownContentRole ? (dropdownStatus.content ? footerId : undefined) : undefined\n }\n open={isOpen}\n trigger={trigger}\n header={filter}\n onMouseDown={handleMouseDown}\n footer={\n dropdownStatus.isSticky ? (\n <DropdownFooter content={isOpen ? dropdownStatus.content : null} id={footerId} />\n ) : null\n }\n expandToViewport={expandToViewport}\n stretchBeyondTriggerWidth={true}\n >\n <ListComponent\n listBottom={\n !dropdownStatus.isSticky ? (\n <DropdownFooter content={isOpen ? dropdownStatus.content : null} id={footerId} />\n ) : null\n }\n menuProps={menuProps}\n getOptionProps={getOptionProps}\n filteredOptions={filteredOptions}\n filteringValue={filteringValue}\n ref={scrollToIndex}\n hasDropdownStatus={dropdownStatus.content !== null}\n checkboxes={true}\n useInteractiveGroups={useInteractiveGroups}\n screenReaderContent={announcement}\n highlightType={highlightType}\n />\n </Dropdown>\n {showTokens && (\n <InternalTokenGroup\n className={styles.tokens}\n alignment=\"horizontal\"\n limit={tokenLimit}\n items={tokens}\n onDismiss={handleTokenDismiss}\n i18nStrings={tokenGroupI18nStrings}\n limitShowMoreAriaLabel={tokenLimitShowMoreAriaLabel}\n limitShowFewerAriaLabel={tokenLimitShowFewerAriaLabel}\n disableOuterPadding={true}\n readOnly={readOnly}\n />\n )}\n <ScreenreaderOnly id={multiSelectAriaLabelId}>{ariaLabel}</ScreenreaderOnly>\n </div>\n );\n }\n);\n\nexport default InternalMultiselect;\n"]}
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/multiselect/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\nimport React, { useState } from 'react';\nimport clsx from 'clsx';\n\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport Dropdown from '../internal/components/dropdown';\nimport DropdownFooter from '../internal/components/dropdown-footer/index.js';\nimport ScreenreaderOnly from '../internal/components/screenreader-only';\nimport { useFormFieldContext } from '../internal/context/form-field-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component/index.js';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { SomeRequired } from '../internal/types';\nimport { joinStrings } from '../internal/utils/strings';\nimport Filter from '../select/parts/filter';\nimport PlainList from '../select/parts/plain-list';\nimport Trigger from '../select/parts/trigger';\nimport VirtualList from '../select/parts/virtual-list';\nimport { TokenGroupProps } from '../token-group/interfaces';\nimport InternalTokenGroup from '../token-group/internal';\nimport { MultiselectProps } from './interfaces';\nimport { useMultiselect } from './use-multiselect';\n\nimport styles from './styles.css.js';\n\ntype InternalMultiselectProps = SomeRequired<\n MultiselectProps,\n 'options' | 'selectedOptions' | 'filteringType' | 'statusType' | 'keepOpen' | 'hideTokens'\n> &\n InternalBaseComponentProps & { inlineTokens?: boolean };\n\nconst InternalMultiselect = React.forwardRef(\n (\n {\n options,\n filteringType,\n filteringPlaceholder,\n filteringAriaLabel,\n filteringClearAriaLabel,\n ariaRequired,\n placeholder,\n disabled,\n readOnly,\n ariaLabel,\n selectedOptions,\n deselectAriaLabel,\n tokenLimit,\n i18nStrings,\n virtualScroll,\n inlineTokens = false,\n hideTokens,\n expandToViewport,\n tokenLimitShowFewerAriaLabel,\n tokenLimitShowMoreAriaLabel,\n __internalRootRef = null,\n autoFocus,\n ...restProps\n }: InternalMultiselectProps,\n externalRef: React.Ref<MultiselectProps.Ref>\n ) => {\n const baseProps = getBaseProps(restProps);\n const formFieldContext = useFormFieldContext(restProps);\n const i18n = useInternalI18n('multiselect');\n\n const selfControlId = useUniqueId('trigger');\n const controlId = formFieldContext.controlId ?? selfControlId;\n const ariaLabelId = useUniqueId('multiselect-arialabel-');\n const footerId = useUniqueId('footer');\n\n const [filteringValue, setFilteringValue] = useState('');\n const multiselectProps = useMultiselect({\n options,\n selectedOptions,\n filteringType,\n disabled,\n deselectAriaLabel,\n controlId,\n ariaLabelId,\n footerId,\n filteringValue,\n setFilteringValue,\n externalRef,\n ...restProps,\n });\n\n const filter = (\n <Filter\n clearAriaLabel={filteringClearAriaLabel}\n filteringType={filteringType}\n placeholder={filteringPlaceholder}\n ariaLabel={filteringAriaLabel}\n ariaRequired={ariaRequired}\n value={filteringValue}\n {...multiselectProps.getFilterProps()}\n />\n );\n\n const trigger = (\n <Trigger\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n triggerProps={multiselectProps.getTriggerProps(disabled, autoFocus)}\n selectedOption={null}\n selectedOptions={selectedOptions}\n triggerVariant={inlineTokens ? 'tokens' : 'placeholder'}\n isOpen={multiselectProps.isOpen}\n {...formFieldContext}\n controlId={controlId}\n ariaLabelledby={joinStrings(formFieldContext.ariaLabelledby, ariaLabelId)}\n />\n );\n\n const tokens: TokenGroupProps['items'] = selectedOptions.map(option => ({\n label: option.label,\n disabled: disabled || option.disabled,\n labelTag: option.labelTag,\n description: option.description,\n iconAlt: option.iconAlt,\n iconName: option.iconName,\n iconUrl: option.iconUrl,\n iconSvg: option.iconSvg,\n tags: option.tags,\n dismissLabel: i18n('deselectAriaLabel', deselectAriaLabel?.(option), format =>\n format({ option__label: option.label ?? '' })\n ),\n }));\n\n const ListComponent = virtualScroll ? VirtualList : PlainList;\n\n const showTokens = !hideTokens && !inlineTokens && tokens.length > 0;\n\n const tokenGroupI18nStrings: TokenGroupProps.I18nStrings = {\n limitShowFewer: i18nStrings?.tokenLimitShowFewer,\n limitShowMore: i18nStrings?.tokenLimitShowMore,\n };\n\n const dropdownStatus = multiselectProps.dropdownStatus;\n const dropdownProps = multiselectProps.getDropdownProps();\n\n return (\n <div\n {...baseProps}\n ref={__internalRootRef}\n className={clsx(styles.root, baseProps.className)}\n {...multiselectProps.getWrapperProps()}\n >\n <Dropdown\n {...dropdownProps}\n ariaLabelledby={dropdownProps.dropdownContentRole ? joinStrings(ariaLabelId, controlId) : undefined}\n ariaDescribedby={\n dropdownProps.dropdownContentRole ? (dropdownStatus.content ? footerId : undefined) : undefined\n }\n open={multiselectProps.isOpen}\n trigger={trigger}\n header={filter}\n footer={\n dropdownStatus.isSticky ? (\n <DropdownFooter content={multiselectProps.isOpen ? dropdownStatus.content : null} id={footerId} />\n ) : null\n }\n expandToViewport={expandToViewport}\n stretchBeyondTriggerWidth={true}\n >\n <ListComponent\n listBottom={\n !dropdownStatus.isSticky ? (\n <DropdownFooter content={multiselectProps.isOpen ? dropdownStatus.content : null} id={footerId} />\n ) : null\n }\n menuProps={multiselectProps.getMenuProps()}\n getOptionProps={multiselectProps.getOptionProps}\n filteredOptions={multiselectProps.filteredOptions}\n filteringValue={filteringValue}\n ref={multiselectProps.scrollToIndex}\n hasDropdownStatus={dropdownStatus.content !== null}\n checkboxes={true}\n useInteractiveGroups={true}\n screenReaderContent={multiselectProps.announcement}\n highlightType={multiselectProps.highlightType}\n />\n </Dropdown>\n\n {showTokens && (\n <InternalTokenGroup\n {...multiselectProps.getTokenProps()}\n className={styles.tokens}\n alignment=\"horizontal\"\n limit={tokenLimit}\n items={tokens}\n i18nStrings={tokenGroupI18nStrings}\n limitShowMoreAriaLabel={tokenLimitShowMoreAriaLabel}\n limitShowFewerAriaLabel={tokenLimitShowFewerAriaLabel}\n disableOuterPadding={true}\n readOnly={readOnly}\n />\n )}\n\n <ScreenreaderOnly id={ariaLabelId}>{ariaLabel}</ScreenreaderOnly>\n </div>\n );\n }\n);\n\nexport default InternalMultiselect;\n"]}
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { DropdownStatusProps } from '../internal/components/dropdown-status';
|
|
3
|
+
import { SomeRequired } from '../internal/types';
|
|
4
|
+
import { SelectListProps } from '../select/parts/plain-list';
|
|
5
|
+
import { TokenGroupProps } from '../token-group/interfaces';
|
|
6
|
+
import { MultiselectProps } from './interfaces';
|
|
7
|
+
type UseMultiselectOptions = SomeRequired<Pick<MultiselectProps, 'options' | 'selectedOptions' | 'filteringType' | 'filteringResultsText' | 'disabled' | 'noMatch' | 'renderHighlightedAriaLive' | 'deselectAriaLabel' | 'keepOpen' | 'onBlur' | 'onFocus' | 'onLoadItems' | 'onChange' | 'selectedAriaLabel'> & DropdownStatusProps & {
|
|
8
|
+
controlId: string;
|
|
9
|
+
ariaLabelId: string;
|
|
10
|
+
footerId: string;
|
|
11
|
+
filteringValue: string;
|
|
12
|
+
setFilteringValue: (value: string) => void;
|
|
13
|
+
externalRef: React.Ref<MultiselectProps.Ref>;
|
|
14
|
+
}, 'options' | 'selectedOptions' | 'filteringType' | 'statusType' | 'keepOpen'>;
|
|
15
|
+
export declare function useMultiselect({ options, filteringType, filteringResultsText, disabled, statusType, empty, loadingText, finishedText, errorText, noMatch, renderHighlightedAriaLive, selectedOptions, deselectAriaLabel, keepOpen, onBlur, onFocus, onLoadItems, onChange, controlId, ariaLabelId, footerId, filteringValue, setFilteringValue, externalRef, ...restProps }: UseMultiselectOptions): {
|
|
16
|
+
isOpen: boolean;
|
|
17
|
+
tokens: readonly TokenGroupProps.Item[];
|
|
18
|
+
announcement: string;
|
|
19
|
+
dropdownStatus: import("../internal/components/dropdown-status").DropdownStatusResult;
|
|
20
|
+
filteringValue: string;
|
|
21
|
+
filteredOptions: readonly import("../internal/components/option/interfaces").DropdownOption[];
|
|
22
|
+
highlightType: import("../internal/components/options-list/utils/use-highlight-option").HighlightType;
|
|
23
|
+
scrollToIndex: React.RefObject<SelectListProps.SelectListRef>;
|
|
24
|
+
getFilterProps: () => Partial<import("../select/parts/filter").FilterProps>;
|
|
25
|
+
getTriggerProps: (disabled?: boolean, autoFocus?: boolean) => import("../select/utils/use-select").SelectTriggerProps;
|
|
26
|
+
getMenuProps: () => {
|
|
27
|
+
onLoadMore: () => void;
|
|
28
|
+
ariaLabelledby: string | undefined;
|
|
29
|
+
ariaDescribedby: string | undefined;
|
|
30
|
+
open?: boolean | undefined;
|
|
31
|
+
position?: import("csstype").Property.Position | undefined;
|
|
32
|
+
className?: string | undefined;
|
|
33
|
+
id?: string | undefined;
|
|
34
|
+
role?: "listbox" | "menu" | "list" | undefined;
|
|
35
|
+
onFocus?: import("../internal/events").NonCancelableEventHandler<{}> | undefined;
|
|
36
|
+
onBlur?: import("../internal/events").NonCancelableEventHandler<{
|
|
37
|
+
relatedTarget: Node | null;
|
|
38
|
+
}> | undefined;
|
|
39
|
+
onKeyDown?: import("../internal/events").CancelableEventHandler<import("../internal/events").BaseKeyDetail> | undefined;
|
|
40
|
+
onMouseMove?: ((itemIndex: number) => void) | undefined;
|
|
41
|
+
onMouseUp?: ((itemIndex: number) => void) | undefined;
|
|
42
|
+
ariaLabel?: string | undefined;
|
|
43
|
+
statusType: DropdownStatusProps.StatusType;
|
|
44
|
+
nativeAttributes?: Record<string, any> | undefined;
|
|
45
|
+
decreaseBlockMargin?: boolean | undefined;
|
|
46
|
+
ref: React.RefObject<HTMLUListElement>;
|
|
47
|
+
};
|
|
48
|
+
getOptionProps: (option: import("../internal/components/option/interfaces").DropdownOption, index: number) => any;
|
|
49
|
+
getTokenProps: () => {
|
|
50
|
+
onDismiss: import("../internal/events").NonCancelableEventHandler<TokenGroupProps.DismissDetail>;
|
|
51
|
+
};
|
|
52
|
+
getDropdownProps: () => {
|
|
53
|
+
onMouseDown: (event: React.MouseEvent) => void;
|
|
54
|
+
onFocus?: import("../internal/events").NonCancelableEventHandler<Pick<React.FocusEvent<Element, Element>, "target" | "relatedTarget">> | undefined;
|
|
55
|
+
onBlur?: import("../internal/events").NonCancelableEventHandler<Pick<React.FocusEvent<Element, Element>, "target" | "relatedTarget">> | undefined;
|
|
56
|
+
dropdownContentId?: string | undefined;
|
|
57
|
+
dropdownContentRole?: string | undefined;
|
|
58
|
+
};
|
|
59
|
+
getWrapperProps: () => {
|
|
60
|
+
onKeyDown: (event: React.KeyboardEvent<Element>) => void;
|
|
61
|
+
};
|
|
62
|
+
};
|
|
63
|
+
export {};
|
|
64
|
+
//# sourceMappingURL=use-multiselect.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-multiselect.d.ts","sourceRoot":"","sources":["../../../src/multiselect/use-multiselect.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAK9D,OAAO,EAAE,mBAAmB,EAAqB,MAAM,wCAAwC,CAAC;AAKhG,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAO7D,OAAO,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAEhD,KAAK,qBAAqB,GAAG,YAAY,CACvC,IAAI,CACF,gBAAgB,EACd,SAAS,GACT,iBAAiB,GACjB,eAAe,GACf,sBAAsB,GACtB,UAAU,GACV,SAAS,GACT,2BAA2B,GAC3B,mBAAmB,GACnB,UAAU,GACV,QAAQ,GACR,SAAS,GACT,aAAa,GACb,UAAU,GACV,mBAAmB,CACtB,GACC,mBAAmB,GAAG;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,MAAM,CAAC;IACjB,cAAc,EAAE,MAAM,CAAC;IACvB,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,WAAW,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC;CAC9C,EACH,SAAS,GAAG,iBAAiB,GAAG,eAAe,GAAG,YAAY,GAAG,UAAU,CAC5E,CAAC;AAEF,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,aAAa,EACb,oBAAoB,EACpB,QAAQ,EACR,UAAU,EACV,KAAK,EACL,WAAW,EACX,YAAY,EACZ,SAAS,EACT,OAAO,EACP,yBAAyB,EACzB,eAAe,EACf,iBAAiB,EACjB,QAAQ,EACR,MAAM,EACN,OAAO,EACP,WAAW,EACX,QAAQ,EACR,SAAS,EACT,WAAW,EACX,QAAQ,EACR,cAAc,EACd,iBAAiB,EACjB,WAAW,EACX,GAAG,SAAS,EACb,EAAE,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BAoJc,gBAAgB;;;;;;;;;EAwCrD"}
|
|
@@ -0,0 +1,163 @@
|
|
|
1
|
+
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
+
import { __rest } from "tslib";
|
|
4
|
+
import { useCallback, useEffect, useRef } from 'react';
|
|
5
|
+
import { warnOnce } from '@cloudscape-design/component-toolkit/internal';
|
|
6
|
+
import { useInternalI18n } from '../i18n/context';
|
|
7
|
+
import { useDropdownStatus } from '../internal/components/dropdown-status';
|
|
8
|
+
import { isGroup } from '../internal/components/option/utils/filter-options';
|
|
9
|
+
import { prepareOptions } from '../internal/components/option/utils/prepare-options';
|
|
10
|
+
import { fireNonCancelableEvent } from '../internal/events';
|
|
11
|
+
import { joinStrings } from '../internal/utils/strings';
|
|
12
|
+
import { checkOptionValueField } from '../select/utils/check-option-value-field.js';
|
|
13
|
+
import { findOptionIndex } from '../select/utils/connect-options';
|
|
14
|
+
import { useAnnouncement } from '../select/utils/use-announcement';
|
|
15
|
+
import { useLoadItems } from '../select/utils/use-load-items';
|
|
16
|
+
import { useNativeSearch } from '../select/utils/use-native-search';
|
|
17
|
+
import { useSelect } from '../select/utils/use-select';
|
|
18
|
+
export function useMultiselect(_a) {
|
|
19
|
+
var { options, filteringType, filteringResultsText, disabled, statusType, empty, loadingText, finishedText, errorText, noMatch, renderHighlightedAriaLive, selectedOptions, deselectAriaLabel, keepOpen, onBlur, onFocus, onLoadItems, onChange, controlId, ariaLabelId, footerId, filteringValue, setFilteringValue, externalRef } = _a, restProps = __rest(_a, ["options", "filteringType", "filteringResultsText", "disabled", "statusType", "empty", "loadingText", "finishedText", "errorText", "noMatch", "renderHighlightedAriaLive", "selectedOptions", "deselectAriaLabel", "keepOpen", "onBlur", "onFocus", "onLoadItems", "onChange", "controlId", "ariaLabelId", "footerId", "filteringValue", "setFilteringValue", "externalRef"]);
|
|
20
|
+
checkOptionValueField('Multiselect', 'options', options);
|
|
21
|
+
const i18n = useInternalI18n('multiselect');
|
|
22
|
+
const i18nCommon = useInternalI18n('select');
|
|
23
|
+
const recoveryText = i18nCommon('recoveryText', restProps.recoveryText);
|
|
24
|
+
const errorIconAriaLabel = i18nCommon('errorIconAriaLabel', restProps.errorIconAriaLabel);
|
|
25
|
+
const selectedAriaLabel = i18nCommon('selectedAriaLabel', restProps.selectedAriaLabel);
|
|
26
|
+
if (restProps.recoveryText && !onLoadItems) {
|
|
27
|
+
warnOnce('Multiselect', '`onLoadItems` must be provided for `recoveryText` to be displayed.');
|
|
28
|
+
}
|
|
29
|
+
const { handleLoadMore, handleRecoveryClick, fireLoadItems } = useLoadItems({
|
|
30
|
+
onLoadItems,
|
|
31
|
+
options,
|
|
32
|
+
statusType,
|
|
33
|
+
});
|
|
34
|
+
const useInteractiveGroups = true;
|
|
35
|
+
const { filteredOptions, parentMap, totalCount, matchesCount } = prepareOptions(options, filteringType, filteringValue);
|
|
36
|
+
const updateSelectedOption = useCallback((option) => {
|
|
37
|
+
const filtered = filteredOptions.filter(item => item.type !== 'parent').map(item => item.option);
|
|
38
|
+
// switch between selection and deselection behavior, ignores disabled options to prevent
|
|
39
|
+
// getting stuck on one behavior when an option is disabled and its state cannot be changed
|
|
40
|
+
const isAllChildrenSelected = (optionsArray) => optionsArray.every(item => findOptionIndex(selectedOptions, item) > -1 || item.disabled);
|
|
41
|
+
const intersection = (visibleOptions, options) => visibleOptions.filter(item => findOptionIndex(options, item) > -1 && !item.disabled);
|
|
42
|
+
const union = (visibleOptions, options) => visibleOptions.filter(item => findOptionIndex(options, item) === -1).concat(options);
|
|
43
|
+
const select = (options, selectedOptions) => {
|
|
44
|
+
return union(selectedOptions, options);
|
|
45
|
+
};
|
|
46
|
+
const unselect = (options, selectedOptions) => {
|
|
47
|
+
return selectedOptions.filter(option => findOptionIndex(options, option) === -1);
|
|
48
|
+
};
|
|
49
|
+
let newSelectedOptions = [...selectedOptions];
|
|
50
|
+
if (isGroup(option)) {
|
|
51
|
+
const visibleOptions = intersection([...option.options], filtered);
|
|
52
|
+
newSelectedOptions = isAllChildrenSelected(visibleOptions)
|
|
53
|
+
? unselect(visibleOptions, newSelectedOptions)
|
|
54
|
+
: select(visibleOptions, newSelectedOptions);
|
|
55
|
+
}
|
|
56
|
+
else {
|
|
57
|
+
newSelectedOptions = isAllChildrenSelected([option])
|
|
58
|
+
? unselect([option], newSelectedOptions)
|
|
59
|
+
: select([option], newSelectedOptions);
|
|
60
|
+
}
|
|
61
|
+
fireNonCancelableEvent(onChange, {
|
|
62
|
+
selectedOptions: newSelectedOptions,
|
|
63
|
+
});
|
|
64
|
+
}, [onChange, selectedOptions, filteredOptions]);
|
|
65
|
+
const scrollToIndex = useRef(null);
|
|
66
|
+
const { isOpen, highlightType, highlightedOption, highlightedIndex, getTriggerProps, getDropdownProps, getFilterProps, getMenuProps, getOptionProps, highlightOption, announceSelected, } = useSelect({
|
|
67
|
+
selectedOptions,
|
|
68
|
+
updateSelectedOption,
|
|
69
|
+
options: filteredOptions,
|
|
70
|
+
filteringType,
|
|
71
|
+
onFocus,
|
|
72
|
+
onBlur,
|
|
73
|
+
externalRef,
|
|
74
|
+
keepOpen,
|
|
75
|
+
fireLoadItems,
|
|
76
|
+
setFilteringValue,
|
|
77
|
+
useInteractiveGroups,
|
|
78
|
+
statusType,
|
|
79
|
+
});
|
|
80
|
+
const wrapperOnKeyDown = useNativeSearch({
|
|
81
|
+
isEnabled: filteringType === 'none' && isOpen,
|
|
82
|
+
options: filteredOptions,
|
|
83
|
+
highlightOption: highlightOption,
|
|
84
|
+
highlightedOption: highlightedOption === null || highlightedOption === void 0 ? void 0 : highlightedOption.option,
|
|
85
|
+
useInteractiveGroups,
|
|
86
|
+
});
|
|
87
|
+
const isEmpty = !options || options.length === 0;
|
|
88
|
+
const isNoMatch = filteredOptions && filteredOptions.length === 0;
|
|
89
|
+
const isFiltered = filteringType !== 'none' && filteringValue.length > 0 && filteredOptions && filteredOptions.length > 0;
|
|
90
|
+
const filteredText = isFiltered ? filteringResultsText === null || filteringResultsText === void 0 ? void 0 : filteringResultsText(matchesCount, totalCount) : undefined;
|
|
91
|
+
const dropdownStatus = useDropdownStatus({
|
|
92
|
+
statusType,
|
|
93
|
+
empty,
|
|
94
|
+
loadingText,
|
|
95
|
+
finishedText,
|
|
96
|
+
errorText,
|
|
97
|
+
recoveryText,
|
|
98
|
+
isEmpty,
|
|
99
|
+
isNoMatch,
|
|
100
|
+
noMatch,
|
|
101
|
+
isFiltered,
|
|
102
|
+
filteringResultsText: filteredText,
|
|
103
|
+
onRecoveryClick: handleRecoveryClick,
|
|
104
|
+
errorIconAriaLabel: errorIconAriaLabel,
|
|
105
|
+
hasRecoveryCallback: !!onLoadItems,
|
|
106
|
+
});
|
|
107
|
+
const announcement = useAnnouncement({
|
|
108
|
+
announceSelected,
|
|
109
|
+
highlightedOption,
|
|
110
|
+
getParent: option => { var _a; return (_a = parentMap.get(option)) === null || _a === void 0 ? void 0 : _a.option; },
|
|
111
|
+
selectedAriaLabel,
|
|
112
|
+
renderHighlightedAriaLive,
|
|
113
|
+
});
|
|
114
|
+
const tokens = selectedOptions.map(option => ({
|
|
115
|
+
label: option.label,
|
|
116
|
+
disabled: disabled || option.disabled,
|
|
117
|
+
labelTag: option.labelTag,
|
|
118
|
+
description: option.description,
|
|
119
|
+
iconAlt: option.iconAlt,
|
|
120
|
+
iconName: option.iconName,
|
|
121
|
+
iconUrl: option.iconUrl,
|
|
122
|
+
iconSvg: option.iconSvg,
|
|
123
|
+
tags: option.tags,
|
|
124
|
+
dismissLabel: i18n('deselectAriaLabel', deselectAriaLabel === null || deselectAriaLabel === void 0 ? void 0 : deselectAriaLabel(option), format => { var _a; return format({ option__label: (_a = option.label) !== null && _a !== void 0 ? _a : '' }); }),
|
|
125
|
+
}));
|
|
126
|
+
useEffect(() => {
|
|
127
|
+
var _a;
|
|
128
|
+
(_a = scrollToIndex.current) === null || _a === void 0 ? void 0 : _a.call(scrollToIndex, highlightedIndex);
|
|
129
|
+
}, [highlightedIndex]);
|
|
130
|
+
const dropdownOnMouseDown = (event) => {
|
|
131
|
+
const target = event.target;
|
|
132
|
+
if (target !== document.activeElement) {
|
|
133
|
+
// prevent currently focused element from losing it
|
|
134
|
+
event.preventDefault();
|
|
135
|
+
}
|
|
136
|
+
};
|
|
137
|
+
const tokenOnDismiss = ({ detail }) => {
|
|
138
|
+
const optionToDeselect = selectedOptions[detail.itemIndex];
|
|
139
|
+
updateSelectedOption(optionToDeselect);
|
|
140
|
+
const targetRef = getTriggerProps().ref;
|
|
141
|
+
if (targetRef.current) {
|
|
142
|
+
targetRef.current.focus();
|
|
143
|
+
}
|
|
144
|
+
};
|
|
145
|
+
return {
|
|
146
|
+
isOpen,
|
|
147
|
+
tokens,
|
|
148
|
+
announcement,
|
|
149
|
+
dropdownStatus,
|
|
150
|
+
filteringValue,
|
|
151
|
+
filteredOptions,
|
|
152
|
+
highlightType,
|
|
153
|
+
scrollToIndex,
|
|
154
|
+
getFilterProps,
|
|
155
|
+
getTriggerProps,
|
|
156
|
+
getMenuProps: () => (Object.assign(Object.assign({}, getMenuProps()), { onLoadMore: handleLoadMore, ariaLabelledby: joinStrings(ariaLabelId, controlId), ariaDescribedby: dropdownStatus.content ? footerId : undefined })),
|
|
157
|
+
getOptionProps,
|
|
158
|
+
getTokenProps: () => ({ onDismiss: tokenOnDismiss }),
|
|
159
|
+
getDropdownProps: () => (Object.assign(Object.assign({}, getDropdownProps()), { onMouseDown: dropdownOnMouseDown })),
|
|
160
|
+
getWrapperProps: () => ({ onKeyDown: wrapperOnKeyDown }),
|
|
161
|
+
};
|
|
162
|
+
}
|
|
163
|
+
//# sourceMappingURL=use-multiselect.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-multiselect.js","sourceRoot":"","sources":["../../../src/multiselect/use-multiselect.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, { useCallback, useEffect, useRef } from 'react';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useInternalI18n } from '../i18n/context';\nimport { DropdownStatusProps, useDropdownStatus } from '../internal/components/dropdown-status';\nimport { OptionDefinition, OptionGroup } from '../internal/components/option/interfaces';\nimport { isGroup } from '../internal/components/option/utils/filter-options';\nimport { prepareOptions } from '../internal/components/option/utils/prepare-options';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { SomeRequired } from '../internal/types';\nimport { joinStrings } from '../internal/utils/strings';\nimport { SelectListProps } from '../select/parts/plain-list';\nimport { checkOptionValueField } from '../select/utils/check-option-value-field.js';\nimport { findOptionIndex } from '../select/utils/connect-options';\nimport { useAnnouncement } from '../select/utils/use-announcement';\nimport { useLoadItems } from '../select/utils/use-load-items';\nimport { useNativeSearch } from '../select/utils/use-native-search';\nimport { useSelect } from '../select/utils/use-select';\nimport { TokenGroupProps } from '../token-group/interfaces';\nimport { MultiselectProps } from './interfaces';\n\ntype UseMultiselectOptions = SomeRequired<\n Pick<\n MultiselectProps,\n | 'options'\n | 'selectedOptions'\n | 'filteringType'\n | 'filteringResultsText'\n | 'disabled'\n | 'noMatch'\n | 'renderHighlightedAriaLive'\n | 'deselectAriaLabel'\n | 'keepOpen'\n | 'onBlur'\n | 'onFocus'\n | 'onLoadItems'\n | 'onChange'\n | 'selectedAriaLabel'\n > &\n DropdownStatusProps & {\n controlId: string;\n ariaLabelId: string;\n footerId: string;\n filteringValue: string;\n setFilteringValue: (value: string) => void;\n externalRef: React.Ref<MultiselectProps.Ref>;\n },\n 'options' | 'selectedOptions' | 'filteringType' | 'statusType' | 'keepOpen'\n>;\n\nexport function useMultiselect({\n options,\n filteringType,\n filteringResultsText,\n disabled,\n statusType,\n empty,\n loadingText,\n finishedText,\n errorText,\n noMatch,\n renderHighlightedAriaLive,\n selectedOptions,\n deselectAriaLabel,\n keepOpen,\n onBlur,\n onFocus,\n onLoadItems,\n onChange,\n controlId,\n ariaLabelId,\n footerId,\n filteringValue,\n setFilteringValue,\n externalRef,\n ...restProps\n}: UseMultiselectOptions) {\n checkOptionValueField('Multiselect', 'options', options);\n\n const i18n = useInternalI18n('multiselect');\n const i18nCommon = useInternalI18n('select');\n const recoveryText = i18nCommon('recoveryText', restProps.recoveryText);\n const errorIconAriaLabel = i18nCommon('errorIconAriaLabel', restProps.errorIconAriaLabel);\n const selectedAriaLabel = i18nCommon('selectedAriaLabel', restProps.selectedAriaLabel);\n\n if (restProps.recoveryText && !onLoadItems) {\n warnOnce('Multiselect', '`onLoadItems` must be provided for `recoveryText` to be displayed.');\n }\n\n const { handleLoadMore, handleRecoveryClick, fireLoadItems } = useLoadItems({\n onLoadItems,\n options,\n statusType,\n });\n const useInteractiveGroups = true;\n const { filteredOptions, parentMap, totalCount, matchesCount } = prepareOptions(\n options,\n filteringType,\n filteringValue\n );\n\n const updateSelectedOption = useCallback(\n (option: OptionDefinition | OptionGroup) => {\n const filtered = filteredOptions.filter(item => item.type !== 'parent').map(item => item.option);\n\n // switch between selection and deselection behavior, ignores disabled options to prevent\n // getting stuck on one behavior when an option is disabled and its state cannot be changed\n const isAllChildrenSelected = (optionsArray: OptionDefinition[]) =>\n optionsArray.every(item => findOptionIndex(selectedOptions, item) > -1 || item.disabled);\n const intersection = (visibleOptions: OptionDefinition[], options: OptionDefinition[]) =>\n visibleOptions.filter(item => findOptionIndex(options, item) > -1 && !item.disabled);\n const union = (visibleOptions: OptionDefinition[], options: OptionDefinition[]) =>\n visibleOptions.filter(item => findOptionIndex(options, item) === -1).concat(options);\n const select = (options: OptionDefinition[], selectedOptions: OptionDefinition[]) => {\n return union(selectedOptions, options);\n };\n const unselect = (options: OptionDefinition[], selectedOptions: OptionDefinition[]) => {\n return selectedOptions.filter(option => findOptionIndex(options, option) === -1);\n };\n let newSelectedOptions = [...selectedOptions];\n\n if (isGroup(option)) {\n const visibleOptions = intersection([...option.options], filtered);\n newSelectedOptions = isAllChildrenSelected(visibleOptions)\n ? unselect(visibleOptions, newSelectedOptions)\n : select(visibleOptions, newSelectedOptions);\n } else {\n newSelectedOptions = isAllChildrenSelected([option])\n ? unselect([option], newSelectedOptions)\n : select([option], newSelectedOptions);\n }\n\n fireNonCancelableEvent(onChange, {\n selectedOptions: newSelectedOptions,\n });\n },\n [onChange, selectedOptions, filteredOptions]\n );\n\n const scrollToIndex = useRef<SelectListProps.SelectListRef>(null);\n const {\n isOpen,\n highlightType,\n highlightedOption,\n highlightedIndex,\n getTriggerProps,\n getDropdownProps,\n getFilterProps,\n getMenuProps,\n getOptionProps,\n highlightOption,\n announceSelected,\n } = useSelect({\n selectedOptions,\n updateSelectedOption,\n options: filteredOptions,\n filteringType,\n onFocus,\n onBlur,\n externalRef,\n keepOpen,\n fireLoadItems,\n setFilteringValue,\n useInteractiveGroups,\n statusType,\n });\n\n const wrapperOnKeyDown = useNativeSearch({\n isEnabled: filteringType === 'none' && isOpen,\n options: filteredOptions,\n highlightOption: highlightOption,\n highlightedOption: highlightedOption?.option,\n useInteractiveGroups,\n });\n\n const isEmpty = !options || options.length === 0;\n const isNoMatch = filteredOptions && filteredOptions.length === 0;\n const isFiltered =\n filteringType !== 'none' && filteringValue.length > 0 && filteredOptions && filteredOptions.length > 0;\n const filteredText = isFiltered ? filteringResultsText?.(matchesCount, totalCount) : undefined;\n const dropdownStatus = useDropdownStatus({\n statusType,\n empty,\n loadingText,\n finishedText,\n errorText,\n recoveryText,\n isEmpty,\n isNoMatch,\n noMatch,\n isFiltered,\n filteringResultsText: filteredText,\n onRecoveryClick: handleRecoveryClick,\n errorIconAriaLabel: errorIconAriaLabel,\n hasRecoveryCallback: !!onLoadItems,\n });\n\n const announcement = useAnnouncement({\n announceSelected,\n highlightedOption,\n getParent: option => parentMap.get(option)?.option as undefined | OptionGroup,\n selectedAriaLabel,\n renderHighlightedAriaLive,\n });\n\n const tokens: TokenGroupProps['items'] = selectedOptions.map(option => ({\n label: option.label,\n disabled: disabled || option.disabled,\n labelTag: option.labelTag,\n description: option.description,\n iconAlt: option.iconAlt,\n iconName: option.iconName,\n iconUrl: option.iconUrl,\n iconSvg: option.iconSvg,\n tags: option.tags,\n dismissLabel: i18n('deselectAriaLabel', deselectAriaLabel?.(option), format =>\n format({ option__label: option.label ?? '' })\n ),\n }));\n\n useEffect(() => {\n scrollToIndex.current?.(highlightedIndex);\n }, [highlightedIndex]);\n\n const dropdownOnMouseDown = (event: React.MouseEvent) => {\n const target = event.target as HTMLElement;\n\n if (target !== document.activeElement) {\n // prevent currently focused element from losing it\n event.preventDefault();\n }\n };\n\n const tokenOnDismiss: TokenGroupProps['onDismiss'] = ({ detail }) => {\n const optionToDeselect = selectedOptions[detail.itemIndex];\n updateSelectedOption(optionToDeselect);\n const targetRef = getTriggerProps().ref;\n if (targetRef.current) {\n targetRef.current.focus();\n }\n };\n\n return {\n isOpen,\n tokens,\n announcement,\n dropdownStatus,\n filteringValue,\n filteredOptions,\n highlightType,\n scrollToIndex,\n getFilterProps,\n getTriggerProps,\n getMenuProps: () => ({\n ...getMenuProps(),\n onLoadMore: handleLoadMore,\n ariaLabelledby: joinStrings(ariaLabelId, controlId),\n ariaDescribedby: dropdownStatus.content ? footerId : undefined,\n }),\n getOptionProps,\n getTokenProps: () => ({ onDismiss: tokenOnDismiss }),\n getDropdownProps: () => ({ ...getDropdownProps(), onMouseDown: dropdownOnMouseDown }),\n getWrapperProps: () => ({ onKeyDown: wrapperOnKeyDown }),\n };\n}\n"]}
|
package/package.json
CHANGED