@laerdal/life-react-components 1.1.2-dev.8 → 1.2.1-dev.2

package/dist/esm/Dropdown/DropdownContent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Dropdown/DropdownContent.tsx"],"names":["React","useLayoutEffect","createRef","styled","Button","Size","ButtonDropdownContentStyling","DropdownButton","COLORS","Checkbox","RadioButton","DDContainer","div","white","props","width","isButton","alignLeft","neutral_100","size","Large","Medium","scrollable","maxHeight","ListContainer","itemsType","neutral_600","neutral_500","ItemsContainer","TopItemContainer","neutral_200","ActionButtonContainer","MAX_MENU_HEIGHT","AVG_OPTION_HEIGHT","DropdownContent","id","customizationProps","isOpen","hideOnClickOutside","setIsOpen","filter","focused","setFocused","selectedValues","setSelectedValues","messageOnNoResults","isUp","setIsUp","useState","dropdownContentRef","useRef","Small","itemsListRef","determineDropUp","options","items","node","current","windowHeight","window","innerHeight","menuHeight","Math","min","length","instOffsetWithMenu","getBoundingClientRect","top","setNewFocusedElement","index","newFocusedElement","elRefs","focus","handleKeyDown","e","keyCode","preventDefault","focusedNow","undefined","document","getElementById","handleClickOutside","contains","target","some","x","useEffect","addEventListener","removeEventListener","scrollPosition","handleScroll","scrollTop","getFilteredItems","filtrationString","toUpperCase","value","includes","displayLabel","getCorrectRef","ref","arrLength","setElRefs","Array","fill","map","_","i","haveTopItem","multiSelect","getSuggestions","suggestion","focusThis","getTopItem","pinTopItem","visibleItems","allSelected","y","showTopItem","suggestions","selected","newValues","onValueUpdate","icon","noteLabel","fontSize","getElements","number","item","disabled","newValue","showDividerAbove","join","action","actionLabel"],"mappings":"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","sourcesContent":["import React, { useLayoutEffect, useMemo, createRef } from 'react';\nimport styled, { css } from 'styled-components';\nimport { CommonInteractionStyling } from '../common';\nimport Button from '../Button/Button';\nimport { Size } from '../types';\nimport { ButtonDropdownContentStyling, DropdownButton } from './CommonStyling';\nimport { BREAKPOINTS, COLORS } from '../styles';\nimport { Checkbox, RadioButton } from '../InputFields';\n\nexport const DDContainer = styled.div<{ isButton: boolean; width?: string; alignLeft?: boolean; size?: Size; scrollable?: boolean; maxHeight?: string }>`\n  display: none;\n  position: absolute;\n  background-color: ${COLORS.white};\n  \n  width: ${props => props.width ? props.width : '100%'};\n  z-index: 1;\n  margin: ${props => (props.isButton ? '-4px' : '4px 0px')};\n\n  &.show {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n  }\n\n  &.up {\n    top: auto;\n    bottom: 100%;\n  }\n\n  ${props => (props.alignLeft ? 'left: 0px;' : '')}\n\n  ${props => (props.isButton ? ButtonDropdownContentStyling : '')};\n\n  border: 1px solid ${COLORS.neutral_100};\n  box-sizing: border-box;\n  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15);\n  padding-top: 4px;\n  padding-right: 0px;\n  padding-bottom: 4px;\n  padding-left: 0px;\n\n  min-width: ${props => (props.size == Size.Large ? '320px' : props.size == Size.Medium ? '280px' : '240px')};\n  border-radius: ${props => (props.size == Size.Large ? '10px' : props.size == Size.Medium ? '8px' : '6px')};\n\n  max-height: ${props => (!props.scrollable ? 'auto' : props.maxHeight ? props.maxHeight : props.size == Size.Large ? '320px' : props.size == Size.Medium ? '280px' : '240px')};\n`;\n\nconst ListContainer = styled.div<{ scrollable?: boolean, size? : Size, itemsType?: string }>`\n  ${props => (props.scrollable ? 'overflow-y: scroll;' : '')}\n  ${props => (props.itemsType != 'normal' ? 'margin-left: 4px;' : '')}\n\n  div {\n    padding-top: ${props => props.size == Size.Large ? '8px' : props.size == Size.Medium ? '4px' : '0px' };\n    padding-bottom: ${props => props.size == Size.Large ? '8px' : props.size == Size.Medium ? '4px' : '0px' };\n  }\n\n  /* width */\n  ::-webkit-scrollbar {\n    width: 4px;\n    margin: 0 6px;\n    cursor: pointer;\n  }\n\n  /* Track */\n  ::-webkit-scrollbar-track {\n    background: ${COLORS.neutral_100};\n    border-radius: 8px;\n  }\n\n  /* Handle */\n  ::-webkit-scrollbar-thumb {\n    background: ${COLORS.neutral_600};\n    border-radius: 8px;\n  }\n\n  /* Handle on hover */\n  ::-webkit-scrollbar-thumb:hover {\n    background: ${COLORS.neutral_500};\n  }\n`;\n\nconst ItemsContainer = styled.div`\n`;\n\n\nconst TopItemContainer = styled.div`\n  border-bottom-style: solid;\n  border-bottom-color: ${COLORS.neutral_200};\n  border-bottom-width: 1px;\n  margin-right: 22px;  \n`;\n\nconst ActionButtonContainer = styled.div`\n  border-top-style: solid;\n  border-top-color: ${COLORS.neutral_200};\n  border-top-width: 1px;\n  padding: 0px 16px 4px 16px;\n\n  button {\n    width: 100%;\n  }\n`;\n\nconst MAX_MENU_HEIGHT = 240;\nconst AVG_OPTION_HEIGHT = 48;\n\nexport interface DropdownItem {\n  value: string;\n  displayLabel?: string;\n  noteLabel?: string;\n  suggestion?: boolean;\n  showDividerAbove?: boolean;\n  disabled?: boolean;\n  icon?: React.ReactNode;\n}\n\nexport interface DropdownCustomizationProps {\n  itemsType?: 'radio' | 'checkbox' | 'normal';\n  scrollable?: boolean;\n  multiSelect?: boolean;\n  maxHeight?: string;\n  actionLabel?: string;\n  action: () => void;\n  pinTopItem?: boolean;\n  onValueUpdate: (values: string[]) => void;\n  items: DropdownItem[];\n}\n\nexport interface DropdownProps {\n  isButton: boolean;\n  customizationProps: DropdownCustomizationProps;\n  alignLeft?: boolean;\n  isOpen: boolean;\n  setIsOpen: (open: boolean) => void;\n  size?: Size;\n  id: string;\n  filter: string;\n  width?: string;\n  hideOnClickOutside: boolean;\n  selectedValues: string[];\n  setSelectedValues: (val: string[]) => void;\n  messageOnNoResults: string;\n  focused: number | null;\n  setFocused: (focused: number | null) => void;\n}\n\nconst DropdownContent: React.FunctionComponent<DropdownProps> = ({\n  id,\n  customizationProps,\n  alignLeft,\n  isButton,\n  size,\n  isOpen,\n  hideOnClickOutside,\n  width,\n  setIsOpen,\n  filter,\n  focused, \n  setFocused,\n  selectedValues,\n  setSelectedValues,\n  messageOnNoResults\n}) => {\n  const [isUp, setIsUp] = React.useState<boolean>(false);\n  const dropdownContentRef = React.useRef<HTMLDivElement>(null);\n\n  if(!customizationProps.itemsType) customizationProps.itemsType = 'normal';\n  if(!size) size = Size.Small;\n\n  const itemsListRef = React.useRef<HTMLDivElement>(null);\n\n  const determineDropUp = () => {\n    const options = customizationProps.items;\n    const node = dropdownContentRef.current;\n\n    if (!node) return;\n\n    const windowHeight = window.innerHeight;\n    const menuHeight = Math.min(MAX_MENU_HEIGHT, options.length * AVG_OPTION_HEIGHT);\n    const instOffsetWithMenu = node.getBoundingClientRect().top + menuHeight;\n    setIsUp(instOffsetWithMenu >= windowHeight);\n  };\n\n  const setNewFocusedElement = (index: number) => {\n    const newFocusedElement = elRefs[index];\n    if (newFocusedElement) {\n      setFocused(index);\n      newFocusedElement?.current?.focus();\n    }\n  };\n  \n  const handleKeyDown = (e: any) => {\n    if (isOpen) {\n      if (e.keyCode === 38) {\n        e.preventDefault();\n        var focusedNow = focused;\n        if (focusedNow !== undefined && focusedNow !== null && focusedNow > 0) {\n          focusedNow -= 1;\n          setNewFocusedElement(focusedNow);\n        }\n      } else if (e.keyCode === 40) {\n        e.preventDefault();\n        var focusedNow = focused;\n        if (focusedNow !== undefined && focusedNow !== null) {\n          focusedNow++;\n        } else {\n          focusedNow = 0;\n        }\n        setNewFocusedElement(focusedNow);\n      } else if (e.keyCode === 9) {\n        e.preventDefault();\n        var focusedNow = focused;\n        if (focusedNow !== undefined && focusedNow !== null) {\n          focusedNow++;\n          const newFocusedElement = document.getElementById(`${id}_${focusedNow}`);\n          if (!newFocusedElement) {\n            setNewFocusedElement(0);\n          } else {\n            setNewFocusedElement(focusedNow);\n          }\n        } else {\n          setFocused(null);\n        }\n      } else if (e.keyCode === 27) {\n        setIsOpen(false);\n        setFocused(null);\n\n        //TODO: add onEscapehandler\n        /*\n        if (!list.includes(input)) {\n          setInput('');\n          setPlaceholderSearch(placeholder || '');\n        }\n        styledFieldRef.current?.focus(); */\n      }\n    }\n  };\n\n  const handleClickOutside = (e: any) => {\n    if (hideOnClickOutside && dropdownContentRef?.current && !dropdownContentRef.current.contains(e.target) && !elRefs.some(x => x?.current?.contains(e.target))) {\n      if (isOpen) {\n        setIsOpen(false);\n        setFocused(null);\n      }\n    }\n  };\n\n  React.useEffect(() => {\n    document.addEventListener('keydown', handleKeyDown);\n    document.addEventListener('click', handleClickOutside);\n    return () => {\n      document.removeEventListener('keydown', handleKeyDown);\n      document.removeEventListener('click', handleClickOutside);\n    };\n  });\n\n  const scrollPosition = React.useRef<number | undefined>(0); \n  const handleScroll = () => {\n    scrollPosition.current = itemsListRef.current?.scrollTop;\n  }\n  useLayoutEffect(() => {\n    if (itemsListRef.current) itemsListRef.current.scrollTop = scrollPosition.current ?? 0;\n  }, [selectedValues]);\n\n  const getFilteredItems = () => {\n    const filtrationString = (filter ?? '').toUpperCase();\n    return customizationProps.items.\n      filter(x => x?.value?.toUpperCase().includes(filtrationString) || x?.displayLabel?.toUpperCase().includes(filtrationString));\n  };\n\n  const getCorrectRef = (ref: React.RefObject<HTMLElement>): React.RefObject<HTMLElement> => {\n    switch(customizationProps.itemsType)\n    {\n      case 'normal':\n        return ref as React.RefObject<HTMLButtonElement> || createRef<HTMLButtonElement>();\n      default:\n        return ref as React.RefObject<HTMLDivElement> || createRef<HTMLDivElement>();\n    }\n  }\n\n  const arrLength = getFilteredItems().length;\n  const [elRefs, setElRefs] = React.useState<React.RefObject<HTMLElement>[]>([]);\n\n  React.useEffect(() => {\n    setElRefs(elRefs => \n      Array(arrLength + 1).fill(null)\n        .map((_, i) => getCorrectRef(elRefs[i])));\n  }, [isOpen, arrLength, selectedValues]);\n    \n  React.useEffect(() => {\n    determineDropUp();\n  }, [isOpen]);\n\n\n  const haveTopItem = () => {\n    if (customizationProps.itemsType == 'radio' && selectedValues && selectedValues?.length > 0) return true;\n    else if (customizationProps.itemsType == 'checkbox' && (customizationProps.multiSelect || selectedValues?.length > 0)) return true;\n    else if (customizationProps.itemsType == 'normal' && getSuggestions()?.length > 0) return true;\n    return false;\n  };\n  \n  const getSuggestions = () => {\n    return getFilteredItems().filter(x => x.suggestion);\n  }\n\n  React.useLayoutEffect(() => {\n    if (isOpen && (focused || focused == 0)) {\n      const focusThis = focused == 0 && !haveTopItem() ? 1 : focused;\n      if(focusThis != focused)\n        setFocused(focusThis);\n      const newFocusedElement = elRefs[focusThis];\n      newFocusedElement?.current?.focus();\n    }\n    else\n      setFocused(null); //if the dropdown is closed, we don't to keep saved the focused item\n  }, [isOpen]);\n\n  \n\n  const getTopItem = () => {\n    if (!customizationProps.pinTopItem) return;\n    const visibleItems = getFilteredItems();\n    const allSelected = selectedValues?.filter(x => visibleItems.some(y => y.value == x)).length == visibleItems.length;\n    let showTopItem = false;\n    const suggestions = getSuggestions();\n\n    if (customizationProps.itemsType == 'radio' && selectedValues && selectedValues?.length > 0) showTopItem = true;\n    else if (customizationProps.itemsType == 'checkbox' && (customizationProps.multiSelect || selectedValues?.length > 0)) showTopItem = true;\n    else if (customizationProps.itemsType == 'normal' && suggestions.length > 0) showTopItem = true;\n\n    if (!showTopItem) return;\n   \n    return (\n      <TopItemContainer>\n        {customizationProps.itemsType == 'radio' && (\n          <RadioButton\n            ref={elRefs[0] as React.RefObject<HTMLDivElement>}\n            iconPointerEventsTransparent={true}\n            select={() => {}} size={size} id={`${id}_topitem`} label={selectedValues[0]} selected={true} />\n        )}\n        {customizationProps.itemsType == 'checkbox' && (\n          <Checkbox\n            ref={elRefs[0] as React.RefObject<HTMLDivElement>}\n            select={(selected: boolean) => {\n              if (!customizationProps.multiSelect) return;\n\n              const newValues = selected ? visibleItems.map(x => x.value) : [];\n              setSelectedValues(newValues);\n              customizationProps.onValueUpdate && customizationProps.onValueUpdate(newValues);\n            }}\n            iconPointerEventsTransparent={true}\n            semiSelected={customizationProps.multiSelect && !allSelected && selectedValues?.length > 0}\n            size={size}\n            id={`${id}_checkbox_selectall`}\n            label={customizationProps.multiSelect ? 'Select all' : selectedValues[0]}\n            selected={!customizationProps.multiSelect || allSelected}\n          />\n        )}\n        {customizationProps.itemsType == 'normal' && (\n          <>\n          {suggestions.map(x => \n            <DropdownButton ref={elRefs[0] as React.RefObject<HTMLButtonElement>} type=\"button\" id={`${id}_topitem`}\n              onClick={(e: any) => {\n                customizationProps.onValueUpdate([x.value]);\n                setSelectedValues([x.value]);\n                setIsOpen(false);\n                setFocused(null);\n              }}>\n              <div className=\"item-content\">\n                {x?.icon && <div className=\"item-icon\">{x?.icon}</div>}\n                <div className=\"item-label\">\n                  {x?.displayLabel ?? x?.value}\n                  {x?.noteLabel && <div style={{fontSize: '12px'}}>{x.noteLabel}</div>}\n                </div>\n              </div>\n            </DropdownButton>)}\n          </>\n        )}\n      </TopItemContainer>\n    );\n  };\n\n  const getElements = () => {\n    if (getFilteredItems().length === 0) {\n      return (\n        <ItemsContainer>\n          <DropdownButton disabled>\n            <span>{messageOnNoResults}</span>\n          </DropdownButton>\n        </ItemsContainer>\n      );\n    }\n    let number = 0;\n    return (\n      <ItemsContainer>\n        {getFilteredItems().filter(x => x && (customizationProps.itemsType != 'normal' || !x.suggestion)).map(item => {\n          return (\n            <>\n              {customizationProps.itemsType == 'radio' && (\n                <RadioButton\n                  select={(selected: boolean) => {\n                    if (!selected) return;\n                    customizationProps.onValueUpdate && customizationProps.onValueUpdate([item.value]);\n                    setSelectedValues([item.value]);\n                  }}\n                  ref={elRefs[number + 1] as React.RefObject<HTMLDivElement>}\n                  size={size}\n                  iconPointerEventsTransparent={true}\n                  disabled={item?.disabled}\n                  key={`key_${id}_${number++}`}\n                  id={`${id}_${number + 1}`}\n                  label={item.value}\n                  selected={selectedValues?.includes(item.value)}\n                />\n              )}\n              {customizationProps.itemsType == 'checkbox' && (\n                <Checkbox\n                  select={(selected: boolean) => {\n                    let newValue: string[] = [];\n                    if (customizationProps.multiSelect) {\n                      if (selected) newValue = [...selectedValues, item.value];\n                      else newValue = selectedValues.filter(x => x != item.value);\n                    } else newValue = selected ? [item.value] : [];\n\n                    setSelectedValues(newValue);\n                    customizationProps.onValueUpdate(newValue);\n                  }}\n                  iconPointerEventsTransparent={true}\n                  disabled={item?.disabled} \n                  ref={elRefs[number + 1] as React.RefObject<HTMLDivElement>}\n                  size={size}\n                  key={`key_${id}_${number++}`}\n                  id={`${id}_${number + 1}`}\n                  label={item.value}\n                  selected={selectedValues?.includes(item.value)}\n                />\n              )}\n              {(customizationProps.itemsType == 'normal' || !customizationProps.itemsType) && (\n                  <DropdownButton\n                    type=\"button\"\n                    size={size}\n                    disabled={item?.disabled}\n                    ref={elRefs[number + 1] as React.RefObject<HTMLButtonElement>}\n                    onClick={(e: any) => {\n                      customizationProps.onValueUpdate([item.value]);\n                      setSelectedValues([item.value]);\n                      setIsOpen(false);\n                      setFocused(null);\n                    }}\n                    className={ (item.showDividerAbove ? 'show-divider-above' : '') + ' ' + (selectedValues?.includes(item.value) ? 'active' : '')}\n                    key={`key_${id}_${number++}`}\n                    id={`${id}_${number + 1}`}>\n                      {item.showDividerAbove && <div className=\"divider\"/>}\n                      <div className=\"item-content\">\n                        {item.icon && <div className=\"item-icon\">{item.icon}</div>}\n                        <div className=\"item-label\">\n                          {item.displayLabel ?? item.value}\n                          {item.noteLabel && <div style={{fontSize: '12px'}}>{item.noteLabel}</div>}\n                        </div>\n                      </div>\n                  </DropdownButton>\n              )}\n            </>\n          );\n        })}\n      </ItemsContainer>\n    );\n  };\n\n  return <DDContainer\n          ref={dropdownContentRef}\n          size={size}\n          width={width}\n          isButton={isButton}\n          alignLeft={alignLeft}\n          scrollable={customizationProps.scrollable}\n          maxHeight={customizationProps.maxHeight}\n          className={[isOpen && 'show', isUp && 'up'].filter(e => !!e).join(' ')}>\n          <ListContainer size={size} itemsType={customizationProps.itemsType} onScroll={handleScroll} ref={itemsListRef} scrollable={customizationProps.scrollable}>\n            {customizationProps.pinTopItem && getTopItem()}\n            {getElements()}\n          </ListContainer>\n          {customizationProps.action && customizationProps.actionLabel && (\n            <ActionButtonContainer>\n              <Button width=\"100%\" variant=\"primary\" size={size} onClick={() => customizationProps.action()}>\n                {customizationProps.actionLabel}\n              </Button>\n            </ActionButtonContainer>\n          )}\n        </DDContainer>;\n  /*  ),\n    {\n      handleClickOutside: () => () => {\n        if (isOpen) {\n          setIsOpen(false);\n          setFocused(null);\n        }\n      },\n    },\n  );\n\n  return <Wrapped />; */\n};\n\nexport default DropdownContent;\n"],"file":"DropdownContent.js"}
+{"version":3,"sources":["../../../src/Dropdown/DropdownContent.tsx"],"names":["React","useLayoutEffect","createRef","styled","Button","Size","ButtonDropdownContentStyling","DropdownButtonCSS","ComponentLStyling","ComponentXLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","COLORS","Checkbox","RadioButton","DDContainer","div","white","props","width","isButton","alignLeft","neutral_100","size","Large","Medium","scrollable","maxHeight","ItemsContainer","ListContainer","itemsType","neutral_600","neutral_500","MenuContentContainer","Bold","Small","Regular","DividerContainer","TopItemContainer","neutral_200","ActionButtonContainer","MAX_MENU_HEIGHT","AVG_OPTION_HEIGHT","DropdownContent","id","customizationProps","isOpen","hideOnClickOutside","setIsOpen","filter","focused","setFocused","selectedValues","setSelectedValues","messageOnNoResults","isUp","setIsUp","useState","dropdownContentRef","useRef","itemsListRef","determineDropUp","options","items","node","current","windowHeight","window","innerHeight","menuHeight","Math","min","length","instOffsetWithMenu","getBoundingClientRect","top","setNewFocusedElement","index","newFocusedElement","elRefs","focus","getFilteredItems","filtrationString","toUpperCase","x","value","includes","displayLabel","handleKeyDown","e","keyCode","preventDefault","focusedNow","undefined","filtered","i","disabled","haveTopItem","document","getElementById","handleClickOutside","contains","target","some","useEffect","addEventListener","removeEventListener","scrollPosition","handleScroll","scrollTop","getCorrectRef","ref","arrLength","setElRefs","Array","fill","map","_","multiSelect","getSuggestions","suggestion","focusThis","getTopItem","pinTopItem","visibleItems","allSelected","y","showTopItem","suggestions","find","c","selectedFirst","selected","newValues","onValueUpdate","icon","noteLabel","fontSize","getElements","number","item","customContent","newValue","showDividerAbove","join","menuContent","action","actionLabel","actionVariant"],"mappings":"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","sourcesContent":["import React, { useLayoutEffect, useMemo, createRef } from 'react';\nimport styled, { css } from 'styled-components';\nimport { CommonInteractionStyling } from '../common';\nimport Button from '../Button/Button';\nimport { Size } from '../types';\nimport { ButtonDropdownContentStyling, DropdownButtonCSS } from './CommonStyling';\nimport { ComponentLStyling, ComponentXLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles/typography';\nimport { COLORS } from '../styles';\nimport { Checkbox, RadioButton } from '../InputFields';\n\nexport const DDContainer = styled.div<{ isButton: boolean; width?: string; alignLeft?: boolean; size?: Size; scrollable?: boolean; maxHeight?: string }>`\n  display: none;\n  position: absolute;\n  background-color: ${COLORS.white};\n\n  width: ${(props) => (props.width ? props.width : '100%')};\n  z-index: 1;\n  margin: ${(props) => (props.isButton ? '-4px' : '4px 0px')};\n\n  &.show {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n  }\n\n  &.up {\n    top: auto;\n    bottom: 100%;\n  }\n\n  ${(props) => (props.alignLeft ? 'left: 0px;' : '')}\n\n  ${(props) => (props.isButton ? ButtonDropdownContentStyling : '')};\n\n  border: 1px solid ${COLORS.neutral_100};\n  box-sizing: border-box;\n  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15);\n  padding-top: 4px;\n  padding-right: 0px;\n  padding-bottom: 4px;\n  padding-left: 0px;\n\n  min-width: ${(props) => (props.size == Size.Large ? '320px' : props.size == Size.Medium ? '280px' : '240px')};\n  border-radius: ${(props) => (props.size == Size.Large ? '10px' : props.size == Size.Medium ? '8px' : '6px')};\n\n  max-height: ${(props) => (!props.scrollable ? 'auto' : props.maxHeight ? props.maxHeight : props.size == Size.Large ? '320px' : props.size == Size.Medium ? '280px' : '240px')};\n`;\n\nconst ItemsContainer = styled.div<{size? : Size}>`\n  button.dropdownButton {\n    ${props => DropdownButtonCSS(props.size)}\n  }`;\n  \nconst ListContainer = styled.div<{ scrollable?: boolean; size?: Size; itemsType?: string }>`\n  ${(props) => (props.scrollable ? 'overflow-y: scroll;' : '')}\n  ${(props) => (props.itemsType != 'normal' ? 'margin-left: 4px;' : '')}\n\n\n  div.divider  {\n    display: block;\n    width: calc(100% - 40px);\n    margin-left: 16px;\n    border-top: 1px solid #e5e5e5;\n    position: absolute;\n    top: 0px;\n  }\n\n  ${ItemsContainer} {\n    padding-top: ${props => props.size == Size.Large ? '8px' : props.size == Size.Medium ? '4px' : '0px' };\n    padding-bottom: ${props => props.size == Size.Large ? '8px' : props.size == Size.Medium ? '4px' : '0px' };\n  }\n\n  /* width */\n  ::-webkit-scrollbar {\n    width: 4px;\n    margin: 0 6px;\n    cursor: pointer;\n  }\n\n  /* Track */\n  ::-webkit-scrollbar-track {\n    background: ${COLORS.neutral_100};\n    border-radius: 8px;\n  }\n\n  /* Handle */\n  ::-webkit-scrollbar-thumb {\n    background: ${COLORS.neutral_600};\n    border-radius: 8px;\n  }\n\n  /* Handle on hover */\n  ::-webkit-scrollbar-thumb:hover {\n    background: ${COLORS.neutral_500};\n  }\n`;\n\n\nconst MenuContentContainer = styled.div<{size? : Size}>`\n  h1, h2, h3 {\n    margin-block-start: 0px;\n    margin-block-end: 0px;\n    ${props => props.size == Size.Large && ComponentXLStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n    ${props => props.size == Size.Medium && ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n    ${props => (props.size == Size.Small || !props.size) && ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_500)}\n    padding: ${props => props.size == Size.Small || !props.size ? '10px 16px 6px' :\n      props.size == Size.Medium ? '16px 24px 8px' : '16px 32px 8px'};\n  }\n\n  p {\n    margin-block-start: 0px;\n    margin-block-end: 0px;\n    ${props => props.size == Size.Large && ComponentLStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n    ${props => props.size == Size.Medium && ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n    ${props => (props.size == Size.Small || !props.size) && ComponentSStyling(ComponentTextStyle.Regular, COLORS.neutral_500)}\n    padding: ${props => props.size == Size.Small || !props.size ? '8px 16px' :\n      props.size == Size.Medium ? '12px 24px' : '16px 32px'};\n  }\n`;\n\nconst DividerContainer = styled.div<{size? : Size}>`\n  position: relative;\n\n  margin-top: ${props => props.size == Size.Large ? '16px' : \n      props.size == Size.Medium ? '12px' : \n      (props.size == Size.Small || !props.size) ? '8px' : '6px'};\n\n  div.divider {\n    width: 100%;\n    margin: 0px;\n  }\n`;\n\nconst TopItemContainer = styled.div<{size?:Size}>`\n  border-bottom-style: solid;\n  border-bottom-color: ${COLORS.neutral_200};\n  border-bottom-width: 1px;\n  margin-right: 22px;\n\n  button {\n    ${props => DropdownButtonCSS(props.size)}\n  }\n`;\n\nconst ActionButtonContainer = styled.div<{size?:Size}>`\n  border-top-style: solid;\n  border-top-color: ${COLORS.neutral_200};\n  border-top-width: 1px;\n  \n  padding: ${props => props.size == Size.Small || !props.size ? '0px 16px' : '8px 16px'};\n\n  button {\n    width: 100%;\n  }\n`;\n\nconst MAX_MENU_HEIGHT = 240;\nconst AVG_OPTION_HEIGHT = 48;\n\nexport interface DropdownItem {\n  value: string;\n  displayLabel?: string;\n  noteLabel?: string;\n  suggestion?: boolean;\n  showDividerAbove?: boolean;\n  disabled?: boolean;\n  icon?: React.ReactNode;\n  customContent?: React.ReactNode;\n}\n\nexport interface DropdownCustomizationProps {\n  itemsType?: 'radio' | 'checkbox' | 'normal';\n  menuContent?: React.ReactNode;\n  scrollable?: boolean;\n  multiSelect?: boolean;\n  maxHeight?: string;\n  actionLabel?: string;\n  actionVariant?: 'primary' | 'secondary' | 'tertiary' | undefined;\n  action: () => boolean | void | undefined;\n  pinTopItem?: boolean;\n  onValueUpdate: (values: string[]) => void;\n  items: DropdownItem[];\n}\n\nexport interface DropdownProps {\n  isButton: boolean;\n  customizationProps: DropdownCustomizationProps;\n  alignLeft?: boolean;\n  isOpen: boolean;\n  setIsOpen: (open: boolean) => void;\n  size?: Size;\n  id: string;\n  filter: string;\n  width?: string;\n  hideOnClickOutside: boolean;\n  selectedValues: string[];\n  setSelectedValues: (val: string[]) => void;\n  messageOnNoResults: string;\n  focused: number | null;\n  setFocused: (focused: number | null) => void;\n}\n\nconst DropdownContent: React.FunctionComponent<DropdownProps> = ({\n  id,\n  customizationProps,\n  alignLeft,\n  isButton,\n  size,\n  isOpen,\n  hideOnClickOutside,\n  width,\n  setIsOpen,\n  filter,\n  focused,\n  setFocused,\n  selectedValues,\n  setSelectedValues,\n  messageOnNoResults,\n}) => {\n  const [isUp, setIsUp] = React.useState<boolean>(false);\n  const dropdownContentRef = React.useRef<HTMLDivElement>(null);\n\n  if (!customizationProps.itemsType) customizationProps.itemsType = 'normal';\n  if (!size) size = Size.Small;\n\n  const itemsListRef = React.useRef<HTMLDivElement>(null);\n\n  const determineDropUp = () => {\n    const options = customizationProps.items;\n    const node = dropdownContentRef.current;\n\n    if (!node) return;\n\n    const windowHeight = window.innerHeight;\n    const menuHeight = Math.min(MAX_MENU_HEIGHT, options.length * AVG_OPTION_HEIGHT);\n    const instOffsetWithMenu = node.getBoundingClientRect().top + menuHeight;\n    setIsUp(instOffsetWithMenu >= windowHeight);\n  };\n\n  const setNewFocusedElement = (index: number) => {\n    const newFocusedElement = elRefs[index];\n    if (newFocusedElement) {\n      setFocused(index);\n      newFocusedElement?.current?.focus();\n    }\n  };\n\n  const getFilteredItems = () => {\n    const filtrationString = (filter ?? '').toUpperCase();\n    return customizationProps.items.filter((x) => x?.value?.toUpperCase().includes(filtrationString) || x?.displayLabel?.toUpperCase().includes(filtrationString));\n  };\n\n  const handleKeyDown = (e: any) => {\n    if (isOpen) {\n      if (e.keyCode === 38) {\n        e.preventDefault();\n        var focusedNow = focused;\n        if (focusedNow !== undefined && focusedNow !== null && focusedNow > 0) {\n          const filtered = getFilteredItems();\n          for (let i = focusedNow - 1; i > 0; i--) {\n            if (!filtered[i - 1]?.disabled) {\n              focusedNow = i;\n              break;\n            }\n          }\n          setNewFocusedElement(focusedNow);\n        }\n      } else if (e.keyCode === 40) {\n        e.preventDefault();\n        var focusedNow = focused;\n        if (focusedNow !== undefined && focusedNow !== null) {\n          const filtered = getFilteredItems();\n          for (let i = focusedNow + 1; i <= filtered.length; i++) {\n            if (!filtered[i - 1]?.disabled) {\n              focusedNow = i;\n              break;\n            }\n          }\n        } else {\n          focusedNow = haveTopItem() ? 0 : 1;\n        }\n        setNewFocusedElement(focusedNow);\n      } else if (e.keyCode === 9) {\n        e.preventDefault();\n        var focusedNow = focused;\n        if (focusedNow !== undefined && focusedNow !== null) {\n          focusedNow++;\n          const newFocusedElement = document.getElementById(`${id}_${focusedNow}`);\n          if (!newFocusedElement) {\n            setNewFocusedElement(0);\n          } else {\n            setNewFocusedElement(focusedNow);\n          }\n        } else {\n          setFocused(null);\n        }\n      } else if (e.keyCode === 27) {\n        setIsOpen(false);\n        setFocused(null);\n\n        //TODO: add onEscapehandler\n        /*\n        if (!list.includes(input)) {\n          setInput('');\n          setPlaceholderSearch(placeholder || '');\n        }\n        styledFieldRef.current?.focus(); */\n      }\n    }\n  };\n\n  const handleClickOutside = (e: any) => {\n    if (hideOnClickOutside && dropdownContentRef?.current && !dropdownContentRef.current.contains(e.target) && !elRefs.some((x) => x?.current?.contains(e.target))) {\n      if (isOpen) {\n        setIsOpen(false);\n        setFocused(null);\n      }\n    }\n  };\n\n  React.useEffect(() => {\n    document.addEventListener('keydown', handleKeyDown);\n    document.addEventListener('click', handleClickOutside);\n    return () => {\n      document.removeEventListener('keydown', handleKeyDown);\n      document.removeEventListener('click', handleClickOutside);\n    };\n  });\n\n  const scrollPosition = React.useRef<number | undefined>(0);\n  const handleScroll = () => {\n    scrollPosition.current = itemsListRef.current?.scrollTop;\n  };\n  useLayoutEffect(() => {\n    if (itemsListRef.current) itemsListRef.current.scrollTop = scrollPosition.current ?? 0;\n  }, [selectedValues]);\n\n  const getCorrectRef = (ref: React.RefObject<HTMLElement>): React.RefObject<HTMLElement> => {\n    switch (customizationProps.itemsType) {\n      case 'normal':\n        return (ref as React.RefObject<HTMLButtonElement>) || createRef<HTMLButtonElement>();\n      default:\n        return (ref as React.RefObject<HTMLDivElement>) || createRef<HTMLDivElement>();\n    }\n  };\n\n  const arrLength = getFilteredItems().length;\n  const [elRefs, setElRefs] = React.useState<React.RefObject<HTMLElement>[]>([]);\n\n  React.useEffect(() => {\n    setElRefs((elRefs) =>\n      Array(arrLength + 1)\n        .fill(null)\n        .map((_, i) => getCorrectRef(elRefs[i])),\n    );\n  }, [isOpen, arrLength, selectedValues]);\n\n  React.useEffect(() => {\n    determineDropUp();\n  }, [isOpen]);\n\n  const haveTopItem = () => {\n    if (customizationProps.itemsType == 'radio' && selectedValues && selectedValues?.length > 0) return true;\n    else if (customizationProps.itemsType == 'checkbox' && (customizationProps.multiSelect || selectedValues?.length > 0)) return true;\n    else if (customizationProps.itemsType == 'normal' && getSuggestions()?.length > 0) return true;\n    return false;\n  };\n\n  const getSuggestions = () => {\n    return getFilteredItems().filter((x) => x.suggestion);\n  };\n\n  React.useLayoutEffect(() => {\n    if (isOpen && (focused || focused == 0)) {\n      const focusThis = focused == 0 && !haveTopItem() ? 1 : focused;\n      if (focusThis != focused) setFocused(focusThis);\n      const newFocusedElement = elRefs[focusThis];\n      newFocusedElement?.current?.focus();\n    } else setFocused(null); //if the dropdown is closed, we don't to keep saved the focused item\n  }, [isOpen]);\n\n  const getTopItem = () => {\n    if (!customizationProps.pinTopItem) return;\n    const visibleItems = getFilteredItems();\n    const allSelected = selectedValues?.filter((x) => visibleItems.some((y) => y.value == x)).length == visibleItems.length;\n    let showTopItem = false;\n    const suggestions = getSuggestions();\n    const displayLabel = selectedValues[0] ? customizationProps.items?.find((c) => c.value === selectedValues[0])?.displayLabel : undefined;\n    if (customizationProps.itemsType == 'radio' && selectedValues && selectedValues?.length > 0) showTopItem = true;\n    else if (customizationProps.itemsType == 'checkbox' && (customizationProps.multiSelect || selectedValues?.length > 0)) showTopItem = true;\n    else if (customizationProps.itemsType == 'normal' && suggestions.length > 0) showTopItem = true;\n\n    if (!showTopItem) return;\n\n    const selectedFirst = selectedValues.length > 0 ? visibleItems.find(x => x.value == selectedValues[0]) : null;\n   \n    return (\n      <TopItemContainer size={size}>\n        {customizationProps.itemsType == 'radio' && (\n          <RadioButton\n            ref={elRefs[0] as React.RefObject<HTMLDivElement>}\n            iconPointerEventsTransparent={true}\n            select={() => {}} label={selectedFirst?.displayLabel ?? selectedFirst?.value} \n            size={size}\n            id={`${id}_topitem`}\n            selected={true}\n          />\n        )}\n        {customizationProps.itemsType == 'checkbox' && (\n          <Checkbox\n            ref={elRefs[0] as React.RefObject<HTMLDivElement>}\n            select={(selected: boolean) => {\n              if (!customizationProps.multiSelect) return;\n\n              const newValues = selected ? visibleItems.map((x) => x.value) : [];\n              setSelectedValues(newValues);\n              customizationProps.onValueUpdate && customizationProps.onValueUpdate(newValues);\n            }}\n            iconPointerEventsTransparent={true}\n            semiSelected={customizationProps.multiSelect && !allSelected && selectedValues?.length > 0}\n            size={size}\n            id={`${id}_checkbox_selectall`}\n            label={customizationProps.multiSelect ? 'Select all' : (selectedFirst?.displayLabel ?? selectedFirst?.value)}\n            selected={!customizationProps.multiSelect || allSelected}\n          />\n        )}\n        {customizationProps.itemsType == 'normal' && (\n          <>\n            {suggestions.map((x) => (\n            <button\n                ref={elRefs[0] as React.RefObject<HTMLButtonElement>}\n                type=\"button\"\n                id={`${id}_topitem`}\n                key={`${id}_topitem_${x.value}`}\n                onClick={(e: any) => {\n                  customizationProps.onValueUpdate([x.value]);\n                  setSelectedValues([x.value]);\n                  setIsOpen(false);\n                  setFocused(null);\n                }}>\n                <div className=\"item-content\">\n                  {x?.icon && <div className=\"item-icon\">{x?.icon}</div>}\n                  <div className=\"item-label\">\n                    {x?.displayLabel ?? x?.value}\n                    {x?.noteLabel && <div style={{ fontSize: '12px' }}>{x.noteLabel}</div>}\n                  </div>\n                </div>\n            </button>))}\n          </>\n        )}\n      </TopItemContainer>\n    );\n  };\n\n  const getElements = () => {\n    if (getFilteredItems().length === 0) {\n      return (\n        <ItemsContainer size={size}>\n          <button className=\"dropdownButton\" disabled>\n            <span>{messageOnNoResults}</span>\n          </button>\n        </ItemsContainer>\n      );\n    }\n    let number = 0;\n    return (\n      <ItemsContainer size={size}>\n        {getFilteredItems()\n          .filter((x) => x && (customizationProps.itemsType != 'normal' || !x.suggestion))\n          .map((item) => {\n            return (\n              <React.Fragment key={`key_${id}_${item.value}`}>\n              {item.customContent}\n              {!item.customContent && customizationProps.itemsType == 'radio' && (\n                  <RadioButton\n                    select={(selected: boolean) => {\n                      if (!selected) return;\n                      customizationProps.onValueUpdate && customizationProps.onValueUpdate([item.value]);\n                      setSelectedValues([item.value]);\n                    }}\n                    ref={elRefs[number + 1] as React.RefObject<HTMLDivElement>}\n                    size={size}\n                    iconPointerEventsTransparent={true}\n                    disabled={item?.disabled}\n                    key={`key_${id}_${number++}`}\n                    id={`${id}_${number + 1}`}\n                    label={item.displayLabel ?? item.value}\n                    selected={selectedValues?.includes(item.value)}\n                  />\n                )}\n              {!item.customContent && customizationProps.itemsType == 'checkbox' && (\n                  <Checkbox\n                    select={(selected: boolean) => {\n                      let newValue: string[] = [];\n                      if (customizationProps.multiSelect) {\n                        if (selected) newValue = [...selectedValues, item.value];\n                        else newValue = selectedValues.filter((x) => x != item.value);\n                      } else newValue = selected ? [item.value] : [];\n\n                      setSelectedValues(newValue);\n                      customizationProps.onValueUpdate(newValue);\n                    }}\n                    iconPointerEventsTransparent={true}\n                    disabled={item?.disabled}\n                    ref={elRefs[number + 1] as React.RefObject<HTMLDivElement>}\n                    size={size}\n                    key={`key_${id}_${number++}`}\n                    id={`${id}_${number + 1}`}\n                    label={item.displayLabel ?? item.value}\n                    selected={selectedValues?.includes(item.value)}\n                  />\n                )}\n              {!item.customContent && (customizationProps.itemsType == 'normal' || !customizationProps.itemsType) && (\n                  <button\n                    type=\"button\"\n                    disabled={item?.disabled}\n                    ref={elRefs[number + 1] as React.RefObject<HTMLButtonElement>}\n                    onClick={(e: any) => {\n                      customizationProps.onValueUpdate([item.value]);\n                      setSelectedValues([item.value]);\n                      setIsOpen(false);\n                      setFocused(null);\n                    }}\n                    className={ 'dropdownButton ' + (item.showDividerAbove ? 'show-divider-above' : '') + ' ' + (selectedValues?.includes(item.value) ? 'active' : '')}\n                    key={`key_${id}_${number++}`}\n                    id={`${id}_${number + 1}`}>\n                    {item.showDividerAbove && <div className=\"divider\" />}\n                    <div className=\"item-content\">\n                      {item.icon && <div className=\"item-icon\">{item.icon}</div>}\n                      <div className=\"item-label\">\n                        {item.displayLabel ?? item.value}\n                        {item.noteLabel && <div style={{ fontSize: '12px' }}>{item.noteLabel}</div>}\n                      </div>\n                    </div>\n                  </button>\n                )}\n              </React.Fragment>\n            );\n          })}\n      </ItemsContainer>\n    );\n  };\n\n  return (\n    <DDContainer\n      ref={dropdownContentRef}\n      size={size}\n      width={width}\n      isButton={isButton}\n      alignLeft={alignLeft}\n      scrollable={customizationProps.scrollable}\n      maxHeight={customizationProps.maxHeight}\n      className={[isOpen && 'show', isUp && 'up'].filter((e) => !!e).join(' ')}>\n      <ListContainer size={size} itemsType={customizationProps.itemsType} onScroll={handleScroll} ref={itemsListRef} scrollable={customizationProps.scrollable}>\n            {customizationProps.menuContent &&\n              <MenuContentContainer size={size}>\n                {customizationProps.menuContent}\n                <DividerContainer size={size}>\n                  <div className=\"divider\" />\n                </DividerContainer>\n              </MenuContentContainer>}\n        {customizationProps.pinTopItem && getTopItem()}\n        {getElements()}\n      </ListContainer>\n      {customizationProps.action && customizationProps.actionLabel && (\n        <ActionButtonContainer size={size}>\n              <Button width=\"100%\" variant={customizationProps.actionVariant ?? 'primary'} size={size} onClick={() => \n                {\n                  if(customizationProps.action()) //closing the dropdown if action returns 'true'\n                    setIsOpen(false);\n                }}>\n            {customizationProps.actionLabel}\n          </Button>\n        </ActionButtonContainer>\n      )}\n    </DDContainer>\n  );\n  /*  ),\n    {\n      handleClickOutside: () => () => {\n        if (isOpen) {\n          setIsOpen(false);\n          setFocused(null);\n        }\n      },\n    },\n  );\n\n  return <Wrapped />; */\n};\n\nexport default DropdownContent;\n"],"file":"DropdownContent.js"}

package/dist/esm/GlobalNavigationBar/RightSideNav.js

@@ -11,6 +11,10 @@ const NavContainer = styled.div`
   margin: auto 0 auto auto;
   align-items: center;
   height: 48px;
+  
+  a {
+    text-decoration: none;
+  }
 
   ${BREAKPOINTS.SMALL} {
     height: 56px;

package/dist/esm/GlobalNavigationBar/RightSideNav.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/GlobalNavigationBar/RightSideNav.tsx"],"names":["React","styled","NavLink","NavItem","BREAKPOINTS","ComponentTextStyle","Button","ComponentMStyling","NavContainer","div","SMALL","MEDIUM","SecondaryButton","Bold","RightSideNav","navigationOptions","secondaryButton","preventFocusOnClick","e","preventDefault","getNavItem","navOption","disabled","label","exact","to","onClick","reverse","map","no","action"],"mappings":";AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAAQC,OAAR,QAAsB,kBAAtB;AAEA,SAAQC,OAAR,QAAsB,YAAtB;AAEA,SAAQC,WAAR,EAAqBC,kBAArB,QAA8C,WAA9C;AACA,SAAQC,MAAR,QAAqB,WAArB;AACA,SAAQC,iBAAR,QAAgC,sBAAhC;AAEA,MAAMC,YAAY,GAAGP,MAAM,CAACQ,GAAI;AAChC;AACA;AACA;AACA;AACA;AACA,IAAIL,WAAW,CAACM,KAAM;AACtB;AACA;AACA,IAAIN,WAAW,CAACO,MAAO;AACvB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAnBA;AAqBA,MAAMC,eAAe,GAAGX,MAAM,CAACK,MAAD,CAAS;AACvC;AACA;AACA;AACA,IAAIC,iBAAiB,CAACF,kBAAkB,CAACQ,IAApB,EAA0B,OAA1B,CAAmC;AACxD,CALA;;AAYA,MAAMC,YAAY,GAAG,CAAC;AAAEC,EAAAA,iBAAF;AAAqBC,EAAAA;AAArB,CAAD,KAA8E;AACjG,QAAMC,mBAAmB,GAAIC,CAAD,IAAY;AACtCA,IAAAA,CAAC,CAACC,cAAF;AACD,GAFD;;AAGA,QAAMC,UAAU,GAAIC,SAAD,IAA0B;AAC3C,QAAIA,SAAS,EAAEC,QAAf,EAAyB;AACvB,0BACE,oBAAC,OAAD;AAAS,QAAA,EAAE,EAAEhB,MAAb;AAAqB,QAAA,SAAS,EAAC,UAA/B;AAA0C,QAAA,GAAG,EAAEe,SAAS,EAAEE;AAA1D,SACGF,SAAS,EAAEE,KADd,CADF;AAKD,KAND,MAMO;AACL,0BACE,oBAAC,OAAD;AACE,QAAA,EAAE,EAAErB,OADN;AAEE,QAAA,KAAK,EAAEmB,SAAS,EAAEG,KAFpB;AAGE,QAAA,EAAE,EAAEH,SAAS,EAAEI,EAAX,IAAiB,EAHvB;AAIE,QAAA,GAAG,EAAEJ,SAAS,EAAEE,KAJlB;AAKE,QAAA,WAAW,EAAEN,mBALf;AAME,QAAA,OAAO,EAAE,MAAM;AACb,cAAII,SAAS,EAAEK,OAAf,EAAwB;AACtBL,YAAAA,SAAS,EAAEK,OAAX;AACD;AACF;AAVH,SAWGL,SAAS,EAAEE,KAXd,CADF;AAeD;AACF,GAxBD;;AAyBA,sBACE,oBAAC,YAAD,QACGR,iBAAiB,EAAEY,OAAnB,GAA6BC,GAA7B,CAAiCC,EAAE,IAAIT,UAAU,CAACS,EAAD,CAAjD,CADH,EAGGb,eAAe,iBACd,oBAAC,eAAD;AAAiB,IAAA,OAAO,EAAC,WAAzB;AAAqC,IAAA,OAAO,EAAEA,eAAe,EAAEc;AAA/D,KACGd,eAAe,CAACO,KADnB,CAJJ,CADF;AAWD,CAxCD;;;AAJER,EAAAA,iB;;AA8CF,eAAeD,YAAf","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\n\nimport {NavItem} from '../NavItem';\nimport {NavButton, NavOption} from '../types';\nimport {BREAKPOINTS, ComponentTextStyle} from '../styles';\nimport {Button} from '../Button';\nimport {ComponentMStyling} from '../styles/typography';\n\nconst NavContainer = styled.div`\n  display: flex;\n  margin: auto 0 auto auto;\n  align-items: center;\n  height: 48px;\n\n  ${BREAKPOINTS.SMALL} {\n    height: 56px;\n  }\n  ${BREAKPOINTS.MEDIUM} {\n    height: 64px;\n  }\n\n  button,\n  div {\n    &:hover {\n      cursor: pointer;\n    }\n  }\n`;\n\nconst SecondaryButton = styled(Button)`\n  height: 40px;\n  margin: 0 8px;\n\n  ${ComponentMStyling(ComponentTextStyle.Bold, 'unset')}\n`;\n\ntype Props = {\n  navigationOptions?: NavOption[];\n  secondaryButton?: NavButton;\n};\n\nconst RightSideNav = ({ navigationOptions, secondaryButton }: Props): React.ReactElement<Props> => {\n  const preventFocusOnClick = (e: any) => {\n    e.preventDefault();\n  };\n  const getNavItem = (navOption: NavOption) => {\n    if (navOption?.disabled) {\n      return (\n        <NavItem as={Button} className=\"disabled\" key={navOption?.label}>\n          {navOption?.label}\n        </NavItem>\n      );\n    } else {\n      return (\n        <NavItem\n          as={NavLink}\n          exact={navOption?.exact}\n          to={navOption?.to || ''}\n          key={navOption?.label}\n          onMouseDown={preventFocusOnClick}\n          onClick={() => {\n            if (navOption?.onClick) {\n              navOption?.onClick();\n            }\n          }}>\n          {navOption?.label}\n        </NavItem>\n      );\n    }\n  };\n  return (\n    <NavContainer>\n      {navigationOptions?.reverse().map(no => getNavItem(no))}\n\n      {secondaryButton && (\n        <SecondaryButton variant=\"secondary\" onClick={secondaryButton?.action}>\n          {secondaryButton.label}\n        </SecondaryButton>\n      )}\n    </NavContainer>\n  );\n};\n\nexport default RightSideNav;\n"],"file":"RightSideNav.js"}
+{"version":3,"sources":["../../../src/GlobalNavigationBar/RightSideNav.tsx"],"names":["React","styled","NavLink","NavItem","BREAKPOINTS","ComponentTextStyle","Button","ComponentMStyling","NavContainer","div","SMALL","MEDIUM","SecondaryButton","Bold","RightSideNav","navigationOptions","secondaryButton","preventFocusOnClick","e","preventDefault","getNavItem","navOption","disabled","label","exact","to","onClick","reverse","map","no","action"],"mappings":";AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAAQC,OAAR,QAAsB,kBAAtB;AAEA,SAAQC,OAAR,QAAsB,YAAtB;AAEA,SAAQC,WAAR,EAAqBC,kBAArB,QAA8C,WAA9C;AACA,SAAQC,MAAR,QAAqB,WAArB;AACA,SAAQC,iBAAR,QAAgC,sBAAhC;AAEA,MAAMC,YAAY,GAAGP,MAAM,CAACQ,GAAI;AAChC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIL,WAAW,CAACM,KAAM;AACtB;AACA;AACA,IAAIN,WAAW,CAACO,MAAO;AACvB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAvBA;AAyBA,MAAMC,eAAe,GAAGX,MAAM,CAACK,MAAD,CAAS;AACvC;AACA;AACA;AACA,IAAIC,iBAAiB,CAACF,kBAAkB,CAACQ,IAApB,EAA0B,OAA1B,CAAmC;AACxD,CALA;;AAYA,MAAMC,YAAY,GAAG,CAAC;AAAEC,EAAAA,iBAAF;AAAqBC,EAAAA;AAArB,CAAD,KAA8E;AACjG,QAAMC,mBAAmB,GAAIC,CAAD,IAAY;AACtCA,IAAAA,CAAC,CAACC,cAAF;AACD,GAFD;;AAGA,QAAMC,UAAU,GAAIC,SAAD,IAA0B;AAC3C,QAAIA,SAAS,EAAEC,QAAf,EAAyB;AACvB,0BACE,oBAAC,OAAD;AAAS,QAAA,EAAE,EAAEhB,MAAb;AAAqB,QAAA,SAAS,EAAC,UAA/B;AAA0C,QAAA,GAAG,EAAEe,SAAS,EAAEE;AAA1D,SACGF,SAAS,EAAEE,KADd,CADF;AAKD,KAND,MAMO;AACL,0BACE,oBAAC,OAAD;AACE,QAAA,EAAE,EAAErB,OADN;AAEE,QAAA,KAAK,EAAEmB,SAAS,EAAEG,KAFpB;AAGE,QAAA,EAAE,EAAEH,SAAS,EAAEI,EAAX,IAAiB,EAHvB;AAIE,QAAA,GAAG,EAAEJ,SAAS,EAAEE,KAJlB;AAKE,QAAA,WAAW,EAAEN,mBALf;AAME,QAAA,OAAO,EAAE,MAAM;AACb,cAAII,SAAS,EAAEK,OAAf,EAAwB;AACtBL,YAAAA,SAAS,EAAEK,OAAX;AACD;AACF;AAVH,SAWGL,SAAS,EAAEE,KAXd,CADF;AAeD;AACF,GAxBD;;AAyBA,sBACE,oBAAC,YAAD,QACGR,iBAAiB,EAAEY,OAAnB,GAA6BC,GAA7B,CAAiCC,EAAE,IAAIT,UAAU,CAACS,EAAD,CAAjD,CADH,EAGGb,eAAe,iBACd,oBAAC,eAAD;AAAiB,IAAA,OAAO,EAAC,WAAzB;AAAqC,IAAA,OAAO,EAAEA,eAAe,EAAEc;AAA/D,KACGd,eAAe,CAACO,KADnB,CAJJ,CADF;AAWD,CAxCD;;;AAJER,EAAAA,iB;;AA8CF,eAAeD,YAAf","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\n\nimport {NavItem} from '../NavItem';\nimport {NavButton, NavOption} from '../types';\nimport {BREAKPOINTS, ComponentTextStyle} from '../styles';\nimport {Button} from '../Button';\nimport {ComponentMStyling} from '../styles/typography';\n\nconst NavContainer = styled.div`\n  display: flex;\n  margin: auto 0 auto auto;\n  align-items: center;\n  height: 48px;\n  \n  a {\n    text-decoration: none;\n  }\n\n  ${BREAKPOINTS.SMALL} {\n    height: 56px;\n  }\n  ${BREAKPOINTS.MEDIUM} {\n    height: 64px;\n  }\n\n  button,\n  div {\n    &:hover {\n      cursor: pointer;\n    }\n  }\n`;\n\nconst SecondaryButton = styled(Button)`\n  height: 40px;\n  margin: 0 8px;\n\n  ${ComponentMStyling(ComponentTextStyle.Bold, 'unset')}\n`;\n\ntype Props = {\n  navigationOptions?: NavOption[];\n  secondaryButton?: NavButton;\n};\n\nconst RightSideNav = ({ navigationOptions, secondaryButton }: Props): React.ReactElement<Props> => {\n  const preventFocusOnClick = (e: any) => {\n    e.preventDefault();\n  };\n  const getNavItem = (navOption: NavOption) => {\n    if (navOption?.disabled) {\n      return (\n        <NavItem as={Button} className=\"disabled\" key={navOption?.label}>\n          {navOption?.label}\n        </NavItem>\n      );\n    } else {\n      return (\n        <NavItem\n          as={NavLink}\n          exact={navOption?.exact}\n          to={navOption?.to || ''}\n          key={navOption?.label}\n          onMouseDown={preventFocusOnClick}\n          onClick={() => {\n            if (navOption?.onClick) {\n              navOption?.onClick();\n            }\n          }}>\n          {navOption?.label}\n        </NavItem>\n      );\n    }\n  };\n  return (\n    <NavContainer>\n      {navigationOptions?.reverse().map(no => getNavItem(no))}\n\n      {secondaryButton && (\n        <SecondaryButton variant=\"secondary\" onClick={secondaryButton?.action}>\n          {secondaryButton.label}\n        </SecondaryButton>\n      )}\n    </NavContainer>\n  );\n};\n\nexport default RightSideNav;\n"],"file":"RightSideNav.js"}

package/dist/esm/List/ListRow.js

@@ -1,126 +1,240 @@
 import _pt from "prop-types";
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 import * as React from 'react';
 import styled from 'styled-components';
-import { Button } from '../Button';
-import { MoreVertical } from '../icons/systemicons/SystemIcons';
 import { COLORS, ComponentTextStyle } from '../styles';
-import ListRowDropdown from './ListRowDropdown';
-import { ComponentSStyling } from '../styles/typography';
-const EditRow = styled.div`
+import { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentXSStyling, ComponentXXSStyling } from '../styles/typography';
+import { TooltipWrapper } from '../Tooltips';
+import { DropdownButton } from '../Dropdown';
+import { SystemIcons } from '../icons';
+import { Size } from '../types';
+const Row = styled.div`
   display: flex;
-  justify-content: space-between;
-  padding: 8px 12px;
+  flex-direction: row;
   align-items: center;
+  justify-content: center;
+  border-bottom: 1px solid ${COLORS.neutral_100};
+  box-sizing: border-box;
+  position: relative;
+
+  color: ${COLORS.neutral_600};
+  background-color: ${COLORS.white};
+
 
-  &:nth-child(even) {
-    background-color: ${props => props.disableDifferentBackgroundforEvenNumbers ? 'inherit' : COLORS.neutral_20};
+  cursor: default;
+
+  &.interactive {
+    cursor: pointer;
   }
 
-  .user-actions {
-    display: flex;
-    position: relative;
-    align-items: center;
+  &.interactive.disabled {
+    cursor: not-allowed;
   }
 
-  .somePaddingForAlignment {
-    padding: 0 3px 0 0;
+  &.interactive:hover:not(.in-action):not(.disabled) {
+    background-color: ${COLORS.primary_20};
+    color: ${COLORS.primary_700};
   }
 
-  &.active {
-    background-color: ${COLORS.neutral_100};
+  &.interactive:active:not(.in-action):not(.disabled) {
+    background-color: ${COLORS.primary_100};
+    color: ${COLORS.primary_800};
+    box-shadow: none;
   }
-`;
-const LeftSection = styled.div`
-  display: flex;
-  flex-direction: row;
-  align-items: center;
 
-  ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}
+  &.interactive:focus {
+    outline: none;
+    box-shadow: 0 4px 12px rgba(46, 127, 161, 0.25), 0 0 8px #2E7FA1;
+    z-index: 1;
+  }
 
-  svg {
-    margin-right: 12px;
+  &.disabled {
+    .list-item-icon, .list-item-content, .list-item-note, .list-item-actions {
+      color: ${COLORS.neutral_300};
+    }
   }
-`;
-const MainInfo = styled.div`
-  margin: auto 1em auto 0;
-  display: flex;
-  flex-direction: column;
-`;
-const ButtonWrapper = styled.div`
-  outline: none;
-`;
-const UserDropdownButton = styled(Button)`
-  display: flex;
-  text-decoration: none;
-  outline: none;
-  div {
-    outline: none;
+
+
+  &.small {
+    min-height: 48px;
+    padding: 0 8px;
+
+    .list-item-icon {
+      margin-right: 8px;
+    }
+
+    .list-item-main-text {
+      ${ComponentSStyling(ComponentTextStyle.Regular, null)}
+    }
+
+    .list-item-actions {
+      margin-right: -8px;
+    }
   }
-  &:focus > div {
-    box-shadow: 0px 0px 8px #2e7fa1, 0px 4px 12px rgba(46, 127, 161, 0.25);
-    border-radius: 4px;
-    outline: none;
-    background: ${COLORS.white};
+
+  &.medium {
+    min-height: 56px;
+    padding: 0 12px;
+
+    .list-item-icon {
+      margin-right: 12px;
+    }
+
+    .list-item-main-text {
+      ${ComponentMStyling(ComponentTextStyle.Regular, null)}
+    }
+
+    .list-item-actions {
+      margin-right: -12px;
+    }
   }
-`;
-const StyledMoreVertical = styled(MoreVertical)`
-  padding: 8px 8px;
-  outline: none;
-  &:hover {
-    background: ${COLORS.primary_20};
-    border-radius: 4px;
+
+  &.large {
+    min-height: 64px;
+    padding: 0 16px;
+
+    .list-item-icon {
+      margin-right: 16px;
+    }
+
+    .list-item-main-text {
+      ${ComponentLStyling(ComponentTextStyle.Regular, null)}
+    }
+
+    .list-item-actions {
+      margin-right: -16px;
+    }
+  }
+
+  &.overlay {
+    padding: 0 4px;
+
+    .list-item-actions {
+      margin-right: -4px;
+    }
+  }
+
+  .list-item-icon {
+    width: 24px;
+    height: 24px;
+
+    svg {
+      width: 24px;
+      height: 24px;
+    }
+  }
+
+  .list-item-content {
+    flex-grow: 1;
+    display: flex;
+    flex-direction: column;
+  }
+
+  .list-item-main-text {
+  }
+
+  .list-item-secondary-text {
+    ${ComponentXXSStyling(ComponentTextStyle.Regular, null)}
+  }
+
+  .list-item-note {
+    color: ${COLORS.neutral_600};
+    word-break: initial;
+    ${ComponentXSStyling(ComponentTextStyle.Regular, null)}
   }
-  &:active {
-    background: ${COLORS.primary_100};
-    border-radius: 4px;
+
+  .list-item-note.with-tooltip {
+    cursor: pointer;
+
+    > div {
+      text-decoration-line: underline;
+      text-decoration-style: dashed;
+      text-underline-offset: 1px;
+      text-decoration-thickness: 1px;
+    }
+  }
+
+  .list-item-actions {
+    color: ${COLORS.neutral_600};
+    display: flex;
+    align-items: center;
+
+    button div {
+      background-color: transparent;
+    }
   }
 `;
 
 const ListRow = ({
   key,
-  Icon,
-  mainInfo,
-  dropdownOptions,
-  disableDifferentBackgroundforEvenNumbers
+  size = Size.Medium,
+  variant = 'normal',
+  icon,
+  mainText,
+  secondaryText,
+  dropdown,
+  note,
+  noteTooltip,
+  disabled = false,
+  action
 }) => {
-  const color = COLORS.black;
-  const [dropdownActive, setDropdownActive] = React.useState(false);
-  return /*#__PURE__*/React.createElement(EditRow, {
+  const [inAction, setInAction] = React.useState(false);
+
+  const handleKeyPress = e => {
+    if (e.key === 'Enter') {
+      action && action();
+    }
+  };
+
+  const rowClassName = (inAction ? 'in-action ' : '').concat(disabled ? 'disabled ' : '').concat(!!action ? 'interactive ' : '').concat('list-item-row ').concat(`${variant} `).concat(`${size}`);
+  return /*#__PURE__*/React.createElement(Row, {
     key: key,
-    disableDifferentBackgroundforEvenNumbers: disableDifferentBackgroundforEvenNumbers
-  }, /*#__PURE__*/React.createElement(LeftSection, {
-    color: color,
+    tabIndex: !!action && !disabled ? 0 : undefined,
+    className: rowClassName,
+    onKeyPress: e => !disabled && handleKeyPress(e),
+    onClick: e => {
+      !disabled && action && action();
+    },
     "data-hj-suppress": true
-  }, Icon && /*#__PURE__*/React.createElement(Icon, {
-    size: "22px",
-    color: color,
-    className: "somePaddingForAlignment"
-  }), /*#__PURE__*/React.createElement(MainInfo, {
-    "data-hj-suppress": true
-  }, mainInfo)), /*#__PURE__*/React.createElement(ButtonWrapper, {
-    className: "user-actions"
-  }, /*#__PURE__*/React.createElement(UserDropdownButton, {
-    variant: "tertiary",
-    onClick: () => {
-      setDropdownActive(true);
-    }
+  }, !!icon && /*#__PURE__*/React.createElement("div", {
+    className: 'list-item-icon'
+  }, icon), /*#__PURE__*/React.createElement("div", {
+    className: 'list-item-content'
   }, /*#__PURE__*/React.createElement("div", {
-    tabIndex: -1
-  }, /*#__PURE__*/React.createElement(StyledMoreVertical, {
-    size: "22px",
-    color: COLORS.neutral_500
-  }))), dropdownActive && /*#__PURE__*/React.createElement(ListRowDropdown, {
-    closeDropdown: () => setDropdownActive(false),
-    options: dropdownOptions
-  })));
+    className: 'list-item-main-text'
+  }, mainText), !!secondaryText && /*#__PURE__*/React.createElement("div", {
+    className: 'list-item-secondary-text'
+  }, secondaryText)), !!note && /*#__PURE__*/React.createElement(React.Fragment, null, !!noteTooltip && /*#__PURE__*/React.createElement("div", {
+    className: 'list-item-note with-tooltip'
+  }, /*#__PURE__*/React.createElement(TooltipWrapper, {
+    label: noteTooltip,
+    size: size === Size.Large ? Size.Medium : size === Size.Small ? Size.XSmall : Size.Small,
+    position: 'top',
+    withArrow: true
+  }, note)), !noteTooltip && /*#__PURE__*/React.createElement("div", {
+    className: 'list-item-note'
+  }, note)), !!dropdown && /*#__PURE__*/React.createElement("div", {
+    className: 'list-item-actions',
+    onMouseEnter: () => setInAction(!dropdown?.disabled),
+    onMouseLeave: () => setInAction(false)
+  }, /*#__PURE__*/React.createElement(DropdownButton, _extends({}, dropdown, {
+    disabled: disabled || dropdown.disabled,
+    icon: variant === 'overlay' ? /*#__PURE__*/React.createElement(SystemIcons.ArrowDropDown, null) : /*#__PURE__*/React.createElement(SystemIcons.MoreVertical, null)
+  }))));
 };
 
 ListRow.propTypes = {
   key: _pt.string,
-  Icon: _pt.any,
-  mainInfo: _pt.any.isRequired,
-  dropdownOptions: _pt.array.isRequired,
-  disableDifferentBackgroundforEvenNumbers: _pt.bool
+  variant: _pt.oneOf(['normal', 'overlay']),
+  icon: _pt.node,
+  mainText: _pt.string.isRequired,
+  secondaryText: _pt.string,
+  note: _pt.string,
+  noteTooltip: _pt.string,
+  disabled: _pt.bool,
+  action: _pt.func
 };
 export default ListRow;
 //# sourceMappingURL=ListRow.js.map

package/dist/esm/List/ListRow.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/List/ListRow.tsx"],"names":["React","styled","Button","MoreVertical","COLORS","ComponentTextStyle","ListRowDropdown","ComponentSStyling","EditRow","div","props","disableDifferentBackgroundforEvenNumbers","neutral_20","neutral_100","LeftSection","Regular","MainInfo","ButtonWrapper","UserDropdownButton","white","StyledMoreVertical","primary_20","primary_100","ListRow","key","Icon","mainInfo","dropdownOptions","color","black","dropdownActive","setDropdownActive","useState","neutral_500"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../Button';\nimport {MoreVertical} from '../icons/systemicons/SystemIcons';\nimport {COLORS, ComponentTextStyle} from '../styles';\nimport {ListRowDropdownOption} from '../types';\n\nimport ListRowDropdown from './ListRowDropdown';\nimport {ComponentSStyling} from '../styles/typography';\n\nconst EditRow = styled.div<{ disableDifferentBackgroundforEvenNumbers?: boolean }>`\n  display: flex;\n  justify-content: space-between;\n  padding: 8px 12px;\n  align-items: center;\n\n  &:nth-child(even) {\n    background-color: ${props => (props.disableDifferentBackgroundforEvenNumbers ? 'inherit' : COLORS.neutral_20)};\n  }\n\n  .user-actions {\n    display: flex;\n    position: relative;\n    align-items: center;\n  }\n\n  .somePaddingForAlignment {\n    padding: 0 3px 0 0;\n  }\n\n  &.active {\n    background-color: ${COLORS.neutral_100};\n  }\n`;\n\nconst LeftSection = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n\n  ${ComponentSStyling(ComponentTextStyle.Regular, 'inherit')}\n\n  svg {\n    margin-right: 12px;\n  }\n`;\n\nconst MainInfo = styled.div`\n  margin: auto 1em auto 0;\n  display: flex;\n  flex-direction: column;\n`;\n\nconst ButtonWrapper = styled.div`\n  outline: none;\n`;\n\nconst UserDropdownButton = styled(Button)`\n  display: flex;\n  text-decoration: none;\n  outline: none;\n  div {\n    outline: none;\n  }\n  &:focus > div {\n    box-shadow: 0px 0px 8px #2e7fa1, 0px 4px 12px rgba(46, 127, 161, 0.25);\n    border-radius: 4px;\n    outline: none;\n    background: ${COLORS.white};\n  }\n`;\n\nconst StyledMoreVertical = styled(MoreVertical)`\n  padding: 8px 8px;\n  outline: none;\n  &:hover {\n    background: ${COLORS.primary_20};\n    border-radius: 4px;\n  }\n  &:active {\n    background: ${COLORS.primary_100};\n    border-radius: 4px;\n  }\n`;\n\ntype Props = {\n  key?: string;\n  Icon?: any;\n  mainInfo: any;\n  dropdownOptions: ListRowDropdownOption[];\n  disableDifferentBackgroundforEvenNumbers?: boolean;\n};\n\nconst ListRow: React.FunctionComponent<Props> = ({ key, Icon, mainInfo, dropdownOptions, disableDifferentBackgroundforEvenNumbers }: Props) => {\n  const color = COLORS.black;\n  const [dropdownActive, setDropdownActive] = React.useState<Boolean>(false);\n\n  return (\n    <EditRow key={key} disableDifferentBackgroundforEvenNumbers={disableDifferentBackgroundforEvenNumbers}>\n      <LeftSection color={color} data-hj-suppress>\n        {Icon && <Icon size=\"22px\" color={color} className=\"somePaddingForAlignment\" />}\n        <MainInfo data-hj-suppress>{mainInfo}</MainInfo>\n      </LeftSection>\n\n      <ButtonWrapper className=\"user-actions\">\n        <UserDropdownButton\n          variant=\"tertiary\"\n          onClick={() => {\n            setDropdownActive(true);\n          }}>\n          <div tabIndex={-1}>\n            <StyledMoreVertical size=\"22px\" color={COLORS.neutral_500} />\n          </div>\n        </UserDropdownButton>\n        {dropdownActive && <ListRowDropdown closeDropdown={() => setDropdownActive(false)} options={dropdownOptions} />}\n      </ButtonWrapper>\n    </EditRow>\n  );\n};\n\nexport default ListRow;\n"],"file":"ListRow.js"}
+{"version":3,"sources":["../../../src/List/ListRow.tsx"],"names":["React","styled","COLORS","ComponentTextStyle","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentXSStyling","ComponentXXSStyling","TooltipWrapper","DropdownButton","SystemIcons","Size","Row","div","neutral_100","neutral_600","white","primary_20","primary_700","primary_100","primary_800","neutral_300","Regular","ListRow","key","size","Medium","variant","icon","mainText","secondaryText","dropdown","note","noteTooltip","disabled","action","inAction","setInAction","useState","handleKeyPress","e","rowClassName","concat","undefined","Large","Small","XSmall"],"mappings":";;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAAQC,MAAR,EAAgBC,kBAAhB,QAAyC,WAAzC;AAEA,SACEC,iBADF,EAEEC,iBAFF,EAGEC,iBAHF,EAIEC,kBAJF,EAKEC,mBALF,QAMO,sBANP;AAQA,SAAQC,cAAR,QAA6B,aAA7B;AACA,SAAQC,cAAR,QAA6B,aAA7B;AACA,SAAQC,WAAR,QAA0B,UAA1B;AACA,SAAQC,IAAR,QAAmB,UAAnB;AAEA,MAAMC,GAAG,GAAGZ,MAAM,CAACa,GAAI;AACvB;AACA;AACA;AACA;AACA,6BAA6BZ,MAAM,CAACa,WAAY;AAChD;AACA;AACA;AACA,WAAWb,MAAM,CAACc,WAAY;AAC9B,sBAAsBd,MAAM,CAACe,KAAM;AACnC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwBf,MAAM,CAACgB,UAAW;AAC1C,aAAahB,MAAM,CAACiB,WAAY;AAChC;AACA;AACA;AACA,wBAAwBjB,MAAM,CAACkB,WAAY;AAC3C,aAAalB,MAAM,CAACmB,WAAY;AAChC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAenB,MAAM,CAACoB,WAAY;AAClC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,QAAQhB,iBAAiB,CAACH,kBAAkB,CAACoB,OAApB,EAA6B,IAA7B,CAAmC;AAC5D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,QAAQlB,iBAAiB,CAACF,kBAAkB,CAACoB,OAApB,EAA6B,IAA7B,CAAmC;AAC5D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,QAAQnB,iBAAiB,CAACD,kBAAkB,CAACoB,OAApB,EAA6B,IAA7B,CAAmC;AAC5D;AACA;AACA;AACA;AACA;AACA;AACA;AA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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {COLORS, ComponentTextStyle} from '../styles';\n\nimport {\n  ComponentLStyling,\n  ComponentMStyling,\n  ComponentSStyling,\n  ComponentXSStyling,\n  ComponentXXSStyling\n} from '../styles/typography';\nimport {DropdownButtonProps} from '../Dropdown/DropdownButtonTypes';\nimport {TooltipWrapper} from '../Tooltips';\nimport {DropdownButton} from '../Dropdown';\nimport {SystemIcons} from '../icons';\nimport {Size} from '../types';\n\nconst Row = styled.div`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  border-bottom: 1px solid ${COLORS.neutral_100};\n  box-sizing: border-box;\n  position: relative;\n\n  color: ${COLORS.neutral_600};\n  background-color: ${COLORS.white};\n\n\n  cursor: default;\n\n  &.interactive {\n    cursor: pointer;\n  }\n\n  &.interactive.disabled {\n    cursor: not-allowed;\n  }\n\n  &.interactive:hover:not(.in-action):not(.disabled) {\n    background-color: ${COLORS.primary_20};\n    color: ${COLORS.primary_700};\n  }\n\n  &.interactive:active:not(.in-action):not(.disabled) {\n    background-color: ${COLORS.primary_100};\n    color: ${COLORS.primary_800};\n    box-shadow: none;\n  }\n\n  &.interactive:focus {\n    outline: none;\n    box-shadow: 0 4px 12px rgba(46, 127, 161, 0.25), 0 0 8px #2E7FA1;\n    z-index: 1;\n  }\n\n  &.disabled {\n    .list-item-icon, .list-item-content, .list-item-note, .list-item-actions {\n      color: ${COLORS.neutral_300};\n    }\n  }\n\n\n  &.small {\n    min-height: 48px;\n    padding: 0 8px;\n\n    .list-item-icon {\n      margin-right: 8px;\n    }\n\n    .list-item-main-text {\n      ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    .list-item-actions {\n      margin-right: -8px;\n    }\n  }\n\n  &.medium {\n    min-height: 56px;\n    padding: 0 12px;\n\n    .list-item-icon {\n      margin-right: 12px;\n    }\n\n    .list-item-main-text {\n      ${ComponentMStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    .list-item-actions {\n      margin-right: -12px;\n    }\n  }\n\n  &.large {\n    min-height: 64px;\n    padding: 0 16px;\n\n    .list-item-icon {\n      margin-right: 16px;\n    }\n\n    .list-item-main-text {\n      ${ComponentLStyling(ComponentTextStyle.Regular, null)}\n    }\n\n    .list-item-actions {\n      margin-right: -16px;\n    }\n  }\n\n  &.overlay {\n    padding: 0 4px;\n\n    .list-item-actions {\n      margin-right: -4px;\n    }\n  }\n\n  .list-item-icon {\n    width: 24px;\n    height: 24px;\n\n    svg {\n      width: 24px;\n      height: 24px;\n    }\n  }\n\n  .list-item-content {\n    flex-grow: 1;\n    display: flex;\n    flex-direction: column;\n  }\n\n  .list-item-main-text {\n  }\n\n  .list-item-secondary-text {\n    ${ComponentXXSStyling(ComponentTextStyle.Regular, null)}\n  }\n\n  .list-item-note {\n    color: ${COLORS.neutral_600};\n    word-break: initial;\n    ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\n  }\n\n  .list-item-note.with-tooltip {\n    cursor: pointer;\n\n    > div {\n      text-decoration-line: underline;\n      text-decoration-style: dashed;\n      text-underline-offset: 1px;\n      text-decoration-thickness: 1px;\n    }\n  }\n\n  .list-item-actions {\n    color: ${COLORS.neutral_600};\n    display: flex;\n    align-items: center;\n\n    button div {\n      background-color: transparent;\n    }\n  }\n`;\n\n\ntype Props = {\n  key?: string;\n  size?: Size;\n  variant?: 'normal' | 'overlay';\n  icon?: React.ReactNode;\n  mainText: string;\n  secondaryText?: string;\n  dropdown?: Pick<DropdownButtonProps, 'items' | 'onClick' | 'disabled' | 'width'>;\n  note?: string;\n  noteTooltip?: string;\n  disabled?: boolean;\n  action?: () => void;\n};\n\nconst ListRow: React.FunctionComponent<Props> = ({\n                                                   key,\n                                                   size = Size.Medium,\n                                                   variant = 'normal',\n                                                   icon,\n                                                   mainText,\n                                                   secondaryText,\n                                                   dropdown,\n                                                   note,\n                                                   noteTooltip,\n                                                   disabled = false,\n                                                   action\n                                                 }: Props) => {\n\n  const [inAction, setInAction] = React.useState<Boolean>(false);\n\n  const handleKeyPress = (e: any) => {\n    if (e.key === 'Enter') {\n      action && action()\n    }\n  }\n\n  const rowClassName = (inAction ? 'in-action ' : '')\n    .concat(disabled ? 'disabled ' : '')\n    .concat(!!action ? 'interactive ' : '')\n    .concat('list-item-row ')\n    .concat(`${variant} `)\n    .concat(`${size}`);\n\n  return (\n    <Row key={key}\n         tabIndex={!!action && !disabled ? 0 : undefined}\n         className={rowClassName}\n         onKeyPress={(e) => !disabled && handleKeyPress(e)}\n         onClick={e => {\n           !disabled && action && action();\n         }}\n         data-hj-suppress>\n      {\n        !!icon &&\n        <div className={'list-item-icon'}>{icon}</div>\n      }\n      <div className={'list-item-content'}>\n        <div className={'list-item-main-text'}>{mainText}</div>\n        {!!secondaryText && <div className={'list-item-secondary-text'}>{secondaryText}</div>}\n      </div>\n      {\n        !!note &&\n        <>\n          {\n            !!noteTooltip &&\n            <div className={'list-item-note with-tooltip'}>\n              <TooltipWrapper label={noteTooltip}\n                              size={size === Size.Large ? Size.Medium : size === Size.Small ? Size.XSmall : Size.Small}\n                              position={'top'}\n                              withArrow={true}>\n                {note}\n              </TooltipWrapper>\n            </div>\n          }\n          {\n            !noteTooltip &&\n            <div className={'list-item-note'}>\n              {note}\n            </div>\n          }\n        </>\n      }\n      {\n        !!dropdown &&\n        <div className={'list-item-actions'}\n             onMouseEnter={() => setInAction(!dropdown?.disabled)}\n             onMouseLeave={() => setInAction(false)}>\n          <DropdownButton {...dropdown}\n                          disabled={disabled || dropdown.disabled}\n                          icon={variant === 'overlay'\n                            ? <SystemIcons.ArrowDropDown/>\n                            : <SystemIcons.MoreVertical/>}\n          />\n        </div>\n      }\n    </Row>\n  );\n};\n\nexport default ListRow;\n\n"],"file":"ListRow.js"}