@laerdal/life-react-components 1.10.3-dev.9.full → 1.11.0-dev.4

package/dist/Button/DualFunctionButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Button/DualFunctionButton.tsx"],"names":["React","Button","ArrowDropDown","ArrowDropUp","Dropdown","Size","DropdownContent","styled","useClickOutsideRef","useFocusOutsideRef","ButtonsContainer","div","props","size","Large","Medium","DualFunctionButton","children","variant","type","width","testId","disabled","id","dropdownMenuValues","setDropdownMenuValues","dropdownCustomizationProps","loading","icon","onClick","renderProps","useState","isOpen","setIsOpen","focused","setFocused","keyboardNavigated","setKeyboardNavigated","dropdownContainerRef","useRef","selectedValues","setSelectedValues","dropdownContentRef","dropdownButtonRef","useEffect","itemsType","e","key","stopPropagation"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport Button, { ButtonProps } from './Button';\nimport { ArrowDropDown, ArrowDropUp } from '../icons/systemicons/SystemIcons';\nimport { Dropdown } from '../Dropdown/CommonStyling';\nimport { Size } from '../types';\nimport DropdownContent, { DropdownCustomizationProps } from '../Dropdown/DropdownContent';\nimport styled from 'styled-components';\nimport { useClickOutsideRef, useFocusOutsideRef } from '../common';\n\nconst ButtonsContainer = styled.div<{ size?: Size }>`\n  display: flex;\n  align-items: center;\n\n  button:first-child {\n    margin-right: 2px;\n  }\n\n  div.button-content {\n    gap: 0px;\n    padding: ${(props) => (props.size == Size.Large ? '4px 18px' : props.size == Size.Medium ? '4px 14px' : '4px 10px')};\n  }\n`;\n\nexport interface ButtonOption {\n  label: string;\n}\n\nexport interface DualButtonProps extends ButtonProps {\n  dropdownCustomizationProps: DropdownCustomizationProps;\n  dropdownMenuValues?: string[];\n  setDropdownMenuValues?: (values: string[]) => void | boolean | undefined;\n}\n\nconst DualFunctionButton: React.FunctionComponent<DualButtonProps> = ({\n  children = 'Primary Button',\n  variant = 'primary',\n  type = 'button',\n  size = Size.Medium,\n  width = 'auto',\n  testId,\n  disabled,\n  id,\n  dropdownMenuValues,\n  setDropdownMenuValues,\n  dropdownCustomizationProps,\n  ...props\n}) => {\n  // Let's filter out properties that we don't need to render.\n  const { loading, icon, onClick, ...renderProps } = props;\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [focused, setFocused] = React.useState<number | null>(null);\n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\n  const dropdownContainerRef = React.useRef<HTMLDivElement>(null);\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n\n  const dropdownContentRef = React.useRef<HTMLDivElement>(null);\n  const dropdownButtonRef = useClickOutsideRef(\n    () => setIsOpen(false),\n    [dropdownContainerRef],\n    useFocusOutsideRef(() => setIsOpen(false), [dropdownContentRef]),\n  );\n\n  React.useEffect(() => {\n    !isOpen && setKeyboardNavigated(false);\n  }, [isOpen]);\n\n  return (\n    <ButtonsContainer ref={dropdownContainerRef} size={size}>\n      <Dropdown isButton={true} readOnly={false} disabled={false} margin=\"\">\n        <Button {...renderProps} onClick={onClick} disabled={disabled} type={type} loading={loading} icon={icon} size={size} width={width} variant={variant} flatEdge=\"right\">\n          {children}\n        </Button>\n        <DropdownContent\n          customizationProps={dropdownCustomizationProps}\n          filter=\"\"\n          ref={dropdownContentRef}\n          selectedValues={dropdownCustomizationProps.itemsType == 'normal' ? [] : dropdownMenuValues ?? selectedValues}\n          setSelectedValues={setDropdownMenuValues ? setDropdownMenuValues : setSelectedValues}\n          isButton={true}\n          setIsOpen={setIsOpen}\n          focused={focused}\n          setFocused={setFocused}\n          size={size}\n          outline={keyboardNavigated}\n          isOpen={isOpen}\n          id={id ?? 'dropdownId'}\n          messageOnNoResults=\"\"\n          alignLeft={true}\n        />\n      </Dropdown>\n      <Button\n        variant={variant}\n        {...renderProps}\n        onKeyPress={(e: any) => {\n          if (isOpen) return;\n\n          if (e.key === 'Enter' || e.key === ' ') {\n            setFocused(0);\n            setKeyboardNavigated(true);\n          }\n        }}\n        testId={'options_toggleBtn'}\n        ref={dropdownButtonRef}\n        disabled={disabled}\n        type={type}\n        size={size}\n        minWidth={'unset'}\n        onClick={(e) => {\n          e.stopPropagation();\n          setIsOpen(!isOpen);\n        }}\n        icon={isOpen ? <ArrowDropUp size=\"16px\" /> : <ArrowDropDown size=\"16px\" />}\n        flatEdge=\"left\"\n      />\n    </ButtonsContainer>\n  );\n};\n\nexport default DualFunctionButton;\n"],"file":"DualFunctionButton.js"}
+{"version":3,"sources":["../../src/Button/DualFunctionButton.tsx"],"names":["React","Button","ArrowDropDown","ArrowDropUp","Dropdown","Size","DropdownContent","styled","useClickOutsideRef","useFocusOutsideRef","ButtonsContainer","div","props","size","Large","Medium","DualFunctionButton","children","variant","type","width","testId","disabled","id","dropdownMenuValues","setDropdownMenuValues","dropdownCustomizationProps","loading","icon","onClick","renderProps","useState","isOpen","setIsOpen","focused","setFocused","keyboardNavigated","setKeyboardNavigated","dropdownContainerRef","useRef","selectedValues","setSelectedValues","dropdownContentRef","dropdownButtonRef","useEffect","itemsType","e","key","stopPropagation"],"mappings":";;;;;;;;;;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAoC,UAApC;AACA,SAASC,aAAT,EAAwBC,WAAxB,QAA2C,kCAA3C;AACA,SAASC,QAAT,QAAyB,2BAAzB;AACA,SAASC,IAAT,QAAqB,UAArB;AACA,OAAOC,eAAP,MAA4D,6BAA5D;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAASC,kBAAT,EAA6BC,kBAA7B,QAAuD,WAAvD;;;AAEA,IAAMC,gBAAgB,GAAGH,MAAM,CAACI,GAAV,2OAUP,UAACC,KAAD;AAAA,SAAYA,KAAK,CAACC,IAAN,IAAcR,IAAI,CAACS,KAAnB,GAA2B,UAA3B,GAAwCF,KAAK,CAACC,IAAN,IAAcR,IAAI,CAACU,MAAnB,GAA4B,UAA5B,GAAyC,UAA7F;AAAA,CAVO,CAAtB;;AAwBA,IAAMC,kBAA4D,GAAG,SAA/DA,kBAA+D,OAa/D;AAAA,2BAZJC,QAYI;AAAA,MAZJA,QAYI,8BAZO,gBAYP;AAAA,0BAXJC,OAWI;AAAA,MAXJA,OAWI,6BAXM,SAWN;AAAA,uBAVJC,IAUI;AAAA,MAVJA,IAUI,0BAVG,QAUH;AAAA,uBATJN,IASI;AAAA,MATJA,IASI,0BATGR,IAAI,CAACU,MASR;AAAA,wBARJK,KAQI;AAAA,MARJA,KAQI,2BARI,MAQJ;AAAA,MAPJC,MAOI,QAPJA,MAOI;AAAA,MANJC,QAMI,QANJA,QAMI;AAAA,MALJC,EAKI,QALJA,EAKI;AAAA,MAJJC,kBAII,QAJJA,kBAII;AAAA,MAHJC,qBAGI,QAHJA,qBAGI;AAAA,MAFJC,0BAEI,QAFJA,0BAEI;AAAA,MADDd,KACC;;AACJ;AACA,MAAQe,OAAR,GAAmDf,KAAnD,CAAQe,OAAR;AAAA,MAAiBC,IAAjB,GAAmDhB,KAAnD,CAAiBgB,IAAjB;AAAA,MAAuBC,OAAvB,GAAmDjB,KAAnD,CAAuBiB,OAAvB;AAAA,MAAmCC,WAAnC,4BAAmDlB,KAAnD;;AACA,wBAA4BZ,KAAK,CAAC+B,QAAN,CAAwB,KAAxB,CAA5B;AAAA;AAAA,MAAOC,MAAP;AAAA,MAAeC,SAAf;;AACA,yBAA8BjC,KAAK,CAAC+B,QAAN,CAA8B,IAA9B,CAA9B;AAAA;AAAA,MAAOG,OAAP;AAAA,MAAgBC,UAAhB;;AACA,yBAAkDnC,KAAK,CAAC+B,QAAN,CAAwB,KAAxB,CAAlD;AAAA;AAAA,MAAOK,iBAAP;AAAA,MAA0BC,oBAA1B;;AACA,MAAMC,oBAAoB,GAAGtC,KAAK,CAACuC,MAAN,CAA6B,IAA7B,CAA7B;;AACA,yBAA4CvC,KAAK,CAAC+B,QAAN,CAAyB,EAAzB,CAA5C;AAAA;AAAA,MAAOS,cAAP;AAAA,MAAuBC,iBAAvB;;AAEA,MAAMC,kBAAkB,GAAG1C,KAAK,CAACuC,MAAN,CAA6B,IAA7B,CAA3B;AACA,MAAMI,iBAAiB,GAAGnC,kBAAkB,CAC1C;AAAA,WAAMyB,SAAS,CAAC,KAAD,CAAf;AAAA,GAD0C,EAE1C,CAACK,oBAAD,CAF0C,EAG1C7B,kBAAkB,CAAC;AAAA,WAAMwB,SAAS,CAAC,KAAD,CAAf;AAAA,GAAD,EAAyB,CAACS,kBAAD,CAAzB,CAHwB,CAA5C;AAMA1C,EAAAA,KAAK,CAAC4C,SAAN,CAAgB,YAAM;AACpB,KAACZ,MAAD,IAAWK,oBAAoB,CAAC,KAAD,CAA/B;AACD,GAFD,EAEG,CAACL,MAAD,CAFH;AAIA,sBACE,MAAC,gBAAD;AAAkB,IAAA,GAAG,EAAEM,oBAAvB;AAA6C,IAAA,IAAI,EAAEzB,IAAnD;AAAA,4BACE,MAAC,QAAD;AAAU,MAAA,QAAQ,EAAE,IAApB;AAA0B,MAAA,QAAQ,EAAE,KAApC;AAA2C,MAAA,QAAQ,EAAE,KAArD;AAA4D,MAAA,MAAM,EAAC,EAAnE;AAAA,8BACE,KAAC,MAAD,kCAAYiB,WAAZ;AAAyB,QAAA,OAAO,EAAED,OAAlC;AAA2C,QAAA,QAAQ,EAAEP,QAArD;AAA+D,QAAA,IAAI,EAAEH,IAArE;AAA2E,QAAA,OAAO,EAAEQ,OAApF;AAA6F,QAAA,IAAI,EAAEC,IAAnG;AAAyG,QAAA,IAAI,EAAEf,IAA/G;AAAqH,QAAA,KAAK,EAAEO,KAA5H;AAAmI,QAAA,OAAO,EAAEF,OAA5I;AAAqJ,QAAA,QAAQ,EAAC,OAA9J;AAAA,kBACGD;AADH,SADF,eAIE,KAAC,eAAD;AACE,QAAA,YAAY,EAAEqB,oBADhB;AAEE,QAAA,kBAAkB,EAAEZ,0BAFtB;AAGE,QAAA,MAAM,EAAC,EAHT;AAIE,QAAA,GAAG,EAAEgB,kBAJP;AAKE,QAAA,cAAc,EAAEhB,0BAA0B,CAACmB,SAA3B,IAAwC,QAAxC,GAAmD,EAAnD,GAAwDrB,kBAAxD,aAAwDA,kBAAxD,cAAwDA,kBAAxD,GAA8EgB,cALhG;AAME,QAAA,iBAAiB,EAAEf,qBAAqB,GAAGA,qBAAH,GAA2BgB,iBANrE;AAOE,QAAA,QAAQ,EAAE,IAPZ;AAQE,QAAA,SAAS,EAAER,SARb;AASE,QAAA,OAAO,EAAEC,OATX;AAUE,QAAA,UAAU,EAAEC,UAVd;AAWE,QAAA,IAAI,EAAEtB,IAXR;AAYE,QAAA,OAAO,EAAEuB,iBAZX;AAaE,QAAA,MAAM,EAAEJ,MAbV;AAcE,QAAA,EAAE,EAAET,EAAF,aAAEA,EAAF,cAAEA,EAAF,GAAQ,YAdZ;AAeE,QAAA,kBAAkB,EAAC,EAfrB;AAgBE,QAAA,SAAS,EAAE;AAhBb,QAJF;AAAA,MADF,eAwBE,KAAC,MAAD;AACE,MAAA,OAAO,EAAEL;AADX,OAEMY,WAFN;AAGE,MAAA,UAAU,EAAE,oBAACgB,CAAD,EAAY;AACtB,YAAId,MAAJ,EAAY;;AAEZ,YAAIc,CAAC,CAACC,GAAF,KAAU,OAAV,IAAqBD,CAAC,CAACC,GAAF,KAAU,GAAnC,EAAwC;AACtCZ,UAAAA,UAAU,CAAC,CAAD,CAAV;AACAE,UAAAA,oBAAoB,CAAC,IAAD,CAApB;AACD;AACF,OAVH;AAWE,MAAA,MAAM,EAAE,mBAXV;AAYE,MAAA,GAAG,EAAEM,iBAZP;AAaE,MAAA,QAAQ,EAAErB,QAbZ;AAcE,MAAA,IAAI,EAAEH,IAdR;AAeE,MAAA,IAAI,EAAEN,IAfR;AAgBE,MAAA,QAAQ,EAAE,OAhBZ;AAiBE,MAAA,OAAO,EAAE,iBAACiC,CAAD,EAAO;AACdA,QAAAA,CAAC,CAACE,eAAF;AACAf,QAAAA,SAAS,CAAC,CAACD,MAAF,CAAT;AACD,OApBH;AAqBE,MAAA,IAAI,EAAEA,MAAM,gBAAG,KAAC,WAAD;AAAa,QAAA,IAAI,EAAC;AAAlB,QAAH,gBAAiC,KAAC,aAAD;AAAe,QAAA,IAAI,EAAC;AAApB,QArB/C;AAsBE,MAAA,QAAQ,EAAC;AAtBX,OAxBF;AAAA,IADF;AAmDD,CApFD;;;AAJER,EAAAA,kB;AACAC,EAAAA,qB;;AAyFF,eAAeT,kBAAf","sourcesContent":["import * as React from 'react';\nimport Button, { ButtonProps } from './Button';\nimport { ArrowDropDown, ArrowDropUp } from '../icons/systemicons/SystemIcons';\nimport { Dropdown } from '../Dropdown/CommonStyling';\nimport { Size } from '../types';\nimport DropdownContent, { DropdownCustomizationProps } from '../Dropdown/DropdownContent';\nimport styled from 'styled-components';\nimport { useClickOutsideRef, useFocusOutsideRef } from '../common';\n\nconst ButtonsContainer = styled.div<{ size?: Size }>`\n  display: flex;\n  align-items: center;\n\n  button:first-child {\n    margin-right: 2px;\n  }\n\n  div.button-content {\n    gap: 0px;\n    padding: ${(props) => (props.size == Size.Large ? '4px 18px' : props.size == Size.Medium ? '4px 14px' : '4px 10px')};\n  }\n`;\n\nexport interface ButtonOption {\n  label: string;\n}\n\nexport interface DualButtonProps extends ButtonProps {\n  dropdownCustomizationProps: DropdownCustomizationProps;\n  dropdownMenuValues?: string[];\n  setDropdownMenuValues?: (values: string[]) => void | boolean | undefined;\n}\n\nconst DualFunctionButton: React.FunctionComponent<DualButtonProps> = ({\n  children = 'Primary Button',\n  variant = 'primary',\n  type = 'button',\n  size = Size.Medium,\n  width = 'auto',\n  testId,\n  disabled,\n  id,\n  dropdownMenuValues,\n  setDropdownMenuValues,\n  dropdownCustomizationProps,\n  ...props\n}) => {\n  // Let's filter out properties that we don't need to render.\n  const { loading, icon, onClick, ...renderProps } = props;\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [focused, setFocused] = React.useState<number | null>(null);\n  const [keyboardNavigated, setKeyboardNavigated] = React.useState<boolean>(false);\n  const dropdownContainerRef = React.useRef<HTMLDivElement>(null);\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n\n  const dropdownContentRef = React.useRef<HTMLDivElement>(null);\n  const dropdownButtonRef = useClickOutsideRef(\n    () => setIsOpen(false),\n    [dropdownContainerRef],\n    useFocusOutsideRef(() => setIsOpen(false), [dropdownContentRef]),\n  );\n\n  React.useEffect(() => {\n    !isOpen && setKeyboardNavigated(false);\n  }, [isOpen]);\n\n  return (\n    <ButtonsContainer ref={dropdownContainerRef} size={size}>\n      <Dropdown isButton={true} readOnly={false} disabled={false} margin=\"\">\n        <Button {...renderProps} onClick={onClick} disabled={disabled} type={type} loading={loading} icon={icon} size={size} width={width} variant={variant} flatEdge=\"right\">\n          {children}\n        </Button>\n        <DropdownContent\n          containerRef={dropdownContainerRef}\n          customizationProps={dropdownCustomizationProps}\n          filter=\"\"\n          ref={dropdownContentRef}\n          selectedValues={dropdownCustomizationProps.itemsType == 'normal' ? [] : dropdownMenuValues ?? selectedValues}\n          setSelectedValues={setDropdownMenuValues ? setDropdownMenuValues : setSelectedValues}\n          isButton={true}\n          setIsOpen={setIsOpen}\n          focused={focused}\n          setFocused={setFocused}\n          size={size}\n          outline={keyboardNavigated}\n          isOpen={isOpen}\n          id={id ?? 'dropdownId'}\n          messageOnNoResults=\"\"\n          alignLeft={true}\n        />\n      </Dropdown>\n      <Button\n        variant={variant}\n        {...renderProps}\n        onKeyPress={(e: any) => {\n          if (isOpen) return;\n\n          if (e.key === 'Enter' || e.key === ' ') {\n            setFocused(0);\n            setKeyboardNavigated(true);\n          }\n        }}\n        testId={'options_toggleBtn'}\n        ref={dropdownButtonRef}\n        disabled={disabled}\n        type={type}\n        size={size}\n        minWidth={'unset'}\n        onClick={(e) => {\n          e.stopPropagation();\n          setIsOpen(!isOpen);\n        }}\n        icon={isOpen ? <ArrowDropUp size=\"16px\" /> : <ArrowDropDown size=\"16px\" />}\n        flatEdge=\"left\"\n      />\n    </ButtonsContainer>\n  );\n};\n\nexport default DualFunctionButton;\n"],"file":"DualFunctionButton.js"}

package/dist/Button/Iconbutton.cjs

@@ -177,23 +177,18 @@ var IconButton = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
 });
 
 IconButton.propTypes = {
-  id: _propTypes.default.string,
-  className: _propTypes.default.string,
   variant: _propTypes.default.oneOf(['primary', 'secondary']),
   shape: _propTypes.default.oneOf(['square', 'circular']),
   action: _propTypes.default.func.isRequired,
   hideOnLowWidth: _propTypes.default.bool,
   isInMobileMenu: _propTypes.default.bool,
-  disabled: _propTypes.default.bool,
   useTransparentBackground: _propTypes.default.bool,
   shouldNotInteract: _propTypes.default.bool,
   iconColor: _propTypes.default.string,
   unsetIconSize: _propTypes.default.bool,
-  tabIndex: _propTypes.default.number,
   borderRadius: _propTypes.default.number,
   focusBackgroundColor: _propTypes.default.string,
   children: _propTypes.default.node,
-  hidden: _propTypes.default.bool,
   invertFocus: _propTypes.default.bool
 };
 var _default = IconButton;

package/dist/Button/Iconbutton.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Button/Iconbutton.tsx"],"names":["getBorderRadius","props","borderRadius","getBorderRadiusStyle","radius","flatEdge","IconButtonContent","styled","div","StyledIconButton","button","hideOnLowWidth","BREAKPOINTS","MEDIUM","unsetIconSize","invertFocus","invertedFocusStyles","focusStyles","StyledPrimaryIconButton","useTransparentBackground","COLORS","primary_500","iconColor","white","primary_700","primary_800","neutral_200","StyledSecondaryIconButton","neutral_600","shouldNotInteract","primary_20","primary_100","neutral_300","IconButton","React","forwardRef","ref","id","variant","shape","action","isInMobileMenu","children","disabled","tabIndex","focusBackgroundColor","type","hidden","rest","event","stopPropagation","defaultOnMouseDownHandler","className"],"mappings":"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","sourcesContent":["import React from 'react';\nimport styled, { css, CSSProperties } from 'styled-components';\n\nimport { BREAKPOINTS, COLORS, focusStyles, invertedFocusStyles } from '../styles';\nimport { defaultOnMouseDownHandler } from '../common';\n\ninterface HeaderItemProps {\n  hideOnLowWidth: boolean;\n  inMobileMenu?: boolean;\n  useTransparentBackground?: boolean;\n  iconColor?: string;\n  unsetIconSize?: boolean;\n  borderRadius?: number;\n  shape?: string;\n  flatEdge?: string;\n  focusBackgroundColor?: string;\n  invertFocus?: boolean;\n  shouldNotInteract?: boolean;\n}\n\nconst getBorderRadius = (props: HeaderItemProps) => (props.borderRadius ? `${props.borderRadius}px` : '4px');\n\nconst getBorderRadiusStyle = (props: HeaderItemProps) => {\n  const radius = getBorderRadius(props);\n  switch (props.flatEdge) {\n    case 'left':\n      return `0px ${radius} ${radius} 0px`;\n\n    case 'right':\n      return `${radius} 0px 0px ${radius}`;\n\n    case 'none':\n    default:\n      return `${radius}`;\n  }\n};\n\nexport const IconButtonContent = styled.div``;\n\nexport const StyledIconButton = styled.button<HeaderItemProps>`\n  border-width: 0;\n  cursor: pointer;\n  height: 48px;\n  width: 48px;\n  background: transparent;\n  position: relative;\n\n  display: ${(props) => (props.hideOnLowWidth ? 'none' : 'block')};\n  ${BREAKPOINTS.MEDIUM} {\n    display: block;\n  }\n\n  border-radius: ${(props) => (props.borderRadius ? `${props.borderRadius}px` : '4px')};\n  ${IconButtonContent} {\n    height: 36px;\n    width: 36px;\n    border-radius: ${getBorderRadiusStyle};\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    svg {\n      height: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n      width: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n      padding: 0;\n    }\n  }\n  &:only-child {\n    margin: 0;\n  }\n  &:disabled {\n    cursor: not-allowed;\n  }\n\n  &:focus {\n    ${(props) => (props.invertFocus ? invertedFocusStyles : focusStyles)}\n  }\n`;\n\nexport const StyledPrimaryIconButton = styled(StyledIconButton)`\n  ${IconButtonContent} {\n    background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.primary_500)};\n\n    svg {\n      fill: ${(props) => props.iconColor || COLORS.white};\n      path {\n        fill: ${(props) => props.iconColor || COLORS.white};\n      }\n    }\n  }\n  &:hover:not(:disabled),\n  &.hover-state {\n    ${IconButtonContent} {\n      background-color: ${COLORS.primary_700};\n    }\n    ${IconButtonContent} svg path,\n    ${IconButtonContent} svg {\n      fill: ${COLORS.white};\n    }\n  }\n  &:active:not(:disabled),\n  &.active-state {\n    ${IconButtonContent} {\n      background: ${COLORS.primary_800};\n    }\n    ${IconButtonContent} svg path,\n    ${IconButtonContent} svg {\n      fill: ${COLORS.white};\n    }\n  }\n  &:disabled {\n    ${IconButtonContent} {\n      background-color: ${COLORS.neutral_200};\n    }\n    svg {\n      path {\n        fill: ${COLORS.white};\n      }\n      fill: ${COLORS.white};\n    }\n  }\n`;\n\nexport const StyledSecondaryIconButton = styled(StyledIconButton)`\n  ${IconButtonContent} {\n    background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n\n    svg {\n      fill: ${(props) => props.iconColor || COLORS.neutral_600};\n      path {\n        fill: ${(props) => props.iconColor || COLORS.neutral_600};\n      }\n    }\n  }\n\n  pointer-events: ${(props) => (props.shouldNotInteract ? 'none' : 'auto')};\n\n  &:hover:not(:disabled) {\n    ${IconButtonContent} {\n      background-color: ${COLORS.primary_20};\n    }\n    ${IconButtonContent} svg path,\n    ${IconButtonContent} svg {\n      fill: ${COLORS.primary_700};\n    }\n  }\n  &:active:not(:disabled),\n  &.active-state {\n    ${IconButtonContent} {\n      background: ${COLORS.primary_100};\n    }\n    ${IconButtonContent} svg path,\n    ${IconButtonContent} svg {\n      fill: ${COLORS.primary_800};\n    }\n  }\n\n  &:disabled {\n    ${IconButtonContent} {\n      background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n    }\n    svg {\n      path {\n        fill: ${COLORS.neutral_300};\n      }\n      fill: ${COLORS.neutral_300};\n    }\n  }\n`;\n\nexport interface IconButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'type' | 'id' | 'className' | 'onClick' | 'hidden' | 'tabIndex' | 'disabled' | 'onMouseDown'> {\n  id?: string;\n  className?: string;\n  variant?: 'primary' | 'secondary';\n  shape?: 'square' | 'circular';\n  action: (event?: React.MouseEvent<HTMLButtonElement>) => void;\n  hideOnLowWidth?: boolean;\n  flatEdge?: 'right' | 'left' | 'none' | undefined;\n  isInMobileMenu?: boolean;\n  disabled?: boolean;\n  useTransparentBackground?: boolean;\n  shouldNotInteract?: boolean;\n  iconColor?: string;\n  unsetIconSize?: boolean;\n  tabIndex?: number;\n  borderRadius?: number;\n  focusBackgroundColor?: string;\n  type?: 'submit' | 'reset' | 'button' | undefined;\n  children?: React.ReactNode;\n  hidden?: boolean;\n  invertFocus?: boolean;\n}\n\nconst IconButton = React.forwardRef<HTMLButtonElement, IconButtonProps>(\n  (\n    {\n      id,\n      variant,\n      shape,\n      action,\n      hideOnLowWidth,\n      isInMobileMenu,\n      children,\n      useTransparentBackground,\n      shouldNotInteract,\n      disabled,\n      iconColor,\n      unsetIconSize,\n      tabIndex,\n      flatEdge,\n      borderRadius,\n      focusBackgroundColor,\n      type,\n      hidden,\n      invertFocus,\n      ...rest\n    }: IconButtonProps,\n    ref,\n  ) => {\n    // Let's render button\n    switch (variant) {\n      case 'secondary':\n        return (\n          <StyledSecondaryIconButton\n            id={id}\n            type={type ?? 'button'}\n            data-testid={id}\n            ref={ref}\n            onClick={(event: React.MouseEvent<HTMLButtonElement>) => {\n              event.stopPropagation();\n              action(event);\n            }}\n            disabled={disabled}\n            hideOnLowWidth={hideOnLowWidth || false}\n            inMobileMenu={isInMobileMenu}\n            useTransparentBackground={useTransparentBackground}\n            shouldNotInteract={shouldNotInteract}\n            iconColor={iconColor}\n            unsetIconSize={unsetIconSize}\n            tabIndex={tabIndex || 0}\n            borderRadius={borderRadius || shape === 'circular' ? 18 : 0}\n            onMouseDown={defaultOnMouseDownHandler}\n            hidden={hidden}\n            invertFocus={invertFocus}\n            focusBackgroundColor={focusBackgroundColor}\n            {...rest}>\n            <IconButtonContent>{children}</IconButtonContent>\n          </StyledSecondaryIconButton>\n        );\n      case 'primary':\n      default:\n        return (\n          <StyledPrimaryIconButton\n            id={id}\n            type={type ?? 'button'}\n            data-testid={id}\n            flatEdge={flatEdge}\n            ref={ref}\n            onClick={(event: React.MouseEvent<HTMLButtonElement>) => {\n              event.stopPropagation();\n              action(event);\n            }}\n            disabled={disabled}\n            hideOnLowWidth={hideOnLowWidth || false}\n            inMobileMenu={isInMobileMenu}\n            useTransparentBackground={useTransparentBackground}\n            iconColor={iconColor}\n            unsetIconSize={unsetIconSize}\n            tabIndex={tabIndex || 0}\n            borderRadius={borderRadius || shape === 'circular' ? 18 : 0}\n            onMouseDown={defaultOnMouseDownHandler}\n            hidden={hidden}\n            invertFocus={invertFocus}\n            focusBackgroundColor={focusBackgroundColor}\n            {...rest}>\n            <IconButtonContent>{children}</IconButtonContent>\n          </StyledPrimaryIconButton>\n        );\n    }\n  },\n);\n\nexport default IconButton;\n"],"file":"Iconbutton.cjs"}
+{"version":3,"sources":["../../src/Button/Iconbutton.tsx"],"names":["getBorderRadius","props","borderRadius","getBorderRadiusStyle","radius","flatEdge","IconButtonContent","styled","div","StyledIconButton","button","hideOnLowWidth","BREAKPOINTS","MEDIUM","unsetIconSize","invertFocus","invertedFocusStyles","focusStyles","StyledPrimaryIconButton","useTransparentBackground","COLORS","primary_500","iconColor","white","primary_700","primary_800","neutral_200","StyledSecondaryIconButton","neutral_600","shouldNotInteract","primary_20","primary_100","neutral_300","IconButton","React","forwardRef","ref","id","variant","shape","action","isInMobileMenu","children","disabled","tabIndex","focusBackgroundColor","type","hidden","rest","event","stopPropagation","defaultOnMouseDownHandler"],"mappings":"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","sourcesContent":["import React from 'react';\nimport styled, { css, CSSProperties } from 'styled-components';\n\nimport { BREAKPOINTS, COLORS, focusStyles, invertedFocusStyles } from '../styles';\nimport { defaultOnMouseDownHandler } from '../common';\n\ninterface HeaderItemProps {\n  hideOnLowWidth: boolean;\n  inMobileMenu?: boolean;\n  useTransparentBackground?: boolean;\n  iconColor?: string;\n  unsetIconSize?: boolean;\n  borderRadius?: number;\n  shape?: string;\n  flatEdge?: string;\n  focusBackgroundColor?: string;\n  invertFocus?: boolean;\n  shouldNotInteract?: boolean;\n}\n\nconst getBorderRadius = (props: HeaderItemProps) => (props.borderRadius ? `${props.borderRadius}px` : '4px');\n\nconst getBorderRadiusStyle = (props: HeaderItemProps) => {\n  const radius = getBorderRadius(props);\n  switch (props.flatEdge) {\n    case 'left':\n      return `0px ${radius} ${radius} 0px`;\n\n    case 'right':\n      return `${radius} 0px 0px ${radius}`;\n\n    case 'none':\n    default:\n      return `${radius}`;\n  }\n};\n\nexport const IconButtonContent = styled.div``;\n\nexport const StyledIconButton = styled.button<HeaderItemProps>`\n  border-width: 0;\n  cursor: pointer;\n  height: 48px;\n  width: 48px;\n  background: transparent;\n  position: relative;\n\n  display: ${(props) => (props.hideOnLowWidth ? 'none' : 'block')};\n  ${BREAKPOINTS.MEDIUM} {\n    display: block;\n  }\n\n  border-radius: ${(props) => (props.borderRadius ? `${props.borderRadius}px` : '4px')};\n  ${IconButtonContent} {\n    height: 36px;\n    width: 36px;\n    border-radius: ${getBorderRadiusStyle};\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    svg {\n      height: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n      width: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n      padding: 0;\n    }\n  }\n  &:only-child {\n    margin: 0;\n  }\n  &:disabled {\n    cursor: not-allowed;\n  }\n\n  &:focus {\n    ${(props) => (props.invertFocus ? invertedFocusStyles : focusStyles)}\n  }\n`;\n\nexport const StyledPrimaryIconButton = styled(StyledIconButton)`\n  ${IconButtonContent} {\n    background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.primary_500)};\n\n    svg {\n      fill: ${(props) => props.iconColor || COLORS.white};\n      path {\n        fill: ${(props) => props.iconColor || COLORS.white};\n      }\n    }\n  }\n  &:hover:not(:disabled),\n  &.hover-state {\n    ${IconButtonContent} {\n      background-color: ${COLORS.primary_700};\n    }\n    ${IconButtonContent} svg path,\n    ${IconButtonContent} svg {\n      fill: ${COLORS.white};\n    }\n  }\n  &:active:not(:disabled),\n  &.active-state {\n    ${IconButtonContent} {\n      background: ${COLORS.primary_800};\n    }\n    ${IconButtonContent} svg path,\n    ${IconButtonContent} svg {\n      fill: ${COLORS.white};\n    }\n  }\n  &:disabled {\n    ${IconButtonContent} {\n      background-color: ${COLORS.neutral_200};\n    }\n    svg {\n      path {\n        fill: ${COLORS.white};\n      }\n      fill: ${COLORS.white};\n    }\n  }\n`;\n\nexport const StyledSecondaryIconButton = styled(StyledIconButton)`\n  ${IconButtonContent} {\n    background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n\n    svg {\n      fill: ${(props) => props.iconColor || COLORS.neutral_600};\n      path {\n        fill: ${(props) => props.iconColor || COLORS.neutral_600};\n      }\n    }\n  }\n\n  pointer-events: ${(props) => (props.shouldNotInteract ? 'none' : 'auto')};\n\n  &:hover:not(:disabled) {\n    ${IconButtonContent} {\n      background-color: ${COLORS.primary_20};\n    }\n    ${IconButtonContent} svg path,\n    ${IconButtonContent} svg {\n      fill: ${COLORS.primary_700};\n    }\n  }\n  &:active:not(:disabled),\n  &.active-state {\n    ${IconButtonContent} {\n      background: ${COLORS.primary_100};\n    }\n    ${IconButtonContent} svg path,\n    ${IconButtonContent} svg {\n      fill: ${COLORS.primary_800};\n    }\n  }\n\n  &:disabled {\n    ${IconButtonContent} {\n      background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n    }\n    svg {\n      path {\n        fill: ${COLORS.neutral_300};\n      }\n      fill: ${COLORS.neutral_300};\n    }\n  }\n`;\n\nexport interface IconButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>,  'onClick' | 'onMouseDown'> {\n  variant?: 'primary' | 'secondary';\n  shape?: 'square' | 'circular';\n  action: (event?: React.MouseEvent<HTMLButtonElement>) => void;\n  hideOnLowWidth?: boolean;\n  flatEdge?: 'right' | 'left' | 'none' | undefined;\n  isInMobileMenu?: boolean;\n  useTransparentBackground?: boolean;\n  shouldNotInteract?: boolean;\n  iconColor?: string;\n  unsetIconSize?: boolean;\n  borderRadius?: number;\n  focusBackgroundColor?: string;\n  children?: React.ReactNode;\n  invertFocus?: boolean;\n}\n\nconst IconButton = React.forwardRef<HTMLButtonElement, IconButtonProps>(\n  (\n    {\n      id,\n      variant,\n      shape,\n      action,\n      hideOnLowWidth,\n      isInMobileMenu,\n      children,\n      useTransparentBackground,\n      shouldNotInteract,\n      disabled,\n      iconColor,\n      unsetIconSize,\n      tabIndex,\n      flatEdge,\n      borderRadius,\n      focusBackgroundColor,\n      type,\n      hidden,\n      invertFocus,\n      ...rest\n    }: IconButtonProps,\n    ref,\n  ) => {\n    // Let's render button\n    switch (variant) {\n      case 'secondary':\n        return (\n          <StyledSecondaryIconButton\n            id={id}\n            type={type ?? 'button'}\n            data-testid={id}\n            ref={ref}\n            onClick={(event: React.MouseEvent<HTMLButtonElement>) => {\n              event.stopPropagation();\n              action(event);\n            }}\n            disabled={disabled}\n            hideOnLowWidth={hideOnLowWidth || false}\n            inMobileMenu={isInMobileMenu}\n            useTransparentBackground={useTransparentBackground}\n            shouldNotInteract={shouldNotInteract}\n            iconColor={iconColor}\n            unsetIconSize={unsetIconSize}\n            tabIndex={tabIndex || 0}\n            borderRadius={borderRadius || shape === 'circular' ? 18 : 0}\n            onMouseDown={defaultOnMouseDownHandler}\n            hidden={hidden}\n            invertFocus={invertFocus}\n            focusBackgroundColor={focusBackgroundColor}\n            {...rest}>\n            <IconButtonContent>{children}</IconButtonContent>\n          </StyledSecondaryIconButton>\n        );\n      case 'primary':\n      default:\n        return (\n          <StyledPrimaryIconButton\n            id={id}\n            type={type ?? 'button'}\n            data-testid={id}\n            flatEdge={flatEdge}\n            ref={ref}\n            onClick={(event: React.MouseEvent<HTMLButtonElement>) => {\n              event.stopPropagation();\n              action(event);\n            }}\n            disabled={disabled}\n            hideOnLowWidth={hideOnLowWidth || false}\n            inMobileMenu={isInMobileMenu}\n            useTransparentBackground={useTransparentBackground}\n            iconColor={iconColor}\n            unsetIconSize={unsetIconSize}\n            tabIndex={tabIndex || 0}\n            borderRadius={borderRadius || shape === 'circular' ? 18 : 0}\n            onMouseDown={defaultOnMouseDownHandler}\n            hidden={hidden}\n            invertFocus={invertFocus}\n            focusBackgroundColor={focusBackgroundColor}\n            {...rest}>\n            <IconButtonContent>{children}</IconButtonContent>\n          </StyledPrimaryIconButton>\n        );\n    }\n  },\n);\n\nexport default IconButton;\n"],"file":"Iconbutton.cjs"}

package/dist/Button/Iconbutton.d.ts

@@ -16,26 +16,20 @@ export declare const IconButtonContent: import("styled-components").StyledCompon
 export declare const StyledIconButton: import("styled-components").StyledComponent<"button", any, HeaderItemProps, never>;
 export declare const StyledPrimaryIconButton: import("styled-components").StyledComponent<"button", any, HeaderItemProps, never>;
 export declare const StyledSecondaryIconButton: import("styled-components").StyledComponent<"button", any, HeaderItemProps, never>;
-export interface IconButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'type' | 'id' | 'className' | 'onClick' | 'hidden' | 'tabIndex' | 'disabled' | 'onMouseDown'> {
-    id?: string;
-    className?: string;
+export interface IconButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'onClick' | 'onMouseDown'> {
     variant?: 'primary' | 'secondary';
     shape?: 'square' | 'circular';
     action: (event?: React.MouseEvent<HTMLButtonElement>) => void;
     hideOnLowWidth?: boolean;
     flatEdge?: 'right' | 'left' | 'none' | undefined;
     isInMobileMenu?: boolean;
-    disabled?: boolean;
     useTransparentBackground?: boolean;
     shouldNotInteract?: boolean;
     iconColor?: string;
     unsetIconSize?: boolean;
-    tabIndex?: number;
     borderRadius?: number;
     focusBackgroundColor?: string;
-    type?: 'submit' | 'reset' | 'button' | undefined;
     children?: React.ReactNode;
-    hidden?: boolean;
     invertFocus?: boolean;
 }
 declare const IconButton: React.ForwardRefExoticComponent<IconButtonProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/Button/Iconbutton.js

@@ -151,23 +151,18 @@ var IconButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   }
 });
 IconButton.propTypes = {
-  id: _pt.string,
-  className: _pt.string,
   variant: _pt.oneOf(['primary', 'secondary']),
   shape: _pt.oneOf(['square', 'circular']),
   action: _pt.func.isRequired,
   hideOnLowWidth: _pt.bool,
   isInMobileMenu: _pt.bool,
-  disabled: _pt.bool,
   useTransparentBackground: _pt.bool,
   shouldNotInteract: _pt.bool,
   iconColor: _pt.string,
   unsetIconSize: _pt.bool,
-  tabIndex: _pt.number,
   borderRadius: _pt.number,
   focusBackgroundColor: _pt.string,
   children: _pt.node,
-  hidden: _pt.bool,
   invertFocus: _pt.bool
 };
 export default IconButton;

package/dist/Button/Iconbutton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Button/Iconbutton.tsx"],"names":["React","styled","BREAKPOINTS","COLORS","focusStyles","invertedFocusStyles","defaultOnMouseDownHandler","getBorderRadius","props","borderRadius","getBorderRadiusStyle","radius","flatEdge","IconButtonContent","div","StyledIconButton","button","hideOnLowWidth","MEDIUM","unsetIconSize","invertFocus","StyledPrimaryIconButton","useTransparentBackground","primary_500","iconColor","white","primary_700","primary_800","neutral_200","StyledSecondaryIconButton","neutral_600","shouldNotInteract","primary_20","primary_100","neutral_300","IconButton","forwardRef","ref","id","variant","shape","action","isInMobileMenu","children","disabled","tabIndex","focusBackgroundColor","type","hidden","rest","event","stopPropagation","className"],"mappings":"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","sourcesContent":["import React from 'react';\nimport styled, { css, CSSProperties } from 'styled-components';\n\nimport { BREAKPOINTS, COLORS, focusStyles, invertedFocusStyles } from '../styles';\nimport { defaultOnMouseDownHandler } from '../common';\n\ninterface HeaderItemProps {\n  hideOnLowWidth: boolean;\n  inMobileMenu?: boolean;\n  useTransparentBackground?: boolean;\n  iconColor?: string;\n  unsetIconSize?: boolean;\n  borderRadius?: number;\n  shape?: string;\n  flatEdge?: string;\n  focusBackgroundColor?: string;\n  invertFocus?: boolean;\n  shouldNotInteract?: boolean;\n}\n\nconst getBorderRadius = (props: HeaderItemProps) => (props.borderRadius ? `${props.borderRadius}px` : '4px');\n\nconst getBorderRadiusStyle = (props: HeaderItemProps) => {\n  const radius = getBorderRadius(props);\n  switch (props.flatEdge) {\n    case 'left':\n      return `0px ${radius} ${radius} 0px`;\n\n    case 'right':\n      return `${radius} 0px 0px ${radius}`;\n\n    case 'none':\n    default:\n      return `${radius}`;\n  }\n};\n\nexport const IconButtonContent = styled.div``;\n\nexport const StyledIconButton = styled.button<HeaderItemProps>`\n  border-width: 0;\n  cursor: pointer;\n  height: 48px;\n  width: 48px;\n  background: transparent;\n  position: relative;\n\n  display: ${(props) => (props.hideOnLowWidth ? 'none' : 'block')};\n  ${BREAKPOINTS.MEDIUM} {\n    display: block;\n  }\n\n  border-radius: ${(props) => (props.borderRadius ? `${props.borderRadius}px` : '4px')};\n  ${IconButtonContent} {\n    height: 36px;\n    width: 36px;\n    border-radius: ${getBorderRadiusStyle};\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    svg {\n      height: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n      width: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n      padding: 0;\n    }\n  }\n  &:only-child {\n    margin: 0;\n  }\n  &:disabled {\n    cursor: not-allowed;\n  }\n\n  &:focus {\n    ${(props) => (props.invertFocus ? invertedFocusStyles : focusStyles)}\n  }\n`;\n\nexport const StyledPrimaryIconButton = styled(StyledIconButton)`\n  ${IconButtonContent} {\n    background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.primary_500)};\n\n    svg {\n      fill: ${(props) => props.iconColor || COLORS.white};\n      path {\n        fill: ${(props) => props.iconColor || COLORS.white};\n      }\n    }\n  }\n  &:hover:not(:disabled),\n  &.hover-state {\n    ${IconButtonContent} {\n      background-color: ${COLORS.primary_700};\n    }\n    ${IconButtonContent} svg path,\n    ${IconButtonContent} svg {\n      fill: ${COLORS.white};\n    }\n  }\n  &:active:not(:disabled),\n  &.active-state {\n    ${IconButtonContent} {\n      background: ${COLORS.primary_800};\n    }\n    ${IconButtonContent} svg path,\n    ${IconButtonContent} svg {\n      fill: ${COLORS.white};\n    }\n  }\n  &:disabled {\n    ${IconButtonContent} {\n      background-color: ${COLORS.neutral_200};\n    }\n    svg {\n      path {\n        fill: ${COLORS.white};\n      }\n      fill: ${COLORS.white};\n    }\n  }\n`;\n\nexport const StyledSecondaryIconButton = styled(StyledIconButton)`\n  ${IconButtonContent} {\n    background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n\n    svg {\n      fill: ${(props) => props.iconColor || COLORS.neutral_600};\n      path {\n        fill: ${(props) => props.iconColor || COLORS.neutral_600};\n      }\n    }\n  }\n\n  pointer-events: ${(props) => (props.shouldNotInteract ? 'none' : 'auto')};\n\n  &:hover:not(:disabled) {\n    ${IconButtonContent} {\n      background-color: ${COLORS.primary_20};\n    }\n    ${IconButtonContent} svg path,\n    ${IconButtonContent} svg {\n      fill: ${COLORS.primary_700};\n    }\n  }\n  &:active:not(:disabled),\n  &.active-state {\n    ${IconButtonContent} {\n      background: ${COLORS.primary_100};\n    }\n    ${IconButtonContent} svg path,\n    ${IconButtonContent} svg {\n      fill: ${COLORS.primary_800};\n    }\n  }\n\n  &:disabled {\n    ${IconButtonContent} {\n      background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n    }\n    svg {\n      path {\n        fill: ${COLORS.neutral_300};\n      }\n      fill: ${COLORS.neutral_300};\n    }\n  }\n`;\n\nexport interface IconButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'type' | 'id' | 'className' | 'onClick' | 'hidden' | 'tabIndex' | 'disabled' | 'onMouseDown'> {\n  id?: string;\n  className?: string;\n  variant?: 'primary' | 'secondary';\n  shape?: 'square' | 'circular';\n  action: (event?: React.MouseEvent<HTMLButtonElement>) => void;\n  hideOnLowWidth?: boolean;\n  flatEdge?: 'right' | 'left' | 'none' | undefined;\n  isInMobileMenu?: boolean;\n  disabled?: boolean;\n  useTransparentBackground?: boolean;\n  shouldNotInteract?: boolean;\n  iconColor?: string;\n  unsetIconSize?: boolean;\n  tabIndex?: number;\n  borderRadius?: number;\n  focusBackgroundColor?: string;\n  type?: 'submit' | 'reset' | 'button' | undefined;\n  children?: React.ReactNode;\n  hidden?: boolean;\n  invertFocus?: boolean;\n}\n\nconst IconButton = React.forwardRef<HTMLButtonElement, IconButtonProps>(\n  (\n    {\n      id,\n      variant,\n      shape,\n      action,\n      hideOnLowWidth,\n      isInMobileMenu,\n      children,\n      useTransparentBackground,\n      shouldNotInteract,\n      disabled,\n      iconColor,\n      unsetIconSize,\n      tabIndex,\n      flatEdge,\n      borderRadius,\n      focusBackgroundColor,\n      type,\n      hidden,\n      invertFocus,\n      ...rest\n    }: IconButtonProps,\n    ref,\n  ) => {\n    // Let's render button\n    switch (variant) {\n      case 'secondary':\n        return (\n          <StyledSecondaryIconButton\n            id={id}\n            type={type ?? 'button'}\n            data-testid={id}\n            ref={ref}\n            onClick={(event: React.MouseEvent<HTMLButtonElement>) => {\n              event.stopPropagation();\n              action(event);\n            }}\n            disabled={disabled}\n            hideOnLowWidth={hideOnLowWidth || false}\n            inMobileMenu={isInMobileMenu}\n            useTransparentBackground={useTransparentBackground}\n            shouldNotInteract={shouldNotInteract}\n            iconColor={iconColor}\n            unsetIconSize={unsetIconSize}\n            tabIndex={tabIndex || 0}\n            borderRadius={borderRadius || shape === 'circular' ? 18 : 0}\n            onMouseDown={defaultOnMouseDownHandler}\n            hidden={hidden}\n            invertFocus={invertFocus}\n            focusBackgroundColor={focusBackgroundColor}\n            {...rest}>\n            <IconButtonContent>{children}</IconButtonContent>\n          </StyledSecondaryIconButton>\n        );\n      case 'primary':\n      default:\n        return (\n          <StyledPrimaryIconButton\n            id={id}\n            type={type ?? 'button'}\n            data-testid={id}\n            flatEdge={flatEdge}\n            ref={ref}\n            onClick={(event: React.MouseEvent<HTMLButtonElement>) => {\n              event.stopPropagation();\n              action(event);\n            }}\n            disabled={disabled}\n            hideOnLowWidth={hideOnLowWidth || false}\n            inMobileMenu={isInMobileMenu}\n            useTransparentBackground={useTransparentBackground}\n            iconColor={iconColor}\n            unsetIconSize={unsetIconSize}\n            tabIndex={tabIndex || 0}\n            borderRadius={borderRadius || shape === 'circular' ? 18 : 0}\n            onMouseDown={defaultOnMouseDownHandler}\n            hidden={hidden}\n            invertFocus={invertFocus}\n            focusBackgroundColor={focusBackgroundColor}\n            {...rest}>\n            <IconButtonContent>{children}</IconButtonContent>\n          </StyledPrimaryIconButton>\n        );\n    }\n  },\n);\n\nexport default IconButton;\n"],"file":"Iconbutton.js"}
+{"version":3,"sources":["../../src/Button/Iconbutton.tsx"],"names":["React","styled","BREAKPOINTS","COLORS","focusStyles","invertedFocusStyles","defaultOnMouseDownHandler","getBorderRadius","props","borderRadius","getBorderRadiusStyle","radius","flatEdge","IconButtonContent","div","StyledIconButton","button","hideOnLowWidth","MEDIUM","unsetIconSize","invertFocus","StyledPrimaryIconButton","useTransparentBackground","primary_500","iconColor","white","primary_700","primary_800","neutral_200","StyledSecondaryIconButton","neutral_600","shouldNotInteract","primary_20","primary_100","neutral_300","IconButton","forwardRef","ref","id","variant","shape","action","isInMobileMenu","children","disabled","tabIndex","focusBackgroundColor","type","hidden","rest","event","stopPropagation"],"mappings":"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","sourcesContent":["import React from 'react';\nimport styled, { css, CSSProperties } from 'styled-components';\n\nimport { BREAKPOINTS, COLORS, focusStyles, invertedFocusStyles } from '../styles';\nimport { defaultOnMouseDownHandler } from '../common';\n\ninterface HeaderItemProps {\n  hideOnLowWidth: boolean;\n  inMobileMenu?: boolean;\n  useTransparentBackground?: boolean;\n  iconColor?: string;\n  unsetIconSize?: boolean;\n  borderRadius?: number;\n  shape?: string;\n  flatEdge?: string;\n  focusBackgroundColor?: string;\n  invertFocus?: boolean;\n  shouldNotInteract?: boolean;\n}\n\nconst getBorderRadius = (props: HeaderItemProps) => (props.borderRadius ? `${props.borderRadius}px` : '4px');\n\nconst getBorderRadiusStyle = (props: HeaderItemProps) => {\n  const radius = getBorderRadius(props);\n  switch (props.flatEdge) {\n    case 'left':\n      return `0px ${radius} ${radius} 0px`;\n\n    case 'right':\n      return `${radius} 0px 0px ${radius}`;\n\n    case 'none':\n    default:\n      return `${radius}`;\n  }\n};\n\nexport const IconButtonContent = styled.div``;\n\nexport const StyledIconButton = styled.button<HeaderItemProps>`\n  border-width: 0;\n  cursor: pointer;\n  height: 48px;\n  width: 48px;\n  background: transparent;\n  position: relative;\n\n  display: ${(props) => (props.hideOnLowWidth ? 'none' : 'block')};\n  ${BREAKPOINTS.MEDIUM} {\n    display: block;\n  }\n\n  border-radius: ${(props) => (props.borderRadius ? `${props.borderRadius}px` : '4px')};\n  ${IconButtonContent} {\n    height: 36px;\n    width: 36px;\n    border-radius: ${getBorderRadiusStyle};\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    svg {\n      height: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n      width: ${(props) => (props.unsetIconSize ? 'unset' : '24px')};\n      padding: 0;\n    }\n  }\n  &:only-child {\n    margin: 0;\n  }\n  &:disabled {\n    cursor: not-allowed;\n  }\n\n  &:focus {\n    ${(props) => (props.invertFocus ? invertedFocusStyles : focusStyles)}\n  }\n`;\n\nexport const StyledPrimaryIconButton = styled(StyledIconButton)`\n  ${IconButtonContent} {\n    background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.primary_500)};\n\n    svg {\n      fill: ${(props) => props.iconColor || COLORS.white};\n      path {\n        fill: ${(props) => props.iconColor || COLORS.white};\n      }\n    }\n  }\n  &:hover:not(:disabled),\n  &.hover-state {\n    ${IconButtonContent} {\n      background-color: ${COLORS.primary_700};\n    }\n    ${IconButtonContent} svg path,\n    ${IconButtonContent} svg {\n      fill: ${COLORS.white};\n    }\n  }\n  &:active:not(:disabled),\n  &.active-state {\n    ${IconButtonContent} {\n      background: ${COLORS.primary_800};\n    }\n    ${IconButtonContent} svg path,\n    ${IconButtonContent} svg {\n      fill: ${COLORS.white};\n    }\n  }\n  &:disabled {\n    ${IconButtonContent} {\n      background-color: ${COLORS.neutral_200};\n    }\n    svg {\n      path {\n        fill: ${COLORS.white};\n      }\n      fill: ${COLORS.white};\n    }\n  }\n`;\n\nexport const StyledSecondaryIconButton = styled(StyledIconButton)`\n  ${IconButtonContent} {\n    background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n\n    svg {\n      fill: ${(props) => props.iconColor || COLORS.neutral_600};\n      path {\n        fill: ${(props) => props.iconColor || COLORS.neutral_600};\n      }\n    }\n  }\n\n  pointer-events: ${(props) => (props.shouldNotInteract ? 'none' : 'auto')};\n\n  &:hover:not(:disabled) {\n    ${IconButtonContent} {\n      background-color: ${COLORS.primary_20};\n    }\n    ${IconButtonContent} svg path,\n    ${IconButtonContent} svg {\n      fill: ${COLORS.primary_700};\n    }\n  }\n  &:active:not(:disabled),\n  &.active-state {\n    ${IconButtonContent} {\n      background: ${COLORS.primary_100};\n    }\n    ${IconButtonContent} svg path,\n    ${IconButtonContent} svg {\n      fill: ${COLORS.primary_800};\n    }\n  }\n\n  &:disabled {\n    ${IconButtonContent} {\n      background-color: ${(props) => (props.useTransparentBackground ? 'transparent' : COLORS.white)};\n    }\n    svg {\n      path {\n        fill: ${COLORS.neutral_300};\n      }\n      fill: ${COLORS.neutral_300};\n    }\n  }\n`;\n\nexport interface IconButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>,  'onClick' | 'onMouseDown'> {\n  variant?: 'primary' | 'secondary';\n  shape?: 'square' | 'circular';\n  action: (event?: React.MouseEvent<HTMLButtonElement>) => void;\n  hideOnLowWidth?: boolean;\n  flatEdge?: 'right' | 'left' | 'none' | undefined;\n  isInMobileMenu?: boolean;\n  useTransparentBackground?: boolean;\n  shouldNotInteract?: boolean;\n  iconColor?: string;\n  unsetIconSize?: boolean;\n  borderRadius?: number;\n  focusBackgroundColor?: string;\n  children?: React.ReactNode;\n  invertFocus?: boolean;\n}\n\nconst IconButton = React.forwardRef<HTMLButtonElement, IconButtonProps>(\n  (\n    {\n      id,\n      variant,\n      shape,\n      action,\n      hideOnLowWidth,\n      isInMobileMenu,\n      children,\n      useTransparentBackground,\n      shouldNotInteract,\n      disabled,\n      iconColor,\n      unsetIconSize,\n      tabIndex,\n      flatEdge,\n      borderRadius,\n      focusBackgroundColor,\n      type,\n      hidden,\n      invertFocus,\n      ...rest\n    }: IconButtonProps,\n    ref,\n  ) => {\n    // Let's render button\n    switch (variant) {\n      case 'secondary':\n        return (\n          <StyledSecondaryIconButton\n            id={id}\n            type={type ?? 'button'}\n            data-testid={id}\n            ref={ref}\n            onClick={(event: React.MouseEvent<HTMLButtonElement>) => {\n              event.stopPropagation();\n              action(event);\n            }}\n            disabled={disabled}\n            hideOnLowWidth={hideOnLowWidth || false}\n            inMobileMenu={isInMobileMenu}\n            useTransparentBackground={useTransparentBackground}\n            shouldNotInteract={shouldNotInteract}\n            iconColor={iconColor}\n            unsetIconSize={unsetIconSize}\n            tabIndex={tabIndex || 0}\n            borderRadius={borderRadius || shape === 'circular' ? 18 : 0}\n            onMouseDown={defaultOnMouseDownHandler}\n            hidden={hidden}\n            invertFocus={invertFocus}\n            focusBackgroundColor={focusBackgroundColor}\n            {...rest}>\n            <IconButtonContent>{children}</IconButtonContent>\n          </StyledSecondaryIconButton>\n        );\n      case 'primary':\n      default:\n        return (\n          <StyledPrimaryIconButton\n            id={id}\n            type={type ?? 'button'}\n            data-testid={id}\n            flatEdge={flatEdge}\n            ref={ref}\n            onClick={(event: React.MouseEvent<HTMLButtonElement>) => {\n              event.stopPropagation();\n              action(event);\n            }}\n            disabled={disabled}\n            hideOnLowWidth={hideOnLowWidth || false}\n            inMobileMenu={isInMobileMenu}\n            useTransparentBackground={useTransparentBackground}\n            iconColor={iconColor}\n            unsetIconSize={unsetIconSize}\n            tabIndex={tabIndex || 0}\n            borderRadius={borderRadius || shape === 'circular' ? 18 : 0}\n            onMouseDown={defaultOnMouseDownHandler}\n            hidden={hidden}\n            invertFocus={invertFocus}\n            focusBackgroundColor={focusBackgroundColor}\n            {...rest}>\n            <IconButtonContent>{children}</IconButtonContent>\n          </StyledPrimaryIconButton>\n        );\n    }\n  },\n);\n\nexport default IconButton;\n"],"file":"Iconbutton.js"}

package/dist/ChipsInput/ChipDropdownInput.cjs

@@ -364,6 +364,7 @@ var ChipDropdownInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         return setDropdownIsOpen(value);
       }
     }, rest)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.DropdownContent, {
+      containerRef: containerRef,
       customizationProps: {
         action: function action() {},
         pinTopItem: true,

package/dist/ChipsInput/ChipDropdownInput.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/ChipsInput/ChipDropdownInput.tsx"],"names":["Wrapper","styled","div","ChipInputContainer","Z_INDEXES","dropdown","ChipDropdownInput","React","forwardRef","ref","list","onInputChange","disableSorting","messageOnNoResults","values","inputId","variants","placeholder","validationMessage","onValueChange","suggestion","loading","maxSelectedItems","multiLine","size","Size","Medium","icon","disableFiltering","disabled","altPlaceholder","required","rest","useState","givenList","setGivenList","chips","setChips","value","setValue","restartFilter","setRestartFilter","filteredList","setFilteredList","dropdownIsOpen","setDropdownIsOpen","dropdownList","setDropdownList","dropdownValue","setDropdownValue","focused","setFocused","containerRef","inputRef","useRef","useImperativeHandle","current","useEffect","map","a","find","b","label","index","variant","States","Default","newList","e","options","filter","option","toUpperCase","indexOf","secondaryLabel","sort","push","o","length","handleClickOutside","contains","target","document","addEventListener","removeEventListener","x","displayLabel","noteLabel","SystemIcons","addChip","newChip","handleInputValueChange","handleValueUpdate","item","focus","handleInputKeyDown","event","key","stopPropagation","handleOnChipRemoved","newChips","splice","chip","action","pinTopItem","itemsType","scrollable","actionLabel","multiSelect","onValueUpdate","items"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\n\n/**\n * Import custom components.\n */\nimport {ChipInputContainer, ChipInputField} from './ChipInputField';\nimport {Size, States} from '../types';\nimport {DropdownContent, DropdownItem} from '../Dropdown';\nimport {SystemIcons} from '../icons';\nimport {ChipInputProps, ChipItem} from './ChipInputTypes';\nimport {useClickOutsideRef, useFocusOutsideRef} from '../common';\nimport {Z_INDEXES} from '../styles';\n\nconst Wrapper = styled.div`\n  position: relative;\n  display: inline-block;\n  width: 100%;\n\n  ${ChipInputContainer} {\n    position: relative;\n\n    &:focus, &.focus-visible-within {\n      z-index: ${Z_INDEXES.dropdown + 1} !important;\n    }\n  }\n`;\n\n\ninterface ListItem extends ChipItem {\n  secondaryLabel?: string;\n  value: string;\n}\n\ninterface ChipDropdownInputProps extends ChipInputProps {\n  list: ListItem[] | string[];\n  onInputChange?: (input: string) => void;\n  messageOnNoResults?: string;\n  suggestion?: ListItem;\n  loading?: boolean;\n  maxSelectedItems?: number;\n  disableSorting?: boolean;\n  disableFiltering?: boolean;\n}\n\nexport const ChipDropdownInput = React.forwardRef<HTMLInputElement | undefined, ChipDropdownInputProps>(({\n                                                                                               list,\n                                                                                               onInputChange,\n                                                                                               disableSorting,\n                                                                                               messageOnNoResults,\n                                                                                               values,\n                                                                                               inputId,\n                                                                                               variants,\n                                                                                               placeholder,\n                                                                                               validationMessage,\n                                                                                               onValueChange,\n                                                                                               suggestion,\n                                                                                               loading,\n                                                                                               maxSelectedItems,\n                                                                                               multiLine = true,\n                                                                                               size = Size.Medium,\n                                                                                               icon,\n                                                                                               disableFiltering,\n                                                                                               disabled,\n                                                                                               altPlaceholder,\n                                                                                               required,\n                                                                                               ...rest\n                                                                                             }: ChipDropdownInputProps, ref) => {\n  // Initiate states\n  const [givenList, setGivenList] = React.useState<ListItem[]>([]);\n  const [chips, setChips] = React.useState<ListItem[]>([]);\n\n  const [value, setValue] = React.useState<string>('');\n  const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n  const [filteredList, setFilteredList] = React.useState<ListItem[]>();\n\n  const [dropdownIsOpen, setDropdownIsOpen] = React.useState<boolean>(false);\n  const [dropdownList, setDropdownList] = React.useState<DropdownItem[]>([]);\n  const [dropdownValue, setDropdownValue] = React.useState<string>('');\n\n  const [focused, setFocused] = React.useState<number | null>(null);\n\n  const containerRef = useClickOutsideRef(() => setDropdownIsOpen(false), [], useFocusOutsideRef(() => setDropdownIsOpen(false)));\n  const inputRef = React.useRef<any>();\n\n  React.useImperativeHandle(ref, () => inputRef.current, [inputRef]);\n\n\n  /**\n   * Sets initial values for the chips.\n   */\n  React.useEffect(() => {\n\n    const list =\n      values.map((a) => chips.find(b => b.value === a) || givenList.find(b => b.value === a) || {\n        label: a,\n        value: a,\n        icon: icon\n      })\n        .map((a, index) => ({...a, variant: a.variant || (variants && variants[index]) || States.Default}))\n        .map((a, index) => ({...a, icon: a.icon || icon}));\n\n    setChips(list);\n  }, [values, variants, icon, givenList]);\n\n  /**\n   * Convert string[] to List[] if necessary\n   */\n  React.useEffect(() => {\n    if (typeof list[0] === 'string') {\n      const newList: ListItem[] = (list as string[]).map((e: string) => ({label: e, value: e}));\n      setGivenList(newList);\n    } else {\n      setGivenList(list as ListItem[]);\n    }\n  }, [list]);\n\n  /**\n   * filter and sort list if remoteOperations is false\n   * */\n  React.useEffect(() => {\n    let options = [...givenList];\n    if (!disableFiltering) {\n      if (!restartFilter && value !== '') {\n        options = options.filter((option) => option.label.toUpperCase().indexOf(value.toUpperCase()) !== -1 ||\n          (option.secondaryLabel && option.secondaryLabel?.toUpperCase().indexOf(value.toUpperCase()) !== -1));\n      }\n    }\n\n    if (!disableSorting) {\n      options = options.sort();\n    }\n\n    suggestion && options.push(suggestion);\n\n    options = options.filter((o) => !chips.find(a => a.value === o.value));\n    setFilteredList(options);\n  }, [value, givenList, chips, disableFiltering, disableSorting]);\n\n  /**\n   * if there is only one active item in dropdown mark it as focused\n   * */\n  React.useEffect(() => {\n    if (dropdownIsOpen && !!value && dropdownList?.filter(a => !a.disabled).length === 1) {\n      setDropdownValue(dropdownList.find(a => !a.disabled)!.value);\n    } else {\n      setDropdownValue('');\n    }\n  }, [dropdownList, dropdownIsOpen, value]);\n\n  const handleClickOutside = (e: any) => {\n    if (!containerRef.current?.contains(e.target)) {\n      if (dropdownIsOpen) {\n        setDropdownIsOpen(false);\n        if (!givenList.find((e) => e.value === value)) {\n          setValue('');\n        }\n      }\n    }\n  };\n\n  /**\n   * register click outside event listener\n   * */\n  React.useEffect(() => {\n    document.addEventListener('click', handleClickOutside);\n    return () => {\n      document.removeEventListener('click', handleClickOutside);\n    };\n  });\n\n  /**\n   * update dropdown items when filtered list changes\n   * */\n  React.useEffect(() => {\n    setDropdownList(filteredList?.map(x => ({\n      value: x.value,\n      displayLabel: x.label,\n      noteLabel: x.secondaryLabel,\n      icon: (x.icon ?? icon) && SystemIcons[(x.icon || icon)!]({}),\n      disabled: x.disabled,\n    })) ?? []);\n  }, [filteredList]);\n\n  const addChip = (newChip: ListItem) => {\n    const newList = [...chips, newChip];\n    // Let's add the chip\n    setChips(newList);\n    onValueChange(newList.map(a => a.value));\n\n    setValue('');\n  };\n\n  const handleInputValueChange = (value: string) => {\n    setValue(value);\n    setRestartFilter(false);\n    setDropdownIsOpen(true);\n    onInputChange && onInputChange(value);\n  }\n\n  /**\n   * Add chip from dropdown\n   * */\n  const handleValueUpdate = (values: string[]) => {\n    const item = filteredList?.find(a => a.value === values[0]);\n    item && addChip(item);\n    setRestartFilter(true);\n    inputRef?.current?.focus();\n  }\n\n  /**\n   * Adds a chip to the chip list.\n   * @param event - Event handler from the key down event.\n   */\n  const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n    // Let's trigger only on enter, comma and space key press\n    if ((event.key === 'Enter' || event.key === ' ') && value) {\n      if (dropdownList?.filter(a => !a.disabled).length === 1) {\n        handleValueUpdate([dropdownList!.find(a => !a.disabled)!.value]);\n        event.stopPropagation();\n      }\n    }\n\n    if ((event.key === 'ArrowDown' || event.key === 'Down' || event.key === 'ArrowUp' || event.key === 'Up') && !!dropdownList?.length) {\n      setDropdownIsOpen(true);\n    }\n  };\n\n  /**\n   * Removes a specific chip from the chip list.\n   * @param index - Index of the chip that needs to be removed.\n   */\n  const handleOnChipRemoved = (index: number): void => {\n    // Let's copy the chips\n    const newChips = [...chips];\n\n    // Let's delete the chip\n    // If necessary, let's replace it with a different chip\n    newChips.splice(index, 1);\n\n    // Let's update the chip list\n    setChips([...newChips]);\n    onValueChange(newChips.map((e) => e.value));\n  };\n\n  return (\n    <Wrapper ref={containerRef}>\n      <ChipInputField inputId={inputId}\n                      ref={inputRef}\n                      items={chips}\n                      required={required}\n                      inputValue={value}\n                      size={size}\n                      placeholder={placeholder}\n                      altPlaceholder={altPlaceholder}\n                      disabled={disabled}\n                      multiLine={multiLine}\n                      validationMessage={validationMessage}\n                      loading={loading}\n                      onRemoveItem={(chip, index) => handleOnChipRemoved(index)}\n                      onInputValueChange={handleInputValueChange}\n                      onInputKeyDown={handleInputKeyDown}\n                      onActivationChange={(value) => setDropdownIsOpen(value)}\n                      {...rest}/>\n      <DropdownContent\n        customizationProps={{\n          action: () => {\n          },\n          pinTopItem: true,\n\n          itemsType: 'normal',\n          scrollable: true,\n          actionLabel: '',\n          multiSelect: false,\n          onValueUpdate: handleValueUpdate,\n          items: dropdownList\n        }}\n        focused={focused}\n        setFocused={setFocused}\n        selectedValues={[dropdownValue]}\n        messageOnNoResults={messageOnNoResults ?? ''}\n        setSelectedValues={() => {\n        }}\n        isOpen={(!maxSelectedItems || (!!maxSelectedItems && chips.length < maxSelectedItems)) && dropdownIsOpen}\n        setIsOpen={setDropdownIsOpen}\n        filter={''}\n        isButton={false}\n        id={`${inputId}_dropdowncontent`}/>\n\n    </Wrapper>\n  );\n});\n"],"file":"ChipDropdownInput.cjs"}
+{"version":3,"sources":["../../src/ChipsInput/ChipDropdownInput.tsx"],"names":["Wrapper","styled","div","ChipInputContainer","Z_INDEXES","dropdown","ChipDropdownInput","React","forwardRef","ref","list","onInputChange","disableSorting","messageOnNoResults","values","inputId","variants","placeholder","validationMessage","onValueChange","suggestion","loading","maxSelectedItems","multiLine","size","Size","Medium","icon","disableFiltering","disabled","altPlaceholder","required","rest","useState","givenList","setGivenList","chips","setChips","value","setValue","restartFilter","setRestartFilter","filteredList","setFilteredList","dropdownIsOpen","setDropdownIsOpen","dropdownList","setDropdownList","dropdownValue","setDropdownValue","focused","setFocused","containerRef","inputRef","useRef","useImperativeHandle","current","useEffect","map","a","find","b","label","index","variant","States","Default","newList","e","options","filter","option","toUpperCase","indexOf","secondaryLabel","sort","push","o","length","handleClickOutside","contains","target","document","addEventListener","removeEventListener","x","displayLabel","noteLabel","SystemIcons","addChip","newChip","handleInputValueChange","handleValueUpdate","item","focus","handleInputKeyDown","event","key","stopPropagation","handleOnChipRemoved","newChips","splice","chip","action","pinTopItem","itemsType","scrollable","actionLabel","multiSelect","onValueUpdate","items"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\n\n/**\n * Import custom components.\n */\nimport {ChipInputContainer, ChipInputField} from './ChipInputField';\nimport {Size, States} from '../types';\nimport {DropdownContent, DropdownItem} from '../Dropdown';\nimport {SystemIcons} from '../icons';\nimport {ChipInputProps, ChipItem} from './ChipInputTypes';\nimport {useClickOutsideRef, useFocusOutsideRef} from '../common';\nimport {Z_INDEXES} from '../styles';\n\nconst Wrapper = styled.div`\n  position: relative;\n  display: inline-block;\n  width: 100%;\n\n  ${ChipInputContainer} {\n    position: relative;\n\n    &:focus, &.focus-visible-within {\n      z-index: ${Z_INDEXES.dropdown + 1} !important;\n    }\n  }\n`;\n\n\ninterface ListItem extends ChipItem {\n  secondaryLabel?: string;\n  value: string;\n}\n\ninterface ChipDropdownInputProps extends ChipInputProps {\n  list: ListItem[] | string[];\n  onInputChange?: (input: string) => void;\n  messageOnNoResults?: string;\n  suggestion?: ListItem;\n  loading?: boolean;\n  maxSelectedItems?: number;\n  disableSorting?: boolean;\n  disableFiltering?: boolean;\n}\n\nexport const ChipDropdownInput = React.forwardRef<HTMLInputElement | undefined, ChipDropdownInputProps>(({\n                                                                                               list,\n                                                                                               onInputChange,\n                                                                                               disableSorting,\n                                                                                               messageOnNoResults,\n                                                                                               values,\n                                                                                               inputId,\n                                                                                               variants,\n                                                                                               placeholder,\n                                                                                               validationMessage,\n                                                                                               onValueChange,\n                                                                                               suggestion,\n                                                                                               loading,\n                                                                                               maxSelectedItems,\n                                                                                               multiLine = true,\n                                                                                               size = Size.Medium,\n                                                                                               icon,\n                                                                                               disableFiltering,\n                                                                                               disabled,\n                                                                                               altPlaceholder,\n                                                                                               required,\n                                                                                               ...rest\n                                                                                             }: ChipDropdownInputProps, ref) => {\n  // Initiate states\n  const [givenList, setGivenList] = React.useState<ListItem[]>([]);\n  const [chips, setChips] = React.useState<ListItem[]>([]);\n\n  const [value, setValue] = React.useState<string>('');\n  const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n  const [filteredList, setFilteredList] = React.useState<ListItem[]>();\n\n  const [dropdownIsOpen, setDropdownIsOpen] = React.useState<boolean>(false);\n  const [dropdownList, setDropdownList] = React.useState<DropdownItem[]>([]);\n  const [dropdownValue, setDropdownValue] = React.useState<string>('');\n\n  const [focused, setFocused] = React.useState<number | null>(null);\n\n  const containerRef = useClickOutsideRef(() => setDropdownIsOpen(false), [], useFocusOutsideRef(() => setDropdownIsOpen(false)));\n  const inputRef = React.useRef<any>();\n\n  React.useImperativeHandle(ref, () => inputRef.current, [inputRef]);\n\n\n  /**\n   * Sets initial values for the chips.\n   */\n  React.useEffect(() => {\n\n    const list =\n      values.map((a) => chips.find(b => b.value === a) || givenList.find(b => b.value === a) || {\n        label: a,\n        value: a,\n        icon: icon\n      })\n        .map((a, index) => ({...a, variant: a.variant || (variants && variants[index]) || States.Default}))\n        .map((a, index) => ({...a, icon: a.icon || icon}));\n\n    setChips(list);\n  }, [values, variants, icon, givenList]);\n\n  /**\n   * Convert string[] to List[] if necessary\n   */\n  React.useEffect(() => {\n    if (typeof list[0] === 'string') {\n      const newList: ListItem[] = (list as string[]).map((e: string) => ({label: e, value: e}));\n      setGivenList(newList);\n    } else {\n      setGivenList(list as ListItem[]);\n    }\n  }, [list]);\n\n  /**\n   * filter and sort list if remoteOperations is false\n   * */\n  React.useEffect(() => {\n    let options = [...givenList];\n    if (!disableFiltering) {\n      if (!restartFilter && value !== '') {\n        options = options.filter((option) => option.label.toUpperCase().indexOf(value.toUpperCase()) !== -1 ||\n          (option.secondaryLabel && option.secondaryLabel?.toUpperCase().indexOf(value.toUpperCase()) !== -1));\n      }\n    }\n\n    if (!disableSorting) {\n      options = options.sort();\n    }\n\n    suggestion && options.push(suggestion);\n\n    options = options.filter((o) => !chips.find(a => a.value === o.value));\n    setFilteredList(options);\n  }, [value, givenList, chips, disableFiltering, disableSorting]);\n\n  /**\n   * if there is only one active item in dropdown mark it as focused\n   * */\n  React.useEffect(() => {\n    if (dropdownIsOpen && !!value && dropdownList?.filter(a => !a.disabled).length === 1) {\n      setDropdownValue(dropdownList.find(a => !a.disabled)!.value);\n    } else {\n      setDropdownValue('');\n    }\n  }, [dropdownList, dropdownIsOpen, value]);\n\n  const handleClickOutside = (e: any) => {\n    if (!containerRef.current?.contains(e.target)) {\n      if (dropdownIsOpen) {\n        setDropdownIsOpen(false);\n        if (!givenList.find((e) => e.value === value)) {\n          setValue('');\n        }\n      }\n    }\n  };\n\n  /**\n   * register click outside event listener\n   * */\n  React.useEffect(() => {\n    document.addEventListener('click', handleClickOutside);\n    return () => {\n      document.removeEventListener('click', handleClickOutside);\n    };\n  });\n\n  /**\n   * update dropdown items when filtered list changes\n   * */\n  React.useEffect(() => {\n    setDropdownList(filteredList?.map(x => ({\n      value: x.value,\n      displayLabel: x.label,\n      noteLabel: x.secondaryLabel,\n      icon: (x.icon ?? icon) && SystemIcons[(x.icon || icon)!]({}),\n      disabled: x.disabled,\n    })) ?? []);\n  }, [filteredList]);\n\n  const addChip = (newChip: ListItem) => {\n    const newList = [...chips, newChip];\n    // Let's add the chip\n    setChips(newList);\n    onValueChange(newList.map(a => a.value));\n\n    setValue('');\n  };\n\n  const handleInputValueChange = (value: string) => {\n    setValue(value);\n    setRestartFilter(false);\n    setDropdownIsOpen(true);\n    onInputChange && onInputChange(value);\n  }\n\n  /**\n   * Add chip from dropdown\n   * */\n  const handleValueUpdate = (values: string[]) => {\n    const item = filteredList?.find(a => a.value === values[0]);\n    item && addChip(item);\n    setRestartFilter(true);\n    inputRef?.current?.focus();\n  }\n\n  /**\n   * Adds a chip to the chip list.\n   * @param event - Event handler from the key down event.\n   */\n  const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n    // Let's trigger only on enter, comma and space key press\n    if ((event.key === 'Enter' || event.key === ' ') && value) {\n      if (dropdownList?.filter(a => !a.disabled).length === 1) {\n        handleValueUpdate([dropdownList!.find(a => !a.disabled)!.value]);\n        event.stopPropagation();\n      }\n    }\n\n    if ((event.key === 'ArrowDown' || event.key === 'Down' || event.key === 'ArrowUp' || event.key === 'Up') && !!dropdownList?.length) {\n      setDropdownIsOpen(true);\n    }\n  };\n\n  /**\n   * Removes a specific chip from the chip list.\n   * @param index - Index of the chip that needs to be removed.\n   */\n  const handleOnChipRemoved = (index: number): void => {\n    // Let's copy the chips\n    const newChips = [...chips];\n\n    // Let's delete the chip\n    // If necessary, let's replace it with a different chip\n    newChips.splice(index, 1);\n\n    // Let's update the chip list\n    setChips([...newChips]);\n    onValueChange(newChips.map((e) => e.value));\n  };\n\n  return (\n    <Wrapper ref={containerRef}>\n      <ChipInputField inputId={inputId}\n                      ref={inputRef}\n                      items={chips}\n                      required={required}\n                      inputValue={value}\n                      size={size}\n                      placeholder={placeholder}\n                      altPlaceholder={altPlaceholder}\n                      disabled={disabled}\n                      multiLine={multiLine}\n                      validationMessage={validationMessage}\n                      loading={loading}\n                      onRemoveItem={(chip, index) => handleOnChipRemoved(index)}\n                      onInputValueChange={handleInputValueChange}\n                      onInputKeyDown={handleInputKeyDown}\n                      onActivationChange={(value) => setDropdownIsOpen(value)}\n                      {...rest}/>\n      <DropdownContent\n        containerRef={containerRef}\n        customizationProps={{\n          action: () => {\n          },\n          pinTopItem: true,\n\n          itemsType: 'normal',\n          scrollable: true,\n          actionLabel: '',\n          multiSelect: false,\n          onValueUpdate: handleValueUpdate,\n          items: dropdownList\n        }}\n        focused={focused}\n        setFocused={setFocused}\n        selectedValues={[dropdownValue]}\n        messageOnNoResults={messageOnNoResults ?? ''}\n        setSelectedValues={() => {\n        }}\n        isOpen={(!maxSelectedItems || (!!maxSelectedItems && chips.length < maxSelectedItems)) && dropdownIsOpen}\n        setIsOpen={setDropdownIsOpen}\n        filter={''}\n        isButton={false}\n        id={`${inputId}_dropdowncontent`}/>\n\n    </Wrapper>\n  );\n});\n"],"file":"ChipDropdownInput.cjs"}

package/dist/ChipsInput/ChipDropdownInput.js

@@ -346,6 +346,7 @@ export var ChipDropdownInput = /*#__PURE__*/React.forwardRef(function (_ref, ref
         return setDropdownIsOpen(value);
       }
     }, rest)), /*#__PURE__*/_jsx(DropdownContent, {
+      containerRef: containerRef,
       customizationProps: {
         action: function action() {},
         pinTopItem: true,

package/dist/ChipsInput/ChipDropdownInput.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/ChipsInput/ChipDropdownInput.tsx"],"names":["React","styled","ChipInputContainer","ChipInputField","Size","States","DropdownContent","SystemIcons","useClickOutsideRef","useFocusOutsideRef","Z_INDEXES","Wrapper","div","dropdown","ChipDropdownInput","forwardRef","ref","list","onInputChange","disableSorting","messageOnNoResults","values","inputId","variants","placeholder","validationMessage","onValueChange","suggestion","loading","maxSelectedItems","multiLine","size","Medium","icon","disableFiltering","disabled","altPlaceholder","required","rest","useState","givenList","setGivenList","chips","setChips","value","setValue","restartFilter","setRestartFilter","filteredList","setFilteredList","dropdownIsOpen","setDropdownIsOpen","dropdownList","setDropdownList","dropdownValue","setDropdownValue","focused","setFocused","containerRef","inputRef","useRef","useImperativeHandle","current","useEffect","map","a","find","b","label","index","variant","Default","newList","e","options","filter","option","toUpperCase","indexOf","secondaryLabel","sort","push","o","length","handleClickOutside","contains","target","document","addEventListener","removeEventListener","x","displayLabel","noteLabel","addChip","newChip","handleInputValueChange","handleValueUpdate","item","focus","handleInputKeyDown","event","key","stopPropagation","handleOnChipRemoved","newChips","splice","chip","action","pinTopItem","itemsType","scrollable","actionLabel","multiSelect","onValueUpdate","items"],"mappings":";;;;;;;;;;;;;;AAAA;AACA;AACA;AACA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AAEA;AACA;AACA;;AACA,SAAQC,kBAAR,EAA4BC,cAA5B,QAAiD,kBAAjD;AACA,SAAQC,IAAR,EAAcC,MAAd,QAA2B,UAA3B;AACA,SAAQC,eAAR,QAA4C,aAA5C;AACA,SAAQC,WAAR,QAA0B,UAA1B;AAEA,SAAQC,kBAAR,EAA4BC,kBAA5B,QAAqD,WAArD;AACA,SAAQC,SAAR,QAAwB,WAAxB;;;AAEA,IAAMC,OAAO,GAAGV,MAAM,CAACW,GAAV,oQAKTV,kBALS,EASIQ,SAAS,CAACG,QAAV,GAAqB,CATzB,CAAb;AA+BA,OAAO,IAAMC,iBAAiB,gBAAGd,KAAK,CAACe,UAAN,CAAuE,gBAsBgBC,GAtBhB,EAsBwB;AAAA,MArBjCC,IAqBiC,QArBjCA,IAqBiC;AAAA,MApBjCC,aAoBiC,QApBjCA,aAoBiC;AAAA,MAnBjCC,cAmBiC,QAnBjCA,cAmBiC;AAAA,MAlBjCC,kBAkBiC,QAlBjCA,kBAkBiC;AAAA,MAjBjCC,MAiBiC,QAjBjCA,MAiBiC;AAAA,MAhBjCC,OAgBiC,QAhBjCA,OAgBiC;AAAA,MAfjCC,QAeiC,QAfjCA,QAeiC;AAAA,MAdjCC,WAciC,QAdjCA,WAciC;AAAA,MAbjCC,iBAaiC,QAbjCA,iBAaiC;AAAA,MAZjCC,aAYiC,QAZjCA,aAYiC;AAAA,MAXjCC,UAWiC,QAXjCA,UAWiC;AAAA,MAVjCC,OAUiC,QAVjCA,OAUiC;AAAA,MATjCC,gBASiC,QATjCA,gBASiC;AAAA,4BARjCC,SAQiC;AAAA,MARjCA,SAQiC,+BARrB,IAQqB;AAAA,uBAPjCC,IAOiC;AAAA,MAPjCA,IAOiC,0BAP1B3B,IAAI,CAAC4B,MAOqB;AAAA,MANjCC,IAMiC,QANjCA,IAMiC;AAAA,MALjCC,gBAKiC,QALjCA,gBAKiC;AAAA,MAJjCC,QAIiC,QAJjCA,QAIiC;AAAA,MAHjCC,cAGiC,QAHjCA,cAGiC;AAAA,MAFjCC,QAEiC,QAFjCA,QAEiC;AAAA,MAD9BC,IAC8B;;AAC9H;AACA,wBAAkCtC,KAAK,CAACuC,QAAN,CAA2B,EAA3B,CAAlC;AAAA;AAAA,MAAOC,SAAP;AAAA,MAAkBC,YAAlB;;AACA,yBAA0BzC,KAAK,CAACuC,QAAN,CAA2B,EAA3B,CAA1B;AAAA;AAAA,MAAOG,KAAP;AAAA,MAAcC,QAAd;;AAEA,yBAA0B3C,KAAK,CAACuC,QAAN,CAAuB,EAAvB,CAA1B;AAAA;AAAA,MAAOK,KAAP;AAAA,MAAcC,QAAd;;AACA,yBAA0C7C,KAAK,CAACuC,QAAN,CAAwB,KAAxB,CAA1C;AAAA;AAAA,MAAOO,aAAP;AAAA,MAAsBC,gBAAtB;;AACA,yBAAwC/C,KAAK,CAACuC,QAAN,EAAxC;AAAA;AAAA,MAAOS,YAAP;AAAA,MAAqBC,eAArB;;AAEA,0BAA4CjD,KAAK,CAACuC,QAAN,CAAwB,KAAxB,CAA5C;AAAA;AAAA,MAAOW,cAAP;AAAA,MAAuBC,iBAAvB;;AACA,0BAAwCnD,KAAK,CAACuC,QAAN,CAA+B,EAA/B,CAAxC;AAAA;AAAA,MAAOa,YAAP;AAAA,MAAqBC,eAArB;;AACA,0BAA0CrD,KAAK,CAACuC,QAAN,CAAuB,EAAvB,CAA1C;AAAA;AAAA,MAAOe,aAAP;AAAA,MAAsBC,gBAAtB;;AAEA,0BAA8BvD,KAAK,CAACuC,QAAN,CAA8B,IAA9B,CAA9B;AAAA;AAAA,MAAOiB,OAAP;AAAA,MAAgBC,UAAhB;;AAEA,MAAMC,YAAY,GAAGlD,kBAAkB,CAAC;AAAA,WAAM2C,iBAAiB,CAAC,KAAD,CAAvB;AAAA,GAAD,EAAiC,EAAjC,EAAqC1C,kBAAkB,CAAC;AAAA,WAAM0C,iBAAiB,CAAC,KAAD,CAAvB;AAAA,GAAD,CAAvD,CAAvC;AACA,MAAMQ,QAAQ,GAAG3D,KAAK,CAAC4D,MAAN,EAAjB;AAEA5D,EAAAA,KAAK,CAAC6D,mBAAN,CAA0B7C,GAA1B,EAA+B;AAAA,WAAM2C,QAAQ,CAACG,OAAf;AAAA,GAA/B,EAAuD,CAACH,QAAD,CAAvD;AAGA;AACF;AACA;;AACE3D,EAAAA,KAAK,CAAC+D,SAAN,CAAgB,YAAM;AAEpB,QAAM9C,IAAI,GACRI,MAAM,CAAC2C,GAAP,CAAW,UAACC,CAAD;AAAA,aAAOvB,KAAK,CAACwB,IAAN,CAAW,UAAAC,CAAC;AAAA,eAAIA,CAAC,CAACvB,KAAF,KAAYqB,CAAhB;AAAA,OAAZ,KAAkCzB,SAAS,CAAC0B,IAAV,CAAe,UAAAC,CAAC;AAAA,eAAIA,CAAC,CAACvB,KAAF,KAAYqB,CAAhB;AAAA,OAAhB,CAAlC,IAAwE;AACxFG,QAAAA,KAAK,EAAEH,CADiF;AAExFrB,QAAAA,KAAK,EAAEqB,CAFiF;AAGxFhC,QAAAA,IAAI,EAAEA;AAHkF,OAA/E;AAAA,KAAX,EAKG+B,GALH,CAKO,UAACC,CAAD,EAAII,KAAJ;AAAA,6CAAmBJ,CAAnB;AAAsBK,QAAAA,OAAO,EAAEL,CAAC,CAACK,OAAF,IAAc/C,QAAQ,IAAIA,QAAQ,CAAC8C,KAAD,CAAlC,IAA8ChE,MAAM,CAACkE;AAApF;AAAA,KALP,EAMGP,GANH,CAMO,UAACC,CAAD,EAAII,KAAJ;AAAA,6CAAmBJ,CAAnB;AAAsBhC,QAAAA,IAAI,EAAEgC,CAAC,CAAChC,IAAF,IAAUA;AAAtC;AAAA,KANP,CADF;AASAU,IAAAA,QAAQ,CAAC1B,IAAD,CAAR;AACD,GAZD,EAYG,CAACI,MAAD,EAASE,QAAT,EAAmBU,IAAnB,EAAyBO,SAAzB,CAZH;AAcA;AACF;AACA;;AACExC,EAAAA,KAAK,CAAC+D,SAAN,CAAgB,YAAM;AACpB,QAAI,OAAO9C,IAAI,CAAC,CAAD,CAAX,KAAmB,QAAvB,EAAiC;AAC/B,UAAMuD,OAAmB,GAAIvD,IAAD,CAAmB+C,GAAnB,CAAuB,UAACS,CAAD;AAAA,eAAgB;AAACL,UAAAA,KAAK,EAAEK,CAAR;AAAW7B,UAAAA,KAAK,EAAE6B;AAAlB,SAAhB;AAAA,OAAvB,CAA5B;AACAhC,MAAAA,YAAY,CAAC+B,OAAD,CAAZ;AACD,KAHD,MAGO;AACL/B,MAAAA,YAAY,CAACxB,IAAD,CAAZ;AACD;AACF,GAPD,EAOG,CAACA,IAAD,CAPH;AASA;AACF;AACA;;AACEjB,EAAAA,KAAK,CAAC+D,SAAN,CAAgB,YAAM;AACpB,QAAIW,OAAO,sBAAOlC,SAAP,CAAX;;AACA,QAAI,CAACN,gBAAL,EAAuB;AACrB,UAAI,CAACY,aAAD,IAAkBF,KAAK,KAAK,EAAhC,EAAoC;AAClC8B,QAAAA,OAAO,GAAGA,OAAO,CAACC,MAAR,CAAe,UAACC,MAAD;AAAA;;AAAA,iBAAYA,MAAM,CAACR,KAAP,CAAaS,WAAb,GAA2BC,OAA3B,CAAmClC,KAAK,CAACiC,WAAN,EAAnC,MAA4D,CAAC,CAA7D,IAClCD,MAAM,CAACG,cAAP,IAAyB,0BAAAH,MAAM,CAACG,cAAP,gFAAuBF,WAAvB,GAAqCC,OAArC,CAA6ClC,KAAK,CAACiC,WAAN,EAA7C,OAAsE,CAAC,CAD1E;AAAA,SAAf,CAAV;AAED;AACF;;AAED,QAAI,CAAC1D,cAAL,EAAqB;AACnBuD,MAAAA,OAAO,GAAGA,OAAO,CAACM,IAAR,EAAV;AACD;;AAEDrD,IAAAA,UAAU,IAAI+C,OAAO,CAACO,IAAR,CAAatD,UAAb,CAAd;AAEA+C,IAAAA,OAAO,GAAGA,OAAO,CAACC,MAAR,CAAe,UAACO,CAAD;AAAA,aAAO,CAACxC,KAAK,CAACwB,IAAN,CAAW,UAAAD,CAAC;AAAA,eAAIA,CAAC,CAACrB,KAAF,KAAYsC,CAAC,CAACtC,KAAlB;AAAA,OAAZ,CAAR;AAAA,KAAf,CAAV;AACAK,IAAAA,eAAe,CAACyB,OAAD,CAAf;AACD,GAjBD,EAiBG,CAAC9B,KAAD,EAAQJ,SAAR,EAAmBE,KAAnB,EAA0BR,gBAA1B,EAA4Cf,cAA5C,CAjBH;AAmBA;AACF;AACA;;AACEnB,EAAAA,KAAK,CAAC+D,SAAN,CAAgB,YAAM;AACpB,QAAIb,cAAc,IAAI,CAAC,CAACN,KAApB,IAA6B,CAAAQ,YAAY,SAAZ,IAAAA,YAAY,WAAZ,YAAAA,YAAY,CAAEuB,MAAd,CAAqB,UAAAV,CAAC;AAAA,aAAI,CAACA,CAAC,CAAC9B,QAAP;AAAA,KAAtB,EAAuCgD,MAAvC,MAAkD,CAAnF,EAAsF;AACpF5B,MAAAA,gBAAgB,CAACH,YAAY,CAACc,IAAb,CAAkB,UAAAD,CAAC;AAAA,eAAI,CAACA,CAAC,CAAC9B,QAAP;AAAA,OAAnB,EAAqCS,KAAtC,CAAhB;AACD,KAFD,MAEO;AACLW,MAAAA,gBAAgB,CAAC,EAAD,CAAhB;AACD;AACF,GAND,EAMG,CAACH,YAAD,EAAeF,cAAf,EAA+BN,KAA/B,CANH;;AAQA,MAAMwC,kBAAkB,GAAG,SAArBA,kBAAqB,CAACX,CAAD,EAAY;AAAA;;AACrC,QAAI,2BAACf,YAAY,CAACI,OAAd,kDAAC,sBAAsBuB,QAAtB,CAA+BZ,CAAC,CAACa,MAAjC,CAAD,CAAJ,EAA+C;AAC7C,UAAIpC,cAAJ,EAAoB;AAClBC,QAAAA,iBAAiB,CAAC,KAAD,CAAjB;;AACA,YAAI,CAACX,SAAS,CAAC0B,IAAV,CAAe,UAACO,CAAD;AAAA,iBAAOA,CAAC,CAAC7B,KAAF,KAAYA,KAAnB;AAAA,SAAf,CAAL,EAA+C;AAC7CC,UAAAA,QAAQ,CAAC,EAAD,CAAR;AACD;AACF;AACF;AACF,GATD;AAWA;AACF;AACA;;;AACE7C,EAAAA,KAAK,CAAC+D,SAAN,CAAgB,YAAM;AACpBwB,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,OAA1B,EAAmCJ,kBAAnC;AACA,WAAO,YAAM;AACXG,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,OAA7B,EAAsCL,kBAAtC;AACD,KAFD;AAGD,GALD;AAOA;AACF;AACA;;AACEpF,EAAAA,KAAK,CAAC+D,SAAN,CAAgB,YAAM;AAAA;;AACpBV,IAAAA,eAAe,sBAACL,YAAD,aAACA,YAAD,uBAACA,YAAY,CAAEgB,GAAd,CAAkB,UAAA0B,CAAC;AAAA;;AAAA,aAAK;AACtC9C,QAAAA,KAAK,EAAE8C,CAAC,CAAC9C,KAD6B;AAEtC+C,QAAAA,YAAY,EAAED,CAAC,CAACtB,KAFsB;AAGtCwB,QAAAA,SAAS,EAAEF,CAAC,CAACX,cAHyB;AAItC9C,QAAAA,IAAI,EAAE,YAACyD,CAAC,CAACzD,IAAH,6CAAWA,IAAX,KAAoB1B,WAAW,CAAEmF,CAAC,CAACzD,IAAF,IAAUA,IAAZ,CAAX,CAA+B,EAA/B,CAJY;AAKtCE,QAAAA,QAAQ,EAAEuD,CAAC,CAACvD;AAL0B,OAAL;AAAA,KAAnB,CAAD,iEAMR,EANQ,CAAf;AAOD,GARD,EAQG,CAACa,YAAD,CARH;;AAUA,MAAM6C,OAAO,GAAG,SAAVA,OAAU,CAACC,OAAD,EAAuB;AACrC,QAAMtB,OAAO,gCAAO9B,KAAP,IAAcoD,OAAd,EAAb,CADqC,CAErC;;AACAnD,IAAAA,QAAQ,CAAC6B,OAAD,CAAR;AACA9C,IAAAA,aAAa,CAAC8C,OAAO,CAACR,GAAR,CAAY,UAAAC,CAAC;AAAA,aAAIA,CAAC,CAACrB,KAAN;AAAA,KAAb,CAAD,CAAb;AAEAC,IAAAA,QAAQ,CAAC,EAAD,CAAR;AACD,GAPD;;AASA,MAAMkD,sBAAsB,GAAG,SAAzBA,sBAAyB,CAACnD,KAAD,EAAmB;AAChDC,IAAAA,QAAQ,CAACD,KAAD,CAAR;AACAG,IAAAA,gBAAgB,CAAC,KAAD,CAAhB;AACAI,IAAAA,iBAAiB,CAAC,IAAD,CAAjB;AACAjC,IAAAA,aAAa,IAAIA,aAAa,CAAC0B,KAAD,CAA9B;AACD,GALD;AAOA;AACF;AACA;;;AACE,MAAMoD,iBAAiB,GAAG,SAApBA,iBAAoB,CAAC3E,MAAD,EAAsB;AAAA;;AAC9C,QAAM4E,IAAI,GAAGjD,YAAH,aAAGA,YAAH,uBAAGA,YAAY,CAAEkB,IAAd,CAAmB,UAAAD,CAAC;AAAA,aAAIA,CAAC,CAACrB,KAAF,KAAYvB,MAAM,CAAC,CAAD,CAAtB;AAAA,KAApB,CAAb;AACA4E,IAAAA,IAAI,IAAIJ,OAAO,CAACI,IAAD,CAAf;AACAlD,IAAAA,gBAAgB,CAAC,IAAD,CAAhB;AACAY,IAAAA,QAAQ,SAAR,IAAAA,QAAQ,WAAR,iCAAAA,QAAQ,CAAEG,OAAV,wEAAmBoC,KAAnB;AACD,GALD;AAOA;AACF;AACA;AACA;;;AACE,MAAMC,kBAAkB,GAAG,SAArBA,kBAAqB,CAACC,KAAD,EAAwD;AACjF;AACA,QAAI,CAACA,KAAK,CAACC,GAAN,KAAc,OAAd,IAAyBD,KAAK,CAACC,GAAN,KAAc,GAAxC,KAAgDzD,KAApD,EAA2D;AACzD,UAAI,CAAAQ,YAAY,SAAZ,IAAAA,YAAY,WAAZ,YAAAA,YAAY,CAAEuB,MAAd,CAAqB,UAAAV,CAAC;AAAA,eAAI,CAACA,CAAC,CAAC9B,QAAP;AAAA,OAAtB,EAAuCgD,MAAvC,MAAkD,CAAtD,EAAyD;AACvDa,QAAAA,iBAAiB,CAAC,CAAC5C,YAAY,CAAEc,IAAd,CAAmB,UAAAD,CAAC;AAAA,iBAAI,CAACA,CAAC,CAAC9B,QAAP;AAAA,SAApB,EAAsCS,KAAvC,CAAD,CAAjB;AACAwD,QAAAA,KAAK,CAACE,eAAN;AACD;AACF;;AAED,QAAI,CAACF,KAAK,CAACC,GAAN,KAAc,WAAd,IAA6BD,KAAK,CAACC,GAAN,KAAc,MAA3C,IAAqDD,KAAK,CAACC,GAAN,KAAc,SAAnE,IAAgFD,KAAK,CAACC,GAAN,KAAc,IAA/F,KAAwG,CAAC,EAACjD,YAAD,aAACA,YAAD,eAACA,YAAY,CAAE+B,MAAf,CAA7G,EAAoI;AAClIhC,MAAAA,iBAAiB,CAAC,IAAD,CAAjB;AACD;AACF,GAZD;AAcA;AACF;AACA;AACA;;;AACE,MAAMoD,mBAAmB,GAAG,SAAtBA,mBAAsB,CAAClC,KAAD,EAAyB;AACnD;AACA,QAAMmC,QAAQ,sBAAO9D,KAAP,CAAd,CAFmD,CAInD;AACA;;;AACA8D,IAAAA,QAAQ,CAACC,MAAT,CAAgBpC,KAAhB,EAAuB,CAAvB,EANmD,CAQnD;;AACA1B,IAAAA,QAAQ,oBAAK6D,QAAL,EAAR;AACA9E,IAAAA,aAAa,CAAC8E,QAAQ,CAACxC,GAAT,CAAa,UAACS,CAAD;AAAA,aAAOA,CAAC,CAAC7B,KAAT;AAAA,KAAb,CAAD,CAAb;AACD,GAXD;;AAaA,sBACE,MAAC,OAAD;AAAS,IAAA,GAAG,EAAEc,YAAd;AAAA,4BACE,KAAC,cAAD;AAAgB,MAAA,OAAO,EAAEpC,OAAzB;AACgB,MAAA,GAAG,EAAEqC,QADrB;AAEgB,MAAA,KAAK,EAAEjB,KAFvB;AAGgB,MAAA,QAAQ,EAAEL,QAH1B;AAIgB,MAAA,UAAU,EAAEO,KAJ5B;AAKgB,MAAA,IAAI,EAAEb,IALtB;AAMgB,MAAA,WAAW,EAAEP,WAN7B;AAOgB,MAAA,cAAc,EAAEY,cAPhC;AAQgB,MAAA,QAAQ,EAAED,QAR1B;AASgB,MAAA,SAAS,EAAEL,SAT3B;AAUgB,MAAA,iBAAiB,EAAEL,iBAVnC;AAWgB,MAAA,OAAO,EAAEG,OAXzB;AAYgB,MAAA,YAAY,EAAE,sBAAC8E,IAAD,EAAOrC,KAAP;AAAA,eAAiBkC,mBAAmB,CAAClC,KAAD,CAApC;AAAA,OAZ9B;AAagB,MAAA,kBAAkB,EAAE0B,sBAbpC;AAcgB,MAAA,cAAc,EAAEI,kBAdhC;AAegB,MAAA,kBAAkB,EAAE,4BAACvD,KAAD;AAAA,eAAWO,iBAAiB,CAACP,KAAD,CAA5B;AAAA;AAfpC,OAgBoBN,IAhBpB,EADF,eAkBE,KAAC,eAAD;AACE,MAAA,kBAAkB,EAAE;AAClBqE,QAAAA,MAAM,EAAE,kBAAM,CACb,CAFiB;AAGlBC,QAAAA,UAAU,EAAE,IAHM;AAKlBC,QAAAA,SAAS,EAAE,QALO;AAMlBC,QAAAA,UAAU,EAAE,IANM;AAOlBC,QAAAA,WAAW,EAAE,EAPK;AAQlBC,QAAAA,WAAW,EAAE,KARK;AASlBC,QAAAA,aAAa,EAAEjB,iBATG;AAUlBkB,QAAAA,KAAK,EAAE9D;AAVW,OADtB;AAaE,MAAA,OAAO,EAAEI,OAbX;AAcE,MAAA,UAAU,EAAEC,UAdd;AAeE,MAAA,cAAc,EAAE,CAACH,aAAD,CAflB;AAgBE,MAAA,kBAAkB,EAAElC,kBAAF,aAAEA,kBAAF,cAAEA,kBAAF,GAAwB,EAhB5C;AAiBE,MAAA,iBAAiB,EAAE,6BAAM,CACxB,CAlBH;AAmBE,MAAA,MAAM,EAAE,CAAC,CAACS,gBAAD,IAAsB,CAAC,CAACA,gBAAF,IAAsBa,KAAK,CAACyC,MAAN,GAAetD,gBAA5D,KAAkFqB,cAnB5F;AAoBE,MAAA,SAAS,EAAEC,iBApBb;AAqBE,MAAA,MAAM,EAAE,EArBV;AAsBE,MAAA,QAAQ,EAAE,KAtBZ;AAuBE,MAAA,EAAE,YAAK7B,OAAL;AAvBJ,MAlBF;AAAA,IADF;AA8CD,CAtPgC,CAA1B;;AAVLL,EAAAA,I;AALA8D,IAAAA,c;AACAnC,IAAAA,K;;AAKA1B,EAAAA,a;AACAE,EAAAA,kB;AACAO,EAAAA,U;AARAoD,IAAAA,c;AACAnC,IAAAA,K;;AAQAhB,EAAAA,O;AACAC,EAAAA,gB;AACAV,EAAAA,c;AACAe,EAAAA,gB","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\n\n/**\n * Import custom components.\n */\nimport {ChipInputContainer, ChipInputField} from './ChipInputField';\nimport {Size, States} from '../types';\nimport {DropdownContent, DropdownItem} from '../Dropdown';\nimport {SystemIcons} from '../icons';\nimport {ChipInputProps, ChipItem} from './ChipInputTypes';\nimport {useClickOutsideRef, useFocusOutsideRef} from '../common';\nimport {Z_INDEXES} from '../styles';\n\nconst Wrapper = styled.div`\n  position: relative;\n  display: inline-block;\n  width: 100%;\n\n  ${ChipInputContainer} {\n    position: relative;\n\n    &:focus, &.focus-visible-within {\n      z-index: ${Z_INDEXES.dropdown + 1} !important;\n    }\n  }\n`;\n\n\ninterface ListItem extends ChipItem {\n  secondaryLabel?: string;\n  value: string;\n}\n\ninterface ChipDropdownInputProps extends ChipInputProps {\n  list: ListItem[] | string[];\n  onInputChange?: (input: string) => void;\n  messageOnNoResults?: string;\n  suggestion?: ListItem;\n  loading?: boolean;\n  maxSelectedItems?: number;\n  disableSorting?: boolean;\n  disableFiltering?: boolean;\n}\n\nexport const ChipDropdownInput = React.forwardRef<HTMLInputElement | undefined, ChipDropdownInputProps>(({\n                                                                                               list,\n                                                                                               onInputChange,\n                                                                                               disableSorting,\n                                                                                               messageOnNoResults,\n                                                                                               values,\n                                                                                               inputId,\n                                                                                               variants,\n                                                                                               placeholder,\n                                                                                               validationMessage,\n                                                                                               onValueChange,\n                                                                                               suggestion,\n                                                                                               loading,\n                                                                                               maxSelectedItems,\n                                                                                               multiLine = true,\n                                                                                               size = Size.Medium,\n                                                                                               icon,\n                                                                                               disableFiltering,\n                                                                                               disabled,\n                                                                                               altPlaceholder,\n                                                                                               required,\n                                                                                               ...rest\n                                                                                             }: ChipDropdownInputProps, ref) => {\n  // Initiate states\n  const [givenList, setGivenList] = React.useState<ListItem[]>([]);\n  const [chips, setChips] = React.useState<ListItem[]>([]);\n\n  const [value, setValue] = React.useState<string>('');\n  const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n  const [filteredList, setFilteredList] = React.useState<ListItem[]>();\n\n  const [dropdownIsOpen, setDropdownIsOpen] = React.useState<boolean>(false);\n  const [dropdownList, setDropdownList] = React.useState<DropdownItem[]>([]);\n  const [dropdownValue, setDropdownValue] = React.useState<string>('');\n\n  const [focused, setFocused] = React.useState<number | null>(null);\n\n  const containerRef = useClickOutsideRef(() => setDropdownIsOpen(false), [], useFocusOutsideRef(() => setDropdownIsOpen(false)));\n  const inputRef = React.useRef<any>();\n\n  React.useImperativeHandle(ref, () => inputRef.current, [inputRef]);\n\n\n  /**\n   * Sets initial values for the chips.\n   */\n  React.useEffect(() => {\n\n    const list =\n      values.map((a) => chips.find(b => b.value === a) || givenList.find(b => b.value === a) || {\n        label: a,\n        value: a,\n        icon: icon\n      })\n        .map((a, index) => ({...a, variant: a.variant || (variants && variants[index]) || States.Default}))\n        .map((a, index) => ({...a, icon: a.icon || icon}));\n\n    setChips(list);\n  }, [values, variants, icon, givenList]);\n\n  /**\n   * Convert string[] to List[] if necessary\n   */\n  React.useEffect(() => {\n    if (typeof list[0] === 'string') {\n      const newList: ListItem[] = (list as string[]).map((e: string) => ({label: e, value: e}));\n      setGivenList(newList);\n    } else {\n      setGivenList(list as ListItem[]);\n    }\n  }, [list]);\n\n  /**\n   * filter and sort list if remoteOperations is false\n   * */\n  React.useEffect(() => {\n    let options = [...givenList];\n    if (!disableFiltering) {\n      if (!restartFilter && value !== '') {\n        options = options.filter((option) => option.label.toUpperCase().indexOf(value.toUpperCase()) !== -1 ||\n          (option.secondaryLabel && option.secondaryLabel?.toUpperCase().indexOf(value.toUpperCase()) !== -1));\n      }\n    }\n\n    if (!disableSorting) {\n      options = options.sort();\n    }\n\n    suggestion && options.push(suggestion);\n\n    options = options.filter((o) => !chips.find(a => a.value === o.value));\n    setFilteredList(options);\n  }, [value, givenList, chips, disableFiltering, disableSorting]);\n\n  /**\n   * if there is only one active item in dropdown mark it as focused\n   * */\n  React.useEffect(() => {\n    if (dropdownIsOpen && !!value && dropdownList?.filter(a => !a.disabled).length === 1) {\n      setDropdownValue(dropdownList.find(a => !a.disabled)!.value);\n    } else {\n      setDropdownValue('');\n    }\n  }, [dropdownList, dropdownIsOpen, value]);\n\n  const handleClickOutside = (e: any) => {\n    if (!containerRef.current?.contains(e.target)) {\n      if (dropdownIsOpen) {\n        setDropdownIsOpen(false);\n        if (!givenList.find((e) => e.value === value)) {\n          setValue('');\n        }\n      }\n    }\n  };\n\n  /**\n   * register click outside event listener\n   * */\n  React.useEffect(() => {\n    document.addEventListener('click', handleClickOutside);\n    return () => {\n      document.removeEventListener('click', handleClickOutside);\n    };\n  });\n\n  /**\n   * update dropdown items when filtered list changes\n   * */\n  React.useEffect(() => {\n    setDropdownList(filteredList?.map(x => ({\n      value: x.value,\n      displayLabel: x.label,\n      noteLabel: x.secondaryLabel,\n      icon: (x.icon ?? icon) && SystemIcons[(x.icon || icon)!]({}),\n      disabled: x.disabled,\n    })) ?? []);\n  }, [filteredList]);\n\n  const addChip = (newChip: ListItem) => {\n    const newList = [...chips, newChip];\n    // Let's add the chip\n    setChips(newList);\n    onValueChange(newList.map(a => a.value));\n\n    setValue('');\n  };\n\n  const handleInputValueChange = (value: string) => {\n    setValue(value);\n    setRestartFilter(false);\n    setDropdownIsOpen(true);\n    onInputChange && onInputChange(value);\n  }\n\n  /**\n   * Add chip from dropdown\n   * */\n  const handleValueUpdate = (values: string[]) => {\n    const item = filteredList?.find(a => a.value === values[0]);\n    item && addChip(item);\n    setRestartFilter(true);\n    inputRef?.current?.focus();\n  }\n\n  /**\n   * Adds a chip to the chip list.\n   * @param event - Event handler from the key down event.\n   */\n  const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n    // Let's trigger only on enter, comma and space key press\n    if ((event.key === 'Enter' || event.key === ' ') && value) {\n      if (dropdownList?.filter(a => !a.disabled).length === 1) {\n        handleValueUpdate([dropdownList!.find(a => !a.disabled)!.value]);\n        event.stopPropagation();\n      }\n    }\n\n    if ((event.key === 'ArrowDown' || event.key === 'Down' || event.key === 'ArrowUp' || event.key === 'Up') && !!dropdownList?.length) {\n      setDropdownIsOpen(true);\n    }\n  };\n\n  /**\n   * Removes a specific chip from the chip list.\n   * @param index - Index of the chip that needs to be removed.\n   */\n  const handleOnChipRemoved = (index: number): void => {\n    // Let's copy the chips\n    const newChips = [...chips];\n\n    // Let's delete the chip\n    // If necessary, let's replace it with a different chip\n    newChips.splice(index, 1);\n\n    // Let's update the chip list\n    setChips([...newChips]);\n    onValueChange(newChips.map((e) => e.value));\n  };\n\n  return (\n    <Wrapper ref={containerRef}>\n      <ChipInputField inputId={inputId}\n                      ref={inputRef}\n                      items={chips}\n                      required={required}\n                      inputValue={value}\n                      size={size}\n                      placeholder={placeholder}\n                      altPlaceholder={altPlaceholder}\n                      disabled={disabled}\n                      multiLine={multiLine}\n                      validationMessage={validationMessage}\n                      loading={loading}\n                      onRemoveItem={(chip, index) => handleOnChipRemoved(index)}\n                      onInputValueChange={handleInputValueChange}\n                      onInputKeyDown={handleInputKeyDown}\n                      onActivationChange={(value) => setDropdownIsOpen(value)}\n                      {...rest}/>\n      <DropdownContent\n        customizationProps={{\n          action: () => {\n          },\n          pinTopItem: true,\n\n          itemsType: 'normal',\n          scrollable: true,\n          actionLabel: '',\n          multiSelect: false,\n          onValueUpdate: handleValueUpdate,\n          items: dropdownList\n        }}\n        focused={focused}\n        setFocused={setFocused}\n        selectedValues={[dropdownValue]}\n        messageOnNoResults={messageOnNoResults ?? ''}\n        setSelectedValues={() => {\n        }}\n        isOpen={(!maxSelectedItems || (!!maxSelectedItems && chips.length < maxSelectedItems)) && dropdownIsOpen}\n        setIsOpen={setDropdownIsOpen}\n        filter={''}\n        isButton={false}\n        id={`${inputId}_dropdowncontent`}/>\n\n    </Wrapper>\n  );\n});\n"],"file":"ChipDropdownInput.js"}
+{"version":3,"sources":["../../src/ChipsInput/ChipDropdownInput.tsx"],"names":["React","styled","ChipInputContainer","ChipInputField","Size","States","DropdownContent","SystemIcons","useClickOutsideRef","useFocusOutsideRef","Z_INDEXES","Wrapper","div","dropdown","ChipDropdownInput","forwardRef","ref","list","onInputChange","disableSorting","messageOnNoResults","values","inputId","variants","placeholder","validationMessage","onValueChange","suggestion","loading","maxSelectedItems","multiLine","size","Medium","icon","disableFiltering","disabled","altPlaceholder","required","rest","useState","givenList","setGivenList","chips","setChips","value","setValue","restartFilter","setRestartFilter","filteredList","setFilteredList","dropdownIsOpen","setDropdownIsOpen","dropdownList","setDropdownList","dropdownValue","setDropdownValue","focused","setFocused","containerRef","inputRef","useRef","useImperativeHandle","current","useEffect","map","a","find","b","label","index","variant","Default","newList","e","options","filter","option","toUpperCase","indexOf","secondaryLabel","sort","push","o","length","handleClickOutside","contains","target","document","addEventListener","removeEventListener","x","displayLabel","noteLabel","addChip","newChip","handleInputValueChange","handleValueUpdate","item","focus","handleInputKeyDown","event","key","stopPropagation","handleOnChipRemoved","newChips","splice","chip","action","pinTopItem","itemsType","scrollable","actionLabel","multiSelect","onValueUpdate","items"],"mappings":";;;;;;;;;;;;;;AAAA;AACA;AACA;AACA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AAEA;AACA;AACA;;AACA,SAAQC,kBAAR,EAA4BC,cAA5B,QAAiD,kBAAjD;AACA,SAAQC,IAAR,EAAcC,MAAd,QAA2B,UAA3B;AACA,SAAQC,eAAR,QAA4C,aAA5C;AACA,SAAQC,WAAR,QAA0B,UAA1B;AAEA,SAAQC,kBAAR,EAA4BC,kBAA5B,QAAqD,WAArD;AACA,SAAQC,SAAR,QAAwB,WAAxB;;;AAEA,IAAMC,OAAO,GAAGV,MAAM,CAACW,GAAV,oQAKTV,kBALS,EASIQ,SAAS,CAACG,QAAV,GAAqB,CATzB,CAAb;AA+BA,OAAO,IAAMC,iBAAiB,gBAAGd,KAAK,CAACe,UAAN,CAAuE,gBAsBgBC,GAtBhB,EAsBwB;AAAA,MArBjCC,IAqBiC,QArBjCA,IAqBiC;AAAA,MApBjCC,aAoBiC,QApBjCA,aAoBiC;AAAA,MAnBjCC,cAmBiC,QAnBjCA,cAmBiC;AAAA,MAlBjCC,kBAkBiC,QAlBjCA,kBAkBiC;AAAA,MAjBjCC,MAiBiC,QAjBjCA,MAiBiC;AAAA,MAhBjCC,OAgBiC,QAhBjCA,OAgBiC;AAAA,MAfjCC,QAeiC,QAfjCA,QAeiC;AAAA,MAdjCC,WAciC,QAdjCA,WAciC;AAAA,MAbjCC,iBAaiC,QAbjCA,iBAaiC;AAAA,MAZjCC,aAYiC,QAZjCA,aAYiC;AAAA,MAXjCC,UAWiC,QAXjCA,UAWiC;AAAA,MAVjCC,OAUiC,QAVjCA,OAUiC;AAAA,MATjCC,gBASiC,QATjCA,gBASiC;AAAA,4BARjCC,SAQiC;AAAA,MARjCA,SAQiC,+BARrB,IAQqB;AAAA,uBAPjCC,IAOiC;AAAA,MAPjCA,IAOiC,0BAP1B3B,IAAI,CAAC4B,MAOqB;AAAA,MANjCC,IAMiC,QANjCA,IAMiC;AAAA,MALjCC,gBAKiC,QALjCA,gBAKiC;AAAA,MAJjCC,QAIiC,QAJjCA,QAIiC;AAAA,MAHjCC,cAGiC,QAHjCA,cAGiC;AAAA,MAFjCC,QAEiC,QAFjCA,QAEiC;AAAA,MAD9BC,IAC8B;;AAC9H;AACA,wBAAkCtC,KAAK,CAACuC,QAAN,CAA2B,EAA3B,CAAlC;AAAA;AAAA,MAAOC,SAAP;AAAA,MAAkBC,YAAlB;;AACA,yBAA0BzC,KAAK,CAACuC,QAAN,CAA2B,EAA3B,CAA1B;AAAA;AAAA,MAAOG,KAAP;AAAA,MAAcC,QAAd;;AAEA,yBAA0B3C,KAAK,CAACuC,QAAN,CAAuB,EAAvB,CAA1B;AAAA;AAAA,MAAOK,KAAP;AAAA,MAAcC,QAAd;;AACA,yBAA0C7C,KAAK,CAACuC,QAAN,CAAwB,KAAxB,CAA1C;AAAA;AAAA,MAAOO,aAAP;AAAA,MAAsBC,gBAAtB;;AACA,yBAAwC/C,KAAK,CAACuC,QAAN,EAAxC;AAAA;AAAA,MAAOS,YAAP;AAAA,MAAqBC,eAArB;;AAEA,0BAA4CjD,KAAK,CAACuC,QAAN,CAAwB,KAAxB,CAA5C;AAAA;AAAA,MAAOW,cAAP;AAAA,MAAuBC,iBAAvB;;AACA,0BAAwCnD,KAAK,CAACuC,QAAN,CAA+B,EAA/B,CAAxC;AAAA;AAAA,MAAOa,YAAP;AAAA,MAAqBC,eAArB;;AACA,0BAA0CrD,KAAK,CAACuC,QAAN,CAAuB,EAAvB,CAA1C;AAAA;AAAA,MAAOe,aAAP;AAAA,MAAsBC,gBAAtB;;AAEA,0BAA8BvD,KAAK,CAACuC,QAAN,CAA8B,IAA9B,CAA9B;AAAA;AAAA,MAAOiB,OAAP;AAAA,MAAgBC,UAAhB;;AAEA,MAAMC,YAAY,GAAGlD,kBAAkB,CAAC;AAAA,WAAM2C,iBAAiB,CAAC,KAAD,CAAvB;AAAA,GAAD,EAAiC,EAAjC,EAAqC1C,kBAAkB,CAAC;AAAA,WAAM0C,iBAAiB,CAAC,KAAD,CAAvB;AAAA,GAAD,CAAvD,CAAvC;AACA,MAAMQ,QAAQ,GAAG3D,KAAK,CAAC4D,MAAN,EAAjB;AAEA5D,EAAAA,KAAK,CAAC6D,mBAAN,CAA0B7C,GAA1B,EAA+B;AAAA,WAAM2C,QAAQ,CAACG,OAAf;AAAA,GAA/B,EAAuD,CAACH,QAAD,CAAvD;AAGA;AACF;AACA;;AACE3D,EAAAA,KAAK,CAAC+D,SAAN,CAAgB,YAAM;AAEpB,QAAM9C,IAAI,GACRI,MAAM,CAAC2C,GAAP,CAAW,UAACC,CAAD;AAAA,aAAOvB,KAAK,CAACwB,IAAN,CAAW,UAAAC,CAAC;AAAA,eAAIA,CAAC,CAACvB,KAAF,KAAYqB,CAAhB;AAAA,OAAZ,KAAkCzB,SAAS,CAAC0B,IAAV,CAAe,UAAAC,CAAC;AAAA,eAAIA,CAAC,CAACvB,KAAF,KAAYqB,CAAhB;AAAA,OAAhB,CAAlC,IAAwE;AACxFG,QAAAA,KAAK,EAAEH,CADiF;AAExFrB,QAAAA,KAAK,EAAEqB,CAFiF;AAGxFhC,QAAAA,IAAI,EAAEA;AAHkF,OAA/E;AAAA,KAAX,EAKG+B,GALH,CAKO,UAACC,CAAD,EAAII,KAAJ;AAAA,6CAAmBJ,CAAnB;AAAsBK,QAAAA,OAAO,EAAEL,CAAC,CAACK,OAAF,IAAc/C,QAAQ,IAAIA,QAAQ,CAAC8C,KAAD,CAAlC,IAA8ChE,MAAM,CAACkE;AAApF;AAAA,KALP,EAMGP,GANH,CAMO,UAACC,CAAD,EAAII,KAAJ;AAAA,6CAAmBJ,CAAnB;AAAsBhC,QAAAA,IAAI,EAAEgC,CAAC,CAAChC,IAAF,IAAUA;AAAtC;AAAA,KANP,CADF;AASAU,IAAAA,QAAQ,CAAC1B,IAAD,CAAR;AACD,GAZD,EAYG,CAACI,MAAD,EAASE,QAAT,EAAmBU,IAAnB,EAAyBO,SAAzB,CAZH;AAcA;AACF;AACA;;AACExC,EAAAA,KAAK,CAAC+D,SAAN,CAAgB,YAAM;AACpB,QAAI,OAAO9C,IAAI,CAAC,CAAD,CAAX,KAAmB,QAAvB,EAAiC;AAC/B,UAAMuD,OAAmB,GAAIvD,IAAD,CAAmB+C,GAAnB,CAAuB,UAACS,CAAD;AAAA,eAAgB;AAACL,UAAAA,KAAK,EAAEK,CAAR;AAAW7B,UAAAA,KAAK,EAAE6B;AAAlB,SAAhB;AAAA,OAAvB,CAA5B;AACAhC,MAAAA,YAAY,CAAC+B,OAAD,CAAZ;AACD,KAHD,MAGO;AACL/B,MAAAA,YAAY,CAACxB,IAAD,CAAZ;AACD;AACF,GAPD,EAOG,CAACA,IAAD,CAPH;AASA;AACF;AACA;;AACEjB,EAAAA,KAAK,CAAC+D,SAAN,CAAgB,YAAM;AACpB,QAAIW,OAAO,sBAAOlC,SAAP,CAAX;;AACA,QAAI,CAACN,gBAAL,EAAuB;AACrB,UAAI,CAACY,aAAD,IAAkBF,KAAK,KAAK,EAAhC,EAAoC;AAClC8B,QAAAA,OAAO,GAAGA,OAAO,CAACC,MAAR,CAAe,UAACC,MAAD;AAAA;;AAAA,iBAAYA,MAAM,CAACR,KAAP,CAAaS,WAAb,GAA2BC,OAA3B,CAAmClC,KAAK,CAACiC,WAAN,EAAnC,MAA4D,CAAC,CAA7D,IAClCD,MAAM,CAACG,cAAP,IAAyB,0BAAAH,MAAM,CAACG,cAAP,gFAAuBF,WAAvB,GAAqCC,OAArC,CAA6ClC,KAAK,CAACiC,WAAN,EAA7C,OAAsE,CAAC,CAD1E;AAAA,SAAf,CAAV;AAED;AACF;;AAED,QAAI,CAAC1D,cAAL,EAAqB;AACnBuD,MAAAA,OAAO,GAAGA,OAAO,CAACM,IAAR,EAAV;AACD;;AAEDrD,IAAAA,UAAU,IAAI+C,OAAO,CAACO,IAAR,CAAatD,UAAb,CAAd;AAEA+C,IAAAA,OAAO,GAAGA,OAAO,CAACC,MAAR,CAAe,UAACO,CAAD;AAAA,aAAO,CAACxC,KAAK,CAACwB,IAAN,CAAW,UAAAD,CAAC;AAAA,eAAIA,CAAC,CAACrB,KAAF,KAAYsC,CAAC,CAACtC,KAAlB;AAAA,OAAZ,CAAR;AAAA,KAAf,CAAV;AACAK,IAAAA,eAAe,CAACyB,OAAD,CAAf;AACD,GAjBD,EAiBG,CAAC9B,KAAD,EAAQJ,SAAR,EAAmBE,KAAnB,EAA0BR,gBAA1B,EAA4Cf,cAA5C,CAjBH;AAmBA;AACF;AACA;;AACEnB,EAAAA,KAAK,CAAC+D,SAAN,CAAgB,YAAM;AACpB,QAAIb,cAAc,IAAI,CAAC,CAACN,KAApB,IAA6B,CAAAQ,YAAY,SAAZ,IAAAA,YAAY,WAAZ,YAAAA,YAAY,CAAEuB,MAAd,CAAqB,UAAAV,CAAC;AAAA,aAAI,CAACA,CAAC,CAAC9B,QAAP;AAAA,KAAtB,EAAuCgD,MAAvC,MAAkD,CAAnF,EAAsF;AACpF5B,MAAAA,gBAAgB,CAACH,YAAY,CAACc,IAAb,CAAkB,UAAAD,CAAC;AAAA,eAAI,CAACA,CAAC,CAAC9B,QAAP;AAAA,OAAnB,EAAqCS,KAAtC,CAAhB;AACD,KAFD,MAEO;AACLW,MAAAA,gBAAgB,CAAC,EAAD,CAAhB;AACD;AACF,GAND,EAMG,CAACH,YAAD,EAAeF,cAAf,EAA+BN,KAA/B,CANH;;AAQA,MAAMwC,kBAAkB,GAAG,SAArBA,kBAAqB,CAACX,CAAD,EAAY;AAAA;;AACrC,QAAI,2BAACf,YAAY,CAACI,OAAd,kDAAC,sBAAsBuB,QAAtB,CAA+BZ,CAAC,CAACa,MAAjC,CAAD,CAAJ,EAA+C;AAC7C,UAAIpC,cAAJ,EAAoB;AAClBC,QAAAA,iBAAiB,CAAC,KAAD,CAAjB;;AACA,YAAI,CAACX,SAAS,CAAC0B,IAAV,CAAe,UAACO,CAAD;AAAA,iBAAOA,CAAC,CAAC7B,KAAF,KAAYA,KAAnB;AAAA,SAAf,CAAL,EAA+C;AAC7CC,UAAAA,QAAQ,CAAC,EAAD,CAAR;AACD;AACF;AACF;AACF,GATD;AAWA;AACF;AACA;;;AACE7C,EAAAA,KAAK,CAAC+D,SAAN,CAAgB,YAAM;AACpBwB,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,OAA1B,EAAmCJ,kBAAnC;AACA,WAAO,YAAM;AACXG,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,OAA7B,EAAsCL,kBAAtC;AACD,KAFD;AAGD,GALD;AAOA;AACF;AACA;;AACEpF,EAAAA,KAAK,CAAC+D,SAAN,CAAgB,YAAM;AAAA;;AACpBV,IAAAA,eAAe,sBAACL,YAAD,aAACA,YAAD,uBAACA,YAAY,CAAEgB,GAAd,CAAkB,UAAA0B,CAAC;AAAA;;AAAA,aAAK;AACtC9C,QAAAA,KAAK,EAAE8C,CAAC,CAAC9C,KAD6B;AAEtC+C,QAAAA,YAAY,EAAED,CAAC,CAACtB,KAFsB;AAGtCwB,QAAAA,SAAS,EAAEF,CAAC,CAACX,cAHyB;AAItC9C,QAAAA,IAAI,EAAE,YAACyD,CAAC,CAACzD,IAAH,6CAAWA,IAAX,KAAoB1B,WAAW,CAAEmF,CAAC,CAACzD,IAAF,IAAUA,IAAZ,CAAX,CAA+B,EAA/B,CAJY;AAKtCE,QAAAA,QAAQ,EAAEuD,CAAC,CAACvD;AAL0B,OAAL;AAAA,KAAnB,CAAD,iEAMR,EANQ,CAAf;AAOD,GARD,EAQG,CAACa,YAAD,CARH;;AAUA,MAAM6C,OAAO,GAAG,SAAVA,OAAU,CAACC,OAAD,EAAuB;AACrC,QAAMtB,OAAO,gCAAO9B,KAAP,IAAcoD,OAAd,EAAb,CADqC,CAErC;;AACAnD,IAAAA,QAAQ,CAAC6B,OAAD,CAAR;AACA9C,IAAAA,aAAa,CAAC8C,OAAO,CAACR,GAAR,CAAY,UAAAC,CAAC;AAAA,aAAIA,CAAC,CAACrB,KAAN;AAAA,KAAb,CAAD,CAAb;AAEAC,IAAAA,QAAQ,CAAC,EAAD,CAAR;AACD,GAPD;;AASA,MAAMkD,sBAAsB,GAAG,SAAzBA,sBAAyB,CAACnD,KAAD,EAAmB;AAChDC,IAAAA,QAAQ,CAACD,KAAD,CAAR;AACAG,IAAAA,gBAAgB,CAAC,KAAD,CAAhB;AACAI,IAAAA,iBAAiB,CAAC,IAAD,CAAjB;AACAjC,IAAAA,aAAa,IAAIA,aAAa,CAAC0B,KAAD,CAA9B;AACD,GALD;AAOA;AACF;AACA;;;AACE,MAAMoD,iBAAiB,GAAG,SAApBA,iBAAoB,CAAC3E,MAAD,EAAsB;AAAA;;AAC9C,QAAM4E,IAAI,GAAGjD,YAAH,aAAGA,YAAH,uBAAGA,YAAY,CAAEkB,IAAd,CAAmB,UAAAD,CAAC;AAAA,aAAIA,CAAC,CAACrB,KAAF,KAAYvB,MAAM,CAAC,CAAD,CAAtB;AAAA,KAApB,CAAb;AACA4E,IAAAA,IAAI,IAAIJ,OAAO,CAACI,IAAD,CAAf;AACAlD,IAAAA,gBAAgB,CAAC,IAAD,CAAhB;AACAY,IAAAA,QAAQ,SAAR,IAAAA,QAAQ,WAAR,iCAAAA,QAAQ,CAAEG,OAAV,wEAAmBoC,KAAnB;AACD,GALD;AAOA;AACF;AACA;AACA;;;AACE,MAAMC,kBAAkB,GAAG,SAArBA,kBAAqB,CAACC,KAAD,EAAwD;AACjF;AACA,QAAI,CAACA,KAAK,CAACC,GAAN,KAAc,OAAd,IAAyBD,KAAK,CAACC,GAAN,KAAc,GAAxC,KAAgDzD,KAApD,EAA2D;AACzD,UAAI,CAAAQ,YAAY,SAAZ,IAAAA,YAAY,WAAZ,YAAAA,YAAY,CAAEuB,MAAd,CAAqB,UAAAV,CAAC;AAAA,eAAI,CAACA,CAAC,CAAC9B,QAAP;AAAA,OAAtB,EAAuCgD,MAAvC,MAAkD,CAAtD,EAAyD;AACvDa,QAAAA,iBAAiB,CAAC,CAAC5C,YAAY,CAAEc,IAAd,CAAmB,UAAAD,CAAC;AAAA,iBAAI,CAACA,CAAC,CAAC9B,QAAP;AAAA,SAApB,EAAsCS,KAAvC,CAAD,CAAjB;AACAwD,QAAAA,KAAK,CAACE,eAAN;AACD;AACF;;AAED,QAAI,CAACF,KAAK,CAACC,GAAN,KAAc,WAAd,IAA6BD,KAAK,CAACC,GAAN,KAAc,MAA3C,IAAqDD,KAAK,CAACC,GAAN,KAAc,SAAnE,IAAgFD,KAAK,CAACC,GAAN,KAAc,IAA/F,KAAwG,CAAC,EAACjD,YAAD,aAACA,YAAD,eAACA,YAAY,CAAE+B,MAAf,CAA7G,EAAoI;AAClIhC,MAAAA,iBAAiB,CAAC,IAAD,CAAjB;AACD;AACF,GAZD;AAcA;AACF;AACA;AACA;;;AACE,MAAMoD,mBAAmB,GAAG,SAAtBA,mBAAsB,CAAClC,KAAD,EAAyB;AACnD;AACA,QAAMmC,QAAQ,sBAAO9D,KAAP,CAAd,CAFmD,CAInD;AACA;;;AACA8D,IAAAA,QAAQ,CAACC,MAAT,CAAgBpC,KAAhB,EAAuB,CAAvB,EANmD,CAQnD;;AACA1B,IAAAA,QAAQ,oBAAK6D,QAAL,EAAR;AACA9E,IAAAA,aAAa,CAAC8E,QAAQ,CAACxC,GAAT,CAAa,UAACS,CAAD;AAAA,aAAOA,CAAC,CAAC7B,KAAT;AAAA,KAAb,CAAD,CAAb;AACD,GAXD;;AAaA,sBACE,MAAC,OAAD;AAAS,IAAA,GAAG,EAAEc,YAAd;AAAA,4BACE,KAAC,cAAD;AAAgB,MAAA,OAAO,EAAEpC,OAAzB;AACgB,MAAA,GAAG,EAAEqC,QADrB;AAEgB,MAAA,KAAK,EAAEjB,KAFvB;AAGgB,MAAA,QAAQ,EAAEL,QAH1B;AAIgB,MAAA,UAAU,EAAEO,KAJ5B;AAKgB,MAAA,IAAI,EAAEb,IALtB;AAMgB,MAAA,WAAW,EAAEP,WAN7B;AAOgB,MAAA,cAAc,EAAEY,cAPhC;AAQgB,MAAA,QAAQ,EAAED,QAR1B;AASgB,MAAA,SAAS,EAAEL,SAT3B;AAUgB,MAAA,iBAAiB,EAAEL,iBAVnC;AAWgB,MAAA,OAAO,EAAEG,OAXzB;AAYgB,MAAA,YAAY,EAAE,sBAAC8E,IAAD,EAAOrC,KAAP;AAAA,eAAiBkC,mBAAmB,CAAClC,KAAD,CAApC;AAAA,OAZ9B;AAagB,MAAA,kBAAkB,EAAE0B,sBAbpC;AAcgB,MAAA,cAAc,EAAEI,kBAdhC;AAegB,MAAA,kBAAkB,EAAE,4BAACvD,KAAD;AAAA,eAAWO,iBAAiB,CAACP,KAAD,CAA5B;AAAA;AAfpC,OAgBoBN,IAhBpB,EADF,eAkBE,KAAC,eAAD;AACE,MAAA,YAAY,EAAEoB,YADhB;AAEE,MAAA,kBAAkB,EAAE;AAClBiD,QAAAA,MAAM,EAAE,kBAAM,CACb,CAFiB;AAGlBC,QAAAA,UAAU,EAAE,IAHM;AAKlBC,QAAAA,SAAS,EAAE,QALO;AAMlBC,QAAAA,UAAU,EAAE,IANM;AAOlBC,QAAAA,WAAW,EAAE,EAPK;AAQlBC,QAAAA,WAAW,EAAE,KARK;AASlBC,QAAAA,aAAa,EAAEjB,iBATG;AAUlBkB,QAAAA,KAAK,EAAE9D;AAVW,OAFtB;AAcE,MAAA,OAAO,EAAEI,OAdX;AAeE,MAAA,UAAU,EAAEC,UAfd;AAgBE,MAAA,cAAc,EAAE,CAACH,aAAD,CAhBlB;AAiBE,MAAA,kBAAkB,EAAElC,kBAAF,aAAEA,kBAAF,cAAEA,kBAAF,GAAwB,EAjB5C;AAkBE,MAAA,iBAAiB,EAAE,6BAAM,CACxB,CAnBH;AAoBE,MAAA,MAAM,EAAE,CAAC,CAACS,gBAAD,IAAsB,CAAC,CAACA,gBAAF,IAAsBa,KAAK,CAACyC,MAAN,GAAetD,gBAA5D,KAAkFqB,cApB5F;AAqBE,MAAA,SAAS,EAAEC,iBArBb;AAsBE,MAAA,MAAM,EAAE,EAtBV;AAuBE,MAAA,QAAQ,EAAE,KAvBZ;AAwBE,MAAA,EAAE,YAAK7B,OAAL;AAxBJ,MAlBF;AAAA,IADF;AA+CD,CAvPgC,CAA1B;;AAVLL,EAAAA,I;AALA8D,IAAAA,c;AACAnC,IAAAA,K;;AAKA1B,EAAAA,a;AACAE,EAAAA,kB;AACAO,EAAAA,U;AARAoD,IAAAA,c;AACAnC,IAAAA,K;;AAQAhB,EAAAA,O;AACAC,EAAAA,gB;AACAV,EAAAA,c;AACAe,EAAAA,gB","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\n\n/**\n * Import custom components.\n */\nimport {ChipInputContainer, ChipInputField} from './ChipInputField';\nimport {Size, States} from '../types';\nimport {DropdownContent, DropdownItem} from '../Dropdown';\nimport {SystemIcons} from '../icons';\nimport {ChipInputProps, ChipItem} from './ChipInputTypes';\nimport {useClickOutsideRef, useFocusOutsideRef} from '../common';\nimport {Z_INDEXES} from '../styles';\n\nconst Wrapper = styled.div`\n  position: relative;\n  display: inline-block;\n  width: 100%;\n\n  ${ChipInputContainer} {\n    position: relative;\n\n    &:focus, &.focus-visible-within {\n      z-index: ${Z_INDEXES.dropdown + 1} !important;\n    }\n  }\n`;\n\n\ninterface ListItem extends ChipItem {\n  secondaryLabel?: string;\n  value: string;\n}\n\ninterface ChipDropdownInputProps extends ChipInputProps {\n  list: ListItem[] | string[];\n  onInputChange?: (input: string) => void;\n  messageOnNoResults?: string;\n  suggestion?: ListItem;\n  loading?: boolean;\n  maxSelectedItems?: number;\n  disableSorting?: boolean;\n  disableFiltering?: boolean;\n}\n\nexport const ChipDropdownInput = React.forwardRef<HTMLInputElement | undefined, ChipDropdownInputProps>(({\n                                                                                               list,\n                                                                                               onInputChange,\n                                                                                               disableSorting,\n                                                                                               messageOnNoResults,\n                                                                                               values,\n                                                                                               inputId,\n                                                                                               variants,\n                                                                                               placeholder,\n                                                                                               validationMessage,\n                                                                                               onValueChange,\n                                                                                               suggestion,\n                                                                                               loading,\n                                                                                               maxSelectedItems,\n                                                                                               multiLine = true,\n                                                                                               size = Size.Medium,\n                                                                                               icon,\n                                                                                               disableFiltering,\n                                                                                               disabled,\n                                                                                               altPlaceholder,\n                                                                                               required,\n                                                                                               ...rest\n                                                                                             }: ChipDropdownInputProps, ref) => {\n  // Initiate states\n  const [givenList, setGivenList] = React.useState<ListItem[]>([]);\n  const [chips, setChips] = React.useState<ListItem[]>([]);\n\n  const [value, setValue] = React.useState<string>('');\n  const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n  const [filteredList, setFilteredList] = React.useState<ListItem[]>();\n\n  const [dropdownIsOpen, setDropdownIsOpen] = React.useState<boolean>(false);\n  const [dropdownList, setDropdownList] = React.useState<DropdownItem[]>([]);\n  const [dropdownValue, setDropdownValue] = React.useState<string>('');\n\n  const [focused, setFocused] = React.useState<number | null>(null);\n\n  const containerRef = useClickOutsideRef(() => setDropdownIsOpen(false), [], useFocusOutsideRef(() => setDropdownIsOpen(false)));\n  const inputRef = React.useRef<any>();\n\n  React.useImperativeHandle(ref, () => inputRef.current, [inputRef]);\n\n\n  /**\n   * Sets initial values for the chips.\n   */\n  React.useEffect(() => {\n\n    const list =\n      values.map((a) => chips.find(b => b.value === a) || givenList.find(b => b.value === a) || {\n        label: a,\n        value: a,\n        icon: icon\n      })\n        .map((a, index) => ({...a, variant: a.variant || (variants && variants[index]) || States.Default}))\n        .map((a, index) => ({...a, icon: a.icon || icon}));\n\n    setChips(list);\n  }, [values, variants, icon, givenList]);\n\n  /**\n   * Convert string[] to List[] if necessary\n   */\n  React.useEffect(() => {\n    if (typeof list[0] === 'string') {\n      const newList: ListItem[] = (list as string[]).map((e: string) => ({label: e, value: e}));\n      setGivenList(newList);\n    } else {\n      setGivenList(list as ListItem[]);\n    }\n  }, [list]);\n\n  /**\n   * filter and sort list if remoteOperations is false\n   * */\n  React.useEffect(() => {\n    let options = [...givenList];\n    if (!disableFiltering) {\n      if (!restartFilter && value !== '') {\n        options = options.filter((option) => option.label.toUpperCase().indexOf(value.toUpperCase()) !== -1 ||\n          (option.secondaryLabel && option.secondaryLabel?.toUpperCase().indexOf(value.toUpperCase()) !== -1));\n      }\n    }\n\n    if (!disableSorting) {\n      options = options.sort();\n    }\n\n    suggestion && options.push(suggestion);\n\n    options = options.filter((o) => !chips.find(a => a.value === o.value));\n    setFilteredList(options);\n  }, [value, givenList, chips, disableFiltering, disableSorting]);\n\n  /**\n   * if there is only one active item in dropdown mark it as focused\n   * */\n  React.useEffect(() => {\n    if (dropdownIsOpen && !!value && dropdownList?.filter(a => !a.disabled).length === 1) {\n      setDropdownValue(dropdownList.find(a => !a.disabled)!.value);\n    } else {\n      setDropdownValue('');\n    }\n  }, [dropdownList, dropdownIsOpen, value]);\n\n  const handleClickOutside = (e: any) => {\n    if (!containerRef.current?.contains(e.target)) {\n      if (dropdownIsOpen) {\n        setDropdownIsOpen(false);\n        if (!givenList.find((e) => e.value === value)) {\n          setValue('');\n        }\n      }\n    }\n  };\n\n  /**\n   * register click outside event listener\n   * */\n  React.useEffect(() => {\n    document.addEventListener('click', handleClickOutside);\n    return () => {\n      document.removeEventListener('click', handleClickOutside);\n    };\n  });\n\n  /**\n   * update dropdown items when filtered list changes\n   * */\n  React.useEffect(() => {\n    setDropdownList(filteredList?.map(x => ({\n      value: x.value,\n      displayLabel: x.label,\n      noteLabel: x.secondaryLabel,\n      icon: (x.icon ?? icon) && SystemIcons[(x.icon || icon)!]({}),\n      disabled: x.disabled,\n    })) ?? []);\n  }, [filteredList]);\n\n  const addChip = (newChip: ListItem) => {\n    const newList = [...chips, newChip];\n    // Let's add the chip\n    setChips(newList);\n    onValueChange(newList.map(a => a.value));\n\n    setValue('');\n  };\n\n  const handleInputValueChange = (value: string) => {\n    setValue(value);\n    setRestartFilter(false);\n    setDropdownIsOpen(true);\n    onInputChange && onInputChange(value);\n  }\n\n  /**\n   * Add chip from dropdown\n   * */\n  const handleValueUpdate = (values: string[]) => {\n    const item = filteredList?.find(a => a.value === values[0]);\n    item && addChip(item);\n    setRestartFilter(true);\n    inputRef?.current?.focus();\n  }\n\n  /**\n   * Adds a chip to the chip list.\n   * @param event - Event handler from the key down event.\n   */\n  const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n    // Let's trigger only on enter, comma and space key press\n    if ((event.key === 'Enter' || event.key === ' ') && value) {\n      if (dropdownList?.filter(a => !a.disabled).length === 1) {\n        handleValueUpdate([dropdownList!.find(a => !a.disabled)!.value]);\n        event.stopPropagation();\n      }\n    }\n\n    if ((event.key === 'ArrowDown' || event.key === 'Down' || event.key === 'ArrowUp' || event.key === 'Up') && !!dropdownList?.length) {\n      setDropdownIsOpen(true);\n    }\n  };\n\n  /**\n   * Removes a specific chip from the chip list.\n   * @param index - Index of the chip that needs to be removed.\n   */\n  const handleOnChipRemoved = (index: number): void => {\n    // Let's copy the chips\n    const newChips = [...chips];\n\n    // Let's delete the chip\n    // If necessary, let's replace it with a different chip\n    newChips.splice(index, 1);\n\n    // Let's update the chip list\n    setChips([...newChips]);\n    onValueChange(newChips.map((e) => e.value));\n  };\n\n  return (\n    <Wrapper ref={containerRef}>\n      <ChipInputField inputId={inputId}\n                      ref={inputRef}\n                      items={chips}\n                      required={required}\n                      inputValue={value}\n                      size={size}\n                      placeholder={placeholder}\n                      altPlaceholder={altPlaceholder}\n                      disabled={disabled}\n                      multiLine={multiLine}\n                      validationMessage={validationMessage}\n                      loading={loading}\n                      onRemoveItem={(chip, index) => handleOnChipRemoved(index)}\n                      onInputValueChange={handleInputValueChange}\n                      onInputKeyDown={handleInputKeyDown}\n                      onActivationChange={(value) => setDropdownIsOpen(value)}\n                      {...rest}/>\n      <DropdownContent\n        containerRef={containerRef}\n        customizationProps={{\n          action: () => {\n          },\n          pinTopItem: true,\n\n          itemsType: 'normal',\n          scrollable: true,\n          actionLabel: '',\n          multiSelect: false,\n          onValueUpdate: handleValueUpdate,\n          items: dropdownList\n        }}\n        focused={focused}\n        setFocused={setFocused}\n        selectedValues={[dropdownValue]}\n        messageOnNoResults={messageOnNoResults ?? ''}\n        setSelectedValues={() => {\n        }}\n        isOpen={(!maxSelectedItems || (!!maxSelectedItems && chips.length < maxSelectedItems)) && dropdownIsOpen}\n        setIsOpen={setDropdownIsOpen}\n        filter={''}\n        isButton={false}\n        id={`${inputId}_dropdowncontent`}/>\n\n    </Wrapper>\n  );\n});\n"],"file":"ChipDropdownInput.js"}

package/dist/Dropdown/BasicDropdown.cjs

@@ -39,7 +39,7 @@ var _jsxRuntime = require("react/jsx-runtime");
 
 var _BasicDropdown$propTy;
 
-var _excluded = ["id", "list", "placeholder", "messageOnNoResults", "itemsType", "action", "actionLabel", "actionVariant", "actionIcon", "actionLoading", "actionDisabled", "pinTopItem", "scrollable", "maxHeight", "disabled", "readOnly", "isButton", "activeValidationMessage", "autofilledMessage", "size", "margin", "minWidth", "className", "onBlur"];
+var _excluded = ["id", "list", "placeholder", "messageOnNoResults", "itemsType", "action", "actionLabel", "actionVariant", "actionIcon", "actionLoading", "actionDisabled", "pinTopItem", "scrollable", "maxHeight", "disabled", "readOnly", "isButton", "activeValidationMessage", "autofilledMessage", "size", "margin", "minWidth", "className", "onBlur", "onSelect"];
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
@@ -77,6 +77,7 @@ var BasicDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
       minWidth = props.minWidth,
       className = props.className,
       onBlur = props.onBlur,
+      onSelect = props.onSelect,
       rest = (0, _objectWithoutProperties2.default)(props, _excluded);
 
   var _React$useState = React.useState(false),
@@ -106,13 +107,15 @@ var BasicDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
 
   var inputRef = React.useRef(null);
   var styledFieldRef = (0, _common.useFocusVisibleRef)([inputRef]);
+  var dropdownRef = React.useRef(null);
 
   var resetDropdown = function resetDropdown() {
     setIsOpen(false);
     setFocused(null);
   };
 
-  var containerRef = (0, _common.useClickOutsideRef)(resetDropdown, [], (0, _common.useFocusOutsideRef)(resetDropdown));
+  var containerRef = (0, _common.useFocusOutsideRef)(resetDropdown, [dropdownRef]);
+  (0, _common.useClickOutsideRef)(resetDropdown, [], containerRef);
 
   var handleKeyDown = function handleKeyDown(e) {
     if (e.key === 'Enter' || e.key === ' ') {
@@ -252,6 +255,8 @@ var BasicDropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
           })
         })]
       })), !readOnly && !disabled && /*#__PURE__*/(0, _jsxRuntime.jsx)(_DropdownContent.default, {
+        ref: dropdownRef,
+        containerRef: containerRef,
         customizationProps: {
           itemsType: itemsType,
           action: action !== null && action !== void 0 ? action : function () {},
@@ -316,8 +321,8 @@ BasicDropdown.propTypes = (_BasicDropdown$propTy = {
   autofilledMessage: _propTypes.default.string,
   margin: _propTypes.default.string,
   minWidth: _propTypes.default.string,
-  multiSelect: _propTypes.default.oneOf([true]).isRequired,
-  value: _propTypes.default.arrayOf(_propTypes.default.string),
+  multiSelect: _propTypes.default.oneOf([false]),
+  value: _propTypes.default.string,
   onSelect: _propTypes.default.func.isRequired
 }, (0, _defineProperty2.default)(_BasicDropdown$propTy, "list", _propTypes.default.array.isRequired), (0, _defineProperty2.default)(_BasicDropdown$propTy, "itemsType", _propTypes.default.oneOf(['normal', 'checkbox', 'radio'])), _BasicDropdown$propTy);
 var _default = BasicDropdown;