@laerdal/life-react-components 1.10.3-dev.2 → 1.10.3-dev.4

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 (221) hide show
  1. package/dist/Accordion/AccordionItem.cjs +22 -6
  2. package/dist/Accordion/AccordionItem.cjs.map +1 -1
  3. package/dist/Accordion/AccordionItem.js +21 -6
  4. package/dist/Accordion/AccordionItem.js.map +1 -1
  5. package/dist/Accordion/AccordionMenu.cjs +40 -21
  6. package/dist/Accordion/AccordionMenu.cjs.map +1 -1
  7. package/dist/Accordion/AccordionMenu.d.ts +2 -2
  8. package/dist/Accordion/AccordionMenu.js +39 -21
  9. package/dist/Accordion/AccordionMenu.js.map +1 -1
  10. package/dist/Accordion/ContentAccordion.cjs +56 -29
  11. package/dist/Accordion/ContentAccordion.cjs.map +1 -1
  12. package/dist/Accordion/ContentAccordion.d.ts +2 -2
  13. package/dist/Accordion/ContentAccordion.js +54 -29
  14. package/dist/Accordion/ContentAccordion.js.map +1 -1
  15. package/dist/Banners/Banner.cjs +64 -46
  16. package/dist/Banners/Banner.cjs.map +1 -1
  17. package/dist/Banners/Banner.d.ts +3 -2
  18. package/dist/Banners/Banner.js +63 -42
  19. package/dist/Banners/Banner.js.map +1 -1
  20. package/dist/Banners/OverviewBanner.cjs +14 -3
  21. package/dist/Banners/OverviewBanner.cjs.map +1 -1
  22. package/dist/Banners/OverviewBanner.d.ts +3 -2
  23. package/dist/Banners/OverviewBanner.js +12 -3
  24. package/dist/Banners/OverviewBanner.js.map +1 -1
  25. package/dist/Breadcrumb/Breadcrumb.cjs +16 -4
  26. package/dist/Breadcrumb/Breadcrumb.cjs.map +1 -1
  27. package/dist/Breadcrumb/Breadcrumb.d.ts +1 -1
  28. package/dist/Breadcrumb/Breadcrumb.js +15 -4
  29. package/dist/Breadcrumb/Breadcrumb.js.map +1 -1
  30. package/dist/Button/Iconbutton.cjs +20 -14
  31. package/dist/Button/Iconbutton.cjs.map +1 -1
  32. package/dist/Button/Iconbutton.d.ts +1 -4
  33. package/dist/Button/Iconbutton.js +17 -14
  34. package/dist/Button/Iconbutton.js.map +1 -1
  35. package/dist/Card/HorizontalCard/HorizontalCard.cjs +8 -2
  36. package/dist/Card/HorizontalCard/HorizontalCard.cjs.map +1 -1
  37. package/dist/Card/HorizontalCard/HorizontalCard.js +6 -2
  38. package/dist/Card/HorizontalCard/HorizontalCard.js.map +1 -1
  39. package/dist/Card/HorizontalCard/HorizontalCardActions.cjs +2 -8
  40. package/dist/Card/HorizontalCard/HorizontalCardActions.cjs.map +1 -1
  41. package/dist/Card/HorizontalCard/HorizontalCardActions.js +2 -2
  42. package/dist/Card/HorizontalCard/HorizontalCardActions.js.map +1 -1
  43. package/dist/Card/HorizontalCard/types.d.ts +1 -1
  44. package/dist/Card/VerticalCard/Card.cjs +12 -5
  45. package/dist/Card/VerticalCard/Card.cjs.map +1 -1
  46. package/dist/Card/VerticalCard/Card.d.ts +1 -1
  47. package/dist/Card/VerticalCard/Card.js +10 -5
  48. package/dist/Card/VerticalCard/Card.js.map +1 -1
  49. package/dist/Chips/ActionChip.cjs +18 -14
  50. package/dist/Chips/ActionChip.cjs.map +1 -1
  51. package/dist/Chips/ActionChip.js +16 -5
  52. package/dist/Chips/ActionChip.js.map +1 -1
  53. package/dist/Chips/ChipTypes.d.ts +5 -3
  54. package/dist/Chips/ChoiceChips.cjs +24 -16
  55. package/dist/Chips/ChoiceChips.cjs.map +1 -1
  56. package/dist/Chips/ChoiceChips.js +22 -9
  57. package/dist/Chips/ChoiceChips.js.map +1 -1
  58. package/dist/Chips/FilterChip.cjs +18 -14
  59. package/dist/Chips/FilterChip.cjs.map +1 -1
  60. package/dist/Chips/FilterChip.js +16 -5
  61. package/dist/Chips/FilterChip.js.map +1 -1
  62. package/dist/Chips/InputChip.cjs +18 -14
  63. package/dist/Chips/InputChip.cjs.map +1 -1
  64. package/dist/Chips/InputChip.js +17 -5
  65. package/dist/Chips/InputChip.js.map +1 -1
  66. package/dist/ChipsInput/ChipDropdownInput.cjs +14 -7
  67. package/dist/ChipsInput/ChipDropdownInput.cjs.map +1 -1
  68. package/dist/ChipsInput/ChipDropdownInput.d.ts +1 -1
  69. package/dist/ChipsInput/ChipDropdownInput.js +12 -6
  70. package/dist/ChipsInput/ChipDropdownInput.js.map +1 -1
  71. package/dist/ChipsInput/ChipInput.cjs +16 -12
  72. package/dist/ChipsInput/ChipInput.cjs.map +1 -1
  73. package/dist/ChipsInput/ChipInput.d.ts +1 -1
  74. package/dist/ChipsInput/ChipInput.js +14 -7
  75. package/dist/ChipsInput/ChipInput.js.map +1 -1
  76. package/dist/ChipsInput/ChipInputField.cjs +22 -4
  77. package/dist/ChipsInput/ChipInputField.cjs.map +1 -1
  78. package/dist/ChipsInput/ChipInputField.d.ts +1 -1
  79. package/dist/ChipsInput/ChipInputField.js +18 -4
  80. package/dist/ChipsInput/ChipInputField.js.map +1 -1
  81. package/dist/ChipsInput/ChipInputTypes.d.ts +2 -1
  82. package/dist/Dropdown/BasicDropdown.cjs +88 -64
  83. package/dist/Dropdown/BasicDropdown.cjs.map +1 -1
  84. package/dist/Dropdown/BasicDropdown.d.ts +13 -8
  85. package/dist/Dropdown/BasicDropdown.js +87 -65
  86. package/dist/Dropdown/BasicDropdown.js.map +1 -1
  87. package/dist/Dropdown/DropdownFilter.cjs +30 -14
  88. package/dist/Dropdown/DropdownFilter.cjs.map +1 -1
  89. package/dist/Dropdown/DropdownFilter.d.ts +3 -3
  90. package/dist/Dropdown/DropdownFilter.js +26 -13
  91. package/dist/Dropdown/DropdownFilter.js.map +1 -1
  92. package/dist/Footer/SiteFooter.cjs +16 -4
  93. package/dist/Footer/SiteFooter.cjs.map +1 -1
  94. package/dist/Footer/SiteFooter.d.ts +6 -2
  95. package/dist/Footer/SiteFooter.js +14 -4
  96. package/dist/Footer/SiteFooter.js.map +1 -1
  97. package/dist/GlobalNavigationBar/desktop/DesktopActions.cjs +2 -8
  98. package/dist/GlobalNavigationBar/desktop/DesktopActions.cjs.map +1 -1
  99. package/dist/GlobalNavigationBar/desktop/DesktopActions.js +2 -2
  100. package/dist/GlobalNavigationBar/desktop/DesktopActions.js.map +1 -1
  101. package/dist/Image/ImageWithFallbacks.cjs +10 -2
  102. package/dist/Image/ImageWithFallbacks.cjs.map +1 -1
  103. package/dist/Image/ImageWithFallbacks.d.ts +1 -1
  104. package/dist/Image/ImageWithFallbacks.js +9 -2
  105. package/dist/Image/ImageWithFallbacks.js.map +1 -1
  106. package/dist/InputFields/Checkbox.cjs +16 -4
  107. package/dist/InputFields/Checkbox.cjs.map +1 -1
  108. package/dist/InputFields/Checkbox.d.ts +1 -1
  109. package/dist/InputFields/Checkbox.js +13 -4
  110. package/dist/InputFields/Checkbox.js.map +1 -1
  111. package/dist/InputFields/DatepickerField.cjs +44 -38
  112. package/dist/InputFields/DatepickerField.cjs.map +1 -1
  113. package/dist/InputFields/DatepickerField.d.ts +17 -20
  114. package/dist/InputFields/DatepickerField.js +33 -20
  115. package/dist/InputFields/DatepickerField.js.map +1 -1
  116. package/dist/InputFields/NumberField.cjs +63 -52
  117. package/dist/InputFields/NumberField.cjs.map +1 -1
  118. package/dist/InputFields/NumberField.d.ts +14 -19
  119. package/dist/InputFields/NumberField.js +60 -53
  120. package/dist/InputFields/NumberField.js.map +1 -1
  121. package/dist/InputFields/PasswordField.cjs +25 -8
  122. package/dist/InputFields/PasswordField.cjs.map +1 -1
  123. package/dist/InputFields/PasswordField.d.ts +14 -14
  124. package/dist/InputFields/PasswordField.js +22 -9
  125. package/dist/InputFields/PasswordField.js.map +1 -1
  126. package/dist/InputFields/RadioButton.cjs +17 -5
  127. package/dist/InputFields/RadioButton.cjs.map +1 -1
  128. package/dist/InputFields/RadioButton.d.ts +2 -2
  129. package/dist/InputFields/RadioButton.js +14 -5
  130. package/dist/InputFields/RadioButton.js.map +1 -1
  131. package/dist/InputFields/TextField.cjs +23 -8
  132. package/dist/InputFields/TextField.cjs.map +1 -1
  133. package/dist/InputFields/TextField.d.ts +20 -20
  134. package/dist/InputFields/TextField.js +22 -9
  135. package/dist/InputFields/TextField.js.map +1 -1
  136. package/dist/InputFields/Textarea.cjs +20 -7
  137. package/dist/InputFields/Textarea.cjs.map +1 -1
  138. package/dist/InputFields/Textarea.d.ts +16 -2
  139. package/dist/InputFields/Textarea.js +18 -8
  140. package/dist/InputFields/Textarea.js.map +1 -1
  141. package/dist/InputFields/components/SearchBarInput.cjs +4 -1
  142. package/dist/InputFields/components/SearchBarInput.cjs.map +1 -1
  143. package/dist/InputFields/components/SearchBarInput.js +4 -1
  144. package/dist/InputFields/components/SearchBarInput.js.map +1 -1
  145. package/dist/InputFields/index.cjs +26 -0
  146. package/dist/InputFields/index.cjs.map +1 -1
  147. package/dist/InputFields/index.d.ts +1 -0
  148. package/dist/InputFields/index.js +1 -0
  149. package/dist/InputFields/index.js.map +1 -1
  150. package/dist/InputFields/types.d.ts +1 -1
  151. package/dist/LinearProgress/LinearProgress.cjs +17 -4
  152. package/dist/LinearProgress/LinearProgress.cjs.map +1 -1
  153. package/dist/LinearProgress/LinearProgress.d.ts +1 -1
  154. package/dist/LinearProgress/LinearProgress.js +14 -4
  155. package/dist/LinearProgress/LinearProgress.js.map +1 -1
  156. package/dist/List/ListRow.cjs +15 -8
  157. package/dist/List/ListRow.cjs.map +1 -1
  158. package/dist/List/ListRow.d.ts +1 -1
  159. package/dist/List/ListRow.js +13 -8
  160. package/dist/List/ListRow.js.map +1 -1
  161. package/dist/MenuItem/MenuItem.cjs +16 -6
  162. package/dist/MenuItem/MenuItem.cjs.map +1 -1
  163. package/dist/MenuItem/MenuItem.d.ts +1 -3
  164. package/dist/MenuItem/MenuItem.js +14 -6
  165. package/dist/MenuItem/MenuItem.js.map +1 -1
  166. package/dist/ProfileButton/ProfileButton.cjs +17 -8
  167. package/dist/ProfileButton/ProfileButton.cjs.map +1 -1
  168. package/dist/ProfileButton/ProfileButton.d.ts +8 -12
  169. package/dist/ProfileButton/ProfileButton.js +14 -8
  170. package/dist/ProfileButton/ProfileButton.js.map +1 -1
  171. package/dist/QuizButton/QuizButton.cjs +17 -6
  172. package/dist/QuizButton/QuizButton.cjs.map +1 -1
  173. package/dist/QuizButton/QuizButton.d.ts +1 -2
  174. package/dist/QuizButton/QuizButton.js +15 -6
  175. package/dist/QuizButton/QuizButton.js.map +1 -1
  176. package/dist/SegmentControl/SegmentControl.cjs +28 -8
  177. package/dist/SegmentControl/SegmentControl.cjs.map +1 -1
  178. package/dist/SegmentControl/SegmentControl.d.ts +2 -2
  179. package/dist/SegmentControl/SegmentControl.js +26 -8
  180. package/dist/SegmentControl/SegmentControl.js.map +1 -1
  181. package/dist/SideMenu/SideMenu.cjs +11 -4
  182. package/dist/SideMenu/SideMenu.cjs.map +1 -1
  183. package/dist/SideMenu/SideMenu.js +10 -4
  184. package/dist/SideMenu/SideMenu.js.map +1 -1
  185. package/dist/SideMenu/types.d.ts +1 -1
  186. package/dist/Table/TableFooter.cjs +10 -7
  187. package/dist/Table/TableFooter.cjs.map +1 -1
  188. package/dist/Table/TableFooter.js +10 -7
  189. package/dist/Table/TableFooter.js.map +1 -1
  190. package/dist/Tabs/HorizontalTabs.cjs +32 -13
  191. package/dist/Tabs/HorizontalTabs.cjs.map +1 -1
  192. package/dist/Tabs/HorizontalTabs.d.ts +7 -4
  193. package/dist/Tabs/HorizontalTabs.js +30 -13
  194. package/dist/Tabs/HorizontalTabs.js.map +1 -1
  195. package/dist/Tag/Tag.cjs +16 -4
  196. package/dist/Tag/Tag.cjs.map +1 -1
  197. package/dist/Tag/Tag.d.ts +1 -1
  198. package/dist/Tag/Tag.js +14 -4
  199. package/dist/Tag/Tag.js.map +1 -1
  200. package/dist/Tile/Tile.cjs +11 -4
  201. package/dist/Tile/Tile.cjs.map +1 -1
  202. package/dist/Tile/Tile.js +10 -4
  203. package/dist/Tile/Tile.js.map +1 -1
  204. package/dist/Tile/TileTypes.d.ts +1 -1
  205. package/dist/Toasters/Toast.cjs.map +1 -1
  206. package/dist/Toasters/Toast.js.map +1 -1
  207. package/dist/Toggles/ToggleButton.cjs +36 -17
  208. package/dist/Toggles/ToggleButton.cjs.map +1 -1
  209. package/dist/Toggles/ToggleButton.d.ts +1 -2
  210. package/dist/Toggles/ToggleButton.js +33 -17
  211. package/dist/Toggles/ToggleButton.js.map +1 -1
  212. package/dist/Toggles/ToggleSwitch.cjs +27 -17
  213. package/dist/Toggles/ToggleSwitch.cjs.map +1 -1
  214. package/dist/Toggles/ToggleSwitch.d.ts +5 -1
  215. package/dist/Toggles/ToggleSwitch.js +24 -12
  216. package/dist/Toggles/ToggleSwitch.js.map +1 -1
  217. package/dist/Toggles/TogglerTypes.d.ts +1 -1
  218. package/dist/common/FocusVisible.cjs.map +1 -1
  219. package/dist/common/FocusVisible.d.ts +1 -1
  220. package/dist/common/FocusVisible.js.map +1 -1
  221. package/package.json +1 -1
@@ -17,5 +17,5 @@ interface ChipDropdownInputProps extends ChipInputProps {
17
17
  disableSorting?: boolean;
18
18
  disableFiltering?: boolean;
19
19
  }
20
- export declare const ChipDropdownInput: React.FunctionComponent<ChipDropdownInputProps>;
20
+ export declare const ChipDropdownInput: React.ForwardRefExoticComponent<ChipDropdownInputProps & React.RefAttributes<HTMLInputElement | undefined>>;
21
21
  export {};
@@ -1,8 +1,10 @@
1
1
  import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
2
2
  import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
3
3
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
4
+ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
4
5
  import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
5
6
  import _pt from "prop-types";
7
+ var _excluded = ["list", "onInputChange", "disableSorting", "messageOnNoResults", "values", "inputId", "variants", "placeholder", "validationMessage", "onValueChange", "suggestion", "loading", "maxSelectedItems", "multiLine", "size", "icon", "disableFiltering", "disabled", "altPlaceholder", "required"];
6
8
 
7
9
  var _templateObject;
8
10
 
@@ -32,7 +34,7 @@ import { Z_INDEXES } from '../styles';
32
34
  import { jsx as _jsx } from "react/jsx-runtime";
33
35
  import { jsxs as _jsxs } from "react/jsx-runtime";
34
36
  var Wrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n position: relative;\n display: inline-block;\n width: 100%;\n\n ", " {\n position: relative;\n\n &:focus, &.focus-visible-within {\n z-index: ", " !important;\n }\n }\n"])), ChipInputContainer, Z_INDEXES.dropdown + 1);
35
- export var ChipDropdownInput = function ChipDropdownInput(_ref) {
37
+ export var ChipDropdownInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
36
38
  var list = _ref.list,
37
39
  onInputChange = _ref.onInputChange,
38
40
  disableSorting = _ref.disableSorting,
@@ -54,7 +56,8 @@ export var ChipDropdownInput = function ChipDropdownInput(_ref) {
54
56
  disableFiltering = _ref.disableFiltering,
55
57
  disabled = _ref.disabled,
56
58
  altPlaceholder = _ref.altPlaceholder,
57
- required = _ref.required;
59
+ required = _ref.required,
60
+ rest = _objectWithoutProperties(_ref, _excluded);
58
61
 
59
62
  // Initiate states
60
63
  var _React$useState = React.useState([]),
@@ -107,7 +110,10 @@ export var ChipDropdownInput = function ChipDropdownInput(_ref) {
107
110
  }, [], useFocusOutsideRef(function () {
108
111
  return setDropdownIsOpen(false);
109
112
  }));
110
- var inputRef = React.useRef(null);
113
+ var inputRef = React.useRef();
114
+ React.useImperativeHandle(ref, function () {
115
+ return inputRef.current;
116
+ }, [inputRef]);
111
117
  /**
112
118
  * Sets initial values for the chips.
113
119
  */
@@ -318,7 +324,7 @@ export var ChipDropdownInput = function ChipDropdownInput(_ref) {
318
324
 
319
325
  return /*#__PURE__*/_jsxs(Wrapper, {
320
326
  ref: containerRef,
321
- children: [/*#__PURE__*/_jsx(ChipInputField, {
327
+ children: [/*#__PURE__*/_jsx(ChipInputField, _objectSpread({
322
328
  inputId: inputId,
323
329
  ref: inputRef,
324
330
  items: chips,
@@ -339,7 +345,7 @@ export var ChipDropdownInput = function ChipDropdownInput(_ref) {
339
345
  onActivationChange: function onActivationChange(value) {
340
346
  return setDropdownIsOpen(value);
341
347
  }
342
- }), /*#__PURE__*/_jsx(DropdownContent, {
348
+ }, rest)), /*#__PURE__*/_jsx(DropdownContent, {
343
349
  customizationProps: {
344
350
  action: function action() {},
345
351
  pinTopItem: true,
@@ -362,7 +368,7 @@ export var ChipDropdownInput = function ChipDropdownInput(_ref) {
362
368
  id: "".concat(inputId, "_dropdowncontent")
363
369
  })]
364
370
  });
365
- };
371
+ });
366
372
  ChipDropdownInput.propTypes = {
367
373
  list: _pt.oneOfType([_pt.arrayOf(_pt.shape({
368
374
  secondaryLabel: _pt.string,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/ChipsInput/ChipDropdownInput.tsx"],"names":["React","styled","ChipInputContainer","ChipInputField","Size","States","DropdownContent","SystemIcons","useClickOutsideRef","useFocusOutsideRef","Z_INDEXES","Wrapper","div","dropdown","ChipDropdownInput","list","onInputChange","disableSorting","messageOnNoResults","values","inputId","variants","placeholder","validationMessage","onValueChange","suggestion","loading","maxSelectedItems","multiLine","size","Medium","icon","disableFiltering","disabled","altPlaceholder","required","useState","givenList","setGivenList","chips","setChips","value","setValue","restartFilter","setRestartFilter","filteredList","setFilteredList","dropdownIsOpen","setDropdownIsOpen","dropdownList","setDropdownList","dropdownValue","setDropdownValue","focused","setFocused","containerRef","inputRef","useRef","useEffect","map","a","find","b","label","index","variant","Default","newList","e","options","filter","option","toUpperCase","indexOf","secondaryLabel","sort","push","o","length","handleClickOutside","current","contains","target","document","addEventListener","removeEventListener","x","displayLabel","noteLabel","addChip","newChip","handleInputValueChange","handleValueUpdate","item","focus","handleInputKeyDown","event","key","stopPropagation","handleOnChipRemoved","newChips","splice","chip","action","pinTopItem","itemsType","scrollable","actionLabel","multiSelect","onValueUpdate","items"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\n\n/**\n * Import custom components.\n */\nimport {ChipInputContainer, ChipInputField} from './ChipInputField';\nimport {Size, States} from '../types';\nimport {DropdownContent, DropdownItem} from '../Dropdown';\nimport {SystemIcons} from '../icons';\nimport {ChipInputProps, ChipItem} from './ChipInputTypes';\nimport {useClickOutsideRef, useFocusOutsideRef} from '../common';\nimport {Z_INDEXES} from '../styles';\n\nconst Wrapper = styled.div`\n position: relative;\n display: inline-block;\n width: 100%;\n\n ${ChipInputContainer} {\n position: relative;\n\n &:focus, &.focus-visible-within {\n z-index: ${Z_INDEXES.dropdown + 1} !important;\n }\n }\n`;\n\n\ninterface ListItem extends ChipItem {\n secondaryLabel?: string;\n value: string;\n}\n\ninterface ChipDropdownInputProps extends ChipInputProps {\n list: ListItem[] | string[];\n onInputChange?: (input: string) => void;\n messageOnNoResults?: string;\n suggestion?: ListItem;\n loading?: boolean;\n maxSelectedItems?: number;\n disableSorting?: boolean;\n disableFiltering?: boolean;\n}\n\nexport const ChipDropdownInput: React.FunctionComponent<ChipDropdownInputProps> = ({\n list,\n onInputChange,\n disableSorting,\n messageOnNoResults,\n values,\n inputId,\n variants,\n placeholder,\n validationMessage,\n onValueChange,\n suggestion,\n loading,\n maxSelectedItems,\n multiLine = true,\n size = Size.Medium,\n icon,\n disableFiltering,\n disabled,\n altPlaceholder,\n required\n }: ChipDropdownInputProps) => {\n // Initiate states\n const [givenList, setGivenList] = React.useState<ListItem[]>([]);\n const [chips, setChips] = React.useState<ListItem[]>([]);\n\n const [value, setValue] = React.useState<string>('');\n const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n const [filteredList, setFilteredList] = React.useState<ListItem[]>();\n\n const [dropdownIsOpen, setDropdownIsOpen] = React.useState<boolean>(false);\n const [dropdownList, setDropdownList] = React.useState<DropdownItem[]>([]);\n const [dropdownValue, setDropdownValue] = React.useState<string>('');\n\n const [focused, setFocused] = React.useState<number | null>(null);\n\n const containerRef = useClickOutsideRef(() => setDropdownIsOpen(false), [], useFocusOutsideRef(() => setDropdownIsOpen(false)));\n const inputRef = React.useRef<HTMLInputElement>(null);\n\n\n /**\n * Sets initial values for the chips.\n */\n React.useEffect(() => {\n\n const list =\n values.map((a) => chips.find(b => b.value === a) || givenList.find(b => b.value === a) || {\n label: a,\n value: a,\n icon: icon\n })\n .map((a, index) => ({...a, variant: a.variant || (variants && variants[index]) || States.Default}))\n .map((a, index) => ({...a, icon: a.icon || icon}));\n\n setChips(list);\n }, [values, variants, icon, givenList]);\n\n /**\n * Convert string[] to List[] if necessary\n */\n React.useEffect(() => {\n if (typeof list[0] === 'string') {\n const newList: ListItem[] = (list as string[]).map((e: string) => ({label: e, value: e}));\n setGivenList(newList);\n } else {\n setGivenList(list as ListItem[]);\n }\n }, [list]);\n\n /**\n * filter and sort list if remoteOperations is false\n * */\n React.useEffect(() => {\n let options = [...givenList];\n if (!disableFiltering) {\n if (!restartFilter && value !== '') {\n options = options.filter((option) => option.label.toUpperCase().indexOf(value.toUpperCase()) !== -1 ||\n (option.secondaryLabel && option.secondaryLabel?.toUpperCase().indexOf(value.toUpperCase()) !== -1));\n }\n }\n\n if (!disableSorting) {\n options = options.sort();\n }\n\n suggestion && options.push(suggestion);\n\n options = options.filter((o) => !chips.find(a => a.value === o.value));\n setFilteredList(options);\n }, [value, givenList, chips, disableFiltering, disableSorting]);\n\n /**\n * if there is only one active item in dropdown mark it as focused\n * */\n React.useEffect(() => {\n if (dropdownIsOpen && !!value && dropdownList?.filter(a => !a.disabled).length === 1) {\n setDropdownValue(dropdownList.find(a => !a.disabled)!.value);\n } else {\n setDropdownValue('');\n }\n }, [dropdownList, dropdownIsOpen, value]);\n\n const handleClickOutside = (e: any) => {\n if (!containerRef.current?.contains(e.target)) {\n if (dropdownIsOpen) {\n setDropdownIsOpen(false);\n if (!givenList.find((e) => e.value === value)) {\n setValue('');\n }\n }\n }\n };\n\n /**\n * register click outside event listener\n * */\n React.useEffect(() => {\n document.addEventListener('click', handleClickOutside);\n return () => {\n document.removeEventListener('click', handleClickOutside);\n };\n });\n\n /**\n * update dropdown items when filtered list changes\n * */\n React.useEffect(() => {\n setDropdownList(filteredList?.map(x => ({\n value: x.value,\n displayLabel: x.label,\n noteLabel: x.secondaryLabel,\n icon: (x.icon ?? icon) && SystemIcons[(x.icon || icon)!]({}),\n disabled: x.disabled,\n })) ?? []);\n }, [filteredList]);\n\n const addChip = (newChip: ListItem) => {\n const newList = [...chips, newChip];\n // Let's add the chip\n setChips(newList);\n onValueChange(newList.map(a => a.value));\n\n setValue('');\n };\n\n const handleInputValueChange = (value: string) => {\n setValue(value);\n setRestartFilter(false);\n setDropdownIsOpen(true);\n onInputChange && onInputChange(value);\n }\n\n /**\n * Add chip from dropdown\n * */\n const handleValueUpdate = (values: string[]) => {\n const item = filteredList?.find(a => a.value === values[0]);\n item && addChip(item);\n setRestartFilter(true);\n inputRef?.current?.focus();\n }\n\n /**\n * Adds a chip to the chip list.\n * @param event - Event handler from the key down event.\n */\n const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n // Let's trigger only on enter, comma and space key press\n if ((event.key === 'Enter' || event.key === ' ') && value) {\n if (dropdownList?.filter(a => !a.disabled).length === 1) {\n handleValueUpdate([dropdownList!.find(a => !a.disabled)!.value]);\n event.stopPropagation();\n }\n }\n\n if ((event.key === 'ArrowDown' || event.key === 'Down' || event.key === 'ArrowUp' || event.key === 'Up') && !!dropdownList?.length) {\n setDropdownIsOpen(true);\n }\n };\n\n /**\n * Removes a specific chip from the chip list.\n * @param index - Index of the chip that needs to be removed.\n */\n const handleOnChipRemoved = (index: number): void => {\n // Let's copy the chips\n const newChips = [...chips];\n\n // Let's delete the chip\n // If necessary, let's replace it with a different chip\n newChips.splice(index, 1);\n\n // Let's update the chip list\n setChips([...newChips]);\n onValueChange(newChips.map((e) => e.value));\n };\n\n return (\n <Wrapper ref={containerRef}>\n <ChipInputField inputId={inputId}\n ref={inputRef}\n items={chips}\n required={required}\n inputValue={value}\n size={size}\n placeholder={placeholder}\n altPlaceholder={altPlaceholder}\n disabled={disabled}\n multiLine={multiLine}\n validationMessage={validationMessage}\n loading={loading}\n onRemoveItem={(chip, index) => handleOnChipRemoved(index)}\n onInputValueChange={handleInputValueChange}\n onInputKeyDown={handleInputKeyDown}\n onActivationChange={(value) => setDropdownIsOpen(value)}/>\n <DropdownContent\n customizationProps={{\n action: () => {\n },\n pinTopItem: true,\n\n itemsType: 'normal',\n scrollable: true,\n actionLabel: '',\n multiSelect: false,\n onValueUpdate: handleValueUpdate,\n items: dropdownList\n }}\n focused={focused}\n setFocused={setFocused}\n selectedValues={[dropdownValue]}\n messageOnNoResults={messageOnNoResults ?? ''}\n setSelectedValues={() => {\n }}\n isOpen={(!maxSelectedItems || (!!maxSelectedItems && chips.length < maxSelectedItems)) && dropdownIsOpen}\n setIsOpen={setDropdownIsOpen}\n filter={''}\n isButton={false}\n id={`${inputId}_dropdowncontent`}/>\n\n </Wrapper>\n );\n};\n"],"file":"ChipDropdownInput.js"}
1
+ {"version":3,"sources":["../../src/ChipsInput/ChipDropdownInput.tsx"],"names":["React","styled","ChipInputContainer","ChipInputField","Size","States","DropdownContent","SystemIcons","useClickOutsideRef","useFocusOutsideRef","Z_INDEXES","Wrapper","div","dropdown","ChipDropdownInput","forwardRef","ref","list","onInputChange","disableSorting","messageOnNoResults","values","inputId","variants","placeholder","validationMessage","onValueChange","suggestion","loading","maxSelectedItems","multiLine","size","Medium","icon","disableFiltering","disabled","altPlaceholder","required","rest","useState","givenList","setGivenList","chips","setChips","value","setValue","restartFilter","setRestartFilter","filteredList","setFilteredList","dropdownIsOpen","setDropdownIsOpen","dropdownList","setDropdownList","dropdownValue","setDropdownValue","focused","setFocused","containerRef","inputRef","useRef","useImperativeHandle","current","useEffect","map","a","find","b","label","index","variant","Default","newList","e","options","filter","option","toUpperCase","indexOf","secondaryLabel","sort","push","o","length","handleClickOutside","contains","target","document","addEventListener","removeEventListener","x","displayLabel","noteLabel","addChip","newChip","handleInputValueChange","handleValueUpdate","item","focus","handleInputKeyDown","event","key","stopPropagation","handleOnChipRemoved","newChips","splice","chip","action","pinTopItem","itemsType","scrollable","actionLabel","multiSelect","onValueUpdate","items"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\n\n/**\n * Import custom components.\n */\nimport {ChipInputContainer, ChipInputField} from './ChipInputField';\nimport {Size, States} from '../types';\nimport {DropdownContent, DropdownItem} from '../Dropdown';\nimport {SystemIcons} from '../icons';\nimport {ChipInputProps, ChipItem} from './ChipInputTypes';\nimport {useClickOutsideRef, useFocusOutsideRef} from '../common';\nimport {Z_INDEXES} from '../styles';\n\nconst Wrapper = styled.div`\n position: relative;\n display: inline-block;\n width: 100%;\n\n ${ChipInputContainer} {\n position: relative;\n\n &:focus, &.focus-visible-within {\n z-index: ${Z_INDEXES.dropdown + 1} !important;\n }\n }\n`;\n\n\ninterface ListItem extends ChipItem {\n secondaryLabel?: string;\n value: string;\n}\n\ninterface ChipDropdownInputProps extends ChipInputProps {\n list: ListItem[] | string[];\n onInputChange?: (input: string) => void;\n messageOnNoResults?: string;\n suggestion?: ListItem;\n loading?: boolean;\n maxSelectedItems?: number;\n disableSorting?: boolean;\n disableFiltering?: boolean;\n}\n\nexport const ChipDropdownInput = React.forwardRef<HTMLInputElement | undefined, ChipDropdownInputProps>(({\n list,\n onInputChange,\n disableSorting,\n messageOnNoResults,\n values,\n inputId,\n variants,\n placeholder,\n validationMessage,\n onValueChange,\n suggestion,\n loading,\n maxSelectedItems,\n multiLine = true,\n size = Size.Medium,\n icon,\n disableFiltering,\n disabled,\n altPlaceholder,\n required,\n ...rest\n }: ChipDropdownInputProps, ref) => {\n // Initiate states\n const [givenList, setGivenList] = React.useState<ListItem[]>([]);\n const [chips, setChips] = React.useState<ListItem[]>([]);\n\n const [value, setValue] = React.useState<string>('');\n const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n const [filteredList, setFilteredList] = React.useState<ListItem[]>();\n\n const [dropdownIsOpen, setDropdownIsOpen] = React.useState<boolean>(false);\n const [dropdownList, setDropdownList] = React.useState<DropdownItem[]>([]);\n const [dropdownValue, setDropdownValue] = React.useState<string>('');\n\n const [focused, setFocused] = React.useState<number | null>(null);\n\n const containerRef = useClickOutsideRef(() => setDropdownIsOpen(false), [], useFocusOutsideRef(() => setDropdownIsOpen(false)));\n const inputRef = React.useRef<any>();\n\n React.useImperativeHandle(ref, () => inputRef.current, [inputRef]);\n\n\n /**\n * Sets initial values for the chips.\n */\n React.useEffect(() => {\n\n const list =\n values.map((a) => chips.find(b => b.value === a) || givenList.find(b => b.value === a) || {\n label: a,\n value: a,\n icon: icon\n })\n .map((a, index) => ({...a, variant: a.variant || (variants && variants[index]) || States.Default}))\n .map((a, index) => ({...a, icon: a.icon || icon}));\n\n setChips(list);\n }, [values, variants, icon, givenList]);\n\n /**\n * Convert string[] to List[] if necessary\n */\n React.useEffect(() => {\n if (typeof list[0] === 'string') {\n const newList: ListItem[] = (list as string[]).map((e: string) => ({label: e, value: e}));\n setGivenList(newList);\n } else {\n setGivenList(list as ListItem[]);\n }\n }, [list]);\n\n /**\n * filter and sort list if remoteOperations is false\n * */\n React.useEffect(() => {\n let options = [...givenList];\n if (!disableFiltering) {\n if (!restartFilter && value !== '') {\n options = options.filter((option) => option.label.toUpperCase().indexOf(value.toUpperCase()) !== -1 ||\n (option.secondaryLabel && option.secondaryLabel?.toUpperCase().indexOf(value.toUpperCase()) !== -1));\n }\n }\n\n if (!disableSorting) {\n options = options.sort();\n }\n\n suggestion && options.push(suggestion);\n\n options = options.filter((o) => !chips.find(a => a.value === o.value));\n setFilteredList(options);\n }, [value, givenList, chips, disableFiltering, disableSorting]);\n\n /**\n * if there is only one active item in dropdown mark it as focused\n * */\n React.useEffect(() => {\n if (dropdownIsOpen && !!value && dropdownList?.filter(a => !a.disabled).length === 1) {\n setDropdownValue(dropdownList.find(a => !a.disabled)!.value);\n } else {\n setDropdownValue('');\n }\n }, [dropdownList, dropdownIsOpen, value]);\n\n const handleClickOutside = (e: any) => {\n if (!containerRef.current?.contains(e.target)) {\n if (dropdownIsOpen) {\n setDropdownIsOpen(false);\n if (!givenList.find((e) => e.value === value)) {\n setValue('');\n }\n }\n }\n };\n\n /**\n * register click outside event listener\n * */\n React.useEffect(() => {\n document.addEventListener('click', handleClickOutside);\n return () => {\n document.removeEventListener('click', handleClickOutside);\n };\n });\n\n /**\n * update dropdown items when filtered list changes\n * */\n React.useEffect(() => {\n setDropdownList(filteredList?.map(x => ({\n value: x.value,\n displayLabel: x.label,\n noteLabel: x.secondaryLabel,\n icon: (x.icon ?? icon) && SystemIcons[(x.icon || icon)!]({}),\n disabled: x.disabled,\n })) ?? []);\n }, [filteredList]);\n\n const addChip = (newChip: ListItem) => {\n const newList = [...chips, newChip];\n // Let's add the chip\n setChips(newList);\n onValueChange(newList.map(a => a.value));\n\n setValue('');\n };\n\n const handleInputValueChange = (value: string) => {\n setValue(value);\n setRestartFilter(false);\n setDropdownIsOpen(true);\n onInputChange && onInputChange(value);\n }\n\n /**\n * Add chip from dropdown\n * */\n const handleValueUpdate = (values: string[]) => {\n const item = filteredList?.find(a => a.value === values[0]);\n item && addChip(item);\n setRestartFilter(true);\n inputRef?.current?.focus();\n }\n\n /**\n * Adds a chip to the chip list.\n * @param event - Event handler from the key down event.\n */\n const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n // Let's trigger only on enter, comma and space key press\n if ((event.key === 'Enter' || event.key === ' ') && value) {\n if (dropdownList?.filter(a => !a.disabled).length === 1) {\n handleValueUpdate([dropdownList!.find(a => !a.disabled)!.value]);\n event.stopPropagation();\n }\n }\n\n if ((event.key === 'ArrowDown' || event.key === 'Down' || event.key === 'ArrowUp' || event.key === 'Up') && !!dropdownList?.length) {\n setDropdownIsOpen(true);\n }\n };\n\n /**\n * Removes a specific chip from the chip list.\n * @param index - Index of the chip that needs to be removed.\n */\n const handleOnChipRemoved = (index: number): void => {\n // Let's copy the chips\n const newChips = [...chips];\n\n // Let's delete the chip\n // If necessary, let's replace it with a different chip\n newChips.splice(index, 1);\n\n // Let's update the chip list\n setChips([...newChips]);\n onValueChange(newChips.map((e) => e.value));\n };\n\n return (\n <Wrapper ref={containerRef}>\n <ChipInputField inputId={inputId}\n ref={inputRef}\n items={chips}\n required={required}\n inputValue={value}\n size={size}\n placeholder={placeholder}\n altPlaceholder={altPlaceholder}\n disabled={disabled}\n multiLine={multiLine}\n validationMessage={validationMessage}\n loading={loading}\n onRemoveItem={(chip, index) => handleOnChipRemoved(index)}\n onInputValueChange={handleInputValueChange}\n onInputKeyDown={handleInputKeyDown}\n onActivationChange={(value) => setDropdownIsOpen(value)}\n {...rest}/>\n <DropdownContent\n customizationProps={{\n action: () => {\n },\n pinTopItem: true,\n\n itemsType: 'normal',\n scrollable: true,\n actionLabel: '',\n multiSelect: false,\n onValueUpdate: handleValueUpdate,\n items: dropdownList\n }}\n focused={focused}\n setFocused={setFocused}\n selectedValues={[dropdownValue]}\n messageOnNoResults={messageOnNoResults ?? ''}\n setSelectedValues={() => {\n }}\n isOpen={(!maxSelectedItems || (!!maxSelectedItems && chips.length < maxSelectedItems)) && dropdownIsOpen}\n setIsOpen={setDropdownIsOpen}\n filter={''}\n isButton={false}\n id={`${inputId}_dropdowncontent`}/>\n\n </Wrapper>\n );\n});\n"],"file":"ChipDropdownInput.js"}
@@ -9,10 +9,14 @@ Object.defineProperty(exports, "__esModule", {
9
9
  });
10
10
  exports.default = void 0;
11
11
 
12
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
13
+
12
14
  var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
13
15
 
14
16
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
15
17
 
18
+ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
19
+
16
20
  var React = _interopRequireWildcard(require("react"));
17
21
 
18
22
  var _types = require("../types");
@@ -21,18 +25,17 @@ var _ChipInputField = require("./ChipInputField");
21
25
 
22
26
  var _jsxRuntime = require("react/jsx-runtime");
23
27
 
28
+ var _excluded = ["values", "inputId", "variants", "icon", "placeholder", "disabled", "altPlaceholder", "validationMessage", "onValueChange", "multiLine", "size"];
29
+
24
30
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
25
31
 
26
32
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
27
33
 
28
- /**
29
- * Import React libraries.
30
- */
34
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
31
35
 
32
- /**
33
- * Import custom components.
34
- */
35
- var ChipInput = function ChipInput(_ref) {
36
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
37
+
38
+ var ChipInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
36
39
  var values = _ref.values,
37
40
  inputId = _ref.inputId,
38
41
  variants = _ref.variants,
@@ -45,7 +48,8 @@ var ChipInput = function ChipInput(_ref) {
45
48
  _ref$multiLine = _ref.multiLine,
46
49
  multiLine = _ref$multiLine === void 0 ? true : _ref$multiLine,
47
50
  _ref$size = _ref.size,
48
- size = _ref$size === void 0 ? _types.Size.Medium : _ref$size;
51
+ size = _ref$size === void 0 ? _types.Size.Medium : _ref$size,
52
+ rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
49
53
 
50
54
  var _React$useState = React.useState([]),
51
55
  _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
@@ -114,8 +118,9 @@ var ChipInput = function ChipInput(_ref) {
114
118
  */
115
119
 
116
120
 
117
- return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChipInputField.ChipInputField, {
121
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChipInputField.ChipInputField, _objectSpread({
118
122
  inputId: inputId,
123
+ ref: ref,
119
124
  items: chipItems,
120
125
  onRemoveItem: function onRemoveItem(item, index) {
121
126
  return onRemoveChip(index);
@@ -131,9 +136,8 @@ var ChipInput = function ChipInput(_ref) {
131
136
  validationMessage: validationMessage,
132
137
  multiLine: multiLine,
133
138
  size: size
134
- });
135
- };
136
-
139
+ }, rest));
140
+ });
137
141
  var _default = ChipInput;
138
142
  exports.default = _default;
139
143
  //# sourceMappingURL=ChipInput.cjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/ChipsInput/ChipInput.tsx"],"names":["ChipInput","values","inputId","variants","icon","placeholder","disabled","altPlaceholder","validationMessage","onValueChange","multiLine","size","Size","Medium","React","useState","chips","setChips","value","setValue","chipItems","setChipItems","useEffect","map","chip","index","label","variant","handleInputKeyDown","event","key","preventDefault","onRemoveChip","newChips","splice","item"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {Size} from '../types';\nimport {ChipInputField} from './ChipInputField';\nimport {ChipInputProps, ChipItem} from './ChipInputTypes';\n\n\nconst ChipInput: React.FunctionComponent<ChipInputProps> = ({\n values,\n inputId,\n variants,\n icon,\n placeholder,\n disabled,\n altPlaceholder,\n validationMessage,\n onValueChange,\n multiLine = true,\n size = Size.Medium,\n }: ChipInputProps) => {\n\n const [chips, setChips] = React.useState<string[]>([]);\n const [value, setValue] = React.useState<string>('');\n const [chipItems, setChipItems] = React.useState<ChipItem[]>([]);\n\n /**\n * Sets initial values for the chips.\n */\n React.useEffect(() => {\n // Let's add initial chip values\n setChips(values);\n }, [values]);\n\n /**\n * Set chip items for chip input field\n * */\n React.useEffect(() => {\n setChipItems(chips.map((chip, index) => ({\n label: chip,\n icon: icon,\n disabled: false,\n variant: variants && variants[index],\n })));\n }, [chips, variants, icon, size]);\n\n /**\n * Adds a chip to the chip list.\n * @param event - Event handler from the key down event.\n */\n const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n if ((event.key === 'Enter' || event.key === ' ') && value) {\n event.preventDefault();\n\n setChips([...chips, value]);\n onValueChange([...chips, value]);\n\n setValue('');\n }\n };\n\n /**\n * Removes a specific chip from the chip list.\n * @param index - Index of the chip that needs to be removed.\n */\n const onRemoveChip = (index: number): void => {\n const newChips = [...chips];\n newChips.splice(index, 1);\n\n setChips(newChips);\n onValueChange(newChips);\n };\n\n /**\n * Return Chip Input component.\n */\n return (\n <ChipInputField inputId={inputId}\n items={chipItems}\n onRemoveItem={(item, index) => onRemoveChip(index)}\n inputValue={value}\n onInputValueChange={value => setValue(value)}\n onInputKeyDown={handleInputKeyDown}\n placeholder={placeholder}\n altPlaceholder={altPlaceholder}\n disabled={disabled}\n validationMessage={validationMessage}\n multiLine={multiLine}\n size={size}\n />\n );\n};\n\nexport default ChipInput;\n"],"file":"ChipInput.cjs"}
1
+ {"version":3,"sources":["../../src/ChipsInput/ChipInput.tsx"],"names":["ChipInput","React","forwardRef","ref","values","inputId","variants","icon","placeholder","disabled","altPlaceholder","validationMessage","onValueChange","multiLine","size","Size","Medium","rest","useState","chips","setChips","value","setValue","chipItems","setChipItems","useEffect","map","chip","index","label","variant","handleInputKeyDown","event","key","preventDefault","onRemoveChip","newChips","splice","item"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {Size} from '../types';\nimport {ChipInputField} from './ChipInputField';\nimport {ChipInputProps, ChipItem} from './ChipInputTypes';\n\n\nconst ChipInput = React.forwardRef<HTMLInputElement, ChipInputProps>(({\n values,\n inputId,\n variants,\n icon,\n placeholder,\n disabled,\n altPlaceholder,\n validationMessage,\n onValueChange,\n multiLine = true,\n size = Size.Medium,\n ...rest\n }: ChipInputProps, ref) => {\n\n const [chips, setChips] = React.useState<string[]>([]);\n const [value, setValue] = React.useState<string>('');\n const [chipItems, setChipItems] = React.useState<ChipItem[]>([]);\n\n /**\n * Sets initial values for the chips.\n */\n React.useEffect(() => {\n // Let's add initial chip values\n setChips(values);\n }, [values]);\n\n /**\n * Set chip items for chip input field\n * */\n React.useEffect(() => {\n setChipItems(chips.map((chip, index) => ({\n label: chip,\n icon: icon,\n disabled: false,\n variant: variants && variants[index],\n })));\n }, [chips, variants, icon, size]);\n\n /**\n * Adds a chip to the chip list.\n * @param event - Event handler from the key down event.\n */\n const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n if ((event.key === 'Enter' || event.key === ' ') && value) {\n event.preventDefault();\n\n setChips([...chips, value]);\n onValueChange([...chips, value]);\n\n setValue('');\n }\n };\n\n /**\n * Removes a specific chip from the chip list.\n * @param index - Index of the chip that needs to be removed.\n */\n const onRemoveChip = (index: number): void => {\n const newChips = [...chips];\n newChips.splice(index, 1);\n\n setChips(newChips);\n onValueChange(newChips);\n };\n\n /**\n * Return Chip Input component.\n */\n return (\n <ChipInputField inputId={inputId}\n ref={ref}\n items={chipItems}\n onRemoveItem={(item, index) => onRemoveChip(index)}\n inputValue={value}\n onInputValueChange={value => setValue(value)}\n onInputKeyDown={handleInputKeyDown}\n placeholder={placeholder}\n altPlaceholder={altPlaceholder}\n disabled={disabled}\n validationMessage={validationMessage}\n multiLine={multiLine}\n size={size}\n {...rest}\n />\n );\n});\n\nexport default ChipInput;\n"],"file":"ChipInput.cjs"}
@@ -3,5 +3,5 @@
3
3
  */
4
4
  import * as React from 'react';
5
5
  import { ChipInputProps } from './ChipInputTypes';
6
- declare const ChipInput: React.FunctionComponent<ChipInputProps>;
6
+ declare const ChipInput: React.ForwardRefExoticComponent<ChipInputProps & React.RefAttributes<HTMLInputElement>>;
7
7
  export default ChipInput;
@@ -1,5 +1,12 @@
1
+ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
1
2
  import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
2
3
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
4
+ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
5
+ var _excluded = ["values", "inputId", "variants", "icon", "placeholder", "disabled", "altPlaceholder", "validationMessage", "onValueChange", "multiLine", "size"];
6
+
7
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
8
+
9
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
3
10
 
4
11
  /**
5
12
  * Import React libraries.
@@ -12,8 +19,7 @@ import * as React from 'react';
12
19
  import { Size } from '../types';
13
20
  import { ChipInputField } from './ChipInputField';
14
21
  import { jsx as _jsx } from "react/jsx-runtime";
15
-
16
- var ChipInput = function ChipInput(_ref) {
22
+ var ChipInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
17
23
  var values = _ref.values,
18
24
  inputId = _ref.inputId,
19
25
  variants = _ref.variants,
@@ -26,7 +32,8 @@ var ChipInput = function ChipInput(_ref) {
26
32
  _ref$multiLine = _ref.multiLine,
27
33
  multiLine = _ref$multiLine === void 0 ? true : _ref$multiLine,
28
34
  _ref$size = _ref.size,
29
- size = _ref$size === void 0 ? Size.Medium : _ref$size;
35
+ size = _ref$size === void 0 ? Size.Medium : _ref$size,
36
+ rest = _objectWithoutProperties(_ref, _excluded);
30
37
 
31
38
  var _React$useState = React.useState([]),
32
39
  _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -96,8 +103,9 @@ var ChipInput = function ChipInput(_ref) {
96
103
  */
97
104
 
98
105
 
99
- return /*#__PURE__*/_jsx(ChipInputField, {
106
+ return /*#__PURE__*/_jsx(ChipInputField, _objectSpread({
100
107
  inputId: inputId,
108
+ ref: ref,
101
109
  items: chipItems,
102
110
  onRemoveItem: function onRemoveItem(item, index) {
103
111
  return onRemoveChip(index);
@@ -113,8 +121,7 @@ var ChipInput = function ChipInput(_ref) {
113
121
  validationMessage: validationMessage,
114
122
  multiLine: multiLine,
115
123
  size: size
116
- });
117
- };
118
-
124
+ }, rest));
125
+ });
119
126
  export default ChipInput;
120
127
  //# sourceMappingURL=ChipInput.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/ChipsInput/ChipInput.tsx"],"names":["React","Size","ChipInputField","ChipInput","values","inputId","variants","icon","placeholder","disabled","altPlaceholder","validationMessage","onValueChange","multiLine","size","Medium","useState","chips","setChips","value","setValue","chipItems","setChipItems","useEffect","map","chip","index","label","variant","handleInputKeyDown","event","key","preventDefault","onRemoveChip","newChips","splice","item"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {Size} from '../types';\nimport {ChipInputField} from './ChipInputField';\nimport {ChipInputProps, ChipItem} from './ChipInputTypes';\n\n\nconst ChipInput: React.FunctionComponent<ChipInputProps> = ({\n values,\n inputId,\n variants,\n icon,\n placeholder,\n disabled,\n altPlaceholder,\n validationMessage,\n onValueChange,\n multiLine = true,\n size = Size.Medium,\n }: ChipInputProps) => {\n\n const [chips, setChips] = React.useState<string[]>([]);\n const [value, setValue] = React.useState<string>('');\n const [chipItems, setChipItems] = React.useState<ChipItem[]>([]);\n\n /**\n * Sets initial values for the chips.\n */\n React.useEffect(() => {\n // Let's add initial chip values\n setChips(values);\n }, [values]);\n\n /**\n * Set chip items for chip input field\n * */\n React.useEffect(() => {\n setChipItems(chips.map((chip, index) => ({\n label: chip,\n icon: icon,\n disabled: false,\n variant: variants && variants[index],\n })));\n }, [chips, variants, icon, size]);\n\n /**\n * Adds a chip to the chip list.\n * @param event - Event handler from the key down event.\n */\n const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n if ((event.key === 'Enter' || event.key === ' ') && value) {\n event.preventDefault();\n\n setChips([...chips, value]);\n onValueChange([...chips, value]);\n\n setValue('');\n }\n };\n\n /**\n * Removes a specific chip from the chip list.\n * @param index - Index of the chip that needs to be removed.\n */\n const onRemoveChip = (index: number): void => {\n const newChips = [...chips];\n newChips.splice(index, 1);\n\n setChips(newChips);\n onValueChange(newChips);\n };\n\n /**\n * Return Chip Input component.\n */\n return (\n <ChipInputField inputId={inputId}\n items={chipItems}\n onRemoveItem={(item, index) => onRemoveChip(index)}\n inputValue={value}\n onInputValueChange={value => setValue(value)}\n onInputKeyDown={handleInputKeyDown}\n placeholder={placeholder}\n altPlaceholder={altPlaceholder}\n disabled={disabled}\n validationMessage={validationMessage}\n multiLine={multiLine}\n size={size}\n />\n );\n};\n\nexport default ChipInput;\n"],"file":"ChipInput.js"}
1
+ {"version":3,"sources":["../../src/ChipsInput/ChipInput.tsx"],"names":["React","Size","ChipInputField","ChipInput","forwardRef","ref","values","inputId","variants","icon","placeholder","disabled","altPlaceholder","validationMessage","onValueChange","multiLine","size","Medium","rest","useState","chips","setChips","value","setValue","chipItems","setChipItems","useEffect","map","chip","index","label","variant","handleInputKeyDown","event","key","preventDefault","onRemoveChip","newChips","splice","item"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {Size} from '../types';\nimport {ChipInputField} from './ChipInputField';\nimport {ChipInputProps, ChipItem} from './ChipInputTypes';\n\n\nconst ChipInput = React.forwardRef<HTMLInputElement, ChipInputProps>(({\n values,\n inputId,\n variants,\n icon,\n placeholder,\n disabled,\n altPlaceholder,\n validationMessage,\n onValueChange,\n multiLine = true,\n size = Size.Medium,\n ...rest\n }: ChipInputProps, ref) => {\n\n const [chips, setChips] = React.useState<string[]>([]);\n const [value, setValue] = React.useState<string>('');\n const [chipItems, setChipItems] = React.useState<ChipItem[]>([]);\n\n /**\n * Sets initial values for the chips.\n */\n React.useEffect(() => {\n // Let's add initial chip values\n setChips(values);\n }, [values]);\n\n /**\n * Set chip items for chip input field\n * */\n React.useEffect(() => {\n setChipItems(chips.map((chip, index) => ({\n label: chip,\n icon: icon,\n disabled: false,\n variant: variants && variants[index],\n })));\n }, [chips, variants, icon, size]);\n\n /**\n * Adds a chip to the chip list.\n * @param event - Event handler from the key down event.\n */\n const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n if ((event.key === 'Enter' || event.key === ' ') && value) {\n event.preventDefault();\n\n setChips([...chips, value]);\n onValueChange([...chips, value]);\n\n setValue('');\n }\n };\n\n /**\n * Removes a specific chip from the chip list.\n * @param index - Index of the chip that needs to be removed.\n */\n const onRemoveChip = (index: number): void => {\n const newChips = [...chips];\n newChips.splice(index, 1);\n\n setChips(newChips);\n onValueChange(newChips);\n };\n\n /**\n * Return Chip Input component.\n */\n return (\n <ChipInputField inputId={inputId}\n ref={ref}\n items={chipItems}\n onRemoveItem={(item, index) => onRemoveChip(index)}\n inputValue={value}\n onInputValueChange={value => setValue(value)}\n onInputKeyDown={handleInputKeyDown}\n placeholder={placeholder}\n altPlaceholder={altPlaceholder}\n disabled={disabled}\n validationMessage={validationMessage}\n multiLine={multiLine}\n size={size}\n {...rest}\n />\n );\n});\n\nexport default ChipInput;\n"],"file":"ChipInput.js"}
@@ -7,6 +7,10 @@ Object.defineProperty(exports, "__esModule", {
7
7
  });
8
8
  exports.ChipInputField = exports.ChipInputEl = exports.ChipInputContentContainer = exports.ChipInputContainer = exports.ChipInputBoundItems = void 0;
9
9
 
10
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
11
+
12
+ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
13
+
10
14
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
11
15
 
12
16
  var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -35,8 +39,14 @@ var _icons = require("../icons");
35
39
 
36
40
  var _jsxRuntime = require("react/jsx-runtime");
37
41
 
42
+ var _excluded = ["inputId", "items", "disabled", "placeholder", "altPlaceholder", "multiLine", "size", "validationMessage", "loading", "onRemoveItem", "onInputValueChange", "onInputKeyDown", "onActivationChange", "inputValue", "required", "onBlur"];
43
+
38
44
  var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
39
45
 
46
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
47
+
48
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
49
+
40
50
  var Wrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n position: relative;\n"])));
41
51
 
42
52
  var Loading = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n height: 20px;\n width: 20px;\n"])));
@@ -75,15 +85,22 @@ var ChipInputField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref)
75
85
  onInputKeyDown = _ref.onInputKeyDown,
76
86
  onActivationChange = _ref.onActivationChange,
77
87
  inputValue = _ref.inputValue,
78
- required = _ref.required;
88
+ required = _ref.required,
89
+ onBlur = _ref.onBlur,
90
+ rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
79
91
 
80
92
  var containerRef = _react.default.useRef(null);
81
93
 
82
- var inputRef = (0, _common.useFocusVisibleRef)([containerRef], ref);
94
+ var inputRef = (0, _common.useFocusVisibleRef)([containerRef]);
95
+
96
+ _react.default.useImperativeHandle(ref, function () {
97
+ return inputRef.current;
98
+ }, [inputRef]);
83
99
  /**
84
100
  * Scroll container to last item on change
85
101
  * */
86
102
 
103
+
87
104
  _react.default.useEffect(function () {
88
105
  if (inputRef.current && document.activeElement === inputRef.current) {
89
106
  inputRef.current.scrollIntoView({
@@ -139,6 +156,7 @@ var ChipInputField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref)
139
156
 
140
157
  var cls = "".concat(multiLine ? 'multiline' : '', " ").concat(validationMessage ? 'invalid' : '', " ").concat(size, " ").concat(loading ? 'loading' : '', " ").concat(disabled ? 'disabled' : '');
141
158
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Wrapper, {
159
+ onBlur: onBlur,
142
160
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(ChipInputContainer, {
143
161
  "data-testid": "chip-input-container",
144
162
  ref: containerRef,
@@ -162,7 +180,7 @@ var ChipInputField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref)
162
180
  }
163
181
  }, "chip_".concat(index));
164
182
  }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(ChipInputBoundItems, {
165
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(ChipInputEl, {
183
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(ChipInputEl, _objectSpread({
166
184
  ref: inputRef,
167
185
  type: "text",
168
186
  id: inputId,
@@ -178,7 +196,7 @@ var ChipInputField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref)
178
196
  e.stopPropagation();
179
197
  onActivationChange && onActivationChange(true);
180
198
  }
181
- }), inputValue && !disabled && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
199
+ }, rest)), inputValue && !disabled && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
182
200
  id: "clear-btn",
183
201
  action: handleInputClear,
184
202
  ref: function ref(_ref2) {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/ChipsInput/ChipInputField.tsx"],"names":["Wrapper","styled","div","Loading","ChipInputBoundItems","ChipInputContentContainer","Size","Small","ChipInputEl","input","ComponentTextStyle","Regular","COLORS","black","Italic","neutral_600","ChipInputContainer","neutral_400","white","focusStyles","primary_700","primary_800","critical_500","neutral_100","neutral_300","ChipInputField","React","forwardRef","ref","inputId","items","disabled","placeholder","altPlaceholder","multiLine","size","Medium","validationMessage","loading","onRemoveItem","onInputValueChange","onInputKeyDown","onActivationChange","inputValue","required","containerRef","useRef","inputRef","useEffect","current","document","activeElement","scrollIntoView","block","inline","handleInputKeyDown","e","key","value","repeat","length","handleItemRemove","event","item","index","focus","focusVisible","detail","handleInputClear","handleContainerKeyDown","querySelectorAll","currentIndex","Array","from","indexOf","target","direction","cls","map","chip","icon","variant","States","Default","label","stopPropagation","marginLeft","critical_400"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { ChipItem } from './ChipInputTypes';\nimport { Size, States } from '../types';\nimport { InputChip } from '../Chips';\nimport { ErrorMessage } from '../InputFields/styling';\nimport { TechnicalWarning } from '../icons/systemicons/SystemIcons';\nimport { COLORS, ComponentMStyling, ComponentSStyling, ComponentTextStyle, focusStyles, scrollBarStyling } from '../styles';\nimport styled from 'styled-components';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { useFocusVisibleRef } from '../common';\nimport { IconButton } from '../Button';\nimport { SystemIcons } from '../icons';\n\nconst Wrapper = styled.div`\n position: relative;\n`;\n\nconst Loading = styled.div`\n height: 20px;\n width: 20px;\n`;\n\nexport const ChipInputBoundItems = styled.div`\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 8px;\n flex: 1;\n min-width: 40px;\n`;\n\nexport const ChipInputContentContainer = styled.div`\n width: 100%;\n background: transparent;\n display: flex;\n flex-direction: row;\n align-items: center;\n column-gap: 8px;\n margin-right: 6px;\n padding-right: 10px;\n padding-left: 16px;\n flex-wrap: nowrap;\n overflow-x: scroll;\n min-height: 48px;\n\n ${scrollBarStyling(Size.Small)}\n ::-webkit-scrollbar:horizontal {\n display: none;\n }\n\n .action-right:focus,\n button:focus {\n outline-offset: -4px !important;\n }\n`;\n\nexport const ChipInputEl = styled.input`\n border: none;\n outline: none;\n\n height: 40px;\n min-width: 40px;\n display: inline-flex;\n flex: 1;\n background: transparent;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, null)}\n color: ${COLORS.black} !important;\n\n &::placeholder {\n ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n`;\n\nexport const ChipInputContainer = styled.div`\n width: 100%;\n height: auto;\n border-radius: 4px;\n margin: 4px 0px;\n box-shadow: inset 0 0 0 1px ${COLORS.neutral_400};\n background-color: ${COLORS.white};\n box-sizing: border-box;\n cursor: text;\n outline: none;\n display: flex;\n align-items: center;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n &.small {\n padding: 0;\n min-height: 48px;\n\n ${ChipInputEl}::placeholder {\n ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n\n &.medium {\n padding: 4px 0;\n min-height: 56px;\n\n ${ChipInputEl}::placeholder {\n ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n\n &.multiline.medium {\n ${ChipInputContentContainer} {\n max-height: calc(48px * 3);\n flex-wrap: wrap;\n overflow-y: auto;\n overflow-x: unset;\n }\n }\n\n &.focus-visible-within,\n :focus {\n ${focusStyles}\n }\n\n &:hover {\n box-shadow: inset 0 0 0 2px ${COLORS.primary_700};\n }\n\n &:focus-within {\n box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\n }\n\n &.invalid,\n &.invalid:hover,\n &.invalid:focus {\n box-shadow: inset 0 0 0 2px ${COLORS.critical_500};\n }\n\n &.disabled {\n ${ChipInputContentContainer} {\n pointer-events: none;\n }\n\n cursor: not-allowed;\n box-shadow: inset 0 0 0 1px ${COLORS.neutral_100};\n outline: none;\n color: ${COLORS.neutral_300} !important;\n }\n`;\n\nexport interface ChipInputFieldProps {\n inputId: string;\n items: ChipItem[];\n disabled?: boolean;\n placeholder?: string;\n altPlaceholder?: string;\n multiLine?: boolean;\n size?: Size.Large | Size.Medium | Size.Small;\n loading?: boolean;\n required?: boolean;\n\n validationMessage?: string;\n\n onRemoveItem: (item: ChipItem, index: number) => void;\n inputValue: string;\n onInputValueChange: (value: string) => void;\n onInputKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void;\n onActivationChange?: (active: boolean) => void;\n}\n\nexport const ChipInputField = React.forwardRef<HTMLInputElement, ChipInputFieldProps>(\n (\n {\n inputId,\n items,\n disabled = false,\n placeholder,\n altPlaceholder,\n multiLine = true,\n size = Size.Medium,\n validationMessage,\n loading,\n onRemoveItem,\n onInputValueChange,\n onInputKeyDown,\n onActivationChange,\n inputValue,\n required,\n },\n ref,\n ) => {\n const containerRef = React.useRef<HTMLDivElement>(null);\n const inputRef = useFocusVisibleRef([containerRef], ref as any);\n\n /**\n * Scroll container to last item on change\n * */\n React.useEffect(() => {\n if (inputRef.current && document.activeElement === inputRef.current) {\n inputRef.current.scrollIntoView({\n block: 'nearest',\n inline: 'nearest',\n });\n }\n }, [containerRef, inputRef, items]);\n\n /**\n * Remove last cheap on backspace\n * */\n const handleInputKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === 'Backspace' && !inputRef.current?.value && !e.repeat && items.length > 0) {\n onRemoveItem(items[items.length - 1], items.length - 1);\n } else {\n onInputKeyDown(e);\n }\n };\n\n const handleItemRemove = (event: any, item: ChipItem, index: number) => {\n onRemoveItem(item, index);\n inputRef.current?.focus({ focusVisible: event.detail !== 1 } as any);\n };\n\n const handleInputClear = (e: any) => {\n onInputValueChange('');\n inputRef.current?.focus({ focusVisible: e?.detail !== 1 } as any);\n };\n\n const handleContainerKeyDown = (e: React.KeyboardEvent) => {\n if (!containerRef.current || (e.key !== 'ArrowLeft' && e.key !== 'ArrowRight')) return;\n\n const items = containerRef.current.querySelectorAll('[tabindex=\"0\"]') as NodeListOf<HTMLElement>;\n const currentIndex = Array.from(items).indexOf(e.target as any);\n const direction = e.key === 'ArrowLeft' ? -1 : 1;\n const item = items[currentIndex + direction];\n item?.focus({ focusVisible: true } as any);\n\n onActivationChange && onActivationChange(false);\n };\n\n const cls = `${multiLine ? 'multiline' : ''} ${validationMessage ? 'invalid' : ''} ${size} ${loading ? 'loading' : ''} ${disabled ? 'disabled' : ''}`;\n\n return (\n <Wrapper>\n <ChipInputContainer\n data-testid=\"chip-input-container\"\n ref={containerRef}\n onKeyDown={handleContainerKeyDown}\n onClick={() => !disabled && inputRef.current?.focus()}\n className={cls}>\n <ChipInputContentContainer>\n {items?.map((chip: ChipItem, index: number) => (\n <InputChip\n key={`chip_${index}`}\n icon={chip?.icon}\n size={size}\n disabled={chip.disabled || disabled}\n variant={chip.variant || States.Default}\n text={chip.label}\n onRemove={(e) => handleItemRemove(e, chip, index)}\n />\n ))}\n <ChipInputBoundItems>\n <ChipInputEl\n ref={inputRef}\n type=\"text\"\n id={inputId}\n required={required}\n tabIndex={disabled ? -1 : 0}\n value={inputValue}\n onChange={(e) => onInputValueChange(e.target.value)}\n onKeyDown={handleInputKeyDown}\n placeholder={items?.length === 0 ? placeholder : altPlaceholder || ''}\n onClick={(e) => {\n e.stopPropagation();\n onActivationChange && onActivationChange(true);\n }}\n />\n {inputValue && !disabled && (\n <IconButton\n id=\"clear-btn\"\n action={handleInputClear}\n ref={(ref) => {\n ref?.scrollIntoView({\n block: 'nearest',\n inline: 'nearest',\n });\n }}\n useTransparentBackground={true}\n shape={'circular'}\n style={{ marginLeft: '-8px' }}\n variant={'secondary'}>\n <SystemIcons.Clear />\n </IconButton>\n )}\n\n {loading && (\n <Loading className={size}>\n <LoadingIndicator size={Size.Small} color={COLORS.neutral_600} />\n </Loading>\n )}\n </ChipInputBoundItems>\n </ChipInputContentContainer>\n </ChipInputContainer>\n {validationMessage && (\n <ErrorMessage>\n <TechnicalWarning color={COLORS.critical_400} />\n <span>{validationMessage}</span>\n </ErrorMessage>\n )}\n </Wrapper>\n );\n },\n);\n"],"file":"ChipInputField.cjs"}
1
+ {"version":3,"sources":["../../src/ChipsInput/ChipInputField.tsx"],"names":["Wrapper","styled","div","Loading","ChipInputBoundItems","ChipInputContentContainer","Size","Small","ChipInputEl","input","ComponentTextStyle","Regular","COLORS","black","Italic","neutral_600","ChipInputContainer","neutral_400","white","focusStyles","primary_700","primary_800","critical_500","neutral_100","neutral_300","ChipInputField","React","forwardRef","ref","inputId","items","disabled","placeholder","altPlaceholder","multiLine","size","Medium","validationMessage","loading","onRemoveItem","onInputValueChange","onInputKeyDown","onActivationChange","inputValue","required","onBlur","rest","containerRef","useRef","inputRef","useImperativeHandle","current","useEffect","document","activeElement","scrollIntoView","block","inline","handleInputKeyDown","e","key","value","repeat","length","handleItemRemove","event","item","index","focus","focusVisible","detail","handleInputClear","handleContainerKeyDown","querySelectorAll","currentIndex","Array","from","indexOf","target","direction","cls","map","chip","icon","variant","States","Default","label","stopPropagation","marginLeft","critical_400"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {ChipItem} from './ChipInputTypes';\nimport {Size, States} from '../types';\nimport {InputChip} from '../Chips';\nimport {ErrorMessage} from '../InputFields/styling';\nimport {TechnicalWarning} from '../icons/systemicons/SystemIcons';\nimport {\n COLORS,\n ComponentMStyling,\n ComponentSStyling,\n ComponentTextStyle,\n focusStyles,\n scrollBarStyling\n} from '../styles';\nimport styled from 'styled-components';\nimport {LoadingIndicator} from '../LoadingIndicator';\nimport {useFocusVisibleRef} from '../common';\nimport {IconButton} from '../Button';\nimport {SystemIcons} from '../icons';\n\nconst Wrapper = styled.div`\n position: relative;\n`;\n\nconst Loading = styled.div`\n height: 20px;\n width: 20px;\n`;\n\nexport const ChipInputBoundItems = styled.div`\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 8px;\n flex: 1;\n min-width: 40px;\n`;\n\nexport const ChipInputContentContainer = styled.div`\n width: 100%;\n background: transparent;\n display: flex;\n flex-direction: row;\n align-items: center;\n column-gap: 8px;\n margin-right: 6px;\n padding-right: 10px;\n padding-left: 16px;\n flex-wrap: nowrap;\n overflow-x: scroll;\n min-height: 48px;\n\n ${scrollBarStyling(Size.Small)}\n ::-webkit-scrollbar:horizontal {\n display: none;\n }\n\n .action-right:focus,\n button:focus {\n outline-offset: -4px !important;\n }\n`;\n\nexport const ChipInputEl = styled.input`\n border: none;\n outline: none;\n\n height: 40px;\n min-width: 40px;\n display: inline-flex;\n flex: 1;\n background: transparent;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, null)}\n color: ${COLORS.black} !important;\n\n &::placeholder {\n ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n`;\n\nexport const ChipInputContainer = styled.div`\n width: 100%;\n height: auto;\n border-radius: 4px;\n margin: 4px 0px;\n box-shadow: inset 0 0 0 1px ${COLORS.neutral_400};\n background-color: ${COLORS.white};\n box-sizing: border-box;\n cursor: text;\n outline: none;\n display: flex;\n align-items: center;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n &.small {\n padding: 0;\n min-height: 48px;\n\n ${ChipInputEl}::placeholder {\n ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n\n &.medium {\n padding: 4px 0;\n min-height: 56px;\n\n ${ChipInputEl}::placeholder {\n ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n }\n }\n\n &.multiline.medium {\n ${ChipInputContentContainer} {\n max-height: calc(48px * 3);\n flex-wrap: wrap;\n overflow-y: auto;\n overflow-x: unset;\n }\n }\n\n &.focus-visible-within,\n :focus {\n ${focusStyles}\n }\n\n &:hover {\n box-shadow: inset 0 0 0 2px ${COLORS.primary_700};\n }\n\n &:focus-within {\n box-shadow: inset 0 0 0 2px ${COLORS.primary_800};\n }\n\n &.invalid,\n &.invalid:hover,\n &.invalid:focus {\n box-shadow: inset 0 0 0 2px ${COLORS.critical_500};\n }\n\n &.disabled {\n ${ChipInputContentContainer} {\n pointer-events: none;\n }\n\n cursor: not-allowed;\n box-shadow: inset 0 0 0 1px ${COLORS.neutral_100};\n outline: none;\n color: ${COLORS.neutral_300} !important;\n }\n`;\n\nexport interface ChipInputFieldProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'id' | 'required' | 'tabIndex' | 'value' | 'onChange' | 'onKeyDown' | 'placeholder' | 'onClick' | 'disabled' | 'size'> {\n inputId: string;\n items: ChipItem[];\n disabled?: boolean;\n placeholder?: string;\n altPlaceholder?: string;\n multiLine?: boolean;\n size?: Size.Large | Size.Medium | Size.Small;\n loading?: boolean;\n required?: boolean;\n\n validationMessage?: string;\n\n onRemoveItem: (item: ChipItem, index: number) => void;\n inputValue: string;\n onInputValueChange: (value: string) => void;\n onInputKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => void;\n onActivationChange?: (active: boolean) => void;\n}\n\nexport const ChipInputField = React.forwardRef<HTMLInputElement, ChipInputFieldProps>(\n (\n {\n inputId,\n items,\n disabled = false,\n placeholder,\n altPlaceholder,\n multiLine = true,\n size = Size.Medium,\n validationMessage,\n loading,\n onRemoveItem,\n onInputValueChange,\n onInputKeyDown,\n onActivationChange,\n inputValue,\n required,\n onBlur,\n ...rest\n },\n ref,\n ) => {\n const containerRef = React.useRef<HTMLDivElement>(null);\n const inputRef = useFocusVisibleRef([containerRef]);\n \n React.useImperativeHandle(ref, () => inputRef.current, [inputRef])\n\n /**\n * Scroll container to last item on change\n * */\n React.useEffect(() => {\n if (inputRef.current && document.activeElement === inputRef.current) {\n inputRef.current.scrollIntoView({\n block: 'nearest',\n inline: 'nearest',\n });\n }\n }, [containerRef, inputRef, items]);\n\n /**\n * Remove last cheap on backspace\n * */\n const handleInputKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === 'Backspace' && !inputRef.current?.value && !e.repeat && items.length > 0) {\n onRemoveItem(items[items.length - 1], items.length - 1);\n } else {\n onInputKeyDown(e);\n }\n };\n\n const handleItemRemove = (event: any, item: ChipItem, index: number) => {\n onRemoveItem(item, index);\n inputRef.current?.focus({focusVisible: event.detail !== 1} as any);\n };\n\n const handleInputClear = (e: any) => {\n onInputValueChange('');\n inputRef.current?.focus({focusVisible: e?.detail !== 1} as any);\n };\n\n const handleContainerKeyDown = (e: React.KeyboardEvent) => {\n if (!containerRef.current || (e.key !== 'ArrowLeft' && e.key !== 'ArrowRight')) return;\n\n const items = containerRef.current.querySelectorAll('[tabindex=\"0\"]') as NodeListOf<HTMLElement>;\n const currentIndex = Array.from(items).indexOf(e.target as any);\n const direction = e.key === 'ArrowLeft' ? -1 : 1;\n const item = items[currentIndex + direction];\n item?.focus({focusVisible: true} as any);\n\n onActivationChange && onActivationChange(false);\n };\n\n const cls = `${multiLine ? 'multiline' : ''} ${validationMessage ? 'invalid' : ''} ${size} ${loading ? 'loading' : ''} ${disabled ? 'disabled' : ''}`;\n\n return (\n <Wrapper onBlur={onBlur}>\n <ChipInputContainer\n data-testid=\"chip-input-container\"\n ref={containerRef}\n onKeyDown={handleContainerKeyDown}\n onClick={() => !disabled && inputRef.current?.focus()}\n className={cls}>\n <ChipInputContentContainer>\n {items?.map((chip: ChipItem, index: number) => (\n <InputChip\n key={`chip_${index}`}\n icon={chip?.icon}\n size={size}\n disabled={chip.disabled || disabled}\n variant={chip.variant || States.Default}\n text={chip.label}\n onRemove={(e) => handleItemRemove(e, chip, index)}\n />\n ))}\n <ChipInputBoundItems>\n <ChipInputEl\n ref={inputRef}\n type=\"text\"\n id={inputId}\n required={required}\n tabIndex={disabled ? -1 : 0}\n value={inputValue}\n onChange={(e) => onInputValueChange(e.target.value)}\n onKeyDown={handleInputKeyDown}\n placeholder={items?.length === 0 ? placeholder : altPlaceholder || ''}\n onClick={(e) => {\n e.stopPropagation();\n onActivationChange && onActivationChange(true);\n }}\n {...rest}\n />\n {inputValue && !disabled && (\n <IconButton\n id=\"clear-btn\"\n action={handleInputClear}\n ref={(ref) => {\n ref?.scrollIntoView({\n block: 'nearest',\n inline: 'nearest',\n });\n }}\n useTransparentBackground={true}\n shape={'circular'}\n style={{marginLeft: '-8px'}}\n variant={'secondary'}>\n <SystemIcons.Clear/>\n </IconButton>\n )}\n\n {loading && (\n <Loading className={size}>\n <LoadingIndicator size={Size.Small} color={COLORS.neutral_600}/>\n </Loading>\n )}\n </ChipInputBoundItems>\n </ChipInputContentContainer>\n </ChipInputContainer>\n {validationMessage && (\n <ErrorMessage>\n <TechnicalWarning color={COLORS.critical_400}/>\n <span>{validationMessage}</span>\n </ErrorMessage>\n )}\n </Wrapper>\n );\n },\n);\n"],"file":"ChipInputField.cjs"}
@@ -5,7 +5,7 @@ export declare const ChipInputBoundItems: import("styled-components").StyledComp
5
5
  export declare const ChipInputContentContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
6
6
  export declare const ChipInputEl: import("styled-components").StyledComponent<"input", any, {}, never>;
7
7
  export declare const ChipInputContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
8
- export interface ChipInputFieldProps {
8
+ export interface ChipInputFieldProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'id' | 'required' | 'tabIndex' | 'value' | 'onChange' | 'onKeyDown' | 'placeholder' | 'onClick' | 'disabled' | 'size'> {
9
9
  inputId: string;
10
10
  items: ChipItem[];
11
11
  disabled?: boolean;