@laerdal/life-react-components 1.11.0-dev.9 → 2.0.0

package/dist/ChipsInput/ChipDropdownInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChipDropdownInput.js","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"],"sources":["../../src/ChipsInput/ChipDropdownInput.tsx"],"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        containerRef={containerRef}\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"],"mappings":";;;;;;;;;;;;;;AAAA;AACA;AACA;AACA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AAEA;AACA;AACA;;AACA,SAAQC,kBAAR,EAA4BC,cAA5B,QAAiD,kBAAjD;AACA,SAAQC,IAAR,EAAcC,MAAd,QAA2B,UAA3B;AACA,SAAQC,eAAR,QAA4C,aAA5C;AACA,SAAQC,WAAR,QAA0B,UAA1B;AAEA,SAAQC,kBAAR,EAA4BC,kBAA5B,QAAqD,WAArD;AACA,SAAQC,SAAR,QAAwB,WAAxB;;;AAEA,IAAMC,OAAO,GAAGV,MAAM,CAACW,GAAV,oQAKTV,kBALS,EASIQ,SAAS,CAACG,QAAV,GAAqB,CATzB,CAAb;AA+BA,OAAO,IAAMC,iBAAiB,gBAAGd,KAAK,CAACe,UAAN,CAAuE,gBAsBgBC,GAtBhB,EAsBwB;EAAA,IArBjCC,IAqBiC,QArBjCA,IAqBiC;EAAA,IApBjCC,aAoBiC,QApBjCA,aAoBiC;EAAA,IAnBjCC,cAmBiC,QAnBjCA,cAmBiC;EAAA,IAlBjCC,kBAkBiC,QAlBjCA,kBAkBiC;EAAA,IAjBjCC,MAiBiC,QAjBjCA,MAiBiC;EAAA,IAhBjCC,OAgBiC,QAhBjCA,OAgBiC;EAAA,IAfjCC,QAeiC,QAfjCA,QAeiC;EAAA,IAdjCC,WAciC,QAdjCA,WAciC;EAAA,IAbjCC,iBAaiC,QAbjCA,iBAaiC;EAAA,IAZjCC,aAYiC,QAZjCA,aAYiC;EAAA,IAXjCC,UAWiC,QAXjCA,UAWiC;EAAA,IAVjCC,OAUiC,QAVjCA,OAUiC;EAAA,IATjCC,gBASiC,QATjCA,gBASiC;EAAA,0BARjCC,SAQiC;EAAA,IARjCA,SAQiC,+BARrB,IAQqB;EAAA,qBAPjCC,IAOiC;EAAA,IAPjCA,IAOiC,0BAP1B3B,IAAI,CAAC4B,MAOqB;EAAA,IANjCC,IAMiC,QANjCA,IAMiC;EAAA,IALjCC,gBAKiC,QALjCA,gBAKiC;EAAA,IAJjCC,QAIiC,QAJjCA,QAIiC;EAAA,IAHjCC,cAGiC,QAHjCA,cAGiC;EAAA,IAFjCC,QAEiC,QAFjCA,QAEiC;EAAA,IAD9BC,IAC8B;;EAC9H;EACA,sBAAkCtC,KAAK,CAACuC,QAAN,CAA2B,EAA3B,CAAlC;EAAA;EAAA,IAAOC,SAAP;EAAA,IAAkBC,YAAlB;;EACA,uBAA0BzC,KAAK,CAACuC,QAAN,CAA2B,EAA3B,CAA1B;EAAA;EAAA,IAAOG,KAAP;EAAA,IAAcC,QAAd;;EAEA,uBAA0B3C,KAAK,CAACuC,QAAN,CAAuB,EAAvB,CAA1B;EAAA;EAAA,IAAOK,KAAP;EAAA,IAAcC,QAAd;;EACA,uBAA0C7C,KAAK,CAACuC,QAAN,CAAwB,KAAxB,CAA1C;EAAA;EAAA,IAAOO,aAAP;EAAA,IAAsBC,gBAAtB;;EACA,uBAAwC/C,KAAK,CAACuC,QAAN,EAAxC;EAAA;EAAA,IAAOS,YAAP;EAAA,IAAqBC,eAArB;;EAEA,wBAA4CjD,KAAK,CAACuC,QAAN,CAAwB,KAAxB,CAA5C;EAAA;EAAA,IAAOW,cAAP;EAAA,IAAuBC,iBAAvB;;EACA,wBAAwCnD,KAAK,CAACuC,QAAN,CAA+B,EAA/B,CAAxC;EAAA;EAAA,IAAOa,YAAP;EAAA,IAAqBC,eAArB;;EACA,wBAA0CrD,KAAK,CAACuC,QAAN,CAAuB,EAAvB,CAA1C;EAAA;EAAA,IAAOe,aAAP;EAAA,IAAsBC,gBAAtB;;EAEA,wBAA8BvD,KAAK,CAACuC,QAAN,CAA8B,IAA9B,CAA9B;EAAA;EAAA,IAAOiB,OAAP;EAAA,IAAgBC,UAAhB;;EAEA,IAAMC,YAAY,GAAGlD,kBAAkB,CAAC;IAAA,OAAM2C,iBAAiB,CAAC,KAAD,CAAvB;EAAA,CAAD,EAAiC,EAAjC,EAAqC1C,kBAAkB,CAAC;IAAA,OAAM0C,iBAAiB,CAAC,KAAD,CAAvB;EAAA,CAAD,CAAvD,CAAvC;EACA,IAAMQ,QAAQ,GAAG3D,KAAK,CAAC4D,MAAN,EAAjB;EAEA5D,KAAK,CAAC6D,mBAAN,CAA0B7C,GAA1B,EAA+B;IAAA,OAAM2C,QAAQ,CAACG,OAAf;EAAA,CAA/B,EAAuD,CAACH,QAAD,CAAvD;EAGA;AACF;AACA;;EACE3D,KAAK,CAAC+D,SAAN,CAAgB,YAAM;IAEpB,IAAM9C,IAAI,GACRI,MAAM,CAAC2C,GAAP,CAAW,UAACC,CAAD;MAAA,OAAOvB,KAAK,CAACwB,IAAN,CAAW,UAAAC,CAAC;QAAA,OAAIA,CAAC,CAACvB,KAAF,KAAYqB,CAAhB;MAAA,CAAZ,KAAkCzB,SAAS,CAAC0B,IAAV,CAAe,UAAAC,CAAC;QAAA,OAAIA,CAAC,CAACvB,KAAF,KAAYqB,CAAhB;MAAA,CAAhB,CAAlC,IAAwE;QACxFG,KAAK,EAAEH,CADiF;QAExFrB,KAAK,EAAEqB,CAFiF;QAGxFhC,IAAI,EAAEA;MAHkF,CAA/E;IAAA,CAAX,EAKG+B,GALH,CAKO,UAACC,CAAD,EAAII,KAAJ;MAAA,uCAAmBJ,CAAnB;QAAsBK,OAAO,EAAEL,CAAC,CAACK,OAAF,IAAc/C,QAAQ,IAAIA,QAAQ,CAAC8C,KAAD,CAAlC,IAA8ChE,MAAM,CAACkE;MAApF;IAAA,CALP,EAMGP,GANH,CAMO,UAACC,CAAD,EAAII,KAAJ;MAAA,uCAAmBJ,CAAnB;QAAsBhC,IAAI,EAAEgC,CAAC,CAAChC,IAAF,IAAUA;MAAtC;IAAA,CANP,CADF;IASAU,QAAQ,CAAC1B,IAAD,CAAR;EACD,CAZD,EAYG,CAACI,MAAD,EAASE,QAAT,EAAmBU,IAAnB,EAAyBO,SAAzB,CAZH;EAcA;AACF;AACA;;EACExC,KAAK,CAAC+D,SAAN,CAAgB,YAAM;IACpB,IAAI,OAAO9C,IAAI,CAAC,CAAD,CAAX,KAAmB,QAAvB,EAAiC;MAC/B,IAAMuD,OAAmB,GAAIvD,IAAD,CAAmB+C,GAAnB,CAAuB,UAACS,CAAD;QAAA,OAAgB;UAACL,KAAK,EAAEK,CAAR;UAAW7B,KAAK,EAAE6B;QAAlB,CAAhB;MAAA,CAAvB,CAA5B;MACAhC,YAAY,CAAC+B,OAAD,CAAZ;IACD,CAHD,MAGO;MACL/B,YAAY,CAACxB,IAAD,CAAZ;IACD;EACF,CAPD,EAOG,CAACA,IAAD,CAPH;EASA;AACF;AACA;;EACEjB,KAAK,CAAC+D,SAAN,CAAgB,YAAM;IACpB,IAAIW,OAAO,sBAAOlC,SAAP,CAAX;;IACA,IAAI,CAACN,gBAAL,EAAuB;MACrB,IAAI,CAACY,aAAD,IAAkBF,KAAK,KAAK,EAAhC,EAAoC;QAClC8B,OAAO,GAAGA,OAAO,CAACC,MAAR,CAAe,UAACC,MAAD;UAAA;;UAAA,OAAYA,MAAM,CAACR,KAAP,CAAaS,WAAb,GAA2BC,OAA3B,CAAmClC,KAAK,CAACiC,WAAN,EAAnC,MAA4D,CAAC,CAA7D,IAClCD,MAAM,CAACG,cAAP,IAAyB,0BAAAH,MAAM,CAACG,cAAP,gFAAuBF,WAAvB,GAAqCC,OAArC,CAA6ClC,KAAK,CAACiC,WAAN,EAA7C,OAAsE,CAAC,CAD1E;QAAA,CAAf,CAAV;MAED;IACF;;IAED,IAAI,CAAC1D,cAAL,EAAqB;MACnBuD,OAAO,GAAGA,OAAO,CAACM,IAAR,EAAV;IACD;;IAEDrD,UAAU,IAAI+C,OAAO,CAACO,IAAR,CAAatD,UAAb,CAAd;IAEA+C,OAAO,GAAGA,OAAO,CAACC,MAAR,CAAe,UAACO,CAAD;MAAA,OAAO,CAACxC,KAAK,CAACwB,IAAN,CAAW,UAAAD,CAAC;QAAA,OAAIA,CAAC,CAACrB,KAAF,KAAYsC,CAAC,CAACtC,KAAlB;MAAA,CAAZ,CAAR;IAAA,CAAf,CAAV;IACAK,eAAe,CAACyB,OAAD,CAAf;EACD,CAjBD,EAiBG,CAAC9B,KAAD,EAAQJ,SAAR,EAAmBE,KAAnB,EAA0BR,gBAA1B,EAA4Cf,cAA5C,CAjBH;EAmBA;AACF;AACA;;EACEnB,KAAK,CAAC+D,SAAN,CAAgB,YAAM;IACpB,IAAIb,cAAc,IAAI,CAAC,CAACN,KAApB,IAA6B,CAAAQ,YAAY,SAAZ,IAAAA,YAAY,WAAZ,YAAAA,YAAY,CAAEuB,MAAd,CAAqB,UAAAV,CAAC;MAAA,OAAI,CAACA,CAAC,CAAC9B,QAAP;IAAA,CAAtB,EAAuCgD,MAAvC,MAAkD,CAAnF,EAAsF;MACpF5B,gBAAgB,CAACH,YAAY,CAACc,IAAb,CAAkB,UAAAD,CAAC;QAAA,OAAI,CAACA,CAAC,CAAC9B,QAAP;MAAA,CAAnB,EAAqCS,KAAtC,CAAhB;IACD,CAFD,MAEO;MACLW,gBAAgB,CAAC,EAAD,CAAhB;IACD;EACF,CAND,EAMG,CAACH,YAAD,EAAeF,cAAf,EAA+BN,KAA/B,CANH;;EAQA,IAAMwC,kBAAkB,GAAG,SAArBA,kBAAqB,CAACX,CAAD,EAAY;IAAA;;IACrC,IAAI,2BAACf,YAAY,CAACI,OAAd,kDAAC,sBAAsBuB,QAAtB,CAA+BZ,CAAC,CAACa,MAAjC,CAAD,CAAJ,EAA+C;MAC7C,IAAIpC,cAAJ,EAAoB;QAClBC,iBAAiB,CAAC,KAAD,CAAjB;;QACA,IAAI,CAACX,SAAS,CAAC0B,IAAV,CAAe,UAACO,CAAD;UAAA,OAAOA,CAAC,CAAC7B,KAAF,KAAYA,KAAnB;QAAA,CAAf,CAAL,EAA+C;UAC7CC,QAAQ,CAAC,EAAD,CAAR;QACD;MACF;IACF;EACF,CATD;EAWA;AACF;AACA;;;EACE7C,KAAK,CAAC+D,SAAN,CAAgB,YAAM;IACpBwB,QAAQ,CAACC,gBAAT,CAA0B,OAA1B,EAAmCJ,kBAAnC;IACA,OAAO,YAAM;MACXG,QAAQ,CAACE,mBAAT,CAA6B,OAA7B,EAAsCL,kBAAtC;IACD,CAFD;EAGD,CALD;EAOA;AACF;AACA;;EACEpF,KAAK,CAAC+D,SAAN,CAAgB,YAAM;IAAA;;IACpBV,eAAe,sBAACL,YAAD,aAACA,YAAD,uBAACA,YAAY,CAAEgB,GAAd,CAAkB,UAAA0B,CAAC;MAAA;;MAAA,OAAK;QACtC9C,KAAK,EAAE8C,CAAC,CAAC9C,KAD6B;QAEtC+C,YAAY,EAAED,CAAC,CAACtB,KAFsB;QAGtCwB,SAAS,EAAEF,CAAC,CAACX,cAHyB;QAItC9C,IAAI,EAAE,YAACyD,CAAC,CAACzD,IAAH,6CAAWA,IAAX,KAAoB1B,WAAW,CAAEmF,CAAC,CAACzD,IAAF,IAAUA,IAAZ,CAAX,CAA+B,EAA/B,CAJY;QAKtCE,QAAQ,EAAEuD,CAAC,CAACvD;MAL0B,CAAL;IAAA,CAAnB,CAAD,iEAMR,EANQ,CAAf;EAOD,CARD,EAQG,CAACa,YAAD,CARH;;EAUA,IAAM6C,OAAO,GAAG,SAAVA,OAAU,CAACC,OAAD,EAAuB;IACrC,IAAMtB,OAAO,gCAAO9B,KAAP,IAAcoD,OAAd,EAAb,CADqC,CAErC;;IACAnD,QAAQ,CAAC6B,OAAD,CAAR;IACA9C,aAAa,CAAC8C,OAAO,CAACR,GAAR,CAAY,UAAAC,CAAC;MAAA,OAAIA,CAAC,CAACrB,KAAN;IAAA,CAAb,CAAD,CAAb;IAEAC,QAAQ,CAAC,EAAD,CAAR;EACD,CAPD;;EASA,IAAMkD,sBAAsB,GAAG,SAAzBA,sBAAyB,CAACnD,KAAD,EAAmB;IAChDC,QAAQ,CAACD,KAAD,CAAR;IACAG,gBAAgB,CAAC,KAAD,CAAhB;IACAI,iBAAiB,CAAC,IAAD,CAAjB;IACAjC,aAAa,IAAIA,aAAa,CAAC0B,KAAD,CAA9B;EACD,CALD;EAOA;AACF;AACA;;;EACE,IAAMoD,iBAAiB,GAAG,SAApBA,iBAAoB,CAAC3E,MAAD,EAAsB;IAAA;;IAC9C,IAAM4E,IAAI,GAAGjD,YAAH,aAAGA,YAAH,uBAAGA,YAAY,CAAEkB,IAAd,CAAmB,UAAAD,CAAC;MAAA,OAAIA,CAAC,CAACrB,KAAF,KAAYvB,MAAM,CAAC,CAAD,CAAtB;IAAA,CAApB,CAAb;IACA4E,IAAI,IAAIJ,OAAO,CAACI,IAAD,CAAf;IACAlD,gBAAgB,CAAC,IAAD,CAAhB;IACAY,QAAQ,SAAR,IAAAA,QAAQ,WAAR,iCAAAA,QAAQ,CAAEG,OAAV,wEAAmBoC,KAAnB;EACD,CALD;EAOA;AACF;AACA;AACA;;;EACE,IAAMC,kBAAkB,GAAG,SAArBA,kBAAqB,CAACC,KAAD,EAAwD;IACjF;IACA,IAAI,CAACA,KAAK,CAACC,GAAN,KAAc,OAAd,IAAyBD,KAAK,CAACC,GAAN,KAAc,GAAxC,KAAgDzD,KAApD,EAA2D;MACzD,IAAI,CAAAQ,YAAY,SAAZ,IAAAA,YAAY,WAAZ,YAAAA,YAAY,CAAEuB,MAAd,CAAqB,UAAAV,CAAC;QAAA,OAAI,CAACA,CAAC,CAAC9B,QAAP;MAAA,CAAtB,EAAuCgD,MAAvC,MAAkD,CAAtD,EAAyD;QACvDa,iBAAiB,CAAC,CAAC5C,YAAY,CAAEc,IAAd,CAAmB,UAAAD,CAAC;UAAA,OAAI,CAACA,CAAC,CAAC9B,QAAP;QAAA,CAApB,EAAsCS,KAAvC,CAAD,CAAjB;QACAwD,KAAK,CAACE,eAAN;MACD;IACF;;IAED,IAAI,CAACF,KAAK,CAACC,GAAN,KAAc,WAAd,IAA6BD,KAAK,CAACC,GAAN,KAAc,MAA3C,IAAqDD,KAAK,CAACC,GAAN,KAAc,SAAnE,IAAgFD,KAAK,CAACC,GAAN,KAAc,IAA/F,KAAwG,CAAC,EAACjD,YAAD,aAACA,YAAD,eAACA,YAAY,CAAE+B,MAAf,CAA7G,EAAoI;MAClIhC,iBAAiB,CAAC,IAAD,CAAjB;IACD;EACF,CAZD;EAcA;AACF;AACA;AACA;;;EACE,IAAMoD,mBAAmB,GAAG,SAAtBA,mBAAsB,CAAClC,KAAD,EAAyB;IACnD;IACA,IAAMmC,QAAQ,sBAAO9D,KAAP,CAAd,CAFmD,CAInD;IACA;;;IACA8D,QAAQ,CAACC,MAAT,CAAgBpC,KAAhB,EAAuB,CAAvB,EANmD,CAQnD;;IACA1B,QAAQ,oBAAK6D,QAAL,EAAR;IACA9E,aAAa,CAAC8E,QAAQ,CAACxC,GAAT,CAAa,UAACS,CAAD;MAAA,OAAOA,CAAC,CAAC7B,KAAT;IAAA,CAAb,CAAD,CAAb;EACD,CAXD;;EAaA,oBACE,MAAC,OAAD;IAAS,GAAG,EAAEc,YAAd;IAAA,wBACE,KAAC,cAAD;MAAgB,OAAO,EAAEpC,OAAzB;MACgB,GAAG,EAAEqC,QADrB;MAEgB,KAAK,EAAEjB,KAFvB;MAGgB,QAAQ,EAAEL,QAH1B;MAIgB,UAAU,EAAEO,KAJ5B;MAKgB,IAAI,EAAEb,IALtB;MAMgB,WAAW,EAAEP,WAN7B;MAOgB,cAAc,EAAEY,cAPhC;MAQgB,QAAQ,EAAED,QAR1B;MASgB,SAAS,EAAEL,SAT3B;MAUgB,iBAAiB,EAAEL,iBAVnC;MAWgB,OAAO,EAAEG,OAXzB;MAYgB,YAAY,EAAE,sBAAC8E,IAAD,EAAOrC,KAAP;QAAA,OAAiBkC,mBAAmB,CAAClC,KAAD,CAApC;MAAA,CAZ9B;MAagB,kBAAkB,EAAE0B,sBAbpC;MAcgB,cAAc,EAAEI,kBAdhC;MAegB,kBAAkB,EAAE,4BAACvD,KAAD;QAAA,OAAWO,iBAAiB,CAACP,KAAD,CAA5B;MAAA;IAfpC,GAgBoBN,IAhBpB,EADF,eAkBE,KAAC,eAAD;MACE,YAAY,EAAEoB,YADhB;MAEE,kBAAkB,EAAE;QAClBiD,MAAM,EAAE,kBAAM,CACb,CAFiB;QAGlBC,UAAU,EAAE,IAHM;QAKlBC,SAAS,EAAE,QALO;QAMlBC,UAAU,EAAE,IANM;QAOlBC,WAAW,EAAE,EAPK;QAQlBC,WAAW,EAAE,KARK;QASlBC,aAAa,EAAEjB,iBATG;QAUlBkB,KAAK,EAAE9D;MAVW,CAFtB;MAcE,OAAO,EAAEI,OAdX;MAeE,UAAU,EAAEC,UAfd;MAgBE,cAAc,EAAE,CAACH,aAAD,CAhBlB;MAiBE,kBAAkB,EAAElC,kBAAF,aAAEA,kBAAF,cAAEA,kBAAF,GAAwB,EAjB5C;MAkBE,iBAAiB,EAAE,6BAAM,CACxB,CAnBH;MAoBE,MAAM,EAAE,CAAC,CAACS,gBAAD,IAAsB,CAAC,CAACA,gBAAF,IAAsBa,KAAK,CAACyC,MAAN,GAAetD,gBAA5D,KAAkFqB,cApB5F;MAqBE,SAAS,EAAEC,iBArBb;MAsBE,MAAM,EAAE,EAtBV;MAuBE,QAAQ,EAAE,KAvBZ;MAwBE,EAAE,YAAK7B,OAAL;IAxBJ,EAlBF;EAAA,EADF;AA+CD,CAvPgC,CAA1B;;EAVLL,I;IALA8D,c;IACAnC,K;;EAKA1B,a;EACAE,kB;EACAO,U;IARAoD,c;IACAnC,K;;EAQAhB,O;EACAC,gB;EACAV,c;EACAe,gB"}
+{"version":3,"file":"ChipDropdownInput.js","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","activeDescendant","setActiveDescendant","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"],"sources":["../../src/ChipsInput/ChipDropdownInput.tsx"],"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 [activeDescendant, setActiveDescendant] = React.useState<string>();\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                      role=\"combobox\"\n                      aria-activedescendant={activeDescendant}\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        containerRef={containerRef}\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        ariaRolesType=\"input\"\n        focused={focused}\n        setFocused={setFocused}\n        onActiveDescendantChanged={(e) => setActiveDescendant(e)}\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"],"mappings":"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"}

package/dist/Dropdown/BasicDropdown.cjs

@@ -85,25 +85,30 @@ var BasicDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
       isOpen = _React$useState2[0],
       setIsOpen = _React$useState2[1];
 
-  var _React$useState3 = React.useState(false),
+  var _React$useState3 = React.useState(),
       _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
-      isLoading = _React$useState4[0],
-      setIsLoading = _React$useState4[1];
+      activeDescendant = _React$useState4[0],
+      setActiveDescendant = _React$useState4[1];
 
-  var _React$useState5 = React.useState(''),
+  var _React$useState5 = React.useState(false),
       _React$useState6 = (0, _slicedToArray2.default)(_React$useState5, 2),
-      input = _React$useState6[0],
-      setInput = _React$useState6[1];
+      isLoading = _React$useState6[0],
+      setIsLoading = _React$useState6[1];
 
-  var _React$useState7 = React.useState(null),
+  var _React$useState7 = React.useState(''),
       _React$useState8 = (0, _slicedToArray2.default)(_React$useState7, 2),
-      focused = _React$useState8[0],
-      setFocused = _React$useState8[1];
+      input = _React$useState8[0],
+      setInput = _React$useState8[1];
 
-  var _React$useState9 = React.useState(false),
+  var _React$useState9 = React.useState(null),
       _React$useState10 = (0, _slicedToArray2.default)(_React$useState9, 2),
-      keyboardNavigated = _React$useState10[0],
-      setKeyboardNavigated = _React$useState10[1];
+      focused = _React$useState10[0],
+      setFocused = _React$useState10[1];
+
+  var _React$useState11 = React.useState(false),
+      _React$useState12 = (0, _slicedToArray2.default)(_React$useState11, 2),
+      keyboardNavigated = _React$useState12[0],
+      setKeyboardNavigated = _React$useState12[1];
 
   var inputRef = React.useRef(null);
   var styledFieldRef = (0, _common.useFocusVisibleRef)([inputRef]);
@@ -196,6 +201,11 @@ var BasicDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_CommonStyling.Dropdown, {
       ref: containerRef,
+      "aria-expanded": isOpen ? true : false,
+      "aria-activedescendant": activeDescendant,
+      "aria-controls": "".concat(id, "_dropdowncontent"),
+      role: "listbox",
+      "aria-multiselectable": props.multiSelect,
       isButton: isButton || false,
       className: size ? size : '',
       readOnly: readOnly,
@@ -257,6 +267,9 @@ var BasicDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
       })), !readOnly && !disabled && /*#__PURE__*/(0, _jsxRuntime.jsx)(_DropdownContent.default, {
         ref: dropdownRef,
         containerRef: containerRef,
+        onActiveDescendantChanged: function onActiveDescendantChanged(id) {
+          return setActiveDescendant(id);
+        },
         customizationProps: {
           itemsType: itemsType,
           action: action !== null && action !== void 0 ? action : function () {},
@@ -272,6 +285,7 @@ var BasicDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
           actionIcon: actionIcon,
           actionLoading: actionLoading
         },
+        ariaRolesType: "input",
         focused: focused,
         setFocused: setFocused,
         size: size !== null && size !== void 0 ? size : _types.Size.Small,

package/dist/Dropdown/BasicDropdown.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BasicDropdown.cjs","names":["BasicDropdown","React","forwardRef","props","ref","id","list","placeholder","messageOnNoResults","itemsType","action","actionLabel","actionVariant","actionIcon","actionLoading","actionDisabled","pinTopItem","scrollable","maxHeight","disabled","readOnly","isButton","activeValidationMessage","autofilledMessage","size","margin","minWidth","className","onBlur","onSelect","rest","useState","isOpen","setIsOpen","isLoading","setIsLoading","input","setInput","focused","setFocused","keyboardNavigated","setKeyboardNavigated","inputRef","useRef","styledFieldRef","useFocusVisibleRef","dropdownRef","resetDropdown","containerRef","useFocusOutsideRef","useClickOutsideRef","handleKeyDown","e","key","handleValueSelect","values","join","multiSelect","undefined","current","focus","focusVisible","useEffect","value","useImperativeHandle","customSetIsOpen","getDisplayItems","split","map","val","trim","listDisplayLabels","filter","item","includes","l","displayLabel","handleBlur","currentTarget","contains","relatedTarget","cls","concat","defaultOnMouseDownHandler","stopPropagation","blur","Size","Small","COLORS","neutral_600","onValueUpdate","items","critical_400","disableSorting"],"sources":["../../src/Dropdown/BasicDropdown.tsx"],"sourcesContent":["import * as React from 'react';\nimport {COLORS} from '../styles';\nimport {ArrowDropDown, ArrowDropUp, Information, TechnicalWarning} from '../icons/systemicons/SystemIcons';\nimport {LoadingIndicator} from '../LoadingIndicator';\nimport {Dropdown, StyledField, InputField} from './CommonStyling';\nimport DropdownContent, {DropdownItem} from './DropdownContent';\nimport {AutofilledMessage, ErrorMessage} from '../InputFields/styling';\nimport {Size} from '../types';\nimport {defaultOnMouseDownHandler, useClickOutsideRef, useFocusVisibleRef} from '../common';\nimport {useFocusOutsideRef} from '../common';\nimport numberField from '../InputFields/NumberField';\n\ninterface BasicDropdownCommonProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect' | 'placeholder' | 'tabIndex' | 'onMouseDown' | 'onClick' | 'onKeyDown'>{\n  list: DropdownItem[];\n  itemsType?: 'normal' | 'checkbox' | 'radio';\n  action?: () => void;\n  actionLabel?: string;\n  actionVariant?: 'primary' | 'secondary' | 'tertiary' | undefined;\n  actionIcon?: React.ReactNode;\n  actionLoading?: boolean;\n  actionDisabled?: boolean;\n  pinTopItem?: boolean;\n  scrollable?: boolean;\n  maxHeight?: string;\n  placeholder?: string;\n  disableSorting?: boolean;\n  messageOnNoResults?: string;\n  disabled?: boolean;\n  readOnly?: boolean;\n  isButton?: boolean;\n  activeValidationMessage?: string;\n  autofilledMessage?: string;\n  size?: Size.Small | Size.Medium;\n  margin?: string;\n  minWidth?: string;\n}\n\ntype DropdownFilterMultiSelectProps = BasicDropdownCommonProps & {\n  multiSelect: true;\n  value?: string[];\n  onSelect: (value: string[]) => void;\n}\n\ntype DropdownFilterSingleSelectProps = BasicDropdownCommonProps & {\n  multiSelect?: false;\n  value?: string;\n  onSelect: (value: string) => void;\n}\n\ntype DropdownFilterProps = DropdownFilterSingleSelectProps | DropdownFilterMultiSelectProps;\n\nconst BasicDropdown = React.forwardRef((props: DropdownFilterProps, ref) => {\n  const {\n    id,\n    list,\n    placeholder,\n    messageOnNoResults,\n    itemsType = 'normal',\n    action,\n    actionLabel,\n    actionVariant,\n    actionIcon,\n    actionLoading,\n    actionDisabled,\n    pinTopItem,\n    scrollable = true,\n    maxHeight,\n    disabled,\n    readOnly,\n    isButton,\n    activeValidationMessage,\n    autofilledMessage,\n    size,\n    margin = '4px 0',\n    minWidth,\n    className,\n    onBlur,\n    onSelect,\n    ...rest\n  } = props;\n\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [isLoading, setIsLoading] = React.useState<boolean>(false);\n  const [input, setInput] = React.useState<string>('');\n  const [focused, setFocused] = React.useState<number | null>(null);\n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\n\n  const inputRef = React.useRef<HTMLInputElement>(null);\n  const styledFieldRef = useFocusVisibleRef([inputRef]);\n  const dropdownRef = React.useRef<HTMLDivElement>(null);\n\n  const resetDropdown = () => {\n    setIsOpen(false);\n    setFocused(null);\n  };\n\n  const containerRef = useFocusOutsideRef(resetDropdown, [dropdownRef]);\n\n  useClickOutsideRef(resetDropdown, [], containerRef);\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      setIsOpen(!isOpen);\n      setKeyboardNavigated(true);\n    }\n  };\n\n  const handleValueSelect = (values: string[]) => {\n    setInput(values.join(', '));\n\n    if (props.multiSelect === true) {\n      props.onSelect(values);\n    } else if (props.multiSelect === false || props.multiSelect === undefined) {\n      props.onSelect(values[0]);\n    }\n\n    //don't close dropdown on item select if have custom action or multiselect\n    if (actionLabel || props.multiSelect) return;\n\n    if (keyboardNavigated) {\n      styledFieldRef.current?.focus({focusVisible: true} as any);\n    }\n    setIsOpen(false);\n    setFocused(null);\n  };\n\n  React.useEffect(() => {\n    if (props.value) {\n      if (props.multiSelect) {\n        setInput(props.value.join(', '));\n      } else if (props.multiSelect === false || props.multiSelect === undefined) {\n        setInput(props.value);\n      }\n    } else {\n      setInput('');\n    }\n  }, [props.value, props.multiSelect]);\n\n  React.useEffect(() => {\n    setIsLoading(false);\n  }, [input]);\n\n  React.useEffect(() => {\n    !isOpen && setKeyboardNavigated(false);\n  }, [isOpen]);\n\n  React.useImperativeHandle(ref, () => inputRef.current, [inputRef]);\n\n  const customSetIsOpen = (isOpen: boolean) => {\n    setIsOpen(isOpen);\n  };\n\n  const getDisplayItems = () => {\n    const values = input.split(',').map((val) => val.trim());\n    const listDisplayLabels = list.filter((item) => values.includes(item.value)).map((l) => l.displayLabel);\n    return listDisplayLabels.join(', ');\n  };\n\n  const handleBlur = (e: React.FocusEvent<HTMLDivElement>) => {\n    // @ts-ignore\n    if (!e.currentTarget.contains(e.relatedTarget)) {\n      onBlur && onBlur(e);\n    }\n  };\n\n  const cls = (isOpen ? 'expanded ' : '').concat(size ? size : '').concat(isButton ? ' button ' : '').concat(className ? ` ${className}` : '');\n  \n  return (\n    <>\n      <Dropdown ref={containerRef}\n                isButton={isButton || false}\n                className={size ? size : ''}\n                readOnly={readOnly}\n                disabled={disabled}\n                margin={margin}\n                onBlur={handleBlur}\n                minWidth={minWidth}>\n        <StyledField\n          ref={styledFieldRef}\n          className={cls}\n          onMouseDown={defaultOnMouseDownHandler}\n          onClick={(e) => {\n            if (!readOnly && !disabled) {\n              e.stopPropagation();\n              setIsOpen(!isOpen);\n              if (isOpen) {\n                inputRef.current?.blur();\n              } else {\n                inputRef.current?.focus();\n              }\n            }\n          }}\n          tabIndex={disabled || readOnly ? -1 : 0}\n          disabled={disabled || false}\n          readOnly={readOnly || false}\n          isPlaceholder={!input}\n          placeholder={placeholder}\n          showValidationMessage={!!activeValidationMessage}\n          onKeyDown={handleKeyDown}\n          minWidth={minWidth}\n          {...rest}>\n          <InputField\n            ref={inputRef}\n            type=\"search\"\n            readOnly\n            placeholder={placeholder}\n            value={getDisplayItems()}\n            className={size ? `${size} value` : 'value'}\n            tabIndex={-1}\n            disabled={disabled || false}\n          />\n          {isLoading ? <LoadingIndicator size={Size.Small} color={COLORS.neutral_600}/> : null}\n          <div className={'icon dropdown-arrow'}>\n            {isOpen ? <ArrowDropUp size=\"24px\" className={size ? size : ''}/> :\n              <ArrowDropDown size=\"24px\" className={size ? size : ''}/>}\n          </div>\n        </StyledField>\n        {!readOnly && !disabled && (\n          <DropdownContent\n            ref={dropdownRef}\n            containerRef={containerRef}\n            customizationProps={{\n              itemsType: itemsType,\n              action: action ?? (() => {\n              }),\n              actionLabel: actionLabel,\n              actionVariant: actionVariant,\n              actionDisabled: actionDisabled,\n              scrollable: scrollable,\n              onValueUpdate: handleValueSelect,\n              items: list,\n              multiSelect: props.multiSelect,\n              pinTopItem: pinTopItem,\n              maxHeight: maxHeight,\n              actionIcon: actionIcon,\n              actionLoading: actionLoading,\n            }}\n            focused={focused}\n            setFocused={setFocused}\n            size={size ?? Size.Small}\n            filter={''}\n            isOpen={isOpen}\n            setIsOpen={customSetIsOpen}\n            messageOnNoResults={messageOnNoResults ?? ''}\n            outline={keyboardNavigated}\n            isButton={isButton || false}\n            selectedValues={props.multiSelect ? props.value || [] : [props.value || '']}\n            setSelectedValues={handleValueSelect}\n            id={`${id}_dropdowncontent`}\n          />\n        )}\n      </Dropdown>\n      {activeValidationMessage && (\n        <ErrorMessage>\n          <TechnicalWarning color={COLORS.critical_400}/>\n          <span>{activeValidationMessage}</span>\n        </ErrorMessage>\n      )}\n      {autofilledMessage && (\n        <AutofilledMessage>\n          <Information color={COLORS.neutral_600}/>\n          <span>{autofilledMessage}</span>\n        </AutofilledMessage>\n      )}\n    </>\n  );\n});\n\nexport default BasicDropdown;\n"],"mappings":"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"}
+{"version":3,"file":"BasicDropdown.cjs","names":["BasicDropdown","React","forwardRef","props","ref","id","list","placeholder","messageOnNoResults","itemsType","action","actionLabel","actionVariant","actionIcon","actionLoading","actionDisabled","pinTopItem","scrollable","maxHeight","disabled","readOnly","isButton","activeValidationMessage","autofilledMessage","size","margin","minWidth","className","onBlur","onSelect","rest","useState","isOpen","setIsOpen","activeDescendant","setActiveDescendant","isLoading","setIsLoading","input","setInput","focused","setFocused","keyboardNavigated","setKeyboardNavigated","inputRef","useRef","styledFieldRef","useFocusVisibleRef","dropdownRef","resetDropdown","containerRef","useFocusOutsideRef","useClickOutsideRef","handleKeyDown","e","key","handleValueSelect","values","join","multiSelect","undefined","current","focus","focusVisible","useEffect","value","useImperativeHandle","customSetIsOpen","getDisplayItems","split","map","val","trim","listDisplayLabels","filter","item","includes","l","displayLabel","handleBlur","currentTarget","contains","relatedTarget","cls","concat","defaultOnMouseDownHandler","stopPropagation","blur","Size","Small","COLORS","neutral_600","onValueUpdate","items","critical_400","disableSorting"],"sources":["../../src/Dropdown/BasicDropdown.tsx"],"sourcesContent":["import * as React from 'react';\nimport {COLORS} from '../styles';\nimport {ArrowDropDown, ArrowDropUp, Information, TechnicalWarning} from '../icons/systemicons/SystemIcons';\nimport {LoadingIndicator} from '../LoadingIndicator';\nimport {Dropdown, StyledField, InputField} from './CommonStyling';\nimport DropdownContent, {DropdownItem} from './DropdownContent';\nimport {AutofilledMessage, ErrorMessage} from '../InputFields/styling';\nimport {Size} from '../types';\nimport {defaultOnMouseDownHandler, useClickOutsideRef, useFocusVisibleRef} from '../common';\nimport {useFocusOutsideRef} from '../common';\nimport numberField from '../InputFields/NumberField';\n\ninterface BasicDropdownCommonProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect' | 'placeholder' | 'tabIndex' | 'onMouseDown' | 'onClick' | 'onKeyDown'>{\n  list: DropdownItem[];\n  itemsType?: 'normal' | 'checkbox' | 'radio';\n  action?: () => void;\n  actionLabel?: string;\n  actionVariant?: 'primary' | 'secondary' | 'tertiary' | undefined;\n  actionIcon?: React.ReactNode;\n  actionLoading?: boolean;\n  actionDisabled?: boolean;\n  pinTopItem?: boolean;\n  scrollable?: boolean;\n  maxHeight?: string;\n  placeholder?: string;\n  disableSorting?: boolean;\n  messageOnNoResults?: string;\n  disabled?: boolean;\n  readOnly?: boolean;\n  isButton?: boolean;\n  activeValidationMessage?: string;\n  autofilledMessage?: string;\n  size?: Size.Small | Size.Medium;\n  margin?: string;\n  minWidth?: string;\n}\n\ntype DropdownFilterMultiSelectProps = BasicDropdownCommonProps & {\n  multiSelect: true;\n  value?: string[];\n  onSelect: (value: string[]) => void;\n}\n\ntype DropdownFilterSingleSelectProps = BasicDropdownCommonProps & {\n  multiSelect?: false;\n  value?: string;\n  onSelect: (value: string) => void;\n}\n\ntype DropdownFilterProps = DropdownFilterSingleSelectProps | DropdownFilterMultiSelectProps;\n\nconst BasicDropdown = React.forwardRef((props: DropdownFilterProps, ref) => {\n  const {\n    id,\n    list,\n    placeholder,\n    messageOnNoResults,\n    itemsType = 'normal',\n    action,\n    actionLabel,\n    actionVariant,\n    actionIcon,\n    actionLoading,\n    actionDisabled,\n    pinTopItem,\n    scrollable = true,\n    maxHeight,\n    disabled,\n    readOnly,\n    isButton,\n    activeValidationMessage,\n    autofilledMessage,\n    size,\n    margin = '4px 0',\n    minWidth,\n    className,\n    onBlur,\n    onSelect,\n    ...rest\n  } = props;\n\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [activeDescendant, setActiveDescendant] = React.useState<string>();\n  const [isLoading, setIsLoading] = React.useState<boolean>(false);\n  const [input, setInput] = React.useState<string>('');\n  const [focused, setFocused] = React.useState<number | null>(null);\n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\n\n  const inputRef = React.useRef<HTMLInputElement>(null);\n  const styledFieldRef = useFocusVisibleRef([inputRef]);\n  const dropdownRef = React.useRef<HTMLDivElement>(null);\n\n  const resetDropdown = () => {\n    setIsOpen(false);\n    setFocused(null);\n  };\n\n  const containerRef = useFocusOutsideRef(resetDropdown, [dropdownRef]);\n\n  useClickOutsideRef(resetDropdown, [], containerRef);\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      setIsOpen(!isOpen);\n      setKeyboardNavigated(true);\n    }\n  };\n\n  const handleValueSelect = (values: string[]) => {\n    setInput(values.join(', '));\n\n    if (props.multiSelect === true) {\n      props.onSelect(values);\n    } else if (props.multiSelect === false || props.multiSelect === undefined) {\n      props.onSelect(values[0]);\n    }\n\n    //don't close dropdown on item select if have custom action or multiselect\n    if (actionLabel || props.multiSelect) return;\n\n    if (keyboardNavigated) {\n      styledFieldRef.current?.focus({focusVisible: true} as any);\n    }\n    setIsOpen(false);\n    setFocused(null);\n  };\n\n  React.useEffect(() => {\n    if (props.value) {\n      if (props.multiSelect) {\n        setInput(props.value.join(', '));\n      } else if (props.multiSelect === false || props.multiSelect === undefined) {\n        setInput(props.value);\n      }\n    } else {\n      setInput('');\n    }\n  }, [props.value, props.multiSelect]);\n\n  React.useEffect(() => {\n    setIsLoading(false);\n  }, [input]);\n\n  React.useEffect(() => {\n    !isOpen && setKeyboardNavigated(false);\n  }, [isOpen]);\n\n  React.useImperativeHandle(ref, () => inputRef.current, [inputRef]);\n\n  const customSetIsOpen = (isOpen: boolean) => {\n    setIsOpen(isOpen);\n  };\n\n  const getDisplayItems = () => {\n    const values = input.split(',').map((val) => val.trim());\n    const listDisplayLabels = list.filter((item) => values.includes(item.value)).map((l) => l.displayLabel);\n    return listDisplayLabels.join(', ');\n  };\n\n  const handleBlur = (e: React.FocusEvent<HTMLDivElement>) => {\n    // @ts-ignore\n    if (!e.currentTarget.contains(e.relatedTarget)) {\n      onBlur && onBlur(e);\n    }\n  };\n\n  const cls = (isOpen ? 'expanded ' : '').concat(size ? size : '').concat(isButton ? ' button ' : '').concat(className ? ` ${className}` : '');\n  \n  return (\n    <>\n      <Dropdown ref={containerRef}\n                aria-expanded={isOpen ? true : false}\n                aria-activedescendant={activeDescendant}\n                aria-controls={`${id}_dropdowncontent`}\n                role=\"listbox\"\n                aria-multiselectable={props.multiSelect}\n                isButton={isButton || false}\n                className={size ? size : ''}\n                readOnly={readOnly}\n                disabled={disabled}\n                margin={margin}\n                onBlur={handleBlur}\n                minWidth={minWidth}>\n        <StyledField\n          ref={styledFieldRef}\n          className={cls}\n          onMouseDown={defaultOnMouseDownHandler}\n          onClick={(e) => {\n            if (!readOnly && !disabled) {\n              e.stopPropagation();\n              setIsOpen(!isOpen);\n              if (isOpen) {\n                inputRef.current?.blur();\n              } else {\n                inputRef.current?.focus();\n              }\n            }\n          }}\n          tabIndex={disabled || readOnly ? -1 : 0}\n          disabled={disabled || false}\n          readOnly={readOnly || false}\n          isPlaceholder={!input}\n          placeholder={placeholder}\n          showValidationMessage={!!activeValidationMessage}\n          onKeyDown={handleKeyDown}\n          minWidth={minWidth}\n          {...rest}>\n          <InputField\n            ref={inputRef}\n            type=\"search\"\n            readOnly\n            placeholder={placeholder}\n            value={getDisplayItems()}\n            className={size ? `${size} value` : 'value'}\n            tabIndex={-1}\n            disabled={disabled || false}\n          />\n          {isLoading ? <LoadingIndicator size={Size.Small} color={COLORS.neutral_600}/> : null}\n          <div className={'icon dropdown-arrow'}>\n            {isOpen ? <ArrowDropUp size=\"24px\" className={size ? size : ''}/> :\n              <ArrowDropDown size=\"24px\" className={size ? size : ''}/>}\n          </div>\n        </StyledField>\n        {!readOnly && !disabled && (\n          <DropdownContent\n            ref={dropdownRef}\n            containerRef={containerRef}\n            onActiveDescendantChanged={(id) => setActiveDescendant(id)}\n            customizationProps={{\n              itemsType: itemsType,\n              action: action ?? (() => {\n              }),\n              actionLabel: actionLabel,\n              actionVariant: actionVariant,\n              actionDisabled: actionDisabled,\n              scrollable: scrollable,\n              onValueUpdate: handleValueSelect,\n              items: list,\n              multiSelect: props.multiSelect,\n              pinTopItem: pinTopItem,\n              maxHeight: maxHeight,\n              actionIcon: actionIcon,\n              actionLoading: actionLoading,\n            }}\n            ariaRolesType=\"input\"\n            focused={focused}\n            setFocused={setFocused}\n            size={size ?? Size.Small}\n            filter={''}\n            isOpen={isOpen}\n            setIsOpen={customSetIsOpen}\n            messageOnNoResults={messageOnNoResults ?? ''}\n            outline={keyboardNavigated}\n            isButton={isButton || false}\n            selectedValues={props.multiSelect ? props.value || [] : [props.value || '']}\n            setSelectedValues={handleValueSelect}\n            id={`${id}_dropdowncontent`}\n          />\n        )}\n      </Dropdown>\n      {activeValidationMessage && (\n        <ErrorMessage>\n          <TechnicalWarning color={COLORS.critical_400}/>\n          <span>{activeValidationMessage}</span>\n        </ErrorMessage>\n      )}\n      {autofilledMessage && (\n        <AutofilledMessage>\n          <Information color={COLORS.neutral_600}/>\n          <span>{autofilledMessage}</span>\n        </AutofilledMessage>\n      )}\n    </>\n  );\n});\n\nexport default BasicDropdown;\n"],"mappings":"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"}

package/dist/Dropdown/BasicDropdown.js

@@ -60,25 +60,30 @@ var BasicDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
       isOpen = _React$useState2[0],
       setIsOpen = _React$useState2[1];
 
-  var _React$useState3 = React.useState(false),
+  var _React$useState3 = React.useState(),
       _React$useState4 = _slicedToArray(_React$useState3, 2),
-      isLoading = _React$useState4[0],
-      setIsLoading = _React$useState4[1];
+      activeDescendant = _React$useState4[0],
+      setActiveDescendant = _React$useState4[1];
 
-  var _React$useState5 = React.useState(''),
+  var _React$useState5 = React.useState(false),
       _React$useState6 = _slicedToArray(_React$useState5, 2),
-      input = _React$useState6[0],
-      setInput = _React$useState6[1];
+      isLoading = _React$useState6[0],
+      setIsLoading = _React$useState6[1];
 
-  var _React$useState7 = React.useState(null),
+  var _React$useState7 = React.useState(''),
       _React$useState8 = _slicedToArray(_React$useState7, 2),
-      focused = _React$useState8[0],
-      setFocused = _React$useState8[1];
+      input = _React$useState8[0],
+      setInput = _React$useState8[1];
 
-  var _React$useState9 = React.useState(false),
+  var _React$useState9 = React.useState(null),
       _React$useState10 = _slicedToArray(_React$useState9, 2),
-      keyboardNavigated = _React$useState10[0],
-      setKeyboardNavigated = _React$useState10[1];
+      focused = _React$useState10[0],
+      setFocused = _React$useState10[1];
+
+  var _React$useState11 = React.useState(false),
+      _React$useState12 = _slicedToArray(_React$useState11, 2),
+      keyboardNavigated = _React$useState12[0],
+      setKeyboardNavigated = _React$useState12[1];
 
   var inputRef = React.useRef(null);
   var styledFieldRef = useFocusVisibleRef([inputRef]);
@@ -171,6 +176,11 @@ var BasicDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
   return /*#__PURE__*/_jsxs(_Fragment, {
     children: [/*#__PURE__*/_jsxs(Dropdown, {
       ref: containerRef,
+      "aria-expanded": isOpen ? true : false,
+      "aria-activedescendant": activeDescendant,
+      "aria-controls": "".concat(id, "_dropdowncontent"),
+      role: "listbox",
+      "aria-multiselectable": props.multiSelect,
       isButton: isButton || false,
       className: size ? size : '',
       readOnly: readOnly,
@@ -232,6 +242,9 @@ var BasicDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
       })), !readOnly && !disabled && /*#__PURE__*/_jsx(DropdownContent, {
         ref: dropdownRef,
         containerRef: containerRef,
+        onActiveDescendantChanged: function onActiveDescendantChanged(id) {
+          return setActiveDescendant(id);
+        },
         customizationProps: {
           itemsType: itemsType,
           action: action !== null && action !== void 0 ? action : function () {},
@@ -247,6 +260,7 @@ var BasicDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
           actionIcon: actionIcon,
           actionLoading: actionLoading
         },
+        ariaRolesType: "input",
         focused: focused,
         setFocused: setFocused,
         size: size !== null && size !== void 0 ? size : Size.Small,

package/dist/Dropdown/BasicDropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"BasicDropdown.js","names":["React","COLORS","ArrowDropDown","ArrowDropUp","Information","TechnicalWarning","LoadingIndicator","Dropdown","StyledField","InputField","DropdownContent","AutofilledMessage","ErrorMessage","Size","defaultOnMouseDownHandler","useClickOutsideRef","useFocusVisibleRef","useFocusOutsideRef","BasicDropdown","forwardRef","props","ref","id","list","placeholder","messageOnNoResults","itemsType","action","actionLabel","actionVariant","actionIcon","actionLoading","actionDisabled","pinTopItem","scrollable","maxHeight","disabled","readOnly","isButton","activeValidationMessage","autofilledMessage","size","margin","minWidth","className","onBlur","onSelect","rest","useState","isOpen","setIsOpen","isLoading","setIsLoading","input","setInput","focused","setFocused","keyboardNavigated","setKeyboardNavigated","inputRef","useRef","styledFieldRef","dropdownRef","resetDropdown","containerRef","handleKeyDown","e","key","handleValueSelect","values","join","multiSelect","undefined","current","focus","focusVisible","useEffect","value","useImperativeHandle","customSetIsOpen","getDisplayItems","split","map","val","trim","listDisplayLabels","filter","item","includes","l","displayLabel","handleBlur","currentTarget","contains","relatedTarget","cls","concat","stopPropagation","blur","Small","neutral_600","onValueUpdate","items","critical_400","disableSorting"],"sources":["../../src/Dropdown/BasicDropdown.tsx"],"sourcesContent":["import * as React from 'react';\nimport {COLORS} from '../styles';\nimport {ArrowDropDown, ArrowDropUp, Information, TechnicalWarning} from '../icons/systemicons/SystemIcons';\nimport {LoadingIndicator} from '../LoadingIndicator';\nimport {Dropdown, StyledField, InputField} from './CommonStyling';\nimport DropdownContent, {DropdownItem} from './DropdownContent';\nimport {AutofilledMessage, ErrorMessage} from '../InputFields/styling';\nimport {Size} from '../types';\nimport {defaultOnMouseDownHandler, useClickOutsideRef, useFocusVisibleRef} from '../common';\nimport {useFocusOutsideRef} from '../common';\nimport numberField from '../InputFields/NumberField';\n\ninterface BasicDropdownCommonProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect' | 'placeholder' | 'tabIndex' | 'onMouseDown' | 'onClick' | 'onKeyDown'>{\n  list: DropdownItem[];\n  itemsType?: 'normal' | 'checkbox' | 'radio';\n  action?: () => void;\n  actionLabel?: string;\n  actionVariant?: 'primary' | 'secondary' | 'tertiary' | undefined;\n  actionIcon?: React.ReactNode;\n  actionLoading?: boolean;\n  actionDisabled?: boolean;\n  pinTopItem?: boolean;\n  scrollable?: boolean;\n  maxHeight?: string;\n  placeholder?: string;\n  disableSorting?: boolean;\n  messageOnNoResults?: string;\n  disabled?: boolean;\n  readOnly?: boolean;\n  isButton?: boolean;\n  activeValidationMessage?: string;\n  autofilledMessage?: string;\n  size?: Size.Small | Size.Medium;\n  margin?: string;\n  minWidth?: string;\n}\n\ntype DropdownFilterMultiSelectProps = BasicDropdownCommonProps & {\n  multiSelect: true;\n  value?: string[];\n  onSelect: (value: string[]) => void;\n}\n\ntype DropdownFilterSingleSelectProps = BasicDropdownCommonProps & {\n  multiSelect?: false;\n  value?: string;\n  onSelect: (value: string) => void;\n}\n\ntype DropdownFilterProps = DropdownFilterSingleSelectProps | DropdownFilterMultiSelectProps;\n\nconst BasicDropdown = React.forwardRef((props: DropdownFilterProps, ref) => {\n  const {\n    id,\n    list,\n    placeholder,\n    messageOnNoResults,\n    itemsType = 'normal',\n    action,\n    actionLabel,\n    actionVariant,\n    actionIcon,\n    actionLoading,\n    actionDisabled,\n    pinTopItem,\n    scrollable = true,\n    maxHeight,\n    disabled,\n    readOnly,\n    isButton,\n    activeValidationMessage,\n    autofilledMessage,\n    size,\n    margin = '4px 0',\n    minWidth,\n    className,\n    onBlur,\n    onSelect,\n    ...rest\n  } = props;\n\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [isLoading, setIsLoading] = React.useState<boolean>(false);\n  const [input, setInput] = React.useState<string>('');\n  const [focused, setFocused] = React.useState<number | null>(null);\n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\n\n  const inputRef = React.useRef<HTMLInputElement>(null);\n  const styledFieldRef = useFocusVisibleRef([inputRef]);\n  const dropdownRef = React.useRef<HTMLDivElement>(null);\n\n  const resetDropdown = () => {\n    setIsOpen(false);\n    setFocused(null);\n  };\n\n  const containerRef = useFocusOutsideRef(resetDropdown, [dropdownRef]);\n\n  useClickOutsideRef(resetDropdown, [], containerRef);\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      setIsOpen(!isOpen);\n      setKeyboardNavigated(true);\n    }\n  };\n\n  const handleValueSelect = (values: string[]) => {\n    setInput(values.join(', '));\n\n    if (props.multiSelect === true) {\n      props.onSelect(values);\n    } else if (props.multiSelect === false || props.multiSelect === undefined) {\n      props.onSelect(values[0]);\n    }\n\n    //don't close dropdown on item select if have custom action or multiselect\n    if (actionLabel || props.multiSelect) return;\n\n    if (keyboardNavigated) {\n      styledFieldRef.current?.focus({focusVisible: true} as any);\n    }\n    setIsOpen(false);\n    setFocused(null);\n  };\n\n  React.useEffect(() => {\n    if (props.value) {\n      if (props.multiSelect) {\n        setInput(props.value.join(', '));\n      } else if (props.multiSelect === false || props.multiSelect === undefined) {\n        setInput(props.value);\n      }\n    } else {\n      setInput('');\n    }\n  }, [props.value, props.multiSelect]);\n\n  React.useEffect(() => {\n    setIsLoading(false);\n  }, [input]);\n\n  React.useEffect(() => {\n    !isOpen && setKeyboardNavigated(false);\n  }, [isOpen]);\n\n  React.useImperativeHandle(ref, () => inputRef.current, [inputRef]);\n\n  const customSetIsOpen = (isOpen: boolean) => {\n    setIsOpen(isOpen);\n  };\n\n  const getDisplayItems = () => {\n    const values = input.split(',').map((val) => val.trim());\n    const listDisplayLabels = list.filter((item) => values.includes(item.value)).map((l) => l.displayLabel);\n    return listDisplayLabels.join(', ');\n  };\n\n  const handleBlur = (e: React.FocusEvent<HTMLDivElement>) => {\n    // @ts-ignore\n    if (!e.currentTarget.contains(e.relatedTarget)) {\n      onBlur && onBlur(e);\n    }\n  };\n\n  const cls = (isOpen ? 'expanded ' : '').concat(size ? size : '').concat(isButton ? ' button ' : '').concat(className ? ` ${className}` : '');\n  \n  return (\n    <>\n      <Dropdown ref={containerRef}\n                isButton={isButton || false}\n                className={size ? size : ''}\n                readOnly={readOnly}\n                disabled={disabled}\n                margin={margin}\n                onBlur={handleBlur}\n                minWidth={minWidth}>\n        <StyledField\n          ref={styledFieldRef}\n          className={cls}\n          onMouseDown={defaultOnMouseDownHandler}\n          onClick={(e) => {\n            if (!readOnly && !disabled) {\n              e.stopPropagation();\n              setIsOpen(!isOpen);\n              if (isOpen) {\n                inputRef.current?.blur();\n              } else {\n                inputRef.current?.focus();\n              }\n            }\n          }}\n          tabIndex={disabled || readOnly ? -1 : 0}\n          disabled={disabled || false}\n          readOnly={readOnly || false}\n          isPlaceholder={!input}\n          placeholder={placeholder}\n          showValidationMessage={!!activeValidationMessage}\n          onKeyDown={handleKeyDown}\n          minWidth={minWidth}\n          {...rest}>\n          <InputField\n            ref={inputRef}\n            type=\"search\"\n            readOnly\n            placeholder={placeholder}\n            value={getDisplayItems()}\n            className={size ? `${size} value` : 'value'}\n            tabIndex={-1}\n            disabled={disabled || false}\n          />\n          {isLoading ? <LoadingIndicator size={Size.Small} color={COLORS.neutral_600}/> : null}\n          <div className={'icon dropdown-arrow'}>\n            {isOpen ? <ArrowDropUp size=\"24px\" className={size ? size : ''}/> :\n              <ArrowDropDown size=\"24px\" className={size ? size : ''}/>}\n          </div>\n        </StyledField>\n        {!readOnly && !disabled && (\n          <DropdownContent\n            ref={dropdownRef}\n            containerRef={containerRef}\n            customizationProps={{\n              itemsType: itemsType,\n              action: action ?? (() => {\n              }),\n              actionLabel: actionLabel,\n              actionVariant: actionVariant,\n              actionDisabled: actionDisabled,\n              scrollable: scrollable,\n              onValueUpdate: handleValueSelect,\n              items: list,\n              multiSelect: props.multiSelect,\n              pinTopItem: pinTopItem,\n              maxHeight: maxHeight,\n              actionIcon: actionIcon,\n              actionLoading: actionLoading,\n            }}\n            focused={focused}\n            setFocused={setFocused}\n            size={size ?? Size.Small}\n            filter={''}\n            isOpen={isOpen}\n            setIsOpen={customSetIsOpen}\n            messageOnNoResults={messageOnNoResults ?? ''}\n            outline={keyboardNavigated}\n            isButton={isButton || false}\n            selectedValues={props.multiSelect ? props.value || [] : [props.value || '']}\n            setSelectedValues={handleValueSelect}\n            id={`${id}_dropdowncontent`}\n          />\n        )}\n      </Dropdown>\n      {activeValidationMessage && (\n        <ErrorMessage>\n          <TechnicalWarning color={COLORS.critical_400}/>\n          <span>{activeValidationMessage}</span>\n        </ErrorMessage>\n      )}\n      {autofilledMessage && (\n        <AutofilledMessage>\n          <Information color={COLORS.neutral_600}/>\n          <span>{autofilledMessage}</span>\n        </AutofilledMessage>\n      )}\n    </>\n  );\n});\n\nexport default BasicDropdown;\n"],"mappings":"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"}
+{"version":3,"file":"BasicDropdown.js","names":["React","COLORS","ArrowDropDown","ArrowDropUp","Information","TechnicalWarning","LoadingIndicator","Dropdown","StyledField","InputField","DropdownContent","AutofilledMessage","ErrorMessage","Size","defaultOnMouseDownHandler","useClickOutsideRef","useFocusVisibleRef","useFocusOutsideRef","BasicDropdown","forwardRef","props","ref","id","list","placeholder","messageOnNoResults","itemsType","action","actionLabel","actionVariant","actionIcon","actionLoading","actionDisabled","pinTopItem","scrollable","maxHeight","disabled","readOnly","isButton","activeValidationMessage","autofilledMessage","size","margin","minWidth","className","onBlur","onSelect","rest","useState","isOpen","setIsOpen","activeDescendant","setActiveDescendant","isLoading","setIsLoading","input","setInput","focused","setFocused","keyboardNavigated","setKeyboardNavigated","inputRef","useRef","styledFieldRef","dropdownRef","resetDropdown","containerRef","handleKeyDown","e","key","handleValueSelect","values","join","multiSelect","undefined","current","focus","focusVisible","useEffect","value","useImperativeHandle","customSetIsOpen","getDisplayItems","split","map","val","trim","listDisplayLabels","filter","item","includes","l","displayLabel","handleBlur","currentTarget","contains","relatedTarget","cls","concat","stopPropagation","blur","Small","neutral_600","onValueUpdate","items","critical_400","disableSorting"],"sources":["../../src/Dropdown/BasicDropdown.tsx"],"sourcesContent":["import * as React from 'react';\nimport {COLORS} from '../styles';\nimport {ArrowDropDown, ArrowDropUp, Information, TechnicalWarning} from '../icons/systemicons/SystemIcons';\nimport {LoadingIndicator} from '../LoadingIndicator';\nimport {Dropdown, StyledField, InputField} from './CommonStyling';\nimport DropdownContent, {DropdownItem} from './DropdownContent';\nimport {AutofilledMessage, ErrorMessage} from '../InputFields/styling';\nimport {Size} from '../types';\nimport {defaultOnMouseDownHandler, useClickOutsideRef, useFocusVisibleRef} from '../common';\nimport {useFocusOutsideRef} from '../common';\nimport numberField from '../InputFields/NumberField';\n\ninterface BasicDropdownCommonProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect' | 'placeholder' | 'tabIndex' | 'onMouseDown' | 'onClick' | 'onKeyDown'>{\n  list: DropdownItem[];\n  itemsType?: 'normal' | 'checkbox' | 'radio';\n  action?: () => void;\n  actionLabel?: string;\n  actionVariant?: 'primary' | 'secondary' | 'tertiary' | undefined;\n  actionIcon?: React.ReactNode;\n  actionLoading?: boolean;\n  actionDisabled?: boolean;\n  pinTopItem?: boolean;\n  scrollable?: boolean;\n  maxHeight?: string;\n  placeholder?: string;\n  disableSorting?: boolean;\n  messageOnNoResults?: string;\n  disabled?: boolean;\n  readOnly?: boolean;\n  isButton?: boolean;\n  activeValidationMessage?: string;\n  autofilledMessage?: string;\n  size?: Size.Small | Size.Medium;\n  margin?: string;\n  minWidth?: string;\n}\n\ntype DropdownFilterMultiSelectProps = BasicDropdownCommonProps & {\n  multiSelect: true;\n  value?: string[];\n  onSelect: (value: string[]) => void;\n}\n\ntype DropdownFilterSingleSelectProps = BasicDropdownCommonProps & {\n  multiSelect?: false;\n  value?: string;\n  onSelect: (value: string) => void;\n}\n\ntype DropdownFilterProps = DropdownFilterSingleSelectProps | DropdownFilterMultiSelectProps;\n\nconst BasicDropdown = React.forwardRef((props: DropdownFilterProps, ref) => {\n  const {\n    id,\n    list,\n    placeholder,\n    messageOnNoResults,\n    itemsType = 'normal',\n    action,\n    actionLabel,\n    actionVariant,\n    actionIcon,\n    actionLoading,\n    actionDisabled,\n    pinTopItem,\n    scrollable = true,\n    maxHeight,\n    disabled,\n    readOnly,\n    isButton,\n    activeValidationMessage,\n    autofilledMessage,\n    size,\n    margin = '4px 0',\n    minWidth,\n    className,\n    onBlur,\n    onSelect,\n    ...rest\n  } = props;\n\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [activeDescendant, setActiveDescendant] = React.useState<string>();\n  const [isLoading, setIsLoading] = React.useState<boolean>(false);\n  const [input, setInput] = React.useState<string>('');\n  const [focused, setFocused] = React.useState<number | null>(null);\n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\n\n  const inputRef = React.useRef<HTMLInputElement>(null);\n  const styledFieldRef = useFocusVisibleRef([inputRef]);\n  const dropdownRef = React.useRef<HTMLDivElement>(null);\n\n  const resetDropdown = () => {\n    setIsOpen(false);\n    setFocused(null);\n  };\n\n  const containerRef = useFocusOutsideRef(resetDropdown, [dropdownRef]);\n\n  useClickOutsideRef(resetDropdown, [], containerRef);\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      setIsOpen(!isOpen);\n      setKeyboardNavigated(true);\n    }\n  };\n\n  const handleValueSelect = (values: string[]) => {\n    setInput(values.join(', '));\n\n    if (props.multiSelect === true) {\n      props.onSelect(values);\n    } else if (props.multiSelect === false || props.multiSelect === undefined) {\n      props.onSelect(values[0]);\n    }\n\n    //don't close dropdown on item select if have custom action or multiselect\n    if (actionLabel || props.multiSelect) return;\n\n    if (keyboardNavigated) {\n      styledFieldRef.current?.focus({focusVisible: true} as any);\n    }\n    setIsOpen(false);\n    setFocused(null);\n  };\n\n  React.useEffect(() => {\n    if (props.value) {\n      if (props.multiSelect) {\n        setInput(props.value.join(', '));\n      } else if (props.multiSelect === false || props.multiSelect === undefined) {\n        setInput(props.value);\n      }\n    } else {\n      setInput('');\n    }\n  }, [props.value, props.multiSelect]);\n\n  React.useEffect(() => {\n    setIsLoading(false);\n  }, [input]);\n\n  React.useEffect(() => {\n    !isOpen && setKeyboardNavigated(false);\n  }, [isOpen]);\n\n  React.useImperativeHandle(ref, () => inputRef.current, [inputRef]);\n\n  const customSetIsOpen = (isOpen: boolean) => {\n    setIsOpen(isOpen);\n  };\n\n  const getDisplayItems = () => {\n    const values = input.split(',').map((val) => val.trim());\n    const listDisplayLabels = list.filter((item) => values.includes(item.value)).map((l) => l.displayLabel);\n    return listDisplayLabels.join(', ');\n  };\n\n  const handleBlur = (e: React.FocusEvent<HTMLDivElement>) => {\n    // @ts-ignore\n    if (!e.currentTarget.contains(e.relatedTarget)) {\n      onBlur && onBlur(e);\n    }\n  };\n\n  const cls = (isOpen ? 'expanded ' : '').concat(size ? size : '').concat(isButton ? ' button ' : '').concat(className ? ` ${className}` : '');\n  \n  return (\n    <>\n      <Dropdown ref={containerRef}\n                aria-expanded={isOpen ? true : false}\n                aria-activedescendant={activeDescendant}\n                aria-controls={`${id}_dropdowncontent`}\n                role=\"listbox\"\n                aria-multiselectable={props.multiSelect}\n                isButton={isButton || false}\n                className={size ? size : ''}\n                readOnly={readOnly}\n                disabled={disabled}\n                margin={margin}\n                onBlur={handleBlur}\n                minWidth={minWidth}>\n        <StyledField\n          ref={styledFieldRef}\n          className={cls}\n          onMouseDown={defaultOnMouseDownHandler}\n          onClick={(e) => {\n            if (!readOnly && !disabled) {\n              e.stopPropagation();\n              setIsOpen(!isOpen);\n              if (isOpen) {\n                inputRef.current?.blur();\n              } else {\n                inputRef.current?.focus();\n              }\n            }\n          }}\n          tabIndex={disabled || readOnly ? -1 : 0}\n          disabled={disabled || false}\n          readOnly={readOnly || false}\n          isPlaceholder={!input}\n          placeholder={placeholder}\n          showValidationMessage={!!activeValidationMessage}\n          onKeyDown={handleKeyDown}\n          minWidth={minWidth}\n          {...rest}>\n          <InputField\n            ref={inputRef}\n            type=\"search\"\n            readOnly\n            placeholder={placeholder}\n            value={getDisplayItems()}\n            className={size ? `${size} value` : 'value'}\n            tabIndex={-1}\n            disabled={disabled || false}\n          />\n          {isLoading ? <LoadingIndicator size={Size.Small} color={COLORS.neutral_600}/> : null}\n          <div className={'icon dropdown-arrow'}>\n            {isOpen ? <ArrowDropUp size=\"24px\" className={size ? size : ''}/> :\n              <ArrowDropDown size=\"24px\" className={size ? size : ''}/>}\n          </div>\n        </StyledField>\n        {!readOnly && !disabled && (\n          <DropdownContent\n            ref={dropdownRef}\n            containerRef={containerRef}\n            onActiveDescendantChanged={(id) => setActiveDescendant(id)}\n            customizationProps={{\n              itemsType: itemsType,\n              action: action ?? (() => {\n              }),\n              actionLabel: actionLabel,\n              actionVariant: actionVariant,\n              actionDisabled: actionDisabled,\n              scrollable: scrollable,\n              onValueUpdate: handleValueSelect,\n              items: list,\n              multiSelect: props.multiSelect,\n              pinTopItem: pinTopItem,\n              maxHeight: maxHeight,\n              actionIcon: actionIcon,\n              actionLoading: actionLoading,\n            }}\n            ariaRolesType=\"input\"\n            focused={focused}\n            setFocused={setFocused}\n            size={size ?? Size.Small}\n            filter={''}\n            isOpen={isOpen}\n            setIsOpen={customSetIsOpen}\n            messageOnNoResults={messageOnNoResults ?? ''}\n            outline={keyboardNavigated}\n            isButton={isButton || false}\n            selectedValues={props.multiSelect ? props.value || [] : [props.value || '']}\n            setSelectedValues={handleValueSelect}\n            id={`${id}_dropdowncontent`}\n          />\n        )}\n      </Dropdown>\n      {activeValidationMessage && (\n        <ErrorMessage>\n          <TechnicalWarning color={COLORS.critical_400}/>\n          <span>{activeValidationMessage}</span>\n        </ErrorMessage>\n      )}\n      {autofilledMessage && (\n        <AutofilledMessage>\n          <Information color={COLORS.neutral_600}/>\n          <span>{autofilledMessage}</span>\n        </AutofilledMessage>\n      )}\n    </>\n  );\n});\n\nexport default BasicDropdown;\n"],"mappings":";;;;;;;;;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAAQC,MAAR,QAAqB,WAArB;AACA,SAAQC,aAAR,EAAuBC,WAAvB,EAAoCC,WAApC,EAAiDC,gBAAjD,QAAwE,kCAAxE;AACA,SAAQC,gBAAR,QAA+B,qBAA/B;AACA,SAAQC,QAAR,EAAkBC,WAAlB,EAA+BC,UAA/B,QAAgD,iBAAhD;AACA,OAAOC,eAAP,MAA4C,mBAA5C;AACA,SAAQC,iBAAR,EAA2BC,YAA3B,QAA8C,wBAA9C;AACA,SAAQC,IAAR,QAAmB,UAAnB;AACA,SAAQC,yBAAR,EAAmCC,kBAAnC,EAAuDC,kBAAvD,QAAgF,WAAhF;AACA,SAAQC,kBAAR,QAAiC,WAAjC;;;;AA0CA,IAAMC,aAAa,gBAAGlB,KAAK,CAACmB,UAAN,CAAiB,UAACC,KAAD,EAA6BC,GAA7B,EAAqC;EAC1E,IACEC,EADF,GA2BIF,KA3BJ,CACEE,EADF;EAAA,IAEEC,IAFF,GA2BIH,KA3BJ,CAEEG,IAFF;EAAA,IAGEC,WAHF,GA2BIJ,KA3BJ,CAGEI,WAHF;EAAA,IAIEC,kBAJF,GA2BIL,KA3BJ,CAIEK,kBAJF;EAAA,uBA2BIL,KA3BJ,CAKEM,SALF;EAAA,IAKEA,SALF,iCAKc,QALd;EAAA,IAMEC,MANF,GA2BIP,KA3BJ,CAMEO,MANF;EAAA,IAOEC,WAPF,GA2BIR,KA3BJ,CAOEQ,WAPF;EAAA,IAQEC,aARF,GA2BIT,KA3BJ,CAQES,aARF;EAAA,IASEC,UATF,GA2BIV,KA3BJ,CASEU,UATF;EAAA,IAUEC,aAVF,GA2BIX,KA3BJ,CAUEW,aAVF;EAAA,IAWEC,cAXF,GA2BIZ,KA3BJ,CAWEY,cAXF;EAAA,IAYEC,UAZF,GA2BIb,KA3BJ,CAYEa,UAZF;EAAA,wBA2BIb,KA3BJ,CAaEc,UAbF;EAAA,IAaEA,UAbF,kCAae,IAbf;EAAA,IAcEC,SAdF,GA2BIf,KA3BJ,CAcEe,SAdF;EAAA,IAeEC,QAfF,GA2BIhB,KA3BJ,CAeEgB,QAfF;EAAA,IAgBEC,QAhBF,GA2BIjB,KA3BJ,CAgBEiB,QAhBF;EAAA,IAiBEC,QAjBF,GA2BIlB,KA3BJ,CAiBEkB,QAjBF;EAAA,IAkBEC,uBAlBF,GA2BInB,KA3BJ,CAkBEmB,uBAlBF;EAAA,IAmBEC,iBAnBF,GA2BIpB,KA3BJ,CAmBEoB,iBAnBF;EAAA,IAoBEC,IApBF,GA2BIrB,KA3BJ,CAoBEqB,IApBF;EAAA,oBA2BIrB,KA3BJ,CAqBEsB,MArBF;EAAA,IAqBEA,MArBF,8BAqBW,OArBX;EAAA,IAsBEC,QAtBF,GA2BIvB,KA3BJ,CAsBEuB,QAtBF;EAAA,IAuBEC,SAvBF,GA2BIxB,KA3BJ,CAuBEwB,SAvBF;EAAA,IAwBEC,MAxBF,GA2BIzB,KA3BJ,CAwBEyB,MAxBF;EAAA,IAyBEC,QAzBF,GA2BI1B,KA3BJ,CAyBE0B,QAzBF;EAAA,IA0BKC,IA1BL,4BA2BI3B,KA3BJ;;EA6BA,sBAA4BpB,KAAK,CAACgD,QAAN,CAAwB,KAAxB,CAA5B;EAAA;EAAA,IAAOC,MAAP;EAAA,IAAeC,SAAf;;EACA,uBAAgDlD,KAAK,CAACgD,QAAN,EAAhD;EAAA;EAAA,IAAOG,gBAAP;EAAA,IAAyBC,mBAAzB;;EACA,uBAAkCpD,KAAK,CAACgD,QAAN,CAAwB,KAAxB,CAAlC;EAAA;EAAA,IAAOK,SAAP;EAAA,IAAkBC,YAAlB;;EACA,uBAA0BtD,KAAK,CAACgD,QAAN,CAAuB,EAAvB,CAA1B;EAAA;EAAA,IAAOO,KAAP;EAAA,IAAcC,QAAd;;EACA,uBAA8BxD,KAAK,CAACgD,QAAN,CAA8B,IAA9B,CAA9B;EAAA;EAAA,IAAOS,OAAP;EAAA,IAAgBC,UAAhB;;EACA,wBAAkD1D,KAAK,CAACgD,QAAN,CAAwB,KAAxB,CAAlD;EAAA;EAAA,IAAOW,iBAAP;EAAA,IAA0BC,oBAA1B;;EAEA,IAAMC,QAAQ,GAAG7D,KAAK,CAAC8D,MAAN,CAA+B,IAA/B,CAAjB;EACA,IAAMC,cAAc,GAAG/C,kBAAkB,CAAC,CAAC6C,QAAD,CAAD,CAAzC;EACA,IAAMG,WAAW,GAAGhE,KAAK,CAAC8D,MAAN,CAA6B,IAA7B,CAApB;;EAEA,IAAMG,aAAa,GAAG,SAAhBA,aAAgB,GAAM;IAC1Bf,SAAS,CAAC,KAAD,CAAT;IACAQ,UAAU,CAAC,IAAD,CAAV;EACD,CAHD;;EAKA,IAAMQ,YAAY,GAAGjD,kBAAkB,CAACgD,aAAD,EAAgB,CAACD,WAAD,CAAhB,CAAvC;EAEAjD,kBAAkB,CAACkD,aAAD,EAAgB,EAAhB,EAAoBC,YAApB,CAAlB;;EAEA,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,CAAD,EAA4C;IAChE,IAAIA,CAAC,CAACC,GAAF,KAAU,OAAV,IAAqBD,CAAC,CAACC,GAAF,KAAU,GAAnC,EAAwC;MACtCnB,SAAS,CAAC,CAACD,MAAF,CAAT;MACAW,oBAAoB,CAAC,IAAD,CAApB;IACD;EACF,CALD;;EAOA,IAAMU,iBAAiB,GAAG,SAApBA,iBAAoB,CAACC,MAAD,EAAsB;IAC9Cf,QAAQ,CAACe,MAAM,CAACC,IAAP,CAAY,IAAZ,CAAD,CAAR;;IAEA,IAAIpD,KAAK,CAACqD,WAAN,KAAsB,IAA1B,EAAgC;MAC9BrD,KAAK,CAAC0B,QAAN,CAAeyB,MAAf;IACD,CAFD,MAEO,IAAInD,KAAK,CAACqD,WAAN,KAAsB,KAAtB,IAA+BrD,KAAK,CAACqD,WAAN,KAAsBC,SAAzD,EAAoE;MACzEtD,KAAK,CAAC0B,QAAN,CAAeyB,MAAM,CAAC,CAAD,CAArB;IACD,CAP6C,CAS9C;;;IACA,IAAI3C,WAAW,IAAIR,KAAK,CAACqD,WAAzB,EAAsC;;IAEtC,IAAId,iBAAJ,EAAuB;MAAA;;MACrB,yBAAAI,cAAc,CAACY,OAAf,gFAAwBC,KAAxB,CAA8B;QAACC,YAAY,EAAE;MAAf,CAA9B;IACD;;IACD3B,SAAS,CAAC,KAAD,CAAT;IACAQ,UAAU,CAAC,IAAD,CAAV;EACD,CAjBD;;EAmBA1D,KAAK,CAAC8E,SAAN,CAAgB,YAAM;IACpB,IAAI1D,KAAK,CAAC2D,KAAV,EAAiB;MACf,IAAI3D,KAAK,CAACqD,WAAV,EAAuB;QACrBjB,QAAQ,CAACpC,KAAK,CAAC2D,KAAN,CAAYP,IAAZ,CAAiB,IAAjB,CAAD,CAAR;MACD,CAFD,MAEO,IAAIpD,KAAK,CAACqD,WAAN,KAAsB,KAAtB,IAA+BrD,KAAK,CAACqD,WAAN,KAAsBC,SAAzD,EAAoE;QACzElB,QAAQ,CAACpC,KAAK,CAAC2D,KAAP,CAAR;MACD;IACF,CAND,MAMO;MACLvB,QAAQ,CAAC,EAAD,CAAR;IACD;EACF,CAVD,EAUG,CAACpC,KAAK,CAAC2D,KAAP,EAAc3D,KAAK,CAACqD,WAApB,CAVH;EAYAzE,KAAK,CAAC8E,SAAN,CAAgB,YAAM;IACpBxB,YAAY,CAAC,KAAD,CAAZ;EACD,CAFD,EAEG,CAACC,KAAD,CAFH;EAIAvD,KAAK,CAAC8E,SAAN,CAAgB,YAAM;IACpB,CAAC7B,MAAD,IAAWW,oBAAoB,CAAC,KAAD,CAA/B;EACD,CAFD,EAEG,CAACX,MAAD,CAFH;EAIAjD,KAAK,CAACgF,mBAAN,CAA0B3D,GAA1B,EAA+B;IAAA,OAAMwC,QAAQ,CAACc,OAAf;EAAA,CAA/B,EAAuD,CAACd,QAAD,CAAvD;;EAEA,IAAMoB,eAAe,GAAG,SAAlBA,eAAkB,CAAChC,MAAD,EAAqB;IAC3CC,SAAS,CAACD,MAAD,CAAT;EACD,CAFD;;EAIA,IAAMiC,eAAe,GAAG,SAAlBA,eAAkB,GAAM;IAC5B,IAAMX,MAAM,GAAGhB,KAAK,CAAC4B,KAAN,CAAY,GAAZ,EAAiBC,GAAjB,CAAqB,UAACC,GAAD;MAAA,OAASA,GAAG,CAACC,IAAJ,EAAT;IAAA,CAArB,CAAf;IACA,IAAMC,iBAAiB,GAAGhE,IAAI,CAACiE,MAAL,CAAY,UAACC,IAAD;MAAA,OAAUlB,MAAM,CAACmB,QAAP,CAAgBD,IAAI,CAACV,KAArB,CAAV;IAAA,CAAZ,EAAmDK,GAAnD,CAAuD,UAACO,CAAD;MAAA,OAAOA,CAAC,CAACC,YAAT;IAAA,CAAvD,CAA1B;IACA,OAAOL,iBAAiB,CAACf,IAAlB,CAAuB,IAAvB,CAAP;EACD,CAJD;;EAMA,IAAMqB,UAAU,GAAG,SAAbA,UAAa,CAACzB,CAAD,EAAyC;IAC1D;IACA,IAAI,CAACA,CAAC,CAAC0B,aAAF,CAAgBC,QAAhB,CAAyB3B,CAAC,CAAC4B,aAA3B,CAAL,EAAgD;MAC9CnD,MAAM,IAAIA,MAAM,CAACuB,CAAD,CAAhB;IACD;EACF,CALD;;EAOA,IAAM6B,GAAG,GAAG,CAAChD,MAAM,GAAG,WAAH,GAAiB,EAAxB,EAA4BiD,MAA5B,CAAmCzD,IAAI,GAAGA,IAAH,GAAU,EAAjD,EAAqDyD,MAArD,CAA4D5D,QAAQ,GAAG,UAAH,GAAgB,EAApF,EAAwF4D,MAAxF,CAA+FtD,SAAS,cAAOA,SAAP,IAAqB,EAA7H,CAAZ;EAEA,oBACE;IAAA,wBACE,MAAC,QAAD;MAAU,GAAG,EAAEsB,YAAf;MACU,iBAAejB,MAAM,GAAG,IAAH,GAAU,KADzC;MAEU,yBAAuBE,gBAFjC;MAGU,2BAAkB7B,EAAlB,qBAHV;MAIU,IAAI,EAAC,SAJf;MAKU,wBAAsBF,KAAK,CAACqD,WALtC;MAMU,QAAQ,EAAEnC,QAAQ,IAAI,KANhC;MAOU,SAAS,EAAEG,IAAI,GAAGA,IAAH,GAAU,EAPnC;MAQU,QAAQ,EAAEJ,QARpB;MASU,QAAQ,EAAED,QATpB;MAUU,MAAM,EAAEM,MAVlB;MAWU,MAAM,EAAEmD,UAXlB;MAYU,QAAQ,EAAElD,QAZpB;MAAA,wBAaE,MAAC,WAAD;QACE,GAAG,EAAEoB,cADP;QAEE,SAAS,EAAEkC,GAFb;QAGE,WAAW,EAAEnF,yBAHf;QAIE,OAAO,EAAE,iBAACsD,CAAD,EAAO;UACd,IAAI,CAAC/B,QAAD,IAAa,CAACD,QAAlB,EAA4B;YAC1BgC,CAAC,CAAC+B,eAAF;YACAjD,SAAS,CAAC,CAACD,MAAF,CAAT;;YACA,IAAIA,MAAJ,EAAY;cAAA;;cACV,qBAAAY,QAAQ,CAACc,OAAT,wEAAkByB,IAAlB;YACD,CAFD,MAEO;cAAA;;cACL,sBAAAvC,QAAQ,CAACc,OAAT,0EAAkBC,KAAlB;YACD;UACF;QACF,CAdH;QAeE,QAAQ,EAAExC,QAAQ,IAAIC,QAAZ,GAAuB,CAAC,CAAxB,GAA4B,CAfxC;QAgBE,QAAQ,EAAED,QAAQ,IAAI,KAhBxB;QAiBE,QAAQ,EAAEC,QAAQ,IAAI,KAjBxB;QAkBE,aAAa,EAAE,CAACkB,KAlBlB;QAmBE,WAAW,EAAE/B,WAnBf;QAoBE,qBAAqB,EAAE,CAAC,CAACe,uBApB3B;QAqBE,SAAS,EAAE4B,aArBb;QAsBE,QAAQ,EAAExB;MAtBZ,GAuBMI,IAvBN;QAAA,wBAwBE,KAAC,UAAD;UACE,GAAG,EAAEc,QADP;UAEE,IAAI,EAAC,QAFP;UAGE,QAAQ,MAHV;UAIE,WAAW,EAAErC,WAJf;UAKE,KAAK,EAAE0D,eAAe,EALxB;UAME,SAAS,EAAEzC,IAAI,aAAMA,IAAN,cAAqB,OANtC;UAOE,QAAQ,EAAE,CAAC,CAPb;UAQE,QAAQ,EAAEL,QAAQ,IAAI;QARxB,EAxBF,EAkCGiB,SAAS,gBAAG,KAAC,gBAAD;UAAkB,IAAI,EAAExC,IAAI,CAACwF,KAA7B;UAAoC,KAAK,EAAEpG,MAAM,CAACqG;QAAlD,EAAH,GAAsE,IAlClF,eAmCE;UAAK,SAAS,EAAE,qBAAhB;UAAA,UACGrD,MAAM,gBAAG,KAAC,WAAD;YAAa,IAAI,EAAC,MAAlB;YAAyB,SAAS,EAAER,IAAI,GAAGA,IAAH,GAAU;UAAlD,EAAH,gBACL,KAAC,aAAD;YAAe,IAAI,EAAC,MAApB;YAA2B,SAAS,EAAEA,IAAI,GAAGA,IAAH,GAAU;UAApD;QAFJ,EAnCF;MAAA,GAbF,EAqDG,CAACJ,QAAD,IAAa,CAACD,QAAd,iBACC,KAAC,eAAD;QACE,GAAG,EAAE4B,WADP;QAEE,YAAY,EAAEE,YAFhB;QAGE,yBAAyB,EAAE,mCAAC5C,EAAD;UAAA,OAAQ8B,mBAAmB,CAAC9B,EAAD,CAA3B;QAAA,CAH7B;QAIE,kBAAkB,EAAE;UAClBI,SAAS,EAAEA,SADO;UAElBC,MAAM,EAAEA,MAAF,aAAEA,MAAF,cAAEA,MAAF,GAAa,YAAM,CACxB,CAHiB;UAIlBC,WAAW,EAAEA,WAJK;UAKlBC,aAAa,EAAEA,aALG;UAMlBG,cAAc,EAAEA,cANE;UAOlBE,UAAU,EAAEA,UAPM;UAQlBqE,aAAa,EAAEjC,iBARG;UASlBkC,KAAK,EAAEjF,IATW;UAUlBkD,WAAW,EAAErD,KAAK,CAACqD,WAVD;UAWlBxC,UAAU,EAAEA,UAXM;UAYlBE,SAAS,EAAEA,SAZO;UAalBL,UAAU,EAAEA,UAbM;UAclBC,aAAa,EAAEA;QAdG,CAJtB;QAoBE,aAAa,EAAC,OApBhB;QAqBE,OAAO,EAAE0B,OArBX;QAsBE,UAAU,EAAEC,UAtBd;QAuBE,IAAI,EAAEjB,IAAF,aAAEA,IAAF,cAAEA,IAAF,GAAU5B,IAAI,CAACwF,KAvBrB;QAwBE,MAAM,EAAE,EAxBV;QAyBE,MAAM,EAAEpD,MAzBV;QA0BE,SAAS,EAAEgC,eA1Bb;QA2BE,kBAAkB,EAAExD,kBAAF,aAAEA,kBAAF,cAAEA,kBAAF,GAAwB,EA3B5C;QA4BE,OAAO,EAAEkC,iBA5BX;QA6BE,QAAQ,EAAErB,QAAQ,IAAI,KA7BxB;QA8BE,cAAc,EAAElB,KAAK,CAACqD,WAAN,GAAoBrD,KAAK,CAAC2D,KAAN,IAAe,EAAnC,GAAwC,CAAC3D,KAAK,CAAC2D,KAAN,IAAe,EAAhB,CA9B1D;QA+BE,iBAAiB,EAAET,iBA/BrB;QAgCE,EAAE,YAAKhD,EAAL;MAhCJ,EAtDJ;IAAA,EADF,EA2FGiB,uBAAuB,iBACtB,MAAC,YAAD;MAAA,wBACE,KAAC,gBAAD;QAAkB,KAAK,EAAEtC,MAAM,CAACwG;MAAhC,EADF,eAEE;QAAA,UAAOlE;MAAP,EAFF;IAAA,EA5FJ,EAiGGC,iBAAiB,iBAChB,MAAC,iBAAD;MAAA,wBACE,KAAC,WAAD;QAAa,KAAK,EAAEvC,MAAM,CAACqG;MAA3B,EADF,eAEE;QAAA,UAAO9D;MAAP,EAFF;IAAA,EAlGJ;EAAA,EADF;AA0GD,CA/NqB,CAAtB;;EAtCEjB,I;EACAG,S,aAAY,Q,EAAW,U,EAAa,O;EACpCC,M;EACAC,W;EAEAE,U;EACAC,a;EACAC,c;EACAC,U;EACAC,U;EACAC,S;EACAX,W;EACAkF,c;EACAjF,kB;EACAW,Q;EACAC,Q;EACAC,Q;EACAC,uB;EACAC,iB;EAEAE,M;EACAC,Q;EAUA8B,W,aAAc,K;EACdM,K;EACAjC,Q;wIAhCY,Q,EAAW,U,EAAa,O;AAsQtC,eAAe5B,aAAf"}

package/dist/Dropdown/DropdownButton.cjs

@@ -31,7 +31,7 @@ var _SystemIcons = require("../icons/systemicons/SystemIcons");
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-var _excluded = ["items", "icon", "disabled", "onClick", "itemsType", "action", "actionLabel", "actionVariant", "actionIcon", "actionLoading", "size", "width", "alignLeft", "multiSelect", "scrollable", "pinTopItem", "maxHeight", "className", "value"];
+var _excluded = ["items", "icon", "disabled", "onClick", "itemsType", "action", "actionLabel", "actionVariant", "actionIcon", "actionLoading", "size", "width", "alignLeft", "multiSelect", "scrollable", "pinTopItem", "maxHeight", "className", "value", "id"];
 
 var _templateObject;
 
@@ -66,6 +66,7 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       maxHeight = _ref.maxHeight,
       className = _ref.className,
       value = _ref.value,
+      id = _ref.id,
       rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
 
   // Globally used variables within the view.
@@ -74,20 +75,25 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       dropdownOpen = _React$useState2[0],
       setDropdownOpen = _React$useState2[1];
 
-  var _React$useState3 = React.useState([]),
+  var _React$useState3 = React.useState(),
       _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
-      selectedValues = _React$useState4[0],
-      setSelectedValues = _React$useState4[1];
+      activeDescendant = _React$useState4[0],
+      setActiveDescendant = _React$useState4[1];
 
-  var _React$useState5 = React.useState(null),
+  var _React$useState5 = React.useState([]),
       _React$useState6 = (0, _slicedToArray2.default)(_React$useState5, 2),
-      focused = _React$useState6[0],
-      setFocused = _React$useState6[1];
+      selectedValues = _React$useState6[0],
+      setSelectedValues = _React$useState6[1];
 
-  var _React$useState7 = React.useState(false),
+  var _React$useState7 = React.useState(null),
       _React$useState8 = (0, _slicedToArray2.default)(_React$useState7, 2),
-      keyboardNavigated = _React$useState8[0],
-      setKeyboardNavigated = _React$useState8[1];
+      focused = _React$useState8[0],
+      setFocused = _React$useState8[1];
+
+  var _React$useState9 = React.useState(false),
+      _React$useState10 = (0, _slicedToArray2.default)(_React$useState9, 2),
+      keyboardNavigated = _React$useState10[0],
+      setKeyboardNavigated = _React$useState10[1];
 
   var dropdownRef = React.useRef(null);
   var containerRef = (0, _common.useFocusOutsideRef)(function () {
@@ -123,6 +129,9 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
           ref: ref,
           variant: "secondary",
           shape: "circular",
+          role: "button",
+          "aria-controls": "".concat(id, "_dropdowncontent"),
+          "aria-activedescendant": activeDescendant,
           action: function action(event) {
             setDropdownOpen(!dropdownOpen);
 
@@ -146,6 +155,9 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         return /*#__PURE__*/(0, _jsxRuntime.jsx)(_CommonStyling.TextButtonDropdownWrapper, {
           tabIndex: !disabled ? 0 : -1,
           className: cls,
+          role: "button",
+          "aria-controls": "".concat(id, "_dropdowncontent"),
+          "aria-activedescendant": activeDescendant,
           onMouseDown: _common.defaultOnMouseDownHandler,
           onKeyDown: function onKeyDown(e) {
             if (e.key === 'Enter' || e.key === ' ') {
@@ -180,6 +192,7 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     ref: containerRef,
     children: [renderButton(), /*#__PURE__*/(0, _jsxRuntime.jsx)(_DropdownContent.default, {
       ref: dropdownRef,
+      ariaRolesType: "menu",
       containerRef: containerRef,
       customizationProps: {
         itemsType: itemsType,
@@ -195,6 +208,9 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         maxHeight: maxHeight,
         items: items
       },
+      onActiveDescendantChanged: function onActiveDescendantChanged(e) {
+        return setActiveDescendant(e);
+      },
       focused: focused,
       setFocused: setFocused,
       size: size,
@@ -208,7 +224,7 @@ var DropdownButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       setSelectedValues: setSelectedValues,
       messageOnNoResults: "No results",
       isButton: true,
-      id: "dropdown-content"
+      id: "".concat(id, "_dropdowncontent")
     })]
   });
 });

package/dist/Dropdown/DropdownButton.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownButton.cjs","names":["Wrapper","styled","div","DropdownButton","React","forwardRef","ref","items","icon","disabled","onClick","itemsType","action","actionLabel","actionVariant","actionIcon","actionLoading","size","width","alignLeft","multiSelect","scrollable","pinTopItem","maxHeight","className","value","rest","useState","dropdownOpen","setDropdownOpen","selectedValues","setSelectedValues","focused","setFocused","keyboardNavigated","setKeyboardNavigated","dropdownRef","useRef","containerRef","useFocusOutsideRef","useClickOutsideRef","useEffect","handleValueSelect","values","renderButton","type","event","detail","label","keepLabel","length","filter","a","includes","map","displayLabel","join","cls","defaultOnMouseDownHandler","e","key","preventDefault","stopPropagation","onValueUpdate"],"sources":["../../src/Dropdown/DropdownButton.tsx"],"sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {IconButton} from '../Button';\nimport DropdownContent from './DropdownContent';\nimport styled from 'styled-components';\n\n/**\n * Import custom types.\n */\nimport {DropdownButtonProps} from './DropdownButtonTypes';\nimport {defaultOnMouseDownHandler, useClickOutsideRef, useFocusOutsideRef} from '../common';\nimport {\n  TextButtonDropdownArrow,\n  TextButtonDropdownContent,\n  TextButtonDropdownIcon,\n  TextButtonDropdownText,\n  TextButtonDropdownWrapper\n} from './CommonStyling';\nimport {ArrowDropDown, ArrowDropUp} from '../icons/systemicons/SystemIcons';\n\nconst Wrapper = styled.div`\n  display: inline-block;\n`;\n\nconst DropdownButton = React.forwardRef( ({\n                          items,\n                          icon,\n                          disabled,\n                          onClick,\n                          itemsType = 'normal',\n                          action,\n                          actionLabel = '',\n                          actionVariant,\n                          actionIcon,\n                          actionLoading,\n                          size,\n                          width,\n                          alignLeft,\n                          multiSelect = false,\n                          scrollable = false,\n                          pinTopItem = false,\n                          maxHeight,\n                          className,\n                          value,\n                          ...rest\n                        }: DropdownButtonProps, ref: React.Ref<HTMLButtonElement>) => {\n  // Globally used variables within the view.\n  const [dropdownOpen, setDropdownOpen] = React.useState<boolean>(false);\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n  const [focused, setFocused] = React.useState<number | null>(null);\n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\n  const dropdownRef = React.useRef<HTMLDivElement>(null);\n\n  const containerRef = useFocusOutsideRef(() => setDropdownOpen(false), [dropdownRef]);\n  useClickOutsideRef(() => setDropdownOpen(false), [], containerRef);\n\n  React.useEffect(() => {\n    !dropdownOpen && setKeyboardNavigated(false)\n  }, [dropdownOpen]);\n\n  React.useEffect(() => {\n    disabled && setDropdownOpen(false)\n  }, [disabled]);\n\n  React.useEffect(() => {\n    setSelectedValues(value || []);\n  }, [value]);\n\n  const handleValueSelect = (values: string[]) => {\n    // Do all required actions\n    onClick(values);\n  };\n\n  /**\n   * Renders Icon Button dropdown menu.\n   * @returns HTML View for the Icon button dropdown menu.\n   */\n  const renderButton = () => {\n    switch (rest.type) {\n      case 'icon':\n        return (\n          <IconButton ref={ref}\n                      variant=\"secondary\"\n                      shape=\"circular\"\n                      action={(event: any) => {\n                        setDropdownOpen(!dropdownOpen);\n                        if (event?.detail !== 1) {\n                          setKeyboardNavigated(true);\n                        }\n                      }}\n                      disabled={disabled}>\n            {icon}\n          </IconButton>\n        );\n      case 'text':\n        const label = rest.keepLabel || !selectedValues?.length\n          ? rest.label\n          : items.filter(a => selectedValues.includes(a.value)).map(a => a.displayLabel ?? a.value).join(', ');\n        const cls = `${disabled && 'disabled'} ${dropdownOpen && 'expanded'} ${className}`;\n        return <TextButtonDropdownWrapper tabIndex={!disabled ? 0 : -1}\n                                          className={cls}\n                                          onMouseDown={defaultOnMouseDownHandler}\n                                          onKeyDown={e => {\n                                            if (e.key === 'Enter' || e.key === ' ') {\n                                              e.preventDefault();\n                                              e.stopPropagation();\n                                              setDropdownOpen(!dropdownOpen);\n                                              setKeyboardNavigated(true);\n                                            }\n                                          }}\n                                          onClick={() => !disabled && setDropdownOpen(!dropdownOpen)}>\n          <TextButtonDropdownContent>\n            {icon && <TextButtonDropdownIcon>{icon}</TextButtonDropdownIcon>}\n            <TextButtonDropdownText>{label}</TextButtonDropdownText>\n            <TextButtonDropdownArrow>\n              {\n                dropdownOpen\n                  ? <ArrowDropUp size=\"24px\"/>\n                  : <ArrowDropDown size=\"24px\"/>\n              }\n            </TextButtonDropdownArrow>\n          </TextButtonDropdownContent>\n        </TextButtonDropdownWrapper>\n    }\n  };\n\n  return (\n    <Wrapper className={className} ref={containerRef}>\n      {renderButton()}\n      <DropdownContent\n        ref={dropdownRef}\n        containerRef={containerRef}\n        customizationProps={{\n          itemsType: itemsType,\n          action: action ?? (() => {\n          }),\n          actionLabel: actionLabel,\n          actionVariant: actionVariant,\n          onValueUpdate: handleValueSelect,\n          multiSelect: multiSelect,\n          actionIcon: actionIcon,\n          actionLoading: actionLoading,\n          scrollable: scrollable,\n          pinTopItem: pinTopItem,\n          maxHeight: maxHeight,\n          items: items\n        }}\n        focused={focused}\n        setFocused={setFocused}\n        size={size}\n        width={width}\n        alignLeft={alignLeft}\n        isOpen={dropdownOpen}\n        setIsOpen={setDropdownOpen}\n        outline={keyboardNavigated}\n        filter=\"\"\n        selectedValues={rest.type === 'icon' && itemsType === 'normal' ? [] : selectedValues}\n        setSelectedValues={setSelectedValues}\n        messageOnNoResults=\"No results\"\n        isButton={true}\n        id=\"dropdown-content\"\n      />\n    </Wrapper>\n  );\n});\n\nexport default DropdownButton;\n"],"mappings":"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"}
+{"version":3,"file":"DropdownButton.cjs","names":["Wrapper","styled","div","DropdownButton","React","forwardRef","ref","items","icon","disabled","onClick","itemsType","action","actionLabel","actionVariant","actionIcon","actionLoading","size","width","alignLeft","multiSelect","scrollable","pinTopItem","maxHeight","className","value","id","rest","useState","dropdownOpen","setDropdownOpen","activeDescendant","setActiveDescendant","selectedValues","setSelectedValues","focused","setFocused","keyboardNavigated","setKeyboardNavigated","dropdownRef","useRef","containerRef","useFocusOutsideRef","useClickOutsideRef","useEffect","handleValueSelect","values","renderButton","type","event","detail","label","keepLabel","length","filter","a","includes","map","displayLabel","join","cls","defaultOnMouseDownHandler","e","key","preventDefault","stopPropagation","onValueUpdate"],"sources":["../../src/Dropdown/DropdownButton.tsx"],"sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {IconButton} from '../Button';\nimport DropdownContent from './DropdownContent';\nimport styled from 'styled-components';\n\n/**\n * Import custom types.\n */\nimport {DropdownButtonProps} from './DropdownButtonTypes';\nimport {defaultOnMouseDownHandler, useClickOutsideRef, useFocusOutsideRef} from '../common';\nimport {\n  TextButtonDropdownArrow,\n  TextButtonDropdownContent,\n  TextButtonDropdownIcon,\n  TextButtonDropdownText,\n  TextButtonDropdownWrapper\n} from './CommonStyling';\nimport {ArrowDropDown, ArrowDropUp} from '../icons/systemicons/SystemIcons';\n\nconst Wrapper = styled.div`\n  display: inline-block;\n`;\n\nconst DropdownButton = React.forwardRef( ({\n                          items,\n                          icon,\n                          disabled,\n                          onClick,\n                          itemsType = 'normal',\n                          action,\n                          actionLabel = '',\n                          actionVariant,\n                          actionIcon,\n                          actionLoading,\n                          size,\n                          width,\n                          alignLeft,\n                          multiSelect = false,\n                          scrollable = false,\n                          pinTopItem = false,\n                          maxHeight,\n                          className,\n                          value,\n                          id,\n                          ...rest\n                        }: DropdownButtonProps, ref: React.Ref<HTMLButtonElement>) => {\n  // Globally used variables within the view.\n  const [dropdownOpen, setDropdownOpen] = React.useState<boolean>(false);\n  const [activeDescendant, setActiveDescendant] = React.useState<string>();\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n  const [focused, setFocused] = React.useState<number | null>(null);\n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\n  const dropdownRef = React.useRef<HTMLDivElement>(null);\n\n  const containerRef = useFocusOutsideRef(() => setDropdownOpen(false), [dropdownRef]);\n  useClickOutsideRef(() => setDropdownOpen(false), [], containerRef);\n\n  React.useEffect(() => {\n    !dropdownOpen && setKeyboardNavigated(false)\n  }, [dropdownOpen]);\n\n  React.useEffect(() => {\n    disabled && setDropdownOpen(false)\n  }, [disabled]);\n\n  React.useEffect(() => {\n    setSelectedValues(value || []);\n  }, [value]);\n\n  const handleValueSelect = (values: string[]) => {\n    // Do all required actions\n    onClick(values);\n  };\n\n  /**\n   * Renders Icon Button dropdown menu.\n   * @returns HTML View for the Icon button dropdown menu.\n   */\n  const renderButton = () => {\n    switch (rest.type) {\n      case 'icon':\n        return (\n          <IconButton ref={ref}\n                      variant=\"secondary\"\n                      shape=\"circular\"\n                      role=\"button\"\n                      aria-controls={`${id}_dropdowncontent`}\n                      aria-activedescendant={activeDescendant}\n                      \n                      action={(event: any) => {\n                        setDropdownOpen(!dropdownOpen);\n                        if (event?.detail !== 1) {\n                          setKeyboardNavigated(true);\n                        }\n                      }}\n                      disabled={disabled}>\n            {icon}\n          </IconButton>\n        );\n      case 'text':\n        const label = rest.keepLabel || !selectedValues?.length\n          ? rest.label\n          : items.filter(a => selectedValues.includes(a.value)).map(a => a.displayLabel ?? a.value).join(', ');\n        const cls = `${disabled && 'disabled'} ${dropdownOpen && 'expanded'} ${className}`;\n        return <TextButtonDropdownWrapper tabIndex={!disabled ? 0 : -1}\n                                          className={cls}\n                                          role=\"button\"\n                                          aria-controls={`${id}_dropdowncontent`}\n                                          aria-activedescendant={activeDescendant}\n                                          onMouseDown={defaultOnMouseDownHandler}\n                                          onKeyDown={e => {\n                                            if (e.key === 'Enter' || e.key === ' ') {\n                                              e.preventDefault();\n                                              e.stopPropagation();\n                                              setDropdownOpen(!dropdownOpen);\n                                              setKeyboardNavigated(true);\n                                            }\n                                          }}\n                                          onClick={() => !disabled && setDropdownOpen(!dropdownOpen)}>\n          <TextButtonDropdownContent>\n            {icon && <TextButtonDropdownIcon>{icon}</TextButtonDropdownIcon>}\n            <TextButtonDropdownText>{label}</TextButtonDropdownText>\n            <TextButtonDropdownArrow>\n              {\n                dropdownOpen\n                  ? <ArrowDropUp size=\"24px\"/>\n                  : <ArrowDropDown size=\"24px\"/>\n              }\n            </TextButtonDropdownArrow>\n          </TextButtonDropdownContent>\n        </TextButtonDropdownWrapper>\n    }\n  };\n\n  return (\n    <Wrapper className={className} ref={containerRef}> \n      {renderButton()}\n      <DropdownContent\n        ref={dropdownRef}\n        ariaRolesType=\"menu\"\n        containerRef={containerRef}\n        customizationProps={{\n          itemsType: itemsType,\n          action: action ?? (() => {\n          }),\n          actionLabel: actionLabel,\n          actionVariant: actionVariant,\n          onValueUpdate: handleValueSelect,\n          multiSelect: multiSelect,\n          actionIcon: actionIcon,\n          actionLoading: actionLoading,\n          scrollable: scrollable,\n          pinTopItem: pinTopItem,\n          maxHeight: maxHeight,\n          items: items\n        }}\n        onActiveDescendantChanged={(e) => setActiveDescendant(e)}\n        focused={focused}\n        setFocused={setFocused}\n        size={size}\n        width={width}\n        alignLeft={alignLeft}\n        isOpen={dropdownOpen}\n        setIsOpen={setDropdownOpen}\n        outline={keyboardNavigated}\n        filter=\"\"\n        selectedValues={rest.type === 'icon' && itemsType === 'normal' ? [] : selectedValues}\n        setSelectedValues={setSelectedValues}\n        messageOnNoResults=\"No results\"\n        isButton={true}\n        id={`${id}_dropdowncontent`}\n      />\n    </Wrapper>\n  );\n});\n\nexport default DropdownButton;\n"],"mappings":"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"}