@laerdal/life-react-components 1.2.2-dev.6 → 1.2.2-dev.9

package/dist/umd/Dropdown/ChipDropdownInput.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Dropdown/ChipDropdownInput.tsx"],"names":["Wrapper","styled","div","StyledChipInputContainer","COLORS","neutral_400","primary_100","critical_400","warning_400","primary_600","primary_800","primary_700","white","neutral_500","neutral_700","ChipInput","input","ComponentMStyling","ComponentTextStyle","black","StyledDropdownButton","Loading","label","secondaryLabel","value","list","onInputChange","disableSorting","messageOnNoResults","isButton","autofilledMessage","suggestion","excludeIcon","loading","maxSelectedItems","ChipDropdownInput","React","chipInput","styledFieldRef","setChips","newList","e","setGivenList","addChip","newChip","onValueChange","setValue","onAddChip","event","givenList","onRemoveChip","chips","newChips","onEditChip","options","option","o","setCurrentSearchResult","handleValueUpdate","values","setRestartFilter","handleKeyPress","matches","currentSearchResult","c","setDropdownIsOpen","handleClickOutside","document","dropdownItems","x","displayLabel","noteLabel","l","Size","variants","index","placeholder","neutral_600","action","pinTopItem","itemsType","scrollable","actionLabel","multiSelect","onValueUpdate","items","inputId","validationMessage","validationType","critical_500"],"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 { InputChip } from '../Chips/index';\nimport { Search, TechnicalWarning, User } from '../icons/systemicons/SystemIcons';\nimport { WarningMessage, ErrorMessage } from '../InputFields/styling';\nimport { COLORS } from '../styles';\n\n/**\n * Import custom styles.\n */\nimport { ChipInputContainer } from '../Chips/ChipStyles';\n\n/**\n * Import custom types.\n */\nimport { Size } from '../types';\nimport { ChipInputProps } from '../Chips/ChipTypes';\nimport { DropdownButton } from './CommonStyling';\nimport DropdownContent, { DropdownItem } from './DropdownContent';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { ComponentMStyling, ComponentXXSStyling, ComponentTextStyle } from '../styles/typography';\n\nconst Wrapper = styled.div`\n  position: relative;\n  display: inline-block;\n  width: 100%;\n  min-width: 344px;\n`;\n\nconst StyledChipInputContainer = styled(ChipInputContainer)`\n  padding: 2px 2px 2px 48px !important;\n  min-height: 56px;\n  max-height: 176px;\n  overflow-y: auto;\n  box-shadow: 0px 0px 0px 1px ${COLORS.neutral_400};\n\n  .medium {\n    margin-right: 8px !important;\n  }\n  .SearchIcon {\n    position: absolute;\n    left: 18px;\n    top: 18px;\n  }\n\n  &:active {\n    background-color: ${COLORS.primary_100};\n  }\n\n  &.invalid {\n    -webkit-box-shadow: inset 0px 0px 0px 2px ${COLORS.critical_400};\n    -moz-box-shadow: inset 0px 0px 0px 2px ${COLORS.critical_400};\n    box-shadow: inset 0px 0px 0px 2px ${COLORS.critical_400};\n  }\n  &.alreadyInOrganization {\n    -webkit-box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n    -moz-box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n    box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n  }\n\n  &.empty:hover {\n    -webkit-box-shadow: 0px 0px 0px 2px ${COLORS.primary_600};\n    -moz-box-shadow: 0px 0px 0px 2px ${COLORS.primary_600};\n    box-shadow: 0px 0px 0px 2px ${COLORS.primary_600};\n  }\n\n  &.inputHasFocus {\n    -webkit-box-shadow: 0px 0px 0px 2px ${COLORS.primary_800};\n    -moz-box-shadow: 0px 0px 0px 2px ${COLORS.primary_800};\n    box-shadow: 0px 0px 0px 2px ${COLORS.primary_800};\n  }\n  &:hover {\n    -webkit-box-shadow: 0px 0px 0px 2px ${COLORS.primary_700};\n    -moz-box-shadow: 0px 0px 0px 2px ${COLORS.primary_700};\n    box-shadow: 0px 0px 0px 2px ${COLORS.primary_700};\n  }\n\n  /* width */\n  ::-webkit-scrollbar {\n    width: 4px;\n    cursor: pointer;\n  }\n\n  /* Track */\n  ::-webkit-scrollbar-track {\n    background: ${COLORS.white};\n  }\n\n  /* Handle */\n  ::-webkit-scrollbar-thumb {\n    background: ${COLORS.neutral_500};\n    border-radius: 8px;\n  }\n\n  /* Handle on hover */\n  ::-webkit-scrollbar-thumb:hover {\n    background: ${COLORS.neutral_700};\n    cursor: pointer;\n  }\n`;\n\nconst ChipInput = styled.input`\n  height: 40px;\n  width: auto;\n  display: inline-flex;\n  border: none;\n  outline: none;\n  margin: 4px;\n\n  ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n  color: ${COLORS.black} !important;\n  background-color: inherit;\n`;\n\nconst StyledDropdownButton = styled(DropdownButton)`\n  display: flex;\n  width: 98%;\n  margin-left: 3px;\n  svg {\n    margin: auto 0 auto 0;\n  }\n`;\n\nconst Loading = styled.div`\n  margin: auto 16px auto auto !important;\n  height: 20px;\n  div {\n    height: 20px;\n  }\n`;\n\ninterface List {\n  label: string;\n  secondaryLabel?: string;\n  value: string;\n}\n\ninterface ChipDropdownInputProps extends ChipInputProps {\n  list: List[] | string[];\n  onInputChange?: (input: string) => void;\n  disableSorting?: boolean;\n  messageOnNoResults?: string;\n  isButton?: boolean;\n  autofilledMessage?: string;\n  suggestion?: List;\n  excludeIcon?: boolean;\n  loading?: boolean;\n  maxSelectedItems?: number;\n}\n\nconst ChipDropdownInput: React.FunctionComponent<ChipDropdownInputProps> = ({\n  list,\n  onInputChange,\n  disableSorting,\n  messageOnNoResults,\n  values,\n  inputId,\n  variants,\n  placeholder,\n  validationType,\n  validationMessage,\n  onValueChange,\n  suggestion,\n  excludeIcon,\n  loading,\n  maxSelectedItems,\n}: ChipDropdownInputProps) => {\n  // Initiate states\n  const [givenList, setGivenList] = React.useState<List[]>([]);\n  const [chips, setChips] = React.useState<string[]>([]);\n  const [value, setValue] = React.useState<string>('');\n  const [dropdownIsOpen, setDropdownIsOpen] = React.useState<boolean>(false);\n  const [currentSearchResult, setCurrentSearchResult] = React.useState<List[]>();\n  const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n  const [focused, setFocused] = React.useState<number | null>(null);\n\n  // Initiate refs\n  const chipInput = React.useRef<any>();\n  const styledFieldRef = React.useRef<HTMLDivElement>(null);\n\n  /**\n   * Sets initial values for the chips.\n   */\n  React.useEffect(() => {\n    // Let's add initial chip values\n    setChips(values);\n  }, [values]);\n\n  /**\n   * Convert string[] to List[] if necessary\n   */\n  React.useEffect(() => {\n    if (typeof list[0] === 'string') {\n      const newList: List[] = (list as string[]).map((e: string) => ({ label: e, value: e }));\n      setGivenList(newList);\n    } else {\n      setGivenList(list as List[]);\n    }\n  }, [list]);\n\n  const addChip = (newChip: string) => {\n    // Let's add the chip\n    setChips([...chips, newChip]);\n    onValueChange([...chips, newChip]);\n\n    // Let's clear the old value\n    chipInput.current.value = '';\n    setValue('');\n  };\n\n  /**\n   * Adds a chip to the chip list.\n   * @param event - Event handler from the key down event.\n   */\n  const onAddChip = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n    // Let's trigger only on enter, comma and space key press\n    if ((event.keyCode === 13 || event.keyCode === 32 || event.keyCode === 188) && value) {\n      if (!givenList.find((e) => e.value === value)) {\n        setValue('');\n        return;\n      }\n      // Let's prevent default action - adding new key to the value\n      event.preventDefault();\n\n      addChip(value);\n    }\n    if (event.keyCode === 8 && value === '') {\n      onRemoveChip(chips.length - 1);\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   * @param elementToAdd - Element which needs to be added in the deleted element place.\n   */\n  const onRemoveChip = (index: number, elementToAdd?: string): 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    if (elementToAdd) {\n      newChips.splice(index, 1, elementToAdd);\n    } else {\n      newChips.splice(index, 1);\n    }\n\n    // Let's update the chip list\n    setChips([...newChips]);\n    onValueChange([...newChips]);\n  };\n\n  /**\n   * Changes a status of the chip to edit.\n   * @param text - Text of the chip that is being edited.\n   * @param index - Index of the chip in the array.\n   */\n  const onEditChip = (text: string, index: number): void => {\n    // Let's check if we have to add value as a chip (in case we have entered something in the input field)\n    if (chipInput.current.value !== '') {\n      // Let's replace the chip\n      onRemoveChip(index, chipInput.current.value);\n    } else {\n      // Let's just remove the chip\n      onRemoveChip(index);\n    }\n\n    // Let's update the text value of input field\n    chipInput.current.value = text;\n    setValue(text);\n  };\n\n  React.useEffect(() => {\n    var options = [...givenList];\n    if (!restartFilter && value !== '') {\n      options = options.filter((option) => option.label.toUpperCase().indexOf(value.toUpperCase()) !== -1);\n    }\n    if (!disableSorting) {\n      options = options.sort();\n    }\n    options = options.filter((o) => !chips.includes(o.value));\n    setCurrentSearchResult(options);\n  }, [value, givenList, chips]);\n\n  const handleValueUpdate = (values: string[]) => {\n    setRestartFilter(true);\n    addChip(values[0]);\n    chipInput?.current?.focus();\n  }\n\n  const handleKeyPress = (e: any) => {\n    if (styledFieldRef?.current && styledFieldRef.current.contains(e.target)) {\n      if (e.keyCode === 13) {\n        const matches = currentSearchResult?.filter((c) => c.value.toLowerCase() === value.toLowerCase());\n        if (matches?.length === 1 /*&& onSelect*/) {\n          addChip(matches[0].value);\n          //onSelect(chips);\n        } else if (e.target.value === suggestion?.label) {\n          addChip(e.target.value);\n        }\n\n        setDropdownIsOpen(!dropdownIsOpen);\n        if (matches?.length === 0) {\n          setValue('');\n        }\n      } else if (e.keyCode === 40) {\n        setDropdownIsOpen(!dropdownIsOpen);\n      }\n    }\n  };\n\n  const handleClickOutside = (e: any) => {\n    if (styledFieldRef?.current && !styledFieldRef.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  React.useEffect(() => {\n    document.addEventListener('keypress', handleKeyPress);\n    document.addEventListener('click', handleClickOutside);\n    return () => {\n      document.removeEventListener('keypress', handleKeyPress);\n      document.removeEventListener('click', handleClickOutside);\n    };\n  });\n\n  /**\n   * Return Chip Input component.\n   */\n\n  let dropdownItems: DropdownItem[] = [];\n  if(currentSearchResult)\n    dropdownItems = currentSearchResult.map(x => ({ value: x.value, displayLabel: x.label, noteLabel: x.secondaryLabel }));\n  \n  if(suggestion && !chips.includes(suggestion.value))\n    dropdownItems = [{ value: suggestion.value, displayLabel: suggestion.label, noteLabel: suggestion.secondaryLabel, suggestion: true }, ...dropdownItems];\n\n  return (\n    <Wrapper>\n      <StyledChipInputContainer\n        id={inputId}\n        onClick={(e: any) => {\n          e.stopPropagation();\n          setDropdownIsOpen(true);\n          chipInput.current.focus();\n        }}\n        className={validationType}\n        ref={styledFieldRef}>\n        <Search size=\"24px\" className=\"SearchIcon\" />\n        {chips?.map((chip: string, index: number) => (\n          <InputChip\n            icon={givenList.find((l: List) => l.value === chip) ? 'User' : undefined}\n            size={Size.Medium}\n            variant={variants && variants?.length && variants[index] ? variants[index] : 'normal'}\n            text={chip}\n            onRemove={() => onRemoveChip(index)}\n            onClick={() => onEditChip(chip, index)}\n            key={`chip_${index}`}></InputChip>\n        ))}\n\n        <ChipInput\n          type=\"text\"\n          onChange={(event: React.ChangeEvent<HTMLInputElement>) => {\n            setValue(event.target.value);\n            setRestartFilter(false);\n            setDropdownIsOpen(true);\n            if (onInputChange) {\n              onInputChange(event.target.value || '');\n            }\n          }}\n          onKeyDown={(event: React.KeyboardEvent<HTMLInputElement>) => {\n            onAddChip(event);\n          }}\n          placeholder={placeholder && chips?.length === 0 ? placeholder : ''}\n          onClick={(e: any) => {\n            e.stopPropagation();\n            setDropdownIsOpen(true);\n          }}\n          onFocus={() => {\n            setDropdownIsOpen(true);\n          }}\n          ref={chipInput}\n        />\n        {loading ? (\n          <Loading>\n            <LoadingIndicator size={Size.Small} color={COLORS.neutral_600} />\n          </Loading>\n        ) : null}\n      </StyledChipInputContainer>\n      {(!maxSelectedItems || (maxSelectedItems && chips.length < maxSelectedItems)) && (\n        <DropdownContent \n          customizationProps={{\n            action: () => {},\n            pinTopItem: true,\n            \n            itemsType: 'normal',\n            scrollable: true,\n            actionLabel: '',\n            multiSelect: false,\n            onValueUpdate: handleValueUpdate,\n            items: dropdownItems\n          }}\n          focused={focused}\n          setFocused={setFocused}\n          hideOnClickOutside={false}\n          selectedValues={[]}\n          messageOnNoResults={messageOnNoResults ?? ''}\n          setSelectedValues={() => {}}\n          isOpen={dropdownIsOpen}\n          setIsOpen={setDropdownIsOpen}\n          filter={''}\n          isButton={false} \n          id={`${inputId}_dropdowncontent`} />\n      )}\n\n      {/* If there is an error, let's render the error */}\n      {validationMessage && validationType === 'warning' ? (\n        <WarningMessage>\n          <TechnicalWarning size=\"20px\" color={COLORS.critical_500} />\n          <span>{validationMessage}</span>\n        </WarningMessage>\n      ) : (\n        validationType === 'error' && (\n          <ErrorMessage>\n            <TechnicalWarning size=\"20px\" color={COLORS.critical_400} />\n            <span>{validationMessage}</span>\n          </ErrorMessage>\n        )\n      )}\n    </Wrapper>\n  );\n};\n\nexport default ChipDropdownInput;\n"],"file":"ChipDropdownInput.js"}
+{"version":3,"sources":["../../../src/Dropdown/ChipDropdownInput.tsx"],"names":["Wrapper","styled","div","StyledChipInputContainer","COLORS","neutral_400","primary_100","critical_400","warning_400","primary_600","primary_800","primary_700","white","neutral_500","neutral_700","ChipInput","input","ComponentMStyling","ComponentTextStyle","black","StyledDropdownButton","Loading","label","secondaryLabel","value","list","onInputChange","disableSorting","messageOnNoResults","isButton","autofilledMessage","suggestion","excludeIcon","loading","maxSelectedItems","ChipDropdownInput","React","chipInput","styledFieldRef","setChips","newList","e","setGivenList","addChip","newChip","onValueChange","setValue","onAddChip","event","givenList","onRemoveChip","chips","newChips","onEditChip","options","option","o","setCurrentSearchResult","handleValueUpdate","values","setRestartFilter","handleKeyPress","matches","currentSearchResult","c","setDropdownIsOpen","handleClickOutside","document","dropdownItems","x","displayLabel","noteLabel","l","variants","index","placeholder","neutral_600","action","pinTopItem","itemsType","scrollable","actionLabel","multiSelect","onValueUpdate","items","inputId","validationMessage","validationType","critical_500"],"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 { InputChip } from '../Chips/index';\nimport { Search, TechnicalWarning, User } from '../icons/systemicons/SystemIcons';\nimport { WarningMessage, ErrorMessage } from '../InputFields/styling';\nimport { COLORS } from '../styles';\n\n/**\n * Import custom styles.\n */\nimport { ChipInputContainer } from '../Chips/ChipStyles';\n\n/**\n * Import custom types.\n */\nimport { ChipInputProps } from '../Chips/ChipTypes';\nimport { DropdownButton } from './CommonStyling';\nimport DropdownContent, { DropdownItem } from './DropdownContent';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { ComponentMStyling, ComponentXXSStyling, ComponentTextStyle } from '../styles/typography';\n\nconst Wrapper = styled.div`\n  position: relative;\n  display: inline-block;\n  width: 100%;\n  min-width: 344px;\n`;\n\nconst StyledChipInputContainer = styled(ChipInputContainer)`\n  padding: 2px 2px 2px 48px !important;\n  min-height: 56px;\n  max-height: 176px;\n  overflow-y: auto;\n  box-shadow: 0px 0px 0px 1px ${COLORS.neutral_400};\n\n  .medium {\n    margin-right: 8px !important;\n  }\n  .SearchIcon {\n    position: absolute;\n    left: 18px;\n    top: 18px;\n  }\n\n  &:active {\n    background-color: ${COLORS.primary_100};\n  }\n\n  &.invalid {\n    -webkit-box-shadow: inset 0px 0px 0px 2px ${COLORS.critical_400};\n    -moz-box-shadow: inset 0px 0px 0px 2px ${COLORS.critical_400};\n    box-shadow: inset 0px 0px 0px 2px ${COLORS.critical_400};\n  }\n  &.alreadyInOrganization {\n    -webkit-box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n    -moz-box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n    box-shadow: inset 0px 0px 0px 2px ${COLORS.warning_400};\n  }\n\n  &.empty:hover {\n    -webkit-box-shadow: 0px 0px 0px 2px ${COLORS.primary_600};\n    -moz-box-shadow: 0px 0px 0px 2px ${COLORS.primary_600};\n    box-shadow: 0px 0px 0px 2px ${COLORS.primary_600};\n  }\n\n  &.inputHasFocus {\n    -webkit-box-shadow: 0px 0px 0px 2px ${COLORS.primary_800};\n    -moz-box-shadow: 0px 0px 0px 2px ${COLORS.primary_800};\n    box-shadow: 0px 0px 0px 2px ${COLORS.primary_800};\n  }\n  &:hover {\n    -webkit-box-shadow: 0px 0px 0px 2px ${COLORS.primary_700};\n    -moz-box-shadow: 0px 0px 0px 2px ${COLORS.primary_700};\n    box-shadow: 0px 0px 0px 2px ${COLORS.primary_700};\n  }\n\n  /* width */\n  ::-webkit-scrollbar {\n    width: 4px;\n    cursor: pointer;\n  }\n\n  /* Track */\n  ::-webkit-scrollbar-track {\n    background: ${COLORS.white};\n  }\n\n  /* Handle */\n  ::-webkit-scrollbar-thumb {\n    background: ${COLORS.neutral_500};\n    border-radius: 8px;\n  }\n\n  /* Handle on hover */\n  ::-webkit-scrollbar-thumb:hover {\n    background: ${COLORS.neutral_700};\n    cursor: pointer;\n  }\n`;\n\nconst ChipInput = styled.input`\n  height: 40px;\n  width: auto;\n  display: inline-flex;\n  border: none;\n  outline: none;\n  margin: 4px;\n\n  ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n  color: ${COLORS.black} !important;\n  background-color: inherit;\n`;\n\nconst StyledDropdownButton = styled(DropdownButton)`\n  display: flex;\n  width: 98%;\n  margin-left: 3px;\n  svg {\n    margin: auto 0 auto 0;\n  }\n`;\n\nconst Loading = styled.div`\n  margin: auto 16px auto auto !important;\n  height: 20px;\n  div {\n    height: 20px;\n  }\n`;\n\ninterface List {\n  label: string;\n  secondaryLabel?: string;\n  value: string;\n}\n\ninterface ChipDropdownInputProps extends ChipInputProps {\n  list: List[] | string[];\n  onInputChange?: (input: string) => void;\n  disableSorting?: boolean;\n  messageOnNoResults?: string;\n  isButton?: boolean;\n  autofilledMessage?: string;\n  suggestion?: List;\n  excludeIcon?: boolean;\n  loading?: boolean;\n  maxSelectedItems?: number;\n}\n\nconst ChipDropdownInput: React.FunctionComponent<ChipDropdownInputProps> = ({\n  list,\n  onInputChange,\n  disableSorting,\n  messageOnNoResults,\n  values,\n  inputId,\n  variants,\n  placeholder,\n  validationType,\n  validationMessage,\n  onValueChange,\n  suggestion,\n  excludeIcon,\n  loading,\n  maxSelectedItems,\n}: ChipDropdownInputProps) => {\n  // Initiate states\n  const [givenList, setGivenList] = React.useState<List[]>([]);\n  const [chips, setChips] = React.useState<string[]>([]);\n  const [value, setValue] = React.useState<string>('');\n  const [dropdownIsOpen, setDropdownIsOpen] = React.useState<boolean>(false);\n  const [currentSearchResult, setCurrentSearchResult] = React.useState<List[]>();\n  const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n  const [focused, setFocused] = React.useState<number | null>(null);\n\n  // Initiate refs\n  const chipInput = React.useRef<any>();\n  const styledFieldRef = React.useRef<HTMLDivElement>(null);\n\n  /**\n   * Sets initial values for the chips.\n   */\n  React.useEffect(() => {\n    // Let's add initial chip values\n    setChips(values);\n  }, [values]);\n\n  /**\n   * Convert string[] to List[] if necessary\n   */\n  React.useEffect(() => {\n    if (typeof list[0] === 'string') {\n      const newList: List[] = (list as string[]).map((e: string) => ({ label: e, value: e }));\n      setGivenList(newList);\n    } else {\n      setGivenList(list as List[]);\n    }\n  }, [list]);\n\n  const addChip = (newChip: string) => {\n    // Let's add the chip\n    setChips([...chips, newChip]);\n    onValueChange([...chips, newChip]);\n\n    // Let's clear the old value\n    chipInput.current.value = '';\n    setValue('');\n  };\n\n  /**\n   * Adds a chip to the chip list.\n   * @param event - Event handler from the key down event.\n   */\n  const onAddChip = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n    // Let's trigger only on enter, comma and space key press\n    if ((event.keyCode === 13 || event.keyCode === 32 || event.keyCode === 188) && value) {\n      if (!givenList.find((e) => e.value === value)) {\n        setValue('');\n        return;\n      }\n      // Let's prevent default action - adding new key to the value\n      event.preventDefault();\n\n      addChip(value);\n    }\n    if (event.keyCode === 8 && value === '') {\n      onRemoveChip(chips.length - 1);\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   * @param elementToAdd - Element which needs to be added in the deleted element place.\n   */\n  const onRemoveChip = (index: number, elementToAdd?: string): 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    if (elementToAdd) {\n      newChips.splice(index, 1, elementToAdd);\n    } else {\n      newChips.splice(index, 1);\n    }\n\n    // Let's update the chip list\n    setChips([...newChips]);\n    onValueChange([...newChips]);\n  };\n\n  /**\n   * Changes a status of the chip to edit.\n   * @param text - Text of the chip that is being edited.\n   * @param index - Index of the chip in the array.\n   */\n  const onEditChip = (text: string, index: number): void => {\n    // Let's check if we have to add value as a chip (in case we have entered something in the input field)\n    if (chipInput.current.value !== '') {\n      // Let's replace the chip\n      onRemoveChip(index, chipInput.current.value);\n    } else {\n      // Let's just remove the chip\n      onRemoveChip(index);\n    }\n\n    // Let's update the text value of input field\n    chipInput.current.value = text;\n    setValue(text);\n  };\n\n  React.useEffect(() => {\n    var options = [...givenList];\n    if (!restartFilter && value !== '') {\n      options = options.filter((option) => option.label.toUpperCase().indexOf(value.toUpperCase()) !== -1);\n    }\n    if (!disableSorting) {\n      options = options.sort();\n    }\n    options = options.filter((o) => !chips.includes(o.value));\n    setCurrentSearchResult(options);\n  }, [value, givenList, chips]);\n\n  const handleValueUpdate = (values: string[]) => {\n    setRestartFilter(true);\n    addChip(values[0]);\n    chipInput?.current?.focus();\n  }\n\n  const handleKeyPress = (e: any) => {\n    if (styledFieldRef?.current && styledFieldRef.current.contains(e.target)) {\n      if (e.keyCode === 13) {\n        const matches = currentSearchResult?.filter((c) => c.value.toLowerCase() === value.toLowerCase());\n        if (matches?.length === 1 /*&& onSelect*/) {\n          addChip(matches[0].value);\n          //onSelect(chips);\n        } else if (e.target.value === suggestion?.label) {\n          addChip(e.target.value);\n        }\n\n        setDropdownIsOpen(!dropdownIsOpen);\n        if (matches?.length === 0) {\n          setValue('');\n        }\n      } else if (e.keyCode === 40) {\n        setDropdownIsOpen(!dropdownIsOpen);\n      }\n    }\n  };\n\n  const handleClickOutside = (e: any) => {\n    if (styledFieldRef?.current && !styledFieldRef.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  React.useEffect(() => {\n    document.addEventListener('keypress', handleKeyPress);\n    document.addEventListener('click', handleClickOutside);\n    return () => {\n      document.removeEventListener('keypress', handleKeyPress);\n      document.removeEventListener('click', handleClickOutside);\n    };\n  });\n\n  /**\n   * Return Chip Input component.\n   */\n\n  let dropdownItems: DropdownItem[] = [];\n  if(currentSearchResult)\n    dropdownItems = currentSearchResult.map(x => ({ value: x.value, displayLabel: x.label, noteLabel: x.secondaryLabel }));\n  \n  if(suggestion && !chips.includes(suggestion.value))\n    dropdownItems = [{ value: suggestion.value, displayLabel: suggestion.label, noteLabel: suggestion.secondaryLabel, suggestion: true }, ...dropdownItems];\n\n  return (\n    <Wrapper>\n      <StyledChipInputContainer\n        id={inputId}\n        onClick={(e: any) => {\n          e.stopPropagation();\n          setDropdownIsOpen(true);\n          chipInput.current.focus();\n        }}\n        className={validationType}\n        ref={styledFieldRef}>\n        <Search size=\"24px\" className=\"SearchIcon\" />\n        {chips?.map((chip: string, index: number) => (\n          <InputChip\n            icon={givenList.find((l: List) => l.value === chip) ? 'User' : undefined}\n            size=\"medium\"\n            variant={variants && variants?.length && variants[index] ? variants[index] : 'normal'}\n            text={chip}\n            onRemove={() => onRemoveChip(index)}\n            onClick={() => onEditChip(chip, index)}\n            key={`chip_${index}`}></InputChip>\n        ))}\n\n        <ChipInput\n          type=\"text\"\n          onChange={(event: React.ChangeEvent<HTMLInputElement>) => {\n            setValue(event.target.value);\n            setRestartFilter(false);\n            setDropdownIsOpen(true);\n            if (onInputChange) {\n              onInputChange(event.target.value || '');\n            }\n          }}\n          onKeyDown={(event: React.KeyboardEvent<HTMLInputElement>) => {\n            onAddChip(event);\n          }}\n          placeholder={placeholder && chips?.length === 0 ? placeholder : ''}\n          onClick={(e: any) => {\n            e.stopPropagation();\n            setDropdownIsOpen(true);\n          }}\n          onFocus={() => {\n            setDropdownIsOpen(true);\n          }}\n          ref={chipInput}\n        />\n        {loading ? (\n          <Loading>\n            <LoadingIndicator size=\"small\" color={COLORS.neutral_600} />\n          </Loading>\n        ) : null}\n      </StyledChipInputContainer>\n      {(!maxSelectedItems || (maxSelectedItems && chips.length < maxSelectedItems)) && (\n        <DropdownContent \n          customizationProps={{\n            action: () => {},\n            pinTopItem: true,\n            \n            itemsType: 'normal',\n            scrollable: true,\n            actionLabel: '',\n            multiSelect: false,\n            onValueUpdate: handleValueUpdate,\n            items: dropdownItems\n          }}\n          focused={focused}\n          setFocused={setFocused}\n          hideOnClickOutside={false}\n          selectedValues={[]}\n          messageOnNoResults={messageOnNoResults ?? ''}\n          setSelectedValues={() => {}}\n          isOpen={dropdownIsOpen}\n          setIsOpen={setDropdownIsOpen}\n          filter={''}\n          isButton={false} \n          id={`${inputId}_dropdowncontent`} />\n      )}\n\n      {/* If there is an error, let's render the error */}\n      {validationMessage && validationType === 'warning' ? (\n        <WarningMessage>\n          <TechnicalWarning size=\"20px\" color={COLORS.critical_500} />\n          <span>{validationMessage}</span>\n        </WarningMessage>\n      ) : (\n        validationType === 'error' && (\n          <ErrorMessage>\n            <TechnicalWarning size=\"20px\" color={COLORS.critical_400} />\n            <span>{validationMessage}</span>\n          </ErrorMessage>\n        )\n      )}\n    </Wrapper>\n  );\n};\n\nexport default ChipDropdownInput;\n"],"file":"ChipDropdownInput.js"}

package/dist/umd/Dropdown/DropdownFilter.js

@@ -208,7 +208,7 @@
         tabIndex: disabled || locked ? -1 : 0,
         disabled: disabled || false
       }), isLoading ? /*#__PURE__*/React.createElement(_LoadingIndicator.LoadingIndicator, {
-        size: _types.Size.Small,
+        size: "small",
         color: _styles.COLORS.neutral_600
       }) : null, /*#__PURE__*/React.createElement("div", {
         onClick: () => setIsOpen(!isOpen),
@@ -241,7 +241,7 @@
     }, icon, /*#__PURE__*/React.createElement("div", {
       className: 'value'
     }, initalValue && keepInitialValue ? initalValue : input || placeholderSearch), isLoading ? /*#__PURE__*/React.createElement(_LoadingIndicator.LoadingIndicator, {
-      size: _types.Size.Small,
+      size: "small",
       color: _styles.COLORS.neutral_600
     }) : null, /*#__PURE__*/React.createElement("div", {
       onClick: () => setIsOpen(!isOpen),
@@ -266,7 +266,7 @@
       selectedValues: selectedValues,
       setSelectedValues: setSelectedValues,
       hideOnClickOutside: true,
-      size: size ?? _types.Size.Small,
+      size: size == 'medium' ? _types.Size.Medium : _types.Size.Small,
       focused: focused,
       setFocused: setFocused,
       customizationProps: {
@@ -320,6 +320,7 @@
     isButton: _propTypes2.default.bool,
     activeValidationMessage: _propTypes2.default.string,
     autofilledMessage: _propTypes2.default.string,
+    size: _propTypes2.default.oneOf(['small', 'medium']),
     scrollable: _propTypes2.default.bool,
     buttonFontSize: _propTypes2.default.string,
     keepInitialValue: _propTypes2.default.bool,

package/dist/umd/Dropdown/DropdownFilter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Dropdown/DropdownFilter.tsx"],"names":["label","customContent","id","list","placeholder","onSelect","onInputChange","initalValue","required","disableSorting","messageOnNoResults","disabled","locked","isButton","activeValidationMessage","autofilledMessage","scrollable","buttonFontSize","keepInitialValue","icon","margin","DropdownFilter","React","styledFieldRef","inputRef","handleKeyPress","e","matches","c","input","setInput","setFocused","setIsOpen","setRestartFilter","x","setPlaceholderSearch","document","setIsLoading","selectedValues","setSelectedValues","renderStandardDropdown","isOpen","size","Math","isLoading","Size","COLORS","neutral_600","renderButtonDropdown","itemsType","multiSelect","action","onValueUpdate","values","val","items","value","warning_400"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { BREAKPOINTS, COLORS } from '../styles';\nimport { ArrowDropDown, ArrowDropUp, Information, TechnicalWarning } from '../icons/systemicons/SystemIcons';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { DropdownButton, StyledField, Dropdown, ButtonDropdownWrapper, InputField } from './CommonStyling';\nimport DropdownContent from './DropdownContent';\nimport { Size } from '../types'\nimport { AutofilledMessage, WarningMessage } from '../InputFields/styling';\nimport { ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles/typography';\n\ninterface 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":["label","customContent","id","list","placeholder","onSelect","onInputChange","initalValue","required","disableSorting","messageOnNoResults","disabled","locked","isButton","activeValidationMessage","autofilledMessage","size","scrollable","buttonFontSize","keepInitialValue","icon","margin","DropdownFilter","React","styledFieldRef","inputRef","handleKeyPress","e","matches","c","input","setInput","setFocused","setIsOpen","setRestartFilter","x","setPlaceholderSearch","document","setIsLoading","selectedValues","setSelectedValues","renderStandardDropdown","isOpen","Math","isLoading","COLORS","neutral_600","renderButtonDropdown","Size","itemsType","multiSelect","action","onValueUpdate","values","val","items","value","warning_400"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { BREAKPOINTS, COLORS } from '../styles';\nimport { ArrowDropDown, ArrowDropUp, Information, TechnicalWarning } from '../icons/systemicons/SystemIcons';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { DropdownButton, StyledField, Dropdown, ButtonDropdownWrapper, InputField } from './CommonStyling';\nimport DropdownContent from './DropdownContent';\nimport { Size } from '../types'\nimport { AutofilledMessage, WarningMessage } from '../InputFields/styling';\nimport { ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles/typography';\n\ninterface 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?: 'small' | '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=\"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=\"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 == 'medium' ? Size.Medium : 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/umd/GlobalNavigationBar/ExtendedMainMenu.js

@@ -1,16 +1,16 @@
 (function (global, factory) {
   if (typeof define === "function" && define.amd) {
-    define(["exports", "prop-types", "react", "styled-components", "../styles", "../Tabs", ".."], factory);
+    define(["exports", "prop-types", "react", "styled-components", "../styles", "../Tabs"], factory);
   } else if (typeof exports !== "undefined") {
-    factory(exports, require("prop-types"), require("react"), require("styled-components"), require("../styles"), require("../Tabs"), require(".."));
+    factory(exports, require("prop-types"), require("react"), require("styled-components"), require("../styles"), require("../Tabs"));
   } else {
     var mod = {
       exports: {}
     };
-    factory(mod.exports, global.propTypes, global.react, global.styledComponents, global.styles, global.Tabs, global._);
+    factory(mod.exports, global.propTypes, global.react, global.styledComponents, global.styles, global.Tabs);
     global.undefined = mod.exports;
   }
-})(this, function (exports, _propTypes, _react, _styledComponents, _styles, _Tabs, _) {
+})(this, function (exports, _propTypes, _react, _styledComponents, _styles, _Tabs) {
   "use strict";
 
   Object.defineProperty(exports, "__esModule", {
@@ -179,7 +179,7 @@
     }, /*#__PURE__*/React.createElement(MenuSection, null, /*#__PURE__*/React.createElement(MenuSectionList, null, /*#__PURE__*/React.createElement(_Tabs.VerticalTabs, {
       key: "ExtendedMenu",
       entries: entries,
-      size: _.Size.Medium
+      size: "medium"
     }))));
   };
 

package/dist/umd/GlobalNavigationBar/ExtendedMainMenu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/ExtendedMainMenu.tsx"],"names":["flowDown","keyframes","Menu","styled","ul","COLORS","white","BREAKPOINTS","SMALL","MEDIUM","MenuSection","li","neutral_100","MenuSectionList","clickMenuAction","navigationOptions","ExtendedMainMenu","React","e","document","list","n","requiredLine","to","disabled","onClick","exact","setEntries","Size","Medium"],"mappings":";;;;;;;;;;;;;;;;;;;;;MAAA,K;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,QAAMA,QAAQ,GAAGC,2BAAU;AAC3B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA,CAAA;AAWA,QAAMC,IAAI,GAAGC,2BAAOC,EAAG;AACvB;AACA;AACA;AACA,sBAAsBC,eAAOC,KAAM;AACnC;AACA;AACA;AACA;AACA,uBAAuBN,QAAS;AAChC,eAAeA,QAAS;AACxB;AACA;AACA;AACA;AACA;AACA;AACA,IAAIO,oBAAYC,KAAM;AACtB;AACA;AACA,IAAID,oBAAYE,MAAO;AACvB;AACA;AACA;AACA;AACA;AACA;AA1BA,CAAA;AA6BA,QAAMC,WAAW,GAAGP,2BAAOQ,EAAG;AAC9B;AACA;AACA;AACA;AACA;AACA;AACA,kBAAkBN,eAAOO,WAAY;AACrC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAlBA,CAAA;AAqBA,QAAMC,eAAe,GAAGV,2BAAOC,EAAG;AAClC;AACA;AACA;AAHA,CAAA;;AAWA,QAAMY,gBAAgB,GAAG,CAAC;AAAA,IAAA,eAAA;AAAmBD,IAAAA;AAAnB,GAAD,KAAmD;AAC1E,UAAM,CAAA,OAAA,EAAA,UAAA,IAAwBE,KAAK,CAALA,QAAAA,CAA9B,EAA8BA,CAA9B;AACAA,IAAAA,KAAK,CAALA,SAAAA,CAAgB,MAAM;AACpB,eAAA,cAAA,CAAA,CAAA,EAAgC;AAC9B,YAAIC,CAAC,CAADA,OAAAA,KAAJ,EAAA,EAAsB;AACpBJ,UAAAA,eAAe;AAChB;AACF;;AAEDK,MAAAA,QAAQ,CAARA,gBAAAA,CAAAA,SAAAA,EAAAA,cAAAA,EAAAA,KAAAA;AACA,aAAO,MAAM;AACXA,QAAAA,QAAQ,CAARA,mBAAAA,CAAAA,SAAAA,EAAAA,cAAAA,EAAAA,KAAAA;AADF,OAAA;AARFF,KAAAA,EAWG,CAXHA,eAWG,CAXHA;AAaAA,IAAAA,KAAK,CAALA,SAAAA,CAAgB,MAAM;AACpB,YAAMG,IAAI,GAAG,iBAAiB,EAAjB,GAAA,CAAuBC,CAAC,IAAI;AACvC,eAAO;AAAEC,UAAAA,YAAY,EAAED,CAAC,CAAjB,KAAA;AAAyBE,UAAAA,EAAE,EAAEF,CAAC,CAA9B,EAAA;AAAmCG,UAAAA,QAAQ,EAAEH,CAAC,CAA9C,QAAA;AAAyDI,UAAAA,OAAO,EAAEJ,CAAC,CAAnE,OAAA;AAA6EK,UAAAA,KAAK,EAAEL,CAAC,CAACK;AAAtF,SAAP;AADF,OAAa,CAAb;AAGAC,MAAAA,UAAU,CAAVA,IAAU,CAAVA;AAJFV,KAAAA,EAKG,CALHA,iBAKG,CALHA;AAOA,WAAA,aACE,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAM,MAAA,OAAO,EAAb,eAAA;AAAgC,MAAA,IAAI,EAApC,MAAA;AAA4C,yBAAgB;AAA5D,KAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,WAAA,EAAA,IAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,eAAA,EAAA,IAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,kBAAA,EAAA;AAAc,MAAA,GAAG,EAAjB,cAAA;AAAiC,MAAA,OAAO,EAAxC,OAAA;AAAmD,MAAA,IAAI,EAAEW,OAAKC;AAA9D,KAAA,CADF,CADF,CADF,CADF;AAtBF,GAAA;;;AAJEf,IAAAA,e;AACAC,IAAAA,iB;;oBAoCF,gB","sourcesContent":["import * as React from 'react';\nimport styled, { keyframes } from 'styled-components';\n\nimport { NavOption } from '../types';\nimport { BREAKPOINTS, COLORS } from '../styles';\nimport { VerticalTabs } from '../Tabs';\nimport { VerticalTabEntry } from '../Tabs/VerticalTabs';\nimport { Size } from '..';\n\nconst flowDown = keyframes`\n  0% {\n    opacity: 0;\n    transform: translateY(-10px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n`;\n\nconst Menu = styled.ul`\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  background-color: ${COLORS.white};\n  box-sizing: border-box;\n  display: none;\n  right: -8px;\n  min-width: 300px;\n  -webkit-animation: ${flowDown} 0.2s ease-in-out;\n  animation: ${flowDown} 0.2s ease-in-out;\n  position: absolute;\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);\n  border-radius: 4px;\n  z-index: 100;\n\n  top: 12px;\n  ${BREAKPOINTS.SMALL} {\n    top: 18px;\n  }\n  ${BREAKPOINTS.MEDIUM} {\n    top: 24px;\n  }\n\n  .open & {\n    display: block;\n  }\n`;\n\nconst MenuSection = styled.li`\n  padding: 8px 0;\n  position: relative;\n\n  &:not(:first-of-type)::before {\n    content: '';\n    position: absolute;\n    background: ${COLORS.neutral_100};\n    height: 1px;\n    top: 0;\n    left: 16px;\n    right: 16px;\n  }\n\n  .disabled-link {\n    color: #21212150;\n    pointer-events: none;\n    key-events: none;\n  }\n`;\n\nconst MenuSectionList = styled.ul`\n  list-style: none;\n  margin: 0;\n  padding: 0 2px;\n`;\n\ntype Props = {\n  clickMenuAction: () => void;\n  navigationOptions: NavOption[];\n};\n\nconst ExtendedMainMenu = ({ clickMenuAction, navigationOptions }: Props) => {\n  const [entries, setEntries] = React.useState<VerticalTabEntry[]>([]);\n  React.useEffect(() => {\n    function handleKeyPress(e: any) {\n      if (e.keyCode === 27) {\n        clickMenuAction();\n      }\n    }\n\n    document.addEventListener('keydown', handleKeyPress, false);\n    return () => {\n      document.removeEventListener('keydown', handleKeyPress, false);\n    };\n  }, [clickMenuAction]);\n\n  React.useEffect(() => {\n    const list = navigationOptions?.map(n => {\n      return { requiredLine: n.label, to: n.to, disabled: n.disabled, onClick: n.onClick, exact: n.exact };\n    }) as VerticalTabEntry[];\n    setEntries(list);\n  }, [navigationOptions]);\n\n  return (\n    <Menu onClick={clickMenuAction} role=\"menu\" aria-labelledby=\"UserMenuButton\">\n      <MenuSection>\n        <MenuSectionList>\n          <VerticalTabs key=\"ExtendedMenu\" entries={entries} size={Size.Medium} />\n        </MenuSectionList>\n      </MenuSection>\n    </Menu>\n  );\n};\n\nexport default ExtendedMainMenu;\n"],"file":"ExtendedMainMenu.js"}
+{"version":3,"sources":["../../../src/GlobalNavigationBar/ExtendedMainMenu.tsx"],"names":["flowDown","keyframes","Menu","styled","ul","COLORS","white","BREAKPOINTS","SMALL","MEDIUM","MenuSection","li","neutral_100","MenuSectionList","clickMenuAction","navigationOptions","ExtendedMainMenu","React","e","document","list","n","requiredLine","to","disabled","onClick","exact","setEntries"],"mappings":";;;;;;;;;;;;;;;;;;;;;MAAA,K;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,QAAMA,QAAQ,GAAGC,2BAAU;AAC3B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AARA,CAAA;AAWA,QAAMC,IAAI,GAAGC,2BAAOC,EAAG;AACvB;AACA;AACA;AACA,sBAAsBC,eAAOC,KAAM;AACnC;AACA;AACA;AACA;AACA,uBAAuBN,QAAS;AAChC,eAAeA,QAAS;AACxB;AACA;AACA;AACA;AACA;AACA;AACA,IAAIO,oBAAYC,KAAM;AACtB;AACA;AACA,IAAID,oBAAYE,MAAO;AACvB;AACA;AACA;AACA;AACA;AACA;AA1BA,CAAA;AA6BA,QAAMC,WAAW,GAAGP,2BAAOQ,EAAG;AAC9B;AACA;AACA;AACA;AACA;AACA;AACA,kBAAkBN,eAAOO,WAAY;AACrC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAlBA,CAAA;AAqBA,QAAMC,eAAe,GAAGV,2BAAOC,EAAG;AAClC;AACA;AACA;AAHA,CAAA;;AAWA,QAAMY,gBAAgB,GAAG,CAAC;AAAA,IAAA,eAAA;AAAmBD,IAAAA;AAAnB,GAAD,KAAmD;AAC1E,UAAM,CAAA,OAAA,EAAA,UAAA,IAAwBE,KAAK,CAALA,QAAAA,CAA9B,EAA8BA,CAA9B;AACAA,IAAAA,KAAK,CAALA,SAAAA,CAAgB,MAAM;AACpB,eAAA,cAAA,CAAA,CAAA,EAAgC;AAC9B,YAAIC,CAAC,CAADA,OAAAA,KAAJ,EAAA,EAAsB;AACpBJ,UAAAA,eAAe;AAChB;AACF;;AAEDK,MAAAA,QAAQ,CAARA,gBAAAA,CAAAA,SAAAA,EAAAA,cAAAA,EAAAA,KAAAA;AACA,aAAO,MAAM;AACXA,QAAAA,QAAQ,CAARA,mBAAAA,CAAAA,SAAAA,EAAAA,cAAAA,EAAAA,KAAAA;AADF,OAAA;AARFF,KAAAA,EAWG,CAXHA,eAWG,CAXHA;AAaAA,IAAAA,KAAK,CAALA,SAAAA,CAAgB,MAAM;AACpB,YAAMG,IAAI,GAAG,iBAAiB,EAAjB,GAAA,CAAuBC,CAAC,IAAI;AACvC,eAAO;AAAEC,UAAAA,YAAY,EAAED,CAAC,CAAjB,KAAA;AAAyBE,UAAAA,EAAE,EAAEF,CAAC,CAA9B,EAAA;AAAmCG,UAAAA,QAAQ,EAAEH,CAAC,CAA9C,QAAA;AAAyDI,UAAAA,OAAO,EAAEJ,CAAC,CAAnE,OAAA;AAA6EK,UAAAA,KAAK,EAAEL,CAAC,CAACK;AAAtF,SAAP;AADF,OAAa,CAAb;AAGAC,MAAAA,UAAU,CAAVA,IAAU,CAAVA;AAJFV,KAAAA,EAKG,CALHA,iBAKG,CALHA;AAOA,WAAA,aACE,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAM,MAAA,OAAO,EAAb,eAAA;AAAgC,MAAA,IAAI,EAApC,MAAA;AAA4C,yBAAgB;AAA5D,KAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,WAAA,EAAA,IAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,eAAA,EAAA,IAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,kBAAA,EAAA;AAAc,MAAA,GAAG,EAAjB,cAAA;AAAiC,MAAA,OAAO,EAAxC,OAAA;AAAmD,MAAA,IAAI,EAAC;AAAxD,KAAA,CADF,CADF,CADF,CADF;AAtBF,GAAA;;;AAJEH,IAAAA,e;AACAC,IAAAA,iB;;oBAoCF,gB","sourcesContent":["import * as React from 'react';\nimport styled, { keyframes } from 'styled-components';\n\nimport { NavOption } from '../types';\nimport { BREAKPOINTS, COLORS } from '../styles';\nimport { VerticalTabs } from '../Tabs';\nimport { VerticalTabEntry } from '../Tabs/VerticalTabs';\n\nconst flowDown = keyframes`\n  0% {\n    opacity: 0;\n    transform: translateY(-10px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n`;\n\nconst Menu = styled.ul`\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  background-color: ${COLORS.white};\n  box-sizing: border-box;\n  display: none;\n  right: -8px;\n  min-width: 300px;\n  -webkit-animation: ${flowDown} 0.2s ease-in-out;\n  animation: ${flowDown} 0.2s ease-in-out;\n  position: absolute;\n  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);\n  border-radius: 4px;\n  z-index: 100;\n\n  top: 12px;\n  ${BREAKPOINTS.SMALL} {\n    top: 18px;\n  }\n  ${BREAKPOINTS.MEDIUM} {\n    top: 24px;\n  }\n\n  .open & {\n    display: block;\n  }\n`;\n\nconst MenuSection = styled.li`\n  padding: 8px 0;\n  position: relative;\n\n  &:not(:first-of-type)::before {\n    content: '';\n    position: absolute;\n    background: ${COLORS.neutral_100};\n    height: 1px;\n    top: 0;\n    left: 16px;\n    right: 16px;\n  }\n\n  .disabled-link {\n    color: #21212150;\n    pointer-events: none;\n    key-events: none;\n  }\n`;\n\nconst MenuSectionList = styled.ul`\n  list-style: none;\n  margin: 0;\n  padding: 0 2px;\n`;\n\ntype Props = {\n  clickMenuAction: () => void;\n  navigationOptions: NavOption[];\n};\n\nconst ExtendedMainMenu = ({ clickMenuAction, navigationOptions }: Props) => {\n  const [entries, setEntries] = React.useState<VerticalTabEntry[]>([]);\n  React.useEffect(() => {\n    function handleKeyPress(e: any) {\n      if (e.keyCode === 27) {\n        clickMenuAction();\n      }\n    }\n\n    document.addEventListener('keydown', handleKeyPress, false);\n    return () => {\n      document.removeEventListener('keydown', handleKeyPress, false);\n    };\n  }, [clickMenuAction]);\n\n  React.useEffect(() => {\n    const list = navigationOptions?.map(n => {\n      return { requiredLine: n.label, to: n.to, disabled: n.disabled, onClick: n.onClick, exact: n.exact };\n    }) as VerticalTabEntry[];\n    setEntries(list);\n  }, [navigationOptions]);\n\n  return (\n    <Menu onClick={clickMenuAction} role=\"menu\" aria-labelledby=\"UserMenuButton\">\n      <MenuSection>\n        <MenuSectionList>\n          <VerticalTabs key=\"ExtendedMenu\" entries={entries} size=\"medium\" />\n        </MenuSectionList>\n      </MenuSection>\n    </Menu>\n  );\n};\n\nexport default ExtendedMainMenu;\n"],"file":"ExtendedMainMenu.js"}

package/dist/umd/InputFields/Label.js

@@ -151,6 +151,7 @@
   InputLabel.propTypes = {
     inputId: _propTypes2.default.string.isRequired,
     text: _propTypes2.default.string.isRequired,
+    size: _propTypes2.default.oneOf(['small', 'medium']),
     margin: _propTypes2.default.string
   };
   exports.default = InputLabel;

package/dist/umd/InputFields/Label.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/InputFields/Label.tsx"],"names":["Label","styled","label","ComponentXXSStyling","COLORS","BREAKPOINTS","MEDIUM","ComponentXSStyling","LabelRow","div","props","margin","inputId","text","InputLabel","React","document","setRequired","onTriggerClick","id","size","required"],"mappings":";;;;;;;;;;;;;;;;;;;;;MAGA,K;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAHA;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AAIA;AACA,QAAMA,KAAK,GAAGC,2BAAOC,KAAM;AAC3B,IAAIC,qCAAmB,CAAnBA,EAAuBC,eAAJ,WAAnBD,CAA2C;AAC/C;AACA,IAAIE,oBAAYC,MAAO;AACvB,MAAMC,oCAAkB,CAAlBA,EAAsBH,eAAJ,WAAlBG,CAA0C;AAChD;AACA;AACA;AACA,MAAMJ,qCAAmB,CAAnBA,EAAuBC,eAAJ,WAAnBD,CAA2C;AACjD;AACA;AACA,MAAMI,oCAAkB,CAAlBA,EAAsBH,eAAJ,WAAlBG,CAA0C;AAChD;AAZA,CAAA;AAeA,QAAMC,QAAQ,GAAGP,2BAAOQ,GAAyB;AACjD;AACA;AACA,IAAKC,KAAD,IAAYA,KAAK,CAALA,MAAAA,GAAgB,WAAUA,KAAK,CAACC,MAAhCD,GAAAA,GAA4C,EAAI;AAHhE,CAAA,C,CAMA;;AAQA,QAAMI,UAA+C,GAAG,CAAC;AAAA,IAAA,OAAA;AAAA,IAAA,IAAA;AAAA,IAAA,IAAA;AAAuBH,IAAAA;AAAvB,GAAD,KAAiD;AACvG;AACA,UAAM,CAAA,QAAA,EAAA,WAAA,IAA0BI,KAAK,CAALA,QAAAA,CAAhC,KAAgCA,CAAhC;AAEA;AACF;AACA;;AACEA,IAAAA,KAAK,CAALA,SAAAA,CAAgB,MAAM;AACpB,UAAIC,QAAQ,CAARA,cAAAA,CAAAA,OAAAA,GAAAA,YAAAA,CAAAA,UAAAA,MAAJ,EAAA,EAAuE;AACrEC,QAAAA,WAAW,CAAXA,IAAW,CAAXA;AADF,OAAA,MAEO;AACLA,QAAAA,WAAW,CAAXA,KAAW,CAAXA;AACD;AALHF,KAAAA,EAMG,CAACC,QAAQ,CAARA,cAAAA,CAAAA,OAAAA,GAAAA,YAAAA,CANJD,UAMIC,CAAD,CANHD;AAOA;AACF;AACA;AACA;;AACE,UAAMG,cAAc,GAAIC,EAAD,IAAsB;AAC3CH,MAAAA,QAAQ,CAARA,cAAAA,CAAAA,EAAAA,GAAAA,KAAAA;AADF,KAAA;;AAIA,WAAA,aACE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA;AAAU,MAAA,MAAM,EAAEL;AAAlB,KAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAO,MAAA,OAAO,EAAd,OAAA;AAAyB,MAAA,OAAO,EAAE,MAAMO,cAAc,CAAtD,OAAsD,CAAtD;AAAiE,MAAA,SAAS,EAAEE,IAAI,IAAI;AAApF,KAAA,EADF,IACE,CADF,EAIGC,QAAQ,IAAA,aAAI,KAAA,CAAA,aAAA,CAAA,qBAAA,EAAA,IAAA,EALjB,GAKiB,CAJf,CADF;AAtBF,GAAA;;;AANET,IAAAA,O;AACAC,IAAAA,I;AAEAF,IAAAA,M;;oBAmCF,U","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom styles.\n */\nimport { BREAKPOINTS, COLORS } from '../styles';\nimport { RequiredStar } from './styling';\nimport { Size } from '../types';\n\n/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\nimport { ComponentXSStyling, ComponentXXSStyling } from '../styles/typography';\n\n// Add component-specific styles.\nconst Label = styled.label`\n  ${ComponentXXSStyling(1, COLORS.neutral_500)}\n\n  ${BREAKPOINTS.MEDIUM} {\n    ${ComponentXSStyling(1, COLORS.neutral_500)}\n  }\n\n  &.small {\n    ${ComponentXXSStyling(1, COLORS.neutral_500)}\n  }\n  &.medium {\n    ${ComponentXSStyling(1, COLORS.neutral_500)}\n  }\n`;\n\nconst LabelRow = styled.div<{ margin?: string }>`\n  display: flex;\n  justify-content: space-between;\n  ${(props) => (props.margin ? `margin: ${props.margin};` : '')}\n`;\n\n// Add component-specific types\ntype LabelProps = {\n  inputId: string;\n  text: string;\n  size?: Size.Small | Size.Medium;\n  margin?: string;\n};\n\nconst InputLabel: React.FunctionComponent<LabelProps> = ({ inputId, text, size, margin }: LabelProps) => {\n  // Globally used variables within the component\n  const [required, setRequired] = React.useState<boolean>(false);\n\n  /**\n   * Checks if field is set as required and we have to mark it accordingly.\n   */\n  React.useEffect(() => {\n    if (document.getElementById(inputId)?.getAttribute('required') === '') {\n      setRequired(true);\n    } else {\n      setRequired(false);\n    }\n  }, [document.getElementById(inputId)?.getAttribute('required')]);\n  /**\n   * Triggers a click element on a specific element.\n   * @param id - ID of the element which needs to be clicked.\n   */\n  const onTriggerClick = (id: string): void => {\n    document.getElementById(id)?.click();\n  };\n\n  return (\n    <LabelRow margin={margin}>\n      <Label htmlFor={inputId} onClick={() => onTriggerClick(inputId)} className={size || ''}>\n        {text}\n      </Label>\n      {required && <RequiredStar>*</RequiredStar>}\n    </LabelRow>\n  );\n};\n\nexport default InputLabel;\n"],"file":"Label.js"}
+{"version":3,"sources":["../../../src/InputFields/Label.tsx"],"names":["Label","styled","label","ComponentXXSStyling","COLORS","BREAKPOINTS","MEDIUM","ComponentXSStyling","LabelRow","div","props","margin","inputId","text","size","InputLabel","React","document","setRequired","onTriggerClick","id","required"],"mappings":";;;;;;;;;;;;;;;;;;;;;MAGA,K;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAHA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AAIA;AACA,QAAMA,KAAK,GAAGC,2BAAOC,KAAM;AAC3B,IAAIC,qCAAmB,CAAnBA,EAAuBC,eAAJ,WAAnBD,CAA2C;AAC/C;AACA,IAAIE,oBAAYC,MAAO;AACvB,MAAMC,oCAAkB,CAAlBA,EAAsBH,eAAJ,WAAlBG,CAA0C;AAChD;AACA;AACA;AACA,MAAMJ,qCAAmB,CAAnBA,EAAuBC,eAAJ,WAAnBD,CAA2C;AACjD;AACA;AACA,MAAMI,oCAAkB,CAAlBA,EAAsBH,eAAJ,WAAlBG,CAA0C;AAChD;AAZA,CAAA;AAeA,QAAMC,QAAQ,GAAGP,2BAAOQ,GAAyB;AACjD;AACA;AACA,IAAKC,KAAD,IAAYA,KAAK,CAALA,MAAAA,GAAgB,WAAUA,KAAK,CAACC,MAAhCD,GAAAA,GAA4C,EAAI;AAHhE,CAAA,C,CAMA;;AAQA,QAAMK,UAA+C,GAAG,CAAC;AAAA,IAAA,OAAA;AAAA,IAAA,IAAA;AAAA,IAAA,IAAA;AAAuBJ,IAAAA;AAAvB,GAAD,KAAiD;AACvG;AACA,UAAM,CAAA,QAAA,EAAA,WAAA,IAA0BK,KAAK,CAALA,QAAAA,CAAhC,KAAgCA,CAAhC;AAEA;AACF;AACA;;AACEA,IAAAA,KAAK,CAALA,SAAAA,CAAgB,MAAM;AACpB,UAAIC,QAAQ,CAARA,cAAAA,CAAAA,OAAAA,GAAAA,YAAAA,CAAAA,UAAAA,MAAJ,EAAA,EAAuE;AACrEC,QAAAA,WAAW,CAAXA,IAAW,CAAXA;AADF,OAAA,MAEO;AACLA,QAAAA,WAAW,CAAXA,KAAW,CAAXA;AACD;AALHF,KAAAA,EAMG,CAACC,QAAQ,CAARA,cAAAA,CAAAA,OAAAA,GAAAA,YAAAA,CANJD,UAMIC,CAAD,CANHD;AAOA;AACF;AACA;AACA;;AACE,UAAMG,cAAc,GAAIC,EAAD,IAAsB;AAC3CH,MAAAA,QAAQ,CAARA,cAAAA,CAAAA,EAAAA,GAAAA,KAAAA;AADF,KAAA;;AAIA,WAAA,aACE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA;AAAU,MAAA,MAAM,EAAEN;AAAlB,KAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAO,MAAA,OAAO,EAAd,OAAA;AAAyB,MAAA,OAAO,EAAE,MAAMQ,cAAc,CAAtD,OAAsD,CAAtD;AAAiE,MAAA,SAAS,EAAEL,IAAI,IAAI;AAApF,KAAA,EADF,IACE,CADF,EAIGO,QAAQ,IAAA,aAAI,KAAA,CAAA,aAAA,CAAA,qBAAA,EAAA,IAAA,EALjB,GAKiB,CAJf,CADF;AAtBF,GAAA;;;AANET,IAAAA,O;AACAC,IAAAA,I;AACAC,IAAAA,I,6BAAO,O,EAAU,Q;AACjBH,IAAAA,M;;oBAmCF,U","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom styles.\n */\nimport { BREAKPOINTS, COLORS } from '../styles';\nimport { RequiredStar } from './styling';\n\n/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\nimport { ComponentXSStyling, ComponentXXSStyling } from '../styles/typography';\n\n// Add component-specific styles.\nconst Label = styled.label`\n  ${ComponentXXSStyling(1, COLORS.neutral_500)}\n\n  ${BREAKPOINTS.MEDIUM} {\n    ${ComponentXSStyling(1, COLORS.neutral_500)}\n  }\n\n  &.small {\n    ${ComponentXXSStyling(1, COLORS.neutral_500)}\n  }\n  &.medium {\n    ${ComponentXSStyling(1, COLORS.neutral_500)}\n  }\n`;\n\nconst LabelRow = styled.div<{ margin?: string }>`\n  display: flex;\n  justify-content: space-between;\n  ${(props) => (props.margin ? `margin: ${props.margin};` : '')}\n`;\n\n// Add component-specific types\ntype LabelProps = {\n  inputId: string;\n  text: string;\n  size?: 'small' | 'medium';\n  margin?: string;\n};\n\nconst InputLabel: React.FunctionComponent<LabelProps> = ({ inputId, text, size, margin }: LabelProps) => {\n  // Globally used variables within the component\n  const [required, setRequired] = React.useState<boolean>(false);\n\n  /**\n   * Checks if field is set as required and we have to mark it accordingly.\n   */\n  React.useEffect(() => {\n    if (document.getElementById(inputId)?.getAttribute('required') === '') {\n      setRequired(true);\n    } else {\n      setRequired(false);\n    }\n  }, [document.getElementById(inputId)?.getAttribute('required')]);\n  /**\n   * Triggers a click element on a specific element.\n   * @param id - ID of the element which needs to be clicked.\n   */\n  const onTriggerClick = (id: string): void => {\n    document.getElementById(id)?.click();\n  };\n\n  return (\n    <LabelRow margin={margin}>\n      <Label htmlFor={inputId} onClick={() => onTriggerClick(inputId)} className={size || ''}>\n        {text}\n      </Label>\n      {required && <RequiredStar>*</RequiredStar>}\n    </LabelRow>\n  );\n};\n\nexport default InputLabel;\n"],"file":"Label.js"}

package/dist/umd/InputFields/PasswordField.js

@@ -221,6 +221,7 @@
     placeholder: _propTypes2.default.string,
     required: _propTypes2.default.bool,
     readOnly: _propTypes2.default.bool,
+    size: _propTypes2.default.oneOf(['small', 'medium']),
     margin: _propTypes2.default.string
   };
   exports.default = PasswordField;

package/dist/umd/InputFields/PasswordField.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/InputFields/PasswordField.tsx"],"names":["id","disabled","locked","onChange","hasError","value","validationMessage","autoComplete","placeholder","required","readOnly","margin","StyledPassSwitch","styled","div","BREAKPOINTS","MEDIUM","PasswordRow","PasswordField","React","inputRef","handleKeyDown","e","setPasswordHidden","setTabbedHere","display","passwordHidden","size"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { BREAKPOINTS } from '../styles';\nimport { Size} from '../types';\nimport { InputFieldStyling, InputWrapper } from './styling';\n\ntype PasswordFieldProps = {\n  id: string;\n  disabled?: boolean;\n  locked?: boolean;\n  onChange?: (text: string) => void;\n  hasError?: boolean;\n  value?: string;\n  validationMessage?: string;\n  autoComplete?: string;\n  placeholder?: string;\n  required?: boolean;\n  readOnly?: boolean;\n  size?: Size.Small | Size.Medium;\n  margin?: string;\n};\n\nconst StyledPassSwitch = styled.div`\n  float: right;\n  margin-left: -40px;\n  margin-top: 8px;\n  position: relative;\n  z-index: 2;\n  height: 30px;\n  width: 30px;\n\n  ${BREAKPOINTS.MEDIUM} {\n    margin-top: 12px;\n  }\n\n  &.small {\n    margin-top: 8px;\n  }\n\n  &.medium {\n    margin-top: 12px;\n  }\n\n  svg {\n    cursor: pointer;\n  }\n  div {\n    &:focus {\n      outline: none;\n      svg {\n        box-shadow: 0px 4px 12px rgba(46, 127, 161, 0.25), 0px 0px 8px #2e7fa1;\n        border-radius: 4px;\n      }\n    }\n  }\n`;\n\nconst PasswordRow = styled.div`\n  display: flex;\n  flex-direction: row;\n`;\n\nconst PasswordField = ({ id, disabled, locked, onChange, hasError, value, validationMessage, autoComplete, placeholder, required, readOnly, size, margin }: PasswordFieldProps) => {\n  const [passwordHidden, setPasswordHidden] = React.useState<Boolean>(true);\n  const inputRef = React.useRef<any>(null);\n  const [tabbedHere, setTabbedHere] = React.useState<boolean>(false);\n\n  const handleKeyDown = (e: any) => {\n    if (e.keyCode === 13) {\n      setPasswordHidden(!passwordHidden);\n    }\n  };\n  return (\n    <>\n      <InputWrapper\n        disabled={disabled}\n        locked={locked}\n        margin={margin}\n        tabIndex={disabled ? -1 : 0}\n        onFocus={(e: any) => {\n          if (!e?.target?.id.includes(id) && !disabled && !locked) {\n            setTabbedHere(true);\n            inputRef.current.focus();\n          }\n        }}>\n        <div style={{ display: 'block' }}>\n          <PasswordRow>\n            <InputFieldStyling\n              id={id}\n              ref={inputRef}\n              type={passwordHidden ? 'password' : 'text'}\n              name=\"password\"\n              value={value}\n              className={(hasError ? 'error' : '').concat(size ? size : '')}\n              tabIndex={-1}\n              autoComplete={autoComplete}\n              placeholder={placeholder}\n              disabled={disabled}\n              locked={locked}\n              required={required}\n              readOnly={readOnly}\n              onChange={(e: any) => onChange && onChange(e?.target?.value || '')}\n              tabbedHere={tabbedHere}\n              onBlur={() => setTabbedHere(false)}\n            />\n            <StyledPassSwitch className={size ? size : ''}>\n              {!disabled && !locked ? (\n                passwordHidden ? (\n                  <div id={`${id}_Visible`} tabIndex={0} onKeyDown={handleKeyDown} onClick={() => setPasswordHidden(!passwordHidden)}>\n                    <svg viewBox=\"0 0 25 25\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                      <path\n                        d=\"M4.05966 12.5853L3.25603 11.7821C2.86542 11.3917 2.23234 11.3918 1.84186 11.7823C1.45115 12.173 1.45115 12.8065 1.84186 13.1972L2.6448 14.0001C2.8984 14.2537 3.1593 14.4956 3.42683 14.7256L1.84172 16.3107C1.4512 16.7013 1.4512 17.3344 1.84172 17.725C2.23225 18.1155 2.86541 18.1155 3.25593 17.725L5.0508 15.9301C5.73486 16.3644 6.44837 16.7336 7.18249 17.0377L6.28268 19.5236C6.09471 20.0429 6.36331 20.6163 6.88262 20.8043C7.40193 20.9922 7.9753 20.7236 8.16327 20.2043L9.08108 17.6687C9.89493 17.8758 10.7238 18.0088 11.5569 18.0675C11.5516 18.1092 11.5488 18.1517 11.5488 18.1948V20.4897C11.5488 21.042 11.9965 21.4897 12.5488 21.4897C13.1011 21.4897 13.5488 21.042 13.5488 20.4897V18.1948C13.5488 18.1517 13.5461 18.1092 13.5408 18.0675C14.3739 18.0088 15.2027 17.8758 16.0166 17.6687L16.9344 20.2043C17.1224 20.7236 17.6957 20.9922 18.215 20.8043C18.7343 20.6163 19.003 20.0429 18.815 19.5236L17.9152 17.0377C18.6462 16.7349 19.3568 16.3675 20.0382 15.9356L21.8276 17.725C22.2181 18.1155 22.8513 18.1155 23.2418 17.725C23.6323 17.3344 23.6323 16.7013 23.2418 16.3107L21.6632 14.7322C21.9334 14.5001 22.1969 14.2561 22.4529 14.0001L23.2558 13.1972C23.6465 12.8065 23.6465 12.173 23.2558 11.7823C22.8653 11.3918 22.2322 11.3917 21.8416 11.7821L21.038 12.5853C16.3496 17.2737 8.7481 17.2737 4.05966 12.5853Z\"\n                        fill=\"#666666\"></path>\n                    </svg>\n                  </div>\n                ) : (\n                  <div id={`${id}_NotVisible`} tabIndex={0} onKeyDown={handleKeyDown} onClick={() => setPasswordHidden(!passwordHidden)}>\n                    <svg viewBox=\"0 0 25 25\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                      <path\n                        d=\"M12.9618 15.4897C14.6186 15.4897 15.9618 14.1466 15.9618 12.4897C15.9618 10.8329 14.6186 9.48975 12.9618 9.48975C11.3049 9.48975 9.96179 10.8329 9.96179 12.4897C9.96179 14.1466 11.3049 15.4897 12.9618 15.4897Z\"\n                        fill=\"#666666\"\n                      />\n                      <path\n                        d=\"M2.87753 10.83L2.14123 11.9081C1.90198 12.2585 1.90198 12.721 2.14123 13.0714L2.87753 14.1495C7.74011 21.2698 18.1835 21.2698 23.0461 14.1495L23.7824 13.0714C24.0216 12.721 24.0216 12.2585 23.7824 11.9081L23.0461 10.83C18.1835 3.70968 7.74011 3.70967 2.87753 10.83ZM21.3944 11.9579L21.7577 12.4897L21.3944 13.0216C17.326 18.9791 8.59763 18.9791 4.52914 13.0216L4.16592 12.4897L4.52914 11.9579C8.59763 6.00037 17.326 6.00037 21.3944 11.9579Z\"\n                        fill=\"#666666\"\n                      />\n                    </svg>\n                  </div>\n                )\n              ) : null}\n            </StyledPassSwitch>\n          </PasswordRow>\n        </div>\n      </InputWrapper>\n      {validationMessage && <span className=\"error-msg\">{validationMessage}</span>}\n    </>\n  );\n};\n\nexport default PasswordField;\n"],"file":"PasswordField.js"}
+{"version":3,"sources":["../../../src/InputFields/PasswordField.tsx"],"names":["id","disabled","locked","onChange","hasError","value","validationMessage","autoComplete","placeholder","required","readOnly","size","margin","StyledPassSwitch","styled","div","BREAKPOINTS","MEDIUM","PasswordRow","PasswordField","React","inputRef","handleKeyDown","e","setPasswordHidden","setTabbedHere","display","passwordHidden"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { BREAKPOINTS } from '../styles';\nimport { InputFieldStyling, InputWrapper } from './styling';\n\ntype PasswordFieldProps = {\n  id: string;\n  disabled?: boolean;\n  locked?: boolean;\n  onChange?: (text: string) => void;\n  hasError?: boolean;\n  value?: string;\n  validationMessage?: string;\n  autoComplete?: string;\n  placeholder?: string;\n  required?: boolean;\n  readOnly?: boolean;\n  size?: 'small' | 'medium';\n  margin?: string;\n};\n\nconst StyledPassSwitch = styled.div`\n  float: right;\n  margin-left: -40px;\n  margin-top: 8px;\n  position: relative;\n  z-index: 2;\n  height: 30px;\n  width: 30px;\n\n  ${BREAKPOINTS.MEDIUM} {\n    margin-top: 12px;\n  }\n\n  &.small {\n    margin-top: 8px;\n  }\n\n  &.medium {\n    margin-top: 12px;\n  }\n\n  svg {\n    cursor: pointer;\n  }\n  div {\n    &:focus {\n      outline: none;\n      svg {\n        box-shadow: 0px 4px 12px rgba(46, 127, 161, 0.25), 0px 0px 8px #2e7fa1;\n        border-radius: 4px;\n      }\n    }\n  }\n`;\n\nconst PasswordRow = styled.div`\n  display: flex;\n  flex-direction: row;\n`;\n\nconst PasswordField = ({ id, disabled, locked, onChange, hasError, value, validationMessage, autoComplete, placeholder, required, readOnly, size, margin }: PasswordFieldProps) => {\n  const [passwordHidden, setPasswordHidden] = React.useState<Boolean>(true);\n  const inputRef = React.useRef<any>(null);\n  const [tabbedHere, setTabbedHere] = React.useState<boolean>(false);\n\n  const handleKeyDown = (e: any) => {\n    if (e.keyCode === 13) {\n      setPasswordHidden(!passwordHidden);\n    }\n  };\n  return (\n    <>\n      <InputWrapper\n        disabled={disabled}\n        locked={locked}\n        margin={margin}\n        tabIndex={disabled ? -1 : 0}\n        onFocus={(e: any) => {\n          if (!e?.target?.id.includes(id) && !disabled && !locked) {\n            setTabbedHere(true);\n            inputRef.current.focus();\n          }\n        }}>\n        <div style={{ display: 'block' }}>\n          <PasswordRow>\n            <InputFieldStyling\n              id={id}\n              ref={inputRef}\n              type={passwordHidden ? 'password' : 'text'}\n              name=\"password\"\n              value={value}\n              className={(hasError ? 'error' : '').concat(size ? size : '')}\n              tabIndex={-1}\n              autoComplete={autoComplete}\n              placeholder={placeholder}\n              disabled={disabled}\n              locked={locked}\n              required={required}\n              readOnly={readOnly}\n              onChange={(e: any) => onChange && onChange(e?.target?.value || '')}\n              tabbedHere={tabbedHere}\n              onBlur={() => setTabbedHere(false)}\n            />\n            <StyledPassSwitch className={size ? size : ''}>\n              {!disabled && !locked ? (\n                passwordHidden ? (\n                  <div id={`${id}_Visible`} tabIndex={0} onKeyDown={handleKeyDown} onClick={() => setPasswordHidden(!passwordHidden)}>\n                    <svg viewBox=\"0 0 25 25\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                      <path\n                        d=\"M4.05966 12.5853L3.25603 11.7821C2.86542 11.3917 2.23234 11.3918 1.84186 11.7823C1.45115 12.173 1.45115 12.8065 1.84186 13.1972L2.6448 14.0001C2.8984 14.2537 3.1593 14.4956 3.42683 14.7256L1.84172 16.3107C1.4512 16.7013 1.4512 17.3344 1.84172 17.725C2.23225 18.1155 2.86541 18.1155 3.25593 17.725L5.0508 15.9301C5.73486 16.3644 6.44837 16.7336 7.18249 17.0377L6.28268 19.5236C6.09471 20.0429 6.36331 20.6163 6.88262 20.8043C7.40193 20.9922 7.9753 20.7236 8.16327 20.2043L9.08108 17.6687C9.89493 17.8758 10.7238 18.0088 11.5569 18.0675C11.5516 18.1092 11.5488 18.1517 11.5488 18.1948V20.4897C11.5488 21.042 11.9965 21.4897 12.5488 21.4897C13.1011 21.4897 13.5488 21.042 13.5488 20.4897V18.1948C13.5488 18.1517 13.5461 18.1092 13.5408 18.0675C14.3739 18.0088 15.2027 17.8758 16.0166 17.6687L16.9344 20.2043C17.1224 20.7236 17.6957 20.9922 18.215 20.8043C18.7343 20.6163 19.003 20.0429 18.815 19.5236L17.9152 17.0377C18.6462 16.7349 19.3568 16.3675 20.0382 15.9356L21.8276 17.725C22.2181 18.1155 22.8513 18.1155 23.2418 17.725C23.6323 17.3344 23.6323 16.7013 23.2418 16.3107L21.6632 14.7322C21.9334 14.5001 22.1969 14.2561 22.4529 14.0001L23.2558 13.1972C23.6465 12.8065 23.6465 12.173 23.2558 11.7823C22.8653 11.3918 22.2322 11.3917 21.8416 11.7821L21.038 12.5853C16.3496 17.2737 8.7481 17.2737 4.05966 12.5853Z\"\n                        fill=\"#666666\"></path>\n                    </svg>\n                  </div>\n                ) : (\n                  <div id={`${id}_NotVisible`} tabIndex={0} onKeyDown={handleKeyDown} onClick={() => setPasswordHidden(!passwordHidden)}>\n                    <svg viewBox=\"0 0 25 25\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                      <path\n                        d=\"M12.9618 15.4897C14.6186 15.4897 15.9618 14.1466 15.9618 12.4897C15.9618 10.8329 14.6186 9.48975 12.9618 9.48975C11.3049 9.48975 9.96179 10.8329 9.96179 12.4897C9.96179 14.1466 11.3049 15.4897 12.9618 15.4897Z\"\n                        fill=\"#666666\"\n                      />\n                      <path\n                        d=\"M2.87753 10.83L2.14123 11.9081C1.90198 12.2585 1.90198 12.721 2.14123 13.0714L2.87753 14.1495C7.74011 21.2698 18.1835 21.2698 23.0461 14.1495L23.7824 13.0714C24.0216 12.721 24.0216 12.2585 23.7824 11.9081L23.0461 10.83C18.1835 3.70968 7.74011 3.70967 2.87753 10.83ZM21.3944 11.9579L21.7577 12.4897L21.3944 13.0216C17.326 18.9791 8.59763 18.9791 4.52914 13.0216L4.16592 12.4897L4.52914 11.9579C8.59763 6.00037 17.326 6.00037 21.3944 11.9579Z\"\n                        fill=\"#666666\"\n                      />\n                    </svg>\n                  </div>\n                )\n              ) : null}\n            </StyledPassSwitch>\n          </PasswordRow>\n        </div>\n      </InputWrapper>\n      {validationMessage && <span className=\"error-msg\">{validationMessage}</span>}\n    </>\n  );\n};\n\nexport default PasswordField;\n"],"file":"PasswordField.js"}

package/dist/umd/InputFields/QuickSearch.js

@@ -1,16 +1,16 @@
 (function (global, factory) {
   if (typeof define === "function" && define.amd) {
-    define(["exports", "prop-types", "react", "styled-components", "../Button/Iconbutton", "./styling", "../types", "..", "../icons/systemicons/SystemIcons", "./components/SearchBarInput", "./components/SearchField"], factory);
+    define(["exports", "prop-types", "react", "styled-components", "../Button/Iconbutton", "./styling", "..", "../icons/systemicons/SystemIcons", "./components/SearchBarInput", "./components/SearchField"], factory);
   } else if (typeof exports !== "undefined") {
-    factory(exports, require("prop-types"), require("react"), require("styled-components"), require("../Button/Iconbutton"), require("./styling"), require("../types"), require(".."), require("../icons/systemicons/SystemIcons"), require("./components/SearchBarInput"), require("./components/SearchField"));
+    factory(exports, require("prop-types"), require("react"), require("styled-components"), require("../Button/Iconbutton"), require("./styling"), require(".."), require("../icons/systemicons/SystemIcons"), require("./components/SearchBarInput"), require("./components/SearchField"));
   } else {
     var mod = {
       exports: {}
     };
-    factory(mod.exports, global.propTypes, global.react, global.styledComponents, global.Iconbutton, global.styling, global.types, global._, global.SystemIcons, global.SearchBarInput, global.SearchField);
+    factory(mod.exports, global.propTypes, global.react, global.styledComponents, global.Iconbutton, global.styling, global._, global.SystemIcons, global.SearchBarInput, global.SearchField);
     global.undefined = mod.exports;
   }
-})(this, function (exports, _propTypes, _react, _styledComponents, _Iconbutton, _styling, _types, _, _SystemIcons, _SearchBarInput, _SearchField) {
+})(this, function (exports, _propTypes, _react, _styledComponents, _Iconbutton, _styling, _, _SystemIcons, _SearchBarInput, _SearchField) {
   "use strict";
 
   Object.defineProperty(exports, "__esModule", {
@@ -231,7 +231,7 @@
       className: size ? size : '',
       tabIndex: -1
     }, /*#__PURE__*/React.createElement(_.LoadingIndicator, {
-      size: _types.Size.Small,
+      size: "small",
       color: _.COLORS.neutral_600
     })));
   };
@@ -246,6 +246,7 @@
     performSearchLabel: _propTypes2.default.string,
     disabled: _propTypes2.default.bool,
     onKeyDown: _propTypes2.default.func,
+    size: _propTypes2.default.oneOf(['small', 'medium']),
     margin: _propTypes2.default.string,
     loading: _propTypes2.default.bool
   };

package/dist/umd/InputFields/QuickSearch.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/InputFields/QuickSearch.tsx"],"names":["QuickSearchField","styled","props","margin","COLORS","white","neutral_600","primary_800","primary_700","id","searchTerm","setSearchTerm","enterSearch","removeSearch","placeholder","performSearchLabel","disabled","onKeyDown","loading","QuickSearch","searchFieldRef","React","searchFieldInputRef","handleClickOutside","e","searchFieldVisible","setSearchFieldVisible","document","handleKeyDown","event","size","term","Size"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport IconButton from '../Button/Iconbutton';\nimport { SearchIconWrapper, StyledIcon } from './styling';\nimport { Size } from '../types';\nimport { COLORS, LoadingIndicator } from '..';\nimport { Search as SearchIcon, Clear as ClearIcon } from '../icons/systemicons/SystemIcons';\nimport SearchBarInput from './components/SearchBarInput';\nimport { StyledSearchField } from './components/SearchField';\n\nconst QuickSearchField = styled(StyledSearchField)<{ expanded: boolean; margin?: string }>`\n  ${(props) => (props.margin ? `margin: ${props.margin};` : '')}\n  -webkit-transition: box-shadow 0.2s ease-in-out, width 0.2s ease-in-out;\n  transition: box-shadow 0.2s ease-in-out, width 0.2s ease-in-out;\n\n  background-color: transparent;\n  &.small {\n    width: 48px;\n  }\n\n  &.medium {\n    width: 56px;\n  }\n  \n  &.expanded{\n    width: 100%;\n    background-color: ${COLORS.white};\n  }\n\n  input {\n    ::placeholder {\n      font-style: italic;\n      color: ${COLORS.neutral_600};\n    }\n  }\n\n  box-shadow: ${(props) => (props.expanded ? `inset 0px 0px 0px 2px ${COLORS.primary_800}` : 'none !important')};\n\n  &:hover {\n    box-shadow: ${(props) => (props.expanded ? `inset 0px 0px 0px 2px ${COLORS.primary_700}` : 'none !important')};\n  }\n`;\n\ntype QuickSearchProps = {\n  id: string;\n  searchTerm?: string;\n  setSearchTerm: (term: string) => void;\n  enterSearch: (e: any) => void;\n  removeSearch: (e: any) => void;\n  placeholder?: string;\n  performSearchLabel?: string;\n  disabled?: boolean;\n  onKeyDown?: (e: React.KeyboardEvent) => void;\n  size?: Size.Small | Size.Medium;\n  margin?: string;\n  loading?: boolean;\n};\n\nconst QuickSearch: React.FunctionComponent<QuickSearchProps> = ({\n  id,\n  searchTerm,\n  setSearchTerm,\n  enterSearch,\n  removeSearch,\n  placeholder,\n  performSearchLabel,\n  disabled,\n  onKeyDown,\n  size,\n  margin,\n  loading,\n}: QuickSearchProps) => {\n  const searchFieldRef = React.useRef<HTMLDivElement>(null);\n  const searchFieldInputRef = React.useRef<HTMLInputElement>(null);\n\n  const [searchFieldVisible, setSearchFieldVisible] = React.useState<boolean>(false);\n  const [tabbedHere, setTabbedHere] = React.useState<boolean>(false);\n\n  const handleClickOutside = (e: any) => {\n    if (searchFieldRef?.current && !searchFieldRef.current.contains(e.target)) {\n      if (searchFieldVisible && !searchTerm?.length) {\n        setSearchFieldVisible(false);\n      }\n    }\n  };\n\n  React.useEffect(() => {\n    if (searchTerm?.length) {\n      setSearchFieldVisible(true);\n    }\n  }, [searchTerm]);\n\n  React.useEffect(() => {\n    document.addEventListener('click', handleClickOutside);\n    return () => {\n      document.removeEventListener('click', handleClickOutside);\n    };\n  });\n\n  React.useEffect(() => {\n    if (searchFieldVisible) {\n      searchFieldInputRef?.current?.focus();\n    }\n  }, [searchFieldVisible, searchFieldInputRef, id]);\n\n  const handleKeyDown = (e: any) => {\n    if (onKeyDown) {\n      onKeyDown(e);\n    }\n    if (e.key === 'Escape') {\n      if (searchFieldVisible && !searchTerm?.length) {\n        setSearchFieldVisible(false);\n      }\n    }\n  };\n\n  return (\n    <QuickSearchField\n      ref={searchFieldRef}\n      expanded={searchFieldVisible}\n      id={`${id}_main`}\n      onBlur={(event: any) => {\n        if (event.relatedTarget && searchFieldRef?.current && !searchFieldRef.current.contains(event.relatedTarget) && !searchTerm) {\n          setSearchFieldVisible(false);\n        }\n      }}\n      data-testid={`${id}_main`}\n      className={(searchTerm !== '' ? 'searchactive ' : '').concat(size ? size : '').concat( searchFieldVisible ? ' expanded' : '')}\n      tabbedHere={tabbedHere}\n      tabIndex={-1}\n      margin={margin}>\n      {searchFieldVisible && (\n        <SearchBarInput\n          placeholder={disabled ? '' : placeholder}\n          id={id}\n          ref={searchFieldInputRef}\n          disabled={disabled}\n          onKeyDown={handleKeyDown}\n          size={size}\n          setTabbedHere={setTabbedHere}\n          setSearchTerm={(term: string) => setSearchTerm(term)}\n          searchTerm={searchTerm}\n          enterSearch={enterSearch}\n        />\n      )}\n      <SearchIconWrapper className={size ? size : ''} role=\"button\" aria-label={performSearchLabel} tabIndex={-1}>\n        <IconButton\n          id={`${id}_Searchbutton`}\n          variant=\"secondary\"\n          shape=\"circular\"\n          tabIndex={searchFieldVisible ? -1 : 0}\n          action={(e) => (searchFieldVisible ? enterSearch(e) : setSearchFieldVisible(searchFieldVisible ? false : true))}>\n          <SearchIcon size=\"24px\" color={disabled ? COLORS.neutral_300 : COLORS.neutral_600} />\n        </IconButton>\n      </SearchIconWrapper>\n      <StyledIcon className={size ? size : ''} role=\"button\" tabIndex={-1} hidden={searchTerm === '' || searchTerm === undefined || !searchFieldVisible}>\n        <IconButton\n          id={`${id}_Clearicon`}\n          variant=\"secondary\"\n          shape=\"circular\"\n          action={(e) => {\n            removeSearch(e);\n            searchFieldInputRef?.current?.focus();\n          }}>\n          <ClearIcon size=\"24px\" color={disabled ? COLORS.neutral_300 : COLORS.neutral_600} />\n        </IconButton>\n      </StyledIcon>\n      {loading && searchFieldVisible && (\n        <StyledIcon className={size ? size : ''} tabIndex={-1}>\n          <LoadingIndicator size={Size.Small} color={COLORS.neutral_600} />\n        </StyledIcon>\n      )}\n    </QuickSearchField>\n  );\n};\n\nexport default QuickSearch;\n"],"file":"QuickSearch.js"}
+{"version":3,"sources":["../../../src/InputFields/QuickSearch.tsx"],"names":["QuickSearchField","styled","props","margin","COLORS","white","neutral_600","primary_800","primary_700","id","searchTerm","setSearchTerm","enterSearch","removeSearch","placeholder","performSearchLabel","disabled","onKeyDown","size","loading","QuickSearch","searchFieldRef","React","searchFieldInputRef","handleClickOutside","e","searchFieldVisible","setSearchFieldVisible","document","handleKeyDown","event","term"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport IconButton from '../Button/Iconbutton';\nimport { SearchIconWrapper, StyledIcon } from './styling';\nimport { COLORS, LoadingIndicator } from '..';\nimport { Search as SearchIcon, Clear as ClearIcon } from '../icons/systemicons/SystemIcons';\nimport SearchBarInput from './components/SearchBarInput';\nimport { StyledSearchField } from './components/SearchField';\n\nconst QuickSearchField = styled(StyledSearchField)<{ expanded: boolean; margin?: string }>`\n  ${(props) => (props.margin ? `margin: ${props.margin};` : '')}\n  -webkit-transition: box-shadow 0.2s ease-in-out, width 0.2s ease-in-out;\n  transition: box-shadow 0.2s ease-in-out, width 0.2s ease-in-out;\n\n  background-color: transparent;\n  &.small {\n    width: 48px;\n  }\n\n  &.medium {\n    width: 56px;\n  }\n  \n  &.expanded{\n    width: 100%;\n    background-color: ${COLORS.white};\n  }\n\n  input {\n    ::placeholder {\n      font-style: italic;\n      color: ${COLORS.neutral_600};\n    }\n  }\n\n  box-shadow: ${(props) => (props.expanded ? `inset 0px 0px 0px 2px ${COLORS.primary_800}` : 'none !important')};\n\n  &:hover {\n    box-shadow: ${(props) => (props.expanded ? `inset 0px 0px 0px 2px ${COLORS.primary_700}` : 'none !important')};\n  }\n`;\n\ntype QuickSearchProps = {\n  id: string;\n  searchTerm?: string;\n  setSearchTerm: (term: string) => void;\n  enterSearch: (e: any) => void;\n  removeSearch: (e: any) => void;\n  placeholder?: string;\n  performSearchLabel?: string;\n  disabled?: boolean;\n  onKeyDown?: (e: React.KeyboardEvent) => void;\n  size?: 'small' | 'medium';\n  margin?: string;\n  loading?: boolean;\n};\n\nconst QuickSearch: React.FunctionComponent<QuickSearchProps> = ({\n  id,\n  searchTerm,\n  setSearchTerm,\n  enterSearch,\n  removeSearch,\n  placeholder,\n  performSearchLabel,\n  disabled,\n  onKeyDown,\n  size,\n  margin,\n  loading,\n}: QuickSearchProps) => {\n  const searchFieldRef = React.useRef<HTMLDivElement>(null);\n  const searchFieldInputRef = React.useRef<HTMLInputElement>(null);\n\n  const [searchFieldVisible, setSearchFieldVisible] = React.useState<boolean>(false);\n  const [tabbedHere, setTabbedHere] = React.useState<boolean>(false);\n\n  const handleClickOutside = (e: any) => {\n    if (searchFieldRef?.current && !searchFieldRef.current.contains(e.target)) {\n      if (searchFieldVisible && !searchTerm?.length) {\n        setSearchFieldVisible(false);\n      }\n    }\n  };\n\n  React.useEffect(() => {\n    if (searchTerm?.length) {\n      setSearchFieldVisible(true);\n    }\n  }, [searchTerm]);\n\n  React.useEffect(() => {\n    document.addEventListener('click', handleClickOutside);\n    return () => {\n      document.removeEventListener('click', handleClickOutside);\n    };\n  });\n\n  React.useEffect(() => {\n    if (searchFieldVisible) {\n      searchFieldInputRef?.current?.focus();\n    }\n  }, [searchFieldVisible, searchFieldInputRef, id]);\n\n  const handleKeyDown = (e: any) => {\n    if (onKeyDown) {\n      onKeyDown(e);\n    }\n    if (e.key === 'Escape') {\n      if (searchFieldVisible && !searchTerm?.length) {\n        setSearchFieldVisible(false);\n      }\n    }\n  };\n\n  return (\n    <QuickSearchField\n      ref={searchFieldRef}\n      expanded={searchFieldVisible}\n      id={`${id}_main`}\n      onBlur={(event: any) => {\n        if (event.relatedTarget && searchFieldRef?.current && !searchFieldRef.current.contains(event.relatedTarget) && !searchTerm) {\n          setSearchFieldVisible(false);\n        }\n      }}\n      data-testid={`${id}_main`}\n      className={(searchTerm !== '' ? 'searchactive ' : '').concat(size ? size : '').concat( searchFieldVisible ? ' expanded' : '')}\n      tabbedHere={tabbedHere}\n      tabIndex={-1}\n      margin={margin}>\n      {searchFieldVisible && (\n        <SearchBarInput\n          placeholder={disabled ? '' : placeholder}\n          id={id}\n          ref={searchFieldInputRef}\n          disabled={disabled}\n          onKeyDown={handleKeyDown}\n          size={size}\n          setTabbedHere={setTabbedHere}\n          setSearchTerm={(term: string) => setSearchTerm(term)}\n          searchTerm={searchTerm}\n          enterSearch={enterSearch}\n        />\n      )}\n      <SearchIconWrapper className={size ? size : ''} role=\"button\" aria-label={performSearchLabel} tabIndex={-1}>\n        <IconButton\n          id={`${id}_Searchbutton`}\n          variant=\"secondary\"\n          shape=\"circular\"\n          tabIndex={searchFieldVisible ? -1 : 0}\n          action={(e) => (searchFieldVisible ? enterSearch(e) : setSearchFieldVisible(searchFieldVisible ? false : true))}>\n          <SearchIcon size=\"24px\" color={disabled ? COLORS.neutral_300 : COLORS.neutral_600} />\n        </IconButton>\n      </SearchIconWrapper>\n      <StyledIcon className={size ? size : ''} role=\"button\" tabIndex={-1} hidden={searchTerm === '' || searchTerm === undefined || !searchFieldVisible}>\n        <IconButton\n          id={`${id}_Clearicon`}\n          variant=\"secondary\"\n          shape=\"circular\"\n          action={(e) => {\n            removeSearch(e);\n            searchFieldInputRef?.current?.focus();\n          }}>\n          <ClearIcon size=\"24px\" color={disabled ? COLORS.neutral_300 : COLORS.neutral_600} />\n        </IconButton>\n      </StyledIcon>\n      {loading && searchFieldVisible && (\n        <StyledIcon className={size ? size : ''} tabIndex={-1}>\n          <LoadingIndicator size=\"small\" color={COLORS.neutral_600} />\n        </StyledIcon>\n      )}\n    </QuickSearchField>\n  );\n};\n\nexport default QuickSearch;\n"],"file":"QuickSearch.js"}

package/dist/umd/InputFields/ResponsiveComponentWrapper.js

@@ -1,16 +1,16 @@
 (function (global, factory) {
   if (typeof define === "function" && define.amd) {
-    define(["exports", "prop-types", "react", "../types", "../styles"], factory);
+    define(["exports", "prop-types", "react", "../styles"], factory);
   } else if (typeof exports !== "undefined") {
-    factory(exports, require("prop-types"), require("react"), require("../types"), require("../styles"));
+    factory(exports, require("prop-types"), require("react"), require("../styles"));
   } else {
     var mod = {
       exports: {}
     };
-    factory(mod.exports, global.propTypes, global.react, global.types, global.styles);
+    factory(mod.exports, global.propTypes, global.react, global.styles);
     global.undefined = mod.exports;
   }
-})(this, function (exports, _propTypes, _react, _types, _styles) {
+})(this, function (exports, _propTypes, _react, _styles) {
   "use strict";
 
   Object.defineProperty(exports, "__esModule", {
@@ -102,10 +102,11 @@
         window.removeEventListener('resize', handleResize);
       };
     });
-    return size && size === _types.Size.Medium ? /*#__PURE__*/React.createElement(_styles.ComponentXS, null, children) : size && size === _types.Size.Small ? /*#__PURE__*/React.createElement(_styles.ComponentXXS, null, children) : isMediumView ? /*#__PURE__*/React.createElement(_styles.ComponentXS, null, children) : /*#__PURE__*/React.createElement(_styles.ComponentXXS, null, children);
+    return size && size === 'medium' ? /*#__PURE__*/React.createElement(_styles.ComponentXS, null, children) : size && size === 'small' ? /*#__PURE__*/React.createElement(_styles.ComponentXXS, null, children) : isMediumView ? /*#__PURE__*/React.createElement(_styles.ComponentXS, null, children) : /*#__PURE__*/React.createElement(_styles.ComponentXXS, null, children);
   };
 
   ReponsiveComponentWrapper.propTypes = {
+    size: _propTypes2.default.oneOf(['small', 'medium']),
     children: _propTypes2.default.any
   };
   exports.default = ReponsiveComponentWrapper;

package/dist/umd/InputFields/ResponsiveComponentWrapper.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/InputFields/ResponsiveComponentWrapper.tsx"],"names":["children","ReponsiveComponentWrapper","size","React","handleResize","mql","window","BREAKPOINTS","setIsMediumView","Size","isMediumView"],"mappings":";;;;;;;;;;;;;;;;;;;;;MAGA,K;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAHA;AACA;AACA;;AAIA;AACA;AACA;AAGA;AAMA,QAAMC,yBAA8D,GAAG,CAAC;AAAA,IAAA,QAAA;AAAYC,IAAAA;AAAZ,GAAD,KAAoC;AACzG;AACA,UAAM,CAAA,YAAA,EAAA,eAAA,IAAkCC,KAAK,CAALA,QAAAA,CAAxC,KAAwCA,CAAxC;AAEAA,IAAAA,KAAK,CAALA,SAAAA,CAAgB,MAAM;AACpB,YAAMC,YAAY,GAAG,MAAM;AACzB,cAAMC,GAAG,GAAGC,MAAM,CAANA,UAAAA,CAAmB,GAAEC,oBAAAA,MAAAA,CAAAA,OAAAA,CAAAA,SAAAA,EAAAA,EAAAA,CAAjC,EAAYD,CAAZ;AACAE,QAAAA,eAAe,CAACH,GAAG,CAAnBG,OAAe,CAAfA;AAFF,OAAA;;AAIAF,MAAAA,MAAM,CAANA,gBAAAA,CAAAA,QAAAA,EAAAA,YAAAA;AACA,aAAO,SAAA,OAAA,GAAmB;AACxBA,QAAAA,MAAM,CAANA,mBAAAA,CAAAA,QAAAA,EAAAA,YAAAA;AADF,OAAA;AANFH,KAAAA;AAWA,WAAOD,IAAI,IAAIA,IAAI,KAAKO,YAAjBP,MAAAA,GAAAA,aACL,KAAA,CAAA,aAAA,CAAA,mBAAA,EAAA,IAAA,EADKA,QACL,CADKA,GAEHA,IAAI,IAAIA,IAAI,KAAKO,YAAjBP,KAAAA,GAAAA,aACF,KAAA,CAAA,aAAA,CAAA,oBAAA,EAAA,IAAA,EADEA,QACF,CADEA,GAEAQ,YAAY,GAAA,aACd,KAAA,CAAA,aAAA,CAAA,mBAAA,EAAA,IAAA,EADc,QACd,CADc,GAAA,aAGd,KAAA,CAAA,aAAA,CAAA,oBAAA,EAAA,IAAA,EAPF,QAOE,CAPF;AAfF,GAAA;;;AAHEV,IAAAA,Q;;oBA6BF,yB","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\nimport { Size } from '../types';\n\n/**\n * Import custom styles.\n */\nimport { BREAKPOINTS, ComponentXXS, ComponentXS } from '../styles';\n\n// Add component-specific types\ntype LabelProps = {\n  size?: Size.Small | Size.Medium;\n  children?: any;\n};\n\nconst ReponsiveComponentWrapper: React.FunctionComponent<LabelProps> = ({ children, size }: LabelProps) => {\n  // Globally used variables within the component\n  const [isMediumView, setIsMediumView] = React.useState<boolean>(false);\n\n  React.useEffect(() => {\n    const handleResize = () => {\n      const mql = window.matchMedia(`${BREAKPOINTS.MEDIUM.replace('@media ', '')}`);\n      setIsMediumView(mql.matches);\n    };\n    window.addEventListener('resize', handleResize);\n    return function cleanup() {\n      window.removeEventListener('resize', handleResize);\n    };\n  });\n\n  return size && size === Size.Medium ? (\n    <ComponentXS>{children}</ComponentXS>\n  ) : size && size === Size.Small ? (\n    <ComponentXXS>{children}</ComponentXXS>\n  ) : isMediumView ? (\n    <ComponentXS>{children}</ComponentXS>\n  ) : (\n    <ComponentXXS>{children}</ComponentXXS>\n  );\n};\n\nexport default ReponsiveComponentWrapper;\n"],"file":"ResponsiveComponentWrapper.js"}
+{"version":3,"sources":["../../../src/InputFields/ResponsiveComponentWrapper.tsx"],"names":["size","children","ReponsiveComponentWrapper","React","handleResize","mql","window","BREAKPOINTS","setIsMediumView","isMediumView"],"mappings":";;;;;;;;;;;;;;;;;;;;;MAGA,K;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAHA;AACA;AACA;;AAGA;AACA;AACA;AAGA;AAMA,QAAME,yBAA8D,GAAG,CAAC;AAAA,IAAA,QAAA;AAAYF,IAAAA;AAAZ,GAAD,KAAoC;AACzG;AACA,UAAM,CAAA,YAAA,EAAA,eAAA,IAAkCG,KAAK,CAALA,QAAAA,CAAxC,KAAwCA,CAAxC;AAEAA,IAAAA,KAAK,CAALA,SAAAA,CAAgB,MAAM;AACpB,YAAMC,YAAY,GAAG,MAAM;AACzB,cAAMC,GAAG,GAAGC,MAAM,CAANA,UAAAA,CAAmB,GAAEC,oBAAAA,MAAAA,CAAAA,OAAAA,CAAAA,SAAAA,EAAAA,EAAAA,CAAjC,EAAYD,CAAZ;AACAE,QAAAA,eAAe,CAACH,GAAG,CAAnBG,OAAe,CAAfA;AAFF,OAAA;;AAIAF,MAAAA,MAAM,CAANA,gBAAAA,CAAAA,QAAAA,EAAAA,YAAAA;AACA,aAAO,SAAA,OAAA,GAAmB;AACxBA,QAAAA,MAAM,CAANA,mBAAAA,CAAAA,QAAAA,EAAAA,YAAAA;AADF,OAAA;AANFH,KAAAA;AAWA,WAAOH,IAAI,IAAIA,IAAI,KAAZA,QAAAA,GAAAA,aACL,KAAA,CAAA,aAAA,CAAA,mBAAA,EAAA,IAAA,EADKA,QACL,CADKA,GAEHA,IAAI,IAAIA,IAAI,KAAZA,OAAAA,GAAAA,aACF,KAAA,CAAA,aAAA,CAAA,oBAAA,EAAA,IAAA,EADEA,QACF,CADEA,GAEAS,YAAY,GAAA,aACd,KAAA,CAAA,aAAA,CAAA,mBAAA,EAAA,IAAA,EADc,QACd,CADc,GAAA,aAGd,KAAA,CAAA,aAAA,CAAA,oBAAA,EAAA,IAAA,EAPF,QAOE,CAPF;AAfF,GAAA;;;AAJET,IAAAA,I,6BAAO,O,EAAU,Q;AACjBC,IAAAA,Q;;oBA6BF,yB","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom styles.\n */\nimport { BREAKPOINTS, ComponentXXS, ComponentXS } from '../styles';\n\n// Add component-specific types\ntype LabelProps = {\n  size?: 'small' | 'medium';\n  children?: any;\n};\n\nconst ReponsiveComponentWrapper: React.FunctionComponent<LabelProps> = ({ children, size }: LabelProps) => {\n  // Globally used variables within the component\n  const [isMediumView, setIsMediumView] = React.useState<boolean>(false);\n\n  React.useEffect(() => {\n    const handleResize = () => {\n      const mql = window.matchMedia(`${BREAKPOINTS.MEDIUM.replace('@media ', '')}`);\n      setIsMediumView(mql.matches);\n    };\n    window.addEventListener('resize', handleResize);\n    return function cleanup() {\n      window.removeEventListener('resize', handleResize);\n    };\n  });\n\n  return size && size === 'medium' ? (\n    <ComponentXS>{children}</ComponentXS>\n  ) : size && size === 'small' ? (\n    <ComponentXXS>{children}</ComponentXXS>\n  ) : isMediumView ? (\n    <ComponentXS>{children}</ComponentXS>\n  ) : (\n    <ComponentXXS>{children}</ComponentXXS>\n  );\n};\n\nexport default ReponsiveComponentWrapper;\n"],"file":"ResponsiveComponentWrapper.js"}