@pega/cosmos-react-core 10.0.0-build.2.8 → 10.0.0-build.3.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 (101) hide show
  1. package/lib/components/ClassificationMarking/ClassificationMarking.styles.d.ts.map +1 -1
  2. package/lib/components/ClassificationMarking/ClassificationMarking.styles.js +5 -3
  3. package/lib/components/ClassificationMarking/ClassificationMarking.styles.js.map +1 -1
  4. package/lib/components/ComboBox/ComboBox.d.ts.map +1 -1
  5. package/lib/components/ComboBox/ComboBox.js +1 -1
  6. package/lib/components/ComboBox/ComboBox.js.map +1 -1
  7. package/lib/components/ComboBox/ComboBox.styles.d.ts.map +1 -1
  8. package/lib/components/ComboBox/ComboBox.styles.js +14 -2
  9. package/lib/components/ComboBox/ComboBox.styles.js.map +1 -1
  10. package/lib/components/ComboBox/ComboBox.types.d.ts +2 -0
  11. package/lib/components/ComboBox/ComboBox.types.d.ts.map +1 -1
  12. package/lib/components/ComboBox/ComboBox.types.js.map +1 -1
  13. package/lib/components/ComboBox/ComboBoxInput.d.ts +1 -0
  14. package/lib/components/ComboBox/ComboBoxInput.d.ts.map +1 -1
  15. package/lib/components/ComboBox/ComboBoxInput.js.map +1 -1
  16. package/lib/components/ComboBox/MultiSelectInput/MultiSelectInput.d.ts.map +1 -1
  17. package/lib/components/ComboBox/MultiSelectInput/MultiSelectInput.js +9 -3
  18. package/lib/components/ComboBox/MultiSelectInput/MultiSelectInput.js.map +1 -1
  19. package/lib/components/ComboBox/MultiSelectInput/MultiSelectInput.types.d.ts +2 -0
  20. package/lib/components/ComboBox/MultiSelectInput/MultiSelectInput.types.d.ts.map +1 -1
  21. package/lib/components/ComboBox/MultiSelectInput/MultiSelectInput.types.js.map +1 -1
  22. package/lib/components/ComboBox/SingleSelectInput/SingleSelectInput.d.ts.map +1 -1
  23. package/lib/components/ComboBox/SingleSelectInput/SingleSelectInput.js +28 -9
  24. package/lib/components/ComboBox/SingleSelectInput/SingleSelectInput.js.map +1 -1
  25. package/lib/components/ComboBox/SingleSelectInput/SingleSelectInput.types.d.ts +2 -0
  26. package/lib/components/ComboBox/SingleSelectInput/SingleSelectInput.types.d.ts.map +1 -1
  27. package/lib/components/ComboBox/SingleSelectInput/SingleSelectInput.types.js.map +1 -1
  28. package/lib/components/DateTime/Input/DateTime.styles.d.ts.map +1 -1
  29. package/lib/components/DateTime/Input/DateTime.styles.js +1 -2
  30. package/lib/components/DateTime/Input/DateTime.styles.js.map +1 -1
  31. package/lib/components/DateTime/Input/MonthInput.d.ts.map +1 -1
  32. package/lib/components/DateTime/Input/MonthInput.js +2 -1
  33. package/lib/components/DateTime/Input/MonthInput.js.map +1 -1
  34. package/lib/components/DateTime/Input/QuarterInput.d.ts.map +1 -1
  35. package/lib/components/DateTime/Input/QuarterInput.js +2 -2
  36. package/lib/components/DateTime/Input/QuarterInput.js.map +1 -1
  37. package/lib/components/DateTime/Picker/DatePicker.styles.d.ts.map +1 -1
  38. package/lib/components/DateTime/Picker/DatePicker.styles.js +5 -0
  39. package/lib/components/DateTime/Picker/DatePicker.styles.js.map +1 -1
  40. package/lib/components/EmptyState/EmptyState.d.ts +6 -1
  41. package/lib/components/EmptyState/EmptyState.d.ts.map +1 -1
  42. package/lib/components/EmptyState/EmptyState.js +18 -11
  43. package/lib/components/EmptyState/EmptyState.js.map +1 -1
  44. package/lib/components/FieldGroup/FieldGroupList.js +1 -1
  45. package/lib/components/FieldGroup/FieldGroupList.js.map +1 -1
  46. package/lib/components/File/FileVisual.js +1 -1
  47. package/lib/components/File/FileVisual.js.map +1 -1
  48. package/lib/components/Lightbox/Lightbox.styles.d.ts.map +1 -1
  49. package/lib/components/Lightbox/Lightbox.styles.js +1 -0
  50. package/lib/components/Lightbox/Lightbox.styles.js.map +1 -1
  51. package/lib/components/ListToolbar/ListToolbar.d.ts.map +1 -1
  52. package/lib/components/ListToolbar/ListToolbar.js +1 -1
  53. package/lib/components/ListToolbar/ListToolbar.js.map +1 -1
  54. package/lib/components/ListToolbar/ListToolbar.styles.d.ts +64 -62
  55. package/lib/components/ListToolbar/ListToolbar.styles.d.ts.map +1 -1
  56. package/lib/components/ListToolbar/ListToolbar.styles.js +43 -37
  57. package/lib/components/ListToolbar/ListToolbar.styles.js.map +1 -1
  58. package/lib/components/Number/NumberDisplay.d.ts +5 -0
  59. package/lib/components/Number/NumberDisplay.d.ts.map +1 -1
  60. package/lib/components/Number/NumberDisplay.js +3 -2
  61. package/lib/components/Number/NumberDisplay.js.map +1 -1
  62. package/lib/components/Number/utils.d.ts +3 -1
  63. package/lib/components/Number/utils.d.ts.map +1 -1
  64. package/lib/components/Number/utils.js +10 -8
  65. package/lib/components/Number/utils.js.map +1 -1
  66. package/lib/components/PageTemplates/GridLayout/EditorBackground.js +1 -1
  67. package/lib/components/PageTemplates/GridLayout/EditorBackground.js.map +1 -1
  68. package/lib/components/Preview/PreviewManager.d.ts.map +1 -1
  69. package/lib/components/Preview/PreviewManager.js +10 -1
  70. package/lib/components/Preview/PreviewManager.js.map +1 -1
  71. package/lib/components/Preview/PreviewPanel.d.ts.map +1 -1
  72. package/lib/components/Preview/PreviewPanel.js +7 -2
  73. package/lib/components/Preview/PreviewPanel.js.map +1 -1
  74. package/lib/components/RadioCheckGroup/RadioCheckGroup.d.ts +1 -1
  75. package/lib/components/RadioCheckGroup/RadioCheckGroup.d.ts.map +1 -1
  76. package/lib/components/RadioCheckGroup/RadioCheckGroup.js +44 -23
  77. package/lib/components/RadioCheckGroup/RadioCheckGroup.js.map +1 -1
  78. package/lib/components/ResponsiveActions/ResponsiveActions.d.ts.map +1 -1
  79. package/lib/components/ResponsiveActions/ResponsiveActions.js +1 -0
  80. package/lib/components/ResponsiveActions/ResponsiveActions.js.map +1 -1
  81. package/lib/components/SelectionCard/SelectionCard.styles.js +1 -1
  82. package/lib/components/SelectionCard/SelectionCard.styles.js.map +1 -1
  83. package/lib/hooks/useI18n.d.ts +10 -1
  84. package/lib/hooks/useI18n.d.ts.map +1 -1
  85. package/lib/i18n/default.d.ts +10 -1
  86. package/lib/i18n/default.d.ts.map +1 -1
  87. package/lib/i18n/default.js +12 -2
  88. package/lib/i18n/default.js.map +1 -1
  89. package/lib/i18n/i18n.d.ts +10 -1
  90. package/lib/i18n/i18n.d.ts.map +1 -1
  91. package/lib/theme/index.d.ts +2 -0
  92. package/lib/theme/index.d.ts.map +1 -1
  93. package/lib/theme/index.js +2 -0
  94. package/lib/theme/index.js.map +1 -1
  95. package/lib/theme/theme.d.ts +24 -0
  96. package/lib/theme/theme.d.ts.map +1 -1
  97. package/lib/theme/themeDefinition.json +12 -0
  98. package/lib/theme/themeOverrides.schema.json +18 -0
  99. package/lib/theme/themes/aurigaDarkTheme.json +146 -0
  100. package/lib/theme/themes/aurigaTheme.json +143 -0
  101. package/package.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"ClassificationMarking.styles.d.ts","sourceRoot":"","sources":["../../../src/components/ClassificationMarking/ClassificationMarking.styles.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,eAAO,MAAM,gCAAgC;YACnC,MAAM;EAKf,CAAC;AAEF,eAAO,MAAM,aAAa;gBACZ,MAAM;WACX,MAAM;YACL,MAAM;eACH,MAAM;iBACJ,MAAM;eACR,KAAK,GAAG,QAAQ;YAkB3B,CAAC;AAIH,eAAO,MAAM,uBAAuB;YAC1B,MAAM;YAKd,CAAC"}
1
+ {"version":3,"file":"ClassificationMarking.styles.d.ts","sourceRoot":"","sources":["../../../src/components/ClassificationMarking/ClassificationMarking.styles.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,eAAO,MAAM,gCAAgC;YACnC,MAAM;EAKf,CAAC;AAEF,eAAO,MAAM,aAAa;gBACZ,MAAM;WACX,MAAM;YACL,MAAM;eACH,MAAM;iBACJ,MAAM;eACR,KAAK,GAAG,QAAQ;YAoB3B,CAAC;AAIH,eAAO,MAAM,uBAAuB;YAC1B,MAAM;YAKd,CAAC"}
@@ -14,9 +14,11 @@ export const StyledMarking = styled.div(({ background, color, height, fontSize,
14
14
  position: fixed;
15
15
  ${placement}: 0;
16
16
  inset-inline: 0;
17
- height: ${placement === 'bottom'
18
- ? `calc(${height} + var(--safe-area-inset-block-end, 0))`
19
- : height};
17
+ box-sizing: content-box;
18
+ height: ${height};
19
+ ${placement === 'bottom'
20
+ ? 'padding-block-end: var(--safe-area-inset-block-end, 0);'
21
+ : 'padding-block-start: var(--safe-area-inset-block-start, 0);'}
20
22
  line-height: ${height};
21
23
  text-align: center;
22
24
  font-weight: ${theme.base['font-weight'].bold};
@@ -1 +1 @@
1
- {"version":3,"file":"ClassificationMarking.styles.js","sourceRoot":"","sources":["../../../src/components/ClassificationMarking/ClassificationMarking.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C;;;GAGG;AACH,MAAM,CAAC,MAAM,gCAAgC,GAAG,iBAAiB,CAE/D;;wBAEsB,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,MAAM;;CAE7C,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAOpC,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,EAAE;IAC3E,OAAO,GAAG,CAAA;;MAEN,SAAS;;cAED,SAAS,KAAK,QAAQ;QAC9B,CAAC,CAAC,QAAQ,MAAM,yCAAyC;QACzD,CAAC,CAAC,MAAM;mBACK,MAAM;;mBAEN,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,IAAI;MAC3C,UAAU,CAAC,CAAC,CAAC,gBAAgB,UAAU,GAAG,CAAC,CAAC,CAAC,EAAE;MAC/C,QAAQ,CAAC,CAAC,CAAC,cAAc,QAAQ,GAAG,CAAC,CAAC,CAAC,EAAE;eAChC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,GAAG;kBACtB,UAAU;aACf,KAAK;GACf,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,aAAa,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE9C,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,GAAG,CAE9C,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE;IAChB,OAAO,GAAG,CAAA;wBACY,MAAM;GAC3B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,uBAAuB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css, createGlobalStyle } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\n\n/**\n * Promotes --marking-height to :root so portaled elements\n * (Fullscreen, Lightbox) can read it outside the StyledClassifiedContent tree.\n */\nexport const ClassificationMarkingGlobalStyle = createGlobalStyle<{\n height: string;\n}>`\n :root {\n --marking-height: ${({ height }) => height};\n }\n`;\n\nexport const StyledMarking = styled.div<{\n background: string;\n color: string;\n height: string;\n fontSize?: string;\n fontFamily?: string;\n placement: 'top' | 'bottom';\n}>(({ background, color, height, fontSize, fontFamily, placement, theme }) => {\n return css`\n position: fixed;\n ${placement}: 0;\n inset-inline: 0;\n height: ${placement === 'bottom'\n ? `calc(${height} + var(--safe-area-inset-block-end, 0))`\n : height};\n line-height: ${height};\n text-align: center;\n font-weight: ${theme.base['font-weight'].bold};\n ${fontFamily ? `font-family: ${fontFamily};` : ''}\n ${fontSize ? `font-size: ${fontSize};` : ''}\n z-index: ${theme.base['z-index'].max};\n background: ${background};\n color: ${color};\n `;\n});\n\nStyledMarking.defaultProps = defaultThemeProp;\n\nexport const StyledClassifiedContent = styled.div<{\n height: string;\n}>(({ height }) => {\n return css`\n --marking-height: ${height};\n `;\n});\n\nStyledClassifiedContent.defaultProps = defaultThemeProp;\n"]}
1
+ {"version":3,"file":"ClassificationMarking.styles.js","sourceRoot":"","sources":["../../../src/components/ClassificationMarking/ClassificationMarking.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C;;;GAGG;AACH,MAAM,CAAC,MAAM,gCAAgC,GAAG,iBAAiB,CAE/D;;wBAEsB,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,MAAM;;CAE7C,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAOpC,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,EAAE;IAC3E,OAAO,GAAG,CAAA;;MAEN,SAAS;;;cAGD,MAAM;MACd,SAAS,KAAK,QAAQ;QACtB,CAAC,CAAC,yDAAyD;QAC3D,CAAC,CAAC,6DAA6D;mBAClD,MAAM;;mBAEN,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,IAAI;MAC3C,UAAU,CAAC,CAAC,CAAC,gBAAgB,UAAU,GAAG,CAAC,CAAC,CAAC,EAAE;MAC/C,QAAQ,CAAC,CAAC,CAAC,cAAc,QAAQ,GAAG,CAAC,CAAC,CAAC,EAAE;eAChC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,GAAG;kBACtB,UAAU;aACf,KAAK;GACf,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,aAAa,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE9C,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,GAAG,CAE9C,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE;IAChB,OAAO,GAAG,CAAA;wBACY,MAAM;GAC3B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,uBAAuB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css, createGlobalStyle } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\n\n/**\n * Promotes --marking-height to :root so portaled elements\n * (Fullscreen, Lightbox) can read it outside the StyledClassifiedContent tree.\n */\nexport const ClassificationMarkingGlobalStyle = createGlobalStyle<{\n height: string;\n}>`\n :root {\n --marking-height: ${({ height }) => height};\n }\n`;\n\nexport const StyledMarking = styled.div<{\n background: string;\n color: string;\n height: string;\n fontSize?: string;\n fontFamily?: string;\n placement: 'top' | 'bottom';\n}>(({ background, color, height, fontSize, fontFamily, placement, theme }) => {\n return css`\n position: fixed;\n ${placement}: 0;\n inset-inline: 0;\n box-sizing: content-box;\n height: ${height};\n ${placement === 'bottom'\n ? 'padding-block-end: var(--safe-area-inset-block-end, 0);'\n : 'padding-block-start: var(--safe-area-inset-block-start, 0);'}\n line-height: ${height};\n text-align: center;\n font-weight: ${theme.base['font-weight'].bold};\n ${fontFamily ? `font-family: ${fontFamily};` : ''}\n ${fontSize ? `font-size: ${fontSize};` : ''}\n z-index: ${theme.base['z-index'].max};\n background: ${background};\n color: ${color};\n `;\n});\n\nStyledMarking.defaultProps = defaultThemeProp;\n\nexport const StyledClassifiedContent = styled.div<{\n height: string;\n}>(({ height }) => {\n return css`\n --marking-height: ${height};\n `;\n});\n\nStyledClassifiedContent.defaultProps = defaultThemeProp;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBox.d.ts","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.tsx"],"names":[],"mappings":"AAyCA,OAAO,KAAK,aAAa,MAAM,kBAAkB,CAAC;;;;AAQlD,wBAsXE"}
1
+ {"version":3,"file":"ComboBox.d.ts","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.tsx"],"names":[],"mappings":"AAyCA,OAAO,KAAK,aAAa,MAAM,kBAAkB,CAAC;;;;AAQlD,wBAuXE"}
@@ -155,7 +155,7 @@ export default withTestIds(forwardRef(function ComboBox(props, ref) {
155
155
  // Workaround for the following error from jsx-ast-utils, fixed in version 3.5.0.
156
156
  // The prop value with an expression type of JSXFragment could not be resolved. Please file issue to get this fixed immediately.
157
157
  const inputActions = (_jsxs(_Fragment, { children: [dropdownButton, actions] }));
158
- const Comp = (_jsxs(StyledComboBox, { ref: containerRef, as: StyledFormControl, id: `${id}-combobox`, "data-testid": label ? undefined : testIds.root, children: [_jsx(ComboBoxInput, { "data-testid": testIds.control, ref: inputRef, role: 'combobox', "aria-autocomplete": 'list', "aria-expanded": !readOnly && !disabled && open, "aria-controls": open && menu !== undefined && !pauseMenuDescendantEvaluation ? listId : undefined, "aria-haspopup": 'listbox', "aria-describedby": ariaDescribedBy, className: createClassName('combo-box', className, { mode }), selected: selected?.items, spellCheck: false, id: id, readOnly: readOnly, disabled: disabled, onChange: onChange, value: value, mode: mode, status: status, onResolveSuggestion: onResolveSuggestion, actions: inputActions, visual: visual, onRemove: selected?.onRemove, onClick: onInputClick, onKeyDown: onInputKeyDown, required: required, pauseDescendantEvaluation: pauseSelectedDescendantEvaluation, onSelectedFocus: () => {
158
+ const Comp = (_jsxs(StyledComboBox, { ref: containerRef, as: StyledFormControl, id: `${id}-combobox`, "data-testid": label ? undefined : testIds.root, children: [_jsx(ComboBoxInput, { "data-testid": testIds.control, ref: inputRef, role: 'combobox', "aria-autocomplete": 'list', "aria-expanded": !readOnly && !disabled && open, "aria-controls": open && menu !== undefined && !pauseMenuDescendantEvaluation ? listId : undefined, "aria-haspopup": 'listbox', "aria-describedby": ariaDescribedBy, className: createClassName('combo-box', className, { mode }), selected: selected?.items, loading: selected?.loading, spellCheck: false, id: id, readOnly: readOnly, disabled: disabled, onChange: onChange, value: value, mode: mode, status: status, onResolveSuggestion: onResolveSuggestion, actions: inputActions, visual: visual, onRemove: selected?.onRemove, onClick: onInputClick, onKeyDown: onInputKeyDown, required: required, pauseDescendantEvaluation: pauseSelectedDescendantEvaluation, onSelectedFocus: () => {
159
159
  toggleSelectedDescendantsActive(true);
160
160
  }, onSelectedBlur: () => {
161
161
  toggleSelectedDescendantsActive(false);
@@ -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 useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState\n} from 'react';\nimport type {\n KeyboardEvent as ReactKeyboardEvent,\n PropsWithoutRef,\n MutableRefObject,\n MouseEvent\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 type { RefElement } from '../../types';\nimport {\n useConsolidatedRef,\n useFocusWithin,\n useI18n,\n useUID,\n useElement,\n useDirection,\n useTestIds,\n useEscape\n} from '../../hooks';\nimport Popover from '../Popover';\nimport FormField from '../FormField';\nimport { StyledFormControl } from '../FormControl';\nimport Menu from '../Menu';\nimport type { MenuProps } from '../Menu';\nimport { navigatorIsAvailable, withTestIds, getFocusables, createClassName } from '../../utils';\nimport menuHelpers from '../Menu/helpers';\nimport { fitToContent } from '../Popover/modifiers';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\n\nimport ComboBoxInput from './ComboBoxInput';\nimport type ComboBoxProps from './ComboBox.types';\nimport { StyledComboBox, StyledDropdownButton } from './ComboBox.styles';\nimport { getComboBoxTestIds } from './ComboxBox.test-ids';\n\nregisterIcon(caretDownIcon, caretUpIcon);\n\nconst isMobile = navigatorIsAvailable && navigator.userAgent.includes('Mobile');\n\nexport default withTestIds(\n forwardRef<RefElement<ComboBoxProps>, PropsWithoutRef<ComboBoxProps>>(\n function ComboBox(props, ref) {\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 onMenuOpen,\n onClick,\n onKeyDown,\n menu,\n visual,\n className,\n handle,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getComboBoxTestIds);\n const bodyRef = useRef<Element>(document.body);\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 popoverRef = useRef<HTMLDivElement>(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, popoverRef], 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 handleEscape = useCallback(\n (e: KeyboardEvent) => {\n e.preventDefault();\n if (open) {\n e.stopPropagation();\n setOpen(false);\n toggleMenuDescendantsActive(false);\n }\n },\n [open]\n );\n\n useEscape(handleEscape, containerRef, [handleEscape]);\n\n useImperativeHandle(handle, () => ({\n focusInput: () => {\n inputRef.current?.focus();\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 'Tab': {\n const forward = !e.shiftKey;\n\n if (forward) {\n const popoverFocusables = getFocusables(popoverRef);\n\n if (popoverFocusables.length) {\n e.preventDefault();\n popoverFocusables[0].focus();\n break;\n }\n }\n\n setOpen(false);\n toggleMenuDescendantsActive(false);\n\n break;\n }\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 || onDropdownButtonClickProp || !onChange) && !readOnly ? (\n <StyledDropdownButton\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 </StyledDropdownButton>\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<HTMLInputElement>) => {\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 useEffect(() => {\n if (open) onMenuOpen?.();\n }, [open]);\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 data-testid={label ? undefined : testIds.root}\n >\n <ComboBoxInput\n data-testid={testIds.control}\n ref={inputRef}\n role='combobox'\n aria-autocomplete='list'\n aria-expanded={!readOnly && !disabled && open}\n aria-controls={\n open && menu !== undefined && !pauseMenuDescendantEvaluation ? listId : undefined\n }\n aria-haspopup='listbox'\n aria-describedby={ariaDescribedBy}\n className={createClassName('combo-box', className, { mode })}\n selected={selected?.items}\n spellCheck={false}\n id={id}\n readOnly={readOnly}\n disabled={disabled}\n onChange={onChange}\n value={value}\n mode={mode}\n status={status}\n onResolveSuggestion={onResolveSuggestion}\n actions={inputActions}\n visual={visual}\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 hideOnTargetHidden\n ref={popoverRef}\n show={open && menu !== undefined}\n target={containerRef.current}\n placement='bottom-start'\n modifiers={[fitToContent]}\n // FIXME: Removed absolute strategy for mobile to avoid overflow issues.\n strategy='fixed'\n onMouseDown={(e: MouseEvent) => e.preventDefault()}\n onKeyDown={(e: KeyboardEvent) => {\n if (!inputRef.current) return;\n\n if (e.key === 'Tab') {\n const popoverFocusables = getFocusables(popoverRef);\n const currentIndex = popoverFocusables.indexOf(e.target as HTMLElement);\n const forward = !e.shiftKey;\n const isLast = currentIndex === popoverFocusables.length - 1;\n\n if (forward && isLast) {\n e.preventDefault();\n const allFocusable = getFocusables(bodyRef as MutableRefObject<HTMLElement>);\n const nextIndex = allFocusable.indexOf(inputRef.current) + 1;\n\n allFocusable[nextIndex]?.focus();\n setOpen(false);\n toggleMenuDescendantsActive(false);\n } else if (!forward && currentIndex === 0) {\n e.preventDefault();\n inputRef.current.focus();\n }\n }\n if (e.key === 'Escape') {\n handleEscape(e);\n inputRef.current.focus();\n }\n }}\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 cycle={false}\n />\n )}\n </Popover>\n </StyledComboBox>\n );\n\n return (\n <>\n {label ? (\n <FormField\n testId={testIds}\n label={label}\n labelHidden={labelHidden}\n id={id}\n info={info}\n readOnly={readOnly}\n status={status}\n required={required}\n disabled={disabled}\n onResolveSuggestion={onResolveSuggestion}\n additionalInfo={additionalInfo}\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(\n Array.isArray(selected?.items) && selected.items.some(item => item.primary)\n ? 'multiselect_instructions_with_links'\n : 'multiselect_instructions',\n [start]\n )}\n </VisuallyHiddenText>\n </>\n );\n }\n ),\n getComboBoxTestIds\n);\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 useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState\n} from 'react';\nimport type {\n KeyboardEvent as ReactKeyboardEvent,\n PropsWithoutRef,\n MutableRefObject,\n MouseEvent\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 type { RefElement } from '../../types';\nimport {\n useConsolidatedRef,\n useFocusWithin,\n useI18n,\n useUID,\n useElement,\n useDirection,\n useTestIds,\n useEscape\n} from '../../hooks';\nimport Popover from '../Popover';\nimport FormField from '../FormField';\nimport { StyledFormControl } from '../FormControl';\nimport Menu from '../Menu';\nimport type { MenuProps } from '../Menu';\nimport { navigatorIsAvailable, withTestIds, getFocusables, createClassName } from '../../utils';\nimport menuHelpers from '../Menu/helpers';\nimport { fitToContent } from '../Popover/modifiers';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\n\nimport ComboBoxInput from './ComboBoxInput';\nimport type ComboBoxProps from './ComboBox.types';\nimport { StyledComboBox, StyledDropdownButton } from './ComboBox.styles';\nimport { getComboBoxTestIds } from './ComboxBox.test-ids';\n\nregisterIcon(caretDownIcon, caretUpIcon);\n\nconst isMobile = navigatorIsAvailable && navigator.userAgent.includes('Mobile');\n\nexport default withTestIds(\n forwardRef<RefElement<ComboBoxProps>, PropsWithoutRef<ComboBoxProps>>(\n function ComboBox(props, ref) {\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 onMenuOpen,\n onClick,\n onKeyDown,\n menu,\n visual,\n className,\n handle,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getComboBoxTestIds);\n const bodyRef = useRef<Element>(document.body);\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 popoverRef = useRef<HTMLDivElement>(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, popoverRef], 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 handleEscape = useCallback(\n (e: KeyboardEvent) => {\n e.preventDefault();\n if (open) {\n e.stopPropagation();\n setOpen(false);\n toggleMenuDescendantsActive(false);\n }\n },\n [open]\n );\n\n useEscape(handleEscape, containerRef, [handleEscape]);\n\n useImperativeHandle(handle, () => ({\n focusInput: () => {\n inputRef.current?.focus();\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 'Tab': {\n const forward = !e.shiftKey;\n\n if (forward) {\n const popoverFocusables = getFocusables(popoverRef);\n\n if (popoverFocusables.length) {\n e.preventDefault();\n popoverFocusables[0].focus();\n break;\n }\n }\n\n setOpen(false);\n toggleMenuDescendantsActive(false);\n\n break;\n }\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 || onDropdownButtonClickProp || !onChange) && !readOnly ? (\n <StyledDropdownButton\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 </StyledDropdownButton>\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<HTMLInputElement>) => {\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 useEffect(() => {\n if (open) onMenuOpen?.();\n }, [open]);\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 data-testid={label ? undefined : testIds.root}\n >\n <ComboBoxInput\n data-testid={testIds.control}\n ref={inputRef}\n role='combobox'\n aria-autocomplete='list'\n aria-expanded={!readOnly && !disabled && open}\n aria-controls={\n open && menu !== undefined && !pauseMenuDescendantEvaluation ? listId : undefined\n }\n aria-haspopup='listbox'\n aria-describedby={ariaDescribedBy}\n className={createClassName('combo-box', className, { mode })}\n selected={selected?.items}\n loading={selected?.loading}\n spellCheck={false}\n id={id}\n readOnly={readOnly}\n disabled={disabled}\n onChange={onChange}\n value={value}\n mode={mode}\n status={status}\n onResolveSuggestion={onResolveSuggestion}\n actions={inputActions}\n visual={visual}\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 hideOnTargetHidden\n ref={popoverRef}\n show={open && menu !== undefined}\n target={containerRef.current}\n placement='bottom-start'\n modifiers={[fitToContent]}\n // FIXME: Removed absolute strategy for mobile to avoid overflow issues.\n strategy='fixed'\n onMouseDown={(e: MouseEvent) => e.preventDefault()}\n onKeyDown={(e: KeyboardEvent) => {\n if (!inputRef.current) return;\n\n if (e.key === 'Tab') {\n const popoverFocusables = getFocusables(popoverRef);\n const currentIndex = popoverFocusables.indexOf(e.target as HTMLElement);\n const forward = !e.shiftKey;\n const isLast = currentIndex === popoverFocusables.length - 1;\n\n if (forward && isLast) {\n e.preventDefault();\n const allFocusable = getFocusables(bodyRef as MutableRefObject<HTMLElement>);\n const nextIndex = allFocusable.indexOf(inputRef.current) + 1;\n\n allFocusable[nextIndex]?.focus();\n setOpen(false);\n toggleMenuDescendantsActive(false);\n } else if (!forward && currentIndex === 0) {\n e.preventDefault();\n inputRef.current.focus();\n }\n }\n if (e.key === 'Escape') {\n handleEscape(e);\n inputRef.current.focus();\n }\n }}\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 cycle={false}\n />\n )}\n </Popover>\n </StyledComboBox>\n );\n\n return (\n <>\n {label ? (\n <FormField\n testId={testIds}\n label={label}\n labelHidden={labelHidden}\n id={id}\n info={info}\n readOnly={readOnly}\n status={status}\n required={required}\n disabled={disabled}\n onResolveSuggestion={onResolveSuggestion}\n additionalInfo={additionalInfo}\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(\n Array.isArray(selected?.items) && selected.items.some(item => item.primary)\n ? 'multiselect_instructions_with_links'\n : 'multiselect_instructions',\n [start]\n )}\n </VisuallyHiddenText>\n </>\n );\n }\n ),\n getComboBoxTestIds\n);\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBox.styles.d.ts","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.styles.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,oBAAoB;;2JA+B/B,CAAC;AAIH,eAAO,MAAM,iBAAiB,6NA0C5B,CAAC;AAIH,eAAO,MAAM,cAAc;;;;mBAkBzB,CAAC"}
1
+ {"version":3,"file":"ComboBox.styles.d.ts","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.styles.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,oBAAoB;;2JA+B/B,CAAC;AAIH,eAAO,MAAM,iBAAiB,6NAoD5B,CAAC;AAIH,eAAO,MAAM,cAAc;;;;mBAkBzB,CAAC"}
@@ -4,6 +4,8 @@ import Button from '../Button';
4
4
  import { StyledFormControl } from '../FormControl';
5
5
  import { StyledPopover } from '../Popover';
6
6
  import { StyledMenu, StyledMenuListWrapper } from '../Menu/Menu.styles';
7
+ import { StyledBackdrop } from '../Backdrop';
8
+ import { StyledProgressRing } from '../Progress';
7
9
  export const StyledDropdownButton = styled(Button)(({ theme }) => {
8
10
  const baseBorderRadius = theme.base['border-radius'];
9
11
  const formControlBorderRadius = theme.components['form-control']['border-radius'];
@@ -42,12 +44,22 @@ export const StyledSelectInput = styled.div(({ theme: { base, components } }) =>
42
44
  min-height: ${base['hit-area']['finger-min']};
43
45
  }
44
46
 
45
- div {
47
+ /*
48
+ FIXME
49
+ :not selectors needed to prevent greedy div selector affecting Progress styles.
50
+ Best if div could be more targeted to specific classes.
51
+ */
52
+ div:not(${StyledBackdrop}, ${StyledBackdrop} div) {
46
53
  min-height: calc(
47
54
  ${components.input.height} - 2 * ${components['form-control']['border-width']}
48
55
  );
49
56
  }
50
57
 
58
+ ${StyledProgressRing} svg {
59
+ width: calc(${components.input.height} - 0.5rem);
60
+ height: calc(${components.input.height} - 0.5rem);
61
+ }
62
+
51
63
  &:focus-within {
52
64
  border-color: ${components['form-control'][':focus']['border-color']};
53
65
  box-shadow: ${components['form-control'][':focus']['box-shadow']};
@@ -63,7 +75,7 @@ export const StyledSelectInput = styled.div(({ theme: { base, components } }) =>
63
75
  height: calc(${components.input.height} - 2 * ${components['form-control']['border-width']});
64
76
  color: ${components['form-control']['foreground-color']};
65
77
  text-overflow: ellipsis;
66
- margin-inline: ${base.spacing};
78
+ padding-inline: ${base.spacing};
67
79
  }
68
80
 
69
81
  input,
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBox.styles.js","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;AAExE,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC/D,MAAM,gBAAgB,GAAG,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;IACrD,MAAM,uBAAuB,GAAG,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,eAAe,CAAC,CAAC;IAElF,OAAO,GAAG,CAAA;;;;;;oCAMwB,gBAAgB,MAAM,uBAAuB;;kCAE/C,gBAAgB,MAAM,uBAAuB;;;;;;;iCAO9C,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,cAAc,CAAC;;eAElE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,cAAc,CAAC;0BACrC,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,cAAc,CAAC;;8BAE5C,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,IAAI,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI;;;;;;GAMzF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAErD,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,EAAE,EAAE,EAAE;IAC9E,OAAO,GAAG,CAAA;;oBAEQ,IAAI,CAAC,UAAU,CAAC,CAAC,YAAY,CAAC;;;;;UAKxC,UAAU,CAAC,KAAK,CAAC,MAAM,UAAU,UAAU,CAAC,cAAc,CAAC,CAAC,cAAc,CAAC;;;;;sBAK/D,UAAU,CAAC,cAAc,CAAC,CAAC,QAAQ,CAAC,CAAC,cAAc,CAAC;oBACtD,UAAU,CAAC,cAAc,CAAC,CAAC,QAAQ,CAAC,CAAC,YAAY,CAAC;;;;;;;;;;qBAUjD,UAAU,CAAC,KAAK,CAAC,MAAM,UAAU,UAAU,CAAC,cAAc,CAAC,CAAC,cAAc,CAAC;eACjF,UAAU,CAAC,cAAc,CAAC,CAAC,kBAAkB,CAAC;;uBAEtC,IAAI,CAAC,OAAO;;;;;;;;;;;;;;GAchC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC,GAAG,EAAE;IAC3D,OAAO,GAAG,CAAA;;;;;;;MAON,aAAa;;;;QAIX,UAAU;QACV,qBAAqB;;;;GAI1B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport Button from '../Button';\nimport { StyledFormControl } from '../FormControl';\nimport { StyledPopover } from '../Popover';\nimport { StyledMenu, StyledMenuListWrapper } from '../Menu/Menu.styles';\n\nexport const StyledDropdownButton = styled(Button)(({ theme }) => {\n const baseBorderRadius = theme.base['border-radius'];\n const formControlBorderRadius = theme.components['form-control']['border-radius'];\n\n return css`\n align-self: stretch;\n height: auto;\n margin-block: -0.0625rem;\n margin-inline-end: -0.0625rem;\n border-start-start-radius: 0;\n border-start-end-radius: calc(${baseBorderRadius} * ${formControlBorderRadius});\n border-end-start-radius: 0;\n border-end-end-radius: calc(${baseBorderRadius} * ${formControlBorderRadius});\n\n &::after {\n content: '';\n pointer-events: none;\n position: absolute;\n z-index: 1;\n inset-inline-start: calc(${theme.components['form-control']['border-width']} * -1);\n inset-block: 0;\n width: ${theme.components['form-control']['border-width']};\n background-color: ${theme.components['form-control']['border-color']};\n transform: scaleY(0.5);\n transition: transform ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n }\n\n &:hover::after {\n transform: scaleY(1);\n }\n `;\n});\n\nStyledDropdownButton.defaultProps = defaultThemeProp;\n\nexport const StyledSelectInput = styled.div(({ theme: { base, components } }) => {\n return css`\n @media (pointer: coarse) {\n min-height: ${base['hit-area']['finger-min']};\n }\n\n div {\n min-height: calc(\n ${components.input.height} - 2 * ${components['form-control']['border-width']}\n );\n }\n\n &:focus-within {\n border-color: ${components['form-control'][':focus']['border-color']};\n box-shadow: ${components['form-control'][':focus']['box-shadow']};\n }\n\n &:hover:not([readonly]):not([disabled]):focus-within {\n border-color: transparent;\n }\n\n input {\n min-width: 0;\n width: 100%;\n height: calc(${components.input.height} - 2 * ${components['form-control']['border-width']});\n color: ${components['form-control']['foreground-color']};\n text-overflow: ellipsis;\n margin-inline: ${base.spacing};\n }\n\n input,\n input:focus {\n border: none;\n outline: none;\n flex-grow: 1;\n background-color: transparent;\n\n &:read-only {\n cursor: default;\n }\n }\n `;\n});\n\nStyledSelectInput.defaultProps = defaultThemeProp;\n\nexport const StyledComboBox = styled(StyledFormControl)(() => {\n return css`\n border: 0;\n\n &:focus {\n z-index: 1;\n }\n\n ${StyledPopover} {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n\n ${StyledMenu},\n ${StyledMenuListWrapper} {\n max-height: inherit;\n }\n }\n `;\n});\n\nStyledComboBox.defaultProps = defaultThemeProp;\n"]}
1
+ {"version":3,"file":"ComboBox.styles.js","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;AACxE,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAEjD,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC/D,MAAM,gBAAgB,GAAG,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;IACrD,MAAM,uBAAuB,GAAG,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,eAAe,CAAC,CAAC;IAElF,OAAO,GAAG,CAAA;;;;;;oCAMwB,gBAAgB,MAAM,uBAAuB;;kCAE/C,gBAAgB,MAAM,uBAAuB;;;;;;;iCAO9C,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,cAAc,CAAC;;eAElE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,cAAc,CAAC;0BACrC,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,cAAc,CAAC;;8BAE5C,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,IAAI,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI;;;;;;GAMzF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAErD,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,EAAE,EAAE,EAAE;IAC9E,OAAO,GAAG,CAAA;;oBAEQ,IAAI,CAAC,UAAU,CAAC,CAAC,YAAY,CAAC;;;;;;;;cAQpC,cAAc,KAAK,cAAc;;UAErC,UAAU,CAAC,KAAK,CAAC,MAAM,UAAU,UAAU,CAAC,cAAc,CAAC,CAAC,cAAc,CAAC;;;;MAI/E,kBAAkB;oBACJ,UAAU,CAAC,KAAK,CAAC,MAAM;qBACtB,UAAU,CAAC,KAAK,CAAC,MAAM;;;;sBAItB,UAAU,CAAC,cAAc,CAAC,CAAC,QAAQ,CAAC,CAAC,cAAc,CAAC;oBACtD,UAAU,CAAC,cAAc,CAAC,CAAC,QAAQ,CAAC,CAAC,YAAY,CAAC;;;;;;;;;;qBAUjD,UAAU,CAAC,KAAK,CAAC,MAAM,UAAU,UAAU,CAAC,cAAc,CAAC,CAAC,cAAc,CAAC;eACjF,UAAU,CAAC,cAAc,CAAC,CAAC,kBAAkB,CAAC;;wBAErC,IAAI,CAAC,OAAO;;;;;;;;;;;;;;GAcjC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC,GAAG,EAAE;IAC3D,OAAO,GAAG,CAAA;;;;;;;MAON,aAAa;;;;QAIX,UAAU;QACV,qBAAqB;;;;GAI1B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport Button from '../Button';\nimport { StyledFormControl } from '../FormControl';\nimport { StyledPopover } from '../Popover';\nimport { StyledMenu, StyledMenuListWrapper } from '../Menu/Menu.styles';\nimport { StyledBackdrop } from '../Backdrop';\nimport { StyledProgressRing } from '../Progress';\n\nexport const StyledDropdownButton = styled(Button)(({ theme }) => {\n const baseBorderRadius = theme.base['border-radius'];\n const formControlBorderRadius = theme.components['form-control']['border-radius'];\n\n return css`\n align-self: stretch;\n height: auto;\n margin-block: -0.0625rem;\n margin-inline-end: -0.0625rem;\n border-start-start-radius: 0;\n border-start-end-radius: calc(${baseBorderRadius} * ${formControlBorderRadius});\n border-end-start-radius: 0;\n border-end-end-radius: calc(${baseBorderRadius} * ${formControlBorderRadius});\n\n &::after {\n content: '';\n pointer-events: none;\n position: absolute;\n z-index: 1;\n inset-inline-start: calc(${theme.components['form-control']['border-width']} * -1);\n inset-block: 0;\n width: ${theme.components['form-control']['border-width']};\n background-color: ${theme.components['form-control']['border-color']};\n transform: scaleY(0.5);\n transition: transform ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n }\n\n &:hover::after {\n transform: scaleY(1);\n }\n `;\n});\n\nStyledDropdownButton.defaultProps = defaultThemeProp;\n\nexport const StyledSelectInput = styled.div(({ theme: { base, components } }) => {\n return css`\n @media (pointer: coarse) {\n min-height: ${base['hit-area']['finger-min']};\n }\n\n /*\n FIXME\n :not selectors needed to prevent greedy div selector affecting Progress styles.\n Best if div could be more targeted to specific classes.\n */\n div:not(${StyledBackdrop}, ${StyledBackdrop} div) {\n min-height: calc(\n ${components.input.height} - 2 * ${components['form-control']['border-width']}\n );\n }\n\n ${StyledProgressRing} svg {\n width: calc(${components.input.height} - 0.5rem);\n height: calc(${components.input.height} - 0.5rem);\n }\n\n &:focus-within {\n border-color: ${components['form-control'][':focus']['border-color']};\n box-shadow: ${components['form-control'][':focus']['box-shadow']};\n }\n\n &:hover:not([readonly]):not([disabled]):focus-within {\n border-color: transparent;\n }\n\n input {\n min-width: 0;\n width: 100%;\n height: calc(${components.input.height} - 2 * ${components['form-control']['border-width']});\n color: ${components['form-control']['foreground-color']};\n text-overflow: ellipsis;\n padding-inline: ${base.spacing};\n }\n\n input,\n input:focus {\n border: none;\n outline: none;\n flex-grow: 1;\n background-color: transparent;\n\n &:read-only {\n cursor: default;\n }\n }\n `;\n});\n\nStyledSelectInput.defaultProps = defaultThemeProp;\n\nexport const StyledComboBox = styled(StyledFormControl)(() => {\n return css`\n border: 0;\n\n &:focus {\n z-index: 1;\n }\n\n ${StyledPopover} {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n\n ${StyledMenu},\n ${StyledMenuListWrapper} {\n max-height: inherit;\n }\n }\n `;\n});\n\nStyledComboBox.defaultProps = defaultThemeProp;\n"]}
@@ -29,6 +29,8 @@ type ComboBoxProps = WithAttributes<'input', TestIdProp & NoChildrenProp & {
29
29
  items?: Selected | Selected[];
30
30
  onRemove?: (id: MenuItemProps['id'], index: number) => void;
31
31
  onNew?: (text: string) => void;
32
+ /** Show a Progress indicator. */
33
+ loading?: boolean;
32
34
  };
33
35
  /** Value of the combobox filtering input. */
34
36
  value?: FormControlProps['value'];
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBox.types.d.ts","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,aAAa,IAAI,kBAAkB,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAEjF,OAAO,KAAK,EAAE,cAAc,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC9E,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACvD,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAEnE,MAAM,WAAW,QAAQ;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,mBAAmB;IAClC,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,KAAK,aAAa,GAAG,cAAc,CACjC,OAAO,EACP,UAAU,GACR,cAAc,GAAG;IACf,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,uCAAuC;IACvC,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,6GAA6G;IAC7G,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC;;;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,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;;;;;;;OAOG;IACH,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,6BAA6B;IAC7B,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB;;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,0CAA0C;IAC1C,MAAM,CAAC,EAAE,GAAG,CAAC,mBAAmB,CAAC,CAAC;IAClC,gCAAgC;IAChC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B,CACJ,CAAC;AAGF,YAAY,EAAE,aAAa,IAAI,OAAO,EAAE,CAAC"}
1
+ {"version":3,"file":"ComboBox.types.d.ts","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,aAAa,IAAI,kBAAkB,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAEjF,OAAO,KAAK,EAAE,cAAc,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC9E,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACvD,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAEnE,MAAM,WAAW,QAAQ;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,mBAAmB;IAClC,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,KAAK,aAAa,GAAG,cAAc,CACjC,OAAO,EACP,UAAU,GACR,cAAc,GAAG;IACf,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,uCAAuC;IACvC,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,6GAA6G;IAC7G,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC;;;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;QAC/B,iCAAiC;QACjC,OAAO,CAAC,EAAE,OAAO,CAAC;KACnB,CAAC;IACF,6CAA6C;IAC7C,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,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;;;;;;;OAOG;IACH,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,6BAA6B;IAC7B,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB;;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,0CAA0C;IAC1C,MAAM,CAAC,EAAE,GAAG,CAAC,mBAAmB,CAAC,CAAC;IAClC,gCAAgC;IAChC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B,CACJ,CAAC;AAGF,YAAY,EAAE,aAAa,IAAI,OAAO,EAAE,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBox.types.js","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ReactNode, KeyboardEvent as ReactKeyboardEvent, Ref } from 'react';\n\nimport type { NoChildrenProp, TestIdProp, WithAttributes } from '../../types';\nimport type { FormControlProps } from '../FormControl';\nimport type { MenuItemProps, MenuProps } from '../Menu/Menu.types';\n\nexport interface Selected {\n id: string;\n text: string;\n primary?: ReactNode;\n}\n\nexport interface ComboBoxHandleValue {\n focusInput: () => void;\n}\n\ntype ComboBoxProps = WithAttributes<\n 'input',\n TestIdProp &\n NoChildrenProp & {\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 /** 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 /**\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 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 /**\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 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 menu opens. */\n onMenuOpen?: () => 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 /** Imperative handle for the component */\n handle?: Ref<ComboBoxHandleValue>;\n /** Reference to the element. */\n ref?: Ref<HTMLDivElement>;\n }\n>;\n\n// eslint-disable-next-line no-restricted-exports\nexport type { ComboBoxProps as default };\n"]}
1
+ {"version":3,"file":"ComboBox.types.js","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBox.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ReactNode, KeyboardEvent as ReactKeyboardEvent, Ref } from 'react';\n\nimport type { NoChildrenProp, TestIdProp, WithAttributes } from '../../types';\nimport type { FormControlProps } from '../FormControl';\nimport type { MenuItemProps, MenuProps } from '../Menu/Menu.types';\n\nexport interface Selected {\n id: string;\n text: string;\n primary?: ReactNode;\n}\n\nexport interface ComboBoxHandleValue {\n focusInput: () => void;\n}\n\ntype ComboBoxProps = WithAttributes<\n 'input',\n TestIdProp &\n NoChildrenProp & {\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 /** 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 /**\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 /** Show a Progress indicator. */\n loading?: boolean;\n };\n /** Value of the combobox filtering input. */\n value?: FormControlProps['value'];\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 /**\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 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 menu opens. */\n onMenuOpen?: () => 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 /** Imperative handle for the component */\n handle?: Ref<ComboBoxHandleValue>;\n /** Reference to the element. */\n ref?: Ref<HTMLDivElement>;\n }\n>;\n\n// eslint-disable-next-line no-restricted-exports\nexport type { ComboBoxProps as default };\n"]}
@@ -7,6 +7,7 @@ import type { Selected } from './ComboBox.types';
7
7
  interface ComboBoxInputProps extends BaseProps {
8
8
  mode?: 'multi-select' | 'single-select';
9
9
  selected?: Selected | Selected[];
10
+ loading?: boolean;
10
11
  value?: ComboBoxProps['value'];
11
12
  visual?: ComboBoxProps['visual'];
12
13
  onRemove?: (id: MenuItemProps['id'], index: number) => void;
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBoxInput.d.ts","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBoxInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAwB,MAAM,OAAO,CAAC;AAErE,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAC3D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAIxD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,2CAA2C,CAAC;AACvF,OAAO,KAAK,aAAa,MAAM,kBAAkB,CAAC;AAClD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEjD,UAAU,kBAAmB,SAAQ,SAAS;IAC5C,IAAI,CAAC,EAAE,cAAc,GAAG,eAAe,CAAC;IACxC,QAAQ,CAAC,EAAE,QAAQ,GAAG,QAAQ,EAAE,CAAC;IACjC,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IAC/B,MAAM,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;IACjC,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5D,6CAA6C;IAC7C,eAAe,CAAC,EAAE,qBAAqB,CAAC,iBAAiB,CAAC,CAAC;IAC3D,4CAA4C;IAC5C,cAAc,CAAC,EAAE,qBAAqB,CAAC,gBAAgB,CAAC,CAAC;IACzD,oDAAoD;IACpD,yBAAyB,CAAC,EAAE,qBAAqB,CAAC,2BAA2B,CAAC,CAAC;CAChF;AAED,QAAA,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,GAAG,YAAY,CAmCvE,CAAC;AAEF,eAAe,aAAa,CAAC"}
1
+ {"version":3,"file":"ComboBoxInput.d.ts","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBoxInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAwB,MAAM,OAAO,CAAC;AAErE,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAC3D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAIxD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,2CAA2C,CAAC;AACvF,OAAO,KAAK,aAAa,MAAM,kBAAkB,CAAC;AAClD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEjD,UAAU,kBAAmB,SAAQ,SAAS;IAC5C,IAAI,CAAC,EAAE,cAAc,GAAG,eAAe,CAAC;IACxC,QAAQ,CAAC,EAAE,QAAQ,GAAG,QAAQ,EAAE,CAAC;IACjC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IAC/B,MAAM,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;IACjC,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5D,6CAA6C;IAC7C,eAAe,CAAC,EAAE,qBAAqB,CAAC,iBAAiB,CAAC,CAAC;IAC3D,4CAA4C;IAC5C,cAAc,CAAC,EAAE,qBAAqB,CAAC,gBAAgB,CAAC,CAAC;IACzD,oDAAoD;IACpD,yBAAyB,CAAC,EAAE,qBAAqB,CAAC,2BAA2B,CAAC,CAAC;CAChF;AAED,QAAA,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,GAAG,YAAY,CAmCvE,CAAC;AAEF,eAAe,aAAa,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBoxInput.js","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBoxInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAMnC,OAAO,iBAAiB,MAAM,uCAAuC,CAAC;AACtE,OAAO,gBAAgB,MAAM,qCAAqC,CAAC;AAmBnE,MAAM,aAAa,GAAyD,UAAU,CACpF,SAAS,aAAa,CAAC,KAA0C,EAAE,GAA0B;IAC3F,MAAM,EACJ,KAAK,EACL,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,eAAe,EACf,cAAc,EACd,yBAAyB,EACzB,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,OAAO,IAAI,KAAK,cAAc,CAAC,CAAC,CAAC,CAC/B,KAAC,gBAAgB,IACf,QAAQ,EAAE,QAAsB,EAChC,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,eAAe,EAAE,eAAe,EAChC,yBAAyB,EAAE,yBAAyB,KAChD,SAAS,GACb,CACH,CAAC,CAAC,CAAC,CACF,KAAC,iBAAiB,IAChB,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAoB,EAC9B,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,KACV,SAAS,GACb,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { FunctionComponent, Ref, PropsWithoutRef } from 'react';\n\nimport type { BaseProps, ForwardProps } from '../../types';\nimport type { MenuItemProps } from '../Menu/Menu.types';\n\nimport SingleSelectInput from './SingleSelectInput/SingleSelectInput';\nimport MultiSelectInput from './MultiSelectInput/MultiSelectInput';\nimport type { MultiSelectInputProps } from './MultiSelectInput/MultiSelectInput.types';\nimport type ComboBoxProps from './ComboBox.types';\nimport type { Selected } from './ComboBox.types';\n\ninterface ComboBoxInputProps extends BaseProps {\n mode?: 'multi-select' | 'single-select';\n selected?: Selected | Selected[];\n value?: ComboBoxProps['value'];\n visual?: ComboBoxProps['visual'];\n onRemove?: (id: MenuItemProps['id'], index: number) => void;\n /** Callback on selected item pseudo focus */\n onSelectedFocus?: MultiSelectInputProps['onSelectedFocus'];\n /** Callback on selected item pseudo blur */\n onSelectedBlur?: MultiSelectInputProps['onSelectedBlur'];\n /** Pause evaluation of selected item descendants */\n pauseDescendantEvaluation?: MultiSelectInputProps['pauseDescendantEvaluation'];\n}\n\nconst ComboBoxInput: FunctionComponent<ComboBoxInputProps & ForwardProps> = forwardRef(\n function ComboBoxInput(props: PropsWithoutRef<ComboBoxInputProps>, ref: Ref<HTMLInputElement>) {\n const {\n value,\n mode,\n selected,\n visual,\n onRemove,\n onSelectedFocus,\n onSelectedBlur,\n pauseDescendantEvaluation,\n ...restProps\n } = props;\n\n return mode === 'multi-select' ? (\n <MultiSelectInput\n selected={selected as Selected[]}\n value={value}\n ref={ref}\n onRemove={onRemove}\n onSelectedBlur={onSelectedBlur}\n onSelectedFocus={onSelectedFocus}\n pauseDescendantEvaluation={pauseDescendantEvaluation}\n {...restProps}\n />\n ) : (\n <SingleSelectInput\n ref={ref}\n selected={selected as Selected}\n value={value}\n visual={visual}\n {...restProps}\n />\n );\n }\n);\n\nexport default ComboBoxInput;\n"]}
1
+ {"version":3,"file":"ComboBoxInput.js","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBoxInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAMnC,OAAO,iBAAiB,MAAM,uCAAuC,CAAC;AACtE,OAAO,gBAAgB,MAAM,qCAAqC,CAAC;AAoBnE,MAAM,aAAa,GAAyD,UAAU,CACpF,SAAS,aAAa,CAAC,KAA0C,EAAE,GAA0B;IAC3F,MAAM,EACJ,KAAK,EACL,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,eAAe,EACf,cAAc,EACd,yBAAyB,EACzB,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,OAAO,IAAI,KAAK,cAAc,CAAC,CAAC,CAAC,CAC/B,KAAC,gBAAgB,IACf,QAAQ,EAAE,QAAsB,EAChC,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,eAAe,EAAE,eAAe,EAChC,yBAAyB,EAAE,yBAAyB,KAChD,SAAS,GACb,CACH,CAAC,CAAC,CAAC,CACF,KAAC,iBAAiB,IAChB,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAoB,EAC9B,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,KACV,SAAS,GACb,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { FunctionComponent, Ref, PropsWithoutRef } from 'react';\n\nimport type { BaseProps, ForwardProps } from '../../types';\nimport type { MenuItemProps } from '../Menu/Menu.types';\n\nimport SingleSelectInput from './SingleSelectInput/SingleSelectInput';\nimport MultiSelectInput from './MultiSelectInput/MultiSelectInput';\nimport type { MultiSelectInputProps } from './MultiSelectInput/MultiSelectInput.types';\nimport type ComboBoxProps from './ComboBox.types';\nimport type { Selected } from './ComboBox.types';\n\ninterface ComboBoxInputProps extends BaseProps {\n mode?: 'multi-select' | 'single-select';\n selected?: Selected | Selected[];\n loading?: boolean;\n value?: ComboBoxProps['value'];\n visual?: ComboBoxProps['visual'];\n onRemove?: (id: MenuItemProps['id'], index: number) => void;\n /** Callback on selected item pseudo focus */\n onSelectedFocus?: MultiSelectInputProps['onSelectedFocus'];\n /** Callback on selected item pseudo blur */\n onSelectedBlur?: MultiSelectInputProps['onSelectedBlur'];\n /** Pause evaluation of selected item descendants */\n pauseDescendantEvaluation?: MultiSelectInputProps['pauseDescendantEvaluation'];\n}\n\nconst ComboBoxInput: FunctionComponent<ComboBoxInputProps & ForwardProps> = forwardRef(\n function ComboBoxInput(props: PropsWithoutRef<ComboBoxInputProps>, ref: Ref<HTMLInputElement>) {\n const {\n value,\n mode,\n selected,\n visual,\n onRemove,\n onSelectedFocus,\n onSelectedBlur,\n pauseDescendantEvaluation,\n ...restProps\n } = props;\n\n return mode === 'multi-select' ? (\n <MultiSelectInput\n selected={selected as Selected[]}\n value={value}\n ref={ref}\n onRemove={onRemove}\n onSelectedBlur={onSelectedBlur}\n onSelectedFocus={onSelectedFocus}\n pauseDescendantEvaluation={pauseDescendantEvaluation}\n {...restProps}\n />\n ) : (\n <SingleSelectInput\n ref={ref}\n selected={selected as Selected}\n value={value}\n visual={visual}\n {...restProps}\n />\n );\n }\n);\n\nexport default ComboBoxInput;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"MultiSelectInput.d.ts","sourceRoot":"","sources":["../../../../src/components/ComboBox/MultiSelectInput/MultiSelectInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAmD,MAAM,OAAO,CAAC;AAGhG,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAiBnD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AAEtE,eAAO,MAAM,sBAAsB;;mBAYlC,CAAC;AAIF,QAAA,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,qBAAqB,GAAG,YAAY,CAiU7E,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
1
+ {"version":3,"file":"MultiSelectInput.d.ts","sourceRoot":"","sources":["../../../../src/components/ComboBox/MultiSelectInput/MultiSelectInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAmD,MAAM,OAAO,CAAC;AAIhG,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAiBnD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AAEtE,eAAO,MAAM,sBAAsB;;mBAYlC,CAAC;AAQF,QAAA,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,qBAAqB,GAAG,YAAY,CA0U7E,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
@@ -1,6 +1,7 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { forwardRef, useRef, useCallback, useMemo, useState, useEffect } from 'react';
3
3
  import styled from 'styled-components';
4
+ import Progress from '../../Progress';
4
5
  import { defaultThemeProp } from '../../../theme';
5
6
  import Selectable from '../../Badges/Selection';
6
7
  import { StyledFormControl } from '../../FormControl';
@@ -23,8 +24,11 @@ export const StyledMultiSelectInput = styled(StyledSelectInput) `
23
24
  }
24
25
  `;
25
26
  StyledMultiSelectInput.defaultProps = defaultThemeProp;
27
+ const StyledInputWrapper = styled(Flex) `
28
+ position: relative;
29
+ `;
26
30
  const MultiSelectInput = forwardRef(function MultiSelectInput(props, ref) {
27
- const { selected = [], value, onRemove, onChange, onKeyDown, onResolveSuggestion, actions, readOnly, disabled, status, placeholder, autoFocus, pauseDescendantEvaluation, onSelectedFocus, onSelectedBlur, 'aria-controls': ariaControls, required, ...restProps } = props;
31
+ const { selected = [], loading, value, onRemove, onChange, onKeyDown, onResolveSuggestion, actions, readOnly, disabled, status, placeholder, autoFocus, pauseDescendantEvaluation, onSelectedFocus, onSelectedBlur, 'aria-controls': ariaControls, required, ...restProps } = props;
28
32
  const t = useI18n();
29
33
  const id = useUID();
30
34
  const inputRef = useConsolidatedRef(ref);
@@ -191,7 +195,7 @@ const MultiSelectInput = forwardRef(function MultiSelectInput(props, ref) {
191
195
  }
192
196
  return ariaControls;
193
197
  }, [pauseDescendantEvaluation, selected.length]);
194
- return (_jsxs(Flex, { as: StyledMultiSelectInput, forwardedAs: StyledFormControl, hasSuggestion: status === 'pending' && !!onResolveSuggestion, container: { alignItems: 'center', justify: 'between' }, readOnly: readOnly, disabled: disabled, status: status, children: [_jsxs(Flex, { container: { alignContent: 'center', wrap: 'wrap', rowGap: 0.5, colGap: 0.25, pad: 0.25 }, item: { grow: 1 }, onClick: (e) => {
198
+ return (_jsxs(Flex, { as: StyledMultiSelectInput, forwardedAs: StyledFormControl, hasSuggestion: status === 'pending' && !!onResolveSuggestion, container: { alignItems: 'center', justify: 'between' }, readOnly: readOnly, disabled: disabled, status: status, children: [_jsxs(StyledInputWrapper, { container: { alignContent: 'center', wrap: 'wrap', rowGap: 0.5, colGap: 0.25, pad: 0.25 }, item: { grow: 1 }, onClick: (e) => {
195
199
  // Ignore clicks on selection items
196
200
  if (isInstance(e.target, HTMLElement) &&
197
201
  !isInstance(e.target, HTMLInputElement) &&
@@ -200,7 +204,9 @@ const MultiSelectInput = forwardRef(function MultiSelectInput(props, ref) {
200
204
  inputRef.current?.focus();
201
205
  inputRef.current?.click();
202
206
  }
203
- }, children: [selected.length > 0 && (
207
+ }, children: [loading && (_jsx(Progress, { placement: 'local', "aria-label": t('combobox_loading_selected_items'), liveConfig: {
208
+ contextualLabel: t('combobox_loading_selected_items')
209
+ } })), selected.length > 0 && (
204
210
  // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
205
211
  _jsx("ul", { ref: listRef, id: id, "aria-label": t('selected_items'), onKeyDown: onListArrowKeyDown, children: selected.map((element, idx) => {
206
212
  return (_jsx(Selectable, { as: 'li', id: element.id.toString(), status: status, contextualLabel: element.text, onRemove: !readOnly && !disabled
@@ -1 +1 @@
1
- {"version":3,"file":"MultiSelectInput.js","sourceRoot":"","sources":["../../../../src/components/ComboBox/MultiSelectInput/MultiSelectInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef, useCallback, useMemo, useState, useEffect } from 'react';\nimport type { FunctionComponent, Ref, PropsWithoutRef, KeyboardEvent, MouseEvent } from 'react';\nimport styled from 'styled-components';\n\nimport type { ForwardProps } from '../../../types';\nimport { defaultThemeProp } from '../../../theme';\nimport Selectable from '../../Badges/Selection';\nimport { StyledFormControl } from '../../FormControl';\nimport Flex from '../../Flex';\nimport {\n useConsolidatedRef,\n useActiveDescendant,\n useDirection,\n useI18n,\n useUID\n} from '../../../hooks';\nimport { cap, isInstance, getActiveElement } from '../../../utils';\nimport VisuallyHiddenText from '../../VisuallyHiddenText';\nimport { StyledSelectInput } from '../ComboBox.styles';\nimport type { Selected } from '../ComboBox.types';\n\nimport type { MultiSelectInputProps } from './MultiSelectInput.types';\n\nexport const StyledMultiSelectInput = styled(StyledSelectInput)`\n cursor: text;\n\n ul {\n list-style: none;\n display: contents;\n }\n\n input {\n width: 8ch;\n height: 1.125rem;\n }\n`;\n\nStyledMultiSelectInput.defaultProps = defaultThemeProp;\n\nconst MultiSelectInput: FunctionComponent<MultiSelectInputProps & ForwardProps> = forwardRef(\n function MultiSelectInput(\n props: PropsWithoutRef<MultiSelectInputProps>,\n ref: Ref<HTMLInputElement>\n ) {\n const {\n selected = [],\n value,\n onRemove,\n onChange,\n onKeyDown,\n onResolveSuggestion,\n actions,\n readOnly,\n disabled,\n status,\n placeholder,\n autoFocus,\n pauseDescendantEvaluation,\n onSelectedFocus,\n onSelectedBlur,\n 'aria-controls': ariaControls,\n required,\n ...restProps\n } = props;\n const t = useI18n();\n const id = useUID();\n\n const inputRef = useConsolidatedRef<HTMLInputElement>(ref);\n const listRef = useRef<HTMLUListElement>(null);\n const [focusDescendant, setFocusDescendant] = useState<HTMLElement | null>(null);\n const [activeItemId, setActiveItemId] = useState<string | null>(null);\n const { start, end } = useDirection();\n\n const uadConfig = useMemo(\n () => ({\n focusEl: inputRef.current,\n scope: listRef.current,\n selector: ':scope > li',\n orientation: 'horizontal' as const,\n focusReturnEl: focusDescendant,\n clearFocusReturn: () => {\n setFocusDescendant(null);\n },\n pauseDescendantEvaluation,\n preventInitialScroll: true,\n onClick: (el: HTMLElement) => {\n el.click();\n }\n }),\n [pauseDescendantEvaluation, selected, focusDescendant]\n );\n\n const { activeDescendant } = useActiveDescendant(uadConfig, [selected]);\n\n const handleSelectedRemoval = useCallback(\n (selectionId: Selected['id'], idx: number) => {\n if (!pauseDescendantEvaluation) {\n if (idx === selected.length - 1) {\n // If removing last selected item\n if (selected.length > 1) {\n // If other selected items, focus previous\n setFocusDescendant(\n (listRef.current?.querySelectorAll(uadConfig.selector)[idx - 1] as HTMLElement) ||\n null\n );\n } else {\n // Blur selected if final only item removed\n onSelectedBlur?.();\n }\n } else if (selected.length > 1) {\n // If not last item removed and other selected items, focus next\n setFocusDescendant(\n (listRef.current?.querySelectorAll(uadConfig.selector)[idx + 1] as HTMLElement) ||\n null\n );\n }\n }\n onRemove?.(selectionId, idx);\n inputRef.current?.focus();\n },\n [selected, onRemove, onSelectedBlur, uadConfig]\n );\n\n useEffect(() => {\n // Maintain active item & prev. val only as it changes.\n if (activeDescendant?.id && activeDescendant.id !== activeItemId) {\n setActiveItemId(activeDescendant.id);\n }\n }, [activeDescendant]);\n\n const onListArrowKeyDown = useCallback(\n (e: KeyboardEvent<HTMLUListElement>) => {\n // Tab (forward) from within the list: move focus to the input\n if (e.key === 'Tab' && !e.shiftKey) {\n e.preventDefault();\n inputRef.current?.focus();\n return;\n }\n\n // Shift+Tab from within the list: exit the combobox entirely\n if (e.key === 'Tab' && e.shiftKey) {\n const focusables = Array.from(listRef.current?.querySelectorAll('a, button') ?? []);\n const elementsToRestore = inputRef.current\n ? [...focusables, inputRef.current]\n : focusables;\n const previousTabIndexes = elementsToRestore.map(el => ({\n el,\n tabindex: el.getAttribute('tabindex')\n }));\n elementsToRestore.forEach(el => el.setAttribute('tabindex', '-1'));\n requestAnimationFrame(() => {\n previousTabIndexes.forEach(({ el, tabindex }) => {\n if (tabindex === null) {\n el.removeAttribute('tabindex');\n } else {\n el.setAttribute('tabindex', tabindex);\n }\n });\n });\n return;\n }\n\n if (e.key !== `Arrow${cap(start)}` && e.key !== `Arrow${cap(end)}`) return;\n\n const items = Array.from(\n listRef.current?.querySelectorAll<HTMLLIElement>(uadConfig.selector) ?? []\n );\n const currentIndex = items.findIndex(\n item => item === getActiveElement() || item.contains(getActiveElement())\n );\n if (currentIndex === -1) return;\n\n e.preventDefault();\n e.stopPropagation();\n\n if (e.key === `Arrow${cap(start)}` && currentIndex > 0) {\n const prev = items[currentIndex - 1];\n const prevLink = prev.querySelector('a');\n const focusTarget = isInstance(prevLink, HTMLElement) ? prevLink : prev;\n focusTarget.focus();\n } else if (e.key === `Arrow${cap(end)}`) {\n if (currentIndex < items.length - 1) {\n const next = items[currentIndex + 1];\n const nextLink = next.querySelector('a');\n const focusTarget = isInstance(nextLink, HTMLElement) ? nextLink : next;\n focusTarget.focus();\n } else {\n inputRef.current?.focus();\n }\n }\n },\n [start, end, uadConfig.selector]\n );\n\n const onInputKeyDown = useCallback(\n (e: KeyboardEvent<HTMLInputElement>) => {\n // Shift+Tab: Focus the last selected item's link\n if (e.key === 'Tab' && e.shiftKey && selected.length) {\n const items = Array.from(\n listRef.current?.querySelectorAll<HTMLLIElement>(uadConfig.selector) ?? []\n );\n const lastItem = items[items.length - 1];\n const link = lastItem?.querySelector('a');\n\n if (isInstance(link, HTMLElement)) {\n e.preventDefault();\n e.stopPropagation();\n link.focus();\n return;\n }\n }\n\n if (\n selected.length &&\n inputRef.current?.selectionStart === 0 &&\n inputRef.current?.selectionEnd === 0\n ) {\n const lastIndex = selected.length - 1;\n if (pauseDescendantEvaluation && e.key === `Arrow${cap(start)}`) {\n setFocusDescendant(\n (listRef.current?.querySelectorAll(uadConfig.selector)[lastIndex] as HTMLElement) ||\n null\n );\n onSelectedFocus?.();\n }\n\n const lastSelectableId = listRef.current?.querySelectorAll(uadConfig.selector)[lastIndex]\n ?.id;\n const onLastItem = activeItemId === lastSelectableId;\n\n if (\n !pauseDescendantEvaluation &&\n ((onLastItem && e.key === `Arrow${cap(end)}`) || e.key === 'ArrowDown')\n ) {\n onSelectedBlur?.();\n }\n\n if (['Backspace', 'Delete'].includes(e.key) && !(readOnly || disabled)) {\n handleSelectedRemoval(selected[lastIndex].id, lastIndex);\n }\n }\n onKeyDown?.(e);\n },\n [\n pauseDescendantEvaluation,\n activeItemId,\n onKeyDown,\n handleSelectedRemoval,\n selected,\n readOnly,\n disabled,\n start,\n uadConfig.selector,\n onSelectedFocus,\n onSelectedBlur\n ]\n );\n\n const ariaDescribedBy = useMemo(() => {\n return onChange\n ? `${id}-inputDescription ${id}-searchDescription`\n : `${id}-inputDescription`;\n }, [id]);\n\n const ariaControlsValue = useMemo(() => {\n if (!pauseDescendantEvaluation) {\n return selected.length > 0 ? id : undefined;\n }\n return ariaControls;\n }, [pauseDescendantEvaluation, selected.length]);\n\n return (\n <Flex\n as={StyledMultiSelectInput}\n forwardedAs={StyledFormControl}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n container={{ alignItems: 'center', justify: 'between' }}\n readOnly={readOnly}\n disabled={disabled}\n status={status}\n >\n <Flex\n container={{ alignContent: 'center', wrap: 'wrap', rowGap: 0.5, colGap: 0.25, pad: 0.25 }}\n item={{ grow: 1 }}\n onClick={(e: MouseEvent<HTMLDivElement>) => {\n // Ignore clicks on selection items\n if (\n isInstance(e.target, HTMLElement) &&\n !isInstance(e.target, HTMLInputElement) &&\n !e.currentTarget.contains(e.target.closest('li'))\n ) {\n e.stopPropagation();\n inputRef.current?.focus();\n inputRef.current?.click();\n }\n }}\n >\n {selected.length > 0 && (\n // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n <ul\n ref={listRef}\n id={id}\n aria-label={t('selected_items')}\n onKeyDown={onListArrowKeyDown}\n >\n {selected.map((element, idx) => {\n return (\n <Selectable\n as='li'\n key={element.id}\n id={element.id.toString()}\n status={status}\n contextualLabel={element.text}\n onRemove={\n !readOnly && !disabled\n ? () => {\n handleSelectedRemoval(element.id, idx);\n }\n : undefined\n }\n tabIndex={-1}\n aria-label={`${t('remove')} ${element.text}`}\n aria-describedby={ariaDescribedBy}\n >\n {element.primary ?? element.text}\n </Selectable>\n );\n })}\n </ul>\n )}\n <Flex\n item={{ grow: 1 }}\n as='input'\n size={1}\n ref={inputRef}\n value={value}\n // no-op avoids react uncontrolled warning\n onChange={onChange || (() => {})}\n onKeyDown={onInputKeyDown}\n readOnly={readOnly || !onChange}\n disabled={disabled}\n placeholder={selected?.length ? undefined : placeholder}\n autoComplete='_off'\n autoFocus={autoFocus}\n aria-controls={ariaControlsValue}\n aria-required={!!required}\n {...restProps}\n />\n </Flex>\n {actions}\n\n <VisuallyHiddenText id={`${id}-inputDescription`}>\n {`${t('combobox_open_close')} `}\n </VisuallyHiddenText>\n <VisuallyHiddenText id={`${id}-searchDescription`}>\n {t('combobox_search_instructions')}\n </VisuallyHiddenText>\n </Flex>\n );\n }\n);\n\nexport default MultiSelectInput;\n"]}
1
+ {"version":3,"file":"MultiSelectInput.js","sourceRoot":"","sources":["../../../../src/components/ComboBox/MultiSelectInput/MultiSelectInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef, useCallback, useMemo, useState, useEffect } from 'react';\nimport type { FunctionComponent, Ref, PropsWithoutRef, KeyboardEvent, MouseEvent } from 'react';\nimport styled from 'styled-components';\n\nimport Progress from '../../Progress';\nimport type { ForwardProps } from '../../../types';\nimport { defaultThemeProp } from '../../../theme';\nimport Selectable from '../../Badges/Selection';\nimport { StyledFormControl } from '../../FormControl';\nimport Flex from '../../Flex';\nimport {\n useConsolidatedRef,\n useActiveDescendant,\n useDirection,\n useI18n,\n useUID\n} from '../../../hooks';\nimport { cap, isInstance, getActiveElement } from '../../../utils';\nimport VisuallyHiddenText from '../../VisuallyHiddenText';\nimport { StyledSelectInput } from '../ComboBox.styles';\nimport type { Selected } from '../ComboBox.types';\n\nimport type { MultiSelectInputProps } from './MultiSelectInput.types';\n\nexport const StyledMultiSelectInput = styled(StyledSelectInput)`\n cursor: text;\n\n ul {\n list-style: none;\n display: contents;\n }\n\n input {\n width: 8ch;\n height: 1.125rem;\n }\n`;\n\nStyledMultiSelectInput.defaultProps = defaultThemeProp;\n\nconst StyledInputWrapper = styled(Flex)`\n position: relative;\n`;\n\nconst MultiSelectInput: FunctionComponent<MultiSelectInputProps & ForwardProps> = forwardRef(\n function MultiSelectInput(\n props: PropsWithoutRef<MultiSelectInputProps>,\n ref: Ref<HTMLInputElement>\n ) {\n const {\n selected = [],\n loading,\n value,\n onRemove,\n onChange,\n onKeyDown,\n onResolveSuggestion,\n actions,\n readOnly,\n disabled,\n status,\n placeholder,\n autoFocus,\n pauseDescendantEvaluation,\n onSelectedFocus,\n onSelectedBlur,\n 'aria-controls': ariaControls,\n required,\n ...restProps\n } = props;\n const t = useI18n();\n const id = useUID();\n\n const inputRef = useConsolidatedRef<HTMLInputElement>(ref);\n const listRef = useRef<HTMLUListElement>(null);\n const [focusDescendant, setFocusDescendant] = useState<HTMLElement | null>(null);\n const [activeItemId, setActiveItemId] = useState<string | null>(null);\n const { start, end } = useDirection();\n\n const uadConfig = useMemo(\n () => ({\n focusEl: inputRef.current,\n scope: listRef.current,\n selector: ':scope > li',\n orientation: 'horizontal' as const,\n focusReturnEl: focusDescendant,\n clearFocusReturn: () => {\n setFocusDescendant(null);\n },\n pauseDescendantEvaluation,\n preventInitialScroll: true,\n onClick: (el: HTMLElement) => {\n el.click();\n }\n }),\n [pauseDescendantEvaluation, selected, focusDescendant]\n );\n\n const { activeDescendant } = useActiveDescendant(uadConfig, [selected]);\n\n const handleSelectedRemoval = useCallback(\n (selectionId: Selected['id'], idx: number) => {\n if (!pauseDescendantEvaluation) {\n if (idx === selected.length - 1) {\n // If removing last selected item\n if (selected.length > 1) {\n // If other selected items, focus previous\n setFocusDescendant(\n (listRef.current?.querySelectorAll(uadConfig.selector)[idx - 1] as HTMLElement) ||\n null\n );\n } else {\n // Blur selected if final only item removed\n onSelectedBlur?.();\n }\n } else if (selected.length > 1) {\n // If not last item removed and other selected items, focus next\n setFocusDescendant(\n (listRef.current?.querySelectorAll(uadConfig.selector)[idx + 1] as HTMLElement) ||\n null\n );\n }\n }\n onRemove?.(selectionId, idx);\n inputRef.current?.focus();\n },\n [selected, onRemove, onSelectedBlur, uadConfig]\n );\n\n useEffect(() => {\n // Maintain active item & prev. val only as it changes.\n if (activeDescendant?.id && activeDescendant.id !== activeItemId) {\n setActiveItemId(activeDescendant.id);\n }\n }, [activeDescendant]);\n\n const onListArrowKeyDown = useCallback(\n (e: KeyboardEvent<HTMLUListElement>) => {\n // Tab (forward) from within the list: move focus to the input\n if (e.key === 'Tab' && !e.shiftKey) {\n e.preventDefault();\n inputRef.current?.focus();\n return;\n }\n\n // Shift+Tab from within the list: exit the combobox entirely\n if (e.key === 'Tab' && e.shiftKey) {\n const focusables = Array.from(listRef.current?.querySelectorAll('a, button') ?? []);\n const elementsToRestore = inputRef.current\n ? [...focusables, inputRef.current]\n : focusables;\n const previousTabIndexes = elementsToRestore.map(el => ({\n el,\n tabindex: el.getAttribute('tabindex')\n }));\n elementsToRestore.forEach(el => el.setAttribute('tabindex', '-1'));\n requestAnimationFrame(() => {\n previousTabIndexes.forEach(({ el, tabindex }) => {\n if (tabindex === null) {\n el.removeAttribute('tabindex');\n } else {\n el.setAttribute('tabindex', tabindex);\n }\n });\n });\n return;\n }\n\n if (e.key !== `Arrow${cap(start)}` && e.key !== `Arrow${cap(end)}`) return;\n\n const items = Array.from(\n listRef.current?.querySelectorAll<HTMLLIElement>(uadConfig.selector) ?? []\n );\n const currentIndex = items.findIndex(\n item => item === getActiveElement() || item.contains(getActiveElement())\n );\n if (currentIndex === -1) return;\n\n e.preventDefault();\n e.stopPropagation();\n\n if (e.key === `Arrow${cap(start)}` && currentIndex > 0) {\n const prev = items[currentIndex - 1];\n const prevLink = prev.querySelector('a');\n const focusTarget = isInstance(prevLink, HTMLElement) ? prevLink : prev;\n focusTarget.focus();\n } else if (e.key === `Arrow${cap(end)}`) {\n if (currentIndex < items.length - 1) {\n const next = items[currentIndex + 1];\n const nextLink = next.querySelector('a');\n const focusTarget = isInstance(nextLink, HTMLElement) ? nextLink : next;\n focusTarget.focus();\n } else {\n inputRef.current?.focus();\n }\n }\n },\n [start, end, uadConfig.selector]\n );\n\n const onInputKeyDown = useCallback(\n (e: KeyboardEvent<HTMLInputElement>) => {\n // Shift+Tab: Focus the last selected item's link\n if (e.key === 'Tab' && e.shiftKey && selected.length) {\n const items = Array.from(\n listRef.current?.querySelectorAll<HTMLLIElement>(uadConfig.selector) ?? []\n );\n const lastItem = items[items.length - 1];\n const link = lastItem?.querySelector('a');\n\n if (isInstance(link, HTMLElement)) {\n e.preventDefault();\n e.stopPropagation();\n link.focus();\n return;\n }\n }\n\n if (\n selected.length &&\n inputRef.current?.selectionStart === 0 &&\n inputRef.current?.selectionEnd === 0\n ) {\n const lastIndex = selected.length - 1;\n if (pauseDescendantEvaluation && e.key === `Arrow${cap(start)}`) {\n setFocusDescendant(\n (listRef.current?.querySelectorAll(uadConfig.selector)[lastIndex] as HTMLElement) ||\n null\n );\n onSelectedFocus?.();\n }\n\n const lastSelectableId = listRef.current?.querySelectorAll(uadConfig.selector)[lastIndex]\n ?.id;\n const onLastItem = activeItemId === lastSelectableId;\n\n if (\n !pauseDescendantEvaluation &&\n ((onLastItem && e.key === `Arrow${cap(end)}`) || e.key === 'ArrowDown')\n ) {\n onSelectedBlur?.();\n }\n\n if (['Backspace', 'Delete'].includes(e.key) && !(readOnly || disabled)) {\n handleSelectedRemoval(selected[lastIndex].id, lastIndex);\n }\n }\n onKeyDown?.(e);\n },\n [\n pauseDescendantEvaluation,\n activeItemId,\n onKeyDown,\n handleSelectedRemoval,\n selected,\n readOnly,\n disabled,\n start,\n uadConfig.selector,\n onSelectedFocus,\n onSelectedBlur\n ]\n );\n\n const ariaDescribedBy = useMemo(() => {\n return onChange\n ? `${id}-inputDescription ${id}-searchDescription`\n : `${id}-inputDescription`;\n }, [id]);\n\n const ariaControlsValue = useMemo(() => {\n if (!pauseDescendantEvaluation) {\n return selected.length > 0 ? id : undefined;\n }\n return ariaControls;\n }, [pauseDescendantEvaluation, selected.length]);\n\n return (\n <Flex\n as={StyledMultiSelectInput}\n forwardedAs={StyledFormControl}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n container={{ alignItems: 'center', justify: 'between' }}\n readOnly={readOnly}\n disabled={disabled}\n status={status}\n >\n <StyledInputWrapper\n container={{ alignContent: 'center', wrap: 'wrap', rowGap: 0.5, colGap: 0.25, pad: 0.25 }}\n item={{ grow: 1 }}\n onClick={(e: MouseEvent<HTMLDivElement>) => {\n // Ignore clicks on selection items\n if (\n isInstance(e.target, HTMLElement) &&\n !isInstance(e.target, HTMLInputElement) &&\n !e.currentTarget.contains(e.target.closest('li'))\n ) {\n e.stopPropagation();\n inputRef.current?.focus();\n inputRef.current?.click();\n }\n }}\n >\n {loading && (\n <Progress\n placement='local'\n aria-label={t('combobox_loading_selected_items')}\n liveConfig={{\n contextualLabel: t('combobox_loading_selected_items')\n }}\n />\n )}\n {selected.length > 0 && (\n // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n <ul\n ref={listRef}\n id={id}\n aria-label={t('selected_items')}\n onKeyDown={onListArrowKeyDown}\n >\n {selected.map((element, idx) => {\n return (\n <Selectable\n as='li'\n key={element.id}\n id={element.id.toString()}\n status={status}\n contextualLabel={element.text}\n onRemove={\n !readOnly && !disabled\n ? () => {\n handleSelectedRemoval(element.id, idx);\n }\n : undefined\n }\n tabIndex={-1}\n aria-label={`${t('remove')} ${element.text}`}\n aria-describedby={ariaDescribedBy}\n >\n {element.primary ?? element.text}\n </Selectable>\n );\n })}\n </ul>\n )}\n <Flex\n item={{ grow: 1 }}\n as='input'\n size={1}\n ref={inputRef}\n value={value}\n // no-op avoids react uncontrolled warning\n onChange={onChange || (() => {})}\n onKeyDown={onInputKeyDown}\n readOnly={readOnly || !onChange}\n disabled={disabled}\n placeholder={selected?.length ? undefined : placeholder}\n autoComplete='_off'\n autoFocus={autoFocus}\n aria-controls={ariaControlsValue}\n aria-required={!!required}\n {...restProps}\n />\n </StyledInputWrapper>\n {actions}\n <VisuallyHiddenText id={`${id}-inputDescription`}>\n {`${t('combobox_open_close')} `}\n </VisuallyHiddenText>\n <VisuallyHiddenText id={`${id}-searchDescription`}>\n {t('combobox_search_instructions')}\n </VisuallyHiddenText>\n </Flex>\n );\n }\n);\n\nexport default MultiSelectInput;\n"]}
@@ -5,6 +5,8 @@ import type { Selected } from '../ComboBox.types';
5
5
  export interface MultiSelectInputProps extends BaseProps {
6
6
  /** List of items to be represented as pills. */
7
7
  selected?: Selected[];
8
+ /** Show a Progress indicator. */
9
+ loading?: boolean;
8
10
  /** Input value */
9
11
  value?: string;
10
12
  /** Callback fired when the list value is selected irrespective of the input value changes. */
@@ -1 +1 @@
1
- {"version":3,"file":"MultiSelectInput.types.d.ts","sourceRoot":"","sources":["../../../../src/components/ComboBox/MultiSelectInput/MultiSelectInput.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEnE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAChD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAC1D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAElD,MAAM,WAAW,qBAAsB,SAAQ,SAAS;IACtD,gDAAgD;IAChD,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC;IACtB,kBAAkB;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8FAA8F;IAC9F,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,yEAAyE;IACzE,KAAK,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,wDAAwD;IACxD,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACtD,yDAAyD;IACzD,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACzD,6DAA6D;IAC7D,mBAAmB,CAAC,EAAE,gBAAgB,CAAC,qBAAqB,CAAC,CAAC;IAC9D,qFAAqF;IACrF,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,0CAA0C;IAC1C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,+CAA+C;IAC/C,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,iDAAiD;IACjD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oDAAoD;IACpD,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,6CAA6C;IAC7C,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,4CAA4C;IAC5C,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,wEAAwE;IACxE,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B"}
1
+ {"version":3,"file":"MultiSelectInput.types.d.ts","sourceRoot":"","sources":["../../../../src/components/ComboBox/MultiSelectInput/MultiSelectInput.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEnE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAChD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAC1D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAElD,MAAM,WAAW,qBAAsB,SAAQ,SAAS;IACtD,gDAAgD;IAChD,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC;IACtB,iCAAiC;IACjC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kBAAkB;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8FAA8F;IAC9F,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,yEAAyE;IACzE,KAAK,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,wDAAwD;IACxD,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACtD,yDAAyD;IACzD,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACzD,6DAA6D;IAC7D,mBAAmB,CAAC,EAAE,gBAAgB,CAAC,qBAAqB,CAAC,CAAC;IAC9D,qFAAqF;IACrF,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,0CAA0C;IAC1C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,+CAA+C;IAC/C,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,iDAAiD;IACjD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oDAAoD;IACpD,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,6CAA6C;IAC7C,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,4CAA4C;IAC5C,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,wEAAwE;IACxE,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B"}
@@ -1 +1 @@
1
- {"version":3,"file":"MultiSelectInput.types.js","sourceRoot":"","sources":["../../../../src/components/ComboBox/MultiSelectInput/MultiSelectInput.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ChangeEvent, KeyboardEvent, ReactNode } from 'react';\n\nimport type { BaseProps } from '../../../types';\nimport type { FormControlProps } from '../../FormControl';\nimport type { Selected } from '../ComboBox.types';\n\nexport interface MultiSelectInputProps extends BaseProps {\n /** List of items to be represented as pills. */\n selected?: Selected[];\n /** Input value */\n value?: string;\n /** Callback fired when the list value is selected irrespective of the input value changes. */\n onRemove?: (id: string, index: number) => void;\n /** Callback invoked when user accepts custom value by pressing enter. */\n onNew?: (text: string) => void;\n /** Callback fired when internal input value changes. */\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n /** Callback fired on every key stroke on input field. */\n onKeyDown?: (e: KeyboardEvent<HTMLInputElement>) => void;\n /** Callback fired when AI suggestion is accepted/rejected */\n onResolveSuggestion?: FormControlProps['onResolveSuggestion'];\n /** Makes the input non editable and non clickable. The browser defaults to false. */\n readOnly?: FormControlProps['readOnly'];\n /** Disable the control. The browser defaults to false. */\n disabled?: FormControlProps['disabled'];\n /** Indicate if the field is required. The browser defaults to false. */\n required?: FormControlProps['required'];\n /** Set visual state based on a validation state. */\n status?: FormControlProps['status'];\n /** Placeholder visible on empty input. */\n placeholder?: string;\n /** Additional actions related to the input. */\n actions?: ReactNode;\n /** Automatically focuses the input on render. */\n autoFocus?: boolean;\n /** Pause evaluation of selected item descendants */\n pauseDescendantEvaluation?: boolean;\n /** Callback on selected item pseudo focus */\n onSelectedFocus?: () => void;\n /** Callback on selected item pseudo blur */\n onSelectedBlur?: () => void;\n /** ID of pseudo-focus container controlled by input (ex: list, menu) */\n 'aria-controls'?: string;\n}\n"]}
1
+ {"version":3,"file":"MultiSelectInput.types.js","sourceRoot":"","sources":["../../../../src/components/ComboBox/MultiSelectInput/MultiSelectInput.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ChangeEvent, KeyboardEvent, ReactNode } from 'react';\n\nimport type { BaseProps } from '../../../types';\nimport type { FormControlProps } from '../../FormControl';\nimport type { Selected } from '../ComboBox.types';\n\nexport interface MultiSelectInputProps extends BaseProps {\n /** List of items to be represented as pills. */\n selected?: Selected[];\n /** Show a Progress indicator. */\n loading?: boolean;\n /** Input value */\n value?: string;\n /** Callback fired when the list value is selected irrespective of the input value changes. */\n onRemove?: (id: string, index: number) => void;\n /** Callback invoked when user accepts custom value by pressing enter. */\n onNew?: (text: string) => void;\n /** Callback fired when internal input value changes. */\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n /** Callback fired on every key stroke on input field. */\n onKeyDown?: (e: KeyboardEvent<HTMLInputElement>) => void;\n /** Callback fired when AI suggestion is accepted/rejected */\n onResolveSuggestion?: FormControlProps['onResolveSuggestion'];\n /** Makes the input non editable and non clickable. The browser defaults to false. */\n readOnly?: FormControlProps['readOnly'];\n /** Disable the control. The browser defaults to false. */\n disabled?: FormControlProps['disabled'];\n /** Indicate if the field is required. The browser defaults to false. */\n required?: FormControlProps['required'];\n /** Set visual state based on a validation state. */\n status?: FormControlProps['status'];\n /** Placeholder visible on empty input. */\n placeholder?: string;\n /** Additional actions related to the input. */\n actions?: ReactNode;\n /** Automatically focuses the input on render. */\n autoFocus?: boolean;\n /** Pause evaluation of selected item descendants */\n pauseDescendantEvaluation?: boolean;\n /** Callback on selected item pseudo focus */\n onSelectedFocus?: () => void;\n /** Callback on selected item pseudo blur */\n onSelectedBlur?: () => void;\n /** ID of pseudo-focus container controlled by input (ex: list, menu) */\n 'aria-controls'?: string;\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"SingleSelectInput.d.ts","sourceRoot":"","sources":["../../../../src/components/ComboBox/SingleSelectInput/SingleSelectInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAoC,MAAM,OAAO,CAAC;AAQjF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAInD,OAAO,KAAK,sBAAsB,MAAM,2BAA2B,CAAC;AAkCpE,eAAO,MAAM,uBAAuB;;mBAMnC,CAAC;AAEF,QAAA,MAAM,iBAAiB,EAAE,iBAAiB,CAAC,sBAAsB,GAAG,YAAY,CAmF/E,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
1
+ {"version":3,"file":"SingleSelectInput.d.ts","sourceRoot":"","sources":["../../../../src/components/ComboBox/SingleSelectInput/SingleSelectInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAoC,MAAM,OAAO,CAAC;AAQjF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAKnD,OAAO,KAAK,sBAAsB,MAAM,2BAA2B,CAAC;AAkCpE,eAAO,MAAM,uBAAuB;;mBAoBlC,CAAC;AAIH,QAAA,MAAM,iBAAiB,EAAE,iBAAiB,CAAC,sBAAsB,GAAG,YAAY,CA8F/E,CAAC;AAEF,eAAe,iBAAiB,CAAC"}