@laerdal/life-react-components 1.10.3-dev.21.full → 1.10.3-dev.24

package/dist/Dropdown/DropdownFilter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Dropdown/DropdownFilter.tsx"],"names":["React","COLORS","ArrowDropDown","ArrowDropUp","Information","TechnicalWarning","LoadingIndicator","StyledField","Dropdown","InputField","DropdownContent","Size","AutofilledMessage","ErrorMessage","defaultOnMouseDownHandler","useActionWithin","useClickOutsideRef","useFocusOutsideRef","useFocusVisibleRef","IconButton","SystemIcons","DropdownFilter","forwardRef","ref","id","list","placeholder","onSelect","onInputChange","value","required","messageOnNoResults","disabled","readOnly","scrollable","activeValidationMessage","autofilledMessage","size","disableFiltering","buttonFontSize","margin","loading","onFocus","onBlur","rest","useState","isOpen","setIsOpen","input","setInput","placeholderSearch","setPlaceholderSearch","restartFilter","setRestartFilter","selectedItem","setSelectedItem","selectedValues","setSelectedValues","focused","setFocused","init","setInit","styledFieldRef","inputRef","clearButtonRef","useRef","useImperativeHandle","current","containerRef","handleInputKeyDown","e","key","preventDefault","useEffect","length","val","item","find","a","displayLabel","undefined","handleInputClear","focus","focusVisible","detail","renderInput","stopPropagation","blur","Math","floor","random","target","marginLeft","Small","neutral_600","itemsType","multiSelect","action","onValueUpdate","values","items","critical_400"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { COLORS } from '../styles';\nimport { ArrowDropDown, ArrowDropUp, Information, TechnicalWarning } from '../icons/systemicons/SystemIcons';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { StyledField, Dropdown, InputField } from './CommonStyling';\nimport DropdownContent, { DropdownItem } from './DropdownContent';\nimport { Size } from '../types';\nimport { AutofilledMessage, ErrorMessage } from '../InputFields';\nimport { defaultOnMouseDownHandler, useActionWithin, useClickOutsideRef, useFocusOutsideRef, useFocusVisibleRef } from '../common';\nimport { IconButton } from '../Button';\nimport { SystemIcons } from '../icons';\n\ninterface DropdownFilterProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onSelect' | 'size' | 'list' | 'autoComplete' | 'type' | 'placeholder' | 'onKeyDown' | 'value' | 'onChange' | 'required' | 'tabIndex' | 'disabled' | 'readOnly'> {\n  list: DropdownItem[];\n  placeholder?: string;\n\n  value?: string;\n  onSelect?: (value: string) => void;\n  onInputChange?: (input: string) => void;\n\n  required?: boolean;\n  disabled?: boolean;\n  readOnly?: boolean;\n  loading?: boolean;\n\n  disableFiltering?: boolean;\n\n  messageOnNoResults?: string;\n  activeValidationMessage?: string;\n  autofilledMessage?: string;\n  size?: Size.Small | Size.Medium;\n\n  buttonFontSize?: string;\n  margin?: string;\n  scrollable?: boolean;\n}\n\nconst DropdownFilter = React.forwardRef( ({\n                                            id,\n                                            list,\n                                            placeholder,\n                                            onSelect,\n                                            onInputChange,\n                                            value,\n                                            required,\n                                            messageOnNoResults,\n                                            disabled,\n                                            readOnly,\n                                            scrollable,\n                                            activeValidationMessage,\n                                            autofilledMessage,\n                                            size,\n                                            disableFiltering,\n                                            buttonFontSize,\n                                            margin = '4px 0',\n                                            loading,\n                                            onFocus,\n                                            onBlur,\n                                            ...rest\n                                          }: DropdownFilterProps, ref) => {\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [input, setInput] = React.useState<string>();\n  const [placeholderSearch, setPlaceholderSearch] = React.useState<string>(placeholder || '');\n  const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n  const [selectedItem, setSelectedItem] = React.useState<DropdownItem>();\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n  const [focused, setFocused] = React.useState<number | null>(null);\n  const [init, setInit] = React.useState<boolean>(true);\n\n  const styledFieldRef = useFocusVisibleRef();\n  const inputRef = useFocusVisibleRef([styledFieldRef]);\n  const clearButtonRef = React.useRef<HTMLButtonElement>(null);\n\n  useActionWithin(styledFieldRef, input && !readOnly && !disabled ? [clearButtonRef] : []);\n\n  React.useImperativeHandle(ref, () => inputRef.current, [inputRef]);\n\n  const containerRef = useClickOutsideRef(\n    () => setIsOpen(false),\n    [],\n    useFocusOutsideRef(() => setIsOpen(false)),\n  );\n\n  const handleInputKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (e.key === 'Esc' || e.key === 'Escape') {\n      e.preventDefault();\n    }\n    if (e.key === 'ArrowDown' || e.key === 'Down' || e.key === 'ArrowUp' || e.key === 'Up') {\n      e.preventDefault();\n      if (!isOpen) {\n        setIsOpen(true);\n      }\n    }\n  };\n\n  React.useEffect(() => {\n    setInit(true);\n    setSelectedValues(!!value ? [value] : []);\n  }, [value]);\n\n  React.useEffect(() => {\n    if (selectedValues?.length) {\n      const val = selectedValues[0];\n      const item = list.find((a) => a.value === val);\n      setSelectedItem(item);\n      setInput(item?.displayLabel ?? item?.value ?? '');\n      onSelect && !init && onSelect(val);\n    } else {\n      setSelectedItem(undefined);\n      onSelect && !init && onSelect('');\n      setInput('');\n    }\n  }, [selectedValues]);\n\n  React.useEffect(() => {\n    if (!isOpen) {\n      if (!!selectedItem) {\n        setInput(selectedItem?.displayLabel ?? selectedItem?.value ?? '');\n      } else {\n        setInput('');\n      }\n    }\n\n    setRestartFilter(true);\n  }, [isOpen, selectedItem]);\n\n  const handleInputClear = (e: any) => {\n    setInput('');\n    setSelectedValues([]);\n    onSelect && onSelect('');\n    inputRef.current?.focus({ focusVisible: e?.detail !== 1 } as any);\n  };\n\n  const renderInput = () => {\n    return (\n      <StyledField\n        ref={styledFieldRef}\n        className={size ? size : ''}\n        onClick={(e: any) => {\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        disabled={disabled || false}\n        readOnly={readOnly || false}\n        isPlaceholder={!input}\n        fontSize={buttonFontSize}\n        showValidationMessage={!!activeValidationMessage}\n        onMouseDown={defaultOnMouseDownHandler}\n        data-testid={`otherdiv_${id}`}>\n        <InputField\n          id={id}\n          ref={inputRef}\n          autoComplete={'off-' + Math.floor(Math.random() * 999999999999)}\n          type=\"search\"\n          placeholder={placeholderSearch}\n          onKeyDown={handleInputKeyDown}\n          value={input || ''}\n          onChange={(e: any) => {\n            if (!e.target.value) {\n              setSelectedValues([]);\n            }\n            if (!readOnly && !disabled && e.target.value !== input) {\n              setRestartFilter(false);\n              setIsOpen(true);\n              setInput(e.target.value);\n              if (onInputChange) {\n                onInputChange(e.target.value || '');\n              }\n            }\n          }}\n          onFocus={(e) => {\n            setPlaceholderSearch('');\n            onFocus && onFocus(e);\n          }}\n          onBlur={(e) => {\n            setPlaceholderSearch(placeholder || '');\n            onBlur && onBlur(e);\n          }}\n          required={required}\n          tabIndex={disabled || readOnly ? -1 : 0}\n          disabled={disabled || false}\n          {...rest}\n        />\n        {input && !readOnly && !disabled && !loading && (\n          <IconButton action={handleInputClear} ref={clearButtonRef} useTransparentBackground={true} shape={'circular'} style={{ marginLeft: '-4px' }} variant={'secondary'}>\n            <SystemIcons.Clear />\n          </IconButton>\n        )}\n\n        {!disabled && !readOnly && loading && (\n          <div style={{ marginLeft: '-4xp' }}>\n            <LoadingIndicator size={Size.Small} color={COLORS.neutral_600} />\n          </div>\n        )}\n\n        <div className={'dropdown-arrow'}>\n          {isOpen && !readOnly && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''} /> : <ArrowDropDown size=\"24px\" className={size ? size : ''} />}\n        </div>\n      </StyledField>\n    );\n  };\n\n  return (\n    <>\n      <Dropdown ref={containerRef} disabled={disabled} isButton={false} readOnly={readOnly} className={size ? size : ''} margin={margin}>\n        {renderInput()}\n        {!readOnly && !disabled && (\n          <DropdownContent\n            isOpen={isOpen && !loading}\n            messageOnNoResults={messageOnNoResults ?? ''}\n            selectedValues={selectedValues}\n            setSelectedValues={setSelectedValues}\n            size={size ?? Size.Small}\n            focused={focused}\n            setFocused={setFocused}\n            outline={false}\n            customizationProps={{\n              itemsType: 'normal',\n              scrollable: scrollable,\n              multiSelect: false,\n              action: () => {},\n              onValueUpdate: (values: string[]) => {\n                setRestartFilter(true);\n                setInit(false);\n              },\n              items: list,\n            }}\n            filter={!disableFiltering && !restartFilter ? input || '' : ''}\n            setIsOpen={setIsOpen}\n            alignLeft={false}\n            isButton={false}\n            id={`${id}_dropdowncontent`}\n          />\n        )}\n      </Dropdown>\n      {activeValidationMessage && (\n        <ErrorMessage className={size || ''}>\n          <TechnicalWarning color={COLORS.critical_400} />\n          <span>{activeValidationMessage}</span>\n        </ErrorMessage>\n      )}\n      {autofilledMessage && (\n        <AutofilledMessage className={size || ''}>\n          <Information color={COLORS.neutral_600} />\n          <span>{autofilledMessage}</span>\n        </AutofilledMessage>\n      )}\n    </>\n  );\n});\n\nexport default DropdownFilter;\n"],"file":"DropdownFilter.js"}
+{"version":3,"sources":["../../src/Dropdown/DropdownFilter.tsx"],"names":["React","COLORS","ArrowDropDown","ArrowDropUp","Information","TechnicalWarning","LoadingIndicator","StyledField","Dropdown","InputField","DropdownContent","Size","AutofilledMessage","ErrorMessage","defaultOnMouseDownHandler","useActionWithin","useClickOutsideRef","useFocusOutsideRef","useFocusVisibleRef","IconButton","SystemIcons","DropdownFilter","forwardRef","ref","id","list","placeholder","onSelect","onInputChange","value","required","messageOnNoResults","disabled","readOnly","scrollable","activeValidationMessage","autofilledMessage","size","disableFiltering","buttonFontSize","margin","loading","onFocus","onBlur","rest","useState","isOpen","setIsOpen","input","setInput","placeholderSearch","setPlaceholderSearch","restartFilter","setRestartFilter","selectedItem","setSelectedItem","selectedValues","setSelectedValues","focused","setFocused","init","setInit","styledFieldRef","inputRef","clearButtonRef","useRef","useImperativeHandle","current","containerRef","handleInputKeyDown","e","key","preventDefault","useEffect","length","val","item","find","a","displayLabel","undefined","handleInputClear","focus","focusVisible","detail","renderInput","stopPropagation","blur","Math","floor","random","target","marginLeft","Small","neutral_600","itemsType","multiSelect","action","onValueUpdate","values","items","critical_400"],"mappings":";;;;;;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,MAAT,QAAuB,WAAvB;AACA,SAASC,aAAT,EAAwBC,WAAxB,EAAqCC,WAArC,EAAkDC,gBAAlD,QAA0E,kCAA1E;AACA,SAASC,gBAAT,QAAiC,qBAAjC;AACA,SAASC,WAAT,EAAsBC,QAAtB,EAAgCC,UAAhC,QAAkD,iBAAlD;AACA,OAAOC,eAAP,MAA8C,mBAA9C;AACA,SAASC,IAAT,QAAqB,UAArB;AACA,SAASC,iBAAT,EAA4BC,YAA5B,QAAgD,gBAAhD;AACA,SAASC,yBAAT,EAAoCC,eAApC,EAAqDC,kBAArD,EAAyEC,kBAAzE,EAA6FC,kBAA7F,QAAuH,WAAvH;AACA,SAASC,UAAT,QAA2B,WAA3B;AACA,SAASC,WAAT,QAA4B,UAA5B;;;;AA2BA,IAAMC,cAAc,gBAAGrB,KAAK,CAACsB,UAAN,CAAkB,gBAsByBC,GAtBzB,EAsBiC;AAAA,MArB9BC,EAqB8B,QArB9BA,EAqB8B;AAAA,MApB9BC,IAoB8B,QApB9BA,IAoB8B;AAAA,MAnB9BC,WAmB8B,QAnB9BA,WAmB8B;AAAA,MAlB9BC,QAkB8B,QAlB9BA,QAkB8B;AAAA,MAjB9BC,aAiB8B,QAjB9BA,aAiB8B;AAAA,MAhB9BC,KAgB8B,QAhB9BA,KAgB8B;AAAA,MAf9BC,QAe8B,QAf9BA,QAe8B;AAAA,MAd9BC,kBAc8B,QAd9BA,kBAc8B;AAAA,MAb9BC,QAa8B,QAb9BA,QAa8B;AAAA,MAZ9BC,QAY8B,QAZ9BA,QAY8B;AAAA,MAX9BC,UAW8B,QAX9BA,UAW8B;AAAA,MAV9BC,uBAU8B,QAV9BA,uBAU8B;AAAA,MAT9BC,iBAS8B,QAT9BA,iBAS8B;AAAA,MAR9BC,IAQ8B,QAR9BA,IAQ8B;AAAA,MAP9BC,gBAO8B,QAP9BA,gBAO8B;AAAA,MAN9BC,cAM8B,QAN9BA,cAM8B;AAAA,yBAL9BC,MAK8B;AAAA,MAL9BA,MAK8B,4BALrB,OAKqB;AAAA,MAJ9BC,OAI8B,QAJ9BA,OAI8B;AAAA,MAH9BC,QAG8B,QAH9BA,OAG8B;AAAA,MAF9BC,OAE8B,QAF9BA,MAE8B;AAAA,MAD3BC,IAC2B;;AACxE,wBAA4B5C,KAAK,CAAC6C,QAAN,CAAwB,KAAxB,CAA5B;AAAA;AAAA,MAAOC,MAAP;AAAA,MAAeC,SAAf;;AACA,yBAA0B/C,KAAK,CAAC6C,QAAN,EAA1B;AAAA;AAAA,MAAOG,KAAP;AAAA,MAAcC,QAAd;;AACA,yBAAkDjD,KAAK,CAAC6C,QAAN,CAAuBnB,WAAW,IAAI,EAAtC,CAAlD;AAAA;AAAA,MAAOwB,iBAAP;AAAA,MAA0BC,oBAA1B;;AACA,yBAA0CnD,KAAK,CAAC6C,QAAN,CAAwB,KAAxB,CAA1C;AAAA;AAAA,MAAOO,aAAP;AAAA,MAAsBC,gBAAtB;;AACA,yBAAwCrD,KAAK,CAAC6C,QAAN,EAAxC;AAAA;AAAA,MAAOS,YAAP;AAAA,MAAqBC,eAArB;;AACA,0BAA4CvD,KAAK,CAAC6C,QAAN,CAAyB,EAAzB,CAA5C;AAAA;AAAA,MAAOW,cAAP;AAAA,MAAuBC,iBAAvB;;AACA,0BAA8BzD,KAAK,CAAC6C,QAAN,CAA8B,IAA9B,CAA9B;AAAA;AAAA,MAAOa,OAAP;AAAA,MAAgBC,UAAhB;;AACA,0BAAwB3D,KAAK,CAAC6C,QAAN,CAAwB,IAAxB,CAAxB;AAAA;AAAA,MAAOe,IAAP;AAAA,MAAaC,OAAb;;AAEA,MAAMC,cAAc,GAAG5C,kBAAkB,EAAzC;AACA,MAAM6C,QAAQ,GAAG7C,kBAAkB,CAAC,CAAC4C,cAAD,CAAD,CAAnC;AACA,MAAME,cAAc,GAAGhE,KAAK,CAACiE,MAAN,CAAgC,IAAhC,CAAvB;AAEAlD,EAAAA,eAAe,CAAC+C,cAAD,EAAiBd,KAAK,IAAI,CAACf,QAAV,IAAsB,CAACD,QAAvB,GAAkC,CAACgC,cAAD,CAAlC,GAAqD,EAAtE,CAAf;AAEAhE,EAAAA,KAAK,CAACkE,mBAAN,CAA0B3C,GAA1B,EAA+B;AAAA,WAAMwC,QAAQ,CAACI,OAAf;AAAA,GAA/B,EAAuD,CAACJ,QAAD,CAAvD;AAEA,MAAMK,YAAY,GAAGpD,kBAAkB,CACrC;AAAA,WAAM+B,SAAS,CAAC,KAAD,CAAf;AAAA,GADqC,EAErC,EAFqC,EAGrC9B,kBAAkB,CAAC;AAAA,WAAM8B,SAAS,CAAC,KAAD,CAAf;AAAA,GAAD,CAHmB,CAAvC;;AAMA,MAAMsB,kBAAkB,GAAG,SAArBA,kBAAqB,CAACC,CAAD,EAA8C;AACvE,QAAIA,CAAC,CAACC,GAAF,KAAU,KAAV,IAAmBD,CAAC,CAACC,GAAF,KAAU,QAAjC,EAA2C;AACzCD,MAAAA,CAAC,CAACE,cAAF;AACD;;AACD,QAAIF,CAAC,CAACC,GAAF,KAAU,WAAV,IAAyBD,CAAC,CAACC,GAAF,KAAU,MAAnC,IAA6CD,CAAC,CAACC,GAAF,KAAU,SAAvD,IAAoED,CAAC,CAACC,GAAF,KAAU,IAAlF,EAAwF;AACtFD,MAAAA,CAAC,CAACE,cAAF;;AACA,UAAI,CAAC1B,MAAL,EAAa;AACXC,QAAAA,SAAS,CAAC,IAAD,CAAT;AACD;AACF;AACF,GAVD;;AAYA/C,EAAAA,KAAK,CAACyE,SAAN,CAAgB,YAAM;AACpBZ,IAAAA,OAAO,CAAC,IAAD,CAAP;AACAJ,IAAAA,iBAAiB,CAAC,CAAC,CAAC5B,KAAF,GAAU,CAACA,KAAD,CAAV,GAAoB,EAArB,CAAjB;AACD,GAHD,EAGG,CAACA,KAAD,CAHH;AAKA7B,EAAAA,KAAK,CAACyE,SAAN,CAAgB,YAAM;AACpB,QAAIjB,cAAJ,aAAIA,cAAJ,eAAIA,cAAc,CAAEkB,MAApB,EAA4B;AAAA;;AAC1B,UAAMC,GAAG,GAAGnB,cAAc,CAAC,CAAD,CAA1B;AACA,UAAMoB,IAAI,GAAGnD,IAAI,CAACoD,IAAL,CAAU,UAACC,CAAD;AAAA,eAAOA,CAAC,CAACjD,KAAF,KAAY8C,GAAnB;AAAA,OAAV,CAAb;AACApB,MAAAA,eAAe,CAACqB,IAAD,CAAf;AACA3B,MAAAA,QAAQ,gCAAC2B,IAAD,aAACA,IAAD,uBAACA,IAAI,CAAEG,YAAP,mEAAuBH,IAAvB,aAAuBA,IAAvB,uBAAuBA,IAAI,CAAE/C,KAA7B,yCAAsC,EAAtC,CAAR;AACAF,MAAAA,QAAQ,IAAI,CAACiC,IAAb,IAAqBjC,QAAQ,CAACgD,GAAD,CAA7B;AACD,KAND,MAMO;AACLpB,MAAAA,eAAe,CAACyB,SAAD,CAAf;AACArD,MAAAA,QAAQ,IAAI,CAACiC,IAAb,IAAqBjC,QAAQ,CAAC,EAAD,CAA7B;AACAsB,MAAAA,QAAQ,CAAC,EAAD,CAAR;AACD;AACF,GAZD,EAYG,CAACO,cAAD,CAZH;AAcAxD,EAAAA,KAAK,CAACyE,SAAN,CAAgB,YAAM;AACpB,QAAI,CAAC3B,MAAL,EAAa;AACX,UAAI,CAAC,CAACQ,YAAN,EAAoB;AAAA;;AAClBL,QAAAA,QAAQ,mCAACK,YAAD,aAACA,YAAD,uBAACA,YAAY,CAAEyB,YAAf,yEAA+BzB,YAA/B,aAA+BA,YAA/B,uBAA+BA,YAAY,CAAEzB,KAA7C,yCAAsD,EAAtD,CAAR;AACD,OAFD,MAEO;AACLoB,QAAAA,QAAQ,CAAC,EAAD,CAAR;AACD;AACF;;AAEDI,IAAAA,gBAAgB,CAAC,IAAD,CAAhB;AACD,GAVD,EAUG,CAACP,MAAD,EAASQ,YAAT,CAVH;;AAYA,MAAM2B,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACX,CAAD,EAAY;AAAA;;AACnCrB,IAAAA,QAAQ,CAAC,EAAD,CAAR;AACAQ,IAAAA,iBAAiB,CAAC,EAAD,CAAjB;AACA9B,IAAAA,QAAQ,IAAIA,QAAQ,CAAC,EAAD,CAApB;AACA,yBAAAoC,QAAQ,CAACI,OAAT,wEAAkBe,KAAlB,CAAwB;AAAEC,MAAAA,YAAY,EAAE,CAAAb,CAAC,SAAD,IAAAA,CAAC,WAAD,YAAAA,CAAC,CAAEc,MAAH,MAAc;AAA9B,KAAxB;AACD,GALD;;AAOA,MAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxB,wBACE,MAAC,WAAD;AACE,MAAA,GAAG,EAAEvB,cADP;AAEE,MAAA,SAAS,EAAEzB,IAAI,GAAGA,IAAH,GAAU,EAF3B;AAGE,MAAA,OAAO,EAAE,iBAACiC,CAAD,EAAY;AACnB,YAAI,CAACrC,QAAD,IAAa,CAACD,QAAlB,EAA4B;AAC1BsC,UAAAA,CAAC,CAACgB,eAAF;AACAvC,UAAAA,SAAS,CAAC,CAACD,MAAF,CAAT;;AACA,cAAIA,MAAJ,EAAY;AAAA;;AACV,kCAAAiB,QAAQ,CAACI,OAAT,0EAAkBoB,IAAlB;AACD,WAFD,MAEO;AAAA;;AACL,kCAAAxB,QAAQ,CAACI,OAAT,0EAAkBe,KAAlB;AACD;AACF;AACF,OAbH;AAcE,MAAA,QAAQ,EAAElD,QAAQ,IAAI,KAdxB;AAeE,MAAA,QAAQ,EAAEC,QAAQ,IAAI,KAfxB;AAgBE,MAAA,aAAa,EAAE,CAACe,KAhBlB;AAiBE,MAAA,QAAQ,EAAET,cAjBZ;AAkBE,MAAA,qBAAqB,EAAE,CAAC,CAACJ,uBAlB3B;AAmBE,MAAA,WAAW,EAAErB,yBAnBf;AAoBE,wCAAyBU,EAAzB,CApBF;AAAA,8BAqBE,KAAC,UAAD;AACE,QAAA,EAAE,EAAEA,EADN;AAEE,QAAA,GAAG,EAAEuC,QAFP;AAGE,QAAA,YAAY,EAAE,SAASyB,IAAI,CAACC,KAAL,CAAWD,IAAI,CAACE,MAAL,KAAgB,YAA3B,CAHzB;AAIE,QAAA,IAAI,EAAC,QAJP;AAKE,QAAA,WAAW,EAAExC,iBALf;AAME,QAAA,SAAS,EAAEmB,kBANb;AAOE,QAAA,KAAK,EAAErB,KAAK,IAAI,EAPlB;AAQE,QAAA,QAAQ,EAAE,kBAACsB,CAAD,EAAY;AACpB,cAAI,CAACA,CAAC,CAACqB,MAAF,CAAS9D,KAAd,EAAqB;AACnB4B,YAAAA,iBAAiB,CAAC,EAAD,CAAjB;AACD;;AACD,cAAI,CAACxB,QAAD,IAAa,CAACD,QAAd,IAA0BsC,CAAC,CAACqB,MAAF,CAAS9D,KAAT,KAAmBmB,KAAjD,EAAwD;AACtDK,YAAAA,gBAAgB,CAAC,KAAD,CAAhB;AACAN,YAAAA,SAAS,CAAC,IAAD,CAAT;AACAE,YAAAA,QAAQ,CAACqB,CAAC,CAACqB,MAAF,CAAS9D,KAAV,CAAR;;AACA,gBAAID,aAAJ,EAAmB;AACjBA,cAAAA,aAAa,CAAC0C,CAAC,CAACqB,MAAF,CAAS9D,KAAT,IAAkB,EAAnB,CAAb;AACD;AACF;AACF,SApBH;AAqBE,QAAA,OAAO,EAAE,iBAACyC,CAAD,EAAO;AACdnB,UAAAA,oBAAoB,CAAC,EAAD,CAApB;AACAT,UAAAA,QAAO,IAAIA,QAAO,CAAC4B,CAAD,CAAlB;AACD,SAxBH;AAyBE,QAAA,MAAM,EAAE,gBAACA,CAAD,EAAO;AACbnB,UAAAA,oBAAoB,CAACzB,WAAW,IAAI,EAAhB,CAApB;AACAiB,UAAAA,OAAM,IAAIA,OAAM,CAAC2B,CAAD,CAAhB;AACD,SA5BH;AA6BE,QAAA,QAAQ,EAAExC,QA7BZ;AA8BE,QAAA,QAAQ,EAAEE,QAAQ,IAAIC,QAAZ,GAAuB,CAAC,CAAxB,GAA4B,CA9BxC;AA+BE,QAAA,QAAQ,EAAED,QAAQ,IAAI;AA/BxB,SAgCMY,IAhCN,EArBF,EAuDGI,KAAK,IAAI,CAACf,QAAV,IAAsB,CAACD,QAAvB,IAAmC,CAACS,OAApC,iBACC,KAAC,UAAD;AAAY,QAAA,MAAM,EAAEwC,gBAApB;AAAsC,QAAA,GAAG,EAAEjB,cAA3C;AAA2D,QAAA,wBAAwB,EAAE,IAArF;AAA2F,QAAA,KAAK,EAAE,UAAlG;AAA8G,QAAA,KAAK,EAAE;AAAE4B,UAAAA,UAAU,EAAE;AAAd,SAArH;AAA6I,QAAA,OAAO,EAAE,WAAtJ;AAAA,+BACE,KAAC,WAAD,CAAa,KAAb;AADF,QAxDJ,EA6DG,CAAC5D,QAAD,IAAa,CAACC,QAAd,IAA0BQ,OAA1B,iBACC;AAAK,QAAA,KAAK,EAAE;AAAEmD,UAAAA,UAAU,EAAE;AAAd,SAAZ;AAAA,+BACE,KAAC,gBAAD;AAAkB,UAAA,IAAI,EAAEjF,IAAI,CAACkF,KAA7B;AAAoC,UAAA,KAAK,EAAE5F,MAAM,CAAC6F;AAAlD;AADF,QA9DJ,eAmEE;AAAK,QAAA,SAAS,EAAE,gBAAhB;AAAA,kBACGhD,MAAM,IAAI,CAACb,QAAX,IAAuB,CAACD,QAAxB,gBAAmC,KAAC,WAAD;AAAa,UAAA,IAAI,EAAC,MAAlB;AAAyB,UAAA,SAAS,EAAEK,IAAI,GAAGA,IAAH,GAAU;AAAlD,UAAnC,gBAA8F,KAAC,aAAD;AAAe,UAAA,IAAI,EAAC,MAApB;AAA2B,UAAA,SAAS,EAAEA,IAAI,GAAGA,IAAH,GAAU;AAApD;AADjG,QAnEF;AAAA,MADF;AAyED,GA1ED;;AA4EA,sBACE;AAAA,4BACE,MAAC,QAAD;AAAU,MAAA,GAAG,EAAE+B,YAAf;AAA6B,MAAA,QAAQ,EAAEpC,QAAvC;AAAiD,MAAA,QAAQ,EAAE,KAA3D;AAAkE,MAAA,QAAQ,EAAEC,QAA5E;AAAsF,MAAA,SAAS,EAAEI,IAAI,GAAGA,IAAH,GAAU,EAA/G;AAAmH,MAAA,MAAM,EAAEG,MAA3H;AAAA,iBACG6C,WAAW,EADd,EAEG,CAACpD,QAAD,IAAa,CAACD,QAAd,iBACC,KAAC,eAAD;AACE,QAAA,YAAY,EAAEoC,YADhB;AAEE,QAAA,MAAM,EAAEtB,MAAM,IAAI,CAACL,OAFrB;AAGE,QAAA,kBAAkB,EAAEV,kBAAF,aAAEA,kBAAF,cAAEA,kBAAF,GAAwB,EAH5C;AAIE,QAAA,cAAc,EAAEyB,cAJlB;AAKE,QAAA,iBAAiB,EAAEC,iBALrB;AAME,QAAA,IAAI,EAAEpB,IAAF,aAAEA,IAAF,cAAEA,IAAF,GAAU1B,IAAI,CAACkF,KANrB;AAOE,QAAA,OAAO,EAAEnC,OAPX;AAQE,QAAA,UAAU,EAAEC,UARd;AASE,QAAA,OAAO,EAAE,KATX;AAUE,QAAA,kBAAkB,EAAE;AAClBoC,UAAAA,SAAS,EAAE,QADO;AAElB7D,UAAAA,UAAU,EAAEA,UAFM;AAGlB8D,UAAAA,WAAW,EAAE,KAHK;AAIlBC,UAAAA,MAAM,EAAE,kBAAM,CAAE,CAJE;AAKlBC,UAAAA,aAAa,EAAE,uBAACC,MAAD,EAAsB;AACnC9C,YAAAA,gBAAgB,CAAC,IAAD,CAAhB;AACAQ,YAAAA,OAAO,CAAC,KAAD,CAAP;AACD,WARiB;AASlBuC,UAAAA,KAAK,EAAE3E;AATW,SAVtB;AAqBE,QAAA,MAAM,EAAE,CAACa,gBAAD,IAAqB,CAACc,aAAtB,GAAsCJ,KAAK,IAAI,EAA/C,GAAoD,EArB9D;AAsBE,QAAA,SAAS,EAAED,SAtBb;AAuBE,QAAA,QAAQ,EAAE,KAvBZ;AAwBE,QAAA,EAAE,YAAKvB,EAAL;AAxBJ,QAHJ;AAAA,MADF,EAgCGW,uBAAuB,iBACtB,MAAC,YAAD;AAAc,MAAA,SAAS,EAAEE,IAAI,IAAI,EAAjC;AAAA,8BACE,KAAC,gBAAD;AAAkB,QAAA,KAAK,EAAEpC,MAAM,CAACoG;AAAhC,QADF,eAEE;AAAA,kBAAOlE;AAAP,QAFF;AAAA,MAjCJ,EAsCGC,iBAAiB,iBAChB,MAAC,iBAAD;AAAmB,MAAA,SAAS,EAAEC,IAAI,IAAI,EAAtC;AAAA,8BACE,KAAC,WAAD;AAAa,QAAA,KAAK,EAAEpC,MAAM,CAAC6F;AAA3B,QADF,eAEE;AAAA,kBAAO1D;AAAP,QAFF;AAAA,MAvCJ;AAAA,IADF;AA+CD,CA3NsB,CAAvB;;AAxBEX,EAAAA,I;AACAC,EAAAA,W;AAEAG,EAAAA,K;AACAF,EAAAA,Q;AACAC,EAAAA,a;AAEAE,EAAAA,Q;AACAE,EAAAA,Q;AACAC,EAAAA,Q;AACAQ,EAAAA,O;AAEAH,EAAAA,gB;AAEAP,EAAAA,kB;AACAI,EAAAA,uB;AACAC,EAAAA,iB;AAGAG,EAAAA,c;AACAC,EAAAA,M;AACAN,EAAAA,U;;AAgOF,eAAeb,cAAf","sourcesContent":["import * as React from 'react';\nimport { COLORS } from '../styles';\nimport { ArrowDropDown, ArrowDropUp, Information, TechnicalWarning } from '../icons/systemicons/SystemIcons';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { StyledField, Dropdown, InputField } from './CommonStyling';\nimport DropdownContent, { DropdownItem } from './DropdownContent';\nimport { Size } from '../types';\nimport { AutofilledMessage, ErrorMessage } from '../InputFields';\nimport { defaultOnMouseDownHandler, useActionWithin, useClickOutsideRef, useFocusOutsideRef, useFocusVisibleRef } from '../common';\nimport { IconButton } from '../Button';\nimport { SystemIcons } from '../icons';\n\ninterface DropdownFilterProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onSelect' | 'size' | 'list' | 'autoComplete' | 'type' | 'placeholder' | 'onKeyDown' | 'value' | 'onChange' | 'required' | 'tabIndex' | 'disabled' | 'readOnly'> {\n  list: DropdownItem[];\n  placeholder?: string;\n\n  value?: string;\n  onSelect?: (value: string) => void;\n  onInputChange?: (input: string) => void;\n\n  required?: boolean;\n  disabled?: boolean;\n  readOnly?: boolean;\n  loading?: boolean;\n\n  disableFiltering?: boolean;\n\n  messageOnNoResults?: string;\n  activeValidationMessage?: string;\n  autofilledMessage?: string;\n  size?: Size.Small | Size.Medium;\n\n  buttonFontSize?: string;\n  margin?: string;\n  scrollable?: boolean;\n}\n\nconst DropdownFilter = React.forwardRef( ({\n                                            id,\n                                            list,\n                                            placeholder,\n                                            onSelect,\n                                            onInputChange,\n                                            value,\n                                            required,\n                                            messageOnNoResults,\n                                            disabled,\n                                            readOnly,\n                                            scrollable,\n                                            activeValidationMessage,\n                                            autofilledMessage,\n                                            size,\n                                            disableFiltering,\n                                            buttonFontSize,\n                                            margin = '4px 0',\n                                            loading,\n                                            onFocus,\n                                            onBlur,\n                                            ...rest\n                                          }: DropdownFilterProps, ref) => {\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [input, setInput] = React.useState<string>();\n  const [placeholderSearch, setPlaceholderSearch] = React.useState<string>(placeholder || '');\n  const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n  const [selectedItem, setSelectedItem] = React.useState<DropdownItem>();\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n  const [focused, setFocused] = React.useState<number | null>(null);\n  const [init, setInit] = React.useState<boolean>(true);\n\n  const styledFieldRef = useFocusVisibleRef();\n  const inputRef = useFocusVisibleRef([styledFieldRef]);\n  const clearButtonRef = React.useRef<HTMLButtonElement>(null);\n\n  useActionWithin(styledFieldRef, input && !readOnly && !disabled ? [clearButtonRef] : []);\n\n  React.useImperativeHandle(ref, () => inputRef.current, [inputRef]);\n\n  const containerRef = useClickOutsideRef(\n    () => setIsOpen(false),\n    [],\n    useFocusOutsideRef(() => setIsOpen(false)),\n  );\n\n  const handleInputKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (e.key === 'Esc' || e.key === 'Escape') {\n      e.preventDefault();\n    }\n    if (e.key === 'ArrowDown' || e.key === 'Down' || e.key === 'ArrowUp' || e.key === 'Up') {\n      e.preventDefault();\n      if (!isOpen) {\n        setIsOpen(true);\n      }\n    }\n  };\n\n  React.useEffect(() => {\n    setInit(true);\n    setSelectedValues(!!value ? [value] : []);\n  }, [value]);\n\n  React.useEffect(() => {\n    if (selectedValues?.length) {\n      const val = selectedValues[0];\n      const item = list.find((a) => a.value === val);\n      setSelectedItem(item);\n      setInput(item?.displayLabel ?? item?.value ?? '');\n      onSelect && !init && onSelect(val);\n    } else {\n      setSelectedItem(undefined);\n      onSelect && !init && onSelect('');\n      setInput('');\n    }\n  }, [selectedValues]);\n\n  React.useEffect(() => {\n    if (!isOpen) {\n      if (!!selectedItem) {\n        setInput(selectedItem?.displayLabel ?? selectedItem?.value ?? '');\n      } else {\n        setInput('');\n      }\n    }\n\n    setRestartFilter(true);\n  }, [isOpen, selectedItem]);\n\n  const handleInputClear = (e: any) => {\n    setInput('');\n    setSelectedValues([]);\n    onSelect && onSelect('');\n    inputRef.current?.focus({ focusVisible: e?.detail !== 1 } as any);\n  };\n\n  const renderInput = () => {\n    return (\n      <StyledField\n        ref={styledFieldRef}\n        className={size ? size : ''}\n        onClick={(e: any) => {\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        disabled={disabled || false}\n        readOnly={readOnly || false}\n        isPlaceholder={!input}\n        fontSize={buttonFontSize}\n        showValidationMessage={!!activeValidationMessage}\n        onMouseDown={defaultOnMouseDownHandler}\n        data-testid={`otherdiv_${id}`}>\n        <InputField\n          id={id}\n          ref={inputRef}\n          autoComplete={'off-' + Math.floor(Math.random() * 999999999999)}\n          type=\"search\"\n          placeholder={placeholderSearch}\n          onKeyDown={handleInputKeyDown}\n          value={input || ''}\n          onChange={(e: any) => {\n            if (!e.target.value) {\n              setSelectedValues([]);\n            }\n            if (!readOnly && !disabled && e.target.value !== input) {\n              setRestartFilter(false);\n              setIsOpen(true);\n              setInput(e.target.value);\n              if (onInputChange) {\n                onInputChange(e.target.value || '');\n              }\n            }\n          }}\n          onFocus={(e) => {\n            setPlaceholderSearch('');\n            onFocus && onFocus(e);\n          }}\n          onBlur={(e) => {\n            setPlaceholderSearch(placeholder || '');\n            onBlur && onBlur(e);\n          }}\n          required={required}\n          tabIndex={disabled || readOnly ? -1 : 0}\n          disabled={disabled || false}\n          {...rest}\n        />\n        {input && !readOnly && !disabled && !loading && (\n          <IconButton action={handleInputClear} ref={clearButtonRef} useTransparentBackground={true} shape={'circular'} style={{ marginLeft: '-4px' }} variant={'secondary'}>\n            <SystemIcons.Clear />\n          </IconButton>\n        )}\n\n        {!disabled && !readOnly && loading && (\n          <div style={{ marginLeft: '-4xp' }}>\n            <LoadingIndicator size={Size.Small} color={COLORS.neutral_600} />\n          </div>\n        )}\n\n        <div className={'dropdown-arrow'}>\n          {isOpen && !readOnly && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''} /> : <ArrowDropDown size=\"24px\" className={size ? size : ''} />}\n        </div>\n      </StyledField>\n    );\n  };\n\n  return (\n    <>\n      <Dropdown ref={containerRef} disabled={disabled} isButton={false} readOnly={readOnly} className={size ? size : ''} margin={margin}>\n        {renderInput()}\n        {!readOnly && !disabled && (\n          <DropdownContent\n            containerRef={containerRef}\n            isOpen={isOpen && !loading}\n            messageOnNoResults={messageOnNoResults ?? ''}\n            selectedValues={selectedValues}\n            setSelectedValues={setSelectedValues}\n            size={size ?? Size.Small}\n            focused={focused}\n            setFocused={setFocused}\n            outline={false}\n            customizationProps={{\n              itemsType: 'normal',\n              scrollable: scrollable,\n              multiSelect: false,\n              action: () => {},\n              onValueUpdate: (values: string[]) => {\n                setRestartFilter(true);\n                setInit(false);\n              },\n              items: list,\n            }}\n            filter={!disableFiltering && !restartFilter ? input || '' : ''}\n            setIsOpen={setIsOpen}\n            isButton={false}\n            id={`${id}_dropdowncontent`}\n          />\n        )}\n      </Dropdown>\n      {activeValidationMessage && (\n        <ErrorMessage className={size || ''}>\n          <TechnicalWarning color={COLORS.critical_400} />\n          <span>{activeValidationMessage}</span>\n        </ErrorMessage>\n      )}\n      {autofilledMessage && (\n        <AutofilledMessage className={size || ''}>\n          <Information color={COLORS.neutral_600} />\n          <span>{autofilledMessage}</span>\n        </AutofilledMessage>\n      )}\n    </>\n  );\n});\n\nexport default DropdownFilter;\n"],"file":"DropdownFilter.js"}

package/dist/InputFields/SearchBar.cjs

@@ -156,6 +156,7 @@ var SearchBar = function SearchBar(_ref) {
         })]
       }), showDropdown && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.DropdownContent, {
         id: 'search',
+        containerRef: containerRef,
         size: size,
         isButton: false,
         customizationProps: {

package/dist/InputFields/SearchBar.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/InputFields/SearchBar.tsx"],"names":["ClearIconWrapper","styled","div","SearchBar","id","searchTerm","setSearchTerm","enterSearch","removeSearch","placeholder","performSearchLabel","disabled","validationMessage","onKeyDown","size","margin","showDropdown","dropdownButtonIcon","dropdownButtonLabel","dropdownButtonVariant","dropdownButtonAction","searchList","addToSearchList","dropdownScrollable","containerRef","React","useRef","useState","isOpen","setIsOpen","dropdownRef","isPressingEnter","e","key","preventDefault","stopPropagation","enteredSearchTerm","value","target","dropdownAction","term","concat","items","action","actionLabel","actionIcon","actionVariant","onValueUpdate","scrollable","pinTopItem","COLORS","critical_400"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {COLORS} from '../styles/index';\nimport {Search as SearchIcon, Clear as ClearIcon, TechnicalWarning} from '../icons/systemicons/SystemIcons';\nimport {ErrorMessage, InputWrapper, SearchIconWrapper} from './styling';\nimport {IconButton} from '../Button';\nimport SearchBarInput from './components/SearchBarInput';\nimport SearchField from './components/SearchField';\nimport {Size} from '../types';\nimport styled from 'styled-components';\nimport { DropdownContent, DropdownItem } from '../Dropdown';\nimport { useClickOutsideRef } from '../common';\n\ntype SeachBarProps = {\n  id: string;\n  searchTerm?: string;\n  setSearchTerm: (term: string) => void;\n  enterSearch: (e: any) => void;\n  removeSearch: (e: any) => void;\n  placeholder?: string;\n  performSearchLabel?: string;\n  disabled?: boolean;\n  validationMessage?: string;\n  onKeyDown?: (e: React.KeyboardEvent) => void;\n  size?: Size.Small | Size.Medium;\n  margin?: string;\n  showDropdown?: boolean;\n  dropdownButtonIcon?: React.ReactNode;\n  dropdownButtonLabel?: string;\n  dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';\n  dropdownButtonAction?: () => boolean | void | undefined;\n  searchList?: DropdownItem[];\n  addToSearchList?: (e: DropdownItem) => void;\n  dropdownScrollable?: boolean;\n};\n\nconst ClearIconWrapper = styled.div`\n  display: flex;\n  align-items: center;\n\n  &.hidden {\n    display: none !important;\n  }\n`;\n\nconst SearchBar: React.FunctionComponent<SeachBarProps> = ({\n                                                             id,\n                                                             searchTerm,\n                                                             setSearchTerm,\n                                                             enterSearch,\n                                                             removeSearch,\n                                                             placeholder,\n                                                             performSearchLabel,\n                                                             disabled,\n                                                             validationMessage,\n                                                             onKeyDown,\n                                                             size,\n                                                             margin = '4px 0',\n                                                             showDropdown,\n                                                             dropdownButtonIcon,\n                                                             dropdownButtonLabel,\n                                                             dropdownButtonVariant,\n                                                             dropdownButtonAction,\n                                                             searchList=[],\n                                                             addToSearchList,\n                                                             dropdownScrollable\n                                                           }) => {\n  const containerRef = React.useRef<any>(null);\n\n  const [isOpen, setIsOpen] = React.useState(false);\n  const dropdownRef = useClickOutsideRef(()=>setIsOpen(false), [containerRef]);\n\n  const isPressingEnter = (e: any) => {\n    if (e.key === 'Enter') {\n      e.preventDefault();\n      e.stopPropagation();\n      return true;\n    }\n    return false;\n  };\n\n  const enteredSearchTerm = (e: any) => {\n    addToSearchList && addToSearchList({value:e.target.value});\n    enterSearch(e);\n  }\n\n  const dropdownAction = () => {\n    if(dropdownButtonAction)\n      dropdownButtonAction();    \n  }\n\n  return (\n    <>\n      <InputWrapper\n        disabled={disabled}\n        margin={margin}>\n        <SearchField id={'id'} size={size}\n                     ref={containerRef}\n                     searchTerm={searchTerm}\n                     disabled={disabled}\n                     validationMessage={validationMessage}>\n          <SearchBarInput\n            placeholder={disabled ? '' : placeholder}\n            id={id}\n            size={size}\n            disabled={disabled}\n            setSearchTerm={(term: string) => setSearchTerm(term)}\n            searchTerm={searchTerm}\n            onKeyDown={onKeyDown}\n            enterSearch={enteredSearchTerm}\n            focusParentRefs={[containerRef]}\n            onClick={()=>setIsOpen(!isOpen)}\n            ref={dropdownRef}\n          />\n          <SearchIconWrapper className={size ? size : ''} aria-label={performSearchLabel}>\n            <IconButton id={`${id}_Search`}\n                        variant=\"secondary\"\n                        shape=\"circular\"\n                        action={enterSearch}\n                        disabled={disabled}\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? enterSearch(e) : null)}>\n              <SearchIcon size=\"24px\"/>\n            </IconButton>\n          </SearchIconWrapper>\n          <ClearIconWrapper className={(size ? size : '').concat(!searchTerm ? ' hidden' : '')}>\n            <IconButton id={`${id}_Clear`}\n                        variant=\"secondary\"\n                        shape=\"circular\"\n                        action={removeSearch}\n                        disabled={disabled}\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? removeSearch(e) : null)}>\n              <ClearIcon size=\"24px\"/>\n            </IconButton>\n          </ClearIconWrapper>\n        </SearchField>\n\n      {showDropdown && <DropdownContent id={'search'} \n          size={size}\n          isButton={false}\n          customizationProps={{\n            items:searchList,\n            action: dropdownAction,\n            actionLabel: dropdownButtonLabel,\n            actionIcon: dropdownButtonIcon,\n            actionVariant: dropdownButtonVariant,\n            onValueUpdate:(e)=>{},\n            scrollable: dropdownScrollable,\n            pinTopItem: true\n          }}\n          isOpen={isOpen}\n          setIsOpen={setIsOpen}\n          filter={''}\n          selectedValues={searchTerm ? [searchTerm] : []}\n          setSelectedValues={(e)=>setSearchTerm(e[0])}\n          messageOnNoResults={''}\n          focused={null}\n          setFocused={()=>{}}\n        />}\n\n      </InputWrapper>\n      {validationMessage && (\n        <ErrorMessage className={size || ''}>\n          <TechnicalWarning color={COLORS.critical_400} className={size || ''}/>\n          <span>{validationMessage}</span>\n        </ErrorMessage>\n      )}\n    </>\n  );\n};\n\nexport default SearchBar;\n"],"file":"SearchBar.cjs"}
+{"version":3,"sources":["../../src/InputFields/SearchBar.tsx"],"names":["ClearIconWrapper","styled","div","SearchBar","id","searchTerm","setSearchTerm","enterSearch","removeSearch","placeholder","performSearchLabel","disabled","validationMessage","onKeyDown","size","margin","showDropdown","dropdownButtonIcon","dropdownButtonLabel","dropdownButtonVariant","dropdownButtonAction","searchList","addToSearchList","dropdownScrollable","containerRef","React","useRef","useState","isOpen","setIsOpen","dropdownRef","isPressingEnter","e","key","preventDefault","stopPropagation","enteredSearchTerm","value","target","dropdownAction","term","concat","items","action","actionLabel","actionIcon","actionVariant","onValueUpdate","scrollable","pinTopItem","COLORS","critical_400"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {COLORS} from '../styles/index';\nimport {Search as SearchIcon, Clear as ClearIcon, TechnicalWarning} from '../icons/systemicons/SystemIcons';\nimport {ErrorMessage, InputWrapper, SearchIconWrapper} from './styling';\nimport {IconButton} from '../Button';\nimport SearchBarInput from './components/SearchBarInput';\nimport SearchField from './components/SearchField';\nimport {Size} from '../types';\nimport styled from 'styled-components';\nimport { DropdownContent, DropdownItem } from '../Dropdown';\nimport { useClickOutsideRef } from '../common';\n\ntype SeachBarProps = {\n  id: string;\n  searchTerm?: string;\n  setSearchTerm: (term: string) => void;\n  enterSearch: (e: any) => void;\n  removeSearch: (e: any) => void;\n  placeholder?: string;\n  performSearchLabel?: string;\n  disabled?: boolean;\n  validationMessage?: string;\n  onKeyDown?: (e: React.KeyboardEvent) => void;\n  size?: Size.Small | Size.Medium;\n  margin?: string;\n  showDropdown?: boolean;\n  dropdownButtonIcon?: React.ReactNode;\n  dropdownButtonLabel?: string;\n  dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';\n  dropdownButtonAction?: () => boolean | void | undefined;\n  searchList?: DropdownItem[];\n  addToSearchList?: (e: DropdownItem) => void;\n  dropdownScrollable?: boolean;\n};\n\nconst ClearIconWrapper = styled.div`\n  display: flex;\n  align-items: center;\n\n  &.hidden {\n    display: none !important;\n  }\n`;\n\nconst SearchBar: React.FunctionComponent<SeachBarProps> = ({\n                                                             id,\n                                                             searchTerm,\n                                                             setSearchTerm,\n                                                             enterSearch,\n                                                             removeSearch,\n                                                             placeholder,\n                                                             performSearchLabel,\n                                                             disabled,\n                                                             validationMessage,\n                                                             onKeyDown,\n                                                             size,\n                                                             margin = '4px 0',\n                                                             showDropdown,\n                                                             dropdownButtonIcon,\n                                                             dropdownButtonLabel,\n                                                             dropdownButtonVariant,\n                                                             dropdownButtonAction,\n                                                             searchList=[],\n                                                             addToSearchList,\n                                                             dropdownScrollable\n                                                           }) => {\n  const containerRef = React.useRef<any>(null);\n\n  const [isOpen, setIsOpen] = React.useState(false);\n  const dropdownRef = useClickOutsideRef(()=>setIsOpen(false), [containerRef]);\n\n  const isPressingEnter = (e: any) => {\n    if (e.key === 'Enter') {\n      e.preventDefault();\n      e.stopPropagation();\n      return true;\n    }\n    return false;\n  };\n\n  const enteredSearchTerm = (e: any) => {\n    addToSearchList && addToSearchList({value:e.target.value});\n    enterSearch(e);\n  }\n\n  const dropdownAction = () => {\n    if(dropdownButtonAction)\n      dropdownButtonAction();    \n  }\n\n  return (\n    <>\n      <InputWrapper\n        disabled={disabled}\n        margin={margin}>\n        <SearchField id={'id'} size={size}\n                     ref={containerRef}\n                     searchTerm={searchTerm}\n                     disabled={disabled}\n                     validationMessage={validationMessage}>\n          <SearchBarInput\n            placeholder={disabled ? '' : placeholder}\n            id={id}\n            size={size}\n            disabled={disabled}\n            setSearchTerm={(term: string) => setSearchTerm(term)}\n            searchTerm={searchTerm}\n            onKeyDown={onKeyDown}\n            enterSearch={enteredSearchTerm}\n            focusParentRefs={[containerRef]}\n            onClick={()=>setIsOpen(!isOpen)}\n            ref={dropdownRef}\n          />\n          <SearchIconWrapper className={size ? size : ''} aria-label={performSearchLabel}>\n            <IconButton id={`${id}_Search`}\n                        variant=\"secondary\"\n                        shape=\"circular\"\n                        action={enterSearch}\n                        disabled={disabled}\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? enterSearch(e) : null)}>\n              <SearchIcon size=\"24px\"/>\n            </IconButton>\n          </SearchIconWrapper>\n          <ClearIconWrapper className={(size ? size : '').concat(!searchTerm ? ' hidden' : '')}>\n            <IconButton id={`${id}_Clear`}\n                        variant=\"secondary\"\n                        shape=\"circular\"\n                        action={removeSearch}\n                        disabled={disabled}\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? removeSearch(e) : null)}>\n              <ClearIcon size=\"24px\"/>\n            </IconButton>\n          </ClearIconWrapper>\n        </SearchField>\n\n      {showDropdown && <DropdownContent id={'search'}\n                                        containerRef={containerRef}\n          size={size}\n          isButton={false}\n          customizationProps={{\n            items:searchList,\n            action: dropdownAction,\n            actionLabel: dropdownButtonLabel,\n            actionIcon: dropdownButtonIcon,\n            actionVariant: dropdownButtonVariant,\n            onValueUpdate:(e)=>{},\n            scrollable: dropdownScrollable,\n            pinTopItem: true\n          }}\n          isOpen={isOpen}\n          setIsOpen={setIsOpen}\n          filter={''}\n          selectedValues={searchTerm ? [searchTerm] : []}\n          setSelectedValues={(e)=>setSearchTerm(e[0])}\n          messageOnNoResults={''}\n          focused={null}\n          setFocused={()=>{}}\n        />}\n\n      </InputWrapper>\n      {validationMessage && (\n        <ErrorMessage className={size || ''}>\n          <TechnicalWarning color={COLORS.critical_400} className={size || ''}/>\n          <span>{validationMessage}</span>\n        </ErrorMessage>\n      )}\n    </>\n  );\n};\n\nexport default SearchBar;\n"],"file":"SearchBar.cjs"}

package/dist/InputFields/SearchBar.js

@@ -135,6 +135,7 @@ var SearchBar = function SearchBar(_ref) {
         })]
       }), showDropdown && /*#__PURE__*/_jsx(DropdownContent, {
         id: 'search',
+        containerRef: containerRef,
         size: size,
         isButton: false,
         customizationProps: {

package/dist/InputFields/SearchBar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/InputFields/SearchBar.tsx"],"names":["React","COLORS","Search","SearchIcon","Clear","ClearIcon","TechnicalWarning","ErrorMessage","InputWrapper","SearchIconWrapper","IconButton","SearchBarInput","SearchField","styled","DropdownContent","useClickOutsideRef","ClearIconWrapper","div","SearchBar","id","searchTerm","setSearchTerm","enterSearch","removeSearch","placeholder","performSearchLabel","disabled","validationMessage","onKeyDown","size","margin","showDropdown","dropdownButtonIcon","dropdownButtonLabel","dropdownButtonVariant","dropdownButtonAction","searchList","addToSearchList","dropdownScrollable","containerRef","useRef","useState","isOpen","setIsOpen","dropdownRef","isPressingEnter","e","key","preventDefault","stopPropagation","enteredSearchTerm","value","target","dropdownAction","term","concat","items","action","actionLabel","actionIcon","actionVariant","onValueUpdate","scrollable","pinTopItem","critical_400"],"mappings":";;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAAQC,MAAR,QAAqB,iBAArB;AACA,SAAQC,MAAM,IAAIC,UAAlB,EAA8BC,KAAK,IAAIC,SAAvC,EAAkDC,gBAAlD,QAAyE,kCAAzE;AACA,SAAQC,YAAR,EAAsBC,YAAtB,EAAoCC,iBAApC,QAA4D,WAA5D;AACA,SAAQC,UAAR,QAAyB,WAAzB;AACA,OAAOC,cAAP,MAA2B,6BAA3B;AACA,OAAOC,WAAP,MAAwB,0BAAxB;AAEA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAASC,eAAT,QAA8C,aAA9C;AACA,SAASC,kBAAT,QAAmC,WAAnC;;;;AAyBA,IAAMC,gBAAgB,GAAGH,MAAM,CAACI,GAAV,qKAAtB;;AASA,IAAMC,SAAiD,GAAG,SAApDA,SAAoD,OAqBO;AAAA,MApBJC,EAoBI,QApBJA,EAoBI;AAAA,MAnBJC,UAmBI,QAnBJA,UAmBI;AAAA,MAlBJC,cAkBI,QAlBJA,aAkBI;AAAA,MAjBJC,WAiBI,QAjBJA,WAiBI;AAAA,MAhBJC,YAgBI,QAhBJA,YAgBI;AAAA,MAfJC,WAeI,QAfJA,WAeI;AAAA,MAdJC,kBAcI,QAdJA,kBAcI;AAAA,MAbJC,QAaI,QAbJA,QAaI;AAAA,MAZJC,iBAYI,QAZJA,iBAYI;AAAA,MAXJC,SAWI,QAXJA,SAWI;AAAA,MAVJC,IAUI,QAVJA,IAUI;AAAA,yBATJC,MASI;AAAA,MATJA,MASI,4BATK,OASL;AAAA,MARJC,YAQI,QARJA,YAQI;AAAA,MAPJC,kBAOI,QAPJA,kBAOI;AAAA,MANJC,mBAMI,QANJA,mBAMI;AAAA,MALJC,qBAKI,QALJA,qBAKI;AAAA,MAJJC,oBAII,QAJJA,oBAII;AAAA,6BAHJC,UAGI;AAAA,MAHJA,UAGI,gCAHO,EAGP;AAAA,MAFJC,eAEI,QAFJA,eAEI;AAAA,MADJC,kBACI,QADJA,kBACI;AAC/D,MAAMC,YAAY,GAAGvC,KAAK,CAACwC,MAAN,CAAkB,IAAlB,CAArB;;AAEA,wBAA4BxC,KAAK,CAACyC,QAAN,CAAe,KAAf,CAA5B;AAAA;AAAA,MAAOC,MAAP;AAAA,MAAeC,SAAf;;AACA,MAAMC,WAAW,GAAG7B,kBAAkB,CAAC;AAAA,WAAI4B,SAAS,CAAC,KAAD,CAAb;AAAA,GAAD,EAAuB,CAACJ,YAAD,CAAvB,CAAtC;;AAEA,MAAMM,eAAe,GAAG,SAAlBA,eAAkB,CAACC,CAAD,EAAY;AAClC,QAAIA,CAAC,CAACC,GAAF,KAAU,OAAd,EAAuB;AACrBD,MAAAA,CAAC,CAACE,cAAF;AACAF,MAAAA,CAAC,CAACG,eAAF;AACA,aAAO,IAAP;AACD;;AACD,WAAO,KAAP;AACD,GAPD;;AASA,MAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,CAACJ,CAAD,EAAY;AACpCT,IAAAA,eAAe,IAAIA,eAAe,CAAC;AAACc,MAAAA,KAAK,EAACL,CAAC,CAACM,MAAF,CAASD;AAAhB,KAAD,CAAlC;AACA7B,IAAAA,WAAW,CAACwB,CAAD,CAAX;AACD,GAHD;;AAKA,MAAMO,cAAc,GAAG,SAAjBA,cAAiB,GAAM;AAC3B,QAAGlB,oBAAH,EACEA,oBAAoB;AACvB,GAHD;;AAKA,sBACE;AAAA,4BACE,MAAC,YAAD;AACE,MAAA,QAAQ,EAAET,QADZ;AAEE,MAAA,MAAM,EAAEI,MAFV;AAAA,8BAGE,MAAC,WAAD;AAAa,QAAA,EAAE,EAAE,IAAjB;AAAuB,QAAA,IAAI,EAAED,IAA7B;AACa,QAAA,GAAG,EAAEU,YADlB;AAEa,QAAA,UAAU,EAAEnB,UAFzB;AAGa,QAAA,QAAQ,EAAEM,QAHvB;AAIa,QAAA,iBAAiB,EAAEC,iBAJhC;AAAA,gCAKE,KAAC,cAAD;AACE,UAAA,WAAW,EAAED,QAAQ,GAAG,EAAH,GAAQF,WAD/B;AAEE,UAAA,EAAE,EAAEL,EAFN;AAGE,UAAA,IAAI,EAAEU,IAHR;AAIE,UAAA,QAAQ,EAAEH,QAJZ;AAKE,UAAA,aAAa,EAAE,uBAAC4B,IAAD;AAAA,mBAAkBjC,cAAa,CAACiC,IAAD,CAA/B;AAAA,WALjB;AAME,UAAA,UAAU,EAAElC,UANd;AAOE,UAAA,SAAS,EAAEQ,SAPb;AAQE,UAAA,WAAW,EAAEsB,iBARf;AASE,UAAA,eAAe,EAAE,CAACX,YAAD,CATnB;AAUE,UAAA,OAAO,EAAE;AAAA,mBAAII,SAAS,CAAC,CAACD,MAAF,CAAb;AAAA,WAVX;AAWE,UAAA,GAAG,EAAEE;AAXP,UALF,eAkBE,KAAC,iBAAD;AAAmB,UAAA,SAAS,EAAEf,IAAI,GAAGA,IAAH,GAAU,EAA5C;AAAgD,wBAAYJ,kBAA5D;AAAA,iCACE,KAAC,UAAD;AAAY,YAAA,EAAE,YAAKN,EAAL,YAAd;AACY,YAAA,OAAO,EAAC,WADpB;AAEY,YAAA,KAAK,EAAC,UAFlB;AAGY,YAAA,MAAM,EAAEG,WAHpB;AAIY,YAAA,QAAQ,EAAEI,QAJtB;AAKY,YAAA,UAAU,EAAE,oBAACoB,CAAD;AAAA,qBAAaD,eAAe,CAACC,CAAD,CAAf,GAAqBxB,WAAW,CAACwB,CAAD,CAAhC,GAAsC,IAAnD;AAAA,aALxB;AAAA,mCAME,KAAC,UAAD;AAAY,cAAA,IAAI,EAAC;AAAjB;AANF;AADF,UAlBF,eA4BE,KAAC,gBAAD;AAAkB,UAAA,SAAS,EAAE,CAACjB,IAAI,GAAGA,IAAH,GAAU,EAAf,EAAmB0B,MAAnB,CAA0B,CAACnC,UAAD,GAAc,SAAd,GAA0B,EAApD,CAA7B;AAAA,iCACE,KAAC,UAAD;AAAY,YAAA,EAAE,YAAKD,EAAL,WAAd;AACY,YAAA,OAAO,EAAC,WADpB;AAEY,YAAA,KAAK,EAAC,UAFlB;AAGY,YAAA,MAAM,EAAEI,YAHpB;AAIY,YAAA,QAAQ,EAAEG,QAJtB;AAKY,YAAA,UAAU,EAAE,oBAACoB,CAAD;AAAA,qBAAaD,eAAe,CAACC,CAAD,CAAf,GAAqBvB,YAAY,CAACuB,CAAD,CAAjC,GAAuC,IAApD;AAAA,aALxB;AAAA,mCAME,KAAC,SAAD;AAAW,cAAA,IAAI,EAAC;AAAhB;AANF;AADF,UA5BF;AAAA,QAHF,EA2CCf,YAAY,iBAAI,KAAC,eAAD;AAAiB,QAAA,EAAE,EAAE,QAArB;AACb,QAAA,IAAI,EAAEF,IADO;AAEb,QAAA,QAAQ,EAAE,KAFG;AAGb,QAAA,kBAAkB,EAAE;AAClB2B,UAAAA,KAAK,EAACpB,UADY;AAElBqB,UAAAA,MAAM,EAAEJ,cAFU;AAGlBK,UAAAA,WAAW,EAAEzB,mBAHK;AAIlB0B,UAAAA,UAAU,EAAE3B,kBAJM;AAKlB4B,UAAAA,aAAa,EAAE1B,qBALG;AAMlB2B,UAAAA,aAAa,EAAC,uBAACf,CAAD,EAAK,CAAE,CANH;AAOlBgB,UAAAA,UAAU,EAAExB,kBAPM;AAQlByB,UAAAA,UAAU,EAAE;AARM,SAHP;AAab,QAAA,MAAM,EAAErB,MAbK;AAcb,QAAA,SAAS,EAAEC,SAdE;AAeb,QAAA,MAAM,EAAE,EAfK;AAgBb,QAAA,cAAc,EAAEvB,UAAU,GAAG,CAACA,UAAD,CAAH,GAAkB,EAhB/B;AAiBb,QAAA,iBAAiB,EAAE,2BAAC0B,CAAD;AAAA,iBAAKzB,cAAa,CAACyB,CAAC,CAAC,CAAD,CAAF,CAAlB;AAAA,SAjBN;AAkBb,QAAA,kBAAkB,EAAE,EAlBP;AAmBb,QAAA,OAAO,EAAE,IAnBI;AAoBb,QAAA,UAAU,EAAE,sBAAI,CAAE;AApBL,QA3CjB;AAAA,MADF,EAoEGnB,iBAAiB,iBAChB,MAAC,YAAD;AAAc,MAAA,SAAS,EAAEE,IAAI,IAAI,EAAjC;AAAA,8BACE,KAAC,gBAAD;AAAkB,QAAA,KAAK,EAAE5B,MAAM,CAAC+D,YAAhC;AAA8C,QAAA,SAAS,EAAEnC,IAAI,IAAI;AAAjE,QADF,eAEE;AAAA,kBAAOF;AAAP,QAFF;AAAA,MArEJ;AAAA,IADF;AA6ED,CA3HD;;;AA/BER,EAAAA,E;AACAC,EAAAA,U;AACAC,EAAAA,a;AACAC,EAAAA,W;AACAC,EAAAA,Y;AACAC,EAAAA,W;AACAC,EAAAA,kB;AACAC,EAAAA,Q;AACAC,EAAAA,iB;AACAC,EAAAA,S;AAEAE,EAAAA,M;AACAC,EAAAA,Y;AACAC,EAAAA,kB;AACAC,EAAAA,mB;AACAC,EAAAA,qB,aAAwB,S,EAAY,W,EAAc,U;AAClDC,EAAAA,oB;AACAC,EAAAA,U;AACAC,EAAAA,e;AACAC,EAAAA,kB;;AAyIF,eAAepB,SAAf","sourcesContent":["import React from 'react';\nimport {COLORS} from '../styles/index';\nimport {Search as SearchIcon, Clear as ClearIcon, TechnicalWarning} from '../icons/systemicons/SystemIcons';\nimport {ErrorMessage, InputWrapper, SearchIconWrapper} from './styling';\nimport {IconButton} from '../Button';\nimport SearchBarInput from './components/SearchBarInput';\nimport SearchField from './components/SearchField';\nimport {Size} from '../types';\nimport styled from 'styled-components';\nimport { DropdownContent, DropdownItem } from '../Dropdown';\nimport { useClickOutsideRef } from '../common';\n\ntype SeachBarProps = {\n  id: string;\n  searchTerm?: string;\n  setSearchTerm: (term: string) => void;\n  enterSearch: (e: any) => void;\n  removeSearch: (e: any) => void;\n  placeholder?: string;\n  performSearchLabel?: string;\n  disabled?: boolean;\n  validationMessage?: string;\n  onKeyDown?: (e: React.KeyboardEvent) => void;\n  size?: Size.Small | Size.Medium;\n  margin?: string;\n  showDropdown?: boolean;\n  dropdownButtonIcon?: React.ReactNode;\n  dropdownButtonLabel?: string;\n  dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';\n  dropdownButtonAction?: () => boolean | void | undefined;\n  searchList?: DropdownItem[];\n  addToSearchList?: (e: DropdownItem) => void;\n  dropdownScrollable?: boolean;\n};\n\nconst ClearIconWrapper = styled.div`\n  display: flex;\n  align-items: center;\n\n  &.hidden {\n    display: none !important;\n  }\n`;\n\nconst SearchBar: React.FunctionComponent<SeachBarProps> = ({\n                                                             id,\n                                                             searchTerm,\n                                                             setSearchTerm,\n                                                             enterSearch,\n                                                             removeSearch,\n                                                             placeholder,\n                                                             performSearchLabel,\n                                                             disabled,\n                                                             validationMessage,\n                                                             onKeyDown,\n                                                             size,\n                                                             margin = '4px 0',\n                                                             showDropdown,\n                                                             dropdownButtonIcon,\n                                                             dropdownButtonLabel,\n                                                             dropdownButtonVariant,\n                                                             dropdownButtonAction,\n                                                             searchList=[],\n                                                             addToSearchList,\n                                                             dropdownScrollable\n                                                           }) => {\n  const containerRef = React.useRef<any>(null);\n\n  const [isOpen, setIsOpen] = React.useState(false);\n  const dropdownRef = useClickOutsideRef(()=>setIsOpen(false), [containerRef]);\n\n  const isPressingEnter = (e: any) => {\n    if (e.key === 'Enter') {\n      e.preventDefault();\n      e.stopPropagation();\n      return true;\n    }\n    return false;\n  };\n\n  const enteredSearchTerm = (e: any) => {\n    addToSearchList && addToSearchList({value:e.target.value});\n    enterSearch(e);\n  }\n\n  const dropdownAction = () => {\n    if(dropdownButtonAction)\n      dropdownButtonAction();    \n  }\n\n  return (\n    <>\n      <InputWrapper\n        disabled={disabled}\n        margin={margin}>\n        <SearchField id={'id'} size={size}\n                     ref={containerRef}\n                     searchTerm={searchTerm}\n                     disabled={disabled}\n                     validationMessage={validationMessage}>\n          <SearchBarInput\n            placeholder={disabled ? '' : placeholder}\n            id={id}\n            size={size}\n            disabled={disabled}\n            setSearchTerm={(term: string) => setSearchTerm(term)}\n            searchTerm={searchTerm}\n            onKeyDown={onKeyDown}\n            enterSearch={enteredSearchTerm}\n            focusParentRefs={[containerRef]}\n            onClick={()=>setIsOpen(!isOpen)}\n            ref={dropdownRef}\n          />\n          <SearchIconWrapper className={size ? size : ''} aria-label={performSearchLabel}>\n            <IconButton id={`${id}_Search`}\n                        variant=\"secondary\"\n                        shape=\"circular\"\n                        action={enterSearch}\n                        disabled={disabled}\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? enterSearch(e) : null)}>\n              <SearchIcon size=\"24px\"/>\n            </IconButton>\n          </SearchIconWrapper>\n          <ClearIconWrapper className={(size ? size : '').concat(!searchTerm ? ' hidden' : '')}>\n            <IconButton id={`${id}_Clear`}\n                        variant=\"secondary\"\n                        shape=\"circular\"\n                        action={removeSearch}\n                        disabled={disabled}\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? removeSearch(e) : null)}>\n              <ClearIcon size=\"24px\"/>\n            </IconButton>\n          </ClearIconWrapper>\n        </SearchField>\n\n      {showDropdown && <DropdownContent id={'search'} \n          size={size}\n          isButton={false}\n          customizationProps={{\n            items:searchList,\n            action: dropdownAction,\n            actionLabel: dropdownButtonLabel,\n            actionIcon: dropdownButtonIcon,\n            actionVariant: dropdownButtonVariant,\n            onValueUpdate:(e)=>{},\n            scrollable: dropdownScrollable,\n            pinTopItem: true\n          }}\n          isOpen={isOpen}\n          setIsOpen={setIsOpen}\n          filter={''}\n          selectedValues={searchTerm ? [searchTerm] : []}\n          setSelectedValues={(e)=>setSearchTerm(e[0])}\n          messageOnNoResults={''}\n          focused={null}\n          setFocused={()=>{}}\n        />}\n\n      </InputWrapper>\n      {validationMessage && (\n        <ErrorMessage className={size || ''}>\n          <TechnicalWarning color={COLORS.critical_400} className={size || ''}/>\n          <span>{validationMessage}</span>\n        </ErrorMessage>\n      )}\n    </>\n  );\n};\n\nexport default SearchBar;\n"],"file":"SearchBar.js"}
+{"version":3,"sources":["../../src/InputFields/SearchBar.tsx"],"names":["React","COLORS","Search","SearchIcon","Clear","ClearIcon","TechnicalWarning","ErrorMessage","InputWrapper","SearchIconWrapper","IconButton","SearchBarInput","SearchField","styled","DropdownContent","useClickOutsideRef","ClearIconWrapper","div","SearchBar","id","searchTerm","setSearchTerm","enterSearch","removeSearch","placeholder","performSearchLabel","disabled","validationMessage","onKeyDown","size","margin","showDropdown","dropdownButtonIcon","dropdownButtonLabel","dropdownButtonVariant","dropdownButtonAction","searchList","addToSearchList","dropdownScrollable","containerRef","useRef","useState","isOpen","setIsOpen","dropdownRef","isPressingEnter","e","key","preventDefault","stopPropagation","enteredSearchTerm","value","target","dropdownAction","term","concat","items","action","actionLabel","actionIcon","actionVariant","onValueUpdate","scrollable","pinTopItem","critical_400"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {COLORS} from '../styles/index';\nimport {Search as SearchIcon, Clear as ClearIcon, TechnicalWarning} from '../icons/systemicons/SystemIcons';\nimport {ErrorMessage, InputWrapper, SearchIconWrapper} from './styling';\nimport {IconButton} from '../Button';\nimport SearchBarInput from './components/SearchBarInput';\nimport SearchField from './components/SearchField';\nimport {Size} from '../types';\nimport styled from 'styled-components';\nimport { DropdownContent, DropdownItem } from '../Dropdown';\nimport { useClickOutsideRef } from '../common';\n\ntype SeachBarProps = {\n  id: string;\n  searchTerm?: string;\n  setSearchTerm: (term: string) => void;\n  enterSearch: (e: any) => void;\n  removeSearch: (e: any) => void;\n  placeholder?: string;\n  performSearchLabel?: string;\n  disabled?: boolean;\n  validationMessage?: string;\n  onKeyDown?: (e: React.KeyboardEvent) => void;\n  size?: Size.Small | Size.Medium;\n  margin?: string;\n  showDropdown?: boolean;\n  dropdownButtonIcon?: React.ReactNode;\n  dropdownButtonLabel?: string;\n  dropdownButtonVariant?: 'primary' | 'secondary' | 'tertiary';\n  dropdownButtonAction?: () => boolean | void | undefined;\n  searchList?: DropdownItem[];\n  addToSearchList?: (e: DropdownItem) => void;\n  dropdownScrollable?: boolean;\n};\n\nconst ClearIconWrapper = styled.div`\n  display: flex;\n  align-items: center;\n\n  &.hidden {\n    display: none !important;\n  }\n`;\n\nconst SearchBar: React.FunctionComponent<SeachBarProps> = ({\n                                                             id,\n                                                             searchTerm,\n                                                             setSearchTerm,\n                                                             enterSearch,\n                                                             removeSearch,\n                                                             placeholder,\n                                                             performSearchLabel,\n                                                             disabled,\n                                                             validationMessage,\n                                                             onKeyDown,\n                                                             size,\n                                                             margin = '4px 0',\n                                                             showDropdown,\n                                                             dropdownButtonIcon,\n                                                             dropdownButtonLabel,\n                                                             dropdownButtonVariant,\n                                                             dropdownButtonAction,\n                                                             searchList=[],\n                                                             addToSearchList,\n                                                             dropdownScrollable\n                                                           }) => {\n  const containerRef = React.useRef<any>(null);\n\n  const [isOpen, setIsOpen] = React.useState(false);\n  const dropdownRef = useClickOutsideRef(()=>setIsOpen(false), [containerRef]);\n\n  const isPressingEnter = (e: any) => {\n    if (e.key === 'Enter') {\n      e.preventDefault();\n      e.stopPropagation();\n      return true;\n    }\n    return false;\n  };\n\n  const enteredSearchTerm = (e: any) => {\n    addToSearchList && addToSearchList({value:e.target.value});\n    enterSearch(e);\n  }\n\n  const dropdownAction = () => {\n    if(dropdownButtonAction)\n      dropdownButtonAction();    \n  }\n\n  return (\n    <>\n      <InputWrapper\n        disabled={disabled}\n        margin={margin}>\n        <SearchField id={'id'} size={size}\n                     ref={containerRef}\n                     searchTerm={searchTerm}\n                     disabled={disabled}\n                     validationMessage={validationMessage}>\n          <SearchBarInput\n            placeholder={disabled ? '' : placeholder}\n            id={id}\n            size={size}\n            disabled={disabled}\n            setSearchTerm={(term: string) => setSearchTerm(term)}\n            searchTerm={searchTerm}\n            onKeyDown={onKeyDown}\n            enterSearch={enteredSearchTerm}\n            focusParentRefs={[containerRef]}\n            onClick={()=>setIsOpen(!isOpen)}\n            ref={dropdownRef}\n          />\n          <SearchIconWrapper className={size ? size : ''} aria-label={performSearchLabel}>\n            <IconButton id={`${id}_Search`}\n                        variant=\"secondary\"\n                        shape=\"circular\"\n                        action={enterSearch}\n                        disabled={disabled}\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? enterSearch(e) : null)}>\n              <SearchIcon size=\"24px\"/>\n            </IconButton>\n          </SearchIconWrapper>\n          <ClearIconWrapper className={(size ? size : '').concat(!searchTerm ? ' hidden' : '')}>\n            <IconButton id={`${id}_Clear`}\n                        variant=\"secondary\"\n                        shape=\"circular\"\n                        action={removeSearch}\n                        disabled={disabled}\n                        onKeyPress={(e: any) => (isPressingEnter(e) ? removeSearch(e) : null)}>\n              <ClearIcon size=\"24px\"/>\n            </IconButton>\n          </ClearIconWrapper>\n        </SearchField>\n\n      {showDropdown && <DropdownContent id={'search'}\n                                        containerRef={containerRef}\n          size={size}\n          isButton={false}\n          customizationProps={{\n            items:searchList,\n            action: dropdownAction,\n            actionLabel: dropdownButtonLabel,\n            actionIcon: dropdownButtonIcon,\n            actionVariant: dropdownButtonVariant,\n            onValueUpdate:(e)=>{},\n            scrollable: dropdownScrollable,\n            pinTopItem: true\n          }}\n          isOpen={isOpen}\n          setIsOpen={setIsOpen}\n          filter={''}\n          selectedValues={searchTerm ? [searchTerm] : []}\n          setSelectedValues={(e)=>setSearchTerm(e[0])}\n          messageOnNoResults={''}\n          focused={null}\n          setFocused={()=>{}}\n        />}\n\n      </InputWrapper>\n      {validationMessage && (\n        <ErrorMessage className={size || ''}>\n          <TechnicalWarning color={COLORS.critical_400} className={size || ''}/>\n          <span>{validationMessage}</span>\n        </ErrorMessage>\n      )}\n    </>\n  );\n};\n\nexport default SearchBar;\n"],"file":"SearchBar.js"}

package/dist/List/ListRow.cjs

@@ -51,7 +51,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-var Row = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  border-bottom: 1px solid ", ";\n  box-sizing: border-box;\n  position: relative;\n\n  color: ", ";\n  background-color: ", ";\n\n\n  cursor: default;\n\n  &.interactive {\n    cursor: pointer;\n  }\n\n  &.interactive.disabled {\n    cursor: not-allowed;\n  }\n\n  &.interactive:hover:not(.in-action):not(.disabled) {\n    background-color: ", ";\n    color: ", ";\n    z-index: ", ";\n  }\n\n  &.interactive:active:not(.in-action):not(.disabled) {\n    background-color: ", ";\n    color: ", ";\n    z-index: ", ";\n  }\n\n  &.interactive:focus {\n    ", "\n  }\n\n  &.disabled {\n    .list-item-icon, .list-item-content, .list-item-note, .list-item-actions {\n      color: ", ";\n    }\n  }\n\n\n  &.small {\n    min-height: 48px;\n    padding: 0 8px;\n\n    .list-item-icon {\n      margin-right: 8px;\n    }\n\n    .list-item-main-text {\n      ", "\n    }\n\n    .list-item-actions {\n      margin-right: -8px;\n    }\n  }\n\n  &.medium {\n    min-height: 56px;\n    padding: 0 12px;\n\n    .list-item-icon {\n      margin-right: 12px;\n    }\n\n    .list-item-main-text {\n      ", "\n    }\n\n    .list-item-actions {\n      margin-right: -12px;\n    }\n  }\n\n  &.large {\n    min-height: 64px;\n    padding: 0 16px;\n\n    .list-item-icon {\n      margin-right: 16px;\n    }\n\n    .list-item-main-text {\n      ", "\n    }\n\n    .list-item-actions {\n      margin-right: -16px;\n    }\n  }\n\n  &.overlay {\n    padding: 0 4px;\n\n    .list-item-actions {\n      margin-right: -4px;\n    }\n  }\n\n  .list-item-icon {\n    width: 24px;\n    height: 24px;\n\n    svg {\n      width: 24px;\n      height: 24px;\n    }\n  }\n\n  .list-item-content {\n    flex-grow: 1;\n    display: flex;\n    flex-direction: column;\n  }\n\n  .list-item-main-text {\n  }\n\n  .list-item-secondary-text {\n    ", "\n  }\n\n  .list-item-note {\n    color: ", ";\n    word-break: initial;\n    ", "\n  }\n\n  .list-item-note.with-tooltip {\n    cursor: pointer;\n\n    > div {\n      text-decoration-line: underline;\n      text-decoration-style: dashed;\n      text-underline-offset: 1px;\n      text-decoration-thickness: 1px;\n    }\n  }\n\n  .list-item-actions {\n    color: ", ";\n    display: flex;\n    align-items: center;\n\n    button div {\n      background-color: transparent;\n    }\n  }\n"])), _styles.COLORS.neutral_100, _styles.COLORS.neutral_600, _styles.COLORS.white, _styles.COLORS.primary_20, _styles.COLORS.primary_700, _styles.Z_INDEXES.hover, _styles.COLORS.primary_100, _styles.COLORS.primary_800, _styles.Z_INDEXES.active, _styles.focusStyles, _styles.COLORS.neutral_300, (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Regular, null), (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Regular, null), (0, _styles.ComponentLStyling)(_styles.ComponentTextStyle.Regular, null), (0, _styles.ComponentXXSStyling)(_styles.ComponentTextStyle.Regular, null), _styles.COLORS.neutral_600, (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, null), _styles.COLORS.neutral_600);
+var Row = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  border-bottom: 1px solid ", ";\n  box-sizing: border-box;\n\n  color: ", ";\n  background-color: ", ";\n\n\n  cursor: default;\n\n  &.interactive {\n    cursor: pointer;\n  }\n\n  &.interactive.disabled {\n    cursor: not-allowed;\n  }\n\n  &.interactive:hover:not(.in-action):not(.disabled) {\n    background-color: ", ";\n    color: ", ";\n    z-index: ", ";\n  }\n\n  &.interactive:active:not(.in-action):not(.disabled) {\n    background-color: ", ";\n    color: ", ";\n    z-index: ", ";\n  }\n\n  &.interactive:focus {\n    ", "\n  }\n\n  &.disabled {\n    .list-item-icon, .list-item-content, .list-item-note, .list-item-actions {\n      color: ", ";\n    }\n  }\n\n\n  &.small {\n    min-height: 48px;\n    padding: 0 8px;\n\n    .list-item-icon {\n      margin-right: 8px;\n    }\n\n    .list-item-main-text {\n      ", "\n    }\n\n    .list-item-actions {\n      margin-right: -8px;\n    }\n  }\n\n  &.medium {\n    min-height: 56px;\n    padding: 0 12px;\n\n    .list-item-icon {\n      margin-right: 12px;\n    }\n\n    .list-item-main-text {\n      ", "\n    }\n\n    .list-item-actions {\n      margin-right: -12px;\n    }\n  }\n\n  &.large {\n    min-height: 64px;\n    padding: 0 16px;\n\n    .list-item-icon {\n      margin-right: 16px;\n    }\n\n    .list-item-main-text {\n      ", "\n    }\n\n    .list-item-actions {\n      margin-right: -16px;\n    }\n  }\n\n  &.overlay {\n    padding: 0 4px;\n\n    .list-item-actions {\n      margin-right: -4px;\n    }\n  }\n\n  .list-item-icon {\n    width: 24px;\n    height: 24px;\n\n    svg {\n      width: 24px;\n      height: 24px;\n    }\n  }\n\n  .list-item-content {\n    flex-grow: 1;\n    display: flex;\n    flex-direction: column;\n  }\n\n  .list-item-main-text {\n  }\n\n  .list-item-secondary-text {\n    ", "\n  }\n\n  .list-item-note {\n    color: ", ";\n    word-break: initial;\n    ", "\n  }\n\n  .list-item-note.with-tooltip {\n    cursor: pointer;\n\n    > div {\n      text-decoration-line: underline;\n      text-decoration-style: dashed;\n      text-underline-offset: 1px;\n      text-decoration-thickness: 1px;\n    }\n  }\n\n  .list-item-actions {\n    color: ", ";\n    display: flex;\n    align-items: center;\n\n    button div {\n      background-color: transparent;\n    }\n  }\n"])), _styles.COLORS.neutral_100, _styles.COLORS.neutral_600, _styles.COLORS.white, _styles.COLORS.primary_20, _styles.COLORS.primary_700, _styles.Z_INDEXES.hover, _styles.COLORS.primary_100, _styles.COLORS.primary_800, _styles.Z_INDEXES.active, _styles.focusStyles, _styles.COLORS.neutral_300, (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Regular, null), (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Regular, null), (0, _styles.ComponentLStyling)(_styles.ComponentTextStyle.Regular, null), (0, _styles.ComponentXXSStyling)(_styles.ComponentTextStyle.Regular, null), _styles.COLORS.neutral_600, (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, null), _styles.COLORS.neutral_600);
 
 var RightIcon = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)([""])));
 

package/dist/List/ListRow.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/List/ListRow.tsx"],"names":["Row","styled","div","COLORS","neutral_100","neutral_600","white","primary_20","primary_700","Z_INDEXES","hover","primary_100","primary_800","active","focusStyles","neutral_300","ComponentTextStyle","Regular","RightIcon","ListRow","size","Size","Medium","variant","icon","mainText","secondaryText","dropdown","note","noteTooltip","disabled","action","rightSideIcon","rightSideAction","rightSideIconDisabled","className","rest","React","useState","inAction","setInAction","handleKeyDown","e","key","rowClassName","concat","defaultOnMouseDownHandler","Large","Small","XSmall"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {COLORS, ComponentTextStyle, focusStyles} from '../styles';\n\nimport {\n  ComponentLStyling,\n  ComponentMStyling,\n  ComponentSStyling,\n  ComponentXSStyling,\n  ComponentXXSStyling\n} from '../styles';\nimport {DropdownButtonProps} from '../Dropdown/DropdownButtonTypes';\nimport {TooltipWrapper} from '../Tooltips';\nimport {DropdownButton} from '../Dropdown';\nimport {SystemIcons} from '../icons';\nimport {Size} from '../types';\nimport {Z_INDEXES} from '../styles';\nimport {defaultOnMouseDownHandler} from '../common';\nimport { IconButton } from '../Button';\n\nconst Row = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  border-bottom: 1px solid ${COLORS.neutral_100};\n  box-sizing: border-box;\n  position: relative;\n\n  color: ${COLORS.neutral_600};\n  background-color: ${COLORS.white};\n\n\n  cursor: default;\n\n  &.interactive {\n    cursor: pointer;\n  }\n\n  &.interactive.disabled {\n    cursor: not-allowed;\n  }\n\n  &.interactive:hover:not(.in-action):not(.disabled) {\n    background-color: ${COLORS.primary_20};\n    color: ${COLORS.primary_700};\n    z-index: ${Z_INDEXES.hover};\n  }\n\n  &.interactive:active:not(.in-action):not(.disabled) {\n    background-color: ${COLORS.primary_100};\n    color: ${COLORS.primary_800};\n    z-index: ${Z_INDEXES.active};\n  }\n\n  &.interactive:focus {\n    ${focusStyles}\n  }\n\n  &.disabled {\n    .list-item-icon, .list-item-content, .list-item-note, .list-item-actions {\n      color: ${COLORS.neutral_300};\n    }\n  }\n\n\n  &.small {\n    min-height: 48px;\n    padding: 0 8px;\n\n    .list-item-icon {\n      margin-right: 8px;\n    }\n\n    .list-item-main-text {\n      ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    .list-item-actions {\n      margin-right: -8px;\n    }\n  }\n\n  &.medium {\n    min-height: 56px;\n    padding: 0 12px;\n\n    .list-item-icon {\n      margin-right: 12px;\n    }\n\n    .list-item-main-text {\n      ${ComponentMStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    .list-item-actions {\n      margin-right: -12px;\n    }\n  }\n\n  &.large {\n    min-height: 64px;\n    padding: 0 16px;\n\n    .list-item-icon {\n      margin-right: 16px;\n    }\n\n    .list-item-main-text {\n      ${ComponentLStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    .list-item-actions {\n      margin-right: -16px;\n    }\n  }\n\n  &.overlay {\n    padding: 0 4px;\n\n    .list-item-actions {\n      margin-right: -4px;\n    }\n  }\n\n  .list-item-icon {\n    width: 24px;\n    height: 24px;\n\n    svg {\n      width: 24px;\n      height: 24px;\n    }\n  }\n\n  .list-item-content {\n    flex-grow: 1;\n    display: flex;\n    flex-direction: column;\n  }\n\n  .list-item-main-text {\n  }\n\n  .list-item-secondary-text {\n    ${ComponentXXSStyling(ComponentTextStyle.Regular, null)}\n  }\n\n  .list-item-note {\n    color: ${COLORS.neutral_600};\n    word-break: initial;\n    ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\n  }\n\n  .list-item-note.with-tooltip {\n    cursor: pointer;\n\n    > div {\n      text-decoration-line: underline;\n      text-decoration-style: dashed;\n      text-underline-offset: 1px;\n      text-decoration-thickness: 1px;\n    }\n  }\n\n  .list-item-actions {\n    color: ${COLORS.neutral_600};\n    display: flex;\n    align-items: center;\n\n    button div {\n      background-color: transparent;\n    }\n  }\n`;\n\nconst RightIcon = styled.div``;\n\n\ntype Props = Omit<React.HTMLAttributes<HTMLDivElement>, 'tabIndex' | 'onMouseDown' | 'onKeyDown'> & {\n  size?: Size;\n  variant?: 'normal' | 'overlay';\n  icon?: React.ReactNode;\n  mainText: string;\n  secondaryText?: string;\n  dropdown?: Pick<DropdownButtonProps, 'items' | 'onClick' | 'disabled' | 'width'>;\n  note?: string;\n  noteTooltip?: string;\n  disabled?: boolean;\n  action?: () => void;\n  rightSideIcon?: React.ReactNode;\n  rightSideAction?: () => void;\n  rightSideIconDisabled?: boolean;\n};\n\nconst ListRow: React.FunctionComponent<Props> = ({\n                                                   size = Size.Medium,\n                                                   variant = 'normal',\n                                                   icon,\n                                                   mainText,\n                                                   secondaryText,\n                                                   dropdown,\n                                                   note,\n                                                   noteTooltip,\n                                                   disabled = false,\n                                                   action,\n                                                   rightSideIcon,\n                                                   rightSideAction,\n                                                   rightSideIconDisabled,\n                                                   className,\n                                                   ...rest\n                                                 }: Props) => {\n\n  const [inAction, setInAction] = React.useState<Boolean>(false);\n\n  const handleKeyDown = (e: any) => {\n    if (e.key === 'Enter') {\n      action && action()\n    }\n  }\n\n  const rowClassName = (inAction ? 'in-action ' : '')\n    .concat(disabled ? 'disabled ' : '')\n    .concat(!!action ? 'interactive ' : '')\n    .concat('list-item-row ')\n    .concat(`${variant} `)\n    .concat(`${size}`)\n    .concat(className ? ` ${className}` : '');\n\n  return (\n    <Row tabIndex={!action || disabled ? -1 : 0}\n         className={rowClassName}\n         onMouseDown={defaultOnMouseDownHandler}\n         onKeyDown={(e) => !disabled && handleKeyDown(e)}\n         onClick={e => {\n           !disabled && action && action();\n         }}\n         data-hj-suppress\n         {...rest}>\n      {\n        !!icon &&\n        <div className={'list-item-icon'}>{icon}</div>\n      }\n      <div className={'list-item-content'}>\n        <div className={'list-item-main-text'}>{mainText}</div>\n        {!!secondaryText && <div className={'list-item-secondary-text'}>{secondaryText}</div>}\n      </div>\n      {\n        !!note &&\n        <>\n          {\n            !!noteTooltip &&\n            <div className={'list-item-note with-tooltip'}>\n              <TooltipWrapper label={noteTooltip}\n                              size={size === Size.Large ? Size.Medium : size === Size.Small ? Size.XSmall : Size.Small}\n                              position={'top'}\n                              tabIndex={disabled ? -1 : 0}\n                              withArrow={true}>\n                {note}\n              </TooltipWrapper>\n            </div>\n          }\n          {\n            !noteTooltip &&\n            <div className={'list-item-note'}>\n              {note}\n            </div>\n          }\n        </>\n      }\n      {\n        !!dropdown &&\n        <div className={'list-item-actions'}\n             onMouseEnter={() => setInAction(!dropdown?.disabled)}\n             onMouseLeave={() => setInAction(false)}>\n          <DropdownButton {...dropdown}\n                          type={'icon'}\n                          disabled={disabled || dropdown.disabled}\n                          icon={variant === 'overlay'\n                            ? <SystemIcons.ArrowDropDown/>\n                            : <SystemIcons.MoreVertical/>}\n          />\n        </div>\n      }\n      {\n        !!rightSideIcon &&\n        <RightIcon className={'list-item-actions'}>\n          <IconButton action={() => !!rightSideAction && rightSideAction()} variant='secondary' shape='circular' disabled={disabled || rightSideIconDisabled}>\n            {rightSideIcon}\n          </IconButton>\n        </RightIcon>\n      }\n    </Row>\n  );\n};\n\nexport default ListRow;\n\n"],"file":"ListRow.cjs"}
+{"version":3,"sources":["../../src/List/ListRow.tsx"],"names":["Row","styled","div","COLORS","neutral_100","neutral_600","white","primary_20","primary_700","Z_INDEXES","hover","primary_100","primary_800","active","focusStyles","neutral_300","ComponentTextStyle","Regular","RightIcon","ListRow","size","Size","Medium","variant","icon","mainText","secondaryText","dropdown","note","noteTooltip","disabled","action","rightSideIcon","rightSideAction","rightSideIconDisabled","className","rest","React","useState","inAction","setInAction","handleKeyDown","e","key","rowClassName","concat","defaultOnMouseDownHandler","Large","Small","XSmall"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {COLORS, ComponentTextStyle, focusStyles} from '../styles';\n\nimport {\n  ComponentLStyling,\n  ComponentMStyling,\n  ComponentSStyling,\n  ComponentXSStyling,\n  ComponentXXSStyling\n} from '../styles';\nimport {DropdownButtonProps} from '../Dropdown/DropdownButtonTypes';\nimport {TooltipWrapper} from '../Tooltips';\nimport {DropdownButton} from '../Dropdown';\nimport {SystemIcons} from '../icons';\nimport {Size} from '../types';\nimport {Z_INDEXES} from '../styles';\nimport {defaultOnMouseDownHandler} from '../common';\nimport { IconButton } from '../Button';\n\nconst Row = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  border-bottom: 1px solid ${COLORS.neutral_100};\n  box-sizing: border-box;\n\n  color: ${COLORS.neutral_600};\n  background-color: ${COLORS.white};\n\n\n  cursor: default;\n\n  &.interactive {\n    cursor: pointer;\n  }\n\n  &.interactive.disabled {\n    cursor: not-allowed;\n  }\n\n  &.interactive:hover:not(.in-action):not(.disabled) {\n    background-color: ${COLORS.primary_20};\n    color: ${COLORS.primary_700};\n    z-index: ${Z_INDEXES.hover};\n  }\n\n  &.interactive:active:not(.in-action):not(.disabled) {\n    background-color: ${COLORS.primary_100};\n    color: ${COLORS.primary_800};\n    z-index: ${Z_INDEXES.active};\n  }\n\n  &.interactive:focus {\n    ${focusStyles}\n  }\n\n  &.disabled {\n    .list-item-icon, .list-item-content, .list-item-note, .list-item-actions {\n      color: ${COLORS.neutral_300};\n    }\n  }\n\n\n  &.small {\n    min-height: 48px;\n    padding: 0 8px;\n\n    .list-item-icon {\n      margin-right: 8px;\n    }\n\n    .list-item-main-text {\n      ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    .list-item-actions {\n      margin-right: -8px;\n    }\n  }\n\n  &.medium {\n    min-height: 56px;\n    padding: 0 12px;\n\n    .list-item-icon {\n      margin-right: 12px;\n    }\n\n    .list-item-main-text {\n      ${ComponentMStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    .list-item-actions {\n      margin-right: -12px;\n    }\n  }\n\n  &.large {\n    min-height: 64px;\n    padding: 0 16px;\n\n    .list-item-icon {\n      margin-right: 16px;\n    }\n\n    .list-item-main-text {\n      ${ComponentLStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    .list-item-actions {\n      margin-right: -16px;\n    }\n  }\n\n  &.overlay {\n    padding: 0 4px;\n\n    .list-item-actions {\n      margin-right: -4px;\n    }\n  }\n\n  .list-item-icon {\n    width: 24px;\n    height: 24px;\n\n    svg {\n      width: 24px;\n      height: 24px;\n    }\n  }\n\n  .list-item-content {\n    flex-grow: 1;\n    display: flex;\n    flex-direction: column;\n  }\n\n  .list-item-main-text {\n  }\n\n  .list-item-secondary-text {\n    ${ComponentXXSStyling(ComponentTextStyle.Regular, null)}\n  }\n\n  .list-item-note {\n    color: ${COLORS.neutral_600};\n    word-break: initial;\n    ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\n  }\n\n  .list-item-note.with-tooltip {\n    cursor: pointer;\n\n    > div {\n      text-decoration-line: underline;\n      text-decoration-style: dashed;\n      text-underline-offset: 1px;\n      text-decoration-thickness: 1px;\n    }\n  }\n\n  .list-item-actions {\n    color: ${COLORS.neutral_600};\n    display: flex;\n    align-items: center;\n\n    button div {\n      background-color: transparent;\n    }\n  }\n`;\n\nconst RightIcon = styled.div``;\n\n\ntype Props = Omit<React.HTMLAttributes<HTMLDivElement>, 'tabIndex' | 'onMouseDown' | 'onKeyDown'> & {\n  size?: Size;\n  variant?: 'normal' | 'overlay';\n  icon?: React.ReactNode;\n  mainText: string;\n  secondaryText?: string;\n  dropdown?: Pick<DropdownButtonProps, 'items' | 'onClick' | 'disabled' | 'width'>;\n  note?: string;\n  noteTooltip?: string;\n  disabled?: boolean;\n  action?: () => void;\n  rightSideIcon?: React.ReactNode;\n  rightSideAction?: () => void;\n  rightSideIconDisabled?: boolean;\n};\n\nconst ListRow: React.FunctionComponent<Props> = ({\n                                                   size = Size.Medium,\n                                                   variant = 'normal',\n                                                   icon,\n                                                   mainText,\n                                                   secondaryText,\n                                                   dropdown,\n                                                   note,\n                                                   noteTooltip,\n                                                   disabled = false,\n                                                   action,\n                                                   rightSideIcon,\n                                                   rightSideAction,\n                                                   rightSideIconDisabled,\n                                                   className,\n                                                   ...rest\n                                                 }: Props) => {\n\n  const [inAction, setInAction] = React.useState<Boolean>(false);\n\n  const handleKeyDown = (e: any) => {\n    if (e.key === 'Enter') {\n      action && action()\n    }\n  }\n\n  const rowClassName = (inAction ? 'in-action ' : '')\n    .concat(disabled ? 'disabled ' : '')\n    .concat(!!action ? 'interactive ' : '')\n    .concat('list-item-row ')\n    .concat(`${variant} `)\n    .concat(`${size}`)\n    .concat(className ? ` ${className}` : '');\n\n  return (\n    <Row tabIndex={!action || disabled ? -1 : 0}\n         className={rowClassName}\n         onMouseDown={defaultOnMouseDownHandler}\n         onKeyDown={(e) => !disabled && handleKeyDown(e)}\n         onClick={e => {\n           !disabled && action && action();\n         }}\n         data-hj-suppress\n         {...rest}>\n      {\n        !!icon &&\n        <div className={'list-item-icon'}>{icon}</div>\n      }\n      <div className={'list-item-content'}>\n        <div className={'list-item-main-text'}>{mainText}</div>\n        {!!secondaryText && <div className={'list-item-secondary-text'}>{secondaryText}</div>}\n      </div>\n      {\n        !!note &&\n        <>\n          {\n            !!noteTooltip &&\n            <div className={'list-item-note with-tooltip'}>\n              <TooltipWrapper label={noteTooltip}\n                              size={size === Size.Large ? Size.Medium : size === Size.Small ? Size.XSmall : Size.Small}\n                              position={'top'}\n                              tabIndex={disabled ? -1 : 0}\n                              withArrow={true}>\n                {note}\n              </TooltipWrapper>\n            </div>\n          }\n          {\n            !noteTooltip &&\n            <div className={'list-item-note'}>\n              {note}\n            </div>\n          }\n        </>\n      }\n      {\n        !!dropdown &&\n        <div className={'list-item-actions'}\n             onMouseEnter={() => setInAction(!dropdown?.disabled)}\n             onMouseLeave={() => setInAction(false)}>\n          <DropdownButton {...dropdown}\n                          type={'icon'}\n                          disabled={disabled || dropdown.disabled}\n                          icon={variant === 'overlay'\n                            ? <SystemIcons.ArrowDropDown/>\n                            : <SystemIcons.MoreVertical/>}\n          />\n        </div>\n      }\n      {\n        !!rightSideIcon &&\n        <RightIcon className={'list-item-actions'}>\n          <IconButton action={() => !!rightSideAction && rightSideAction()} variant='secondary' shape='circular' disabled={disabled || rightSideIconDisabled}>\n            {rightSideIcon}\n          </IconButton>\n        </RightIcon>\n      }\n    </Row>\n  );\n};\n\nexport default ListRow;\n\n"],"file":"ListRow.cjs"}

package/dist/List/ListRow.js

@@ -25,7 +25,7 @@ import { IconButton } from '../Button';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
-var Row = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  border-bottom: 1px solid ", ";\n  box-sizing: border-box;\n  position: relative;\n\n  color: ", ";\n  background-color: ", ";\n\n\n  cursor: default;\n\n  &.interactive {\n    cursor: pointer;\n  }\n\n  &.interactive.disabled {\n    cursor: not-allowed;\n  }\n\n  &.interactive:hover:not(.in-action):not(.disabled) {\n    background-color: ", ";\n    color: ", ";\n    z-index: ", ";\n  }\n\n  &.interactive:active:not(.in-action):not(.disabled) {\n    background-color: ", ";\n    color: ", ";\n    z-index: ", ";\n  }\n\n  &.interactive:focus {\n    ", "\n  }\n\n  &.disabled {\n    .list-item-icon, .list-item-content, .list-item-note, .list-item-actions {\n      color: ", ";\n    }\n  }\n\n\n  &.small {\n    min-height: 48px;\n    padding: 0 8px;\n\n    .list-item-icon {\n      margin-right: 8px;\n    }\n\n    .list-item-main-text {\n      ", "\n    }\n\n    .list-item-actions {\n      margin-right: -8px;\n    }\n  }\n\n  &.medium {\n    min-height: 56px;\n    padding: 0 12px;\n\n    .list-item-icon {\n      margin-right: 12px;\n    }\n\n    .list-item-main-text {\n      ", "\n    }\n\n    .list-item-actions {\n      margin-right: -12px;\n    }\n  }\n\n  &.large {\n    min-height: 64px;\n    padding: 0 16px;\n\n    .list-item-icon {\n      margin-right: 16px;\n    }\n\n    .list-item-main-text {\n      ", "\n    }\n\n    .list-item-actions {\n      margin-right: -16px;\n    }\n  }\n\n  &.overlay {\n    padding: 0 4px;\n\n    .list-item-actions {\n      margin-right: -4px;\n    }\n  }\n\n  .list-item-icon {\n    width: 24px;\n    height: 24px;\n\n    svg {\n      width: 24px;\n      height: 24px;\n    }\n  }\n\n  .list-item-content {\n    flex-grow: 1;\n    display: flex;\n    flex-direction: column;\n  }\n\n  .list-item-main-text {\n  }\n\n  .list-item-secondary-text {\n    ", "\n  }\n\n  .list-item-note {\n    color: ", ";\n    word-break: initial;\n    ", "\n  }\n\n  .list-item-note.with-tooltip {\n    cursor: pointer;\n\n    > div {\n      text-decoration-line: underline;\n      text-decoration-style: dashed;\n      text-underline-offset: 1px;\n      text-decoration-thickness: 1px;\n    }\n  }\n\n  .list-item-actions {\n    color: ", ";\n    display: flex;\n    align-items: center;\n\n    button div {\n      background-color: transparent;\n    }\n  }\n"])), COLORS.neutral_100, COLORS.neutral_600, COLORS.white, COLORS.primary_20, COLORS.primary_700, Z_INDEXES.hover, COLORS.primary_100, COLORS.primary_800, Z_INDEXES.active, focusStyles, COLORS.neutral_300, ComponentSStyling(ComponentTextStyle.Regular, null), ComponentMStyling(ComponentTextStyle.Regular, null), ComponentLStyling(ComponentTextStyle.Regular, null), ComponentXXSStyling(ComponentTextStyle.Regular, null), COLORS.neutral_600, ComponentXSStyling(ComponentTextStyle.Regular, null), COLORS.neutral_600);
+var Row = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  border-bottom: 1px solid ", ";\n  box-sizing: border-box;\n\n  color: ", ";\n  background-color: ", ";\n\n\n  cursor: default;\n\n  &.interactive {\n    cursor: pointer;\n  }\n\n  &.interactive.disabled {\n    cursor: not-allowed;\n  }\n\n  &.interactive:hover:not(.in-action):not(.disabled) {\n    background-color: ", ";\n    color: ", ";\n    z-index: ", ";\n  }\n\n  &.interactive:active:not(.in-action):not(.disabled) {\n    background-color: ", ";\n    color: ", ";\n    z-index: ", ";\n  }\n\n  &.interactive:focus {\n    ", "\n  }\n\n  &.disabled {\n    .list-item-icon, .list-item-content, .list-item-note, .list-item-actions {\n      color: ", ";\n    }\n  }\n\n\n  &.small {\n    min-height: 48px;\n    padding: 0 8px;\n\n    .list-item-icon {\n      margin-right: 8px;\n    }\n\n    .list-item-main-text {\n      ", "\n    }\n\n    .list-item-actions {\n      margin-right: -8px;\n    }\n  }\n\n  &.medium {\n    min-height: 56px;\n    padding: 0 12px;\n\n    .list-item-icon {\n      margin-right: 12px;\n    }\n\n    .list-item-main-text {\n      ", "\n    }\n\n    .list-item-actions {\n      margin-right: -12px;\n    }\n  }\n\n  &.large {\n    min-height: 64px;\n    padding: 0 16px;\n\n    .list-item-icon {\n      margin-right: 16px;\n    }\n\n    .list-item-main-text {\n      ", "\n    }\n\n    .list-item-actions {\n      margin-right: -16px;\n    }\n  }\n\n  &.overlay {\n    padding: 0 4px;\n\n    .list-item-actions {\n      margin-right: -4px;\n    }\n  }\n\n  .list-item-icon {\n    width: 24px;\n    height: 24px;\n\n    svg {\n      width: 24px;\n      height: 24px;\n    }\n  }\n\n  .list-item-content {\n    flex-grow: 1;\n    display: flex;\n    flex-direction: column;\n  }\n\n  .list-item-main-text {\n  }\n\n  .list-item-secondary-text {\n    ", "\n  }\n\n  .list-item-note {\n    color: ", ";\n    word-break: initial;\n    ", "\n  }\n\n  .list-item-note.with-tooltip {\n    cursor: pointer;\n\n    > div {\n      text-decoration-line: underline;\n      text-decoration-style: dashed;\n      text-underline-offset: 1px;\n      text-decoration-thickness: 1px;\n    }\n  }\n\n  .list-item-actions {\n    color: ", ";\n    display: flex;\n    align-items: center;\n\n    button div {\n      background-color: transparent;\n    }\n  }\n"])), COLORS.neutral_100, COLORS.neutral_600, COLORS.white, COLORS.primary_20, COLORS.primary_700, Z_INDEXES.hover, COLORS.primary_100, COLORS.primary_800, Z_INDEXES.active, focusStyles, COLORS.neutral_300, ComponentSStyling(ComponentTextStyle.Regular, null), ComponentMStyling(ComponentTextStyle.Regular, null), ComponentLStyling(ComponentTextStyle.Regular, null), ComponentXXSStyling(ComponentTextStyle.Regular, null), COLORS.neutral_600, ComponentXSStyling(ComponentTextStyle.Regular, null), COLORS.neutral_600);
 var RightIcon = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral([""])));
 
 var ListRow = function ListRow(_ref) {

package/dist/List/ListRow.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/List/ListRow.tsx"],"names":["React","styled","COLORS","ComponentTextStyle","focusStyles","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentXSStyling","ComponentXXSStyling","TooltipWrapper","DropdownButton","SystemIcons","Size","Z_INDEXES","defaultOnMouseDownHandler","IconButton","Row","div","neutral_100","neutral_600","white","primary_20","primary_700","hover","primary_100","primary_800","active","neutral_300","Regular","RightIcon","ListRow","size","Medium","variant","icon","mainText","secondaryText","dropdown","note","noteTooltip","disabled","action","rightSideIcon","rightSideAction","rightSideIconDisabled","className","rest","useState","inAction","setInAction","handleKeyDown","e","key","rowClassName","concat","Large","Small","XSmall"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {COLORS, ComponentTextStyle, focusStyles} from '../styles';\n\nimport {\n  ComponentLStyling,\n  ComponentMStyling,\n  ComponentSStyling,\n  ComponentXSStyling,\n  ComponentXXSStyling\n} from '../styles';\nimport {DropdownButtonProps} from '../Dropdown/DropdownButtonTypes';\nimport {TooltipWrapper} from '../Tooltips';\nimport {DropdownButton} from '../Dropdown';\nimport {SystemIcons} from '../icons';\nimport {Size} from '../types';\nimport {Z_INDEXES} from '../styles';\nimport {defaultOnMouseDownHandler} from '../common';\nimport { IconButton } from '../Button';\n\nconst Row = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  border-bottom: 1px solid ${COLORS.neutral_100};\n  box-sizing: border-box;\n  position: relative;\n\n  color: ${COLORS.neutral_600};\n  background-color: ${COLORS.white};\n\n\n  cursor: default;\n\n  &.interactive {\n    cursor: pointer;\n  }\n\n  &.interactive.disabled {\n    cursor: not-allowed;\n  }\n\n  &.interactive:hover:not(.in-action):not(.disabled) {\n    background-color: ${COLORS.primary_20};\n    color: ${COLORS.primary_700};\n    z-index: ${Z_INDEXES.hover};\n  }\n\n  &.interactive:active:not(.in-action):not(.disabled) {\n    background-color: ${COLORS.primary_100};\n    color: ${COLORS.primary_800};\n    z-index: ${Z_INDEXES.active};\n  }\n\n  &.interactive:focus {\n    ${focusStyles}\n  }\n\n  &.disabled {\n    .list-item-icon, .list-item-content, .list-item-note, .list-item-actions {\n      color: ${COLORS.neutral_300};\n    }\n  }\n\n\n  &.small {\n    min-height: 48px;\n    padding: 0 8px;\n\n    .list-item-icon {\n      margin-right: 8px;\n    }\n\n    .list-item-main-text {\n      ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    .list-item-actions {\n      margin-right: -8px;\n    }\n  }\n\n  &.medium {\n    min-height: 56px;\n    padding: 0 12px;\n\n    .list-item-icon {\n      margin-right: 12px;\n    }\n\n    .list-item-main-text {\n      ${ComponentMStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    .list-item-actions {\n      margin-right: -12px;\n    }\n  }\n\n  &.large {\n    min-height: 64px;\n    padding: 0 16px;\n\n    .list-item-icon {\n      margin-right: 16px;\n    }\n\n    .list-item-main-text {\n      ${ComponentLStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    .list-item-actions {\n      margin-right: -16px;\n    }\n  }\n\n  &.overlay {\n    padding: 0 4px;\n\n    .list-item-actions {\n      margin-right: -4px;\n    }\n  }\n\n  .list-item-icon {\n    width: 24px;\n    height: 24px;\n\n    svg {\n      width: 24px;\n      height: 24px;\n    }\n  }\n\n  .list-item-content {\n    flex-grow: 1;\n    display: flex;\n    flex-direction: column;\n  }\n\n  .list-item-main-text {\n  }\n\n  .list-item-secondary-text {\n    ${ComponentXXSStyling(ComponentTextStyle.Regular, null)}\n  }\n\n  .list-item-note {\n    color: ${COLORS.neutral_600};\n    word-break: initial;\n    ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\n  }\n\n  .list-item-note.with-tooltip {\n    cursor: pointer;\n\n    > div {\n      text-decoration-line: underline;\n      text-decoration-style: dashed;\n      text-underline-offset: 1px;\n      text-decoration-thickness: 1px;\n    }\n  }\n\n  .list-item-actions {\n    color: ${COLORS.neutral_600};\n    display: flex;\n    align-items: center;\n\n    button div {\n      background-color: transparent;\n    }\n  }\n`;\n\nconst RightIcon = styled.div``;\n\n\ntype Props = Omit<React.HTMLAttributes<HTMLDivElement>, 'tabIndex' | 'onMouseDown' | 'onKeyDown'> & {\n  size?: Size;\n  variant?: 'normal' | 'overlay';\n  icon?: React.ReactNode;\n  mainText: string;\n  secondaryText?: string;\n  dropdown?: Pick<DropdownButtonProps, 'items' | 'onClick' | 'disabled' | 'width'>;\n  note?: string;\n  noteTooltip?: string;\n  disabled?: boolean;\n  action?: () => void;\n  rightSideIcon?: React.ReactNode;\n  rightSideAction?: () => void;\n  rightSideIconDisabled?: boolean;\n};\n\nconst ListRow: React.FunctionComponent<Props> = ({\n                                                   size = Size.Medium,\n                                                   variant = 'normal',\n                                                   icon,\n                                                   mainText,\n                                                   secondaryText,\n                                                   dropdown,\n                                                   note,\n                                                   noteTooltip,\n                                                   disabled = false,\n                                                   action,\n                                                   rightSideIcon,\n                                                   rightSideAction,\n                                                   rightSideIconDisabled,\n                                                   className,\n                                                   ...rest\n                                                 }: Props) => {\n\n  const [inAction, setInAction] = React.useState<Boolean>(false);\n\n  const handleKeyDown = (e: any) => {\n    if (e.key === 'Enter') {\n      action && action()\n    }\n  }\n\n  const rowClassName = (inAction ? 'in-action ' : '')\n    .concat(disabled ? 'disabled ' : '')\n    .concat(!!action ? 'interactive ' : '')\n    .concat('list-item-row ')\n    .concat(`${variant} `)\n    .concat(`${size}`)\n    .concat(className ? ` ${className}` : '');\n\n  return (\n    <Row tabIndex={!action || disabled ? -1 : 0}\n         className={rowClassName}\n         onMouseDown={defaultOnMouseDownHandler}\n         onKeyDown={(e) => !disabled && handleKeyDown(e)}\n         onClick={e => {\n           !disabled && action && action();\n         }}\n         data-hj-suppress\n         {...rest}>\n      {\n        !!icon &&\n        <div className={'list-item-icon'}>{icon}</div>\n      }\n      <div className={'list-item-content'}>\n        <div className={'list-item-main-text'}>{mainText}</div>\n        {!!secondaryText && <div className={'list-item-secondary-text'}>{secondaryText}</div>}\n      </div>\n      {\n        !!note &&\n        <>\n          {\n            !!noteTooltip &&\n            <div className={'list-item-note with-tooltip'}>\n              <TooltipWrapper label={noteTooltip}\n                              size={size === Size.Large ? Size.Medium : size === Size.Small ? Size.XSmall : Size.Small}\n                              position={'top'}\n                              tabIndex={disabled ? -1 : 0}\n                              withArrow={true}>\n                {note}\n              </TooltipWrapper>\n            </div>\n          }\n          {\n            !noteTooltip &&\n            <div className={'list-item-note'}>\n              {note}\n            </div>\n          }\n        </>\n      }\n      {\n        !!dropdown &&\n        <div className={'list-item-actions'}\n             onMouseEnter={() => setInAction(!dropdown?.disabled)}\n             onMouseLeave={() => setInAction(false)}>\n          <DropdownButton {...dropdown}\n                          type={'icon'}\n                          disabled={disabled || dropdown.disabled}\n                          icon={variant === 'overlay'\n                            ? <SystemIcons.ArrowDropDown/>\n                            : <SystemIcons.MoreVertical/>}\n          />\n        </div>\n      }\n      {\n        !!rightSideIcon &&\n        <RightIcon className={'list-item-actions'}>\n          <IconButton action={() => !!rightSideAction && rightSideAction()} variant='secondary' shape='circular' disabled={disabled || rightSideIconDisabled}>\n            {rightSideIcon}\n          </IconButton>\n        </RightIcon>\n      }\n    </Row>\n  );\n};\n\nexport default ListRow;\n\n"],"file":"ListRow.js"}
+{"version":3,"sources":["../../src/List/ListRow.tsx"],"names":["React","styled","COLORS","ComponentTextStyle","focusStyles","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentXSStyling","ComponentXXSStyling","TooltipWrapper","DropdownButton","SystemIcons","Size","Z_INDEXES","defaultOnMouseDownHandler","IconButton","Row","div","neutral_100","neutral_600","white","primary_20","primary_700","hover","primary_100","primary_800","active","neutral_300","Regular","RightIcon","ListRow","size","Medium","variant","icon","mainText","secondaryText","dropdown","note","noteTooltip","disabled","action","rightSideIcon","rightSideAction","rightSideIconDisabled","className","rest","useState","inAction","setInAction","handleKeyDown","e","key","rowClassName","concat","Large","Small","XSmall"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {COLORS, ComponentTextStyle, focusStyles} from '../styles';\n\nimport {\n  ComponentLStyling,\n  ComponentMStyling,\n  ComponentSStyling,\n  ComponentXSStyling,\n  ComponentXXSStyling\n} from '../styles';\nimport {DropdownButtonProps} from '../Dropdown/DropdownButtonTypes';\nimport {TooltipWrapper} from '../Tooltips';\nimport {DropdownButton} from '../Dropdown';\nimport {SystemIcons} from '../icons';\nimport {Size} from '../types';\nimport {Z_INDEXES} from '../styles';\nimport {defaultOnMouseDownHandler} from '../common';\nimport { IconButton } from '../Button';\n\nconst Row = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  border-bottom: 1px solid ${COLORS.neutral_100};\n  box-sizing: border-box;\n\n  color: ${COLORS.neutral_600};\n  background-color: ${COLORS.white};\n\n\n  cursor: default;\n\n  &.interactive {\n    cursor: pointer;\n  }\n\n  &.interactive.disabled {\n    cursor: not-allowed;\n  }\n\n  &.interactive:hover:not(.in-action):not(.disabled) {\n    background-color: ${COLORS.primary_20};\n    color: ${COLORS.primary_700};\n    z-index: ${Z_INDEXES.hover};\n  }\n\n  &.interactive:active:not(.in-action):not(.disabled) {\n    background-color: ${COLORS.primary_100};\n    color: ${COLORS.primary_800};\n    z-index: ${Z_INDEXES.active};\n  }\n\n  &.interactive:focus {\n    ${focusStyles}\n  }\n\n  &.disabled {\n    .list-item-icon, .list-item-content, .list-item-note, .list-item-actions {\n      color: ${COLORS.neutral_300};\n    }\n  }\n\n\n  &.small {\n    min-height: 48px;\n    padding: 0 8px;\n\n    .list-item-icon {\n      margin-right: 8px;\n    }\n\n    .list-item-main-text {\n      ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    .list-item-actions {\n      margin-right: -8px;\n    }\n  }\n\n  &.medium {\n    min-height: 56px;\n    padding: 0 12px;\n\n    .list-item-icon {\n      margin-right: 12px;\n    }\n\n    .list-item-main-text {\n      ${ComponentMStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    .list-item-actions {\n      margin-right: -12px;\n    }\n  }\n\n  &.large {\n    min-height: 64px;\n    padding: 0 16px;\n\n    .list-item-icon {\n      margin-right: 16px;\n    }\n\n    .list-item-main-text {\n      ${ComponentLStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    .list-item-actions {\n      margin-right: -16px;\n    }\n  }\n\n  &.overlay {\n    padding: 0 4px;\n\n    .list-item-actions {\n      margin-right: -4px;\n    }\n  }\n\n  .list-item-icon {\n    width: 24px;\n    height: 24px;\n\n    svg {\n      width: 24px;\n      height: 24px;\n    }\n  }\n\n  .list-item-content {\n    flex-grow: 1;\n    display: flex;\n    flex-direction: column;\n  }\n\n  .list-item-main-text {\n  }\n\n  .list-item-secondary-text {\n    ${ComponentXXSStyling(ComponentTextStyle.Regular, null)}\n  }\n\n  .list-item-note {\n    color: ${COLORS.neutral_600};\n    word-break: initial;\n    ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\n  }\n\n  .list-item-note.with-tooltip {\n    cursor: pointer;\n\n    > div {\n      text-decoration-line: underline;\n      text-decoration-style: dashed;\n      text-underline-offset: 1px;\n      text-decoration-thickness: 1px;\n    }\n  }\n\n  .list-item-actions {\n    color: ${COLORS.neutral_600};\n    display: flex;\n    align-items: center;\n\n    button div {\n      background-color: transparent;\n    }\n  }\n`;\n\nconst RightIcon = styled.div``;\n\n\ntype Props = Omit<React.HTMLAttributes<HTMLDivElement>, 'tabIndex' | 'onMouseDown' | 'onKeyDown'> & {\n  size?: Size;\n  variant?: 'normal' | 'overlay';\n  icon?: React.ReactNode;\n  mainText: string;\n  secondaryText?: string;\n  dropdown?: Pick<DropdownButtonProps, 'items' | 'onClick' | 'disabled' | 'width'>;\n  note?: string;\n  noteTooltip?: string;\n  disabled?: boolean;\n  action?: () => void;\n  rightSideIcon?: React.ReactNode;\n  rightSideAction?: () => void;\n  rightSideIconDisabled?: boolean;\n};\n\nconst ListRow: React.FunctionComponent<Props> = ({\n                                                   size = Size.Medium,\n                                                   variant = 'normal',\n                                                   icon,\n                                                   mainText,\n                                                   secondaryText,\n                                                   dropdown,\n                                                   note,\n                                                   noteTooltip,\n                                                   disabled = false,\n                                                   action,\n                                                   rightSideIcon,\n                                                   rightSideAction,\n                                                   rightSideIconDisabled,\n                                                   className,\n                                                   ...rest\n                                                 }: Props) => {\n\n  const [inAction, setInAction] = React.useState<Boolean>(false);\n\n  const handleKeyDown = (e: any) => {\n    if (e.key === 'Enter') {\n      action && action()\n    }\n  }\n\n  const rowClassName = (inAction ? 'in-action ' : '')\n    .concat(disabled ? 'disabled ' : '')\n    .concat(!!action ? 'interactive ' : '')\n    .concat('list-item-row ')\n    .concat(`${variant} `)\n    .concat(`${size}`)\n    .concat(className ? ` ${className}` : '');\n\n  return (\n    <Row tabIndex={!action || disabled ? -1 : 0}\n         className={rowClassName}\n         onMouseDown={defaultOnMouseDownHandler}\n         onKeyDown={(e) => !disabled && handleKeyDown(e)}\n         onClick={e => {\n           !disabled && action && action();\n         }}\n         data-hj-suppress\n         {...rest}>\n      {\n        !!icon &&\n        <div className={'list-item-icon'}>{icon}</div>\n      }\n      <div className={'list-item-content'}>\n        <div className={'list-item-main-text'}>{mainText}</div>\n        {!!secondaryText && <div className={'list-item-secondary-text'}>{secondaryText}</div>}\n      </div>\n      {\n        !!note &&\n        <>\n          {\n            !!noteTooltip &&\n            <div className={'list-item-note with-tooltip'}>\n              <TooltipWrapper label={noteTooltip}\n                              size={size === Size.Large ? Size.Medium : size === Size.Small ? Size.XSmall : Size.Small}\n                              position={'top'}\n                              tabIndex={disabled ? -1 : 0}\n                              withArrow={true}>\n                {note}\n              </TooltipWrapper>\n            </div>\n          }\n          {\n            !noteTooltip &&\n            <div className={'list-item-note'}>\n              {note}\n            </div>\n          }\n        </>\n      }\n      {\n        !!dropdown &&\n        <div className={'list-item-actions'}\n             onMouseEnter={() => setInAction(!dropdown?.disabled)}\n             onMouseLeave={() => setInAction(false)}>\n          <DropdownButton {...dropdown}\n                          type={'icon'}\n                          disabled={disabled || dropdown.disabled}\n                          icon={variant === 'overlay'\n                            ? <SystemIcons.ArrowDropDown/>\n                            : <SystemIcons.MoreVertical/>}\n          />\n        </div>\n      }\n      {\n        !!rightSideIcon &&\n        <RightIcon className={'list-item-actions'}>\n          <IconButton action={() => !!rightSideAction && rightSideAction()} variant='secondary' shape='circular' disabled={disabled || rightSideIconDisabled}>\n            {rightSideIcon}\n          </IconButton>\n        </RightIcon>\n      }\n    </Row>\n  );\n};\n\nexport default ListRow;\n\n"],"file":"ListRow.js"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@laerdal/life-react-components",
-  "version": "1.10.3-dev.21.full",
+  "version": "1.10.3-dev.24",
   "private": false,
   "author": "Thomas Kalve <thomas.kalve@laerdal.com>",
   "contributors": [