@cloudscape-design/components-themeable 3.0.960 → 3.0.961
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/internal/manifest.json +1 -1
- package/lib/internal/scss/key-value-pairs/styles.scss +1 -0
- package/lib/internal/template/button-dropdown/internal.js +1 -1
- package/lib/internal/template/button-dropdown/internal.js.map +1 -1
- package/lib/internal/template/internal/environment.js +1 -1
- package/lib/internal/template/internal/environment.json +1 -1
- package/lib/internal/template/internal/hooks/use-performance-marks/index.d.ts.map +1 -1
- package/lib/internal/template/internal/hooks/use-performance-marks/index.js +15 -6
- package/lib/internal/template/internal/hooks/use-performance-marks/index.js.map +1 -1
- package/lib/internal/template/internal/hooks/use-performance-marks/is-in-viewport.d.ts +9 -0
- package/lib/internal/template/internal/hooks/use-performance-marks/is-in-viewport.d.ts.map +1 -0
- package/lib/internal/template/internal/hooks/use-performance-marks/is-in-viewport.js +48 -0
- package/lib/internal/template/internal/hooks/use-performance-marks/is-in-viewport.js.map +1 -0
- package/lib/internal/template/key-value-pairs/interfaces.d.ts +1 -1
- package/lib/internal/template/key-value-pairs/interfaces.d.ts.map +1 -1
- package/lib/internal/template/key-value-pairs/interfaces.js.map +1 -1
- package/lib/internal/template/key-value-pairs/styles.css.js +8 -8
- package/lib/internal/template/key-value-pairs/styles.scoped.css +10 -9
- package/lib/internal/template/key-value-pairs/styles.selectors.js +8 -8
- package/lib/internal/template/multiselect/index.d.ts.map +1 -1
- package/lib/internal/template/multiselect/index.js +1 -0
- package/lib/internal/template/multiselect/index.js.map +1 -1
- package/lib/internal/template/multiselect/internal.d.ts.map +1 -1
- package/lib/internal/template/multiselect/internal.js +2 -1
- package/lib/internal/template/multiselect/internal.js.map +1 -1
- package/package.json +1 -1
|
@@ -135,7 +135,7 @@ const InternalButtonDropdown = React.forwardRef((_a, ref) => {
|
|
|
135
135
|
else if (isMainAction) {
|
|
136
136
|
const { text, iconName, iconAlt, iconSvg, iconUrl, external, externalIconAriaLabel } = mainAction, mainActionProps = __rest(mainAction, ["text", "iconName", "iconAlt", "iconSvg", "iconUrl", "external", "externalIconAriaLabel"]);
|
|
137
137
|
const mainActionIconProps = external
|
|
138
|
-
? { iconName: 'external', iconAlign: 'right' }
|
|
138
|
+
? { iconName: 'external', iconAlign: 'right', target: '_blank', rel: 'noopener noreferrer' }
|
|
139
139
|
: { iconName, iconAlt, iconSvg, iconUrl };
|
|
140
140
|
const mainActionAriaLabel = externalIconAriaLabel
|
|
141
141
|
? `${(_b = mainAction.ariaLabel) !== null && _b !== void 0 ? _b : mainAction.text} ${mainAction.externalIconAriaLabel}`
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/button-dropdown/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, useImperativeHandle, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalBox from '../box/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton, InternalButtonProps } from '../button/internal';\nimport { useFunnel } from '../internal/analytics/hooks/use-funnel.js';\nimport { getBaseProps } from '../internal/base-component';\nimport Dropdown from '../internal/components/dropdown';\nimport OptionsList from '../internal/components/options-list';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode/index.js';\nimport { isDevelopment } from '../internal/is-development';\nimport { spinWhenOpen } from '../internal/styles/motion/utils';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport { GeneratedAnalyticsMetadataButtonDropdownExpand } from './analytics-metadata/interfaces.js';\nimport { ButtonDropdownProps, InternalButtonDropdownProps } from './interfaces';\nimport ItemsList from './items-list';\nimport { useButtonDropdown } from './utils/use-button-dropdown';\nimport { isLinkItem } from './utils/utils.js';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nconst InternalButtonDropdown = React.forwardRef(\n (\n {\n items,\n variant = 'normal',\n loading = false,\n loadingText,\n disabled = false,\n disabledReason,\n expandableGroups = false,\n children,\n onItemClick,\n onItemFollow,\n customTriggerBuilder,\n expandToViewport,\n ariaLabel,\n title,\n description,\n preferCenter,\n mainAction,\n showMainActionOnly,\n __internalRootRef,\n analyticsMetadataTransformer,\n linkStyle,\n fullWidth,\n ...props\n }: InternalButtonDropdownProps,\n ref: React.Ref<ButtonDropdownProps.Ref>\n ) => {\n const isInRestrictedView = useMobile();\n const dropdownId = useUniqueId('dropdown');\n for (const item of items) {\n if (isLinkItem(item)) {\n checkSafeUrl('ButtonDropdown', item.href);\n }\n }\n if (mainAction) {\n checkSafeUrl('ButtonDropdown', mainAction.href);\n }\n\n if (isDevelopment) {\n if (mainAction && variant !== 'primary' && variant !== 'normal') {\n warnOnce('ButtonDropdown', 'Main action is only supported for \"primary\" and \"normal\" component variant.');\n }\n }\n const isMainAction = mainAction && (variant === 'primary' || variant === 'normal');\n const isVisualRefresh = useVisualRefresh();\n\n const {\n isOpen,\n targetItem,\n isHighlighted,\n isKeyboardHighlight,\n isExpanded,\n highlightItem,\n onKeyDown,\n onKeyUp,\n onItemActivate,\n onGroupToggle,\n toggleDropdown,\n closeDropdown,\n setIsUsingMouse,\n } = useButtonDropdown({\n items,\n onItemClick,\n onItemFollow,\n // Scroll is unnecessary when moving focus back to the dropdown trigger.\n onReturnFocus: () => triggerRef.current?.focus({ preventScroll: true }),\n expandToViewport,\n hasExpandableGroups: expandableGroups,\n isInRestrictedView,\n });\n\n const handleMouseEvent = () => {\n setIsUsingMouse(true);\n };\n\n const baseProps = getBaseProps(props);\n\n const mainActionRef = useRef<HTMLElement>(null);\n const triggerRef = useRef<HTMLElement>(null);\n\n useImperativeHandle(\n ref,\n () => ({\n focus(...args) {\n (isMainAction ? mainActionRef : triggerRef).current?.focus(...args);\n },\n focusDropdownTrigger(...args) {\n triggerRef.current?.focus(...args);\n },\n }),\n [mainActionRef, triggerRef, isMainAction]\n );\n\n const clickHandler = () => {\n if (!loading && !disabled) {\n // Prevent moving highlight on mobiles to avoid disabled state reason popup if defined.\n toggleDropdown({ moveHighlightOnOpen: !isInRestrictedView });\n }\n };\n\n const canBeOpened = !loading && !disabled;\n\n const canBeFullWidth = !!fullWidth && (variant === 'primary' || variant === 'normal');\n\n const triggerVariant = variant === 'navigation' ? undefined : variant === 'inline-icon' ? 'inline-icon' : variant;\n const iconProps: Partial<ButtonProps & { __iconClass?: string }> =\n variant === 'icon' || variant === 'inline-icon'\n ? {\n iconName: 'ellipsis',\n }\n : {\n iconName: 'caret-down-filled',\n iconAlign: 'right',\n __iconClass: spinWhenOpen(styles, 'rotate', canBeOpened && isOpen),\n };\n\n const baseTriggerProps: InternalButtonProps = {\n className: clsx(\n styles['trigger-button'],\n styles['test-utils-button-trigger'],\n analyticsSelectors['trigger-label']\n ),\n ...iconProps,\n variant: triggerVariant,\n loading,\n loadingText,\n disabled,\n disabledReason,\n onClick: (event: Event) => {\n event.preventDefault();\n clickHandler();\n },\n ariaLabel,\n ariaExpanded: canBeOpened && isOpen,\n formAction: 'none',\n __nativeAttributes: {\n 'aria-haspopup': true,\n },\n };\n\n const triggerId = useUniqueId('awsui-button-dropdown__trigger');\n\n const triggerHasBadge = () => {\n const flatItems = items.flatMap(item => {\n if ('items' in item) {\n return item.items;\n }\n return item;\n });\n\n return (\n variant === 'icon' &&\n !!flatItems?.find(item => {\n if ('badge' in item) {\n return item.badge;\n }\n })\n );\n };\n\n let trigger: React.ReactNode = null;\n\n const analyticsMetadata: GeneratedAnalyticsMetadataButtonDropdownExpand | Record<string, never> = disabled\n ? {}\n : {\n action: 'expand',\n detail: {\n expanded: `${!isOpen}`,\n label: `.${analyticsSelectors['trigger-label']}`,\n },\n };\n\n if (customTriggerBuilder) {\n trigger = (\n <div className={styles['dropdown-trigger']} {...getAnalyticsMetadataAttribute(analyticsMetadata)}>\n {customTriggerBuilder({\n testUtilsClass: styles['test-utils-button-trigger'],\n ariaExpanded: canBeOpened && isOpen,\n onClick: clickHandler,\n triggerRef,\n ariaLabel,\n disabled,\n disabledReason,\n isOpen,\n })}\n </div>\n );\n } else if (isMainAction) {\n const { text, iconName, iconAlt, iconSvg, iconUrl, external, externalIconAriaLabel, ...mainActionProps } =\n mainAction;\n const mainActionIconProps = external\n ? ({ iconName: 'external', iconAlign: 'right' } as const)\n : ({ iconName, iconAlt, iconSvg, iconUrl } as const);\n const mainActionAriaLabel = externalIconAriaLabel\n ? `${mainAction.ariaLabel ?? mainAction.text} ${mainAction.externalIconAriaLabel}`\n : mainAction.ariaLabel;\n const hasNoText = !text;\n const mainActionButton = (\n <InternalButton\n ref={mainActionRef}\n {...mainActionProps}\n {...mainActionIconProps}\n fullWidth={canBeFullWidth}\n className={clsx(\n styles['trigger-button'],\n hasNoText && styles['has-no-text'],\n isVisualRefresh && styles['visual-refresh'],\n canBeFullWidth && styles['main-action-full-width']\n )}\n variant={variant}\n ariaLabel={mainActionAriaLabel}\n formAction=\"none\"\n >\n {text}\n </InternalButton>\n );\n trigger = (\n <div role=\"group\" aria-label={ariaLabel} className={styles['split-trigger-wrapper']}>\n <div\n className={clsx(\n styles['trigger-item'],\n styles['split-trigger'],\n styles[`variant-${variant}`],\n mainActionProps.disabled && styles.disabled,\n mainActionProps.loading && styles.loading\n )}\n // Close dropdown upon main action click unless event is cancelled.\n onClick={closeDropdown}\n // Prevent keyboard events from propagation to the button dropdown handler.\n onKeyDown={e => e.stopPropagation()}\n onKeyUp={e => e.stopPropagation()}\n {...getAnalyticsMetadataAttribute({\n action: 'click',\n detail: {\n label: `.${analyticsSelectors['main-action-label']}`,\n },\n })}\n >\n {mainActionButton}\n </div>\n {!showMainActionOnly && (\n <div\n className={clsx(\n styles['trigger-item'],\n styles['dropdown-trigger'],\n isVisualRefresh && styles['visual-refresh'],\n styles[`variant-${variant}`],\n baseTriggerProps.disabled && styles.disabled,\n baseTriggerProps.loading && styles.loading\n )}\n {...getAnalyticsMetadataAttribute(analyticsMetadata)}\n >\n <InternalButton\n ref={triggerRef}\n {...baseTriggerProps}\n className={clsx(baseTriggerProps.className, {\n [styles['main-action-trigger-full-width']]: canBeFullWidth,\n })}\n __emitPerformanceMarks={false}\n >\n {children}\n </InternalButton>\n </div>\n )}\n </div>\n );\n } else {\n trigger = (\n <div className={styles['dropdown-trigger']} {...getAnalyticsMetadataAttribute(analyticsMetadata)}>\n <InternalButton\n ref={triggerRef}\n id={triggerId}\n {...baseTriggerProps}\n className={clsx(baseTriggerProps.className, {\n [styles['full-width']]: canBeFullWidth,\n [styles.loading]: canBeFullWidth && !!loading,\n })}\n badge={triggerHasBadge()}\n fullWidth={fullWidth}\n >\n {children}\n </InternalButton>\n </div>\n );\n }\n\n const hasHeader = title || description;\n const headerId = useUniqueId('awsui-button-dropdown__header');\n\n const shouldLabelWithTrigger = !ariaLabel && !mainAction && variant !== 'icon' && variant !== 'inline-icon';\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 return (\n <div\n {...baseProps}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n onMouseDown={handleMouseEvent}\n onMouseMove={handleMouseEvent}\n className={clsx(\n styles['button-dropdown'],\n styles[`variant-${variant}`],\n canBeFullWidth && styles['full-width'],\n baseProps.className\n )}\n aria-owns={expandToViewport && isOpen ? dropdownId : undefined}\n ref={__internalRootRef}\n >\n <Dropdown\n open={canBeOpened && isOpen}\n stretchWidth={false}\n stretchTriggerHeight={variant === 'navigation'}\n expandToViewport={expandToViewport}\n preferCenter={preferCenter}\n onDropdownClose={() => toggleDropdown()}\n trigger={trigger}\n dropdownId={dropdownId}\n >\n {hasHeader && (\n <div className={styles.header} id={headerId}>\n {title && (\n <div className={styles.title}>\n <InternalBox\n fontSize=\"heading-s\"\n fontWeight=\"bold\"\n color=\"inherit\"\n tagOverride=\"h2\"\n margin={{ vertical: 'n', horizontal: 'n' }}\n >\n {title}\n </InternalBox>\n </div>\n )}\n {description && (\n <InternalBox fontSize=\"body-s\">\n <span className={styles.description}>{description}</span>\n </InternalBox>\n )}\n </div>\n )}\n <OptionsList\n open={canBeOpened && isOpen}\n position=\"static\"\n role=\"menu\"\n decreaseBlockMargin={true}\n ariaLabel={ariaLabel}\n ariaLabelledby={hasHeader ? headerId : shouldLabelWithTrigger ? triggerId : undefined}\n statusType=\"finished\"\n >\n <ItemsList\n items={items}\n onItemActivate={onItemActivate}\n onGroupToggle={onGroupToggle}\n hasExpandableGroups={expandableGroups}\n targetItem={targetItem}\n isHighlighted={isHighlighted}\n isKeyboardHighlight={isKeyboardHighlight}\n isExpanded={isExpanded}\n lastInDropdown={true}\n highlightItem={highlightItem}\n expandToViewport={expandToViewport}\n variant={variant}\n analyticsMetadataTransformer={analyticsMetadataTransformer}\n linkStyle={linkStyle}\n />\n </OptionsList>\n </Dropdown>\n </div>\n );\n }\n);\n\nexport default InternalButtonDropdown;\n"]}
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/button-dropdown/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, useImperativeHandle, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalBox from '../box/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton, InternalButtonProps } from '../button/internal';\nimport { useFunnel } from '../internal/analytics/hooks/use-funnel.js';\nimport { getBaseProps } from '../internal/base-component';\nimport Dropdown from '../internal/components/dropdown';\nimport OptionsList from '../internal/components/options-list';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode/index.js';\nimport { isDevelopment } from '../internal/is-development';\nimport { spinWhenOpen } from '../internal/styles/motion/utils';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport { GeneratedAnalyticsMetadataButtonDropdownExpand } from './analytics-metadata/interfaces.js';\nimport { ButtonDropdownProps, InternalButtonDropdownProps } from './interfaces';\nimport ItemsList from './items-list';\nimport { useButtonDropdown } from './utils/use-button-dropdown';\nimport { isLinkItem } from './utils/utils.js';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nconst InternalButtonDropdown = React.forwardRef(\n (\n {\n items,\n variant = 'normal',\n loading = false,\n loadingText,\n disabled = false,\n disabledReason,\n expandableGroups = false,\n children,\n onItemClick,\n onItemFollow,\n customTriggerBuilder,\n expandToViewport,\n ariaLabel,\n title,\n description,\n preferCenter,\n mainAction,\n showMainActionOnly,\n __internalRootRef,\n analyticsMetadataTransformer,\n linkStyle,\n fullWidth,\n ...props\n }: InternalButtonDropdownProps,\n ref: React.Ref<ButtonDropdownProps.Ref>\n ) => {\n const isInRestrictedView = useMobile();\n const dropdownId = useUniqueId('dropdown');\n for (const item of items) {\n if (isLinkItem(item)) {\n checkSafeUrl('ButtonDropdown', item.href);\n }\n }\n if (mainAction) {\n checkSafeUrl('ButtonDropdown', mainAction.href);\n }\n\n if (isDevelopment) {\n if (mainAction && variant !== 'primary' && variant !== 'normal') {\n warnOnce('ButtonDropdown', 'Main action is only supported for \"primary\" and \"normal\" component variant.');\n }\n }\n const isMainAction = mainAction && (variant === 'primary' || variant === 'normal');\n const isVisualRefresh = useVisualRefresh();\n\n const {\n isOpen,\n targetItem,\n isHighlighted,\n isKeyboardHighlight,\n isExpanded,\n highlightItem,\n onKeyDown,\n onKeyUp,\n onItemActivate,\n onGroupToggle,\n toggleDropdown,\n closeDropdown,\n setIsUsingMouse,\n } = useButtonDropdown({\n items,\n onItemClick,\n onItemFollow,\n // Scroll is unnecessary when moving focus back to the dropdown trigger.\n onReturnFocus: () => triggerRef.current?.focus({ preventScroll: true }),\n expandToViewport,\n hasExpandableGroups: expandableGroups,\n isInRestrictedView,\n });\n\n const handleMouseEvent = () => {\n setIsUsingMouse(true);\n };\n\n const baseProps = getBaseProps(props);\n\n const mainActionRef = useRef<HTMLElement>(null);\n const triggerRef = useRef<HTMLElement>(null);\n\n useImperativeHandle(\n ref,\n () => ({\n focus(...args) {\n (isMainAction ? mainActionRef : triggerRef).current?.focus(...args);\n },\n focusDropdownTrigger(...args) {\n triggerRef.current?.focus(...args);\n },\n }),\n [mainActionRef, triggerRef, isMainAction]\n );\n\n const clickHandler = () => {\n if (!loading && !disabled) {\n // Prevent moving highlight on mobiles to avoid disabled state reason popup if defined.\n toggleDropdown({ moveHighlightOnOpen: !isInRestrictedView });\n }\n };\n\n const canBeOpened = !loading && !disabled;\n\n const canBeFullWidth = !!fullWidth && (variant === 'primary' || variant === 'normal');\n\n const triggerVariant = variant === 'navigation' ? undefined : variant === 'inline-icon' ? 'inline-icon' : variant;\n const iconProps: Partial<ButtonProps & { __iconClass?: string }> =\n variant === 'icon' || variant === 'inline-icon'\n ? {\n iconName: 'ellipsis',\n }\n : {\n iconName: 'caret-down-filled',\n iconAlign: 'right',\n __iconClass: spinWhenOpen(styles, 'rotate', canBeOpened && isOpen),\n };\n\n const baseTriggerProps: InternalButtonProps = {\n className: clsx(\n styles['trigger-button'],\n styles['test-utils-button-trigger'],\n analyticsSelectors['trigger-label']\n ),\n ...iconProps,\n variant: triggerVariant,\n loading,\n loadingText,\n disabled,\n disabledReason,\n onClick: (event: Event) => {\n event.preventDefault();\n clickHandler();\n },\n ariaLabel,\n ariaExpanded: canBeOpened && isOpen,\n formAction: 'none',\n __nativeAttributes: {\n 'aria-haspopup': true,\n },\n };\n\n const triggerId = useUniqueId('awsui-button-dropdown__trigger');\n\n const triggerHasBadge = () => {\n const flatItems = items.flatMap(item => {\n if ('items' in item) {\n return item.items;\n }\n return item;\n });\n\n return (\n variant === 'icon' &&\n !!flatItems?.find(item => {\n if ('badge' in item) {\n return item.badge;\n }\n })\n );\n };\n\n let trigger: React.ReactNode = null;\n\n const analyticsMetadata: GeneratedAnalyticsMetadataButtonDropdownExpand | Record<string, never> = disabled\n ? {}\n : {\n action: 'expand',\n detail: {\n expanded: `${!isOpen}`,\n label: `.${analyticsSelectors['trigger-label']}`,\n },\n };\n\n if (customTriggerBuilder) {\n trigger = (\n <div className={styles['dropdown-trigger']} {...getAnalyticsMetadataAttribute(analyticsMetadata)}>\n {customTriggerBuilder({\n testUtilsClass: styles['test-utils-button-trigger'],\n ariaExpanded: canBeOpened && isOpen,\n onClick: clickHandler,\n triggerRef,\n ariaLabel,\n disabled,\n disabledReason,\n isOpen,\n })}\n </div>\n );\n } else if (isMainAction) {\n const { text, iconName, iconAlt, iconSvg, iconUrl, external, externalIconAriaLabel, ...mainActionProps } =\n mainAction;\n const mainActionIconProps = external\n ? ({ iconName: 'external', iconAlign: 'right', target: '_blank', rel: 'noopener noreferrer' } as const)\n : ({ iconName, iconAlt, iconSvg, iconUrl } as const);\n const mainActionAriaLabel = externalIconAriaLabel\n ? `${mainAction.ariaLabel ?? mainAction.text} ${mainAction.externalIconAriaLabel}`\n : mainAction.ariaLabel;\n const hasNoText = !text;\n const mainActionButton = (\n <InternalButton\n ref={mainActionRef}\n {...mainActionProps}\n {...mainActionIconProps}\n fullWidth={canBeFullWidth}\n className={clsx(\n styles['trigger-button'],\n hasNoText && styles['has-no-text'],\n isVisualRefresh && styles['visual-refresh'],\n canBeFullWidth && styles['main-action-full-width']\n )}\n variant={variant}\n ariaLabel={mainActionAriaLabel}\n formAction=\"none\"\n >\n {text}\n </InternalButton>\n );\n trigger = (\n <div role=\"group\" aria-label={ariaLabel} className={styles['split-trigger-wrapper']}>\n <div\n className={clsx(\n styles['trigger-item'],\n styles['split-trigger'],\n styles[`variant-${variant}`],\n mainActionProps.disabled && styles.disabled,\n mainActionProps.loading && styles.loading\n )}\n // Close dropdown upon main action click unless event is cancelled.\n onClick={closeDropdown}\n // Prevent keyboard events from propagation to the button dropdown handler.\n onKeyDown={e => e.stopPropagation()}\n onKeyUp={e => e.stopPropagation()}\n {...getAnalyticsMetadataAttribute({\n action: 'click',\n detail: {\n label: `.${analyticsSelectors['main-action-label']}`,\n },\n })}\n >\n {mainActionButton}\n </div>\n {!showMainActionOnly && (\n <div\n className={clsx(\n styles['trigger-item'],\n styles['dropdown-trigger'],\n isVisualRefresh && styles['visual-refresh'],\n styles[`variant-${variant}`],\n baseTriggerProps.disabled && styles.disabled,\n baseTriggerProps.loading && styles.loading\n )}\n {...getAnalyticsMetadataAttribute(analyticsMetadata)}\n >\n <InternalButton\n ref={triggerRef}\n {...baseTriggerProps}\n className={clsx(baseTriggerProps.className, {\n [styles['main-action-trigger-full-width']]: canBeFullWidth,\n })}\n __emitPerformanceMarks={false}\n >\n {children}\n </InternalButton>\n </div>\n )}\n </div>\n );\n } else {\n trigger = (\n <div className={styles['dropdown-trigger']} {...getAnalyticsMetadataAttribute(analyticsMetadata)}>\n <InternalButton\n ref={triggerRef}\n id={triggerId}\n {...baseTriggerProps}\n className={clsx(baseTriggerProps.className, {\n [styles['full-width']]: canBeFullWidth,\n [styles.loading]: canBeFullWidth && !!loading,\n })}\n badge={triggerHasBadge()}\n fullWidth={fullWidth}\n >\n {children}\n </InternalButton>\n </div>\n );\n }\n\n const hasHeader = title || description;\n const headerId = useUniqueId('awsui-button-dropdown__header');\n\n const shouldLabelWithTrigger = !ariaLabel && !mainAction && variant !== 'icon' && variant !== 'inline-icon';\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 return (\n <div\n {...baseProps}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n onMouseDown={handleMouseEvent}\n onMouseMove={handleMouseEvent}\n className={clsx(\n styles['button-dropdown'],\n styles[`variant-${variant}`],\n canBeFullWidth && styles['full-width'],\n baseProps.className\n )}\n aria-owns={expandToViewport && isOpen ? dropdownId : undefined}\n ref={__internalRootRef}\n >\n <Dropdown\n open={canBeOpened && isOpen}\n stretchWidth={false}\n stretchTriggerHeight={variant === 'navigation'}\n expandToViewport={expandToViewport}\n preferCenter={preferCenter}\n onDropdownClose={() => toggleDropdown()}\n trigger={trigger}\n dropdownId={dropdownId}\n >\n {hasHeader && (\n <div className={styles.header} id={headerId}>\n {title && (\n <div className={styles.title}>\n <InternalBox\n fontSize=\"heading-s\"\n fontWeight=\"bold\"\n color=\"inherit\"\n tagOverride=\"h2\"\n margin={{ vertical: 'n', horizontal: 'n' }}\n >\n {title}\n </InternalBox>\n </div>\n )}\n {description && (\n <InternalBox fontSize=\"body-s\">\n <span className={styles.description}>{description}</span>\n </InternalBox>\n )}\n </div>\n )}\n <OptionsList\n open={canBeOpened && isOpen}\n position=\"static\"\n role=\"menu\"\n decreaseBlockMargin={true}\n ariaLabel={ariaLabel}\n ariaLabelledby={hasHeader ? headerId : shouldLabelWithTrigger ? triggerId : undefined}\n statusType=\"finished\"\n >\n <ItemsList\n items={items}\n onItemActivate={onItemActivate}\n onGroupToggle={onGroupToggle}\n hasExpandableGroups={expandableGroups}\n targetItem={targetItem}\n isHighlighted={isHighlighted}\n isKeyboardHighlight={isKeyboardHighlight}\n isExpanded={isExpanded}\n lastInDropdown={true}\n highlightItem={highlightItem}\n expandToViewport={expandToViewport}\n variant={variant}\n analyticsMetadataTransformer={analyticsMetadataTransformer}\n linkStyle={linkStyle}\n />\n </OptionsList>\n </Dropdown>\n </div>\n );\n }\n);\n\nexport default InternalButtonDropdown;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-performance-marks/index.ts"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-performance-marks/index.ts"],"names":[],"mappings":";AAqCA;;;;GAIG;AACH,wBAAgB,mBAAmB,CACjC,IAAI,EAAE,MAAM,EACZ,OAAO,EAAE,MAAM,OAAO,EACtB,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,EACxC,UAAU,EAAE,MAAM,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC,EACvE,YAAY,EAAE,KAAK,CAAC,cAAc;;EAuEnC"}
|
|
@@ -5,6 +5,7 @@ import { useModalContext } from '../../context/modal-context';
|
|
|
5
5
|
import { useDOMAttribute } from '../use-dom-attribute';
|
|
6
6
|
import { useEffectOnUpdate } from '../use-effect-on-update';
|
|
7
7
|
import { useRandomId } from '../use-unique-id';
|
|
8
|
+
import { isInViewport } from './is-in-viewport';
|
|
8
9
|
const EVALUATE_COMPONENT_VISIBILITY_EVENT = 'awsui-evaluate-component-visibility';
|
|
9
10
|
/**
|
|
10
11
|
* This hook manages a boolean state (`evaluateComponentVisibility`) that toggles
|
|
@@ -45,10 +46,14 @@ export function usePerformanceMarks(name, enabled, elementRef, getDetails, depen
|
|
|
45
46
|
if (!elementVisible) {
|
|
46
47
|
return;
|
|
47
48
|
}
|
|
48
|
-
const
|
|
49
|
-
|
|
50
|
-
|
|
49
|
+
const timestamp = performance.now();
|
|
50
|
+
const cleanup = isInViewport(elementRef.current, inViewport => {
|
|
51
|
+
performance.mark(`${name}Rendered`, {
|
|
52
|
+
startTime: timestamp,
|
|
53
|
+
detail: Object.assign({ source: 'awsui', instanceIdentifier: id, inViewport }, getDetails()),
|
|
54
|
+
});
|
|
51
55
|
});
|
|
56
|
+
return cleanup;
|
|
52
57
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
53
58
|
}, []);
|
|
54
59
|
useEffectOnUpdate(() => {
|
|
@@ -61,10 +66,14 @@ export function usePerformanceMarks(name, enabled, elementRef, getDetails, depen
|
|
|
61
66
|
if (!elementVisible) {
|
|
62
67
|
return;
|
|
63
68
|
}
|
|
64
|
-
const
|
|
65
|
-
|
|
66
|
-
|
|
69
|
+
const timestamp = performance.now();
|
|
70
|
+
const cleanup = isInViewport(elementRef.current, inViewport => {
|
|
71
|
+
performance.mark(`${name}Updated`, {
|
|
72
|
+
startTime: timestamp,
|
|
73
|
+
detail: Object.assign({ source: 'awsui', instanceIdentifier: id, inViewport }, getDetails()),
|
|
74
|
+
});
|
|
67
75
|
});
|
|
76
|
+
return cleanup;
|
|
68
77
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
69
78
|
}, [evaluateComponentVisibility, ...dependencies]);
|
|
70
79
|
return attributes;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-performance-marks/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAC5D,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-performance-marks/index.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useEffect, useState } from 'react';\n\nimport { useModalContext } from '../../context/modal-context';\nimport { useDOMAttribute } from '../use-dom-attribute';\nimport { useEffectOnUpdate } from '../use-effect-on-update';\nimport { useRandomId } from '../use-unique-id';\nimport { isInViewport } from './is-in-viewport';\n\nconst EVALUATE_COMPONENT_VISIBILITY_EVENT = 'awsui-evaluate-component-visibility';\n\n/**\n * This hook manages a boolean state (`evaluateComponentVisibility`) that toggles\n * whenever a custom DOM event (`EVALUATE_COMPONENT_VISIBILITY_EVENT`) is triggered.\n *\n * @returns\n */\nconst useEvaluateComponentVisibility = () => {\n const [evaluateComponentVisibility, setEvaluateComponentVisibility] = useState(false);\n\n useEffect(() => {\n const handleEvaluateComponentVisibility = () => {\n setEvaluateComponentVisibility(prev => !prev);\n };\n\n document.addEventListener(EVALUATE_COMPONENT_VISIBILITY_EVENT, handleEvaluateComponentVisibility);\n\n return () => {\n document.removeEventListener(EVALUATE_COMPONENT_VISIBILITY_EVENT, handleEvaluateComponentVisibility);\n };\n }, []);\n\n return evaluateComponentVisibility;\n};\n\n/**\n * This function returns an object that needs to be spread onto the same\n * element as the `elementRef`, so that the data attribute is applied\n * correctly.\n */\nexport function usePerformanceMarks(\n name: string,\n enabled: () => boolean,\n elementRef: React.RefObject<HTMLElement>,\n getDetails: () => Record<string, string | boolean | number | undefined>,\n dependencies: React.DependencyList\n) {\n const id = useRandomId();\n const { isInModal } = useModalContext();\n const attributes = useDOMAttribute(elementRef, 'data-analytics-performance-mark', id);\n const evaluateComponentVisibility = useEvaluateComponentVisibility();\n\n useEffect(() => {\n if (!enabled() || !elementRef.current || isInModal) {\n return;\n }\n const elementVisible =\n elementRef.current.offsetWidth > 0 &&\n elementRef.current.offsetHeight > 0 &&\n getComputedStyle(elementRef.current).visibility !== 'hidden';\n\n if (!elementVisible) {\n return;\n }\n\n const timestamp = performance.now();\n\n const cleanup = isInViewport(elementRef.current, inViewport => {\n performance.mark(`${name}Rendered`, {\n startTime: timestamp,\n detail: {\n source: 'awsui',\n instanceIdentifier: id,\n inViewport,\n ...getDetails(),\n },\n });\n });\n\n return cleanup;\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n useEffectOnUpdate(() => {\n if (!enabled() || !elementRef.current || isInModal) {\n return;\n }\n const elementVisible =\n elementRef.current.offsetWidth > 0 &&\n elementRef.current.offsetHeight > 0 &&\n getComputedStyle(elementRef.current).visibility !== 'hidden';\n\n if (!elementVisible) {\n return;\n }\n\n const timestamp = performance.now();\n\n const cleanup = isInViewport(elementRef.current, inViewport => {\n performance.mark(`${name}Updated`, {\n startTime: timestamp,\n detail: {\n source: 'awsui',\n instanceIdentifier: id,\n inViewport,\n ...getDetails(),\n },\n });\n });\n return cleanup;\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [evaluateComponentVisibility, ...dependencies]);\n\n return attributes;\n}\n"]}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
type Callback = (inViewport: boolean) => void;
|
|
2
|
+
/**
|
|
3
|
+
* This function determines whether an element is in the viewport. The callback
|
|
4
|
+
* is batched with other elements that also use this function, in order to improve
|
|
5
|
+
* performance.
|
|
6
|
+
*/
|
|
7
|
+
export declare function isInViewport(element: Element, callback: Callback): () => void;
|
|
8
|
+
export {};
|
|
9
|
+
//# sourceMappingURL=is-in-viewport.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"is-in-viewport.d.ts","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-performance-marks/is-in-viewport.ts"],"names":[],"mappings":"AAGA,KAAK,QAAQ,GAAG,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;AAK9C;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,cAuBhE"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
+
const map = new WeakMap();
|
|
4
|
+
const MANUAL_TRIGGER_DELAY = 150;
|
|
5
|
+
/**
|
|
6
|
+
* This function determines whether an element is in the viewport. The callback
|
|
7
|
+
* is batched with other elements that also use this function, in order to improve
|
|
8
|
+
* performance.
|
|
9
|
+
*/
|
|
10
|
+
export function isInViewport(element, callback) {
|
|
11
|
+
let resolve = (value) => {
|
|
12
|
+
resolve = () => { }; // Prevent multiple execution
|
|
13
|
+
callback(value);
|
|
14
|
+
};
|
|
15
|
+
map.set(element, inViewport => resolve(inViewport));
|
|
16
|
+
observer.observe(element);
|
|
17
|
+
/*
|
|
18
|
+
If the IntersectionObserver does not fire in reasonable time (for example
|
|
19
|
+
in a background page in Chrome), we need to call the callback manually.
|
|
20
|
+
|
|
21
|
+
See https://issues.chromium.org/issues/41383759
|
|
22
|
+
*/
|
|
23
|
+
const timeoutHandle = setTimeout(() => resolve(false), MANUAL_TRIGGER_DELAY);
|
|
24
|
+
// Cleanup
|
|
25
|
+
return () => {
|
|
26
|
+
clearTimeout(timeoutHandle);
|
|
27
|
+
map.delete(element);
|
|
28
|
+
observer.unobserve(element);
|
|
29
|
+
};
|
|
30
|
+
}
|
|
31
|
+
function createIntersectionObserver(callback) {
|
|
32
|
+
if (typeof IntersectionObserver === 'undefined') {
|
|
33
|
+
return {
|
|
34
|
+
observe: () => { },
|
|
35
|
+
unobserve: () => { },
|
|
36
|
+
};
|
|
37
|
+
}
|
|
38
|
+
return new IntersectionObserver(callback);
|
|
39
|
+
}
|
|
40
|
+
const observer = createIntersectionObserver(function isInViewportObserver(entries) {
|
|
41
|
+
var _a;
|
|
42
|
+
for (const entry of entries) {
|
|
43
|
+
observer.unobserve(entry.target); // We only want the first run of the observer for each element.
|
|
44
|
+
(_a = map.get(entry.target)) === null || _a === void 0 ? void 0 : _a(entry.isIntersecting);
|
|
45
|
+
map.delete(entry.target);
|
|
46
|
+
}
|
|
47
|
+
});
|
|
48
|
+
//# sourceMappingURL=is-in-viewport.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"is-in-viewport.js","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-performance-marks/is-in-viewport.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAGtC,MAAM,GAAG,GAAG,IAAI,OAAO,EAAqB,CAAC;AAE7C,MAAM,oBAAoB,GAAG,GAAG,CAAC;AAEjC;;;;GAIG;AACH,MAAM,UAAU,YAAY,CAAC,OAAgB,EAAE,QAAkB;IAC/D,IAAI,OAAO,GAAG,CAAC,KAAc,EAAE,EAAE;QAC/B,OAAO,GAAG,GAAG,EAAE,GAAE,CAAC,CAAC,CAAC,6BAA6B;QACjD,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClB,CAAC,CAAC;IAEF,GAAG,CAAC,GAAG,CAAC,OAAO,EAAE,UAAU,CAAC,EAAE,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC,CAAC;IACpD,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;IAE1B;;;;;SAKE;IACF,MAAM,aAAa,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,oBAAoB,CAAC,CAAC;IAE7E,UAAU;IACV,OAAO,GAAG,EAAE;QACV,YAAY,CAAC,aAAa,CAAC,CAAC;QAC5B,GAAG,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;QACpB,QAAQ,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;IAC9B,CAAC,CAAC;AACJ,CAAC;AAED,SAAS,0BAA0B,CAAC,QAAsC;IACxE,IAAI,OAAO,oBAAoB,KAAK,WAAW,EAAE;QAC/C,OAAO;YACL,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;YACjB,SAAS,EAAE,GAAG,EAAE,GAAE,CAAC;SACpB,CAAC;KACH;IACD,OAAO,IAAI,oBAAoB,CAAC,QAAQ,CAAC,CAAC;AAC5C,CAAC;AAED,MAAM,QAAQ,GAAG,0BAA0B,CAAC,SAAS,oBAAoB,CAAC,OAAO;;IAC/E,KAAK,MAAM,KAAK,IAAI,OAAO,EAAE;QAC3B,QAAQ,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,+DAA+D;QACjG,MAAA,GAAG,CAAC,GAAG,CAAC,KAAK,CAAC,MAAM,CAAC,0CAAG,KAAK,CAAC,cAAc,CAAC,CAAC;QAC9C,GAAG,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;KAC1B;AACH,CAAC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\ntype Callback = (inViewport: boolean) => void;\nconst map = new WeakMap<Element, Callback>();\n\nconst MANUAL_TRIGGER_DELAY = 150;\n\n/**\n * This function determines whether an element is in the viewport. The callback\n * is batched with other elements that also use this function, in order to improve\n * performance.\n */\nexport function isInViewport(element: Element, callback: Callback) {\n let resolve = (value: boolean) => {\n resolve = () => {}; // Prevent multiple execution\n callback(value);\n };\n\n map.set(element, inViewport => resolve(inViewport));\n observer.observe(element);\n\n /*\n\t If the IntersectionObserver does not fire in reasonable time (for example\n\t in a background page in Chrome), we need to call the callback manually.\n \n\t See https://issues.chromium.org/issues/41383759\n\t */\n const timeoutHandle = setTimeout(() => resolve(false), MANUAL_TRIGGER_DELAY);\n\n // Cleanup\n return () => {\n clearTimeout(timeoutHandle);\n map.delete(element);\n observer.unobserve(element);\n };\n}\n\nfunction createIntersectionObserver(callback: IntersectionObserverCallback) {\n if (typeof IntersectionObserver === 'undefined') {\n return {\n observe: () => {},\n unobserve: () => {},\n };\n }\n return new IntersectionObserver(callback);\n}\n\nconst observer = createIntersectionObserver(function isInViewportObserver(entries) {\n for (const entry of entries) {\n observer.unobserve(entry.target); // We only want the first run of the observer for each element.\n map.get(entry.target)?.(entry.isIntersecting);\n map.delete(entry.target);\n }\n});\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/key-value-pairs/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAEhE,MAAM,WAAW,kBAAmB,SAAQ,kBAAkB;IAC5D;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;;;;;;;;;;;;OAgBG;IACH,KAAK,EAAE,aAAa,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC;IAC9C;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,yBAAiB,kBAAkB,CAAC;IAClC,KAAY,IAAI,GAAG,KAAK,GAAG,IAAI,CAAC;IAEhC,UAAiB,KAAK;QACpB,IAAI,EAAE,OAAO,CAAC;QACd,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;KAC5B;IAED,UAAiB,IAAK,SAAQ,kBAAkB;QAC9C,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/key-value-pairs/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAEhE,MAAM,WAAW,kBAAmB,SAAQ,kBAAkB;IAC5D;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;;;;;;;;;;;;OAgBG;IACH,KAAK,EAAE,aAAa,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC;IAC9C;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,yBAAiB,kBAAkB,CAAC;IAClC,KAAY,IAAI,GAAG,KAAK,GAAG,IAAI,CAAC;IAEhC,UAAiB,KAAK;QACpB,IAAI,EAAE,OAAO,CAAC;QACd,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;KAC5B;IAED,UAAiB,IAAK,SAAQ,kBAAkB;QAC9C,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;QACvB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;QACvB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;KACxB;CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/key-value-pairs/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { BaseComponentProps } from '../internal/base-component';\n\nexport interface KeyValuePairsProps extends BaseComponentProps {\n /**\n * Specifies the number of columns in each grid row.\n * Valid values are any integer between 1 and 4. It defaults to 1.\n */\n columns?: number;\n /**\n * An array of either key-value pairs individual items or groups.\n * They could be combined.\n * Each item has `type` prop, which might be either `group` or `pair`. Defaults to `pair` if not specified.\n *\n * Each key-value pair definition has the following properties:\n * * `type` (string) - (Optional) Item type (pair).\n * * `label` (string) - The key label.\n * * `info` (React.ReactNode) - (Optional) Area next to the key to display an info link.\n * * `value` (React.ReactNode) - The corresponding value for the key.\n *\n * Each group definition has the following properties:\n * * `type` (string) - Item type (group).\n * * `title` (string) - (Optional) An optional title for this column.\n * * `items` (ReadonlyArray<KeyValuePairProps.KeyValuePair>) - An array of\n * key-value pair items.\n */\n items: ReadonlyArray<KeyValuePairsProps.Item>;\n /**\n * Provides an `aria-label` to the Key-value pairs container.\n * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabel?: string;\n /**\n * Sets the `aria-labelledby` property on the Key-value pairs container.\n * If there's a visible label element that you can reference, use this instead of `ariaLabel`.\n * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabelledby?: string;\n\n /**\n * Use to specify the desired minimum width for each column in pixels.\n *\n * The number of columns is determined by the value of this property, the available space,\n * and the maximum number of columns as defined by the `columns` property.\n * If not set, defaults to 150.\n */\n minColumnWidth?: number;\n}\n\nexport namespace KeyValuePairsProps {\n export type Item = Group | Pair;\n\n export interface Group {\n type: 'group';\n title?: string;\n items: ReadonlyArray<Pair>;\n }\n\n export interface Pair extends BaseComponentProps {\n type?: 'pair';\n label:
|
|
1
|
+
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/key-value-pairs/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { BaseComponentProps } from '../internal/base-component';\n\nexport interface KeyValuePairsProps extends BaseComponentProps {\n /**\n * Specifies the number of columns in each grid row.\n * Valid values are any integer between 1 and 4. It defaults to 1.\n */\n columns?: number;\n /**\n * An array of either key-value pairs individual items or groups.\n * They could be combined.\n * Each item has `type` prop, which might be either `group` or `pair`. Defaults to `pair` if not specified.\n *\n * Each key-value pair definition has the following properties:\n * * `type` (string) - (Optional) Item type (pair).\n * * `label` (string) - The key label.\n * * `info` (React.ReactNode) - (Optional) Area next to the key to display an info link.\n * * `value` (React.ReactNode) - The corresponding value for the key.\n *\n * Each group definition has the following properties:\n * * `type` (string) - Item type (group).\n * * `title` (string) - (Optional) An optional title for this column.\n * * `items` (ReadonlyArray<KeyValuePairProps.KeyValuePair>) - An array of\n * key-value pair items.\n */\n items: ReadonlyArray<KeyValuePairsProps.Item>;\n /**\n * Provides an `aria-label` to the Key-value pairs container.\n * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabel?: string;\n /**\n * Sets the `aria-labelledby` property on the Key-value pairs container.\n * If there's a visible label element that you can reference, use this instead of `ariaLabel`.\n * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabelledby?: string;\n\n /**\n * Use to specify the desired minimum width for each column in pixels.\n *\n * The number of columns is determined by the value of this property, the available space,\n * and the maximum number of columns as defined by the `columns` property.\n * If not set, defaults to 150.\n */\n minColumnWidth?: number;\n}\n\nexport namespace KeyValuePairsProps {\n export type Item = Group | Pair;\n\n export interface Group {\n type: 'group';\n title?: string;\n items: ReadonlyArray<Pair>;\n }\n\n export interface Pair extends BaseComponentProps {\n type?: 'pair';\n label: React.ReactNode;\n value: React.ReactNode;\n info?: React.ReactNode;\n }\n}\n"]}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
|
|
2
2
|
import './styles.scoped.css';
|
|
3
3
|
export default {
|
|
4
|
-
"key-value-pairs": "awsui_key-value-
|
|
5
|
-
"group-title": "awsui_group-
|
|
6
|
-
"group-list": "awsui_group-
|
|
7
|
-
"group-list-item": "awsui_group-list-
|
|
8
|
-
"term": "
|
|
9
|
-
"key-label": "awsui_key-
|
|
10
|
-
"detail": "
|
|
11
|
-
"info": "
|
|
4
|
+
"key-value-pairs": "awsui_key-value-pairs_1y9fy_gscxd_145",
|
|
5
|
+
"group-title": "awsui_group-title_1y9fy_gscxd_177",
|
|
6
|
+
"group-list": "awsui_group-list_1y9fy_gscxd_181",
|
|
7
|
+
"group-list-item": "awsui_group-list-item_1y9fy_gscxd_191",
|
|
8
|
+
"term": "awsui_term_1y9fy_gscxd_195",
|
|
9
|
+
"key-label": "awsui_key-label_1y9fy_gscxd_203",
|
|
10
|
+
"detail": "awsui_detail_1y9fy_gscxd_212",
|
|
11
|
+
"info": "awsui_info_1y9fy_gscxd_247"
|
|
12
12
|
};
|
|
13
13
|
|
|
@@ -142,7 +142,7 @@
|
|
|
142
142
|
*/
|
|
143
143
|
/* Style used for links in slots/components that are text heavy, to help links stand out among
|
|
144
144
|
surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
|
|
145
|
-
.awsui_key-value-
|
|
145
|
+
.awsui_key-value-pairs_1y9fy_gscxd_145:not(#\9) {
|
|
146
146
|
border-collapse: separate;
|
|
147
147
|
border-spacing: 0;
|
|
148
148
|
box-sizing: border-box;
|
|
@@ -175,11 +175,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
175
175
|
-moz-osx-font-smoothing: auto;
|
|
176
176
|
}
|
|
177
177
|
|
|
178
|
-
.awsui_group-
|
|
178
|
+
.awsui_group-title_1y9fy_gscxd_177:not(#\9) {
|
|
179
179
|
padding-block-end: var(--space-scaled-m-3uxq9h, 16px);
|
|
180
180
|
}
|
|
181
181
|
|
|
182
|
-
.awsui_group-
|
|
182
|
+
.awsui_group-list_1y9fy_gscxd_181:not(#\9) {
|
|
183
183
|
margin-block-start: 0;
|
|
184
184
|
margin-block-end: 0;
|
|
185
185
|
margin-inline-start: 0;
|
|
@@ -189,11 +189,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
189
189
|
row-gap: var(--space-scaled-m-3uxq9h, 16px);
|
|
190
190
|
}
|
|
191
191
|
|
|
192
|
-
.awsui_group-list-
|
|
192
|
+
.awsui_group-list-item_1y9fy_gscxd_191:not(#\9) {
|
|
193
193
|
/* used in test-utils */
|
|
194
194
|
}
|
|
195
195
|
|
|
196
|
-
.
|
|
196
|
+
.awsui_term_1y9fy_gscxd_195:not(#\9) {
|
|
197
197
|
font-size: var(--font-size-body-m-6wxxs5, 14px);
|
|
198
198
|
line-height: var(--line-height-body-m-gw0130, 22px);
|
|
199
199
|
font-weight: var(--font-display-label-weight-5p8eav, 400);
|
|
@@ -201,15 +201,16 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
201
201
|
margin-block-end: var(--space-key-value-gap-v0snfq, 2px);
|
|
202
202
|
}
|
|
203
203
|
|
|
204
|
-
.awsui_key-
|
|
204
|
+
.awsui_key-label_1y9fy_gscxd_203:not(#\9) {
|
|
205
|
+
display: inline-flex;
|
|
205
206
|
margin-inline-end: var(--space-xs-6dgkww, 8px);
|
|
206
207
|
}
|
|
207
|
-
.awsui_key-
|
|
208
|
+
.awsui_key-label_1y9fy_gscxd_203:not(#\9):only-child {
|
|
208
209
|
margin-block: 0;
|
|
209
210
|
margin-inline: 0;
|
|
210
211
|
}
|
|
211
212
|
|
|
212
|
-
.
|
|
213
|
+
.awsui_detail_1y9fy_gscxd_212:not(#\9) {
|
|
213
214
|
border-collapse: separate;
|
|
214
215
|
border-spacing: 0;
|
|
215
216
|
box-sizing: border-box;
|
|
@@ -245,7 +246,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
245
246
|
margin-block-end: 0;
|
|
246
247
|
}
|
|
247
248
|
|
|
248
|
-
.
|
|
249
|
+
.awsui_info_1y9fy_gscxd_247:not(#\9) {
|
|
249
250
|
display: inline-flex;
|
|
250
251
|
padding-inline-start: var(--space-xs-6dgkww, 8px);
|
|
251
252
|
border-inline-start: var(--border-divider-section-width-iueskx, 1px) solid var(--color-border-divider-default-u5ytia, #eaeded);
|
|
@@ -2,13 +2,13 @@
|
|
|
2
2
|
// es-module interop with Babel and Typescript
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
module.exports.default = {
|
|
5
|
-
"key-value-pairs": "awsui_key-value-
|
|
6
|
-
"group-title": "awsui_group-
|
|
7
|
-
"group-list": "awsui_group-
|
|
8
|
-
"group-list-item": "awsui_group-list-
|
|
9
|
-
"term": "
|
|
10
|
-
"key-label": "awsui_key-
|
|
11
|
-
"detail": "
|
|
12
|
-
"info": "
|
|
5
|
+
"key-value-pairs": "awsui_key-value-pairs_1y9fy_gscxd_145",
|
|
6
|
+
"group-title": "awsui_group-title_1y9fy_gscxd_177",
|
|
7
|
+
"group-list": "awsui_group-list_1y9fy_gscxd_181",
|
|
8
|
+
"group-list-item": "awsui_group-list-item_1y9fy_gscxd_191",
|
|
9
|
+
"term": "awsui_term_1y9fy_gscxd_195",
|
|
10
|
+
"key-label": "awsui_key-label_1y9fy_gscxd_203",
|
|
11
|
+
"detail": "awsui_detail_1y9fy_gscxd_212",
|
|
12
|
+
"info": "awsui_info_1y9fy_gscxd_247"
|
|
13
13
|
};
|
|
14
14
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/multiselect/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAKhD,OAAO,EAAE,gBAAgB,EAAE,CAAC;AAE5B,QAAA,MAAM,WAAW,+
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/multiselect/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAKhD,OAAO,EAAE,gBAAgB,EAAE,CAAC;AAE5B,QAAA,MAAM,WAAW,+FAuDhB,CAAC;AAGF,eAAe,WAAW,CAAC"}
|
|
@@ -20,6 +20,7 @@ const Multiselect = React.forwardRef((_a, ref) => {
|
|
|
20
20
|
tokenLimit: restProps.tokenLimit,
|
|
21
21
|
virtualScroll: restProps.virtualScroll,
|
|
22
22
|
readOnly: restProps.readOnly,
|
|
23
|
+
enableSelectAll: restProps.enableSelectAll,
|
|
23
24
|
},
|
|
24
25
|
metadata: {
|
|
25
26
|
hasDisabledReasons: options.some(option => Boolean(option.disabledReason)),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/multiselect/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,6BAA6B,EAAE,MAAM,kEAAkE,CAAC;AAEjH,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAGxE,OAAO,mBAAmB,MAAM,YAAY,CAAC;AAE7C,OAAO,+BAA+B,MAAM,wEAAwE,CAAC;AAIrH,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAClC,CACE,EAQmB,EACnB,GAAoC,EACpC,EAAE;QAVF,EACE,OAAO,GAAG,EAAE,EACZ,aAAa,GAAG,MAAM,EACtB,UAAU,GAAG,UAAU,EACvB,eAAe,GAAG,EAAE,EACpB,QAAQ,GAAG,IAAI,EACf,UAAU,GAAG,KAAK,OAED,EADd,SAAS,cAPd,uFAQC,CADa;IAId,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,aAAa,EAAE;QACzD,KAAK,EAAE;YACL,YAAY,EAAE,SAAS,CAAC,YAAY;YACpC,SAAS,EAAE,SAAS,CAAC,SAAS;YAC9B,gBAAgB,EAAE,SAAS,CAAC,gBAAgB;YAC5C,aAAa;YACb,UAAU;YACV,QAAQ;YACR,UAAU,EAAE,SAAS,CAAC,UAAU;YAChC,aAAa,EAAE,SAAS,CAAC,aAAa;YACtC,QAAQ,EAAE,SAAS,CAAC,QAAQ;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/multiselect/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,6BAA6B,EAAE,MAAM,kEAAkE,CAAC;AAEjH,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAGxE,OAAO,mBAAmB,MAAM,YAAY,CAAC;AAE7C,OAAO,+BAA+B,MAAM,wEAAwE,CAAC;AAIrH,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAClC,CACE,EAQmB,EACnB,GAAoC,EACpC,EAAE;QAVF,EACE,OAAO,GAAG,EAAE,EACZ,aAAa,GAAG,MAAM,EACtB,UAAU,GAAG,UAAU,EACvB,eAAe,GAAG,EAAE,EACpB,QAAQ,GAAG,IAAI,EACf,UAAU,GAAG,KAAK,OAED,EADd,SAAS,cAPd,uFAQC,CADa;IAId,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,aAAa,EAAE;QACzD,KAAK,EAAE;YACL,YAAY,EAAE,SAAS,CAAC,YAAY;YACpC,SAAS,EAAE,SAAS,CAAC,SAAS;YAC9B,gBAAgB,EAAE,SAAS,CAAC,gBAAgB;YAC5C,aAAa;YACb,UAAU;YACV,QAAQ;YACR,UAAU,EAAE,SAAS,CAAC,UAAU;YAChC,aAAa,EAAE,SAAS,CAAC,aAAa;YACtC,QAAQ,EAAE,SAAS,CAAC,QAAQ;YAC5B,eAAe,EAAE,SAAS,CAAC,eAAe;SAC3C;QACD,QAAQ,EAAE;YACR,kBAAkB,EAAE,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC;SAC3E;KACF,CAAC,CAAC;IAEH,MAAM,0BAA0B,GAAmD;QACjF,IAAI,EAAE,mBAAmB;QACzB,KAAK,EAAE,IAAI,+BAA+B,CAAC,gBAAgB,CAAC,EAAE;QAC9D,UAAU,EAAE;YACV,QAAQ,EAAE,GAAG,CAAC,CAAC,SAAS,CAAC,QAAQ,EAAE;YACnC,oBAAoB,EAAE,GAAG,eAAe,CAAC,MAAM,EAAE;SAClD;KACF,CAAC;IAEF,OAAO,CACL,oBAAC,mBAAmB,kBAClB,OAAO,EAAE,OAAO,EAChB,aAAa,EAAE,aAAa,EAC5B,UAAU,EAAE,UAAU,EACtB,eAAe,EAAE,eAAe,EAChC,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU,IAClB,SAAS,EACT,kBAAkB,IACtB,GAAG,EAAE,GAAG,IACJ,6BAA6B,CAAC,EAAE,SAAS,EAAE,0BAA0B,EAAE,CAAC,EAC5E,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,gBAAgB,CAAC,WAAW,EAAE,aAAa,CAAC,CAAC;AAC7C,eAAe,WAAW,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 { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { GeneratedAnalyticsMetadataMultiselectComponent } from './analytics-metadata/interfaces';\nimport { MultiselectProps } from './interfaces';\nimport InternalMultiselect from './internal';\n\nimport buttonTriggerAnalyticsSelectors from '../internal/components/button-trigger/analytics-metadata/styles.css.js';\n\nexport { MultiselectProps };\n\nconst Multiselect = React.forwardRef(\n (\n {\n options = [],\n filteringType = 'none',\n statusType = 'finished',\n selectedOptions = [],\n keepOpen = true,\n hideTokens = false,\n ...restProps\n }: MultiselectProps,\n ref: React.Ref<MultiselectProps.Ref>\n ) => {\n const baseComponentProps = useBaseComponent('Multiselect', {\n props: {\n inlineTokens: restProps.inlineTokens,\n autoFocus: restProps.autoFocus,\n expandToViewport: restProps.expandToViewport,\n filteringType,\n hideTokens,\n keepOpen,\n tokenLimit: restProps.tokenLimit,\n virtualScroll: restProps.virtualScroll,\n readOnly: restProps.readOnly,\n enableSelectAll: restProps.enableSelectAll,\n },\n metadata: {\n hasDisabledReasons: options.some(option => Boolean(option.disabledReason)),\n },\n });\n\n const componentAnalyticsMetadata: GeneratedAnalyticsMetadataMultiselectComponent = {\n name: 'awsui.Multiselect',\n label: `.${buttonTriggerAnalyticsSelectors['button-trigger']}`,\n properties: {\n disabled: `${!!restProps.disabled}`,\n selectedOptionsCount: `${selectedOptions.length}`,\n },\n };\n\n return (\n <InternalMultiselect\n options={options}\n filteringType={filteringType}\n statusType={statusType}\n selectedOptions={selectedOptions}\n keepOpen={keepOpen}\n hideTokens={hideTokens}\n {...restProps}\n {...baseComponentProps}\n ref={ref}\n {...getAnalyticsMetadataAttribute({ component: componentAnalyticsMetadata })}\n />\n );\n }\n);\n\napplyDisplayName(Multiselect, 'Multiselect');\nexport default Multiselect;\n"]}
|
|
@@ -1 +1 @@
|
|
|
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;;;;;;;
|
|
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;;;;;;;gFAgLxB,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
|
|
@@ -64,9 +64,10 @@ const InternalMultiselect = React.forwardRef((_a, externalRef) => {
|
|
|
64
64
|
};
|
|
65
65
|
const dropdownStatus = multiselectProps.dropdownStatus;
|
|
66
66
|
const dropdownProps = multiselectProps.getDropdownProps();
|
|
67
|
+
const hasFilteredOptions = multiselectProps.filteredOptions.length > 0;
|
|
67
68
|
return (React.createElement("div", Object.assign({}, baseProps, { ref: __internalRootRef, className: clsx(styles.root, baseProps.className) }, multiselectProps.getWrapperProps()),
|
|
68
69
|
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 }),
|
|
69
|
-
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, firstOptionSticky: enableSelectAll })),
|
|
70
|
+
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, firstOptionSticky: hasFilteredOptions && enableSelectAll })),
|
|
70
71
|
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 }))),
|
|
71
72
|
React.createElement(ScreenreaderOnly, { id: ariaLabelId }, ariaLabel)));
|
|
72
73
|
});
|
|
@@ -1 +1 @@
|
|
|
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;\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 enableSelectAll,\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('multiselect-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 enableSelectAll,\n i18nStrings,\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 firstOptionSticky={enableSelectAll}\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"]}
|
|
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;\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 enableSelectAll,\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('multiselect-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 enableSelectAll,\n i18nStrings,\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 const hasFilteredOptions = multiselectProps.filteredOptions.length > 0;\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 firstOptionSticky={hasFilteredOptions && enableSelectAll}\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"]}
|