npm - @pega/cosmos-react-core - Versions diffs - 4.0.0-dev.12.1 → 4.0.0-dev.14.0 - Mend

@pega/cosmos-react-core 4.0.0-dev.12.1 → 4.0.0-dev.14.0

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.

Files changed (405) hide show

package/lib/components/ComboBox/ComboBox.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from 'r
 import Icon, { registerIcon } from '../Icon';
 import * as caretDownIcon from '../Icon/icons/caret-down.icon';
 import * as caretUpIcon from '../Icon/icons/caret-up.icon';
-import { useConsolidatedRef, useFocusWithin, useI18n, useUID, useElement, useDirection } from '../../hooks';
+import { useConsolidatedRef, useFocusWithin, useI18n, useUID, useElement, useDirection, useTestIds } from '../../hooks';
 import Popover from '../Popover';
 import FormField from '../FormField';
 import { StyledFormControl } from '../FormControl';
@@ -15,11 +15,13 @@ import { sameWidth } from '../Popover/modifiers';
 import VisuallyHiddenText from '../VisuallyHiddenText';
 import ComboBoxInput from './ComboBoxInput';
 import { StyledComboBox } from './ComboBox.styles';
+import { getComboBoxTestIds } from './ComboxBox.test-ids';
 registerIcon(caretDownIcon, caretUpIcon);
 const isMobile = navigatorIsAvailable && navigator.userAgent.includes('Mobile');
 const ComboBox = forwardRef((props, ref) => {
     const uid = useUID();
-    const { additionalInfo, value, required, id = uid, label, labelHidden, info, status, readOnly, disabled, mode = 'single-select', selected, onChange, actions, onFocus, onBlur, onResolveSuggestion, onDropdownButtonClick: onDropdownButtonClickProp, onClick, onKeyDown, menu, ...restProps } = props;
+    const { testId, additionalInfo, value, required, id = uid, label, labelHidden, info, status, readOnly, disabled, mode = 'single-select', selected, onChange, actions, onFocus, onBlur, onResolveSuggestion, onDropdownButtonClick: onDropdownButtonClickProp, onClick, onKeyDown, menu, ...restProps } = props;
+    const testIds = useTestIds(testId, getComboBoxTestIds);
     const [pauseMenuDescendantEvaluation, setPauseMenuDescendantEvaluation] = useState(true);
     const [pauseSelectedDescendantEvaluation, setPauseSelectedDescendantEvaluation] = useState(false);
     const t = useI18n();
@@ -130,7 +132,7 @@ const ComboBox = forwardRef((props, ref) => {
     // Workaround for the following error from jsx-ast-utils, fixed in version 3.5.0.
     // The prop value with an expression type of JSXFragment could not be resolved. Please file issue to get this fixed immediately.
     const inputActions = (_jsxs(_Fragment, { children: [dropdownButton, actions] }));
-    const Comp = (_jsxs(StyledComboBox, { ref: containerRef, as: StyledFormControl, id: `${id}-combobox`, role: 'combobox', "aria-haspopup": 'listbox', "aria-expanded": !readOnly && !disabled && open, "aria-owns": open && menu !== undefined && !pauseMenuDescendantEvaluation ? listId : undefined, children: [_jsx(ComboBoxInput, { ref: inputRef, role: 'searchbox', "aria-autocomplete": 'list', "aria-controls": open && menu !== undefined && !pauseMenuDescendantEvaluation ? listId : undefined, "aria-describedby": ariaDescribedBy, selected: selected?.items, spellCheck: false, ...{
+    const Comp = (_jsxs(StyledComboBox, { ref: containerRef, as: StyledFormControl, id: `${id}-combobox`, role: 'combobox', "aria-haspopup": 'listbox', "aria-expanded": !readOnly && !disabled && open, "aria-owns": open && menu !== undefined && !pauseMenuDescendantEvaluation ? listId : undefined, children: [_jsx(ComboBoxInput, { "data-testid": testIds.control, ref: inputRef, role: 'searchbox', "aria-autocomplete": 'list', "aria-controls": open && menu !== undefined && !pauseMenuDescendantEvaluation ? listId : undefined, "aria-describedby": ariaDescribedBy, selected: selected?.items, spellCheck: false, ...{
                     id,
                     readOnly,
                     disabled,
@@ -142,15 +144,7 @@ const ComboBox = forwardRef((props, ref) => {
                     toggleSelectedDescendantsActive(true);
                 }, onSelectedBlur: () => {
                     toggleSelectedDescendantsActive(false);
-                }, ...restProps }), _jsx(Popover, { show: open && menu !== undefined, target: containerRef.current, placement: 'bottom-start', modifiers: [
-                    {
-                        name: 'flip',
-                        options: {
-                            fallbackPlacements: ['top-start']
-                        }
-                    },
-                    sameWidth
-                ],
+                }, ...restProps }), _jsx(Popover, { show: open && menu !== undefined, target: containerRef.current, placement: 'bottom-start', modifiers: [sameWidth],
                 // FIXME: Removed absolute strategy for mobile to avoid overflow issues.
                 strategy: 'fixed', onMouseDown: (e) => e.preventDefault(), children: menu && (_jsx(Menu, { ref: menuRef, listId: listId, id: menuComponentId, role: 'listbox', mode: mode, ...menu, items: menu.items, focusControlEl: inputRef.current || undefined, onItemClick: (itemId, e) => {
                         if (mode === 'single-select') {
@@ -164,6 +158,7 @@ const ComboBox = forwardRef((props, ref) => {
                         }
                     }, "aria-label": t('menu_option_list'), pauseDescendantEvaluation: pauseMenuDescendantEvaluation, arrowNavigationUnsupported: true })) })] }));
     return (_jsxs(_Fragment, { children: [label ? (_jsx(FormField, { ...{
+                    testId: testIds,
                     label,
                     labelHidden,
                     id,

package/lib/components/ComboBox/ComboBox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ComboBox.js","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n KeyboardEvent as ReactKeyboardEvent,\n PropsWithoutRef,\n Ref,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState\n} from 'react';\n\nimport Icon, { registerIcon } from '../Icon';\nimport * as caretDownIcon from '../Icon/icons/caret-down.icon';\nimport * as caretUpIcon from '../Icon/icons/caret-up.icon';\nimport { ForwardProps } from '../../types';\nimport {\n useConsolidatedRef,\n useFocusWithin,\n useI18n,\n useUID,\n useElement,\n useDirection\n} from '../../hooks';\nimport Popover from '../Popover';\nimport FormField from '../FormField';\nimport { StyledFormControl } from '../FormControl';\nimport Menu, { MenuProps } from '../Menu';\nimport Button from '../Button';\nimport { navigatorIsAvailable } from '../../utils';\nimport menuHelpers from '../Menu/helpers';\nimport { sameWidth } from '../Popover/modifiers';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\n\nimport ComboBoxInput from './ComboBoxInput';\nimport ComboBoxProps from './ComboBox.types';\nimport { StyledComboBox } from './ComboBox.styles';\n\nregisterIcon(caretDownIcon, caretUpIcon);\n\nconst isMobile = navigatorIsAvailable && navigator.userAgent.includes('Mobile');\n\nconst ComboBox: FunctionComponent<ComboBoxProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<ComboBoxProps>, ref: Ref<HTMLDivElement>) => {\n const uid = useUID();\n const {\n additionalInfo,\n value,\n required,\n id = uid,\n label,\n labelHidden,\n info,\n status,\n readOnly,\n disabled,\n mode = 'single-select',\n selected,\n onChange,\n actions,\n onFocus,\n onBlur,\n onResolveSuggestion,\n onDropdownButtonClick: onDropdownButtonClickProp,\n onClick,\n onKeyDown,\n menu,\n ...restProps\n } = props;\n const [pauseMenuDescendantEvaluation, setPauseMenuDescendantEvaluation] = useState(true);\n const [pauseSelectedDescendantEvaluation, setPauseSelectedDescendantEvaluation] =\n useState(false);\n const t = useI18n();\n const listId = `${id}-list`;\n const inputRef = useRef<HTMLInputElement>(null);\n const [open, setOpen] = useState(false);\n const menuRef: MenuProps['ref'] = useRef(null);\n const menuComponentId = `${id}-listbox`;\n const { start } = useDirection();\n\n // Force a re-render to make sure useFocusWithin has valid elements to set listeners on.\n const [, setContainerEl] = useElement();\n const containerRef = useConsolidatedRef<HTMLDivElement>(ref, setContainerEl);\n\n const toggleMenuDescendantsActive = useCallback((bool: boolean) => {\n setPauseMenuDescendantEvaluation(!bool);\n setPauseSelectedDescendantEvaluation(bool);\n }, []);\n\n const toggleSelectedDescendantsActive = useCallback((bool: boolean) => {\n setPauseSelectedDescendantEvaluation(!bool);\n setPauseMenuDescendantEvaluation(bool);\n }, []);\n\n const focus = useFocusWithin([containerRef], focused => {\n if (!focused) {\n setOpen(false);\n toggleMenuDescendantsActive(false);\n onBlur?.(selected?.items);\n } else {\n onFocus?.(selected?.items);\n if (isMobile) {\n setTimeout(() => {\n containerRef.current?.scrollIntoView({ behavior: 'smooth', block: 'start' });\n }, 150); // delay it to let keyboard expand first\n }\n }\n });\n\n const onInputKeyDown = useCallback(\n (e: ReactKeyboardEvent<HTMLInputElement>) => {\n if (!menu \|\| readOnly) return;\n if (onKeyDown?.(e) === false) {\n return;\n }\n\n switch (e.key) {\n case 'ArrowUp':\n if (e.altKey) {\n e.preventDefault();\n if (open) {\n setOpen(false);\n toggleMenuDescendantsActive(false);\n }\n }\n break;\n case 'ArrowDown':\n e.preventDefault();\n if (!open) {\n setOpen(true);\n toggleMenuDescendantsActive(true);\n }\n break;\n case 'Escape':\n case 'Tab':\n if (e.key === 'Escape') {\n e.preventDefault();\n if (open) e.stopPropagation();\n }\n setOpen(false);\n toggleMenuDescendantsActive(false);\n break;\n default:\n }\n },\n [open, readOnly, menu, value, onKeyDown]\n );\n\n const onDropdownButtonClick = useCallback(() => {\n onDropdownButtonClickProp?.(!open);\n setOpen(!open);\n }, [open, onDropdownButtonClickProp]);\n\n const dropdownButton = useMemo(() => {\n return (menu?.items?.length \|\| onDropdownButtonClickProp \|\| !onChange) && !readOnly ? (\n <Button\n aria-label={t(\n open ? 'combobox_close_list_button_a11y' : 'combobox_open_list_button_a11y'\n )}\n icon\n variant='simple'\n onClick={onDropdownButtonClick}\n onMouseDown={(e: MouseEvent) => {\n e.preventDefault();\n inputRef.current?.focus();\n }}\n disabled={disabled}\n tabIndex='-1'\n >\n <Icon name={open ? 'caret-up' : 'caret-down'} />\n </Button>\n ) : null;\n }, [onDropdownButtonClick, onChange, readOnly, open, disabled]);\n\n const ariaDescribedBy = useMemo(() => {\n let idString = `${id}-inputDescription`;\n\n if (info) {\n idString = idString.concat(` ${id}-info`);\n }\n if (onChange) {\n idString = idString.concat(` ${id}-searchDescription`);\n }\n if (mode === 'multi-select') {\n idString = idString.concat(` ${id}-multiselectDescription`);\n }\n\n return idString;\n }, [info, id, mode, onChange]);\n\n const onInputClick = useCallback(\n (e: MouseEvent) => {\n if (readOnly) return;\n setOpen(true);\n toggleMenuDescendantsActive(true);\n onClick?.(e);\n },\n [readOnly, onClick]\n );\n\n useEffect(() => {\n if (focus && menu && value && value.length > 0) {\n setOpen(true);\n toggleMenuDescendantsActive(true);\n }\n }, [menu, value, focus]);\n\n // Workaround for the following error from jsx-ast-utils, fixed in version 3.5.0.\n // The prop value with an expression type of JSXFragment could not be resolved. Please file issue to get this fixed immediately.\n const inputActions = (\n <>\n {dropdownButton}\n {actions}\n </>\n );\n\n const Comp = (\n <StyledComboBox\n ref={containerRef}\n as={StyledFormControl}\n id={`${id}-combobox`}\n role='combobox'\n aria-haspopup='listbox'\n aria-expanded={!readOnly && !disabled && open}\n aria-owns={\n open && menu !== undefined && !pauseMenuDescendantEvaluation ? listId : undefined\n }\n >\n <ComboBoxInput\n ref={inputRef}\n role='searchbox'\n aria-autocomplete='list'\n aria-controls={\n open && menu !== undefined && !pauseMenuDescendantEvaluation ? listId : undefined\n }\n aria-describedby={ariaDescribedBy}\n selected={selected?.items}\n spellCheck={false}\n {...{\n id,\n readOnly,\n disabled,\n onChange,\n value,\n mode,\n status\n }}\n actions={inputActions}\n onRemove={selected?.onRemove}\n onClick={onInputClick}\n onKeyDown={onInputKeyDown}\n required={required}\n pauseDescendantEvaluation={pauseSelectedDescendantEvaluation}\n onSelectedFocus={() => {\n toggleSelectedDescendantsActive(true);\n }}\n onSelectedBlur={() => {\n toggleSelectedDescendantsActive(false);\n }}\n {...restProps}\n />\n\n <Popover\n show={open && menu !== undefined}\n target={containerRef.current}\n placement='bottom-start'\n modifiers={[\n {\n name: 'flip',\n options: {\n fallbackPlacements: ['top-start']\n }\n },\n sameWidth\n ]}\n // FIXME: Removed absolute strategy for mobile to avoid overflow issues.\n strategy='fixed'\n onMouseDown={(e: MouseEvent) => e.preventDefault()}\n >\n {menu && (\n <Menu\n ref={menuRef}\n listId={listId}\n id={menuComponentId}\n role='listbox'\n mode={mode}\n {...menu}\n items={menu.items}\n focusControlEl={inputRef.current \|\| undefined}\n onItemClick={(itemId, e) => {\n if (mode === 'single-select') {\n setOpen(false);\n toggleMenuDescendantsActive(true);\n }\n menu.onItemClick?.(itemId, e);\n\n const clickedItem = menuHelpers.getItem(menu.items, itemId);\n\n if (clickedItem?.primary && !clickedItem?.selected) {\n selected?.onNew?.(clickedItem?.primary);\n }\n }}\n aria-label={t('menu_option_list')}\n pauseDescendantEvaluation={pauseMenuDescendantEvaluation}\n arrowNavigationUnsupported\n />\n )}\n </Popover>\n </StyledComboBox>\n );\n\n return (\n <>\n {label ? (\n <FormField\n {...{\n label,\n labelHidden,\n id,\n info,\n status,\n required,\n disabled,\n onResolveSuggestion,\n additionalInfo\n }}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n )}\n <VisuallyHiddenText id={`${id}-inputDescription`} aria-hidden>\n {`${t('combobox_open_close')} `}\n </VisuallyHiddenText>\n <VisuallyHiddenText id={`${id}-searchDescription`} aria-hidden>\n {t('combobox_search_instructions')}\n </VisuallyHiddenText>\n <VisuallyHiddenText id={`${id}-multiselectDescription`} aria-hidden>\n {t('multiselect_instructions', [start])}\n </VisuallyHiddenText>\n </>\n );\n }\n);\n\nexport default ComboBox;\n"]}
1	+ {"version":3,"file":"ComboBox.js","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n KeyboardEvent as ReactKeyboardEvent,\n PropsWithoutRef,\n Ref,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState\n} from 'react';\n\nimport Icon, { registerIcon } from '../Icon';\nimport * as caretDownIcon from '../Icon/icons/caret-down.icon';\nimport * as caretUpIcon from '../Icon/icons/caret-up.icon';\nimport { ForwardProps } from '../../types';\nimport {\n useConsolidatedRef,\n useFocusWithin,\n useI18n,\n useUID,\n useElement,\n useDirection,\n useTestIds\n} from '../../hooks';\nimport Popover from '../Popover';\nimport FormField from '../FormField';\nimport { StyledFormControl } from '../FormControl';\nimport Menu, { MenuProps } from '../Menu';\nimport Button from '../Button';\nimport { navigatorIsAvailable } from '../../utils';\nimport menuHelpers from '../Menu/helpers';\nimport { sameWidth } from '../Popover/modifiers';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\n\nimport ComboBoxInput from './ComboBoxInput';\nimport ComboBoxProps from './ComboBox.types';\nimport { StyledComboBox } from './ComboBox.styles';\nimport { getComboBoxTestIds } from './ComboxBox.test-ids';\n\nregisterIcon(caretDownIcon, caretUpIcon);\n\nconst isMobile = navigatorIsAvailable && navigator.userAgent.includes('Mobile');\n\nconst ComboBox: FunctionComponent<ComboBoxProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<ComboBoxProps>, ref: Ref<HTMLDivElement>) => {\n const uid = useUID();\n const {\n testId,\n additionalInfo,\n value,\n required,\n id = uid,\n label,\n labelHidden,\n info,\n status,\n readOnly,\n disabled,\n mode = 'single-select',\n selected,\n onChange,\n actions,\n onFocus,\n onBlur,\n onResolveSuggestion,\n onDropdownButtonClick: onDropdownButtonClickProp,\n onClick,\n onKeyDown,\n menu,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getComboBoxTestIds);\n\n const [pauseMenuDescendantEvaluation, setPauseMenuDescendantEvaluation] = useState(true);\n const [pauseSelectedDescendantEvaluation, setPauseSelectedDescendantEvaluation] =\n useState(false);\n const t = useI18n();\n const listId = `${id}-list`;\n const inputRef = useRef<HTMLInputElement>(null);\n const [open, setOpen] = useState(false);\n const menuRef: MenuProps['ref'] = useRef(null);\n const menuComponentId = `${id}-listbox`;\n const { start } = useDirection();\n\n // Force a re-render to make sure useFocusWithin has valid elements to set listeners on.\n const [, setContainerEl] = useElement();\n const containerRef = useConsolidatedRef<HTMLDivElement>(ref, setContainerEl);\n\n const toggleMenuDescendantsActive = useCallback((bool: boolean) => {\n setPauseMenuDescendantEvaluation(!bool);\n setPauseSelectedDescendantEvaluation(bool);\n }, []);\n\n const toggleSelectedDescendantsActive = useCallback((bool: boolean) => {\n setPauseSelectedDescendantEvaluation(!bool);\n setPauseMenuDescendantEvaluation(bool);\n }, []);\n\n const focus = useFocusWithin([containerRef], focused => {\n if (!focused) {\n setOpen(false);\n toggleMenuDescendantsActive(false);\n onBlur?.(selected?.items);\n } else {\n onFocus?.(selected?.items);\n if (isMobile) {\n setTimeout(() => {\n containerRef.current?.scrollIntoView({ behavior: 'smooth', block: 'start' });\n }, 150); // delay it to let keyboard expand first\n }\n }\n });\n\n const onInputKeyDown = useCallback(\n (e: ReactKeyboardEvent<HTMLInputElement>) => {\n if (!menu \|\| readOnly) return;\n if (onKeyDown?.(e) === false) {\n return;\n }\n\n switch (e.key) {\n case 'ArrowUp':\n if (e.altKey) {\n e.preventDefault();\n if (open) {\n setOpen(false);\n toggleMenuDescendantsActive(false);\n }\n }\n break;\n case 'ArrowDown':\n e.preventDefault();\n if (!open) {\n setOpen(true);\n toggleMenuDescendantsActive(true);\n }\n break;\n case 'Escape':\n case 'Tab':\n if (e.key === 'Escape') {\n e.preventDefault();\n if (open) e.stopPropagation();\n }\n setOpen(false);\n toggleMenuDescendantsActive(false);\n break;\n default:\n }\n },\n [open, readOnly, menu, value, onKeyDown]\n );\n\n const onDropdownButtonClick = useCallback(() => {\n onDropdownButtonClickProp?.(!open);\n setOpen(!open);\n }, [open, onDropdownButtonClickProp]);\n\n const dropdownButton = useMemo(() => {\n return (menu?.items?.length \|\| onDropdownButtonClickProp \|\| !onChange) && !readOnly ? (\n <Button\n aria-label={t(\n open ? 'combobox_close_list_button_a11y' : 'combobox_open_list_button_a11y'\n )}\n icon\n variant='simple'\n onClick={onDropdownButtonClick}\n onMouseDown={(e: MouseEvent) => {\n e.preventDefault();\n inputRef.current?.focus();\n }}\n disabled={disabled}\n tabIndex='-1'\n >\n <Icon name={open ? 'caret-up' : 'caret-down'} />\n </Button>\n ) : null;\n }, [onDropdownButtonClick, onChange, readOnly, open, disabled]);\n\n const ariaDescribedBy = useMemo(() => {\n let idString = `${id}-inputDescription`;\n\n if (info) {\n idString = idString.concat(` ${id}-info`);\n }\n if (onChange) {\n idString = idString.concat(` ${id}-searchDescription`);\n }\n if (mode === 'multi-select') {\n idString = idString.concat(` ${id}-multiselectDescription`);\n }\n\n return idString;\n }, [info, id, mode, onChange]);\n\n const onInputClick = useCallback(\n (e: MouseEvent) => {\n if (readOnly) return;\n setOpen(true);\n toggleMenuDescendantsActive(true);\n onClick?.(e);\n },\n [readOnly, onClick]\n );\n\n useEffect(() => {\n if (focus && menu && value && value.length > 0) {\n setOpen(true);\n toggleMenuDescendantsActive(true);\n }\n }, [menu, value, focus]);\n\n // Workaround for the following error from jsx-ast-utils, fixed in version 3.5.0.\n // The prop value with an expression type of JSXFragment could not be resolved. Please file issue to get this fixed immediately.\n const inputActions = (\n <>\n {dropdownButton}\n {actions}\n </>\n );\n\n const Comp = (\n <StyledComboBox\n ref={containerRef}\n as={StyledFormControl}\n id={`${id}-combobox`}\n role='combobox'\n aria-haspopup='listbox'\n aria-expanded={!readOnly && !disabled && open}\n aria-owns={\n open && menu !== undefined && !pauseMenuDescendantEvaluation ? listId : undefined\n }\n >\n <ComboBoxInput\n data-testid={testIds.control}\n ref={inputRef}\n role='searchbox'\n aria-autocomplete='list'\n aria-controls={\n open && menu !== undefined && !pauseMenuDescendantEvaluation ? listId : undefined\n }\n aria-describedby={ariaDescribedBy}\n selected={selected?.items}\n spellCheck={false}\n {...{\n id,\n readOnly,\n disabled,\n onChange,\n value,\n mode,\n status\n }}\n actions={inputActions}\n onRemove={selected?.onRemove}\n onClick={onInputClick}\n onKeyDown={onInputKeyDown}\n required={required}\n pauseDescendantEvaluation={pauseSelectedDescendantEvaluation}\n onSelectedFocus={() => {\n toggleSelectedDescendantsActive(true);\n }}\n onSelectedBlur={() => {\n toggleSelectedDescendantsActive(false);\n }}\n {...restProps}\n />\n\n <Popover\n show={open && menu !== undefined}\n target={containerRef.current}\n placement='bottom-start'\n modifiers={[sameWidth]}\n // FIXME: Removed absolute strategy for mobile to avoid overflow issues.\n strategy='fixed'\n onMouseDown={(e: MouseEvent) => e.preventDefault()}\n >\n {menu && (\n <Menu\n ref={menuRef}\n listId={listId}\n id={menuComponentId}\n role='listbox'\n mode={mode}\n {...menu}\n items={menu.items}\n focusControlEl={inputRef.current \|\| undefined}\n onItemClick={(itemId, e) => {\n if (mode === 'single-select') {\n setOpen(false);\n toggleMenuDescendantsActive(true);\n }\n menu.onItemClick?.(itemId, e);\n\n const clickedItem = menuHelpers.getItem(menu.items, itemId);\n\n if (clickedItem?.primary && !clickedItem?.selected) {\n selected?.onNew?.(clickedItem?.primary);\n }\n }}\n aria-label={t('menu_option_list')}\n pauseDescendantEvaluation={pauseMenuDescendantEvaluation}\n arrowNavigationUnsupported\n />\n )}\n </Popover>\n </StyledComboBox>\n );\n\n return (\n <>\n {label ? (\n <FormField\n {...{\n testId: testIds,\n label,\n labelHidden,\n id,\n info,\n status,\n required,\n disabled,\n onResolveSuggestion,\n additionalInfo\n }}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n )}\n <VisuallyHiddenText id={`${id}-inputDescription`} aria-hidden>\n {`${t('combobox_open_close')} `}\n </VisuallyHiddenText>\n <VisuallyHiddenText id={`${id}-searchDescription`} aria-hidden>\n {t('combobox_search_instructions')}\n </VisuallyHiddenText>\n <VisuallyHiddenText id={`${id}-multiselectDescription`} aria-hidden>\n {t('multiselect_instructions', [start])}\n </VisuallyHiddenText>\n </>\n );\n }\n);\n\nexport default ComboBox;\n"]}

package/lib/components/ComboBox/ComboBox.types.d.ts CHANGED Viewed

@@ -1,12 +1,12 @@
 import { ChangeEvent, ReactNode, Ref, KeyboardEvent as ReactKeyboardEvent } from 'react';
-import type { NoChildrenProp } from '../../types';
+import type { NoChildrenProp, TestIdProp } from '../../types';
 import { FormControlProps } from '../FormControl';
 import { MenuItemProps, MenuProps } from '../Menu/Menu.types';
 export interface Selected {
     id: string;
     text: string;
 }
-export default interface ComboBoxProps extends NoChildrenProp {
+export default interface ComboBoxProps extends NoChildrenProp, TestIdProp {
     /**
      * Sets DOM id for the control and associates label element via 'for' attribute.
      * If an id is not pass, a random id will be generated for any render.

package/lib/components/ComboBox/ComboBox.types.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ComboBox.types.d.ts","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,EAAE,aAAa,IAAI,kBAAkB,EAAE,MAAM,OAAO,CAAC;AAEzF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;~~AAClD~~,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAE9D,MAAM,WAAW,QAAQ;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,CAAC,OAAO,WAAW,aAAc,SAAQ,cAAc;~~IAC3D~~;;;OAGG;IACH,EAAE,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC5B,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,uCAAuC;IACvC,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,yFAAyF;IACzF,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,6GAA6G;IAC7G,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,uBAAuB;IACvB,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C;;;OAGG;IACH,IAAI,CAAC,EAAE,eAAe,GAAG,cAAc,CAAC;IACxC,sFAAsF;IACtF,QAAQ,CAAC,EAAE;QACT,KAAK,CAAC,EAAE,QAAQ,GAAG,QAAQ,EAAE,CAAC;QAC9B,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;QAC5D,KAAK,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;KAChC,CAAC;IACF,6CAA6C;IAC7C,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,6DAA6D;IAC7D,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACtD,0DAA0D;IAC1D,OAAO,CAAC,EAAE,CAAC,QAAQ,CAAC,EAAE,QAAQ,GAAG,QAAQ,EAAE,KAAK,IAAI,CAAC;IACrD;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAC,QAAQ,CAAC,EAAE,QAAQ,GAAG,QAAQ,EAAE,KAAK,IAAI,CAAC;IACpD,6DAA6D;IAC7D,mBAAmB,CAAC,EAAE,gBAAgB,CAAC,qBAAqB,CAAC,CAAC;IAC9D,iDAAiD;IACjD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;;;OAOG;IACH,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,oDAAoD;IACpD,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAClC;;OAEG;IACH,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,kBAAkB,KAAK,OAAO,GAAG,IAAI,CAAC;IACtD,wDAAwD;IACxD,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,yCAAyC;IACzC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,mDAAmD;IACnD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,8EAA8E;IAC9E,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACpD,gCAAgC;IAChC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B"}
1	+ {"version":3,"file":"ComboBox.types.d.ts","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.types.ts"],"names":[],"mappings":"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"}

package/lib/components/ComboBox/ComboBox.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ComboBox.types.js","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ChangeEvent, ReactNode, Ref, KeyboardEvent as ReactKeyboardEvent } from 'react';\n\nimport type { NoChildrenProp } from '../../types';\nimport { FormControlProps } from '../FormControl';\nimport { MenuItemProps, MenuProps } from '../Menu/Menu.types';\n\nexport interface Selected {\n id: string;\n text: string;\n}\n\nexport default interface ComboBoxProps extends NoChildrenProp {\n /*\n Sets DOM id for the control and associates label element via 'for' attribute.\n * If an id is not pass, a random id will be generated for any render.\n /\n id?: FormControlProps['id'];\n /* Pass a string or a fragment with an Icon and string. /\n label?: FormControlProps['label'];\n /* Visually hides the label region. /\n labelHidden?: FormControlProps['labelHidden'];\n /* Indicate if the field is required. The browser defaults to false. /\n required?: FormControlProps['required'];\n /* Disable the control. The browser defaults to false. /\n disabled?: FormControlProps['disabled'];\n /* Makes the component non editable and non clickable. The browser defaults to false. /\n readOnly?: FormControlProps['readOnly'];\n /* Sets html name attribute for the underlying control. Useful for mapping to a data field. /\n name?: FormControlProps['name'];\n /* Set visual state based on a validation state. /\n status?: FormControlProps['status'];\n /* It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. /\n info?: FormControlProps['info'];\n /* Placeholder text /\n placeholder?: FormControlProps['placeholder'];\n /\n Whether it is single selection or multi selection combobox.\n * @default 'single-select'\n /\n mode?: 'single-select' \| 'multi-select';\n /* Currently selected option, single for single-select, an array for multi-select. /\n selected?: {\n items?: Selected \| Selected[];\n onRemove?: (id: MenuItemProps['id'], index: number) => void;\n onNew?: (text: string) => void;\n };\n /* Value of the combobox filtering input. /\n value?: FormControlProps['value'];\n /* Callback fired when the filtering input value changes. /\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n /* Callback fired when the ComboBox input gains focus. /\n onFocus?: (selected?: Selected \| Selected[]) => void;\n /\n Callback fired when the ComboBox looses focus within its containing element.\n * This is not specific to the input element.\n * Note, behavior will be enhanced in an upcoming release and the input will be the only focusable element.\n /\n onBlur?: (selected?: Selected \| Selected[]) => void;\n /* Callback fired when AI suggestion is accepted/rejected /\n onResolveSuggestion?: FormControlProps['onResolveSuggestion'];\n /* Automatically focuses the input on render. /\n autoFocus?: boolean;\n /\n Fired when the user clicks on the dropdown icon to initiate opening the menu.\n * If you want to offer default menu items without an input value, pass this function.\n * This function can be an appropriate time to fetch menu item data.\n * Remember to set the loading prop to true when when fetching data for an empty list.\n \n @param open value defining whether the click opens or closes the menu\n /\n onDropdownButtonClick?: (open: boolean) => void;\n /* Fired when user clicks on the Combobox input. /\n onClick?: (e: MouseEvent) => void;\n /* Fired before running default component onKeyDown handler.\n * Returning `false` from this function prevents default onKeyDown handling.\n /\n onKeyDown?: (e: ReactKeyboardEvent) => boolean \| void;\n /* Action Buttons that will render within the input. /\n actions?: ReactNode;\n /* Menu related props. @see MenuProps /\n menu?: MenuProps;\n /* A visual which represents the selected item. /\n visual?: ReactNode;\n /* Pass a heading and content to show additional information on the field. /\n additionalInfo?: FormControlProps['additionalInfo'];\n /* Reference to the element. */\n ref?: Ref<HTMLDivElement>;\n}\n"]}
1	+ {"version":3,"file":"ComboBox.types.js","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ChangeEvent, ReactNode, Ref, KeyboardEvent as ReactKeyboardEvent } from 'react';\n\nimport type { NoChildrenProp, TestIdProp } from '../../types';\nimport { FormControlProps } from '../FormControl';\nimport { MenuItemProps, MenuProps } from '../Menu/Menu.types';\n\nexport interface Selected {\n id: string;\n text: string;\n}\n\nexport default interface ComboBoxProps extends NoChildrenProp, TestIdProp {\n /*\n Sets DOM id for the control and associates label element via 'for' attribute.\n * If an id is not pass, a random id will be generated for any render.\n /\n id?: FormControlProps['id'];\n /* Pass a string or a fragment with an Icon and string. /\n label?: FormControlProps['label'];\n /* Visually hides the label region. /\n labelHidden?: FormControlProps['labelHidden'];\n /* Indicate if the field is required. The browser defaults to false. /\n required?: FormControlProps['required'];\n /* Disable the control. The browser defaults to false. /\n disabled?: FormControlProps['disabled'];\n /* Makes the component non editable and non clickable. The browser defaults to false. /\n readOnly?: FormControlProps['readOnly'];\n /* Sets html name attribute for the underlying control. Useful for mapping to a data field. /\n name?: FormControlProps['name'];\n /* Set visual state based on a validation state. /\n status?: FormControlProps['status'];\n /* It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. /\n info?: FormControlProps['info'];\n /* Placeholder text /\n placeholder?: FormControlProps['placeholder'];\n /\n Whether it is single selection or multi selection combobox.\n * @default 'single-select'\n /\n mode?: 'single-select' \| 'multi-select';\n /* Currently selected option, single for single-select, an array for multi-select. /\n selected?: {\n items?: Selected \| Selected[];\n onRemove?: (id: MenuItemProps['id'], index: number) => void;\n onNew?: (text: string) => void;\n };\n /* Value of the combobox filtering input. /\n value?: FormControlProps['value'];\n /* Callback fired when the filtering input value changes. /\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n /* Callback fired when the ComboBox input gains focus. /\n onFocus?: (selected?: Selected \| Selected[]) => void;\n /\n Callback fired when the ComboBox looses focus within its containing element.\n * This is not specific to the input element.\n * Note, behavior will be enhanced in an upcoming release and the input will be the only focusable element.\n /\n onBlur?: (selected?: Selected \| Selected[]) => void;\n /* Callback fired when AI suggestion is accepted/rejected /\n onResolveSuggestion?: FormControlProps['onResolveSuggestion'];\n /* Automatically focuses the input on render. /\n autoFocus?: boolean;\n /\n Fired when the user clicks on the dropdown icon to initiate opening the menu.\n * If you want to offer default menu items without an input value, pass this function.\n * This function can be an appropriate time to fetch menu item data.\n * Remember to set the loading prop to true when when fetching data for an empty list.\n \n @param open value defining whether the click opens or closes the menu\n /\n onDropdownButtonClick?: (open: boolean) => void;\n /* Fired when user clicks on the Combobox input. /\n onClick?: (e: MouseEvent) => void;\n /* Fired before running default component onKeyDown handler.\n * Returning `false` from this function prevents default onKeyDown handling.\n /\n onKeyDown?: (e: ReactKeyboardEvent) => boolean \| void;\n /* Action Buttons that will render within the input. /\n actions?: ReactNode;\n /* Menu related props. @see MenuProps /\n menu?: MenuProps;\n /* A visual which represents the selected item. /\n visual?: ReactNode;\n /* Pass a heading and content to show additional information on the field. /\n additionalInfo?: FormControlProps['additionalInfo'];\n /* Reference to the element. */\n ref?: Ref<HTMLDivElement>;\n}\n"]}

package/lib/components/ComboBox/ComboxBox.test-ids.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export declare const getComboBoxTestIds: (testIdProp?: string \| undefined) => import("../..").TestIdsRecord<readonly ["control", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
2	+ //# sourceMappingURL=ComboxBox.test-ids.d.ts.map

package/lib/components/ComboBox/ComboxBox.test-ids.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"ComboxBox.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboxBox.test-ids.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,kBAAkB,wKAAgE,CAAC"}

package/lib/components/ComboBox/ComboxBox.test-ids.js ADDED Viewed

@@ -0,0 +1,4 @@
+import { createTestIds } from '../../utils';
+import { elements } from '../FormField/FormField.test-ids';
+export const getComboBoxTestIds = createTestIds('combo-box', ['control', ...elements]);
+//# sourceMappingURL=ComboxBox.test-ids.js.map

package/lib/components/ComboBox/ComboxBox.test-ids.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"ComboxBox.test-ids.js","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboxBox.test-ids.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAE3D,MAAM,CAAC,MAAM,kBAAkB,GAAG,aAAa,CAAC,WAAW,EAAE,CAAC,SAAS,EAAE,GAAG,QAAQ,CAAU,CAAC,CAAC","sourcesContent":["import { createTestIds } from '../../utils';\nimport { elements } from '../FormField/FormField.test-ids';\n\nexport const getComboBoxTestIds = createTestIds('combo-box', ['control', ...elements] as const);\n"]}

package/lib/components/CompositeInput/CompositeInput.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CompositeInput.d.ts","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;~~AAqB3C~~,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;~~AAI7D~~,QAAA,MAAM,cAAc,~~sEA6IqD~~,WAAW,GAAG,IAAI,CAAC;AAE5F,eAAe,cAAc,CAAC"}
1	+ {"version":3,"file":"CompositeInput.d.ts","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAsB3C,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAK7D,QAAA,MAAM,cAAc,sEAkJqD,WAAW,GAAG,IAAI,CAAC;AAE5F,eAAe,cAAc,CAAC"}

package/lib/components/CompositeInput/CompositeInput.js CHANGED Viewed

@@ -3,18 +3,20 @@ import { forwardRef, useEffect, useRef, useState } from 'react';
 import Icon, { registerIcon } from '../Icon';
 import * as caretDownIcon from '../Icon/icons/caret-down.icon';
 import * as timesIcon from '../Icon/icons/times.icon';
-import { useConsolidatedRef, useElement, useEscape, useI18n, useOuterEvent, useUID } from '../../hooks';
+import { useConsolidatedRef, useElement, useEscape, useI18n, useOuterEvent, useTestIds, useUID } from '../../hooks';
 import { StyledFormControl } from '../FormControl';
 import { getFocusables } from '../../utils';
 import Flex from '../Flex';
 import Button from '../Button';
-import Popover from '../Popover';
 import FormField from '../FormField';
+import { FormDialog } from '../Dialog';
 import { StyledCompositeInput, StyledInputButton, StyledInputContainer } from './CompositeInput.styles';
+import { getCompositeInputTestIds } from './CompositeInput.test-ids';
 registerIcon(caretDownIcon, timesIcon);
 const CompositeInput = forwardRef((props, ref) => {
     const uid = useUID();
-    const { id = uid, disabled, value, onClear, required, status, info, label, labelHidden, additionalInfo, dialog: { renderer: Renderer, rendererProps, onApply, onCancel }, ...restProps } = props;
+    const { testId, id = uid, disabled, value, onClear, required, status, info, label, labelHidden, additionalInfo, dialog: { renderer: Renderer, rendererProps, onApply, onCancel }, ...restProps } = props;
+    const testIds = useTestIds(testId, getCompositeInputTestIds);
     const t = useI18n();
     const [open, setOpen] = useState(false);
     const [popoverEl, setPopoverEl] = useElement(null);
@@ -39,7 +41,7 @@ const CompositeInput = forwardRef((props, ref) => {
         closePopover();
     }, document, [closePopover]);
     const labelId = `${id}-label`;
-    const Comp = (_jsxs(Flex, { as: StyledCompositeInput, forwardedAs: StyledFormControl, container: { alignItems: 'center' }, status: status, disabled: disabled, ref: containerRef, children: [_jsxs(Flex, { container: { alignItems: 'center' }, item: { grow: 1 }, as: StyledInputContainer, children: [_jsx(StyledInputButton, { ...restProps, id: id, disabled: disabled, "aria-haspopup": 'dialog', "aria-expanded": !disabled && open, "aria-describedby": info ? `${id}-info` : undefined, readOnly: true, required: required, onClick: () => {
+    const Comp = (_jsxs(Flex, { as: StyledCompositeInput, forwardedAs: StyledFormControl, container: { alignItems: 'center' }, status: status, disabled: disabled, ref: containerRef, children: [_jsxs(Flex, { container: { alignItems: 'center' }, item: { grow: 1 }, as: StyledInputContainer, children: [_jsx(StyledInputButton, { "data-testid": testIds.control, ...restProps, id: id, disabled: disabled, "aria-haspopup": 'dialog', "aria-expanded": !disabled && open, "aria-describedby": info ? `${id}-info` : undefined, readOnly: true, required: required, onClick: () => {
                             if (!disabled) {
                                 setOpen(true);
                             }
@@ -48,15 +50,24 @@ const CompositeInput = forwardRef((props, ref) => {
                                 e.preventDefault();
                                 setOpen(true);
                             }
-                        }, value: value ?? '', ref: buttonRef }), _jsx(Flex, { container: { justify: 'center', alignItems: 'center' }, style: { pointerEvents: value ? '' : 'none' }, children: value && !open ? (_jsx(Button, { icon: true, compact: true, variant: 'simple', label: t('clear'), onClick: onClear, children: _jsx(Icon, { name: 'times' }) })) : (_jsx(Icon, { name: 'caret-down' })) })] }), open && (_jsx(Popover, { ref: setPopoverEl, role: 'dialog', target: containerRef.current, placement: 'bottom-start', strategy: 'fixed', modifiers: [
-                    {
-                        name: 'flip',
-                        options: {
-                            fallbackPlacements: ['top-start']
-                        }
-                    }
-                ], children: _jsxs(Flex, { container: { direction: 'column', gap: 1.5, pad: 2 }, ref: formContentRef, children: [_jsx(Renderer, { ...rendererProps }), _jsxs(Flex, { container: { justify: 'between' }, children: [_jsx(Button, { variant: 'secondary', onClick: () => onCancel({ close: closePopover }), children: t('cancel') }), _jsx(Button, { variant: 'primary', onClick: () => onApply({ close: closePopover }), children: t('apply') })] })] }) }))] }));
-    return label ? (_jsx(FormField, { ...{ label, labelHidden, id, info, status, required, disabled, labelId, additionalInfo }, children: Comp })) : (Comp);
+                        }, value: value ?? '', ref: buttonRef }), _jsx(Flex, { container: { justify: 'center', alignItems: 'center' }, style: { pointerEvents: value ? '' : 'none' }, children: value && !open ? (_jsx(Button, { icon: true, compact: true, variant: 'simple', label: t('clear'), onClick: onClear, children: _jsx(Icon, { name: 'times' }) })) : (_jsx(Icon, { name: 'caret-down' })) })] }), open && containerRef.current && (_jsx(FormDialog, { arrow: false,
+                // FIXME: The wrath of optional labels, as a ReactNode, strikes again...
+                ariaLabel: label, ref: setPopoverEl, target: containerRef.current, placement: 'bottom-start', onCancel: () => onCancel({ close: closePopover }), onSubmit: {
+                    text: t('apply'),
+                    handler: () => onApply({ close: closePopover })
+                }, children: _jsx(Flex, { container: { direction: 'column' }, ref: formContentRef, children: _jsx(Renderer, { ...rendererProps }) }) }))] }));
+    return label ? (_jsx(FormField, { ...{
+            testId: testIds,
+            label,
+            labelHidden,
+            id,
+            info,
+            status,
+            required,
+            disabled,
+            labelId,
+            additionalInfo
+        }, children: Comp })) : (Comp);
 });
 export default CompositeInput;
 //# sourceMappingURL=CompositeInput.js.map

package/lib/components/CompositeInput/CompositeInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CompositeInput.js","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAmB,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjF,OAAO,IAAI,EAAE,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,KAAK,aAAa,MAAM,+BAA+B,CAAC;AAC/D,OAAO,KAAK,SAAS,MAAM,0BAA0B,CAAC;AAEtD,OAAO,EACL,kBAAkB,EAClB,UAAU,EACV,SAAS,EACT,OAAO,EACP,aAAa,EACb,MAAM,EACP,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,~~OAAO~~,MAAM,~~YAAY~~,CAAC;~~AACjC~~,OAAO,~~SAAS~~,MAAM,~~cAAc~~,CAAC;~~AAErC~~,OAAO,EACL,oBAAoB,EACpB,iBAAiB,EACjB,oBAAoB,EACrB,MAAM,yBAAyB,CAAC;~~AAGjC~~,YAAY,CAAC,aAAa,EAAE,SAAS,CAAC,CAAC;AAEvC,MAAM,cAAc,GAAG,UAAU,CAC/B,CAAC,KAA2C,EAAE,GAA+B,EAAE,EAAE;IAC/E,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IACrB,MAAM,EACJ,EAAE,GAAG,GAAG,EACR,QAAQ,EACR,KAAK,EACL,OAAO,EACP,QAAQ,EACR,MAAM,EACN,IAAI,EACJ,KAAK,EACL,WAAW,EACX,cAAc,EACd,MAAM,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,aAAa,EAAE,OAAO,EAAE,QAAQ,EAAE,EAChE,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;~~IACV~~,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAExC,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,UAAU,CAAc,IAAI,CAAC,CAAC;IAChE,MAAM,YAAY,GAAG,kBAAkB,CAAiB,GAAG,CAAC,CAAC;IAC7D,MAAM,SAAS,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IACjD,MAAM,cAAc,GAAG,MAAM,CAAc,IAAI,CAAC,CAAC;IAEjD,MAAM,YAAY,GAAG,GAAG,EAAE;QACxB,OAAO,CAAC,KAAK,CAAC,CAAC;QACf,SAAS,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;IAC7B,CAAC,CAAC;IAEF,aAAa,CAAC,WAAW,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC,EAAE,GAAG,EAAE;QACtD,IAAI,IAAI;YAAE,QAAQ,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,CAAC,CAAC;IAC9C,CAAC,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,IAAI,EAAE;YACR,aAAa,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC;SAC3C;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IAEnC,SAAS,CACP,CAAC,CAAC,EAAE;QACF,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,YAAY,EAAE,CAAC;IACjB,CAAC,EACD,QAAQ,EACR,CAAC,YAAY,CAAC,CACf,CAAC;IAEF,MAAM,OAAO,GAAG,GAAG,EAAE,QAAQ,CAAC;IAE9B,MAAM,IAAI,GAAG,CACX,MAAC,IAAI,IACH,EAAE,EAAE,oBAAoB,EACxB,WAAW,EAAE,iBAAiB,EAC9B,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,EACnC,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAE,YAAY,aAEjB,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,oBAAoB,aACpF,KAAC,iBAAiB,~~OACZ~~,SAAS,EACb,EAAE,EAAE,EAAE,EACN,QAAQ,EAAE,QAAQ,mBACJ,QAAQ,mBACP,CAAC,QAAQ,IAAI,IAAI,sBACd,IAAI,CAAC,CAAC,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC,CAAC,SAAS,EACjD,QAAQ,QACR,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,GAAG,EAAE;4BACZ,IAAI,CAAC,QAAQ,EAAE;gCACb,OAAO,CAAC,IAAI,CAAC,CAAC;6BACf;wBACH,CAAC,EACD,SAAS,EAAE,CAAC,CAAC,EAAE;4BACb,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;gCACrB,CAAC,CAAC,cAAc,EAAE,CAAC;gCACnB,OAAO,CAAC,IAAI,CAAC,CAAC;6BACf;wBACH,CAAC,EACD,KAAK,EAAE,KAAK,IAAI,EAAE,EAClB,GAAG,EAAE,SAAS,GACd,EACF,KAAC,IAAI,IACH,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,EACtD,KAAK,EAAE,EAAE,aAAa,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,EAAE,YAE5C,KAAK,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAChB,KAAC,MAAM,IAAC,IAAI,QAAC,OAAO,QAAC,OAAO,EAAC,QAAQ,EAAC,KAAK,EAAE,CAAC,CAAC,OAAO,CAAC,EAAE,OAAO,EAAE,OAAO,YACvE,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACd,CACV,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,GAAG,CAC3B,GACI,IACF,EAEN,IAAI,IAAI,~~CACP~~,~~KAAC~~,OAAO,~~IACN~~,~~GAAG~~,~~EAAE~~,~~YAAY~~,~~EACjB~~,~~IAAI~~,~~EAAC,QAAQ,EACb,MAAM,~~EAAE,~~YAAY~~,~~CAAC~~,~~OAAO,EAC5B,~~SAAS,~~EAAC~~,~~cAAc~~,~~EACxB~~,~~QAAQ~~,~~EAAC,OAAO,EAChB,SAAS,~~EAAE~~;oBACT;wBACE~~,~~IAAI~~,~~EAAE~~,MAAM~~;wBACZ~~,~~OAAO,~~EAAE~~;4BACP~~,~~kBAAkB~~,~~EAAE,~~CAAC,~~WAAW~~,~~CAAC;yBAClC;qBACF;iBACF~~,~~YAED,MAAC,IAAI,IAAC,~~SAAS,~~EAAE~~,~~EAAE~~,~~SAAS~~,~~EAAE,~~QAAQ,EAAE,GAAG,EAAE,~~GAAG~~,~~EAAE~~,~~GAAG~~,EAAE,~~CAAC~~,EAAE,~~EAAE~~,~~GAAG,~~EAAE,~~cAAc~~,~~aAC7E~~,~~KAAC,~~QAAQ,~~OAAK~~,~~aAAa,GAAI,EAC/B,MAAC,~~IAAI,~~IAAC,SAAS,~~EAAE,~~EAAE~~,~~OAAO~~,~~EAAE,SAAS,EAAE,aACrC,KAAC,MAAM,IAAC,~~OAAO,~~EAAC~~,~~WAAW,EAAC,~~OAAO,EAAE,GAAG,EAAE,CAAC,~~QAAQ~~,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,CAAC,~~YACzE~~,~~CAAC,CAAC,QAAQ,CAAC,GACL,EACT,~~KAAC,~~MAAM~~,IAAC,~~OAAO,EAAC,~~SAAS,~~EAAC~~,~~OAAO,~~EAAE,~~GAAG~~,EAAE,~~CAAC~~,~~OAAO,CAAC,~~EAAE,~~KAAK,~~EAAE,~~YAAY~~,EAAE,~~CAAC~~,~~YACtE~~,~~CAAC~~,~~CAAC~~,~~OAAO~~,~~CAAC~~,~~GACJ~~,~~IACJ~~,~~IACF~~,~~GACC~~,~~CACX,~~IACI,CACR,CAAC;IAEF,OAAO,KAAK,CAAC,CAAC,CAAC,CACb,KAAC,SAAS,OACJ,EAAE,KAAK,~~EAAE,~~WAAW,EAAE,~~EAAE,EAAE,~~IAAI,~~EAAE,~~MAAM,~~EAAE,~~QAAQ,~~EAAE,~~QAAQ,~~EAAE,~~OAAO,~~EAAE,~~cAAc,~~EAAE~~,~~YAExF,~~IAAI,GACK,CACb,CAAC,CAAC,CAAC,CACF,IAAI,CACL,CAAC;AACJ,CAAC,CACwF,CAAC;AAE5F,eAAe,cAAc,CAAC","sourcesContent":["import { forwardRef, PropsWithoutRef, useEffect, useRef, useState } from 'react';\n\nimport Icon, { registerIcon } from '../Icon';\nimport * as caretDownIcon from '../Icon/icons/caret-down.icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport { ForwardProps } from '../../types';\nimport {\n useConsolidatedRef,\n useElement,\n useEscape,\n useI18n,\n useOuterEvent,\n useUID\n} from '../../hooks';\nimport { StyledFormControl } from '../FormControl';\nimport { getFocusables } from '../../utils';\nimport Flex from '../Flex';\nimport Button from '../Button';\nimport ~~Popover~~ from '../~~Popover~~';\nimport ~~FormField~~ from '../~~FormField~~';\n\nimport {\n StyledCompositeInput,\n StyledInputButton,\n StyledInputContainer\n} from './CompositeInput.styles';\nimport { CompositeInputProps } from './CompositeInput.types';\n\nregisterIcon(caretDownIcon, timesIcon);\n\nconst CompositeInput = forwardRef(\n (props: PropsWithoutRef<CompositeInputProps>, ref: CompositeInputProps['ref']) => {\n const uid = useUID();\n const {\n id = uid,\n disabled,\n value,\n onClear,\n required,\n status,\n info,\n label,\n labelHidden,\n additionalInfo,\n dialog: { renderer: Renderer, rendererProps, onApply, onCancel },\n ...restProps\n } = props;\n const t = useI18n();\n\n const [open, setOpen] = useState(false);\n\n const [popoverEl, setPopoverEl] = useElement<HTMLElement>(null);\n const containerRef = useConsolidatedRef<HTMLDivElement>(ref);\n const buttonRef = useRef<HTMLInputElement>(null);\n const formContentRef = useRef<HTMLElement>(null);\n\n const closePopover = () => {\n setOpen(false);\n buttonRef.current?.focus();\n };\n\n useOuterEvent('mousedown', [popoverEl, buttonRef], () => {\n if (open) onCancel({ close: closePopover });\n });\n\n useEffect(() => {\n if (open) {\n getFocusables(formContentRef)[0]?.focus();\n }\n }, [open, formContentRef.current]);\n\n useEscape(\n e => {\n e.preventDefault();\n closePopover();\n },\n document,\n [closePopover]\n );\n\n const labelId = `${id}-label`;\n\n const Comp = (\n <Flex\n as={StyledCompositeInput}\n forwardedAs={StyledFormControl}\n container={{ alignItems: 'center' }}\n status={status}\n disabled={disabled}\n ref={containerRef}\n >\n <Flex container={{ alignItems: 'center' }} item={{ grow: 1 }} as={StyledInputContainer}>\n <StyledInputButton\n {...restProps}\n id={id}\n disabled={disabled}\n aria-haspopup='dialog'\n aria-expanded={!disabled && open}\n aria-describedby={info ? `${id}-info` : undefined}\n readOnly\n required={required}\n onClick={() => {\n if (!disabled) {\n setOpen(true);\n }\n }}\n onKeyDown={e => {\n if (e.key === 'Enter') {\n e.preventDefault();\n setOpen(true);\n }\n }}\n value={value ?? ''}\n ref={buttonRef}\n />\n <Flex\n container={{ justify: 'center', alignItems: 'center' }}\n style={{ pointerEvents: value ? '' : 'none' }}\n >\n {value && !open ? (\n <Button icon compact variant='simple' label={t('clear')} onClick={onClear}>\n <Icon name='times' />\n </Button>\n ) : (\n <Icon name='caret-down' />\n )}\n </Flex>\n </Flex>\n\n {open && (\n <~~Popover~~\n ~~ref~~={~~setPopoverEl~~}\n ~~role~~=~~'dialog'~~\n target={containerRef.current}\n placement='bottom-start'\n ~~strategy~~=~~'fixed'~~\n ~~modifiers~~={[\n ~~{\n name~~: '~~flip~~',\n ~~options~~: {~~\n fallbackPlacements~~: ~~['top-start']\n~~ }\n ~~}\n~~ ]}\n >\n <Flex container={{ direction: 'column', ~~gap: 1.5, pad: 2~~ }} ref={formContentRef}>\n <Renderer {...rendererProps} />\n <Flex container={{ justify: 'between' }}>\n <Button variant='secondary' onClick={() => onCancel({ close: closePopover })}>\n {t('cancel')}\n </Button>\n <Button variant='primary' onClick={() => onApply({ close: closePopover })}>\n {t('apply')}\n </Button>\n </Flex>\n </Flex>\n </~~Popover~~>\n )}\n </Flex>\n );\n\n return label ? (\n <FormField\n {...{ label, labelHidden, id, info, status, required, disabled, labelId, additionalInfo }}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n) as <P extends object>(props: CompositeInputProps<P> & ForwardProps) => JSX.Element \| null;\n\nexport default CompositeInput;\n"]}
1	+ {"version":3,"file":"CompositeInput.js","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, PropsWithoutRef, useEffect, useRef, useState } from 'react';\n\nimport Icon, { registerIcon } from '../Icon';\nimport * as caretDownIcon from '../Icon/icons/caret-down.icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport { ForwardProps } from '../../types';\nimport {\n useConsolidatedRef,\n useElement,\n useEscape,\n useI18n,\n useOuterEvent,\n useTestIds,\n useUID\n} from '../../hooks';\nimport { StyledFormControl } from '../FormControl';\nimport { getFocusables } from '../../utils';\nimport Flex from '../Flex';\nimport Button from '../Button';\nimport FormField from '../FormField';\nimport { FormDialog } from '../Dialog';\n\nimport {\n StyledCompositeInput,\n StyledInputButton,\n StyledInputContainer\n} from './CompositeInput.styles';\nimport { CompositeInputProps } from './CompositeInput.types';\nimport { getCompositeInputTestIds } from './CompositeInput.test-ids';\n\nregisterIcon(caretDownIcon, timesIcon);\n\nconst CompositeInput = forwardRef(\n (props: PropsWithoutRef<CompositeInputProps>, ref: CompositeInputProps['ref']) => {\n const uid = useUID();\n const {\n testId,\n id = uid,\n disabled,\n value,\n onClear,\n required,\n status,\n info,\n label,\n labelHidden,\n additionalInfo,\n dialog: { renderer: Renderer, rendererProps, onApply, onCancel },\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getCompositeInputTestIds);\n const t = useI18n();\n\n const [open, setOpen] = useState(false);\n\n const [popoverEl, setPopoverEl] = useElement<HTMLElement>(null);\n const containerRef = useConsolidatedRef<HTMLDivElement>(ref);\n const buttonRef = useRef<HTMLInputElement>(null);\n const formContentRef = useRef<HTMLElement>(null);\n\n const closePopover = () => {\n setOpen(false);\n buttonRef.current?.focus();\n };\n\n useOuterEvent('mousedown', [popoverEl, buttonRef], () => {\n if (open) onCancel({ close: closePopover });\n });\n\n useEffect(() => {\n if (open) {\n getFocusables(formContentRef)[0]?.focus();\n }\n }, [open, formContentRef.current]);\n\n useEscape(\n e => {\n e.preventDefault();\n closePopover();\n },\n document,\n [closePopover]\n );\n\n const labelId = `${id}-label`;\n\n const Comp = (\n <Flex\n as={StyledCompositeInput}\n forwardedAs={StyledFormControl}\n container={{ alignItems: 'center' }}\n status={status}\n disabled={disabled}\n ref={containerRef}\n >\n <Flex container={{ alignItems: 'center' }} item={{ grow: 1 }} as={StyledInputContainer}>\n <StyledInputButton\n data-testid={testIds.control}\n {...restProps}\n id={id}\n disabled={disabled}\n aria-haspopup='dialog'\n aria-expanded={!disabled && open}\n aria-describedby={info ? `${id}-info` : undefined}\n readOnly\n required={required}\n onClick={() => {\n if (!disabled) {\n setOpen(true);\n }\n }}\n onKeyDown={e => {\n if (e.key === 'Enter') {\n e.preventDefault();\n setOpen(true);\n }\n }}\n value={value ?? ''}\n ref={buttonRef}\n />\n <Flex\n container={{ justify: 'center', alignItems: 'center' }}\n style={{ pointerEvents: value ? '' : 'none' }}\n >\n {value && !open ? (\n <Button icon compact variant='simple' label={t('clear')} onClick={onClear}>\n <Icon name='times' />\n </Button>\n ) : (\n <Icon name='caret-down' />\n )}\n </Flex>\n </Flex>\n\n {open && containerRef.current && (\n <FormDialog\n arrow={false}\n // FIXME: The wrath of optional labels, as a ReactNode, strikes again...\n ariaLabel={label as string}\n ref={setPopoverEl}\n target={containerRef.current}\n placement='bottom-start'\n onCancel={() => onCancel({ close: closePopover })}\n onSubmit={{\n text: t('apply'),\n handler: () => onApply({ close: closePopover })\n }}\n >\n <Flex container={{ direction: 'column' }} ref={formContentRef}>\n <Renderer {...rendererProps} />\n </Flex>\n </FormDialog>\n )}\n </Flex>\n );\n\n return label ? (\n <FormField\n {...{\n testId: testIds,\n label,\n labelHidden,\n id,\n info,\n status,\n required,\n disabled,\n labelId,\n additionalInfo\n }}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n) as <P extends object>(props: CompositeInputProps<P> & ForwardProps) => JSX.Element \| null;\n\nexport default CompositeInput;\n"]}

package/lib/components/CompositeInput/CompositeInput.test-ids.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export declare const getCompositeInputTestIds: (testIdProp?: string \| undefined) => import("../..").TestIdsRecord<readonly ["control", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
2	+ //# sourceMappingURL=CompositeInput.test-ids.d.ts.map

package/lib/components/CompositeInput/CompositeInput.test-ids.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"CompositeInput.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.test-ids.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,wBAAwB,wKAG1B,CAAC"}

package/lib/components/CompositeInput/CompositeInput.test-ids.js ADDED Viewed

@@ -0,0 +1,7 @@
+import { createTestIds } from '../../utils';
+import { elements } from '../FormField/FormField.test-ids';
+export const getCompositeInputTestIds = createTestIds('composite-input', [
+    'control',
+    ...elements
+]);
+//# sourceMappingURL=CompositeInput.test-ids.js.map

package/lib/components/CompositeInput/CompositeInput.test-ids.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"CompositeInput.test-ids.js","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.test-ids.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAE3D,MAAM,CAAC,MAAM,wBAAwB,GAAG,aAAa,CAAC,iBAAiB,EAAE;IACvE,SAAS;IACT,GAAG,QAAQ;CACH,CAAC,CAAC","sourcesContent":["import { createTestIds } from '../../utils';\nimport { elements } from '../FormField/FormField.test-ids';\n\nexport const getCompositeInputTestIds = createTestIds('composite-input', [\n 'control',\n ...elements\n] as const);\n"]}

package/lib/components/CompositeInput/CompositeInput.types.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 import { ComponentType, Ref } from 'react';
-import { BaseProps, DeferInfer, NoChildrenProp } from '../../types';
+import { BaseProps, DeferInfer, NoChildrenProp, TestIdProp } from '../../types';
 import { FormControlProps } from '../FormControl';
-export interface CompositeInputProps<P extends object = object> extends BaseProps, NoChildrenProp {
+export interface CompositeInputProps<P extends object = object> extends BaseProps, NoChildrenProp, TestIdProp {
     /**
      * Sets DOM id for the control and associates label element via 'for' attribute.
      * If an id is not pass, a random id will be generated for any render.

package/lib/components/CompositeInput/CompositeInput.types.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CompositeInput.types.d.ts","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE3C,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;~~AACpE~~,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAElD,MAAM,WAAW,mBAAmB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,~~CAAE~~,SAAQ,SAAS,~~EAAE~~,cAAc;~~IAC/F~~;;;OAGG;IACH,EAAE,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC5B,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,uCAAuC;IACvC,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,6GAA6G;IAC7G,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,6CAA6C;IAC7C,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,kDAAkD;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+CAA+C;IAC/C,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,mFAAmF;IACnF,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACpD,0BAA0B;IAC1B,MAAM,EAAE;QACN;;WAEG;QACH,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;QAC3B;;WAEG;QACH,aAAa,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC;QAC9B,8CAA8C;QAC9C,QAAQ,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE;YAAE,KAAK,EAAE,MAAM,IAAI,CAAA;SAAE,KAAK,IAAI,CAAC;QACrD,6CAA6C;QAC7C,OAAO,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE;YAAE,KAAK,EAAE,MAAM,IAAI,CAAA;SAAE,KAAK,IAAI,CAAC;KACrD,CAAC;IACF,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B"}
1	+ {"version":3,"file":"CompositeInput.types.d.ts","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE3C,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAChF,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAElD,MAAM,WAAW,mBAAmB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,CAC5D,SAAQ,SAAS,EACf,cAAc,EACd,UAAU;IACZ;;;OAGG;IACH,EAAE,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC5B,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,uCAAuC;IACvC,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,6GAA6G;IAC7G,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,6CAA6C;IAC7C,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,kDAAkD;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+CAA+C;IAC/C,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,mFAAmF;IACnF,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACpD,0BAA0B;IAC1B,MAAM,EAAE;QACN;;WAEG;QACH,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;QAC3B;;WAEG;QACH,aAAa,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC;QAC9B,8CAA8C;QAC9C,QAAQ,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE;YAAE,KAAK,EAAE,MAAM,IAAI,CAAA;SAAE,KAAK,IAAI,CAAC;QACrD,6CAA6C;QAC7C,OAAO,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE;YAAE,KAAK,EAAE,MAAM,IAAI,CAAA;SAAE,KAAK,IAAI,CAAC;KACrD,CAAC;IACF,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B"}

package/lib/components/CompositeInput/CompositeInput.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CompositeInput.types.js","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ComponentType, Ref } from 'react';\n\nimport { BaseProps, DeferInfer, NoChildrenProp } from '../../types';\nimport { FormControlProps } from '../FormControl';\n\nexport interface CompositeInputProps<P extends object = object> extends BaseProps, NoChildrenProp {\n /*\n Sets DOM id for the control and associates label element via 'for' attribute.\n * If an id is not pass, a random id will be generated for any render.\n /\n id?: FormControlProps['id'];\n /* Set visual state based on a validation state. /\n status?: FormControlProps['status'];\n /* Pass a string or a fragment with an Icon and string. /\n label?: FormControlProps['label'];\n /* Visually hides the label region. /\n labelHidden?: FormControlProps['labelHidden'];\n /* It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. /\n info?: FormControlProps['info'];\n /* Indicate if the field is required. The browser defaults to false. /\n required?: FormControlProps['required'];\n /* Disable the control. The browser defaults to false. /\n disabled?: FormControlProps['disabled'];\n /* Callback when clear button is clicked. /\n onClear: () => void;\n /* String representation of the complex value. /\n value?: string;\n /* Text visible when on value has been set. /\n placeholder?: FormControlProps['placeholder'];\n /* Button when clicked will show additional information for the composite input /\n additionalInfo?: FormControlProps['additionalInfo'];\n /* Value form options. /\n dialog: {\n /\n A component to render the main portion of the form.\n /\n renderer: ComponentType<P>;\n /\n A props object that will be passed to the form renderer.\n /\n rendererProps?: DeferInfer<P>;\n /* Callback when cancel button is clicked. /\n onCancel: ({ close }: { close: () => void }) => void;\n /* Callback when apply button is clicked. /\n onApply: ({ close }: { close: () => void }) => void;\n };\n /* Ref forwarded to the wrapping element. */\n ref?: Ref<HTMLDivElement>;\n}\n"]}
1	+ {"version":3,"file":"CompositeInput.types.js","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ComponentType, Ref } from 'react';\n\nimport { BaseProps, DeferInfer, NoChildrenProp, TestIdProp } from '../../types';\nimport { FormControlProps } from '../FormControl';\n\nexport interface CompositeInputProps<P extends object = object>\n extends BaseProps,\n NoChildrenProp,\n TestIdProp {\n /*\n Sets DOM id for the control and associates label element via 'for' attribute.\n * If an id is not pass, a random id will be generated for any render.\n /\n id?: FormControlProps['id'];\n /* Set visual state based on a validation state. /\n status?: FormControlProps['status'];\n /* Pass a string or a fragment with an Icon and string. /\n label?: FormControlProps['label'];\n /* Visually hides the label region. /\n labelHidden?: FormControlProps['labelHidden'];\n /* It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. /\n info?: FormControlProps['info'];\n /* Indicate if the field is required. The browser defaults to false. /\n required?: FormControlProps['required'];\n /* Disable the control. The browser defaults to false. /\n disabled?: FormControlProps['disabled'];\n /* Callback when clear button is clicked. /\n onClear: () => void;\n /* String representation of the complex value. /\n value?: string;\n /* Text visible when on value has been set. /\n placeholder?: FormControlProps['placeholder'];\n /* Button when clicked will show additional information for the composite input /\n additionalInfo?: FormControlProps['additionalInfo'];\n /* Value form options. /\n dialog: {\n /\n A component to render the main portion of the form.\n /\n renderer: ComponentType<P>;\n /\n A props object that will be passed to the form renderer.\n /\n rendererProps?: DeferInfer<P>;\n /* Callback when cancel button is clicked. /\n onCancel: ({ close }: { close: () => void }) => void;\n /* Callback when apply button is clicked. /\n onApply: ({ close }: { close: () => void }) => void;\n };\n /* Ref forwarded to the wrapping element. */\n ref?: Ref<HTMLDivElement>;\n}\n"]}

package/lib/components/Configuration/Configuration.d.ts CHANGED Viewed

@@ -44,6 +44,11 @@ export interface ConfigurationProps {
      * String to identify this configuration instance.
      */
     id?: string;
+    /**
+     * Enable/disable testId attribute rendering for all components.
+     * @default true
+     */
+    testIds?: boolean;
 }
 export interface ConfigurationContextValue {
     locale: string;
@@ -54,6 +59,7 @@ export interface ConfigurationContextValue {
     portalTarget?: Element;
     loadedRef: MutableRefObject<boolean>;
     renderNativeControls: boolean;
+    testIds?: ConfigurationProps['testIds'];
     /** @internal */
     initialized: boolean;
 }

package/lib/components/Configuration/Configuration.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Configuration.d.ts","sourceRoot":"","sources":["../../../src/components/Configuration/Configuration.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EACjB,SAAS,EAIT,OAAO,EACP,gBAAgB,EACjB,MAAM,OAAO,CAAC;AAKf,OAAO,EAEL,gBAAgB,EAEhB,oBAAoB,EACpB,sBAAsB,EACvB,MAAM,aAAa,CAAC;AACrB,OAAO,EAEL,WAAW,EACX,eAAe,EAGhB,MAAM,YAAY,CAAC;AAGpB,OAAO,YAAY,CAAC;AAEpB,MAAM,WAAW,kBAAkB;IACjC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC;IAC1B;;OAEG;IACH,YAAY,CAAC,EAAE,WAAW,CAAC;IAC3B;;OAEG;IACH,KAAK,CAAC,EAAE,oBAAoB,CAAC;IAC7B;;OAEG;IACH,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC;;OAEG;IACH,gBAAgB,CAAC,EAAE,WAAW,CAAC;IAC/B;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;OAGG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;~~CACb~~;AAED,MAAM,WAAW,yBAAyB;IACxC,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,kBAAkB,CAAC,WAAW,CAAC,CAAC;IAC3C,YAAY,EAAE,eAAe,CAAC;IAC9B,YAAY,EAAE,gBAAgB,CAAC,sBAAsB,CAAC,CAAC;IACvD,gBAAgB,CAAC,EAAE,WAAW,CAAC;IAC/B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACrC,oBAAoB,EAAE,OAAO,CAAC;IAC9B,gBAAgB;IAChB,WAAW,EAAE,OAAO,CAAC;CACtB;AAID,eAAO,MAAM,oBAAoB,~~oCAU~~/B,CAAC;AAIH,UAAU,cAAc;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,cAAc,EAAE,MAAM,EAAE,CAAC;IACzB,UAAU,EAAE,MAAM,EAAE,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CACpC;AA4BD,OAAO,QAAQ,YAAY,CAAC;IAC1B,UAAiB,aAAa;QAC5B,SAAS,CAAC,EAAE,cAAc,EAAE,CAAC;QAC7B,oBAAoB,CAAC,EAAE,OAAO,CAAC,yBAAyB,CAAC,CAAC;KAC3D;CACF;AAUD,QAAA,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,~~CA8ExD~~,CAAC;AAEF,eAAe,aAAa,CAAC"}
1	+ {"version":3,"file":"Configuration.d.ts","sourceRoot":"","sources":["../../../src/components/Configuration/Configuration.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EACjB,SAAS,EAIT,OAAO,EACP,gBAAgB,EACjB,MAAM,OAAO,CAAC;AAKf,OAAO,EAEL,gBAAgB,EAEhB,oBAAoB,EACpB,sBAAsB,EACvB,MAAM,aAAa,CAAC;AACrB,OAAO,EAEL,WAAW,EACX,eAAe,EAGhB,MAAM,YAAY,CAAC;AAGpB,OAAO,YAAY,CAAC;AAEpB,MAAM,WAAW,kBAAkB;IACjC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC;IAC1B;;OAEG;IACH,YAAY,CAAC,EAAE,WAAW,CAAC;IAC3B;;OAEG;IACH,KAAK,CAAC,EAAE,oBAAoB,CAAC;IAC7B;;OAEG;IACH,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC;;OAEG;IACH,gBAAgB,CAAC,EAAE,WAAW,CAAC;IAC/B;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;OAGG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,yBAAyB;IACxC,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,kBAAkB,CAAC,WAAW,CAAC,CAAC;IAC3C,YAAY,EAAE,eAAe,CAAC;IAC9B,YAAY,EAAE,gBAAgB,CAAC,sBAAsB,CAAC,CAAC;IACvD,gBAAgB,CAAC,EAAE,WAAW,CAAC;IAC/B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACrC,oBAAoB,EAAE,OAAO,CAAC;IAC9B,OAAO,CAAC,EAAE,kBAAkB,CAAC,SAAS,CAAC,CAAC;IACxC,gBAAgB;IAChB,WAAW,EAAE,OAAO,CAAC;CACtB;AAID,eAAO,MAAM,oBAAoB,oCAW/B,CAAC;AAIH,UAAU,cAAc;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,cAAc,EAAE,MAAM,EAAE,CAAC;IACzB,UAAU,EAAE,MAAM,EAAE,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CACpC;AA4BD,OAAO,QAAQ,YAAY,CAAC;IAC1B,UAAiB,aAAa;QAC5B,SAAS,CAAC,EAAE,cAAc,EAAE,CAAC;QAC7B,oBAAoB,CAAC,EAAE,OAAO,CAAC,yBAAyB,CAAC,CAAC;KAC3D;CACF;AAUD,QAAA,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,CAiFxD,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/lib/components/Configuration/Configuration.js CHANGED Viewed

@@ -18,6 +18,7 @@ export const ConfigurationContext = createContext({
     portalTarget: documentIsAvailable ? document.body : undefined,
     loadedRef: { current: false },
     renderNativeControls: false,
+    testIds: true,
     initialized: false
 });
 const mountedConfigs = new Set();
@@ -47,7 +48,7 @@ if (windowIsAvailable) {
     }
     window.cosmos.instances.push(instance);
 }
-const Configuration = ({ children, locale, direction, translations: customTranslations, theme, disableDefaultFontLoading, styleSheetTarget, portalTarget, renderNativeControls, id }) => {
+const Configuration = ({ children, locale, direction, translations: customTranslations, theme, disableDefaultFontLoading, styleSheetTarget, portalTarget, renderNativeControls, testIds, id }) => {
     const context = windowIsAvailable
         ? window.cosmos.configurationContext ?? ConfigurationContext
         : ConfigurationContext;
@@ -71,7 +72,11 @@ const Configuration = ({ children, locale, direction, translations: customTransl
                     mounted &&
                     documentIsAvailable &&
                     createPortal(_jsx("link", { rel: 'stylesheet', href: 'https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400..700;1,400..700&display=swap', "data-cosmos-global-style": true }), styleSheetTarget ?? ctx.styleSheetTarget ?? document.head), _jsx(GlobalStyle, {}), children] }) }));
-    return (_jsx(context.Provider, { value: {
+    return (_jsx(context.Provider
+    // eslint-disable-next-line react/jsx-no-constructed-context-values
+    , {
+        // eslint-disable-next-line react/jsx-no-constructed-context-values
+        value: {
             locale: locale ?? ctx.locale,
             direction: direction ?? (locale !== undefined ? directionOfLocale(locale) : ctx.direction),
             translations,
@@ -80,6 +85,7 @@ const Configuration = ({ children, locale, direction, translations: customTransl
             portalTarget: portalTarget ?? ctx.portalTarget,
             loadedRef: ctx.loadedRef,
             renderNativeControls: renderNativeControls ?? ctx.renderNativeControls,
+            testIds: testIds ?? ctx.testIds,
             initialized: true
         }, children: _jsx(ThemeProvider, { theme: themeMachine.theme, children: wrappedChildren }) }));
 };

package/lib/components/Configuration/Configuration.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Configuration.js","sourceRoot":"","sources":["../../../src/components/Configuration/Configuration.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n createContext,\n useContext,\n FunctionComponent,\n ReactNode,\n useMemo,\n useState,\n useEffect,\n Context,\n MutableRefObject\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { ThemeProvider, StyleSheetManager } from 'styled-components';\n\nimport { GlobalStyle } from '../../styles';\nimport {\n ThemeMachine,\n ThemeMachineLike,\n BaseThemeMachine,\n DefaultSettableTheme,\n DefaultThemeDefinition\n} from '../../theme';\nimport {\n createTranslationPack,\n Translation,\n TranslationPack,\n DefaultTranslation,\n direction as directionOfLocale\n} from '../../i18n';\nimport { windowIsAvailable, navigatorIsAvailable, documentIsAvailable } from '../../utils';\nimport pkg from '../../../package.json';\nimport '../../init';\n\nexport interface ConfigurationProps {\n /*\n Any components or nodes that should be impacted by the settings applied by this Configuration component.\n /\n children: ReactNode;\n /\n User locale as defined in [BCP-47](https://www.techonthenet.com/js/language_tags.php).\n /\n locale?: string;\n /\n Override rendering direction of the document. Direction will be based on the locale if now provided.\n /\n direction?: 'ltr' \| 'rtl';\n /\n Object with (partial) translations.\n /\n translations?: Translation;\n /\n Theme object used to override any or all Cosmos theme properties.\n /\n theme?: DefaultSettableTheme;\n /\n Disables loading Open Sans from Google Fonts. Only takes effect on the root configuration.\n /\n disableDefaultFontLoading?: boolean;\n /\n Target element for loading styles related to `styled-components`.\n /\n styleSheetTarget?: HTMLElement;\n /\n Target element for rendering a `ReactDOM` portal.\n /\n portalTarget?: Element;\n /\n Use native HTML5 controls for inputs instead of rich ones.\n * @default false\n /\n renderNativeControls?: boolean;\n /\n String to identify this configuration instance.\n /\n id?: string;\n}\n\nexport interface ConfigurationContextValue {\n locale: string;\n direction: ConfigurationProps['direction'];\n translations: TranslationPack;\n themeMachine: ThemeMachineLike<DefaultThemeDefinition>;\n styleSheetTarget?: HTMLElement;\n portalTarget?: Element;\n loadedRef: MutableRefObject<boolean>;\n renderNativeControls: boolean;\n /* @internal */\n initialized: boolean;\n}\n\nconst defaultLocale = navigatorIsAvailable ? navigator.language : 'en';\n\nexport const ConfigurationContext = createContext<ConfigurationContextValue>({\n locale: defaultLocale,\n direction: directionOfLocale(defaultLocale),\n translations: DefaultTranslation,\n themeMachine: BaseThemeMachine,\n styleSheetTarget: documentIsAvailable ? document.head : undefined,\n portalTarget: documentIsAvailable ? document.body : undefined,\n loadedRef: { current: false },\n renderNativeControls: false,\n initialized: false\n});\n\nconst mountedConfigs = new Set<symbol>();\n\ninterface CosmosInstance {\n version: string;\n mountedConfigs: string[];\n mountOrder: string[];\n mountCount: Record<string, number>;\n}\n\nconst instance: CosmosInstance = {\n version: pkg.version,\n mountedConfigs: [],\n mountOrder: [],\n mountCount: {}\n};\n\nconst mountConfig = (sym: symbol) => {\n mountedConfigs.add(sym);\n instance.mountedConfigs = [...mountedConfigs].map(i => i.description ?? 'Unknown');\n\n const description = sym.description ?? 'Unknown';\n\n instance.mountOrder.push(description);\n\n if (!(description in instance.mountCount)) {\n instance.mountCount[description] = 0;\n }\n instance.mountCount[description] += 1;\n};\n\nconst unmountConfig = (sym: symbol) => {\n mountedConfigs.delete(sym);\n instance.mountedConfigs = [...mountedConfigs].map(i => i.description ?? 'Unknown');\n};\n\ndeclare module '../../init' {\n export interface CosmosGlobals {\n instances?: CosmosInstance[];\n configurationContext?: Context<ConfigurationContextValue>;\n }\n}\n\nif (windowIsAvailable) {\n if (!window.cosmos.instances) {\n window.cosmos.instances = [];\n }\n\n window.cosmos.instances.push(instance);\n}\n\nconst Configuration: FunctionComponent<ConfigurationProps> = ({\n children,\n locale,\n direction,\n translations: customTranslations,\n theme,\n disableDefaultFontLoading,\n styleSheetTarget,\n portalTarget,\n renderNativeControls,\n id\n}: ConfigurationProps) => {\n const context = windowIsAvailable\n ? window.cosmos.configurationContext ?? ConfigurationContext\n : ConfigurationContext;\n const ctx = useContext(context);\n const themeMachine = theme\n ? new ThemeMachine<DefaultThemeDefinition>({ theme, parent: ctx.themeMachine })\n : ctx.themeMachine;\n const translations = useMemo(\n () => createTranslationPack({ ...ctx.translations, ...customTranslations }),\n [ctx.translations, customTranslations]\n );\n\n const [mounted, setMounted] = useState(false);\n\n useEffect(() => {\n setMounted(true);\n }, []);\n\n useEffect(() => {\n const sym = Symbol(id);\n mountConfig(sym);\n\n return () => {\n unmountConfig(sym);\n };\n }, [id]);\n\n const wrappedChildren = ctx.initialized ? (\n children\n ) : (\n <StyleSheetManager disableVendorPrefixes target={styleSheetTarget ?? ctx.styleSheetTarget}>\n <>\n {!disableDefaultFontLoading &&\n mounted &&\n documentIsAvailable &&\n createPortal(\n <link\n rel='stylesheet'\n href='https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400..700;1,400..700&display=swap'\n data-cosmos-global-style\n />,\n styleSheetTarget ?? ctx.styleSheetTarget ?? document.head\n )}\n <GlobalStyle />\n {children}\n </>\n </StyleSheetManager>\n );\n\n return (\n <context.Provider\n value={{\n locale: locale ?? ctx.locale,\n direction: direction ?? (locale !== undefined ? directionOfLocale(locale) : ctx.direction),\n translations,\n themeMachine,\n styleSheetTarget: styleSheetTarget ?? ctx.styleSheetTarget,\n portalTarget: portalTarget ?? ctx.portalTarget,\n loadedRef: ctx.loadedRef,\n renderNativeControls: renderNativeControls ?? ctx.renderNativeControls,\n initialized: true\n }}\n >\n <ThemeProvider theme={themeMachine.theme}>{wrappedChildren}</ThemeProvider>\n </context.Provider>\n );\n};\n\nexport default Configuration;\n"]}
1	+ {"version":3,"file":"Configuration.js","sourceRoot":"","sources":["../../../src/components/Configuration/Configuration.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n createContext,\n useContext,\n FunctionComponent,\n ReactNode,\n useMemo,\n useState,\n useEffect,\n Context,\n MutableRefObject\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { ThemeProvider, StyleSheetManager } from 'styled-components';\n\nimport { GlobalStyle } from '../../styles';\nimport {\n ThemeMachine,\n ThemeMachineLike,\n BaseThemeMachine,\n DefaultSettableTheme,\n DefaultThemeDefinition\n} from '../../theme';\nimport {\n createTranslationPack,\n Translation,\n TranslationPack,\n DefaultTranslation,\n direction as directionOfLocale\n} from '../../i18n';\nimport { windowIsAvailable, navigatorIsAvailable, documentIsAvailable } from '../../utils';\nimport pkg from '../../../package.json';\nimport '../../init';\n\nexport interface ConfigurationProps {\n /*\n Any components or nodes that should be impacted by the settings applied by this Configuration component.\n /\n children: ReactNode;\n /\n User locale as defined in [BCP-47](https://www.techonthenet.com/js/language_tags.php).\n /\n locale?: string;\n /\n Override rendering direction of the document. Direction will be based on the locale if now provided.\n /\n direction?: 'ltr' \| 'rtl';\n /\n Object with (partial) translations.\n /\n translations?: Translation;\n /\n Theme object used to override any or all Cosmos theme properties.\n /\n theme?: DefaultSettableTheme;\n /\n Disables loading Open Sans from Google Fonts. Only takes effect on the root configuration.\n /\n disableDefaultFontLoading?: boolean;\n /\n Target element for loading styles related to `styled-components`.\n /\n styleSheetTarget?: HTMLElement;\n /\n Target element for rendering a `ReactDOM` portal.\n /\n portalTarget?: Element;\n /\n Use native HTML5 controls for inputs instead of rich ones.\n * @default false\n /\n renderNativeControls?: boolean;\n /\n String to identify this configuration instance.\n /\n id?: string;\n /\n Enable/disable testId attribute rendering for all components.\n * @default true\n /\n testIds?: boolean;\n}\n\nexport interface ConfigurationContextValue {\n locale: string;\n direction: ConfigurationProps['direction'];\n translations: TranslationPack;\n themeMachine: ThemeMachineLike<DefaultThemeDefinition>;\n styleSheetTarget?: HTMLElement;\n portalTarget?: Element;\n loadedRef: MutableRefObject<boolean>;\n renderNativeControls: boolean;\n testIds?: ConfigurationProps['testIds'];\n /* @internal */\n initialized: boolean;\n}\n\nconst defaultLocale = navigatorIsAvailable ? navigator.language : 'en';\n\nexport const ConfigurationContext = createContext<ConfigurationContextValue>({\n locale: defaultLocale,\n direction: directionOfLocale(defaultLocale),\n translations: DefaultTranslation,\n themeMachine: BaseThemeMachine,\n styleSheetTarget: documentIsAvailable ? document.head : undefined,\n portalTarget: documentIsAvailable ? document.body : undefined,\n loadedRef: { current: false },\n renderNativeControls: false,\n testIds: true,\n initialized: false\n});\n\nconst mountedConfigs = new Set<symbol>();\n\ninterface CosmosInstance {\n version: string;\n mountedConfigs: string[];\n mountOrder: string[];\n mountCount: Record<string, number>;\n}\n\nconst instance: CosmosInstance = {\n version: pkg.version,\n mountedConfigs: [],\n mountOrder: [],\n mountCount: {}\n};\n\nconst mountConfig = (sym: symbol) => {\n mountedConfigs.add(sym);\n instance.mountedConfigs = [...mountedConfigs].map(i => i.description ?? 'Unknown');\n\n const description = sym.description ?? 'Unknown';\n\n instance.mountOrder.push(description);\n\n if (!(description in instance.mountCount)) {\n instance.mountCount[description] = 0;\n }\n instance.mountCount[description] += 1;\n};\n\nconst unmountConfig = (sym: symbol) => {\n mountedConfigs.delete(sym);\n instance.mountedConfigs = [...mountedConfigs].map(i => i.description ?? 'Unknown');\n};\n\ndeclare module '../../init' {\n export interface CosmosGlobals {\n instances?: CosmosInstance[];\n configurationContext?: Context<ConfigurationContextValue>;\n }\n}\n\nif (windowIsAvailable) {\n if (!window.cosmos.instances) {\n window.cosmos.instances = [];\n }\n\n window.cosmos.instances.push(instance);\n}\n\nconst Configuration: FunctionComponent<ConfigurationProps> = ({\n children,\n locale,\n direction,\n translations: customTranslations,\n theme,\n disableDefaultFontLoading,\n styleSheetTarget,\n portalTarget,\n renderNativeControls,\n testIds,\n id\n}: ConfigurationProps) => {\n const context = windowIsAvailable\n ? window.cosmos.configurationContext ?? ConfigurationContext\n : ConfigurationContext;\n const ctx = useContext(context);\n const themeMachine = theme\n ? new ThemeMachine<DefaultThemeDefinition>({ theme, parent: ctx.themeMachine })\n : ctx.themeMachine;\n const translations = useMemo(\n () => createTranslationPack({ ...ctx.translations, ...customTranslations }),\n [ctx.translations, customTranslations]\n );\n\n const [mounted, setMounted] = useState(false);\n\n useEffect(() => {\n setMounted(true);\n }, []);\n\n useEffect(() => {\n const sym = Symbol(id);\n mountConfig(sym);\n\n return () => {\n unmountConfig(sym);\n };\n }, [id]);\n\n const wrappedChildren = ctx.initialized ? (\n children\n ) : (\n <StyleSheetManager disableVendorPrefixes target={styleSheetTarget ?? ctx.styleSheetTarget}>\n <>\n {!disableDefaultFontLoading &&\n mounted &&\n documentIsAvailable &&\n createPortal(\n <link\n rel='stylesheet'\n href='https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400..700;1,400..700&display=swap'\n data-cosmos-global-style\n />,\n styleSheetTarget ?? ctx.styleSheetTarget ?? document.head\n )}\n <GlobalStyle />\n {children}\n </>\n </StyleSheetManager>\n );\n\n return (\n <context.Provider\n // eslint-disable-next-line react/jsx-no-constructed-context-values\n value={{\n locale: locale ?? ctx.locale,\n direction: direction ?? (locale !== undefined ? directionOfLocale(locale) : ctx.direction),\n translations,\n themeMachine,\n styleSheetTarget: styleSheetTarget ?? ctx.styleSheetTarget,\n portalTarget: portalTarget ?? ctx.portalTarget,\n loadedRef: ctx.loadedRef,\n renderNativeControls: renderNativeControls ?? ctx.renderNativeControls,\n testIds: testIds ?? ctx.testIds,\n initialized: true\n }}\n >\n <ThemeProvider theme={themeMachine.theme}>{wrappedChildren}</ThemeProvider>\n </context.Provider>\n );\n};\n\nexport default Configuration;\n"]}

package/lib/components/Currency/Currency.test-ids.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export declare const getCurrencyInputTestIds: (testIdProp?: string \| undefined) => import("../..").TestIdsRecord<readonly ["control", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
2	+ //# sourceMappingURL=Currency.test-ids.d.ts.map

package/lib/components/Currency/Currency.test-ids.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"Currency.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/Currency/Currency.test-ids.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,uBAAuB,wKAGzB,CAAC"}

package/lib/components/Currency/Currency.test-ids.js ADDED Viewed

@@ -0,0 +1,7 @@
+import { createTestIds } from '../../utils';
+import { elements } from '../FormField/FormField.test-ids';
+export const getCurrencyInputTestIds = createTestIds('currency-input', [
+    'control',
+    ...elements
+]);
+//# sourceMappingURL=Currency.test-ids.js.map

package/lib/components/Currency/Currency.test-ids.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Currency.test-ids.js","sourceRoot":"","sources":["../../../src/components/Currency/Currency.test-ids.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAE3D,MAAM,CAAC,MAAM,uBAAuB,GAAG,aAAa,CAAC,gBAAgB,EAAE;IACrE,SAAS;IACT,GAAG,QAAQ;CACH,CAAC,CAAC","sourcesContent":["import { createTestIds } from '../../utils';\nimport { elements } from '../FormField/FormField.test-ids';\n\nexport const getCurrencyInputTestIds = createTestIds('currency-input', [\n 'control',\n ...elements\n] as const);\n"]}

package/lib/components/Currency/CurrencyInput.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CurrencyInput.d.ts","sourceRoot":"","sources":["../../../src/components/Currency/CurrencyInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAOlB,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;~~AAiB3C~~,OAAO,kBAAkB,MAAM,uBAAuB,CAAC;~~AAGvD~~,QAAA,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,GAAG,YAAY,~~CAuKvE~~,CAAC;AAEF,eAAe,aAAa,CAAC"}
1	+ {"version":3,"file":"CurrencyInput.d.ts","sourceRoot":"","sources":["../../../src/components/Currency/CurrencyInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAOlB,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAkB3C,OAAO,kBAAkB,MAAM,uBAAuB,CAAC;AAIvD,QAAA,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,GAAG,YAAY,CA6KvE,CAAC;AAEF,eAAe,aAAa,CAAC"}