@laerdal/life-react-components 1.5.1-dev.2.full → 1.5.1-dev.21.full

package/dist/Dropdown/DropdownFilter.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Dropdown/DropdownFilter.tsx"],"names":["DropdownFilter","id","list","placeholder","onSelect","onInputChange","initalValue","required","disableSorting","messageOnNoResults","disabled","locked","scrollable","isButton","activeValidationMessage","autofilledMessage","size","buttonFontSize","keepInitialValue","icon","margin","React","useState","isOpen","setIsOpen","isLoading","setIsLoading","input","setInput","placeholderSearch","setPlaceholderSearch","restartFilter","setRestartFilter","selectedValues","setSelectedValues","focused","setFocused","styledFieldRef","useRef","inputRef","handleKeyPress","e","current","contains","target","keyCode","matches","filter","c","label","toLowerCase","length","useEffect","some","x","document","addEventListener","removeEventListener","renderStandardDropdown","concat","stopPropagation","focus","Math","floor","random","value","Size","Small","COLORS","neutral_600","renderButtonDropdown","itemsType","multiSelect","action","onValueUpdate","values","val","items","map","customContent","warning_400"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { COLORS } from '../styles';\nimport { ArrowDropDown, ArrowDropUp, Information, TechnicalWarning } from '../icons/systemicons/SystemIcons';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { StyledField, Dropdown, ButtonDropdownWrapper, InputField } from './CommonStyling';\nimport DropdownContent from './DropdownContent';\nimport { Size } from '../types'\nimport { AutofilledMessage, WarningMessage } from '../InputFields/styling';\n\nexport interface DropdownFilterItem {\n  label: string;\n  customContent?: React.ReactNode;\n}\n\ninterface DropdownFilterProps {\n  id: string;\n  list: DropdownFilterItem[];\n  placeholder?: string;\n  onSelect?: (value: string) => void;\n  onInputChange?: (input: string) => void;\n  initalValue?: string;\n  required?: boolean;\n  disableSorting?: boolean;\n  messageOnNoResults?: string;\n  disabled?: boolean;\n  locked?: boolean;\n  isButton?: boolean;\n  activeValidationMessage?: string;\n  autofilledMessage?: string;\n  size?: Size.Small | Size.Medium;\n  scrollable?: boolean;\n  buttonFontSize?: string;\n  keepInitialValue?: boolean;\n  icon?: React.ReactNode;\n  margin?: string;\n}\n\nconst DropdownFilter = ({\n  id,\n  list,\n  placeholder,\n  onSelect,\n  onInputChange,\n  initalValue,\n  required,\n  disableSorting,\n  messageOnNoResults,\n  disabled,\n  locked,\n  scrollable,\n  isButton,\n  activeValidationMessage,\n  autofilledMessage,\n  size,\n  buttonFontSize,\n  keepInitialValue,\n  icon,\n  margin = '4px 0',\n}: DropdownFilterProps) => {\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [isLoading, setIsLoading] = React.useState<Boolean>(false);\n  const [input, setInput] = React.useState<string>(initalValue ?? '');\n  const [placeholderSearch, setPlaceholderSearch] = React.useState<string>(placeholder || '');\n  const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n  const [focused, setFocused] = React.useState<number | null>(null);\n\n  const styledFieldRef = React.useRef<HTMLDivElement>(null);\n  const inputRef = React.useRef<HTMLInputElement>(null);\n\n  const handleKeyPress = (e: any) => {\n    if (styledFieldRef?.current && styledFieldRef.current.contains(e.target)) {\n      if (e.keyCode === 13 && !locked) {\n        const matches = list?.filter((c) => c.label.toLowerCase() === input.toLowerCase());\n        if (matches.length === 1 && onSelect) {\n          onSelect(matches[0].label);\n          setInput(matches[0].label);\n        }\n        if(!isOpen)\n          setFocused(0);\n        setIsOpen(!isOpen);\n        if (matches.length === 0) {\n          setInput('');\n        }\n      } else if (e.keyCode === 40) {\n        if(!isOpen)\n          setFocused(0);\n        setIsOpen(!isOpen);\n      }\n    }\n  };\n\n  React.useEffect(() => {\n    if (initalValue || initalValue === '') {\n      setInput(initalValue);\n      setRestartFilter(true);\n    }\n  }, [initalValue]);\n\n  React.useEffect(() => {\n    if (!isOpen && !list.some(x => x.label == input)) {\n      setInput('');\n      setPlaceholderSearch(placeholder || '');\n    }\n  }, [isOpen]);\n\n  React.useEffect(() => {\n    document.addEventListener('keypress', handleKeyPress);\n    return () => {\n      document.removeEventListener('keypress', handleKeyPress);\n    };\n  });\n\n  React.useEffect(() => {\n    setIsLoading(false);\n    if (selectedValues.length > 0 && !list.some(x => x.label == input))\n      setSelectedValues([]);\n\n    if(list.some(x => x.label == input))\n    {\n      setSelectedValues([input]);\n      onSelect && onSelect(input);\n    }\n  }, [input]);\n\n\n  const renderStandardDropdown = () => {\n    return (\n      <StyledField\n        ref={styledFieldRef}\n        className={(isOpen ? 'expanded ' : '').concat(size ? size : '')}\n        onClick={(e: any) => {\n          e.stopPropagation();\n          setIsOpen(!isOpen);\n          inputRef.current?.focus();\n        }}\n        tabIndex={disabled || locked ? -1 : 0}\n        disabled={disabled || false}\n        locked={locked || false}\n        showValidationMessage={!!activeValidationMessage}\n        fontSize={buttonFontSize}\n        data-testid={`otherdiv_${id}`}>\n        <InputField\n          ref={inputRef}\n          autoComplete={'off-' + Math.floor(Math.random() * 999999999999)}\n          type=\"search\"\n          placeholder={placeholderSearch}\n          value={input}\n          className={size ? `${size} value` : 'value'}\n          onChange={(e: any) => {\n            if (!locked && !disabled) {\n              setRestartFilter(false);\n              setIsLoading(true);\n              setIsOpen(true);\n              setInput(e.target.value);\n              if (onInputChange) {\n                onInputChange(e.target.value || '');\n              }\n            }\n          }}\n          onClick={(e: any) => {\n            if (!locked && !disabled) {\n              e.stopPropagation();\n              setIsOpen(!isOpen);\n            }\n          }}\n          onFocus={() => setPlaceholderSearch('')}\n          onBlur={() => setPlaceholderSearch(placeholder || '')}\n          required={required}\n          tabIndex={disabled || locked ? -1 : 0}\n          disabled={disabled || false}\n        />\n\n        {isLoading ? <LoadingIndicator size={Size.Small} color={COLORS.neutral_600} /> : null}\n\n        <div onClick={() => setIsOpen(!isOpen)} className={'dropdown-arrow'}>\n          {isOpen && !locked && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''} /> : <ArrowDropDown size=\"24px\" className={size ? size : ''} />}\n        </div>\n      </StyledField>\n    );\n  };\n\n  const renderButtonDropdown = () => (\n    <ButtonDropdownWrapper\n      onClick={(e: any) => {\n        e.stopPropagation();\n        setIsOpen(!isOpen);\n        inputRef.current?.focus();\n      }}\n      disabled={disabled}\n      locked={locked}>\n      <StyledField\n        ref={styledFieldRef}\n        className={(isOpen ? 'expanded ' : '').concat(size ? size + ' ' : '').concat(isButton ? 'button' : '')}\n        tabIndex={disabled || locked ? -1 : 0}\n        disabled={disabled || false}\n        locked={locked || false}\n        showValidationMessage={!!activeValidationMessage}\n        fontSize={buttonFontSize}>\n        {icon}\n        <div className={'value'}>{initalValue && keepInitialValue ? initalValue : input || placeholderSearch}</div>\n        {isLoading ? <LoadingIndicator size={Size.Small} color={COLORS.neutral_600} /> : null}\n        <div onClick={() => setIsOpen(!isOpen)} className={'dropdown-arrow'}>\n          {isOpen && !locked && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''} /> : <ArrowDropDown size=\"24px\" className={size ? size : ''} />}\n        </div>\n      </StyledField>\n    </ButtonDropdownWrapper>\n  );\n\n  return (\n    <>\n      <Dropdown isButton={isButton || false} disabled={disabled} locked={locked} className={size ? size : ''} margin={margin}>\n        {!isButton && renderStandardDropdown()}\n        {!!isButton && renderButtonDropdown()}\n        {!locked && !disabled && (\n          <DropdownContent\n          isOpen={isOpen}\n          messageOnNoResults={messageOnNoResults ?? ''}\n          selectedValues={selectedValues}\n          setSelectedValues={setSelectedValues}\n          hideOnClickOutside={true}\n          size={size ?? Size.Small}\n          focused={focused}\n          setFocused={setFocused}\n          customizationProps={{\n            itemsType: 'normal',\n            scrollable: scrollable,\n            multiSelect: false,\n            action: () => {},\n            onValueUpdate: (values: string[]) => {\n              const val = values[0] ?? '';\n              setRestartFilter(true);\n              setInput(val);\n            },\n            items: list.map(x => ({ value: x.label, customContent: x.customContent }))\n          }}\n          filter={!restartFilter ? input : ''}\n          setIsOpen={setIsOpen}\n          alignLeft={false}\n          isButton={isButton || false}\n          id={`${id}_dropdowncontent`} />\n        )}\n      </Dropdown>\n      {activeValidationMessage && (\n        <WarningMessage className={size || ''}>\n          <TechnicalWarning size=\"20px\" color={COLORS.warning_400} />\n          <span>{activeValidationMessage}</span>\n        </WarningMessage>\n      )}\n      {autofilledMessage && (\n        <AutofilledMessage className={size || ''}>\n          <Information size=\"20px\" color={COLORS.neutral_600} />\n          <span>{autofilledMessage}</span>\n        </AutofilledMessage>\n      )}\n    </>\n  );\n};\n\nexport default DropdownFilter;\n"],"file":"DropdownFilter.cjs"}
+{"version":3,"sources":["../../src/Dropdown/DropdownFilter.tsx"],"names":["DropdownFilter","id","list","placeholder","onSelect","onInputChange","initalValue","required","disableSorting","messageOnNoResults","disabled","locked","scrollable","isButton","activeValidationMessage","autofilledMessage","size","buttonFontSize","keepInitialValue","icon","margin","React","useState","isOpen","setIsOpen","isLoading","setIsLoading","input","setInput","placeholderSearch","setPlaceholderSearch","restartFilter","setRestartFilter","selectedValues","setSelectedValues","focused","setFocused","styledFieldRef","useRef","inputRef","handleKeyPress","e","current","contains","target","keyCode","matches","filter","c","label","toLowerCase","length","useEffect","some","x","document","addEventListener","removeEventListener","renderStandardDropdown","concat","stopPropagation","focus","Math","floor","random","value","Size","Small","COLORS","neutral_600","renderButtonDropdown","itemsType","multiSelect","action","onValueUpdate","values","val","items","map","customContent","warning_400"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AA8BA,IAAMA,cAAc,GAAG,SAAjBA,cAAiB,OAqBI;AAAA,MApBzBC,EAoByB,QApBzBA,EAoByB;AAAA,MAnBzBC,IAmByB,QAnBzBA,IAmByB;AAAA,MAlBzBC,WAkByB,QAlBzBA,WAkByB;AAAA,MAjBzBC,QAiByB,QAjBzBA,QAiByB;AAAA,MAhBzBC,aAgByB,QAhBzBA,aAgByB;AAAA,MAfzBC,WAeyB,QAfzBA,WAeyB;AAAA,MAdzBC,QAcyB,QAdzBA,QAcyB;AAAA,MAbzBC,cAayB,QAbzBA,cAayB;AAAA,MAZzBC,kBAYyB,QAZzBA,kBAYyB;AAAA,MAXzBC,QAWyB,QAXzBA,QAWyB;AAAA,MAVzBC,MAUyB,QAVzBA,MAUyB;AAAA,MATzBC,UASyB,QATzBA,UASyB;AAAA,MARzBC,QAQyB,QARzBA,QAQyB;AAAA,MAPzBC,uBAOyB,QAPzBA,uBAOyB;AAAA,MANzBC,iBAMyB,QANzBA,iBAMyB;AAAA,MALzBC,IAKyB,QALzBA,IAKyB;AAAA,MAJzBC,cAIyB,QAJzBA,cAIyB;AAAA,MAHzBC,gBAGyB,QAHzBA,gBAGyB;AAAA,MAFzBC,IAEyB,QAFzBA,IAEyB;AAAA,yBADzBC,MACyB;AAAA,MADzBA,MACyB,4BADhB,OACgB;;AACzB,wBAA4BC,KAAK,CAACC,QAAN,CAAwB,KAAxB,CAA5B;AAAA;AAAA,MAAOC,MAAP;AAAA,MAAeC,SAAf;;AACA,yBAAkCH,KAAK,CAACC,QAAN,CAAwB,KAAxB,CAAlC;AAAA;AAAA,MAAOG,SAAP;AAAA,MAAkBC,YAAlB;;AACA,yBAA0BL,KAAK,CAACC,QAAN,CAAuBhB,WAAvB,aAAuBA,WAAvB,cAAuBA,WAAvB,GAAsC,EAAtC,CAA1B;AAAA;AAAA,MAAOqB,KAAP;AAAA,MAAcC,QAAd;;AACA,yBAAkDP,KAAK,CAACC,QAAN,CAAuBnB,WAAW,IAAI,EAAtC,CAAlD;AAAA;AAAA,MAAO0B,iBAAP;AAAA,MAA0BC,oBAA1B;;AACA,yBAA0CT,KAAK,CAACC,QAAN,CAAwB,KAAxB,CAA1C;AAAA;AAAA,MAAOS,aAAP;AAAA,MAAsBC,gBAAtB;;AACA,0BAA4CX,KAAK,CAACC,QAAN,CAAyB,EAAzB,CAA5C;AAAA;AAAA,MAAOW,cAAP;AAAA,MAAuBC,iBAAvB;;AACA,0BAA8Bb,KAAK,CAACC,QAAN,CAA8B,IAA9B,CAA9B;AAAA;AAAA,MAAOa,OAAP;AAAA,MAAgBC,UAAhB;;AAEA,MAAMC,cAAc,GAAGhB,KAAK,CAACiB,MAAN,CAA6B,IAA7B,CAAvB;AACA,MAAMC,QAAQ,GAAGlB,KAAK,CAACiB,MAAN,CAA+B,IAA/B,CAAjB;;AAEA,MAAME,cAAc,GAAG,SAAjBA,cAAiB,CAACC,CAAD,EAAY;AACjC,QAAIJ,cAAc,SAAd,IAAAA,cAAc,WAAd,IAAAA,cAAc,CAAEK,OAAhB,IAA2BL,cAAc,CAACK,OAAf,CAAuBC,QAAvB,CAAgCF,CAAC,CAACG,MAAlC,CAA/B,EAA0E;AACxE,UAAIH,CAAC,CAACI,OAAF,KAAc,EAAd,IAAoB,CAAClC,MAAzB,EAAiC;AAC/B,YAAMmC,OAAO,GAAG5C,IAAH,aAAGA,IAAH,uBAAGA,IAAI,CAAE6C,MAAN,CAAa,UAACC,CAAD;AAAA,iBAAOA,CAAC,CAACC,KAAF,CAAQC,WAAR,OAA0BvB,KAAK,CAACuB,WAAN,EAAjC;AAAA,SAAb,CAAhB;;AACA,YAAIJ,OAAO,CAACK,MAAR,KAAmB,CAAnB,IAAwB/C,QAA5B,EAAsC;AACpCA,UAAAA,QAAQ,CAAC0C,OAAO,CAAC,CAAD,CAAP,CAAWG,KAAZ,CAAR;AACArB,UAAAA,QAAQ,CAACkB,OAAO,CAAC,CAAD,CAAP,CAAWG,KAAZ,CAAR;AACD;;AACD,YAAG,CAAC1B,MAAJ,EACEa,UAAU,CAAC,CAAD,CAAV;AACFZ,QAAAA,SAAS,CAAC,CAACD,MAAF,CAAT;;AACA,YAAIuB,OAAO,CAACK,MAAR,KAAmB,CAAvB,EAA0B;AACxBvB,UAAAA,QAAQ,CAAC,EAAD,CAAR;AACD;AACF,OAZD,MAYO,IAAIa,CAAC,CAACI,OAAF,KAAc,EAAlB,EAAsB;AAC3B,YAAG,CAACtB,MAAJ,EACEa,UAAU,CAAC,CAAD,CAAV;AACFZ,QAAAA,SAAS,CAAC,CAACD,MAAF,CAAT;AACD;AACF;AACF,GApBD;;AAsBAF,EAAAA,KAAK,CAAC+B,SAAN,CAAgB,YAAM;AACpB,QAAI9C,WAAW,IAAIA,WAAW,KAAK,EAAnC,EAAuC;AACrCsB,MAAAA,QAAQ,CAACtB,WAAD,CAAR;AACA0B,MAAAA,gBAAgB,CAAC,IAAD,CAAhB;AACD;AACF,GALD,EAKG,CAAC1B,WAAD,CALH;AAOAe,EAAAA,KAAK,CAAC+B,SAAN,CAAgB,YAAM;AACpB,QAAI,CAAC7B,MAAD,IAAW,CAACrB,IAAI,CAACmD,IAAL,CAAU,UAAAC,CAAC;AAAA,aAAIA,CAAC,CAACL,KAAF,IAAWtB,KAAf;AAAA,KAAX,CAAhB,EAAkD;AAChDC,MAAAA,QAAQ,CAAC,EAAD,CAAR;AACAE,MAAAA,oBAAoB,CAAC3B,WAAW,IAAI,EAAhB,CAApB;AACD;AACF,GALD,EAKG,CAACoB,MAAD,CALH;AAOAF,EAAAA,KAAK,CAAC+B,SAAN,CAAgB,YAAM;AACpBG,IAAAA,QAAQ,CAACC,gBAAT,CAA0B,UAA1B,EAAsChB,cAAtC;AACA,WAAO,YAAM;AACXe,MAAAA,QAAQ,CAACE,mBAAT,CAA6B,UAA7B,EAAyCjB,cAAzC;AACD,KAFD;AAGD,GALD;AAOAnB,EAAAA,KAAK,CAAC+B,SAAN,CAAgB,YAAM;AACpB1B,IAAAA,YAAY,CAAC,KAAD,CAAZ;AACA,QAAIO,cAAc,CAACkB,MAAf,GAAwB,CAAxB,IAA6B,CAACjD,IAAI,CAACmD,IAAL,CAAU,UAAAC,CAAC;AAAA,aAAIA,CAAC,CAACL,KAAF,IAAWtB,KAAf;AAAA,KAAX,CAAlC,EACEO,iBAAiB,CAAC,EAAD,CAAjB;;AAEF,QAAGhC,IAAI,CAACmD,IAAL,CAAU,UAAAC,CAAC;AAAA,aAAIA,CAAC,CAACL,KAAF,IAAWtB,KAAf;AAAA,KAAX,CAAH,EACA;AACEO,MAAAA,iBAAiB,CAAC,CAACP,KAAD,CAAD,CAAjB;AACAvB,MAAAA,QAAQ,IAAIA,QAAQ,CAACuB,KAAD,CAApB;AACD;AACF,GAVD,EAUG,CAACA,KAAD,CAVH;;AAaA,MAAM+B,sBAAsB,GAAG,SAAzBA,sBAAyB,GAAM;AACnC,wBACE,sBAAC,0BAAD;AACE,MAAA,GAAG,EAAErB,cADP;AAEE,MAAA,SAAS,EAAE,CAACd,MAAM,GAAG,WAAH,GAAiB,EAAxB,EAA4BoC,MAA5B,CAAmC3C,IAAI,GAAGA,IAAH,GAAU,EAAjD,CAFb;AAGE,MAAA,OAAO,EAAE,iBAACyB,CAAD,EAAY;AAAA;;AACnBA,QAAAA,CAAC,CAACmB,eAAF;AACApC,QAAAA,SAAS,CAAC,CAACD,MAAF,CAAT;AACA,6BAAAgB,QAAQ,CAACG,OAAT,wEAAkBmB,KAAlB;AACD,OAPH;AAQE,MAAA,QAAQ,EAAEnD,QAAQ,IAAIC,MAAZ,GAAqB,CAAC,CAAtB,GAA0B,CARtC;AASE,MAAA,QAAQ,EAAED,QAAQ,IAAI,KATxB;AAUE,MAAA,aAAa,EAAE,CAACiB,KAVlB;AAWE,MAAA,MAAM,EAAEhB,MAAM,IAAI,KAXpB;AAYE,MAAA,qBAAqB,EAAE,CAAC,CAACG,uBAZ3B;AAaE,MAAA,QAAQ,EAAEG,cAbZ;AAcE,wCAAyBhB,EAAzB,CAdF;AAAA,8BAeE,qBAAC,yBAAD;AACE,QAAA,GAAG,EAAEsC,QADP;AAEE,QAAA,YAAY,EAAE,SAASuB,IAAI,CAACC,KAAL,CAAWD,IAAI,CAACE,MAAL,KAAgB,YAA3B,CAFzB;AAGE,QAAA,IAAI,EAAC,QAHP;AAIE,QAAA,WAAW,EAAEnC,iBAJf;AAKE,QAAA,KAAK,EAAEF,KALT;AAME,QAAA,SAAS,EAAEX,IAAI,aAAMA,IAAN,cAAqB,OANtC;AAOE,QAAA,QAAQ,EAAE,kBAACyB,CAAD,EAAY;AACpB,cAAI,CAAC9B,MAAD,IAAW,CAACD,QAAhB,EAA0B;AACxBsB,YAAAA,gBAAgB,CAAC,KAAD,CAAhB;AACAN,YAAAA,YAAY,CAAC,IAAD,CAAZ;AACAF,YAAAA,SAAS,CAAC,IAAD,CAAT;AACAI,YAAAA,QAAQ,CAACa,CAAC,CAACG,MAAF,CAASqB,KAAV,CAAR;;AACA,gBAAI5D,aAAJ,EAAmB;AACjBA,cAAAA,aAAa,CAACoC,CAAC,CAACG,MAAF,CAASqB,KAAT,IAAkB,EAAnB,CAAb;AACD;AACF;AACF,SAjBH;AAkBE,QAAA,OAAO,EAAE,iBAACxB,CAAD,EAAY;AACnB,cAAI,CAAC9B,MAAD,IAAW,CAACD,QAAhB,EAA0B;AACxB+B,YAAAA,CAAC,CAACmB,eAAF;AACApC,YAAAA,SAAS,CAAC,CAACD,MAAF,CAAT;AACD;AACF,SAvBH;AAwBE,QAAA,OAAO,EAAE;AAAA,iBAAMO,oBAAoB,CAAC,EAAD,CAA1B;AAAA,SAxBX;AAyBE,QAAA,MAAM,EAAE;AAAA,iBAAMA,oBAAoB,CAAC3B,WAAW,IAAI,EAAhB,CAA1B;AAAA,SAzBV;AA0BE,QAAA,QAAQ,EAAEI,QA1BZ;AA2BE,QAAA,QAAQ,EAAEG,QAAQ,IAAIC,MAAZ,GAAqB,CAAC,CAAtB,GAA0B,CA3BtC;AA4BE,QAAA,QAAQ,EAAED,QAAQ,IAAI;AA5BxB,QAfF,EA8CGe,SAAS,gBAAG,qBAAC,kCAAD;AAAkB,QAAA,IAAI,EAAEyC,YAAKC,KAA7B;AAAoC,QAAA,KAAK,EAAEC,eAAOC;AAAlD,QAAH,GAAuE,IA9CnF,eAgDE;AAAK,QAAA,OAAO,EAAE;AAAA,iBAAM7C,SAAS,CAAC,CAACD,MAAF,CAAf;AAAA,SAAd;AAAwC,QAAA,SAAS,EAAE,gBAAnD;AAAA,kBACGA,MAAM,IAAI,CAACZ,MAAX,IAAqB,CAACD,QAAtB,gBAAiC,qBAAC,wBAAD;AAAa,UAAA,IAAI,EAAC,MAAlB;AAAyB,UAAA,SAAS,EAAEM,IAAI,GAAGA,IAAH,GAAU;AAAlD,UAAjC,gBAA4F,qBAAC,0BAAD;AAAe,UAAA,IAAI,EAAC,MAApB;AAA2B,UAAA,SAAS,EAAEA,IAAI,GAAGA,IAAH,GAAU;AAApD;AAD/F,QAhDF;AAAA,MADF;AAsDD,GAvDD;;AAyDA,MAAMsD,oBAAoB,GAAG,SAAvBA,oBAAuB;AAAA,wBAC3B,qBAAC,oCAAD;AACE,MAAA,OAAO,EAAE,iBAAC7B,CAAD,EAAY;AAAA;;AACnBA,QAAAA,CAAC,CAACmB,eAAF;AACApC,QAAAA,SAAS,CAAC,CAACD,MAAF,CAAT;AACA,8BAAAgB,QAAQ,CAACG,OAAT,0EAAkBmB,KAAlB;AACD,OALH;AAME,MAAA,QAAQ,EAAEnD,QANZ;AAOE,MAAA,MAAM,EAAEC,MAPV;AAAA,6BAQE,sBAAC,0BAAD;AACE,QAAA,GAAG,EAAE0B,cADP;AAEE,QAAA,SAAS,EAAE,CAACd,MAAM,GAAG,WAAH,GAAiB,EAAxB,EAA4BoC,MAA5B,CAAmC3C,IAAI,GAAGA,IAAI,GAAG,GAAV,GAAgB,EAAvD,EAA2D2C,MAA3D,CAAkE9C,QAAQ,GAAG,QAAH,GAAc,EAAxF,CAFb;AAGE,QAAA,QAAQ,EAAEH,QAAQ,IAAIC,MAAZ,GAAqB,CAAC,CAAtB,GAA0B,CAHtC;AAIE,QAAA,QAAQ,EAAED,QAAQ,IAAI,KAJxB;AAKE,QAAA,MAAM,EAAEC,MAAM,IAAI,KALpB;AAME,QAAA,qBAAqB,EAAE,CAAC,CAACG,uBAN3B;AAOE,QAAA,QAAQ,EAAEG,cAPZ;AAAA,mBAQGE,IARH,eASE;AAAK,UAAA,SAAS,EAAE,OAAhB;AAAA,oBAA0Bb,WAAW,IAAIY,gBAAf,GAAkCZ,WAAlC,GAAgDqB,KAAK,IAAIE;AAAnF,UATF,EAUGJ,SAAS,gBAAG,qBAAC,kCAAD;AAAkB,UAAA,IAAI,EAAEyC,YAAKC,KAA7B;AAAoC,UAAA,KAAK,EAAEC,eAAOC;AAAlD,UAAH,GAAuE,IAVnF,eAWE;AAAK,UAAA,OAAO,EAAE;AAAA,mBAAM7C,SAAS,CAAC,CAACD,MAAF,CAAf;AAAA,WAAd;AAAwC,UAAA,SAAS,EAAE,gBAAnD;AAAA,oBACGA,MAAM,IAAI,CAACZ,MAAX,IAAqB,CAACD,QAAtB,gBAAiC,qBAAC,wBAAD;AAAa,YAAA,IAAI,EAAC,MAAlB;AAAyB,YAAA,SAAS,EAAEM,IAAI,GAAGA,IAAH,GAAU;AAAlD,YAAjC,gBAA4F,qBAAC,0BAAD;AAAe,YAAA,IAAI,EAAC,MAApB;AAA2B,YAAA,SAAS,EAAEA,IAAI,GAAGA,IAAH,GAAU;AAApD;AAD/F,UAXF;AAAA;AARF,MAD2B;AAAA,GAA7B;;AA2BA,sBACE;AAAA,4BACE,sBAAC,uBAAD;AAAU,MAAA,QAAQ,EAAEH,QAAQ,IAAI,KAAhC;AAAuC,MAAA,QAAQ,EAAEH,QAAjD;AAA2D,MAAA,MAAM,EAAEC,MAAnE;AAA2E,MAAA,SAAS,EAAEK,IAAI,GAAGA,IAAH,GAAU,EAApG;AAAwG,MAAA,MAAM,EAAEI,MAAhH;AAAA,iBACG,CAACP,QAAD,IAAa6C,sBAAsB,EADtC,EAEG,CAAC,CAAC7C,QAAF,IAAcyD,oBAAoB,EAFrC,EAGG,CAAC3D,MAAD,IAAW,CAACD,QAAZ,iBACC,qBAAC,wBAAD;AACA,QAAA,MAAM,EAAEa,MADR;AAEA,QAAA,kBAAkB,EAAEd,kBAAF,aAAEA,kBAAF,cAAEA,kBAAF,GAAwB,EAF1C;AAGA,QAAA,cAAc,EAAEwB,cAHhB;AAIA,QAAA,iBAAiB,EAAEC,iBAJnB;AAKA,QAAA,kBAAkB,EAAE,IALpB;AAMA,QAAA,IAAI,EAAElB,IAAF,aAAEA,IAAF,cAAEA,IAAF,GAAUkD,YAAKC,KANnB;AAOA,QAAA,OAAO,EAAEhC,OAPT;AAQA,QAAA,UAAU,EAAEC,UARZ;AASA,QAAA,kBAAkB,EAAE;AAClBmC,UAAAA,SAAS,EAAE,QADO;AAElB3D,UAAAA,UAAU,EAAEA,UAFM;AAGlB4D,UAAAA,WAAW,EAAE,KAHK;AAIlBC,UAAAA,MAAM,EAAE,kBAAM,CAAE,CAJE;AAKlBC,UAAAA,aAAa,EAAE,uBAACC,MAAD,EAAsB;AAAA;;AACnC,gBAAMC,GAAG,eAAGD,MAAM,CAAC,CAAD,CAAT,+CAAgB,EAAzB;AACA3C,YAAAA,gBAAgB,CAAC,IAAD,CAAhB;AACAJ,YAAAA,QAAQ,CAACgD,GAAD,CAAR;AACD,WATiB;AAUlBC,UAAAA,KAAK,EAAE3E,IAAI,CAAC4E,GAAL,CAAS,UAAAxB,CAAC;AAAA,mBAAK;AAAEW,cAAAA,KAAK,EAAEX,CAAC,CAACL,KAAX;AAAkB8B,cAAAA,aAAa,EAAEzB,CAAC,CAACyB;AAAnC,aAAL;AAAA,WAAV;AAVW,SATpB;AAqBA,QAAA,MAAM,EAAE,CAAChD,aAAD,GAAiBJ,KAAjB,GAAyB,EArBjC;AAsBA,QAAA,SAAS,EAAEH,SAtBX;AAuBA,QAAA,SAAS,EAAE,KAvBX;AAwBA,QAAA,QAAQ,EAAEX,QAAQ,IAAI,KAxBtB;AAyBA,QAAA,EAAE,YAAKZ,EAAL;AAzBF,QAJJ;AAAA,MADF,EAiCGa,uBAAuB,iBACtB,sBAAC,uBAAD;AAAgB,MAAA,SAAS,EAAEE,IAAI,IAAI,EAAnC;AAAA,8BACE,qBAAC,6BAAD;AAAkB,QAAA,IAAI,EAAC,MAAvB;AAA8B,QAAA,KAAK,EAAEoD,eAAOY;AAA5C,QADF,eAEE;AAAA,kBAAOlE;AAAP,QAFF;AAAA,MAlCJ,EAuCGC,iBAAiB,iBAChB,sBAAC,0BAAD;AAAmB,MAAA,SAAS,EAAEC,IAAI,IAAI,EAAtC;AAAA,8BACE,qBAAC,wBAAD;AAAa,QAAA,IAAI,EAAC,MAAlB;AAAyB,QAAA,KAAK,EAAEoD,eAAOC;AAAvC,QADF,eAEE;AAAA,kBAAOtD;AAAP,QAFF;AAAA,MAxCJ;AAAA,IADF;AAgDD,CA7ND;;;AAtBEd,EAAAA,E;AACAC,EAAAA,I;AANA+C,IAAAA,K;AACA8B,IAAAA,a;;AAMA5E,EAAAA,W;AACAC,EAAAA,Q;AACAC,EAAAA,a;AACAC,EAAAA,W;AACAC,EAAAA,Q;AACAC,EAAAA,c;AACAC,EAAAA,kB;AACAC,EAAAA,Q;AACAC,EAAAA,M;AACAE,EAAAA,Q;AACAC,EAAAA,uB;AACAC,EAAAA,iB;AAEAH,EAAAA,U;AACAK,EAAAA,c;AACAC,EAAAA,gB;AACAC,EAAAA,I;AACAC,EAAAA,M;;eAkOapB,c","sourcesContent":["import * as React from 'react';\nimport { COLORS } from '../styles';\nimport { ArrowDropDown, ArrowDropUp, Information, TechnicalWarning } from '../icons/systemicons/SystemIcons';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { StyledField, Dropdown, ButtonDropdownWrapper, InputField } from './CommonStyling';\nimport DropdownContent from './DropdownContent';\nimport { Size } from '../types'\nimport { AutofilledMessage, WarningMessage } from '../InputFields/styling';\n\nexport interface DropdownFilterItem {\n  label: string;\n  customContent?: React.ReactNode;\n}\n\ninterface DropdownFilterProps {\n  id: string;\n  list: DropdownFilterItem[];\n  placeholder?: string;\n  onSelect?: (value: string) => void;\n  onInputChange?: (input: string) => void;\n  initalValue?: string;\n  required?: boolean;\n  disableSorting?: boolean;\n  messageOnNoResults?: string;\n  disabled?: boolean;\n  locked?: boolean;\n  isButton?: boolean;\n  activeValidationMessage?: string;\n  autofilledMessage?: string;\n  size?: Size.Small | Size.Medium;\n  scrollable?: boolean;\n  buttonFontSize?: string;\n  keepInitialValue?: boolean;\n  icon?: React.ReactNode;\n  margin?: string;\n}\n\nconst DropdownFilter = ({\n  id,\n  list,\n  placeholder,\n  onSelect,\n  onInputChange,\n  initalValue,\n  required,\n  disableSorting,\n  messageOnNoResults,\n  disabled,\n  locked,\n  scrollable,\n  isButton,\n  activeValidationMessage,\n  autofilledMessage,\n  size,\n  buttonFontSize,\n  keepInitialValue,\n  icon,\n  margin = '4px 0',\n}: DropdownFilterProps) => {\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [isLoading, setIsLoading] = React.useState<Boolean>(false);\n  const [input, setInput] = React.useState<string>(initalValue ?? '');\n  const [placeholderSearch, setPlaceholderSearch] = React.useState<string>(placeholder || '');\n  const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n  const [focused, setFocused] = React.useState<number | null>(null);\n\n  const styledFieldRef = React.useRef<HTMLDivElement>(null);\n  const inputRef = React.useRef<HTMLInputElement>(null);\n\n  const handleKeyPress = (e: any) => {\n    if (styledFieldRef?.current && styledFieldRef.current.contains(e.target)) {\n      if (e.keyCode === 13 && !locked) {\n        const matches = list?.filter((c) => c.label.toLowerCase() === input.toLowerCase());\n        if (matches.length === 1 && onSelect) {\n          onSelect(matches[0].label);\n          setInput(matches[0].label);\n        }\n        if(!isOpen)\n          setFocused(0);\n        setIsOpen(!isOpen);\n        if (matches.length === 0) {\n          setInput('');\n        }\n      } else if (e.keyCode === 40) {\n        if(!isOpen)\n          setFocused(0);\n        setIsOpen(!isOpen);\n      }\n    }\n  };\n\n  React.useEffect(() => {\n    if (initalValue || initalValue === '') {\n      setInput(initalValue);\n      setRestartFilter(true);\n    }\n  }, [initalValue]);\n\n  React.useEffect(() => {\n    if (!isOpen && !list.some(x => x.label == input)) {\n      setInput('');\n      setPlaceholderSearch(placeholder || '');\n    }\n  }, [isOpen]);\n\n  React.useEffect(() => {\n    document.addEventListener('keypress', handleKeyPress);\n    return () => {\n      document.removeEventListener('keypress', handleKeyPress);\n    };\n  });\n\n  React.useEffect(() => {\n    setIsLoading(false);\n    if (selectedValues.length > 0 && !list.some(x => x.label == input))\n      setSelectedValues([]);\n\n    if(list.some(x => x.label == input))\n    {\n      setSelectedValues([input]);\n      onSelect && onSelect(input);\n    }\n  }, [input]);\n\n\n  const renderStandardDropdown = () => {\n    return (\n      <StyledField\n        ref={styledFieldRef}\n        className={(isOpen ? 'expanded ' : '').concat(size ? size : '')}\n        onClick={(e: any) => {\n          e.stopPropagation();\n          setIsOpen(!isOpen);\n          inputRef.current?.focus();\n        }}\n        tabIndex={disabled || locked ? -1 : 0}\n        disabled={disabled || false}\n        isPlaceholder={!input}\n        locked={locked || false}\n        showValidationMessage={!!activeValidationMessage}\n        fontSize={buttonFontSize}\n        data-testid={`otherdiv_${id}`}>\n        <InputField\n          ref={inputRef}\n          autoComplete={'off-' + Math.floor(Math.random() * 999999999999)}\n          type=\"search\"\n          placeholder={placeholderSearch}\n          value={input}\n          className={size ? `${size} value` : 'value'}\n          onChange={(e: any) => {\n            if (!locked && !disabled) {\n              setRestartFilter(false);\n              setIsLoading(true);\n              setIsOpen(true);\n              setInput(e.target.value);\n              if (onInputChange) {\n                onInputChange(e.target.value || '');\n              }\n            }\n          }}\n          onClick={(e: any) => {\n            if (!locked && !disabled) {\n              e.stopPropagation();\n              setIsOpen(!isOpen);\n            }\n          }}\n          onFocus={() => setPlaceholderSearch('')}\n          onBlur={() => setPlaceholderSearch(placeholder || '')}\n          required={required}\n          tabIndex={disabled || locked ? -1 : 0}\n          disabled={disabled || false}\n        />\n\n        {isLoading ? <LoadingIndicator size={Size.Small} color={COLORS.neutral_600} /> : null}\n\n        <div onClick={() => setIsOpen(!isOpen)} className={'dropdown-arrow'}>\n          {isOpen && !locked && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''} /> : <ArrowDropDown size=\"24px\" className={size ? size : ''} />}\n        </div>\n      </StyledField>\n    );\n  };\n\n  const renderButtonDropdown = () => (\n    <ButtonDropdownWrapper\n      onClick={(e: any) => {\n        e.stopPropagation();\n        setIsOpen(!isOpen);\n        inputRef.current?.focus();\n      }}\n      disabled={disabled}\n      locked={locked}>\n      <StyledField\n        ref={styledFieldRef}\n        className={(isOpen ? 'expanded ' : '').concat(size ? size + ' ' : '').concat(isButton ? 'button' : '')}\n        tabIndex={disabled || locked ? -1 : 0}\n        disabled={disabled || false}\n        locked={locked || false}\n        showValidationMessage={!!activeValidationMessage}\n        fontSize={buttonFontSize}>\n        {icon}\n        <div className={'value'}>{initalValue && keepInitialValue ? initalValue : input || placeholderSearch}</div>\n        {isLoading ? <LoadingIndicator size={Size.Small} color={COLORS.neutral_600} /> : null}\n        <div onClick={() => setIsOpen(!isOpen)} className={'dropdown-arrow'}>\n          {isOpen && !locked && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''} /> : <ArrowDropDown size=\"24px\" className={size ? size : ''} />}\n        </div>\n      </StyledField>\n    </ButtonDropdownWrapper>\n  );\n\n  return (\n    <>\n      <Dropdown isButton={isButton || false} disabled={disabled} locked={locked} className={size ? size : ''} margin={margin}>\n        {!isButton && renderStandardDropdown()}\n        {!!isButton && renderButtonDropdown()}\n        {!locked && !disabled && (\n          <DropdownContent\n          isOpen={isOpen}\n          messageOnNoResults={messageOnNoResults ?? ''}\n          selectedValues={selectedValues}\n          setSelectedValues={setSelectedValues}\n          hideOnClickOutside={true}\n          size={size ?? Size.Small}\n          focused={focused}\n          setFocused={setFocused}\n          customizationProps={{\n            itemsType: 'normal',\n            scrollable: scrollable,\n            multiSelect: false,\n            action: () => {},\n            onValueUpdate: (values: string[]) => {\n              const val = values[0] ?? '';\n              setRestartFilter(true);\n              setInput(val);\n            },\n            items: list.map(x => ({ value: x.label, customContent: x.customContent }))\n          }}\n          filter={!restartFilter ? input : ''}\n          setIsOpen={setIsOpen}\n          alignLeft={false}\n          isButton={isButton || false}\n          id={`${id}_dropdowncontent`} />\n        )}\n      </Dropdown>\n      {activeValidationMessage && (\n        <WarningMessage className={size || ''}>\n          <TechnicalWarning size=\"20px\" color={COLORS.warning_400} />\n          <span>{activeValidationMessage}</span>\n        </WarningMessage>\n      )}\n      {autofilledMessage && (\n        <AutofilledMessage className={size || ''}>\n          <Information size=\"20px\" color={COLORS.neutral_600} />\n          <span>{autofilledMessage}</span>\n        </AutofilledMessage>\n      )}\n    </>\n  );\n};\n\nexport default DropdownFilter;\n"],"file":"DropdownFilter.cjs"}

package/dist/Dropdown/DropdownFilter.js

@@ -145,6 +145,7 @@ var DropdownFilter = function DropdownFilter(_ref) {
       },
       tabIndex: disabled || locked ? -1 : 0,
       disabled: disabled || false,
+      isPlaceholder: !input,
       locked: locked || false,
       showValidationMessage: !!activeValidationMessage,
       fontSize: buttonFontSize,

package/dist/Dropdown/DropdownFilter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Dropdown/DropdownFilter.tsx"],"names":["React","COLORS","ArrowDropDown","ArrowDropUp","Information","TechnicalWarning","LoadingIndicator","StyledField","Dropdown","ButtonDropdownWrapper","InputField","DropdownContent","Size","AutofilledMessage","WarningMessage","DropdownFilter","id","list","placeholder","onSelect","onInputChange","initalValue","required","disableSorting","messageOnNoResults","disabled","locked","scrollable","isButton","activeValidationMessage","autofilledMessage","size","buttonFontSize","keepInitialValue","icon","margin","useState","isOpen","setIsOpen","isLoading","setIsLoading","input","setInput","placeholderSearch","setPlaceholderSearch","restartFilter","setRestartFilter","selectedValues","setSelectedValues","focused","setFocused","styledFieldRef","useRef","inputRef","handleKeyPress","e","current","contains","target","keyCode","matches","filter","c","label","toLowerCase","length","useEffect","some","x","document","addEventListener","removeEventListener","renderStandardDropdown","concat","stopPropagation","focus","Math","floor","random","value","Small","neutral_600","renderButtonDropdown","itemsType","multiSelect","action","onValueUpdate","values","val","items","map","customContent","warning_400"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { COLORS } from '../styles';\nimport { ArrowDropDown, ArrowDropUp, Information, TechnicalWarning } from '../icons/systemicons/SystemIcons';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { StyledField, Dropdown, ButtonDropdownWrapper, InputField } from './CommonStyling';\nimport DropdownContent from './DropdownContent';\nimport { Size } from '../types'\nimport { AutofilledMessage, WarningMessage } from '../InputFields/styling';\n\nexport interface DropdownFilterItem {\n  label: string;\n  customContent?: React.ReactNode;\n}\n\ninterface DropdownFilterProps {\n  id: string;\n  list: DropdownFilterItem[];\n  placeholder?: string;\n  onSelect?: (value: string) => void;\n  onInputChange?: (input: string) => void;\n  initalValue?: string;\n  required?: boolean;\n  disableSorting?: boolean;\n  messageOnNoResults?: string;\n  disabled?: boolean;\n  locked?: boolean;\n  isButton?: boolean;\n  activeValidationMessage?: string;\n  autofilledMessage?: string;\n  size?: Size.Small | Size.Medium;\n  scrollable?: boolean;\n  buttonFontSize?: string;\n  keepInitialValue?: boolean;\n  icon?: React.ReactNode;\n  margin?: string;\n}\n\nconst DropdownFilter = ({\n  id,\n  list,\n  placeholder,\n  onSelect,\n  onInputChange,\n  initalValue,\n  required,\n  disableSorting,\n  messageOnNoResults,\n  disabled,\n  locked,\n  scrollable,\n  isButton,\n  activeValidationMessage,\n  autofilledMessage,\n  size,\n  buttonFontSize,\n  keepInitialValue,\n  icon,\n  margin = '4px 0',\n}: DropdownFilterProps) => {\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [isLoading, setIsLoading] = React.useState<Boolean>(false);\n  const [input, setInput] = React.useState<string>(initalValue ?? '');\n  const [placeholderSearch, setPlaceholderSearch] = React.useState<string>(placeholder || '');\n  const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n  const [focused, setFocused] = React.useState<number | null>(null);\n\n  const styledFieldRef = React.useRef<HTMLDivElement>(null);\n  const inputRef = React.useRef<HTMLInputElement>(null);\n\n  const handleKeyPress = (e: any) => {\n    if (styledFieldRef?.current && styledFieldRef.current.contains(e.target)) {\n      if (e.keyCode === 13 && !locked) {\n        const matches = list?.filter((c) => c.label.toLowerCase() === input.toLowerCase());\n        if (matches.length === 1 && onSelect) {\n          onSelect(matches[0].label);\n          setInput(matches[0].label);\n        }\n        if(!isOpen)\n          setFocused(0);\n        setIsOpen(!isOpen);\n        if (matches.length === 0) {\n          setInput('');\n        }\n      } else if (e.keyCode === 40) {\n        if(!isOpen)\n          setFocused(0);\n        setIsOpen(!isOpen);\n      }\n    }\n  };\n\n  React.useEffect(() => {\n    if (initalValue || initalValue === '') {\n      setInput(initalValue);\n      setRestartFilter(true);\n    }\n  }, [initalValue]);\n\n  React.useEffect(() => {\n    if (!isOpen && !list.some(x => x.label == input)) {\n      setInput('');\n      setPlaceholderSearch(placeholder || '');\n    }\n  }, [isOpen]);\n\n  React.useEffect(() => {\n    document.addEventListener('keypress', handleKeyPress);\n    return () => {\n      document.removeEventListener('keypress', handleKeyPress);\n    };\n  });\n\n  React.useEffect(() => {\n    setIsLoading(false);\n    if (selectedValues.length > 0 && !list.some(x => x.label == input))\n      setSelectedValues([]);\n\n    if(list.some(x => x.label == input))\n    {\n      setSelectedValues([input]);\n      onSelect && onSelect(input);\n    }\n  }, [input]);\n\n\n  const renderStandardDropdown = () => {\n    return (\n      <StyledField\n        ref={styledFieldRef}\n        className={(isOpen ? 'expanded ' : '').concat(size ? size : '')}\n        onClick={(e: any) => {\n          e.stopPropagation();\n          setIsOpen(!isOpen);\n          inputRef.current?.focus();\n        }}\n        tabIndex={disabled || locked ? -1 : 0}\n        disabled={disabled || false}\n        locked={locked || false}\n        showValidationMessage={!!activeValidationMessage}\n        fontSize={buttonFontSize}\n        data-testid={`otherdiv_${id}`}>\n        <InputField\n          ref={inputRef}\n          autoComplete={'off-' + Math.floor(Math.random() * 999999999999)}\n          type=\"search\"\n          placeholder={placeholderSearch}\n          value={input}\n          className={size ? `${size} value` : 'value'}\n          onChange={(e: any) => {\n            if (!locked && !disabled) {\n              setRestartFilter(false);\n              setIsLoading(true);\n              setIsOpen(true);\n              setInput(e.target.value);\n              if (onInputChange) {\n                onInputChange(e.target.value || '');\n              }\n            }\n          }}\n          onClick={(e: any) => {\n            if (!locked && !disabled) {\n              e.stopPropagation();\n              setIsOpen(!isOpen);\n            }\n          }}\n          onFocus={() => setPlaceholderSearch('')}\n          onBlur={() => setPlaceholderSearch(placeholder || '')}\n          required={required}\n          tabIndex={disabled || locked ? -1 : 0}\n          disabled={disabled || false}\n        />\n\n        {isLoading ? <LoadingIndicator size={Size.Small} color={COLORS.neutral_600} /> : null}\n\n        <div onClick={() => setIsOpen(!isOpen)} className={'dropdown-arrow'}>\n          {isOpen && !locked && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''} /> : <ArrowDropDown size=\"24px\" className={size ? size : ''} />}\n        </div>\n      </StyledField>\n    );\n  };\n\n  const renderButtonDropdown = () => (\n    <ButtonDropdownWrapper\n      onClick={(e: any) => {\n        e.stopPropagation();\n        setIsOpen(!isOpen);\n        inputRef.current?.focus();\n      }}\n      disabled={disabled}\n      locked={locked}>\n      <StyledField\n        ref={styledFieldRef}\n        className={(isOpen ? 'expanded ' : '').concat(size ? size + ' ' : '').concat(isButton ? 'button' : '')}\n        tabIndex={disabled || locked ? -1 : 0}\n        disabled={disabled || false}\n        locked={locked || false}\n        showValidationMessage={!!activeValidationMessage}\n        fontSize={buttonFontSize}>\n        {icon}\n        <div className={'value'}>{initalValue && keepInitialValue ? initalValue : input || placeholderSearch}</div>\n        {isLoading ? <LoadingIndicator size={Size.Small} color={COLORS.neutral_600} /> : null}\n        <div onClick={() => setIsOpen(!isOpen)} className={'dropdown-arrow'}>\n          {isOpen && !locked && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''} /> : <ArrowDropDown size=\"24px\" className={size ? size : ''} />}\n        </div>\n      </StyledField>\n    </ButtonDropdownWrapper>\n  );\n\n  return (\n    <>\n      <Dropdown isButton={isButton || false} disabled={disabled} locked={locked} className={size ? size : ''} margin={margin}>\n        {!isButton && renderStandardDropdown()}\n        {!!isButton && renderButtonDropdown()}\n        {!locked && !disabled && (\n          <DropdownContent\n          isOpen={isOpen}\n          messageOnNoResults={messageOnNoResults ?? ''}\n          selectedValues={selectedValues}\n          setSelectedValues={setSelectedValues}\n          hideOnClickOutside={true}\n          size={size ?? Size.Small}\n          focused={focused}\n          setFocused={setFocused}\n          customizationProps={{\n            itemsType: 'normal',\n            scrollable: scrollable,\n            multiSelect: false,\n            action: () => {},\n            onValueUpdate: (values: string[]) => {\n              const val = values[0] ?? '';\n              setRestartFilter(true);\n              setInput(val);\n            },\n            items: list.map(x => ({ value: x.label, customContent: x.customContent }))\n          }}\n          filter={!restartFilter ? input : ''}\n          setIsOpen={setIsOpen}\n          alignLeft={false}\n          isButton={isButton || false}\n          id={`${id}_dropdowncontent`} />\n        )}\n      </Dropdown>\n      {activeValidationMessage && (\n        <WarningMessage className={size || ''}>\n          <TechnicalWarning size=\"20px\" color={COLORS.warning_400} />\n          <span>{activeValidationMessage}</span>\n        </WarningMessage>\n      )}\n      {autofilledMessage && (\n        <AutofilledMessage className={size || ''}>\n          <Information size=\"20px\" color={COLORS.neutral_600} />\n          <span>{autofilledMessage}</span>\n        </AutofilledMessage>\n      )}\n    </>\n  );\n};\n\nexport default DropdownFilter;\n"],"file":"DropdownFilter.js"}
+{"version":3,"sources":["../../src/Dropdown/DropdownFilter.tsx"],"names":["React","COLORS","ArrowDropDown","ArrowDropUp","Information","TechnicalWarning","LoadingIndicator","StyledField","Dropdown","ButtonDropdownWrapper","InputField","DropdownContent","Size","AutofilledMessage","WarningMessage","DropdownFilter","id","list","placeholder","onSelect","onInputChange","initalValue","required","disableSorting","messageOnNoResults","disabled","locked","scrollable","isButton","activeValidationMessage","autofilledMessage","size","buttonFontSize","keepInitialValue","icon","margin","useState","isOpen","setIsOpen","isLoading","setIsLoading","input","setInput","placeholderSearch","setPlaceholderSearch","restartFilter","setRestartFilter","selectedValues","setSelectedValues","focused","setFocused","styledFieldRef","useRef","inputRef","handleKeyPress","e","current","contains","target","keyCode","matches","filter","c","label","toLowerCase","length","useEffect","some","x","document","addEventListener","removeEventListener","renderStandardDropdown","concat","stopPropagation","focus","Math","floor","random","value","Small","neutral_600","renderButtonDropdown","itemsType","multiSelect","action","onValueUpdate","values","val","items","map","customContent","warning_400"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { COLORS } from '../styles';\nimport { ArrowDropDown, ArrowDropUp, Information, TechnicalWarning } from '../icons/systemicons/SystemIcons';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { StyledField, Dropdown, ButtonDropdownWrapper, InputField } from './CommonStyling';\nimport DropdownContent from './DropdownContent';\nimport { Size } from '../types'\nimport { AutofilledMessage, WarningMessage } from '../InputFields/styling';\n\nexport interface DropdownFilterItem {\n  label: string;\n  customContent?: React.ReactNode;\n}\n\ninterface DropdownFilterProps {\n  id: string;\n  list: DropdownFilterItem[];\n  placeholder?: string;\n  onSelect?: (value: string) => void;\n  onInputChange?: (input: string) => void;\n  initalValue?: string;\n  required?: boolean;\n  disableSorting?: boolean;\n  messageOnNoResults?: string;\n  disabled?: boolean;\n  locked?: boolean;\n  isButton?: boolean;\n  activeValidationMessage?: string;\n  autofilledMessage?: string;\n  size?: Size.Small | Size.Medium;\n  scrollable?: boolean;\n  buttonFontSize?: string;\n  keepInitialValue?: boolean;\n  icon?: React.ReactNode;\n  margin?: string;\n}\n\nconst DropdownFilter = ({\n  id,\n  list,\n  placeholder,\n  onSelect,\n  onInputChange,\n  initalValue,\n  required,\n  disableSorting,\n  messageOnNoResults,\n  disabled,\n  locked,\n  scrollable,\n  isButton,\n  activeValidationMessage,\n  autofilledMessage,\n  size,\n  buttonFontSize,\n  keepInitialValue,\n  icon,\n  margin = '4px 0',\n}: DropdownFilterProps) => {\n  const [isOpen, setIsOpen] = React.useState<boolean>(false);\n  const [isLoading, setIsLoading] = React.useState<Boolean>(false);\n  const [input, setInput] = React.useState<string>(initalValue ?? '');\n  const [placeholderSearch, setPlaceholderSearch] = React.useState<string>(placeholder || '');\n  const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);\n  const [focused, setFocused] = React.useState<number | null>(null);\n\n  const styledFieldRef = React.useRef<HTMLDivElement>(null);\n  const inputRef = React.useRef<HTMLInputElement>(null);\n\n  const handleKeyPress = (e: any) => {\n    if (styledFieldRef?.current && styledFieldRef.current.contains(e.target)) {\n      if (e.keyCode === 13 && !locked) {\n        const matches = list?.filter((c) => c.label.toLowerCase() === input.toLowerCase());\n        if (matches.length === 1 && onSelect) {\n          onSelect(matches[0].label);\n          setInput(matches[0].label);\n        }\n        if(!isOpen)\n          setFocused(0);\n        setIsOpen(!isOpen);\n        if (matches.length === 0) {\n          setInput('');\n        }\n      } else if (e.keyCode === 40) {\n        if(!isOpen)\n          setFocused(0);\n        setIsOpen(!isOpen);\n      }\n    }\n  };\n\n  React.useEffect(() => {\n    if (initalValue || initalValue === '') {\n      setInput(initalValue);\n      setRestartFilter(true);\n    }\n  }, [initalValue]);\n\n  React.useEffect(() => {\n    if (!isOpen && !list.some(x => x.label == input)) {\n      setInput('');\n      setPlaceholderSearch(placeholder || '');\n    }\n  }, [isOpen]);\n\n  React.useEffect(() => {\n    document.addEventListener('keypress', handleKeyPress);\n    return () => {\n      document.removeEventListener('keypress', handleKeyPress);\n    };\n  });\n\n  React.useEffect(() => {\n    setIsLoading(false);\n    if (selectedValues.length > 0 && !list.some(x => x.label == input))\n      setSelectedValues([]);\n\n    if(list.some(x => x.label == input))\n    {\n      setSelectedValues([input]);\n      onSelect && onSelect(input);\n    }\n  }, [input]);\n\n\n  const renderStandardDropdown = () => {\n    return (\n      <StyledField\n        ref={styledFieldRef}\n        className={(isOpen ? 'expanded ' : '').concat(size ? size : '')}\n        onClick={(e: any) => {\n          e.stopPropagation();\n          setIsOpen(!isOpen);\n          inputRef.current?.focus();\n        }}\n        tabIndex={disabled || locked ? -1 : 0}\n        disabled={disabled || false}\n        isPlaceholder={!input}\n        locked={locked || false}\n        showValidationMessage={!!activeValidationMessage}\n        fontSize={buttonFontSize}\n        data-testid={`otherdiv_${id}`}>\n        <InputField\n          ref={inputRef}\n          autoComplete={'off-' + Math.floor(Math.random() * 999999999999)}\n          type=\"search\"\n          placeholder={placeholderSearch}\n          value={input}\n          className={size ? `${size} value` : 'value'}\n          onChange={(e: any) => {\n            if (!locked && !disabled) {\n              setRestartFilter(false);\n              setIsLoading(true);\n              setIsOpen(true);\n              setInput(e.target.value);\n              if (onInputChange) {\n                onInputChange(e.target.value || '');\n              }\n            }\n          }}\n          onClick={(e: any) => {\n            if (!locked && !disabled) {\n              e.stopPropagation();\n              setIsOpen(!isOpen);\n            }\n          }}\n          onFocus={() => setPlaceholderSearch('')}\n          onBlur={() => setPlaceholderSearch(placeholder || '')}\n          required={required}\n          tabIndex={disabled || locked ? -1 : 0}\n          disabled={disabled || false}\n        />\n\n        {isLoading ? <LoadingIndicator size={Size.Small} color={COLORS.neutral_600} /> : null}\n\n        <div onClick={() => setIsOpen(!isOpen)} className={'dropdown-arrow'}>\n          {isOpen && !locked && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''} /> : <ArrowDropDown size=\"24px\" className={size ? size : ''} />}\n        </div>\n      </StyledField>\n    );\n  };\n\n  const renderButtonDropdown = () => (\n    <ButtonDropdownWrapper\n      onClick={(e: any) => {\n        e.stopPropagation();\n        setIsOpen(!isOpen);\n        inputRef.current?.focus();\n      }}\n      disabled={disabled}\n      locked={locked}>\n      <StyledField\n        ref={styledFieldRef}\n        className={(isOpen ? 'expanded ' : '').concat(size ? size + ' ' : '').concat(isButton ? 'button' : '')}\n        tabIndex={disabled || locked ? -1 : 0}\n        disabled={disabled || false}\n        locked={locked || false}\n        showValidationMessage={!!activeValidationMessage}\n        fontSize={buttonFontSize}>\n        {icon}\n        <div className={'value'}>{initalValue && keepInitialValue ? initalValue : input || placeholderSearch}</div>\n        {isLoading ? <LoadingIndicator size={Size.Small} color={COLORS.neutral_600} /> : null}\n        <div onClick={() => setIsOpen(!isOpen)} className={'dropdown-arrow'}>\n          {isOpen && !locked && !disabled ? <ArrowDropUp size=\"24px\" className={size ? size : ''} /> : <ArrowDropDown size=\"24px\" className={size ? size : ''} />}\n        </div>\n      </StyledField>\n    </ButtonDropdownWrapper>\n  );\n\n  return (\n    <>\n      <Dropdown isButton={isButton || false} disabled={disabled} locked={locked} className={size ? size : ''} margin={margin}>\n        {!isButton && renderStandardDropdown()}\n        {!!isButton && renderButtonDropdown()}\n        {!locked && !disabled && (\n          <DropdownContent\n          isOpen={isOpen}\n          messageOnNoResults={messageOnNoResults ?? ''}\n          selectedValues={selectedValues}\n          setSelectedValues={setSelectedValues}\n          hideOnClickOutside={true}\n          size={size ?? Size.Small}\n          focused={focused}\n          setFocused={setFocused}\n          customizationProps={{\n            itemsType: 'normal',\n            scrollable: scrollable,\n            multiSelect: false,\n            action: () => {},\n            onValueUpdate: (values: string[]) => {\n              const val = values[0] ?? '';\n              setRestartFilter(true);\n              setInput(val);\n            },\n            items: list.map(x => ({ value: x.label, customContent: x.customContent }))\n          }}\n          filter={!restartFilter ? input : ''}\n          setIsOpen={setIsOpen}\n          alignLeft={false}\n          isButton={isButton || false}\n          id={`${id}_dropdowncontent`} />\n        )}\n      </Dropdown>\n      {activeValidationMessage && (\n        <WarningMessage className={size || ''}>\n          <TechnicalWarning size=\"20px\" color={COLORS.warning_400} />\n          <span>{activeValidationMessage}</span>\n        </WarningMessage>\n      )}\n      {autofilledMessage && (\n        <AutofilledMessage className={size || ''}>\n          <Information size=\"20px\" color={COLORS.neutral_600} />\n          <span>{autofilledMessage}</span>\n        </AutofilledMessage>\n      )}\n    </>\n  );\n};\n\nexport default DropdownFilter;\n"],"file":"DropdownFilter.js"}

package/dist/Dropdown/index.cjs

@@ -23,6 +23,12 @@ Object.defineProperty(exports, "DropdownButton", {
     return _DropdownButton.default;
   }
 });
+Object.defineProperty(exports, "DropdownContent", {
+  enumerable: true,
+  get: function get() {
+    return _DropdownContent.default;
+  }
+});
 Object.defineProperty(exports, "DropdownFilter", {
   enumerable: true,
   get: function get() {
@@ -37,4 +43,6 @@ var _BasicDropdown = _interopRequireDefault(require("./BasicDropdown"));
 var _DropdownButton = _interopRequireDefault(require("./DropdownButton"));
 
 var _ChipDropdownInput = _interopRequireDefault(require("./ChipDropdownInput"));
+
+var _DropdownContent = _interopRequireDefault(require("./DropdownContent"));
 //# sourceMappingURL=index.cjs.map

package/dist/Dropdown/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Dropdown/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA","sourcesContent":["import DropdownFilter from './DropdownFilter';\nimport BasicDropdown from './BasicDropdown';\nimport DropdownButton from './DropdownButton';\nimport ChipDropdownInput from './ChipDropdownInput';\n\nexport type {DropdownItem} from './DropdownContent'\n\nexport { DropdownFilter, BasicDropdown, DropdownButton, ChipDropdownInput };\n"],"file":"index.cjs"}
+{"version":3,"sources":["../../src/Dropdown/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA","sourcesContent":["import DropdownFilter from './DropdownFilter';\nimport BasicDropdown from './BasicDropdown';\nimport DropdownButton from './DropdownButton';\nimport ChipDropdownInput from './ChipDropdownInput';\nimport DropdownContent from './DropdownContent';\n\nexport type {DropdownItem} from './DropdownContent'\n\n\nexport { DropdownFilter, BasicDropdown, DropdownButton, ChipDropdownInput, DropdownContent };\n"],"file":"index.cjs"}

package/dist/Dropdown/index.d.ts

@@ -2,5 +2,6 @@ import DropdownFilter from './DropdownFilter';
 import BasicDropdown from './BasicDropdown';
 import DropdownButton from './DropdownButton';
 import ChipDropdownInput from './ChipDropdownInput';
+import DropdownContent from './DropdownContent';
 export type { DropdownItem } from './DropdownContent';
-export { DropdownFilter, BasicDropdown, DropdownButton, ChipDropdownInput };
+export { DropdownFilter, BasicDropdown, DropdownButton, ChipDropdownInput, DropdownContent };

package/dist/Dropdown/index.js

@@ -2,5 +2,6 @@ import DropdownFilter from './DropdownFilter';
 import BasicDropdown from './BasicDropdown';
 import DropdownButton from './DropdownButton';
 import ChipDropdownInput from './ChipDropdownInput';
-export { DropdownFilter, BasicDropdown, DropdownButton, ChipDropdownInput };
+import DropdownContent from './DropdownContent';
+export { DropdownFilter, BasicDropdown, DropdownButton, ChipDropdownInput, DropdownContent };
 //# sourceMappingURL=index.js.map

package/dist/Dropdown/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Dropdown/index.ts"],"names":["DropdownFilter","BasicDropdown","DropdownButton","ChipDropdownInput"],"mappings":"AAAA,OAAOA,cAAP,MAA2B,kBAA3B;AACA,OAAOC,aAAP,MAA0B,iBAA1B;AACA,OAAOC,cAAP,MAA2B,kBAA3B;AACA,OAAOC,iBAAP,MAA8B,qBAA9B;AAIA,SAASH,cAAT,EAAyBC,aAAzB,EAAwCC,cAAxC,EAAwDC,iBAAxD","sourcesContent":["import DropdownFilter from './DropdownFilter';\nimport BasicDropdown from './BasicDropdown';\nimport DropdownButton from './DropdownButton';\nimport ChipDropdownInput from './ChipDropdownInput';\n\nexport type {DropdownItem} from './DropdownContent'\n\nexport { DropdownFilter, BasicDropdown, DropdownButton, ChipDropdownInput };\n"],"file":"index.js"}
+{"version":3,"sources":["../../src/Dropdown/index.ts"],"names":["DropdownFilter","BasicDropdown","DropdownButton","ChipDropdownInput","DropdownContent"],"mappings":"AAAA,OAAOA,cAAP,MAA2B,kBAA3B;AACA,OAAOC,aAAP,MAA0B,iBAA1B;AACA,OAAOC,cAAP,MAA2B,kBAA3B;AACA,OAAOC,iBAAP,MAA8B,qBAA9B;AACA,OAAOC,eAAP,MAA4B,mBAA5B;AAKA,SAASJ,cAAT,EAAyBC,aAAzB,EAAwCC,cAAxC,EAAwDC,iBAAxD,EAA2EC,eAA3E","sourcesContent":["import DropdownFilter from './DropdownFilter';\nimport BasicDropdown from './BasicDropdown';\nimport DropdownButton from './DropdownButton';\nimport ChipDropdownInput from './ChipDropdownInput';\nimport DropdownContent from './DropdownContent';\n\nexport type {DropdownItem} from './DropdownContent'\n\n\nexport { DropdownFilter, BasicDropdown, DropdownButton, ChipDropdownInput, DropdownContent };\n"],"file":"index.js"}

package/dist/LinearProgression/LinearProgression.cjs

@@ -0,0 +1,132 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.LinearProgressionVariant = exports.LinearProgressionType = exports.LineFill = exports.Line = exports.Dot = exports.Bar = void 0;
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _types = require("../types");
+
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+
+var _styles = require("../styles");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+
+var Bar = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  flex: 1;\n  height: 6px;\n\n  &.small {\n    height: 6px;\n  }\n\n  &.medium {\n    height: 8px;\n  }\n\n  &.large {\n    height: 12px;\n  }\n\n  background-color: ", ";\n\n  &.active {\n    background-color: ", ";\n  }\n\n  &.current {\n    background-color: ", ";\n  }\n\n  &.inverted {\n    background-color: ", ";\n  }\n\n  &.inverted.active {\n    background-color: ", ";\n  }\n\n  &.inverted.current {\n    background-color: ", ";\n  }\n\n"])), _styles.COLORS.neutral_100, _styles.COLORS.accent1_400, _styles.COLORS.accent1_800, _styles.COLORS.neutral_600, _styles.COLORS.accent1_400, _styles.COLORS.white);
+
+exports.Bar = Bar;
+
+var Dot = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n\n\n  &:after {\n    content: '';\n    display: block;\n    width: 6px;\n    height: 6px;\n    border-radius: 50%;\n    background-color: ", ";\n  }\n\n  &.small {\n    &:after {\n      width: 6px;\n      height: 6px;\n    }\n\n    &.current:after {\n      width: 10px;\n      height: 10px;\n    }\n  }\n\n  &.medium {\n    &:after {\n      width: 8px;\n      height: 8px;\n    }\n\n    &.current:after {\n      width: 12px;\n      height: 12px;\n    }\n  }\n\n  &.large {\n    &:after {\n      width: 12px;\n      height: 12px;\n    }\n\n    &.current:after {\n      width: 16px;\n      height: 16px;\n    }\n  }\n\n\n  &.active:after {\n    background-color: ", ";\n  }\n\n  &.current:after {\n    background-color: ", ";\n  }\n\n  &.inverted:after {\n    background-color: ", ";\n  }\n\n  &.inverted.active:after {\n    background-color: ", ";\n  }\n\n  &.inverted.current:after {\n    background-color: ", ";\n  }\n"])), _styles.COLORS.neutral_400, _styles.COLORS.accent1_600, _styles.COLORS.accent1_800, _styles.COLORS.neutral_400, _styles.COLORS.accent1_400, _styles.COLORS.white);
+
+exports.Dot = Dot;
+
+var LineFill = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  height: 100%;\n  max-width: 100%;\n  position: absolute;\n  z-index: 1;\n"])));
+
+exports.LineFill = LineFill;
+
+var Line = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  flex: 1;\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  position: relative;\n\n  &:after {\n    content: '';\n    display: block;\n    height: 100%;\n    background-color: ", ";\n    position: absolute;\n    right: 0;\n  }\n\n  &:before {\n    content: '';\n    display: block;\n    height: 100%;\n    background-color: ", ";\n    position: absolute;\n    left: 0;\n  }\n\n  &.small {\n    height: 6px;\n    border-radius: 4px;\n\n    ", " {\n      border-radius: 4px;\n    }\n\n    &:after {\n      width: 3px;\n      border-top-right-radius: 6px;\n      border-bottom-right-radius: 6px;\n    }\n\n    &:before {\n      width: 3px;\n      border-top-left-radius: 6px;\n      border-bottom-left-radius: 6px;\n    }\n  }\n\n  &.medium {\n    height: 8px;\n    border-radius: 4px;\n\n    ", " {\n      border-radius: 4px;\n    }\n\n    &:after {\n      width: 4px;\n      border-top-right-radius: 8px;\n      border-bottom-right-radius: 8px;\n    }\n\n    &:before {\n      width: 4px;\n      border-top-left-radius: 8px;\n      border-bottom-left-radius: 8px;\n    }\n  }\n\n  &.large {\n    height: 12px;\n    border-radius: 6px;\n\n    ", " {\n      border-radius: 6px;\n    }\n\n    &:after {\n      width: 6px;\n      border-top-right-radius: 12px;\n      border-bottom-right-radius: 12px;\n    }\n\n    &:before {\n      width: 6px;\n      border-top-left-radius: 12px;\n      border-bottom-left-radius: 12px;\n    }\n  }\n\n  background-color: ", ";\n\n  ", " {\n    background-color: ", ";\n  }\n\n  &.inverted {\n    background-color: ", ";\n\n    &:after,\n    &:before {\n      background-color: ", ";\n    }\n\n    ", " {\n      background-color: ", ";\n    }\n  }\n"])), _styles.COLORS.neutral_500, _styles.COLORS.neutral_500, LineFill, LineFill, LineFill, _styles.COLORS.neutral_100, LineFill, _styles.COLORS.accent1_500, _styles.COLORS.neutral_700, _styles.COLORS.neutral_400, LineFill, _styles.COLORS.accent1_400);
+
+exports.Line = Line;
+
+var Wrapper = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  display: flex;\n  align-items: center;\n  flex-direction: row;\n  gap: 4px;\n  height: 16px;\n\n  &.small {\n    gap: 4px;\n\n    ", ":first-of-type {\n      border-top-left-radius: 6px;\n      border-bottom-left-radius: 6px;\n    }\n\n    ", ":last-of-type {\n      border-top-right-radius: 6px;\n      border-bottom-right-radius: 6px;\n    }\n\n  }\n\n  &.medium {\n    gap: 6px;\n\n    ", ":first-of-type {\n      border-top-left-radius: 8px;\n      border-bottom-left-radius: 8px;\n    }\n\n    ", ":last-of-type {\n      border-top-right-radius: 8px;\n      border-bottom-right-radius: 8px;\n    }\n  }\n\n  &.large {\n    gap: 8px;\n\n    ", ":first-of-type {\n      border-top-left-radius: 12px;\n      border-bottom-left-radius: 12px;\n    }\n\n    ", ":last-of-type {\n      border-top-right-radius: 12px;\n      border-bottom-right-radius: 12px;\n    }\n  }\n"])), Bar, Bar, Bar, Bar, Bar, Bar);
+
+var LinearProgressionType;
+exports.LinearProgressionType = LinearProgressionType;
+
+(function (LinearProgressionType) {
+  LinearProgressionType["Dots"] = "dots";
+  LinearProgressionType["Line"] = "line";
+  LinearProgressionType["Bars"] = "bars";
+})(LinearProgressionType || (exports.LinearProgressionType = LinearProgressionType = {}));
+
+var LinearProgressionVariant;
+exports.LinearProgressionVariant = LinearProgressionVariant;
+
+(function (LinearProgressionVariant) {
+  LinearProgressionVariant["Normal"] = "normal";
+  LinearProgressionVariant["Inverted"] = "inverted";
+})(LinearProgressionVariant || (exports.LinearProgressionVariant = LinearProgressionVariant = {}));
+
+var LinearProgression = function LinearProgression(_ref) {
+  var _ref$size = _ref.size,
+      size = _ref$size === void 0 ? _types.Size.Medium : _ref$size,
+      _ref$type = _ref.type,
+      type = _ref$type === void 0 ? LinearProgressionType.Line : _ref$type,
+      _ref$variant = _ref.variant,
+      variant = _ref$variant === void 0 ? LinearProgressionVariant.Normal : _ref$variant,
+      value = _ref.value,
+      max = _ref.max;
+
+  var renderBars = function renderBars() {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: Array.from(Array(max).keys()).map(function (i) {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(Bar, {
+          className: "".concat(Math.ceil(value) >= i + 1 ? 'active' : '', " ").concat(Math.ceil(value) === i + 1 ? 'current' : '', " ").concat(variant, " ").concat(size)
+        }, i);
+      })
+    });
+  };
+
+  var renderDots = function renderDots() {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: Array.from(Array(max).keys()).map(function (i) {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(Dot, {
+          className: "".concat(Math.ceil(value) >= i + 1 ? 'active' : '', " ").concat(Math.ceil(value) === i + 1 ? 'current' : '', " ").concat(variant, " ").concat(size)
+        }, i);
+      })
+    });
+  };
+
+  var renderLine = function renderLine() {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Line, {
+        className: "".concat(variant, " ").concat(size),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(LineFill, {
+          style: {
+            width: "".concat(value / max * 100, "%")
+          }
+        })
+      })
+    });
+  };
+
+  var render = function render() {
+    switch (type) {
+      case LinearProgressionType.Bars:
+        return renderBars();
+
+      case LinearProgressionType.Dots:
+        return renderDots();
+
+      case LinearProgressionType.Line:
+      default:
+        return renderLine();
+    }
+  };
+
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Wrapper, {
+    className: "".concat(size, " ").concat(type, " ").concat(variant),
+    children: render()
+  });
+};
+
+LinearProgression.propTypes = {
+  type: _propTypes.default.oneOf(["dots", "line", "bars"]),
+  variant: _propTypes.default.oneOf(["normal", "inverted"]),
+  value: _propTypes.default.number.isRequired,
+  max: _propTypes.default.number.isRequired
+};
+var _default = LinearProgression;
+exports.default = _default;
+//# sourceMappingURL=LinearProgression.cjs.map

package/dist/LinearProgression/LinearProgression.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/LinearProgression/LinearProgression.tsx"],"names":["Bar","styled","div","COLORS","neutral_100","accent1_400","accent1_800","neutral_600","white","Dot","neutral_400","accent1_600","LineFill","Line","neutral_500","accent1_500","neutral_700","Wrapper","LinearProgressionType","LinearProgressionVariant","LinearProgression","size","Size","Medium","type","variant","Normal","value","max","renderBars","Array","from","keys","map","i","Math","ceil","renderDots","renderLine","width","render","Bars","Dots"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {Size} from '../types';\nimport styled from 'styled-components';\nimport {COLORS} from '../styles';\n\nexport const Bar = styled.div`\n  flex: 1;\n  height: 6px;\n\n  &.small {\n    height: 6px;\n  }\n\n  &.medium {\n    height: 8px;\n  }\n\n  &.large {\n    height: 12px;\n  }\n\n  background-color: ${COLORS.neutral_100};\n\n  &.active {\n    background-color: ${COLORS.accent1_400};\n  }\n\n  &.current {\n    background-color: ${COLORS.accent1_800};\n  }\n\n  &.inverted {\n    background-color: ${COLORS.neutral_600};\n  }\n\n  &.inverted.active {\n    background-color: ${COLORS.accent1_400};\n  }\n\n  &.inverted.current {\n    background-color: ${COLORS.white};\n  }\n\n`;\n\nexport const Dot = styled.div`\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n\n\n  &:after {\n    content: '';\n    display: block;\n    width: 6px;\n    height: 6px;\n    border-radius: 50%;\n    background-color: ${COLORS.neutral_400};\n  }\n\n  &.small {\n    &:after {\n      width: 6px;\n      height: 6px;\n    }\n\n    &.current:after {\n      width: 10px;\n      height: 10px;\n    }\n  }\n\n  &.medium {\n    &:after {\n      width: 8px;\n      height: 8px;\n    }\n\n    &.current:after {\n      width: 12px;\n      height: 12px;\n    }\n  }\n\n  &.large {\n    &:after {\n      width: 12px;\n      height: 12px;\n    }\n\n    &.current:after {\n      width: 16px;\n      height: 16px;\n    }\n  }\n\n\n  &.active:after {\n    background-color: ${COLORS.accent1_600};\n  }\n\n  &.current:after {\n    background-color: ${COLORS.accent1_800};\n  }\n\n  &.inverted:after {\n    background-color: ${COLORS.neutral_400};\n  }\n\n  &.inverted.active:after {\n    background-color: ${COLORS.accent1_400};\n  }\n\n  &.inverted.current:after {\n    background-color: ${COLORS.white};\n  }\n`;\n\nexport const LineFill = styled.div`\n  height: 100%;\n  max-width: 100%;\n  position: absolute;\n  z-index: 1;\n`;\n\nexport const Line = styled.div`\n  flex: 1;\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  position: relative;\n\n  &:after {\n    content: '';\n    display: block;\n    height: 100%;\n    background-color: ${COLORS.neutral_500};\n    position: absolute;\n    right: 0;\n  }\n\n  &:before {\n    content: '';\n    display: block;\n    height: 100%;\n    background-color: ${COLORS.neutral_500};\n    position: absolute;\n    left: 0;\n  }\n\n  &.small {\n    height: 6px;\n    border-radius: 4px;\n\n    ${LineFill} {\n      border-radius: 4px;\n    }\n\n    &:after {\n      width: 3px;\n      border-top-right-radius: 6px;\n      border-bottom-right-radius: 6px;\n    }\n\n    &:before {\n      width: 3px;\n      border-top-left-radius: 6px;\n      border-bottom-left-radius: 6px;\n    }\n  }\n\n  &.medium {\n    height: 8px;\n    border-radius: 4px;\n\n    ${LineFill} {\n      border-radius: 4px;\n    }\n\n    &:after {\n      width: 4px;\n      border-top-right-radius: 8px;\n      border-bottom-right-radius: 8px;\n    }\n\n    &:before {\n      width: 4px;\n      border-top-left-radius: 8px;\n      border-bottom-left-radius: 8px;\n    }\n  }\n\n  &.large {\n    height: 12px;\n    border-radius: 6px;\n\n    ${LineFill} {\n      border-radius: 6px;\n    }\n\n    &:after {\n      width: 6px;\n      border-top-right-radius: 12px;\n      border-bottom-right-radius: 12px;\n    }\n\n    &:before {\n      width: 6px;\n      border-top-left-radius: 12px;\n      border-bottom-left-radius: 12px;\n    }\n  }\n\n  background-color: ${COLORS.neutral_100};\n\n  ${LineFill} {\n    background-color: ${COLORS.accent1_500};\n  }\n\n  &.inverted {\n    background-color: ${COLORS.neutral_700};\n\n    &:after,\n    &:before {\n      background-color: ${COLORS.neutral_400};\n    }\n\n    ${LineFill} {\n      background-color: ${COLORS.accent1_400};\n    }\n  }\n`;\n\nconst Wrapper = styled.div`\n  width: 100%;\n  display: flex;\n  align-items: center;\n  flex-direction: row;\n  gap: 4px;\n  height: 16px;\n\n  &.small {\n    gap: 4px;\n\n    ${Bar}:first-of-type {\n      border-top-left-radius: 6px;\n      border-bottom-left-radius: 6px;\n    }\n\n    ${Bar}:last-of-type {\n      border-top-right-radius: 6px;\n      border-bottom-right-radius: 6px;\n    }\n\n  }\n\n  &.medium {\n    gap: 6px;\n\n    ${Bar}:first-of-type {\n      border-top-left-radius: 8px;\n      border-bottom-left-radius: 8px;\n    }\n\n    ${Bar}:last-of-type {\n      border-top-right-radius: 8px;\n      border-bottom-right-radius: 8px;\n    }\n  }\n\n  &.large {\n    gap: 8px;\n\n    ${Bar}:first-of-type {\n      border-top-left-radius: 12px;\n      border-bottom-left-radius: 12px;\n    }\n\n    ${Bar}:last-of-type {\n      border-top-right-radius: 12px;\n      border-bottom-right-radius: 12px;\n    }\n  }\n`;\n\nexport enum LinearProgressionType {\n  Dots = 'dots',\n  Line = 'line',\n  Bars = 'bars',\n}\n\nexport enum LinearProgressionVariant {\n  Normal = 'normal',\n  Inverted = 'inverted',\n}\n\nexport interface LinearProgressionProps {\n  size?: Size.Small | Size.Medium | Size.Large;\n  type?: LinearProgressionType;\n  variant?: LinearProgressionVariant;\n\n  value: number;\n  max: number;\n}\n\nconst LinearProgression: React.FunctionComponent<LinearProgressionProps> = ({\n                                                                              size = Size.Medium,\n                                                                              type = LinearProgressionType.Line,\n                                                                              variant = LinearProgressionVariant.Normal,\n                                                                              value,\n                                                                              max\n                                                                            }) => {\n\n  const renderBars = () => (\n    <>\n      {Array.from(Array(max).keys()).map(i => (\n        <Bar key={i}\n             className={`${Math.ceil(value) >= i + 1 ? 'active' : ''} ${Math.ceil(value) === i + 1 ? 'current' : ''} ${variant} ${size}`}/>\n      ))}\n    </>\n  )\n\n\n  const renderDots = () =>\n    <>\n      {Array.from(Array(max).keys()).map(i => (\n        <Dot key={i}\n             className={`${Math.ceil(value) >= i + 1 ? 'active' : ''} ${Math.ceil(value) === i + 1 ? 'current' : ''} ${variant} ${size}`}/>\n      ))}\n    </>\n\n  const renderLine = () =>\n    <>\n      <Line className={`${variant} ${size}`}>\n        <LineFill style={{width: `${value / max * 100}%`}}/>\n      </Line>\n    </>\n\n\n  const render = () => {\n    switch (type) {\n      case LinearProgressionType.Bars:\n        return renderBars();\n      case LinearProgressionType.Dots:\n        return renderDots();\n      case LinearProgressionType.Line:\n      default:\n        return renderLine();\n    }\n  }\n\n  return (\n    <Wrapper className={`${size} ${type} ${variant}`}>\n      {render()}\n    </Wrapper>\n  )\n};\n\nexport default LinearProgression;\n"],"file":"LinearProgression.cjs"}

package/dist/LinearProgression/LinearProgression.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+import { Size } from '../types';
+export declare const Bar: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const Dot: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const LineFill: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const Line: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare enum LinearProgressionType {
+    Dots = "dots",
+    Line = "line",
+    Bars = "bars"
+}
+export declare enum LinearProgressionVariant {
+    Normal = "normal",
+    Inverted = "inverted"
+}
+export interface LinearProgressionProps {
+    size?: Size.Small | Size.Medium | Size.Large;
+    type?: LinearProgressionType;
+    variant?: LinearProgressionVariant;
+    value: number;
+    max: number;
+}
+declare const LinearProgression: React.FunctionComponent<LinearProgressionProps>;
+export default LinearProgression;

package/dist/LinearProgression/LinearProgression.js

@@ -0,0 +1,102 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
+import _pt from "prop-types";
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+
+import React from 'react';
+import { Size } from '../types';
+import styled from 'styled-components';
+import { COLORS } from '../styles';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+export var Bar = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  flex: 1;\n  height: 6px;\n\n  &.small {\n    height: 6px;\n  }\n\n  &.medium {\n    height: 8px;\n  }\n\n  &.large {\n    height: 12px;\n  }\n\n  background-color: ", ";\n\n  &.active {\n    background-color: ", ";\n  }\n\n  &.current {\n    background-color: ", ";\n  }\n\n  &.inverted {\n    background-color: ", ";\n  }\n\n  &.inverted.active {\n    background-color: ", ";\n  }\n\n  &.inverted.current {\n    background-color: ", ";\n  }\n\n"])), COLORS.neutral_100, COLORS.accent1_400, COLORS.accent1_800, COLORS.neutral_600, COLORS.accent1_400, COLORS.white);
+export var Dot = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n\n\n  &:after {\n    content: '';\n    display: block;\n    width: 6px;\n    height: 6px;\n    border-radius: 50%;\n    background-color: ", ";\n  }\n\n  &.small {\n    &:after {\n      width: 6px;\n      height: 6px;\n    }\n\n    &.current:after {\n      width: 10px;\n      height: 10px;\n    }\n  }\n\n  &.medium {\n    &:after {\n      width: 8px;\n      height: 8px;\n    }\n\n    &.current:after {\n      width: 12px;\n      height: 12px;\n    }\n  }\n\n  &.large {\n    &:after {\n      width: 12px;\n      height: 12px;\n    }\n\n    &.current:after {\n      width: 16px;\n      height: 16px;\n    }\n  }\n\n\n  &.active:after {\n    background-color: ", ";\n  }\n\n  &.current:after {\n    background-color: ", ";\n  }\n\n  &.inverted:after {\n    background-color: ", ";\n  }\n\n  &.inverted.active:after {\n    background-color: ", ";\n  }\n\n  &.inverted.current:after {\n    background-color: ", ";\n  }\n"])), COLORS.neutral_400, COLORS.accent1_600, COLORS.accent1_800, COLORS.neutral_400, COLORS.accent1_400, COLORS.white);
+export var LineFill = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  height: 100%;\n  max-width: 100%;\n  position: absolute;\n  z-index: 1;\n"])));
+export var Line = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  flex: 1;\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  position: relative;\n\n  &:after {\n    content: '';\n    display: block;\n    height: 100%;\n    background-color: ", ";\n    position: absolute;\n    right: 0;\n  }\n\n  &:before {\n    content: '';\n    display: block;\n    height: 100%;\n    background-color: ", ";\n    position: absolute;\n    left: 0;\n  }\n\n  &.small {\n    height: 6px;\n    border-radius: 4px;\n\n    ", " {\n      border-radius: 4px;\n    }\n\n    &:after {\n      width: 3px;\n      border-top-right-radius: 6px;\n      border-bottom-right-radius: 6px;\n    }\n\n    &:before {\n      width: 3px;\n      border-top-left-radius: 6px;\n      border-bottom-left-radius: 6px;\n    }\n  }\n\n  &.medium {\n    height: 8px;\n    border-radius: 4px;\n\n    ", " {\n      border-radius: 4px;\n    }\n\n    &:after {\n      width: 4px;\n      border-top-right-radius: 8px;\n      border-bottom-right-radius: 8px;\n    }\n\n    &:before {\n      width: 4px;\n      border-top-left-radius: 8px;\n      border-bottom-left-radius: 8px;\n    }\n  }\n\n  &.large {\n    height: 12px;\n    border-radius: 6px;\n\n    ", " {\n      border-radius: 6px;\n    }\n\n    &:after {\n      width: 6px;\n      border-top-right-radius: 12px;\n      border-bottom-right-radius: 12px;\n    }\n\n    &:before {\n      width: 6px;\n      border-top-left-radius: 12px;\n      border-bottom-left-radius: 12px;\n    }\n  }\n\n  background-color: ", ";\n\n  ", " {\n    background-color: ", ";\n  }\n\n  &.inverted {\n    background-color: ", ";\n\n    &:after,\n    &:before {\n      background-color: ", ";\n    }\n\n    ", " {\n      background-color: ", ";\n    }\n  }\n"])), COLORS.neutral_500, COLORS.neutral_500, LineFill, LineFill, LineFill, COLORS.neutral_100, LineFill, COLORS.accent1_500, COLORS.neutral_700, COLORS.neutral_400, LineFill, COLORS.accent1_400);
+var Wrapper = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  align-items: center;\n  flex-direction: row;\n  gap: 4px;\n  height: 16px;\n\n  &.small {\n    gap: 4px;\n\n    ", ":first-of-type {\n      border-top-left-radius: 6px;\n      border-bottom-left-radius: 6px;\n    }\n\n    ", ":last-of-type {\n      border-top-right-radius: 6px;\n      border-bottom-right-radius: 6px;\n    }\n\n  }\n\n  &.medium {\n    gap: 6px;\n\n    ", ":first-of-type {\n      border-top-left-radius: 8px;\n      border-bottom-left-radius: 8px;\n    }\n\n    ", ":last-of-type {\n      border-top-right-radius: 8px;\n      border-bottom-right-radius: 8px;\n    }\n  }\n\n  &.large {\n    gap: 8px;\n\n    ", ":first-of-type {\n      border-top-left-radius: 12px;\n      border-bottom-left-radius: 12px;\n    }\n\n    ", ":last-of-type {\n      border-top-right-radius: 12px;\n      border-bottom-right-radius: 12px;\n    }\n  }\n"])), Bar, Bar, Bar, Bar, Bar, Bar);
+export var LinearProgressionType;
+
+(function (LinearProgressionType) {
+  LinearProgressionType["Dots"] = "dots";
+  LinearProgressionType["Line"] = "line";
+  LinearProgressionType["Bars"] = "bars";
+})(LinearProgressionType || (LinearProgressionType = {}));
+
+export var LinearProgressionVariant;
+
+(function (LinearProgressionVariant) {
+  LinearProgressionVariant["Normal"] = "normal";
+  LinearProgressionVariant["Inverted"] = "inverted";
+})(LinearProgressionVariant || (LinearProgressionVariant = {}));
+
+var LinearProgression = function LinearProgression(_ref) {
+  var _ref$size = _ref.size,
+      size = _ref$size === void 0 ? Size.Medium : _ref$size,
+      _ref$type = _ref.type,
+      type = _ref$type === void 0 ? LinearProgressionType.Line : _ref$type,
+      _ref$variant = _ref.variant,
+      variant = _ref$variant === void 0 ? LinearProgressionVariant.Normal : _ref$variant,
+      value = _ref.value,
+      max = _ref.max;
+
+  var renderBars = function renderBars() {
+    return /*#__PURE__*/_jsx(_Fragment, {
+      children: Array.from(Array(max).keys()).map(function (i) {
+        return /*#__PURE__*/_jsx(Bar, {
+          className: "".concat(Math.ceil(value) >= i + 1 ? 'active' : '', " ").concat(Math.ceil(value) === i + 1 ? 'current' : '', " ").concat(variant, " ").concat(size)
+        }, i);
+      })
+    });
+  };
+
+  var renderDots = function renderDots() {
+    return /*#__PURE__*/_jsx(_Fragment, {
+      children: Array.from(Array(max).keys()).map(function (i) {
+        return /*#__PURE__*/_jsx(Dot, {
+          className: "".concat(Math.ceil(value) >= i + 1 ? 'active' : '', " ").concat(Math.ceil(value) === i + 1 ? 'current' : '', " ").concat(variant, " ").concat(size)
+        }, i);
+      })
+    });
+  };
+
+  var renderLine = function renderLine() {
+    return /*#__PURE__*/_jsx(_Fragment, {
+      children: /*#__PURE__*/_jsx(Line, {
+        className: "".concat(variant, " ").concat(size),
+        children: /*#__PURE__*/_jsx(LineFill, {
+          style: {
+            width: "".concat(value / max * 100, "%")
+          }
+        })
+      })
+    });
+  };
+
+  var render = function render() {
+    switch (type) {
+      case LinearProgressionType.Bars:
+        return renderBars();
+
+      case LinearProgressionType.Dots:
+        return renderDots();
+
+      case LinearProgressionType.Line:
+      default:
+        return renderLine();
+    }
+  };
+
+  return /*#__PURE__*/_jsx(Wrapper, {
+    className: "".concat(size, " ").concat(type, " ").concat(variant),
+    children: render()
+  });
+};
+
+LinearProgression.propTypes = {
+  type: _pt.oneOf(["dots", "line", "bars"]),
+  variant: _pt.oneOf(["normal", "inverted"]),
+  value: _pt.number.isRequired,
+  max: _pt.number.isRequired
+};
+export default LinearProgression;
+//# sourceMappingURL=LinearProgression.js.map

package/dist/LinearProgression/LinearProgression.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/LinearProgression/LinearProgression.tsx"],"names":["React","Size","styled","COLORS","Bar","div","neutral_100","accent1_400","accent1_800","neutral_600","white","Dot","neutral_400","accent1_600","LineFill","Line","neutral_500","accent1_500","neutral_700","Wrapper","LinearProgressionType","LinearProgressionVariant","LinearProgression","size","Medium","type","variant","Normal","value","max","renderBars","Array","from","keys","map","i","Math","ceil","renderDots","renderLine","width","render","Bars","Dots"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {Size} from '../types';\nimport styled from 'styled-components';\nimport {COLORS} from '../styles';\n\nexport const Bar = styled.div`\n  flex: 1;\n  height: 6px;\n\n  &.small {\n    height: 6px;\n  }\n\n  &.medium {\n    height: 8px;\n  }\n\n  &.large {\n    height: 12px;\n  }\n\n  background-color: ${COLORS.neutral_100};\n\n  &.active {\n    background-color: ${COLORS.accent1_400};\n  }\n\n  &.current {\n    background-color: ${COLORS.accent1_800};\n  }\n\n  &.inverted {\n    background-color: ${COLORS.neutral_600};\n  }\n\n  &.inverted.active {\n    background-color: ${COLORS.accent1_400};\n  }\n\n  &.inverted.current {\n    background-color: ${COLORS.white};\n  }\n\n`;\n\nexport const Dot = styled.div`\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n\n\n  &:after {\n    content: '';\n    display: block;\n    width: 6px;\n    height: 6px;\n    border-radius: 50%;\n    background-color: ${COLORS.neutral_400};\n  }\n\n  &.small {\n    &:after {\n      width: 6px;\n      height: 6px;\n    }\n\n    &.current:after {\n      width: 10px;\n      height: 10px;\n    }\n  }\n\n  &.medium {\n    &:after {\n      width: 8px;\n      height: 8px;\n    }\n\n    &.current:after {\n      width: 12px;\n      height: 12px;\n    }\n  }\n\n  &.large {\n    &:after {\n      width: 12px;\n      height: 12px;\n    }\n\n    &.current:after {\n      width: 16px;\n      height: 16px;\n    }\n  }\n\n\n  &.active:after {\n    background-color: ${COLORS.accent1_600};\n  }\n\n  &.current:after {\n    background-color: ${COLORS.accent1_800};\n  }\n\n  &.inverted:after {\n    background-color: ${COLORS.neutral_400};\n  }\n\n  &.inverted.active:after {\n    background-color: ${COLORS.accent1_400};\n  }\n\n  &.inverted.current:after {\n    background-color: ${COLORS.white};\n  }\n`;\n\nexport const LineFill = styled.div`\n  height: 100%;\n  max-width: 100%;\n  position: absolute;\n  z-index: 1;\n`;\n\nexport const Line = styled.div`\n  flex: 1;\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  position: relative;\n\n  &:after {\n    content: '';\n    display: block;\n    height: 100%;\n    background-color: ${COLORS.neutral_500};\n    position: absolute;\n    right: 0;\n  }\n\n  &:before {\n    content: '';\n    display: block;\n    height: 100%;\n    background-color: ${COLORS.neutral_500};\n    position: absolute;\n    left: 0;\n  }\n\n  &.small {\n    height: 6px;\n    border-radius: 4px;\n\n    ${LineFill} {\n      border-radius: 4px;\n    }\n\n    &:after {\n      width: 3px;\n      border-top-right-radius: 6px;\n      border-bottom-right-radius: 6px;\n    }\n\n    &:before {\n      width: 3px;\n      border-top-left-radius: 6px;\n      border-bottom-left-radius: 6px;\n    }\n  }\n\n  &.medium {\n    height: 8px;\n    border-radius: 4px;\n\n    ${LineFill} {\n      border-radius: 4px;\n    }\n\n    &:after {\n      width: 4px;\n      border-top-right-radius: 8px;\n      border-bottom-right-radius: 8px;\n    }\n\n    &:before {\n      width: 4px;\n      border-top-left-radius: 8px;\n      border-bottom-left-radius: 8px;\n    }\n  }\n\n  &.large {\n    height: 12px;\n    border-radius: 6px;\n\n    ${LineFill} {\n      border-radius: 6px;\n    }\n\n    &:after {\n      width: 6px;\n      border-top-right-radius: 12px;\n      border-bottom-right-radius: 12px;\n    }\n\n    &:before {\n      width: 6px;\n      border-top-left-radius: 12px;\n      border-bottom-left-radius: 12px;\n    }\n  }\n\n  background-color: ${COLORS.neutral_100};\n\n  ${LineFill} {\n    background-color: ${COLORS.accent1_500};\n  }\n\n  &.inverted {\n    background-color: ${COLORS.neutral_700};\n\n    &:after,\n    &:before {\n      background-color: ${COLORS.neutral_400};\n    }\n\n    ${LineFill} {\n      background-color: ${COLORS.accent1_400};\n    }\n  }\n`;\n\nconst Wrapper = styled.div`\n  width: 100%;\n  display: flex;\n  align-items: center;\n  flex-direction: row;\n  gap: 4px;\n  height: 16px;\n\n  &.small {\n    gap: 4px;\n\n    ${Bar}:first-of-type {\n      border-top-left-radius: 6px;\n      border-bottom-left-radius: 6px;\n    }\n\n    ${Bar}:last-of-type {\n      border-top-right-radius: 6px;\n      border-bottom-right-radius: 6px;\n    }\n\n  }\n\n  &.medium {\n    gap: 6px;\n\n    ${Bar}:first-of-type {\n      border-top-left-radius: 8px;\n      border-bottom-left-radius: 8px;\n    }\n\n    ${Bar}:last-of-type {\n      border-top-right-radius: 8px;\n      border-bottom-right-radius: 8px;\n    }\n  }\n\n  &.large {\n    gap: 8px;\n\n    ${Bar}:first-of-type {\n      border-top-left-radius: 12px;\n      border-bottom-left-radius: 12px;\n    }\n\n    ${Bar}:last-of-type {\n      border-top-right-radius: 12px;\n      border-bottom-right-radius: 12px;\n    }\n  }\n`;\n\nexport enum LinearProgressionType {\n  Dots = 'dots',\n  Line = 'line',\n  Bars = 'bars',\n}\n\nexport enum LinearProgressionVariant {\n  Normal = 'normal',\n  Inverted = 'inverted',\n}\n\nexport interface LinearProgressionProps {\n  size?: Size.Small | Size.Medium | Size.Large;\n  type?: LinearProgressionType;\n  variant?: LinearProgressionVariant;\n\n  value: number;\n  max: number;\n}\n\nconst LinearProgression: React.FunctionComponent<LinearProgressionProps> = ({\n                                                                              size = Size.Medium,\n                                                                              type = LinearProgressionType.Line,\n                                                                              variant = LinearProgressionVariant.Normal,\n                                                                              value,\n                                                                              max\n                                                                            }) => {\n\n  const renderBars = () => (\n    <>\n      {Array.from(Array(max).keys()).map(i => (\n        <Bar key={i}\n             className={`${Math.ceil(value) >= i + 1 ? 'active' : ''} ${Math.ceil(value) === i + 1 ? 'current' : ''} ${variant} ${size}`}/>\n      ))}\n    </>\n  )\n\n\n  const renderDots = () =>\n    <>\n      {Array.from(Array(max).keys()).map(i => (\n        <Dot key={i}\n             className={`${Math.ceil(value) >= i + 1 ? 'active' : ''} ${Math.ceil(value) === i + 1 ? 'current' : ''} ${variant} ${size}`}/>\n      ))}\n    </>\n\n  const renderLine = () =>\n    <>\n      <Line className={`${variant} ${size}`}>\n        <LineFill style={{width: `${value / max * 100}%`}}/>\n      </Line>\n    </>\n\n\n  const render = () => {\n    switch (type) {\n      case LinearProgressionType.Bars:\n        return renderBars();\n      case LinearProgressionType.Dots:\n        return renderDots();\n      case LinearProgressionType.Line:\n      default:\n        return renderLine();\n    }\n  }\n\n  return (\n    <Wrapper className={`${size} ${type} ${variant}`}>\n      {render()}\n    </Wrapper>\n  )\n};\n\nexport default LinearProgression;\n"],"file":"LinearProgression.js"}