@cloudscape-design/components 3.0.1179 → 3.0.1181
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/internal/base-component/styles.scoped.css +1 -1
- package/internal/components/autosuggest-input/index.d.ts.map +1 -1
- package/internal/components/autosuggest-input/index.js +6 -0
- package/internal/components/autosuggest-input/index.js.map +1 -1
- package/internal/components/selectable-item/styles.css.js +22 -22
- package/internal/components/selectable-item/styles.scoped.css +49 -75
- package/internal/components/selectable-item/styles.selectors.js +22 -22
- package/internal/environment.js +2 -2
- package/internal/environment.json +2 -2
- package/internal/hooks/use-ime-composition/index.d.ts +12 -0
- package/internal/hooks/use-ime-composition/index.d.ts.map +1 -0
- package/internal/hooks/use-ime-composition/index.js +39 -0
- package/internal/hooks/use-ime-composition/index.js.map +1 -0
- package/internal/manifest.json +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/autosuggest-input/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAgE,MAAM,OAAO,CAAC;AAGrF,OAAO,EAAE,gBAAgB,EAAE,MAAM,iCAAiC,CAAC;AACnE,OAAO,EACL,gBAAgB,EAChB,cAAc,EACd,gBAAgB,EAChB,eAAe,EACf,cAAc,EACd,UAAU,EACX,MAAM,2BAA2B,CAAC;AAEnC,OAAO,EAAE,kBAAkB,EAAgB,MAAM,sBAAsB,CAAC;AACxE,OAAO,EAAE,+BAA+B,EAAuB,MAAM,kCAAkC,CAAC;AACxG,OAAO,EAA8D,yBAAyB,EAAE,MAAM,cAAc,CAAC;AACrH,OAAO,EAAE,0BAA0B,EAAE,MAAM,gCAAgC,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/autosuggest-input/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAgE,MAAM,OAAO,CAAC;AAGrF,OAAO,EAAE,gBAAgB,EAAE,MAAM,iCAAiC,CAAC;AACnE,OAAO,EACL,gBAAgB,EAChB,cAAc,EACd,gBAAgB,EAChB,eAAe,EACf,cAAc,EACd,UAAU,EACX,MAAM,2BAA2B,CAAC;AAEnC,OAAO,EAAE,kBAAkB,EAAgB,MAAM,sBAAsB,CAAC;AACxE,OAAO,EAAE,+BAA+B,EAAuB,MAAM,kCAAkC,CAAC;AACxG,OAAO,EAA8D,yBAAyB,EAAE,MAAM,cAAc,CAAC;AACrH,OAAO,EAAE,0BAA0B,EAAE,MAAM,gCAAgC,CAAC;AAM5E,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAI1D,UAAU,qBACR,SAAQ,kBAAkB,EACxB,cAAc,EACd,gBAAgB,EAChB,cAAc,EACd,eAAe,EACf,+BAA+B,EAC/B,gBAAgB,EAChB,0BAA0B;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,eAAe,CAAC,EAAE,yBAAyB,CAAC,IAAI,CAAC,CAAC;IAClD,cAAc,CAAC,EAAE,yBAAyB,CAAC,gBAAgB,CAAC,CAAC;IAC7D,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC9B,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,OAAO,CAAC;IAC7B,KAAK,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;CAC7B;AAED,UAAU,4BAA4B;IACpC,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,MAAM,WAAW,mBAAoB,SAAQ,gBAAgB,CAAC,GAAG;IAC/D,KAAK,CAAC,OAAO,CAAC,EAAE,4BAA4B,GAAG,IAAI,CAAC;IACpD,IAAI,IAAI,IAAI,CAAC;IACb,KAAK,IAAI,IAAI,CAAC;CACf;AAED,QAAA,MAAM,gBAAgB,mGAuRrB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
|
|
@@ -6,6 +6,7 @@ import InternalInput from '../../../input/internal';
|
|
|
6
6
|
import { getBaseProps } from '../../base-component';
|
|
7
7
|
import { useFormFieldContext } from '../../context/form-field-context';
|
|
8
8
|
import { fireCancelableEvent, fireNonCancelableEvent } from '../../events';
|
|
9
|
+
import { useIMEComposition } from '../../hooks/use-ime-composition';
|
|
9
10
|
import { KeyCode } from '../../keycode';
|
|
10
11
|
import { nodeBelongs } from '../../utils/node-belongs';
|
|
11
12
|
import { processAttributes } from '../../utils/with-native-attributes';
|
|
@@ -25,6 +26,7 @@ const AutosuggestInput = React.forwardRef(({ value, onChange, onBlur, onFocus, o
|
|
|
25
26
|
setOpen(false);
|
|
26
27
|
fireNonCancelableEvent(onCloseDropdown, null);
|
|
27
28
|
};
|
|
29
|
+
const { isComposing } = useIMEComposition(inputRef);
|
|
28
30
|
useImperativeHandle(ref, () => ({
|
|
29
31
|
focus(options) {
|
|
30
32
|
var _a;
|
|
@@ -84,6 +86,10 @@ const AutosuggestInput = React.forwardRef(({ value, onChange, onBlur, onFocus, o
|
|
|
84
86
|
break;
|
|
85
87
|
}
|
|
86
88
|
case KeyCode.enter: {
|
|
89
|
+
if (isComposing()) {
|
|
90
|
+
event.preventDefault();
|
|
91
|
+
return;
|
|
92
|
+
}
|
|
87
93
|
if (open) {
|
|
88
94
|
if (!(onPressEnter === null || onPressEnter === void 0 ? void 0 : onPressEnter())) {
|
|
89
95
|
closeDropdown();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/autosuggest-input/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { Ref, useEffect, useImperativeHandle, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { AutosuggestProps } from '../../../autosuggest/interfaces';\nimport {\n BaseChangeDetail,\n BaseInputProps,\n InputAutoCorrect,\n InputClearLabel,\n InputKeyEvents,\n InputProps,\n} from '../../../input/interfaces';\nimport InternalInput from '../../../input/internal';\nimport { BaseComponentProps, getBaseProps } from '../../base-component';\nimport { FormFieldValidationControlProps, useFormFieldContext } from '../../context/form-field-context';\nimport { BaseKeyDetail, fireCancelableEvent, fireNonCancelableEvent, NonCancelableEventHandler } from '../../events';\nimport { InternalBaseComponentProps } from '../../hooks/use-base-component';\nimport { KeyCode } from '../../keycode';\nimport { nodeBelongs } from '../../utils/node-belongs';\nimport { processAttributes } from '../../utils/with-native-attributes';\nimport Dropdown from '../dropdown';\nimport { ExpandToViewport } from '../dropdown/interfaces';\n\nimport styles from './styles.css.js';\n\ninterface AutosuggestInputProps\n extends BaseComponentProps,\n BaseInputProps,\n InputAutoCorrect,\n InputKeyEvents,\n InputClearLabel,\n FormFieldValidationControlProps,\n ExpandToViewport,\n InternalBaseComponentProps {\n ariaControls?: string;\n ariaActivedescendant?: string;\n dropdownExpanded?: boolean;\n dropdownContentKey?: string;\n dropdownContentFocusable?: boolean;\n dropdownContent?: React.ReactNode;\n dropdownFooter?: React.ReactNode;\n dropdownWidth?: number;\n loopFocus?: boolean;\n onCloseDropdown?: NonCancelableEventHandler<null>;\n onDelayedInput?: NonCancelableEventHandler<BaseChangeDetail>;\n onPressArrowDown?: () => void;\n onPressArrowUp?: () => void;\n onPressEnter?: () => boolean;\n style?: InputProps['style'];\n}\n\ninterface AutosuggestInputFocusOptions {\n preventDropdown?: boolean;\n}\n\nexport interface AutosuggestInputRef extends AutosuggestProps.Ref {\n focus(options?: AutosuggestInputFocusOptions): void;\n open(): void;\n close(): void;\n}\n\nconst AutosuggestInput = React.forwardRef(\n (\n {\n value,\n onChange,\n onBlur,\n onFocus,\n onKeyUp,\n onKeyDown,\n name,\n placeholder,\n disabled,\n readOnly,\n autoFocus,\n ariaLabel,\n ariaRequired,\n disableBrowserAutocorrect = false,\n expandToViewport,\n ariaControls,\n ariaActivedescendant,\n clearAriaLabel,\n dropdownExpanded = true,\n dropdownContentKey,\n dropdownContentFocusable = false,\n dropdownContent = null,\n dropdownFooter = null,\n dropdownWidth,\n loopFocus,\n nativeInputAttributes,\n onCloseDropdown,\n onDelayedInput,\n onPressArrowDown,\n onPressArrowUp,\n onPressEnter,\n style,\n __internalRootRef,\n ...restProps\n }: AutosuggestInputProps,\n ref: Ref<AutosuggestInputRef>\n ) => {\n const baseProps = getBaseProps(restProps);\n const formFieldContext = useFormFieldContext(restProps);\n\n const inputRef = useRef<HTMLInputElement>(null);\n const dropdownContentRef = useRef<HTMLDivElement>(null);\n const dropdownFooterRef = useRef<HTMLDivElement>(null);\n const preventOpenOnFocusRef = useRef(false);\n const preventCloseOnBlurRef = useRef(false);\n\n const [open, setOpen] = useState(false);\n\n const openDropdown = () => !readOnly && setOpen(true);\n\n const closeDropdown = () => {\n setOpen(false);\n fireNonCancelableEvent(onCloseDropdown, null);\n };\n\n useImperativeHandle(ref, () => ({\n focus(options?: AutosuggestInputFocusOptions) {\n if (options?.preventDropdown) {\n preventOpenOnFocusRef.current = true;\n }\n inputRef.current?.focus();\n },\n select() {\n inputRef.current?.select();\n },\n open: openDropdown,\n close: closeDropdown,\n }));\n\n const handleBlur = () => {\n if (!preventCloseOnBlurRef.current) {\n closeDropdown();\n fireNonCancelableEvent(onBlur, null);\n }\n };\n\n const handleFocus = () => {\n if (!preventOpenOnFocusRef.current) {\n openDropdown();\n fireNonCancelableEvent(onFocus, null);\n }\n preventOpenOnFocusRef.current = false;\n };\n\n const fireKeydown = (event: CustomEvent<BaseKeyDetail>) => fireCancelableEvent(onKeyDown, event.detail, event);\n\n // Shared ESC key handler logic for both input and dropdown elements\n // When returnFocus is true (from dropdown elements), focus returns to input after closing\n const handleEscapeKey = (returnFocus: boolean) => {\n if (open) {\n closeDropdown();\n if (returnFocus) {\n // Return focus to input when closing from dropdown elements (e.g., recovery button)\n inputRef.current?.focus();\n }\n } else if (value) {\n fireNonCancelableEvent(onChange, { value: '' });\n }\n };\n\n const handleKeyDown = (event: CustomEvent<BaseKeyDetail>) => {\n switch (event.detail.keyCode) {\n case KeyCode.down: {\n onPressArrowDown?.();\n openDropdown();\n event.preventDefault();\n break;\n }\n case KeyCode.up: {\n onPressArrowUp?.();\n openDropdown();\n event.preventDefault();\n break;\n }\n case KeyCode.enter: {\n if (open) {\n if (!onPressEnter?.()) {\n closeDropdown();\n }\n event.preventDefault();\n }\n fireKeydown(event);\n break;\n }\n case KeyCode.escape: {\n // Use shared ESC handler, without focus restoration since ESC came from input\n handleEscapeKey(false);\n if (open || value) {\n event.stopPropagation();\n }\n event.preventDefault();\n fireKeydown(event);\n break;\n }\n default: {\n fireKeydown(event);\n }\n }\n };\n\n const handleChange = (value: string) => {\n openDropdown();\n fireNonCancelableEvent(onChange, { value });\n };\n\n const handleDelayedInput = (value: string) => {\n fireNonCancelableEvent(onDelayedInput, { value });\n };\n\n const handleDropdownMouseDown: React.MouseEventHandler = event => {\n // Prevent currently focused element from losing focus.\n if (!dropdownContentFocusable) {\n event.preventDefault();\n }\n // Prevent closing dropdown on click inside.\n else {\n preventCloseOnBlurRef.current = true;\n requestAnimationFrame(() => {\n preventCloseOnBlurRef.current = false;\n });\n }\n };\n\n const expanded = open && dropdownExpanded;\n const nativeAttributes: BaseInputProps['nativeInputAttributes'] = {\n name,\n placeholder,\n autoFocus,\n onClick: openDropdown,\n role: 'combobox',\n 'aria-autocomplete': 'list',\n 'aria-expanded': expanded,\n 'aria-controls': open ? ariaControls : undefined,\n // 'aria-owns' needed for safari+vo to announce activedescendant content\n 'aria-owns': open ? ariaControls : undefined,\n 'aria-label': ariaLabel,\n 'aria-activedescendant': ariaActivedescendant,\n };\n\n // Closes dropdown when outside click is detected.\n // Similar to the internal dropdown implementation but includes the target as well.\n useEffect(() => {\n if (!open) {\n return;\n }\n\n const clickListener = (event: MouseEvent) => {\n if (\n !nodeBelongs(inputRef.current, event.target) &&\n !nodeBelongs(dropdownContentRef.current, event.target) &&\n !nodeBelongs(dropdownFooterRef.current, event.target)\n ) {\n closeDropdown();\n }\n };\n\n window.addEventListener('mousedown', clickListener);\n\n return () => {\n window.removeEventListener('mousedown', clickListener);\n };\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [open]);\n\n const handleDropdownKeyDown: React.KeyboardEventHandler = event => {\n // Handle ESC key from focusable elements inside the dropdown (e.g., recovery button)\n // but NOT from the input itself (that's handled by handleKeyDown)\n const isFromInput = event.target === inputRef.current || nodeBelongs(inputRef.current, event.target);\n\n if (event.key === 'Escape' && !isFromInput) {\n event.stopPropagation();\n event.preventDefault();\n // Use shared ESC handler with focus restoration since ESC came from dropdown element\n handleEscapeKey(true);\n }\n };\n\n return (\n <div {...baseProps} className={clsx(baseProps.className, styles.root)} ref={__internalRootRef}>\n <Dropdown\n minWidth={dropdownWidth}\n stretchWidth={!dropdownWidth}\n stretchBeyondTriggerWidth={true}\n contentKey={dropdownContentKey}\n onFocus={handleFocus}\n onBlur={handleBlur}\n trigger={\n <InternalInput\n type=\"visualSearch\"\n value={value}\n onChange={event => handleChange(event.detail.value)}\n __onDelayedInput={event => handleDelayedInput(event.detail.value)}\n onKeyDown={handleKeyDown}\n onKeyUp={onKeyUp}\n disabled={disabled}\n disableBrowserAutocorrect={disableBrowserAutocorrect}\n readOnly={readOnly}\n ariaRequired={ariaRequired}\n clearAriaLabel={clearAriaLabel}\n ref={inputRef}\n autoComplete={false}\n nativeInputAttributes={processAttributes(nativeAttributes, nativeInputAttributes, 'Autosuggest')}\n __skipNativeAttributesWarnings={Object.keys(nativeAttributes)}\n style={style}\n {...formFieldContext}\n />\n }\n onMouseDown={handleDropdownMouseDown}\n open={open && (!!dropdownContent || !!dropdownFooter)}\n footer={\n dropdownFooterRef && (\n <div ref={dropdownFooterRef} className={styles['dropdown-footer']} onKeyDown={handleDropdownKeyDown}>\n {open && dropdownFooter ? dropdownFooter : null}\n </div>\n )\n }\n expandToViewport={expandToViewport}\n loopFocus={loopFocus}\n >\n {open && dropdownContent ? (\n <div ref={dropdownContentRef} className={styles['dropdown-content']}>\n {dropdownContent}\n </div>\n ) : null}\n </Dropdown>\n </div>\n );\n }\n);\n\nexport default AutosuggestInput;\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/autosuggest-input/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { Ref, useEffect, useImperativeHandle, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { AutosuggestProps } from '../../../autosuggest/interfaces';\nimport {\n BaseChangeDetail,\n BaseInputProps,\n InputAutoCorrect,\n InputClearLabel,\n InputKeyEvents,\n InputProps,\n} from '../../../input/interfaces';\nimport InternalInput from '../../../input/internal';\nimport { BaseComponentProps, getBaseProps } from '../../base-component';\nimport { FormFieldValidationControlProps, useFormFieldContext } from '../../context/form-field-context';\nimport { BaseKeyDetail, fireCancelableEvent, fireNonCancelableEvent, NonCancelableEventHandler } from '../../events';\nimport { InternalBaseComponentProps } from '../../hooks/use-base-component';\nimport { useIMEComposition } from '../../hooks/use-ime-composition';\nimport { KeyCode } from '../../keycode';\nimport { nodeBelongs } from '../../utils/node-belongs';\nimport { processAttributes } from '../../utils/with-native-attributes';\nimport Dropdown from '../dropdown';\nimport { ExpandToViewport } from '../dropdown/interfaces';\n\nimport styles from './styles.css.js';\n\ninterface AutosuggestInputProps\n extends BaseComponentProps,\n BaseInputProps,\n InputAutoCorrect,\n InputKeyEvents,\n InputClearLabel,\n FormFieldValidationControlProps,\n ExpandToViewport,\n InternalBaseComponentProps {\n ariaControls?: string;\n ariaActivedescendant?: string;\n dropdownExpanded?: boolean;\n dropdownContentKey?: string;\n dropdownContentFocusable?: boolean;\n dropdownContent?: React.ReactNode;\n dropdownFooter?: React.ReactNode;\n dropdownWidth?: number;\n loopFocus?: boolean;\n onCloseDropdown?: NonCancelableEventHandler<null>;\n onDelayedInput?: NonCancelableEventHandler<BaseChangeDetail>;\n onPressArrowDown?: () => void;\n onPressArrowUp?: () => void;\n onPressEnter?: () => boolean;\n style?: InputProps['style'];\n}\n\ninterface AutosuggestInputFocusOptions {\n preventDropdown?: boolean;\n}\n\nexport interface AutosuggestInputRef extends AutosuggestProps.Ref {\n focus(options?: AutosuggestInputFocusOptions): void;\n open(): void;\n close(): void;\n}\n\nconst AutosuggestInput = React.forwardRef(\n (\n {\n value,\n onChange,\n onBlur,\n onFocus,\n onKeyUp,\n onKeyDown,\n name,\n placeholder,\n disabled,\n readOnly,\n autoFocus,\n ariaLabel,\n ariaRequired,\n disableBrowserAutocorrect = false,\n expandToViewport,\n ariaControls,\n ariaActivedescendant,\n clearAriaLabel,\n dropdownExpanded = true,\n dropdownContentKey,\n dropdownContentFocusable = false,\n dropdownContent = null,\n dropdownFooter = null,\n dropdownWidth,\n loopFocus,\n nativeInputAttributes,\n onCloseDropdown,\n onDelayedInput,\n onPressArrowDown,\n onPressArrowUp,\n onPressEnter,\n style,\n __internalRootRef,\n ...restProps\n }: AutosuggestInputProps,\n ref: Ref<AutosuggestInputRef>\n ) => {\n const baseProps = getBaseProps(restProps);\n const formFieldContext = useFormFieldContext(restProps);\n\n const inputRef = useRef<HTMLInputElement>(null);\n const dropdownContentRef = useRef<HTMLDivElement>(null);\n const dropdownFooterRef = useRef<HTMLDivElement>(null);\n const preventOpenOnFocusRef = useRef(false);\n const preventCloseOnBlurRef = useRef(false);\n\n const [open, setOpen] = useState(false);\n\n const openDropdown = () => !readOnly && setOpen(true);\n\n const closeDropdown = () => {\n setOpen(false);\n fireNonCancelableEvent(onCloseDropdown, null);\n };\n\n const { isComposing } = useIMEComposition(inputRef);\n\n useImperativeHandle(ref, () => ({\n focus(options?: AutosuggestInputFocusOptions) {\n if (options?.preventDropdown) {\n preventOpenOnFocusRef.current = true;\n }\n inputRef.current?.focus();\n },\n select() {\n inputRef.current?.select();\n },\n open: openDropdown,\n close: closeDropdown,\n }));\n\n const handleBlur = () => {\n if (!preventCloseOnBlurRef.current) {\n closeDropdown();\n fireNonCancelableEvent(onBlur, null);\n }\n };\n\n const handleFocus = () => {\n if (!preventOpenOnFocusRef.current) {\n openDropdown();\n fireNonCancelableEvent(onFocus, null);\n }\n preventOpenOnFocusRef.current = false;\n };\n\n const fireKeydown = (event: CustomEvent<BaseKeyDetail>) => fireCancelableEvent(onKeyDown, event.detail, event);\n\n // Shared ESC key handler logic for both input and dropdown elements\n // When returnFocus is true (from dropdown elements), focus returns to input after closing\n const handleEscapeKey = (returnFocus: boolean) => {\n if (open) {\n closeDropdown();\n if (returnFocus) {\n // Return focus to input when closing from dropdown elements (e.g., recovery button)\n inputRef.current?.focus();\n }\n } else if (value) {\n fireNonCancelableEvent(onChange, { value: '' });\n }\n };\n\n const handleKeyDown = (event: CustomEvent<BaseKeyDetail>) => {\n switch (event.detail.keyCode) {\n case KeyCode.down: {\n onPressArrowDown?.();\n openDropdown();\n event.preventDefault();\n break;\n }\n case KeyCode.up: {\n onPressArrowUp?.();\n openDropdown();\n event.preventDefault();\n break;\n }\n case KeyCode.enter: {\n if (isComposing()) {\n event.preventDefault();\n return;\n }\n\n if (open) {\n if (!onPressEnter?.()) {\n closeDropdown();\n }\n event.preventDefault();\n }\n fireKeydown(event);\n break;\n }\n case KeyCode.escape: {\n // Use shared ESC handler, without focus restoration since ESC came from input\n handleEscapeKey(false);\n if (open || value) {\n event.stopPropagation();\n }\n event.preventDefault();\n fireKeydown(event);\n break;\n }\n default: {\n fireKeydown(event);\n }\n }\n };\n\n const handleChange = (value: string) => {\n openDropdown();\n fireNonCancelableEvent(onChange, { value });\n };\n\n const handleDelayedInput = (value: string) => {\n fireNonCancelableEvent(onDelayedInput, { value });\n };\n\n const handleDropdownMouseDown: React.MouseEventHandler = event => {\n // Prevent currently focused element from losing focus.\n if (!dropdownContentFocusable) {\n event.preventDefault();\n }\n // Prevent closing dropdown on click inside.\n else {\n preventCloseOnBlurRef.current = true;\n requestAnimationFrame(() => {\n preventCloseOnBlurRef.current = false;\n });\n }\n };\n\n const expanded = open && dropdownExpanded;\n const nativeAttributes: BaseInputProps['nativeInputAttributes'] = {\n name,\n placeholder,\n autoFocus,\n onClick: openDropdown,\n role: 'combobox',\n 'aria-autocomplete': 'list',\n 'aria-expanded': expanded,\n 'aria-controls': open ? ariaControls : undefined,\n // 'aria-owns' needed for safari+vo to announce activedescendant content\n 'aria-owns': open ? ariaControls : undefined,\n 'aria-label': ariaLabel,\n 'aria-activedescendant': ariaActivedescendant,\n };\n\n // Closes dropdown when outside click is detected.\n // Similar to the internal dropdown implementation but includes the target as well.\n useEffect(() => {\n if (!open) {\n return;\n }\n\n const clickListener = (event: MouseEvent) => {\n if (\n !nodeBelongs(inputRef.current, event.target) &&\n !nodeBelongs(dropdownContentRef.current, event.target) &&\n !nodeBelongs(dropdownFooterRef.current, event.target)\n ) {\n closeDropdown();\n }\n };\n\n window.addEventListener('mousedown', clickListener);\n\n return () => {\n window.removeEventListener('mousedown', clickListener);\n };\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [open]);\n\n const handleDropdownKeyDown: React.KeyboardEventHandler = event => {\n // Handle ESC key from focusable elements inside the dropdown (e.g., recovery button)\n // but NOT from the input itself (that's handled by handleKeyDown)\n const isFromInput = event.target === inputRef.current || nodeBelongs(inputRef.current, event.target);\n\n if (event.key === 'Escape' && !isFromInput) {\n event.stopPropagation();\n event.preventDefault();\n // Use shared ESC handler with focus restoration since ESC came from dropdown element\n handleEscapeKey(true);\n }\n };\n\n return (\n <div {...baseProps} className={clsx(baseProps.className, styles.root)} ref={__internalRootRef}>\n <Dropdown\n minWidth={dropdownWidth}\n stretchWidth={!dropdownWidth}\n stretchBeyondTriggerWidth={true}\n contentKey={dropdownContentKey}\n onFocus={handleFocus}\n onBlur={handleBlur}\n trigger={\n <InternalInput\n type=\"visualSearch\"\n value={value}\n onChange={event => handleChange(event.detail.value)}\n __onDelayedInput={event => handleDelayedInput(event.detail.value)}\n onKeyDown={handleKeyDown}\n onKeyUp={onKeyUp}\n disabled={disabled}\n disableBrowserAutocorrect={disableBrowserAutocorrect}\n readOnly={readOnly}\n ariaRequired={ariaRequired}\n clearAriaLabel={clearAriaLabel}\n ref={inputRef}\n autoComplete={false}\n nativeInputAttributes={processAttributes(nativeAttributes, nativeInputAttributes, 'Autosuggest')}\n __skipNativeAttributesWarnings={Object.keys(nativeAttributes)}\n style={style}\n {...formFieldContext}\n />\n }\n onMouseDown={handleDropdownMouseDown}\n open={open && (!!dropdownContent || !!dropdownFooter)}\n footer={\n dropdownFooterRef && (\n <div ref={dropdownFooterRef} className={styles['dropdown-footer']} onKeyDown={handleDropdownKeyDown}>\n {open && dropdownFooter ? dropdownFooter : null}\n </div>\n )\n }\n expandToViewport={expandToViewport}\n loopFocus={loopFocus}\n >\n {open && dropdownContent ? (\n <div ref={dropdownContentRef} className={styles['dropdown-content']}>\n {dropdownContent}\n </div>\n ) : null}\n </Dropdown>\n </div>\n );\n }\n);\n\nexport default AutosuggestInput;\n"]}
|
|
@@ -1,27 +1,27 @@
|
|
|
1
1
|
|
|
2
2
|
import './styles.scoped.css';
|
|
3
3
|
export default {
|
|
4
|
-
"selectable-item": "awsui_selectable-
|
|
5
|
-
"parent": "
|
|
6
|
-
"interactiveGroups": "
|
|
7
|
-
"highlighted": "
|
|
8
|
-
"selected": "
|
|
9
|
-
"selectable-item-content": "awsui_selectable-item-
|
|
10
|
-
"pad-bottom": "awsui_pad-
|
|
11
|
-
"virtual": "
|
|
12
|
-
"has-background": "awsui_has-
|
|
13
|
-
"child": "
|
|
14
|
-
"disabled": "
|
|
15
|
-
"is-keyboard": "awsui_is-
|
|
16
|
-
"visual-refresh": "awsui_visual-
|
|
17
|
-
"next-item-selected": "awsui_next-item-
|
|
18
|
-
"previous-item-selected": "awsui_previous-item-
|
|
19
|
-
"sticky": "
|
|
20
|
-
"with-scrollbar": "awsui_with-
|
|
21
|
-
"after-header": "awsui_after-
|
|
22
|
-
"measure-strut": "awsui_measure-
|
|
23
|
-
"screenreader-content": "awsui_screenreader-
|
|
24
|
-
"option-content": "awsui_option-
|
|
25
|
-
"select-all": "awsui_select-
|
|
4
|
+
"selectable-item": "awsui_selectable-item_15o6u_11e6r_145",
|
|
5
|
+
"parent": "awsui_parent_15o6u_11e6r_164",
|
|
6
|
+
"interactiveGroups": "awsui_interactiveGroups_15o6u_11e6r_164",
|
|
7
|
+
"highlighted": "awsui_highlighted_15o6u_11e6r_164",
|
|
8
|
+
"selected": "awsui_selected_15o6u_11e6r_164",
|
|
9
|
+
"selectable-item-content": "awsui_selectable-item-content_15o6u_11e6r_167",
|
|
10
|
+
"pad-bottom": "awsui_pad-bottom_15o6u_11e6r_171",
|
|
11
|
+
"virtual": "awsui_virtual_15o6u_11e6r_178",
|
|
12
|
+
"has-background": "awsui_has-background_15o6u_11e6r_181",
|
|
13
|
+
"child": "awsui_child_15o6u_11e6r_184",
|
|
14
|
+
"disabled": "awsui_disabled_15o6u_11e6r_190",
|
|
15
|
+
"is-keyboard": "awsui_is-keyboard_15o6u_11e6r_205",
|
|
16
|
+
"visual-refresh": "awsui_visual-refresh_15o6u_11e6r_215",
|
|
17
|
+
"next-item-selected": "awsui_next-item-selected_15o6u_11e6r_229",
|
|
18
|
+
"previous-item-selected": "awsui_previous-item-selected_15o6u_11e6r_239",
|
|
19
|
+
"sticky": "awsui_sticky_15o6u_11e6r_271",
|
|
20
|
+
"with-scrollbar": "awsui_with-scrollbar_15o6u_11e6r_290",
|
|
21
|
+
"after-header": "awsui_after-header_15o6u_11e6r_293",
|
|
22
|
+
"measure-strut": "awsui_measure-strut_15o6u_11e6r_322",
|
|
23
|
+
"screenreader-content": "awsui_screenreader-content_15o6u_11e6r_334",
|
|
24
|
+
"option-content": "awsui_option-content_15o6u_11e6r_340",
|
|
25
|
+
"select-all": "awsui_select-all_15o6u_11e6r_344"
|
|
26
26
|
};
|
|
27
27
|
|
|
@@ -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_selectable-
|
|
145
|
+
.awsui_selectable-item_15o6u_11e6r_145:not(#\9) {
|
|
146
146
|
font-size: var(--font-size-body-m-a7nh2n, 14px);
|
|
147
147
|
line-height: var(--line-height-body-m-2mh3ke, 20px);
|
|
148
148
|
color: var(--color-text-body-default-vvtq8u, #0f141a);
|
|
@@ -161,191 +161,165 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
161
161
|
overflow: hidden;
|
|
162
162
|
box-shadow: inset 0 var(--border-divider-list-width-tdfx1x, 1px) 0 0 var(--color-border-dropdown-item-default-kape37, #c6c6cd), inset 0 calc(-1 * var(--border-divider-list-width-tdfx1x, 1px)) 0 0 var(--color-border-dropdown-item-default-kape37, #c6c6cd);
|
|
163
163
|
}
|
|
164
|
-
.awsui_selectable-
|
|
164
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_parent_15o6u_11e6r_164.awsui_interactiveGroups_15o6u_11e6r_164:not(#\9):not(.awsui_highlighted_15o6u_11e6r_164):not(.awsui_selected_15o6u_11e6r_164) {
|
|
165
165
|
box-shadow: inset 0 var(--border-divider-list-width-tdfx1x, 1px) 0 0 var(--color-border-dropdown-item-default-kape37, #c6c6cd), inset 0 calc(-1 * var(--border-divider-list-width-tdfx1x, 1px)) 0 0 var(--color-border-dropdown-item-default-kape37, #c6c6cd);
|
|
166
166
|
}
|
|
167
|
-
.awsui_selectable-
|
|
167
|
+
.awsui_selectable-item_15o6u_11e6r_145 > .awsui_selectable-item-content_15o6u_11e6r_167:not(#\9) {
|
|
168
168
|
padding-block: var(--space-xxs-hwfkai, 4px);
|
|
169
169
|
padding-inline: var(--space-field-horizontal-0aq2ch, 12px);
|
|
170
170
|
}
|
|
171
|
-
.awsui_selectable-
|
|
171
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_pad-bottom_15o6u_11e6r_171:not(#\9) {
|
|
172
172
|
padding-block-end: var(--border-item-width-miijiw, 2px);
|
|
173
173
|
box-shadow: inset 0 var(--border-divider-list-width-tdfx1x, 1px) 0 0 var(--color-border-dropdown-item-default-kape37, #c6c6cd);
|
|
174
174
|
}
|
|
175
|
-
.awsui_selectable-
|
|
175
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_pad-bottom_15o6u_11e6r_171 > .awsui_selectable-item-content_15o6u_11e6r_167:not(#\9) {
|
|
176
176
|
padding-block-end: calc(var(--space-xxs-hwfkai, 4px) + var(--space-xxxs-pajhad, 2px));
|
|
177
177
|
}
|
|
178
|
-
.awsui_selectable-
|
|
178
|
+
.awsui_selectable-item_15o6u_11e6r_145:not(#\9):not(:first-child), .awsui_selectable-item_15o6u_11e6r_145.awsui_virtual_15o6u_11e6r_178:not(#\9) {
|
|
179
179
|
margin-block-start: calc(-1 * var(--border-item-width-miijiw, 2px));
|
|
180
180
|
}
|
|
181
|
-
.awsui_selectable-
|
|
181
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_has-background_15o6u_11e6r_181:not(#\9) {
|
|
182
182
|
background-color: var(--color-background-dropdown-item-hover-yunepc, #f3f3f7);
|
|
183
183
|
}
|
|
184
|
-
.awsui_selectable-
|
|
184
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_child_15o6u_11e6r_184:not(#\9) {
|
|
185
185
|
padding-inline-start: var(--border-item-width-miijiw, 2px);
|
|
186
186
|
}
|
|
187
|
-
.awsui_selectable-
|
|
187
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_child_15o6u_11e6r_184 > .awsui_selectable-item-content_15o6u_11e6r_167:not(#\9) {
|
|
188
188
|
padding-inline-start: var(--space-xxl-32srm4, 32px);
|
|
189
189
|
}
|
|
190
|
-
.awsui_selectable-
|
|
190
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_disabled_15o6u_11e6r_190 > .awsui_selectable-item-content_15o6u_11e6r_167:not(#\9) {
|
|
191
191
|
color: var(--color-text-dropdown-item-disabled-8m65hf, #b4b4bb);
|
|
192
192
|
}
|
|
193
|
-
.awsui_selectable-
|
|
193
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_highlighted_15o6u_11e6r_164:not(#\9), .awsui_selectable-item_15o6u_11e6r_145.awsui_selected_15o6u_11e6r_164:not(#\9) {
|
|
194
194
|
color: var(--color-text-dropdown-item-highlighted-yr1px8, #0f141a);
|
|
195
195
|
border-start-start-radius: var(--border-radius-item-iwaia5, 8px);
|
|
196
196
|
border-start-end-radius: var(--border-radius-item-iwaia5, 8px);
|
|
197
197
|
border-end-start-radius: var(--border-radius-item-iwaia5, 8px);
|
|
198
198
|
border-end-end-radius: var(--border-radius-item-iwaia5, 8px);
|
|
199
|
-
border-width: 0;
|
|
200
|
-
padding-block: 0;
|
|
201
|
-
padding-inline: 0;
|
|
202
|
-
}
|
|
203
|
-
.awsui_selectable-item_15o6u_7ubzk_145.awsui_highlighted_15o6u_7ubzk_164 > .awsui_selectable-item-content_15o6u_7ubzk_167:not(#\9), .awsui_selectable-item_15o6u_7ubzk_145.awsui_selected_15o6u_7ubzk_164 > .awsui_selectable-item-content_15o6u_7ubzk_167:not(#\9) {
|
|
204
|
-
padding-block: calc(var(--space-xxs-hwfkai, 4px) + var(--border-item-width-miijiw, 2px));
|
|
205
|
-
padding-inline: calc(var(--space-field-horizontal-0aq2ch, 12px) + var(--border-item-width-miijiw, 2px));
|
|
206
|
-
}
|
|
207
|
-
.awsui_selectable-item_15o6u_7ubzk_145.awsui_highlighted_15o6u_7ubzk_164.awsui_child_15o6u_7ubzk_184 > .awsui_selectable-item-content_15o6u_7ubzk_167:not(#\9), .awsui_selectable-item_15o6u_7ubzk_145.awsui_selected_15o6u_7ubzk_164.awsui_child_15o6u_7ubzk_184 > .awsui_selectable-item-content_15o6u_7ubzk_167:not(#\9) {
|
|
208
|
-
padding-inline-start: calc(var(--space-xxl-32srm4, 32px) + var(--border-item-width-miijiw, 2px));
|
|
209
|
-
}
|
|
210
|
-
.awsui_selectable-item_15o6u_7ubzk_145.awsui_highlighted_15o6u_7ubzk_164.awsui_pad-bottom_15o6u_7ubzk_171 > .awsui_selectable-item-content_15o6u_7ubzk_167:not(#\9), .awsui_selectable-item_15o6u_7ubzk_145.awsui_selected_15o6u_7ubzk_164.awsui_pad-bottom_15o6u_7ubzk_171 > .awsui_selectable-item-content_15o6u_7ubzk_167:not(#\9) {
|
|
211
|
-
padding-block-end: calc(var(--space-xxs-hwfkai, 4px) + var(--space-xxxs-pajhad, 2px) + var(--border-item-width-miijiw, 2px));
|
|
212
199
|
}
|
|
213
|
-
.awsui_selectable-
|
|
200
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_highlighted_15o6u_11e6r_164:not(#\9) {
|
|
214
201
|
z-index: 3;
|
|
215
202
|
background-color: var(--color-background-dropdown-item-hover-yunepc, #f3f3f7);
|
|
216
203
|
box-shadow: inset 0 0 0 var(--border-item-width-miijiw, 2px) var(--color-border-dropdown-item-hover-aqfuxq, #8c8c94);
|
|
217
204
|
}
|
|
218
|
-
.awsui_selectable-
|
|
205
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_highlighted_15o6u_11e6r_164.awsui_is-keyboard_15o6u_11e6r_205:not(#\9) {
|
|
219
206
|
box-shadow: inset 0 0 0 var(--border-item-width-miijiw, 2px) var(--color-border-dropdown-item-focused-zacqlp, #424650);
|
|
220
207
|
}
|
|
221
|
-
.awsui_selectable-
|
|
208
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_highlighted_15o6u_11e6r_164.awsui_disabled_15o6u_11e6r_190:not(#\9) {
|
|
222
209
|
box-shadow: inset 0 0 0 var(--border-item-width-miijiw, 2px) var(--color-border-dropdown-item-dimmed-hover-ga9sch, #8c8c94);
|
|
223
210
|
background-color: var(--color-background-dropdown-item-dimmed-dhho03, transparent);
|
|
224
211
|
}
|
|
225
|
-
.awsui_selectable-
|
|
212
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_highlighted_15o6u_11e6r_164.awsui_disabled_15o6u_11e6r_190 > .awsui_selectable-item-content_15o6u_11e6r_167:not(#\9) {
|
|
226
213
|
color: var(--color-text-dropdown-item-dimmed-tq8vh3, #b4b4bb);
|
|
227
214
|
}
|
|
228
|
-
.awsui_selectable-
|
|
215
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_highlighted_15o6u_11e6r_164:not(#\9):not(.awsui_visual-refresh_15o6u_11e6r_215).awsui_is-keyboard_15o6u_11e6r_205 {
|
|
229
216
|
box-shadow: inset 0 0 0 var(--border-control-focus-ring-shadow-spread-9mjajk, 1px) var(--color-border-item-focused-uk47pl, #006ce0);
|
|
230
217
|
}
|
|
231
|
-
.awsui_selectable-
|
|
218
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_selected_15o6u_11e6r_164:not(#\9) {
|
|
232
219
|
z-index: 2;
|
|
233
220
|
background-color: var(--color-background-dropdown-item-selected-f3v6te, #f0fbff);
|
|
234
221
|
box-shadow: inset 0 0 0 var(--border-item-width-miijiw, 2px) var(--color-border-dropdown-item-selected-dl2ezh, #006ce0);
|
|
235
222
|
}
|
|
236
|
-
.awsui_selectable-
|
|
223
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_selected_15o6u_11e6r_164.awsui_highlighted_15o6u_11e6r_164:not(#\9) {
|
|
237
224
|
box-shadow: inset 0 0 0 var(--border-item-width-miijiw, 2px) var(--color-border-dropdown-item-selected-dl2ezh, #006ce0), inset 0 0 0 calc(2 * var(--border-item-width-miijiw, 2px)) var(--color-border-dropdown-item-hover-aqfuxq, #8c8c94);
|
|
238
225
|
}
|
|
239
|
-
.awsui_selectable-
|
|
226
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_selected_15o6u_11e6r_164.awsui_highlighted_15o6u_11e6r_164.awsui_is-keyboard_15o6u_11e6r_205:not(#\9) {
|
|
240
227
|
box-shadow: inset 0 0 0 var(--border-item-width-miijiw, 2px) var(--color-border-dropdown-item-selected-dl2ezh, #006ce0), inset 0 0 0 calc(2 * var(--border-item-width-miijiw, 2px)) var(--color-border-dropdown-item-focused-zacqlp, #424650);
|
|
241
228
|
}
|
|
242
|
-
.awsui_selectable-
|
|
229
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_selected_15o6u_11e6r_164.awsui_next-item-selected_15o6u_11e6r_229:not(#\9) {
|
|
243
230
|
border-end-start-radius: 0;
|
|
244
231
|
border-end-end-radius: 0;
|
|
245
232
|
}
|
|
246
|
-
.awsui_selectable-
|
|
233
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_selected_15o6u_11e6r_164.awsui_highlighted_15o6u_11e6r_164:not(#\9):not(.awsui_visual-refresh_15o6u_11e6r_215) {
|
|
247
234
|
box-shadow: inset 0 0 0 var(--border-item-width-miijiw, 2px) var(--color-border-dropdown-item-hover-aqfuxq, #8c8c94);
|
|
248
235
|
}
|
|
249
|
-
.awsui_selectable-
|
|
236
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_selected_15o6u_11e6r_164.awsui_highlighted_15o6u_11e6r_164:not(#\9):not(.awsui_visual-refresh_15o6u_11e6r_215).awsui_is-keyboard_15o6u_11e6r_205 {
|
|
250
237
|
box-shadow: inset 0 0 0 var(--border-item-width-miijiw, 2px) var(--color-border-dropdown-item-focused-zacqlp, #424650);
|
|
251
238
|
}
|
|
252
|
-
.awsui_selectable-
|
|
239
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_selected_15o6u_11e6r_164 + .awsui_selectable-item_15o6u_11e6r_145.awsui_selected_15o6u_11e6r_164:not(#\9), .awsui_selectable-item_15o6u_11e6r_145.awsui_selected_15o6u_11e6r_164.awsui_previous-item-selected_15o6u_11e6r_239:not(#\9) {
|
|
253
240
|
border-start-start-radius: 0;
|
|
254
241
|
border-start-end-radius: 0;
|
|
255
242
|
}
|
|
256
|
-
.awsui_selectable-
|
|
243
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_parent_15o6u_11e6r_164:not(#\9):not(.awsui_disabled_15o6u_11e6r_190) > .awsui_selectable-item-content_15o6u_11e6r_167 {
|
|
257
244
|
color: var(--color-text-dropdown-group-label-2tmyik, #424650);
|
|
258
245
|
}
|
|
259
|
-
.awsui_selectable-
|
|
246
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_parent_15o6u_11e6r_164:not(#\9):not(.awsui_interactiveGroups_15o6u_11e6r_164) {
|
|
260
247
|
box-shadow: inset 0 var(--border-divider-list-width-tdfx1x, 1px) 0 0 var(--color-border-dropdown-group-ylcnh8, #c6c6cd), inset 0 calc(-1 * var(--border-divider-list-width-tdfx1x, 1px)) 0 0 var(--color-border-dropdown-item-default-kape37, #c6c6cd);
|
|
261
248
|
padding-block: 0;
|
|
262
249
|
padding-inline: 0;
|
|
263
250
|
}
|
|
264
|
-
.awsui_selectable-
|
|
251
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_parent_15o6u_11e6r_164:not(#\9):not(.awsui_interactiveGroups_15o6u_11e6r_164):not(:has(> .awsui_selectable-item-content_15o6u_11e6r_167)) {
|
|
265
252
|
padding-block: var(--border-item-width-miijiw, 2px);
|
|
266
253
|
padding-inline: var(--border-item-width-miijiw, 2px);
|
|
267
254
|
}
|
|
268
|
-
.awsui_selectable-
|
|
255
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_parent_15o6u_11e6r_164:not(#\9):not(.awsui_interactiveGroups_15o6u_11e6r_164) > .awsui_selectable-item-content_15o6u_11e6r_167 {
|
|
269
256
|
padding-block: var(--space-xs-ymlm0b, 8px);
|
|
270
257
|
padding-inline: var(--space-xs-ymlm0b, 8px);
|
|
271
258
|
font-weight: bold;
|
|
272
259
|
}
|
|
273
|
-
.awsui_selectable-
|
|
260
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_parent_15o6u_11e6r_164.awsui_interactiveGroups_15o6u_11e6r_164 > .awsui_selectable-item-content_15o6u_11e6r_167:not(#\9) {
|
|
274
261
|
padding-block: var(--space-xs-ymlm0b, 8px);
|
|
275
262
|
padding-inline: var(--space-field-horizontal-0aq2ch, 12px);
|
|
276
263
|
font-weight: bold;
|
|
277
264
|
}
|
|
278
|
-
.awsui_selectable-
|
|
265
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_parent_15o6u_11e6r_164.awsui_interactiveGroups_15o6u_11e6r_164.awsui_highlighted_15o6u_11e6r_164 > .awsui_selectable-item-content_15o6u_11e6r_167:not(#\9) {
|
|
279
266
|
color: var(--color-text-dropdown-item-highlighted-yr1px8, #0f141a);
|
|
280
267
|
}
|
|
281
|
-
.awsui_selectable-
|
|
282
|
-
border-width: 0;
|
|
283
|
-
padding-block: 0;
|
|
284
|
-
padding-inline: 0;
|
|
285
|
-
}
|
|
286
|
-
.awsui_selectable-item_15o6u_7ubzk_145.awsui_parent_15o6u_7ubzk_164.awsui_interactiveGroups_15o6u_7ubzk_164.awsui_highlighted_15o6u_7ubzk_164 > .awsui_selectable-item-content_15o6u_7ubzk_167:not(#\9), .awsui_selectable-item_15o6u_7ubzk_145.awsui_parent_15o6u_7ubzk_164.awsui_interactiveGroups_15o6u_7ubzk_164.awsui_selected_15o6u_7ubzk_164 > .awsui_selectable-item-content_15o6u_7ubzk_167:not(#\9) {
|
|
287
|
-
padding-block: calc(var(--space-xxs-hwfkai, 4px) + var(--border-item-width-miijiw, 2px));
|
|
288
|
-
padding-inline: calc(var(--space-field-horizontal-0aq2ch, 12px) + var(--border-item-width-miijiw, 2px));
|
|
289
|
-
}
|
|
290
|
-
.awsui_selectable-item_15o6u_7ubzk_145.awsui_parent_15o6u_7ubzk_164.awsui_interactiveGroups_15o6u_7ubzk_164.awsui_highlighted_15o6u_7ubzk_164 > .awsui_selectable-item-content_15o6u_7ubzk_167:not(#\9), .awsui_selectable-item_15o6u_7ubzk_145.awsui_parent_15o6u_7ubzk_164.awsui_interactiveGroups_15o6u_7ubzk_164.awsui_selected_15o6u_7ubzk_164 > .awsui_selectable-item-content_15o6u_7ubzk_167:not(#\9) {
|
|
291
|
-
padding-block: calc(var(--space-xs-ymlm0b, 8px) + var(--border-item-width-miijiw, 2px));
|
|
292
|
-
padding-inline: calc(var(--space-field-horizontal-0aq2ch, 12px) + var(--border-item-width-miijiw, 2px));
|
|
293
|
-
}
|
|
294
|
-
.awsui_selectable-item_15o6u_7ubzk_145:not(#\9):not(.awsui_disabled_15o6u_7ubzk_190):not(.awsui_parent_15o6u_7ubzk_164), .awsui_selectable-item_15o6u_7ubzk_145.awsui_interactiveGroups_15o6u_7ubzk_164:not(#\9):not(.awsui_disabled_15o6u_7ubzk_190) {
|
|
268
|
+
.awsui_selectable-item_15o6u_11e6r_145:not(#\9):not(.awsui_disabled_15o6u_11e6r_190):not(.awsui_parent_15o6u_11e6r_164), .awsui_selectable-item_15o6u_11e6r_145.awsui_interactiveGroups_15o6u_11e6r_164:not(#\9):not(.awsui_disabled_15o6u_11e6r_190) {
|
|
295
269
|
cursor: pointer;
|
|
296
270
|
}
|
|
297
|
-
.awsui_selectable-
|
|
271
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_sticky_15o6u_11e6r_271 + .awsui_selectable-item_15o6u_11e6r_145:not(#\9):not(.awsui_sticky_15o6u_11e6r_271):not(.awsui_highlighted_15o6u_11e6r_164):not(.awsui_selected_15o6u_11e6r_164) {
|
|
298
272
|
box-shadow: inset 0 calc(-1 * var(--border-divider-list-width-tdfx1x, 1px)) 0 0 var(--color-border-dropdown-item-default-kape37, #c6c6cd);
|
|
299
273
|
}
|
|
300
|
-
.awsui_selectable-
|
|
274
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_sticky_15o6u_11e6r_271:not(#\9) {
|
|
301
275
|
position: sticky;
|
|
302
276
|
inset-block-start: 0;
|
|
303
277
|
margin-block-end: var(--border-item-width-miijiw, 2px);
|
|
304
278
|
z-index: 4;
|
|
305
279
|
padding-inline: var(--border-item-width-miijiw, 2px);
|
|
306
280
|
}
|
|
307
|
-
.awsui_selectable-
|
|
281
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_sticky_15o6u_11e6r_271.awsui_highlighted_15o6u_11e6r_164:not(#\9), .awsui_selectable-item_15o6u_11e6r_145.awsui_sticky_15o6u_11e6r_271.awsui_selected_15o6u_11e6r_164:not(#\9) {
|
|
308
282
|
padding-inline: var(--border-item-width-miijiw, 2px);
|
|
309
283
|
}
|
|
310
|
-
.awsui_selectable-
|
|
284
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_sticky_15o6u_11e6r_271 > .awsui_selectable-item-content_15o6u_11e6r_167:not(#\9) {
|
|
311
285
|
padding-inline: var(--space-field-horizontal-0aq2ch, 12px);
|
|
312
286
|
}
|
|
313
|
-
.awsui_selectable-
|
|
287
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_sticky_15o6u_11e6r_271:not(#\9):not(.awsui_highlighted_15o6u_11e6r_164):not(.awsui_selected_15o6u_11e6r_164) {
|
|
314
288
|
box-shadow: inset 0 var(--border-divider-list-width-tdfx1x, 1px) 0 0 var(--color-border-dropdown-item-default-kape37, #c6c6cd), inset 0 calc(-1 * var(--border-divider-list-width-tdfx1x, 1px)) 0 0 var(--color-border-dropdown-item-default-kape37, #c6c6cd), inset var(--border-width-popover-nflirh, 2px) 0 0 0 var(--color-border-dropdown-container-cmthq7, #b4b4bb);
|
|
315
289
|
}
|
|
316
|
-
.awsui_selectable-
|
|
290
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_sticky_15o6u_11e6r_271:not(#\9):not(.awsui_highlighted_15o6u_11e6r_164):not(.awsui_selected_15o6u_11e6r_164):not(.awsui_with-scrollbar_15o6u_11e6r_290) {
|
|
317
291
|
box-shadow: inset 0 var(--border-divider-list-width-tdfx1x, 1px) 0 0 var(--color-border-dropdown-item-default-kape37, #c6c6cd), inset 0 calc(-1 * var(--border-divider-list-width-tdfx1x, 1px)) 0 0 var(--color-border-dropdown-item-default-kape37, #c6c6cd), inset var(--border-width-popover-nflirh, 2px) 0 0 0 var(--color-border-dropdown-container-cmthq7, #b4b4bb), inset calc(-1 * var(--border-width-popover-nflirh, 2px)) 0 0 0 var(--color-border-dropdown-container-cmthq7, #b4b4bb);
|
|
318
292
|
}
|
|
319
|
-
.awsui_selectable-
|
|
293
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_sticky_15o6u_11e6r_271:not(#\9):not(.awsui_highlighted_15o6u_11e6r_164):not(.awsui_selected_15o6u_11e6r_164):not(.awsui_after-header_15o6u_11e6r_293) {
|
|
320
294
|
border-start-start-radius: var(--border-radius-item-iwaia5, 8px);
|
|
321
295
|
}
|
|
322
|
-
.awsui_selectable-
|
|
296
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_sticky_15o6u_11e6r_271:not(#\9):not(.awsui_highlighted_15o6u_11e6r_164):not(.awsui_selected_15o6u_11e6r_164):not(.awsui_after-header_15o6u_11e6r_293):not(.awsui_selectable-item_15o6u_11e6r_145.awsui_sticky_15o6u_11e6r_271:not(.awsui_highlighted_15o6u_11e6r_164):not(.awsui_selected_15o6u_11e6r_164):not(.awsui_after-header_15o6u_11e6r_293).awsui_with-scrollbar_15o6u_11e6r_290) {
|
|
323
297
|
border-start-end-radius: var(--border-radius-item-iwaia5, 8px);
|
|
324
298
|
}
|
|
325
|
-
.awsui_selectable-
|
|
299
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_sticky_15o6u_11e6r_271:not(#\9):not(.awsui_highlighted_15o6u_11e6r_164):not(.awsui_selected_15o6u_11e6r_164).awsui_after-header_15o6u_11e6r_293 {
|
|
326
300
|
box-shadow: inset 0 var(--border-divider-list-width-tdfx1x, 1px) 0 0 var(--color-background-dropdown-item-default-qmc033, #ffffff), inset 0 calc(-1 * var(--border-divider-list-width-tdfx1x, 1px)) 0 0 var(--color-border-dropdown-item-default-kape37, #c6c6cd), inset var(--border-width-popover-nflirh, 2px) 0 0 0 var(--color-border-dropdown-container-cmthq7, #b4b4bb);
|
|
327
301
|
}
|
|
328
|
-
.awsui_selectable-
|
|
302
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_sticky_15o6u_11e6r_271:not(#\9):not(.awsui_highlighted_15o6u_11e6r_164):not(.awsui_selected_15o6u_11e6r_164).awsui_after-header_15o6u_11e6r_293:not(.awsui_with-scrollbar_15o6u_11e6r_290) {
|
|
329
303
|
box-shadow: inset 0 var(--border-divider-list-width-tdfx1x, 1px) 0 0 var(--color-background-dropdown-item-default-qmc033, #ffffff), inset 0 calc(-1 * var(--border-divider-list-width-tdfx1x, 1px)) 0 0 var(--color-border-dropdown-item-default-kape37, #c6c6cd), inset var(--border-width-popover-nflirh, 2px) 0 0 0 var(--color-border-dropdown-container-cmthq7, #b4b4bb), inset calc(-1 * var(--border-width-popover-nflirh, 2px)) 0 0 0 var(--color-border-dropdown-container-cmthq7, #b4b4bb);
|
|
330
304
|
}
|
|
331
|
-
.awsui_selectable-
|
|
305
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_sticky_15o6u_11e6r_271.awsui_disabled_15o6u_11e6r_190.awsui_highlighted_15o6u_11e6r_164:not(#\9), .awsui_selectable-item_15o6u_11e6r_145.awsui_sticky_15o6u_11e6r_271.awsui_disabled_15o6u_11e6r_190.awsui_selected_15o6u_11e6r_164:not(#\9) {
|
|
332
306
|
box-shadow: none;
|
|
333
307
|
}
|
|
334
|
-
.awsui_selectable-
|
|
308
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_virtual_15o6u_11e6r_178:not(#\9) {
|
|
335
309
|
position: absolute;
|
|
336
310
|
inset-block-start: var(--border-dropdown-virtual-offset-width-3wp954, 2px);
|
|
337
311
|
inset-inline-start: 0;
|
|
338
312
|
inline-size: 100%;
|
|
339
313
|
box-sizing: border-box;
|
|
340
314
|
}
|
|
341
|
-
.awsui_selectable-
|
|
315
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_virtual_15o6u_11e6r_178:not(#\9):first-of-type:not(.awsui_selected_15o6u_11e6r_164, .awsui_highlighted_15o6u_11e6r_164) {
|
|
342
316
|
box-shadow: inset 0 var(--border-divider-list-width-tdfx1x, 1px) 0 0 var(--color-border-dropdown-item-top-gp2d1p, transparent), inset 0 calc(-1 * var(--border-divider-list-width-tdfx1x, 1px)) 0 0 var(--color-border-dropdown-item-default-kape37, #c6c6cd);
|
|
343
317
|
}
|
|
344
|
-
.awsui_selectable-
|
|
318
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_virtual_15o6u_11e6r_178.awsui_parent_15o6u_11e6r_164:not(#\9):not(.awsui_interactiveGroups_15o6u_11e6r_164) {
|
|
345
319
|
box-shadow: inset 0 var(--border-divider-list-width-tdfx1x, 1px) 0 0 var(--color-border-dropdown-group-ylcnh8, #c6c6cd), inset 0 calc(-1 * var(--border-divider-list-width-tdfx1x, 1px)) 0 0 var(--color-border-dropdown-item-default-kape37, #c6c6cd);
|
|
346
320
|
}
|
|
347
321
|
|
|
348
|
-
.awsui_measure-
|
|
322
|
+
.awsui_measure-strut_15o6u_11e6r_322:not(#\9) {
|
|
349
323
|
position: absolute;
|
|
350
324
|
pointer-events: none;
|
|
351
325
|
block-size: 100%;
|
|
@@ -353,20 +327,20 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
353
327
|
inset-block-start: 0;
|
|
354
328
|
inset-inline-start: 0;
|
|
355
329
|
}
|
|
356
|
-
.awsui_selectable-
|
|
330
|
+
.awsui_selectable-item_15o6u_11e6r_145.awsui_virtual_15o6u_11e6r_178 > .awsui_measure-strut_15o6u_11e6r_322:not(#\9) {
|
|
357
331
|
block-size: calc(100% - var(--border-item-width-miijiw, 2px));
|
|
358
332
|
}
|
|
359
333
|
|
|
360
|
-
.awsui_screenreader-
|
|
334
|
+
.awsui_screenreader-content_15o6u_11e6r_334:not(#\9) {
|
|
361
335
|
position: absolute !important;
|
|
362
336
|
inset-block-start: -9999px !important;
|
|
363
337
|
inset-inline-start: -9999px !important;
|
|
364
338
|
}
|
|
365
339
|
|
|
366
|
-
.awsui_option-
|
|
340
|
+
.awsui_option-content_15o6u_11e6r_340:not(#\9) {
|
|
367
341
|
/* used in test-utils */
|
|
368
342
|
}
|
|
369
343
|
|
|
370
|
-
.awsui_select-
|
|
344
|
+
.awsui_select-all_15o6u_11e6r_344:not(#\9) {
|
|
371
345
|
/* used in test-utils */
|
|
372
346
|
}
|
|
@@ -2,27 +2,27 @@
|
|
|
2
2
|
// es-module interop with Babel and Typescript
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
module.exports.default = {
|
|
5
|
-
"selectable-item": "awsui_selectable-
|
|
6
|
-
"parent": "
|
|
7
|
-
"interactiveGroups": "
|
|
8
|
-
"highlighted": "
|
|
9
|
-
"selected": "
|
|
10
|
-
"selectable-item-content": "awsui_selectable-item-
|
|
11
|
-
"pad-bottom": "awsui_pad-
|
|
12
|
-
"virtual": "
|
|
13
|
-
"has-background": "awsui_has-
|
|
14
|
-
"child": "
|
|
15
|
-
"disabled": "
|
|
16
|
-
"is-keyboard": "awsui_is-
|
|
17
|
-
"visual-refresh": "awsui_visual-
|
|
18
|
-
"next-item-selected": "awsui_next-item-
|
|
19
|
-
"previous-item-selected": "awsui_previous-item-
|
|
20
|
-
"sticky": "
|
|
21
|
-
"with-scrollbar": "awsui_with-
|
|
22
|
-
"after-header": "awsui_after-
|
|
23
|
-
"measure-strut": "awsui_measure-
|
|
24
|
-
"screenreader-content": "awsui_screenreader-
|
|
25
|
-
"option-content": "awsui_option-
|
|
26
|
-
"select-all": "awsui_select-
|
|
5
|
+
"selectable-item": "awsui_selectable-item_15o6u_11e6r_145",
|
|
6
|
+
"parent": "awsui_parent_15o6u_11e6r_164",
|
|
7
|
+
"interactiveGroups": "awsui_interactiveGroups_15o6u_11e6r_164",
|
|
8
|
+
"highlighted": "awsui_highlighted_15o6u_11e6r_164",
|
|
9
|
+
"selected": "awsui_selected_15o6u_11e6r_164",
|
|
10
|
+
"selectable-item-content": "awsui_selectable-item-content_15o6u_11e6r_167",
|
|
11
|
+
"pad-bottom": "awsui_pad-bottom_15o6u_11e6r_171",
|
|
12
|
+
"virtual": "awsui_virtual_15o6u_11e6r_178",
|
|
13
|
+
"has-background": "awsui_has-background_15o6u_11e6r_181",
|
|
14
|
+
"child": "awsui_child_15o6u_11e6r_184",
|
|
15
|
+
"disabled": "awsui_disabled_15o6u_11e6r_190",
|
|
16
|
+
"is-keyboard": "awsui_is-keyboard_15o6u_11e6r_205",
|
|
17
|
+
"visual-refresh": "awsui_visual-refresh_15o6u_11e6r_215",
|
|
18
|
+
"next-item-selected": "awsui_next-item-selected_15o6u_11e6r_229",
|
|
19
|
+
"previous-item-selected": "awsui_previous-item-selected_15o6u_11e6r_239",
|
|
20
|
+
"sticky": "awsui_sticky_15o6u_11e6r_271",
|
|
21
|
+
"with-scrollbar": "awsui_with-scrollbar_15o6u_11e6r_290",
|
|
22
|
+
"after-header": "awsui_after-header_15o6u_11e6r_293",
|
|
23
|
+
"measure-strut": "awsui_measure-strut_15o6u_11e6r_322",
|
|
24
|
+
"screenreader-content": "awsui_screenreader-content_15o6u_11e6r_334",
|
|
25
|
+
"option-content": "awsui_option-content_15o6u_11e6r_340",
|
|
26
|
+
"select-all": "awsui_select-all_15o6u_11e6r_344"
|
|
27
27
|
};
|
|
28
28
|
|
package/internal/environment.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export var PACKAGE_SOURCE = "components";
|
|
2
|
-
export var PACKAGE_VERSION = "3.0.0 (
|
|
3
|
-
export var GIT_SHA = "
|
|
2
|
+
export var PACKAGE_VERSION = "3.0.0 (45ad68cf)";
|
|
3
|
+
export var GIT_SHA = "45ad68cf";
|
|
4
4
|
export var THEME = "open-source-visual-refresh";
|
|
5
5
|
export var SYSTEM = "core";
|
|
6
6
|
export var ALWAYS_VISUAL_REFRESH = true;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Custom hook to handle IME composition state for preventing IME race conditions when pressing enter to end composition.
|
|
3
|
+
*
|
|
4
|
+
* IME generates duplicate Enter events:
|
|
5
|
+
* 1. First Enter: Ends composition (isComposing=true -> false)
|
|
6
|
+
* 2. Second Enter: Triggers normal action (isComposing=false)
|
|
7
|
+
*
|
|
8
|
+
* This hook tracks composition lifecycle to prevent the second Enter during the brief window.
|
|
9
|
+
*/
|
|
10
|
+
export declare function useIMEComposition(elementRef: React.RefObject<HTMLInputElement>): {
|
|
11
|
+
isComposing: () => boolean;
|
|
12
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-ime-composition/index.ts"],"names":[],"mappings":"AAKA;;;;;;;;GAQG;AACH,wBAAgB,iBAAiB,CAAC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC;;EAgC9E"}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
+
import { useEffect, useRef } from 'react';
|
|
4
|
+
/**
|
|
5
|
+
* Custom hook to handle IME composition state for preventing IME race conditions when pressing enter to end composition.
|
|
6
|
+
*
|
|
7
|
+
* IME generates duplicate Enter events:
|
|
8
|
+
* 1. First Enter: Ends composition (isComposing=true -> false)
|
|
9
|
+
* 2. Second Enter: Triggers normal action (isComposing=false)
|
|
10
|
+
*
|
|
11
|
+
* This hook tracks composition lifecycle to prevent the second Enter during the brief window.
|
|
12
|
+
*/
|
|
13
|
+
export function useIMEComposition(elementRef) {
|
|
14
|
+
const wasComposingRef = useRef(false);
|
|
15
|
+
const handleCompositionStart = () => {
|
|
16
|
+
wasComposingRef.current = true;
|
|
17
|
+
};
|
|
18
|
+
const handleCompositionEnd = () => {
|
|
19
|
+
// Keep flag true briefly to catch immediate post-composition Enter events
|
|
20
|
+
requestAnimationFrame(() => {
|
|
21
|
+
wasComposingRef.current = false;
|
|
22
|
+
});
|
|
23
|
+
};
|
|
24
|
+
useEffect(() => {
|
|
25
|
+
const element = elementRef.current;
|
|
26
|
+
if (!element) {
|
|
27
|
+
return;
|
|
28
|
+
}
|
|
29
|
+
element.addEventListener('compositionstart', handleCompositionStart);
|
|
30
|
+
element.addEventListener('compositionend', handleCompositionEnd);
|
|
31
|
+
return () => {
|
|
32
|
+
element.removeEventListener('compositionstart', handleCompositionStart);
|
|
33
|
+
element.removeEventListener('compositionend', handleCompositionEnd);
|
|
34
|
+
};
|
|
35
|
+
}, [elementRef]);
|
|
36
|
+
const isComposing = () => wasComposingRef.current;
|
|
37
|
+
return { isComposing };
|
|
38
|
+
}
|
|
39
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-ime-composition/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE1C;;;;;;;;GAQG;AACH,MAAM,UAAU,iBAAiB,CAAC,UAA6C;IAC7E,MAAM,eAAe,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAEtC,MAAM,sBAAsB,GAAG,GAAG,EAAE;QAClC,eAAe,CAAC,OAAO,GAAG,IAAI,CAAC;IACjC,CAAC,CAAC;IAEF,MAAM,oBAAoB,GAAG,GAAG,EAAE;QAChC,0EAA0E;QAC1E,qBAAqB,CAAC,GAAG,EAAE;YACzB,eAAe,CAAC,OAAO,GAAG,KAAK,CAAC;QAClC,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,UAAU,CAAC,OAAO,CAAC;QACnC,IAAI,CAAC,OAAO,EAAE,CAAC;YACb,OAAO;QACT,CAAC;QAED,OAAO,CAAC,gBAAgB,CAAC,kBAAkB,EAAE,sBAAsB,CAAC,CAAC;QACrE,OAAO,CAAC,gBAAgB,CAAC,gBAAgB,EAAE,oBAAoB,CAAC,CAAC;QAEjE,OAAO,GAAG,EAAE;YACV,OAAO,CAAC,mBAAmB,CAAC,kBAAkB,EAAE,sBAAsB,CAAC,CAAC;YACxE,OAAO,CAAC,mBAAmB,CAAC,gBAAgB,EAAE,oBAAoB,CAAC,CAAC;QACtE,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,MAAM,WAAW,GAAG,GAAG,EAAE,CAAC,eAAe,CAAC,OAAO,CAAC;IAElD,OAAO,EAAE,WAAW,EAAE,CAAC;AACzB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useEffect, useRef } from 'react';\n\n/**\n * Custom hook to handle IME composition state for preventing IME race conditions when pressing enter to end composition.\n *\n * IME generates duplicate Enter events:\n * 1. First Enter: Ends composition (isComposing=true -> false)\n * 2. Second Enter: Triggers normal action (isComposing=false)\n *\n * This hook tracks composition lifecycle to prevent the second Enter during the brief window.\n */\nexport function useIMEComposition(elementRef: React.RefObject<HTMLInputElement>) {\n const wasComposingRef = useRef(false);\n\n const handleCompositionStart = () => {\n wasComposingRef.current = true;\n };\n\n const handleCompositionEnd = () => {\n // Keep flag true briefly to catch immediate post-composition Enter events\n requestAnimationFrame(() => {\n wasComposingRef.current = false;\n });\n };\n\n useEffect(() => {\n const element = elementRef.current;\n if (!element) {\n return;\n }\n\n element.addEventListener('compositionstart', handleCompositionStart);\n element.addEventListener('compositionend', handleCompositionEnd);\n\n return () => {\n element.removeEventListener('compositionstart', handleCompositionStart);\n element.removeEventListener('compositionend', handleCompositionEnd);\n };\n }, [elementRef]);\n\n const isComposing = () => wasComposingRef.current;\n\n return { isComposing };\n}\n"]}
|
package/internal/manifest.json
CHANGED
package/package.json
CHANGED
|
@@ -158,7 +158,7 @@
|
|
|
158
158
|
"./internal/base-component/index.js",
|
|
159
159
|
"./internal/base-component/styles.css.js"
|
|
160
160
|
],
|
|
161
|
-
"version": "3.0.
|
|
161
|
+
"version": "3.0.1181",
|
|
162
162
|
"repository": {
|
|
163
163
|
"type": "git",
|
|
164
164
|
"url": "https://github.com/cloudscape-design/components.git"
|