@laerdal/life-react-components 1.0.1-dev.22.full → 1.0.1-dev.29.full

package/dist/js/Dropdown/DropdownFilter.js

@@ -21,6 +21,8 @@ var _LoadingIndicator = require("../LoadingIndicator");
 
 var _CommonStyling = require("./CommonStyling");
 
+var _DropdownContent = _interopRequireDefault(require("./DropdownContent"));
+
 var _styling = require("../InputFields/styling");
 
 var _typography = require("../styles/typography");
@@ -33,14 +35,6 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
-
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -57,9 +51,6 @@ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(
 
 var InputField = _styledComponents.default.input(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", "\n  border: none;\n  outline: none;\n  background-color: inherit;\n  cursor: pointer;\n  color: ", " !important;\n  padding: 0;\n  ::-webkit-search-decoration,\n  ::-webkit-search-cancel-button,\n  ::-webkit-search-results-button,\n  ::-webkit-search-results-decoration {\n    -webkit-appearance: none;\n  }\n  ::placeholder {\n    ", "\n\n    ", " {\n      ", "\n    }\n    &.small {\n      ", "\n    }\n    &.medium {\n      ", "\n    }\n  }\n"])), (0, _typography.ComponentMStyling)(_typography.ComponentTextStyle.Regular, _styles.COLORS.black), _styles.COLORS.black, (0, _typography.ComponentSStyling)(_typography.ComponentTextStyle.Italic, _styles.COLORS.neutral_600), _styles.BREAKPOINTS.MEDIUM, (0, _typography.ComponentMStyling)(_typography.ComponentTextStyle.Italic, _styles.COLORS.neutral_600), (0, _typography.ComponentSStyling)(_typography.ComponentTextStyle.Italic, _styles.COLORS.neutral_600), (0, _typography.ComponentMStyling)(_typography.ComponentTextStyle.Italic, _styles.COLORS.neutral_600));
 
-var MAX_MENU_HEIGHT = 240;
-var AVG_OPTION_HEIGHT = 48;
-
 var DropdownFilter = function DropdownFilter(_ref) {
   var id = _ref.id,
       list = _ref.list,
@@ -89,138 +80,36 @@ var DropdownFilter = function DropdownFilter(_ref) {
 
   var _React$useState3 = React.useState(false),
       _React$useState4 = _slicedToArray(_React$useState3, 2),
-      isUp = _React$useState4[0],
-      setIsUp = _React$useState4[1];
+      isLoading = _React$useState4[0],
+      setIsLoading = _React$useState4[1];
 
-  var _React$useState5 = React.useState(false),
+  var _React$useState5 = React.useState(initalValue !== null && initalValue !== void 0 ? initalValue : ''),
       _React$useState6 = _slicedToArray(_React$useState5, 2),
-      isLoading = _React$useState6[0],
-      setIsLoading = _React$useState6[1];
+      input = _React$useState6[0],
+      setInput = _React$useState6[1];
 
-  var _React$useState7 = React.useState(''),
+  var _React$useState7 = React.useState(placeholder || ''),
       _React$useState8 = _slicedToArray(_React$useState7, 2),
-      input = _React$useState8[0],
-      setInput = _React$useState8[1];
+      placeholderSearch = _React$useState8[0],
+      setPlaceholderSearch = _React$useState8[1];
 
-  var _React$useState9 = React.useState(placeholder || ''),
+  var _React$useState9 = React.useState(false),
       _React$useState10 = _slicedToArray(_React$useState9, 2),
-      placeholderSearch = _React$useState10[0],
-      setPlaceholderSearch = _React$useState10[1];
+      restartFilter = _React$useState10[0],
+      setRestartFilter = _React$useState10[1];
 
-  var _React$useState11 = React.useState(false),
+  var _React$useState11 = React.useState([]),
       _React$useState12 = _slicedToArray(_React$useState11, 2),
-      restartFilter = _React$useState12[0],
-      setRestartFilter = _React$useState12[1];
-
-  var _React$useState13 = React.useState(null),
-      _React$useState14 = _slicedToArray(_React$useState13, 2),
-      focused = _React$useState14[0],
-      setFocused = _React$useState14[1];
-
-  var _React$useState15 = React.useState(list),
-      _React$useState16 = _slicedToArray(_React$useState15, 2),
-      currentSearchResult = _React$useState16[0],
-      setCurrentSearchResult = _React$useState16[1];
+      selectedValues = _React$useState12[0],
+      setSelectedValues = _React$useState12[1];
 
-  var dropdownContentRef = React.useRef(null);
   var styledFieldRef = React.useRef(null);
   var inputRef = React.useRef(null);
-  React.useEffect(function () {
-    var options = _toConsumableArray(list);
-
-    if (!restartFilter && input !== '') {
-      options = options.filter(function (option) {
-        return option.toUpperCase().indexOf(input.toUpperCase()) !== -1;
-      });
-    }
-
-    if (!disableSorting) {
-      options = options.sort();
-    }
-
-    setCurrentSearchResult(options);
-  }, [input, list]);
-
-  var handleClickOutside = function handleClickOutside(e) {
-    if (dropdownContentRef !== null && dropdownContentRef !== void 0 && dropdownContentRef.current && !dropdownContentRef.current.contains(e.target)) {
-      if (isOpen) {
-        setIsOpen(false);
-        setFocused(null);
-
-        if (!list.includes(input)) {
-          setInput('');
-          setPlaceholderSearch(placeholder || '');
-        }
-      }
-    }
-  };
-
-  var setNewFocusedElement = function setNewFocusedElement(index) {
-    var newFocusedElement = document.getElementById("".concat(id, "_").concat(index));
-
-    if (newFocusedElement) {
-      setFocused(index);
-      newFocusedElement.focus();
-    }
-  };
-
-  var handleKeyDown = function handleKeyDown(e) {
-    if (isOpen) {
-      if (e.keyCode === 38) {
-        e.preventDefault();
-        var focusedNow = focused;
-
-        if (focusedNow !== undefined && focusedNow !== null && focusedNow > 0) {
-          focusedNow -= 1;
-          setNewFocusedElement(focusedNow);
-        }
-      } else if (e.keyCode === 40) {
-        e.preventDefault();
-        var focusedNow = focused;
-
-        if (focusedNow !== undefined && focusedNow !== null) {
-          focusedNow++;
-        } else {
-          focusedNow = 0;
-        }
-
-        setNewFocusedElement(focusedNow);
-      } else if (e.keyCode === 9) {
-        e.preventDefault();
-        var focusedNow = focused;
-
-        if (focusedNow !== undefined && focusedNow !== null) {
-          focusedNow++;
-          var newFocusedElement = document.getElementById("".concat(id, "_").concat(focusedNow));
-
-          if (!newFocusedElement) {
-            setNewFocusedElement(0);
-          } else {
-            setNewFocusedElement(focusedNow);
-          }
-        } else {
-          setNewFocusedElement(0);
-        }
-      } else if (e.keyCode === 27) {
-        var _styledFieldRef$curre;
-
-        setIsOpen(false);
-        setNewFocusedElement(0);
-
-        if (!list.includes(input)) {
-          setInput('');
-          setPlaceholderSearch(placeholder || '');
-        }
-
-        (_styledFieldRef$curre = styledFieldRef.current) === null || _styledFieldRef$curre === void 0 ? void 0 : _styledFieldRef$curre.focus();
-      }
-    }
-  };
 
   var handleKeyPress = function handleKeyPress(e) {
     if (styledFieldRef !== null && styledFieldRef !== void 0 && styledFieldRef.current && styledFieldRef.current.contains(e.target)) {
       if (e.keyCode === 13 && !locked) {
-        var matches = currentSearchResult === null || currentSearchResult === void 0 ? void 0 : currentSearchResult.filter(function (c) {
+        var matches = list === null || list === void 0 ? void 0 : list.filter(function (c) {
           return c.toLowerCase() === input.toLowerCase();
         });
 
@@ -230,14 +119,12 @@ var DropdownFilter = function DropdownFilter(_ref) {
         }
 
         setIsOpen(!isOpen);
-        setNewFocusedElement(0);
 
         if (matches.length === 0) {
           setInput('');
         }
       } else if (e.keyCode === 40) {
         setIsOpen(!isOpen);
-        setNewFocusedElement(0);
       }
     }
   };
@@ -249,62 +136,26 @@ var DropdownFilter = function DropdownFilter(_ref) {
     }
   }, [initalValue]);
   React.useEffect(function () {
-    document.addEventListener('keydown', handleKeyDown);
+    if (!isOpen && !list.includes(input)) {
+      setInput('');
+      setPlaceholderSearch(placeholder || '');
+    }
+  }, [isOpen]);
+  React.useEffect(function () {
     document.addEventListener('keypress', handleKeyPress);
-    document.addEventListener('click', handleClickOutside);
     return function () {
-      document.removeEventListener('keydown', handleKeyDown);
       document.removeEventListener('keypress', handleKeyPress);
-      document.removeEventListener('click', handleClickOutside);
     };
   });
   React.useEffect(function () {
     setIsLoading(false);
-  }, [input]);
-  React.useEffect(function () {
-    determineDropUp();
-  }, [isOpen]);
-
-  var determineDropUp = function determineDropUp() {
-    var options = list;
-    var node = dropdownContentRef.current;
-    if (!node) return;
-    var windowHeight = window.innerHeight;
-    var menuHeight = Math.min(MAX_MENU_HEIGHT, options.length * AVG_OPTION_HEIGHT);
-    var instOffsetWithMenu = node.getBoundingClientRect().top + menuHeight;
-    setIsUp(instOffsetWithMenu >= windowHeight);
-  };
+    if (selectedValues.length > 0 && !list.includes(input)) setSelectedValues([]);
 
-  var getElements = function getElements() {
-    if (locked || disabled) {
-      return /*#__PURE__*/React.createElement(React.Fragment, null);
+    if (list.includes(input)) {
+      setSelectedValues([input]);
+      onSelect && onSelect(input);
     }
-
-    var number = 0;
-
-    if (currentSearchResult.length === 0) {
-      return /*#__PURE__*/React.createElement(_CommonStyling.DropdownButton, {
-        disabled: true
-      }, /*#__PURE__*/React.createElement("span", null, messageOnNoResults));
-    }
-
-    return currentSearchResult.map(function (item) {
-      return /*#__PURE__*/React.createElement(_CommonStyling.DropdownButton, {
-        type: "button",
-        onClick: function onClick(e) {
-          e.preventDefault();
-          setRestartFilter(true);
-          setInput(item);
-          onSelect && onSelect(item);
-          setIsOpen(false);
-          setFocused(null);
-        },
-        className: (item === null || item === void 0 ? void 0 : item.toLowerCase()) === (input === null || input === void 0 ? void 0 : input.toLowerCase()) ? 'active' : '',
-        key: item,
-        id: "".concat(id, "_").concat(number++)
-      }, /*#__PURE__*/React.createElement("span", null, item));
-    });
-  };
+  }, [input]);
 
   var renderStandardDropdown = function renderStandardDropdown() {
     return /*#__PURE__*/React.createElement(_CommonStyling.StyledField, {
@@ -364,7 +215,7 @@ var DropdownFilter = function DropdownFilter(_ref) {
       onClick: function onClick() {
         return setIsOpen(!isOpen);
       },
-      className: 'icon'
+      className: 'dropdown-arrow'
     }, isOpen && !locked && !disabled ? /*#__PURE__*/React.createElement(_SystemIcons.ArrowDropUp, {
       size: "24px",
       className: size ? size : ''
@@ -402,7 +253,7 @@ var DropdownFilter = function DropdownFilter(_ref) {
       onClick: function onClick() {
         return setIsOpen(!isOpen);
       },
-      className: 'icon'
+      className: 'dropdown-arrow'
     }, isOpen && !locked && !disabled ? /*#__PURE__*/React.createElement(_SystemIcons.ArrowDropUp, {
       size: "24px",
       className: size ? size : ''
@@ -418,14 +269,36 @@ var DropdownFilter = function DropdownFilter(_ref) {
     locked: locked,
     className: size ? size : '',
     margin: margin
-  }, !isButton && renderStandardDropdown(), !!isButton && renderButtonDropdown(), !locked && !disabled && /*#__PURE__*/React.createElement(_CommonStyling.DropdownContent, {
+  }, !isButton && renderStandardDropdown(), !!isButton && renderButtonDropdown(), !locked && !disabled && /*#__PURE__*/React.createElement(_DropdownContent.default, {
+    isOpen: isOpen,
+    messageOnNoResults: messageOnNoResults !== null && messageOnNoResults !== void 0 ? messageOnNoResults : '',
+    selectedValues: selectedValues,
+    setSelectedValues: setSelectedValues,
+    hideOnClickOutside: true,
+    customizationProps: {
+      itemsType: 'normal',
+      multiSelect: false,
+      action: function action() {},
+      isButton: isButton !== null && isButton !== void 0 ? isButton : false,
+      onValueUpdate: function onValueUpdate(values) {
+        var _values$;
+
+        var val = (_values$ = values[0]) !== null && _values$ !== void 0 ? _values$ : '';
+        setRestartFilter(true);
+        setInput(val);
+      },
+      items: list.map(function (x) {
+        return {
+          value: x
+        };
+      })
+    },
+    filter: !restartFilter ? input : '',
+    setIsOpen: setIsOpen,
+    alignLeft: false,
     isButton: isButton || false,
-    ref: dropdownContentRef,
-    id: "".concat(id, "_dropdowncontent"),
-    className: [isOpen && 'show', isUp && 'up'].filter(function (e) {
-      return !!e;
-    }).join(' ')
-  }, getElements())), activeValidationMessage && /*#__PURE__*/React.createElement(_styling.WarningMessage, {
+    id: "".concat(id, "_dropdowncontent")
+  })), activeValidationMessage && /*#__PURE__*/React.createElement(_styling.WarningMessage, {
     className: size || ''
   }, /*#__PURE__*/React.createElement(_SystemIcons.TechnicalWarning, {
     size: "20px",

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Dropdown/DropdownFilter.tsx"],"names":["InputField","styled","input","ComponentTextStyle","Regular","COLORS","black","Italic","neutral_600","BREAKPOINTS","MEDIUM","MAX_MENU_HEIGHT","AVG_OPTION_HEIGHT","DropdownFilter","id","list","placeholder","onSelect","onInputChange","initalValue","required","disableSorting","messageOnNoResults","disabled","locked","isButton","activeValidationMessage","autofilledMessage","size","buttonFontSize","keepInitialValue","icon","margin","React","useState","isOpen","setIsOpen","isUp","setIsUp","isLoading","setIsLoading","setInput","placeholderSearch","setPlaceholderSearch","restartFilter","setRestartFilter","focused","setFocused","currentSearchResult","setCurrentSearchResult","dropdownContentRef","useRef","styledFieldRef","inputRef","useEffect","options","filter","option","toUpperCase","indexOf","sort","handleClickOutside","e","current","contains","target","includes","setNewFocusedElement","index","newFocusedElement","document","getElementById","focus","handleKeyDown","keyCode","preventDefault","focusedNow","undefined","handleKeyPress","matches","c","toLowerCase","length","addEventListener","removeEventListener","determineDropUp","node","windowHeight","window","innerHeight","menuHeight","Math","min","instOffsetWithMenu","getBoundingClientRect","top","getElements","number","map","item","renderStandardDropdown","concat","stopPropagation","floor","random","value","renderButtonDropdown","join","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, DropdownContent, Dropdown, ButtonDropdownWrapper } from './CommonStyling';\nimport { AutofilledMessage, WarningMessage } from '../InputFields/styling';\nimport { ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles/typography';\n\nconst InputField = styled.input`\n  ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n  border: none;\n  outline: none;\n  background-color: inherit;\n  cursor: pointer;\n  color: ${COLORS.black} !important;\n  padding: 0;\n  ::-webkit-search-decoration,\n  ::-webkit-search-cancel-button,\n  ::-webkit-search-results-button,\n  ::-webkit-search-results-decoration {\n    -webkit-appearance: none;\n  }\n  ::placeholder {\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n\n    ${BREAKPOINTS.MEDIUM} {\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n    }\n    &.small {\n      ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n    }\n    &.medium {\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n    }\n  }\n`;\n\ninterface DropdownFilterProps {\n  id: string;\n  list: string[];\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  buttonFontSize?: string;\n  keepInitialValue?: boolean;\n  icon?: React.ReactNode;\n  margin?: string;\n}\n\nconst MAX_MENU_HEIGHT = 240;\nconst AVG_OPTION_HEIGHT = 48;\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  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 [isUp, setIsUp] = React.useState<boolean>(false);\n  const [isLoading, setIsLoading] = React.useState<Boolean>(false);\n  const [input, setInput] = React.useState<string>('');\n  const [placeholderSearch, setPlaceholderSearch] = React.useState<string>(placeholder || '');\n  const [restartFilter, setRestartFilter] = React.useState<boolean>(false);\n  const [focused, setFocused] = React.useState<number | null>(null);\n  const [currentSearchResult, setCurrentSearchResult] = React.useState<string[]>(list);\n\n  const dropdownContentRef = React.useRef<HTMLDivElement>(null);\n  const styledFieldRef = React.useRef<HTMLDivElement>(null);\n  const inputRef = React.useRef<HTMLInputElement>(null);\n\n  React.useEffect(() => {\n    var options = [...list];\n    if (!restartFilter && input !== '') {\n      options = options.filter((option) => option.toUpperCase().indexOf(input.toUpperCase()) !== -1);\n    }\n    if (!disableSorting) {\n      options = options.sort();\n    }\n    setCurrentSearchResult(options);\n  }, [input, list]);\n\n  const handleClickOutside = (e: any) => {\n    if (dropdownContentRef?.current && !dropdownContentRef.current.contains(e.target)) {\n      if (isOpen) {\n        setIsOpen(false);\n        setFocused(null);\n        if (!list.includes(input)) {\n          setInput('');\n          setPlaceholderSearch(placeholder || '');\n        }\n      }\n    }\n  };\n\n  const setNewFocusedElement = (index: number) => {\n    const newFocusedElement = document.getElementById(`${id}_${index}`);\n    if (newFocusedElement) {\n      setFocused(index);\n      newFocusedElement.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          setNewFocusedElement(0);\n        }\n      } else if (e.keyCode === 27) {\n        setIsOpen(false);\n        setNewFocusedElement(0);\n        if (!list.includes(input)) {\n          setInput('');\n          setPlaceholderSearch(placeholder || '');\n        }\n        styledFieldRef.current?.focus();\n      }\n    }\n  };\n\n  const handleKeyPress = (e: any) => {\n    if (styledFieldRef?.current && styledFieldRef.current.contains(e.target)) {\n      if (e.keyCode === 13 && !locked) {\n        const matches = currentSearchResult?.filter((c) => c.toLowerCase() === input.toLowerCase());\n        if (matches.length === 1 && onSelect) {\n          onSelect(matches[0]);\n          setInput(matches[0]);\n        }\n        setIsOpen(!isOpen);\n        setNewFocusedElement(0);\n        if (matches.length === 0) {\n          setInput('');\n        }\n      } else if (e.keyCode === 40) {\n        setIsOpen(!isOpen);\n        setNewFocusedElement(0);\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    document.addEventListener('keydown', handleKeyDown);\n    document.addEventListener('keypress', handleKeyPress);\n    document.addEventListener('click', handleClickOutside);\n    return () => {\n      document.removeEventListener('keydown', handleKeyDown);\n      document.removeEventListener('keypress', handleKeyPress);\n      document.removeEventListener('click', handleClickOutside);\n    };\n  });\n\n  React.useEffect(() => {\n    setIsLoading(false);\n  }, [input]);\n\n  React.useEffect(() => {\n    determineDropUp();\n  }, [isOpen]);\n\n  const determineDropUp = () => {\n    const options = list;\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 getElements = () => {\n    if (locked || disabled) {\n      return <></>;\n    }\n    var number = 0;\n    if (currentSearchResult.length === 0) {\n      return (\n        <DropdownButton disabled>\n          <span>{messageOnNoResults}</span>\n        </DropdownButton>\n      );\n    }\n    return currentSearchResult.map((item) => {\n      return (\n        <DropdownButton\n          type=\"button\"\n          onClick={(e: any) => {\n            e.preventDefault();\n            setRestartFilter(true);\n            setInput(item);\n            onSelect && onSelect(item);\n            setIsOpen(false);\n            setFocused(null);\n          }}\n          className={item?.toLowerCase() === input?.toLowerCase() ? 'active' : ''}\n          key={item}\n          id={`${id}_${number++}`}>\n          <span>{item}</span>\n        </DropdownButton>\n      );\n    });\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={'icon'}>\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={'icon'}>\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            isButton={isButton || false}\n            ref={dropdownContentRef}\n            id={`${id}_dropdowncontent`}\n            className={[isOpen && 'show', isUp && 'up'].filter((e) => !!e).join(' ')}>\n            {getElements()}\n          </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":["InputField","styled","input","ComponentTextStyle","Regular","COLORS","black","Italic","neutral_600","BREAKPOINTS","MEDIUM","DropdownFilter","id","list","placeholder","onSelect","onInputChange","initalValue","required","disableSorting","messageOnNoResults","disabled","locked","isButton","activeValidationMessage","autofilledMessage","size","buttonFontSize","keepInitialValue","icon","margin","React","useState","isOpen","setIsOpen","isLoading","setIsLoading","setInput","placeholderSearch","setPlaceholderSearch","restartFilter","setRestartFilter","selectedValues","setSelectedValues","styledFieldRef","useRef","inputRef","handleKeyPress","e","current","contains","target","keyCode","matches","filter","c","toLowerCase","length","useEffect","includes","document","addEventListener","removeEventListener","renderStandardDropdown","concat","stopPropagation","focus","Math","floor","random","value","renderButtonDropdown","itemsType","multiSelect","action","onValueUpdate","values","val","items","map","x","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 } from './CommonStyling';\nimport DropdownContent from './DropdownContent';\nimport { AutofilledMessage, WarningMessage } from '../InputFields/styling';\nimport { ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles/typography';\n\nconst InputField = styled.input`\n  ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\n  border: none;\n  outline: none;\n  background-color: inherit;\n  cursor: pointer;\n  color: ${COLORS.black} !important;\n  padding: 0;\n  ::-webkit-search-decoration,\n  ::-webkit-search-cancel-button,\n  ::-webkit-search-results-button,\n  ::-webkit-search-results-decoration {\n    -webkit-appearance: none;\n  }\n  ::placeholder {\n    ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n\n    ${BREAKPOINTS.MEDIUM} {\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n    }\n    &.small {\n      ${ComponentSStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n    }\n    &.medium {\n      ${ComponentMStyling(ComponentTextStyle.Italic, COLORS.neutral_600)}\n    }\n  }\n`;\n\ninterface DropdownFilterProps {\n  id: string;\n  list: string[];\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  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  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\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.toLowerCase() === input.toLowerCase());\n        if (matches.length === 1 && onSelect) {\n          onSelect(matches[0]);\n          setInput(matches[0]);\n        }\n        setIsOpen(!isOpen);\n        if (matches.length === 0) {\n          setInput('');\n        }\n      } else if (e.keyCode === 40) {\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.includes(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.includes(input))\n      setSelectedValues([]);\n\n    if(list.includes(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          customizationProps={{\n            itemsType: 'normal',\n            multiSelect: false,\n            action: () => {},\n            isButton: isButton ?? false,\n            onValueUpdate: (values: string[]) => {\n              const val = values[0] ?? '';\n              setRestartFilter(true);\n              setInput(val);\n            },\n            items: list.map(x => ({ value: x }))\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/js/GlobalNavigationBar/UserMenu/UserMenu.js

@@ -21,6 +21,8 @@ var _Avatar = _interopRequireWildcard(require("../Avatar"));
 
 var _MenuLink = _interopRequireDefault(require("./MenuLink"));
 
+var _types = require("../../types");
+
 var _CommonStyles = require("../mobile/CommonStyles");
 
 var _typography = require("../../styles/typography");
@@ -35,15 +37,15 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 
-var Menu = _styledComponents.default.ul(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  background-color: ", ";\n  box-sizing: border-box;\n  display: none;\n  min-width: 312px;\n  -webkit-animation: ", " 0.2s ease-in-out;\n  animation: ", " 0.2s ease-in-out;\n  position: absolute;\n  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);\n  border-radius: 4px;\n  border: 1px solid ", ";\n  z-index: 100;\n\n  .open & {\n    display: block;\n  }\n"])), _styles.COLORS.white, _CommonStyles.flowDown, _CommonStyles.flowDown, _styles.COLORS.neutral_200);
+var Menu = _styledComponents.default.ul(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  background-color: ", ";\n  box-sizing: border-box;\n  display: none;\n  min-width: 312px;\n  -webkit-animation: ", " 0.2s ease-in-out;\n  animation: ", " 0.2s ease-in-out;\n  position: absolute;\n  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);\n  border-radius: 4px;\n  border: 1px solid ", ";\n  z-index: 100;\n\n  .open & {\n    display: block;\n  }\n  \n  .sign-out{\n    width: 90%;\n    box-sizing: border-box;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    margin: 8px auto 12px auto;\n  }\n"])), _styles.COLORS.white, _CommonStyles.flowDown, _CommonStyles.flowDown, _styles.COLORS.neutral_200);
 
 var MenuSection = _styledComponents.default.li(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  padding: 8px 0;\n  position: relative;\n\n  &:not(:first-of-type)::before {\n    content: '';\n    position: absolute;\n    background: ", ";\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"])), _styles.COLORS.neutral_100);
 
 var MenuSectionList = _styledComponents.default.ul(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  list-style: none;\n  margin: 0;\n  padding: 0;\n\n  ", ";\n"])), _CommonStyles.UserMenuSectionListStyling);
 
-var StyledAvatarContainer = (0, _styledComponents.default)(_Avatar.AvatarContainer)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  margin: 25px 0 0 25px;\n"])));
+var StyledAvatarContainer = (0, _styledComponents.default)(_Avatar.AvatarContainer)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  margin: 25px 0 0 25px;\n  pointer-events: none;\n"])));
 
-var AvatarAndName = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n\n  h5 {\n    margin: 27px 0 0 20px;\n    ", "\n  }\n  span {\n    margin: -5px 0 0 20px;\n    ", "\n    top: -2px;\n  }\n"])), (0, _typography.HeadlineXXSStyling)(_styles.COLORS.neutral_600), (0, _typography.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600));
+var AvatarAndName = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n\n  h5 {\n    margin: 28px 0 0 20px;\n    ", "\n  }\n  span {\n    margin: 0 0 0 20px;\n    ", "\n  }\n"])), (0, _typography.HeadlineXXSStyling)(_styles.COLORS.neutral_600), (0, _typography.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600));
 
 var NameAndEmail = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n"])));
 
@@ -123,24 +125,12 @@ var UserMenu = function UserMenu(_ref) {
     });
   }), signOut && /*#__PURE__*/React.createElement(_Button.Button, {
     width: "90%",
-    className: "UserMenuLink",
+    className: "UserMenuLink sign-out",
     variant: "secondary",
-    size: "big",
+    size: _types.Size.Large,
     onClick: function onClick(e) {
       e.preventDefault();
       signOut(e);
-    },
-    style: {
-      fontSize: '19px',
-      lineHeight: '23px',
-      boxSizing: 'border-box',
-      borderRadius: '8px',
-      height: '56px',
-      display: 'flex',
-      justifyContent: 'center',
-      alignItems: 'center',
-      margin: '8px auto 12px auto',
-      width: '90%'
     }
   }, signOutLabel))));
 };

package/dist/js/GlobalNavigationBar/UserMenu/UserMenu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/GlobalNavigationBar/UserMenu/UserMenu.tsx"],"names":["Menu","styled","ul","COLORS","white","flowDown","neutral_200","MenuSection","li","neutral_100","MenuSectionList","UserMenuSectionListStyling","StyledAvatarContainer","AvatarContainer","AvatarAndName","div","neutral_600","ComponentTextStyle","Regular","NameAndEmail","OrganizationName","span","Bold","UserMenu","firstName","lastName","email","organizationName","clickMenuAction","accountSection","organizationSection","supportSection","signOut","signOutLabel","React","useEffect","handleKeyPress","e","keyCode","document","addEventListener","removeEventListener","primary_500","length","map","element","to","label","icon","onClick","isExternal","preventDefault","fontSize","lineHeight","boxSizing","borderRadius","height","display","justifyContent","alignItems","margin","width"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {COLORS, ComponentTextStyle} from '../../styles';\nimport Avatar, {AvatarContainer} from '../Avatar';\nimport MenuLink from './MenuLink';\nimport {UserMenuItem} from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {ComponentXSStyling, HeadlineXXSStyling} from '../../styles/typography';\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  min-width: 312px;\n  -webkit-animation: ${flowDown} 0.2s ease-in-out;\n  animation: ${flowDown} 0.2s ease-in-out;\n  position: absolute;\n  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);\n  border-radius: 4px;\n  border: 1px solid ${COLORS.neutral_200};\n  z-index: 100;\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;\n\n  ${UserMenuSectionListStyling};\n`;\n\nconst StyledAvatarContainer = styled(AvatarContainer)`\n  margin: 25px 0 0 25px;\n`;\n\nconst AvatarAndName = styled.div`\n  display: flex;\n  flex-direction: row;\n\n  h5 {\n    margin: 27px 0 0 20px;\n    ${HeadlineXXSStyling(COLORS.neutral_600)}\n  }\n  span {\n    margin: -5px 0 0 20px;\n    ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n    top: -2px;\n  }\n`;\n\nconst NameAndEmail = styled.div`\n  display: flex;\n  flex-direction: column;\n`;\n\nconst OrganizationName = styled.span`\n  margin-left: 25px;\n  ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\ninterface Props {\n  firstName: string;\n  lastName: string;\n  email: string;\n  organizationName: string;\n  clickMenuAction: () => void;\n  accountSection?: UserMenuItem[];\n  organizationSection?: UserMenuItem[];\n  supportSection?: UserMenuItem[];\n  signOut?: (e: any) => void;\n  signOutLabel?: string;\n}\n\nconst UserMenu = ({ firstName, lastName, email, organizationName, clickMenuAction, accountSection, organizationSection, supportSection, signOut, signOutLabel }: Props) => {\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  return (\n    <Menu onClick={clickMenuAction} role=\"menu\" aria-labelledby=\"UserMenuButton\">\n      <AvatarAndName key=\"AvatarAndNameSection\">\n        <StyledAvatarContainer hidePadding={true}>\n          <Avatar size={48} firstName={firstName} lastName={lastName} color={COLORS.primary_500} profileMenuLink=\"#TODO\" />\n        </StyledAvatarContainer>\n        <NameAndEmail>\n          <h5 data-hj-suppress>{`${firstName} ${lastName}`}</h5>\n          <span data-hj-suppress>{email}</span>\n        </NameAndEmail>\n      </AvatarAndName>\n      {accountSection && accountSection?.length > 0 && (\n        <MenuSection key=\"MobileAccountSection\">\n          <MenuSectionList>\n            {accountSection?.map(element => (\n              <MenuLink key={element?.to} to={element?.to} menuText={element?.label} Icon={element?.icon} onClick={element?.onClick} />\n            ))}\n          </MenuSectionList>\n        </MenuSection>\n      )}\n\n      {organizationSection && organizationSection?.length > 0 && (\n        <MenuSection key=\"MobileOrganizationSection\">\n          <OrganizationName>{organizationName || ''}</OrganizationName>\n          <MenuSectionList>\n            {organizationSection?.map(element => (\n              <MenuLink key={element?.to} to={element?.to} menuText={element?.label} Icon={element?.icon} onClick={element?.onClick} />\n            ))}\n          </MenuSectionList>\n        </MenuSection>\n      )}\n\n      <MenuSection key=\"MobileSupportSection\">\n        <MenuSectionList>\n          {supportSection?.map(element => (\n            <MenuLink key={element?.to} isExternal={element.isExternal} to={element?.to} menuText={element?.label} Icon={element?.icon} onClick={element?.onClick} />\n          ))}\n          {signOut && (\n            <Button\n              width=\"90%\"\n              className=\"UserMenuLink\"\n              variant=\"secondary\"\n              size=\"big\"\n              onClick={e => {\n                e.preventDefault();\n                signOut(e);\n              }}\n              style={{\n                fontSize: '19px',\n                lineHeight: '23px',\n                boxSizing: 'border-box',\n                borderRadius: '8px',\n                height: '56px',\n                display: 'flex',\n                justifyContent: 'center',\n                alignItems: 'center',\n                margin: '8px auto 12px auto',\n                width: '90%',\n              }}>\n              {signOutLabel}\n            </Button>\n          )}\n        </MenuSectionList>\n      </MenuSection>\n    </Menu>\n  );\n};\n\nexport default UserMenu;\n"],"file":"UserMenu.js"}
+{"version":3,"sources":["../../../../src/GlobalNavigationBar/UserMenu/UserMenu.tsx"],"names":["Menu","styled","ul","COLORS","white","flowDown","neutral_200","MenuSection","li","neutral_100","MenuSectionList","UserMenuSectionListStyling","StyledAvatarContainer","AvatarContainer","AvatarAndName","div","neutral_600","ComponentTextStyle","Regular","NameAndEmail","OrganizationName","span","Bold","UserMenu","firstName","lastName","email","organizationName","clickMenuAction","accountSection","organizationSection","supportSection","signOut","signOutLabel","React","useEffect","handleKeyPress","e","keyCode","document","addEventListener","removeEventListener","primary_500","length","map","element","to","label","icon","onClick","isExternal","Size","Large","preventDefault"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {Button} from '../../Button';\nimport {COLORS, ComponentTextStyle} from '../../styles';\nimport Avatar, {AvatarContainer} from '../Avatar';\nimport MenuLink from './MenuLink';\nimport { UserMenuItem, Size } from '../../types';\nimport {flowDown, UserMenuSectionListStyling} from '../mobile/CommonStyles';\nimport {ComponentXSStyling, HeadlineXXSStyling} from '../../styles/typography';\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  min-width: 312px;\n  -webkit-animation: ${flowDown} 0.2s ease-in-out;\n  animation: ${flowDown} 0.2s ease-in-out;\n  position: absolute;\n  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);\n  border-radius: 4px;\n  border: 1px solid ${COLORS.neutral_200};\n  z-index: 100;\n\n  .open & {\n    display: block;\n  }\n  \n  .sign-out{\n    width: 90%;\n    box-sizing: border-box;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    margin: 8px auto 12px auto;\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;\n\n  ${UserMenuSectionListStyling};\n`;\n\nconst StyledAvatarContainer = styled(AvatarContainer)`\n  margin: 25px 0 0 25px;\n  pointer-events: none;\n`;\n\nconst AvatarAndName = styled.div`\n  display: flex;\n  flex-direction: row;\n\n  h5 {\n    margin: 28px 0 0 20px;\n    ${HeadlineXXSStyling(COLORS.neutral_600)}\n  }\n  span {\n    margin: 0 0 0 20px;\n    ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n  }\n`;\n\nconst NameAndEmail = styled.div`\n  display: flex;\n  flex-direction: column;\n`;\n\nconst OrganizationName = styled.span`\n  margin-left: 25px;\n  ${ComponentXSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n`;\n\ninterface Props {\n  firstName: string;\n  lastName: string;\n  email: string;\n  organizationName: string;\n  clickMenuAction: () => void;\n  accountSection?: UserMenuItem[];\n  organizationSection?: UserMenuItem[];\n  supportSection?: UserMenuItem[];\n  signOut?: (e: any) => void;\n  signOutLabel?: string;\n}\n\nconst UserMenu = ({ firstName, lastName, email, organizationName, clickMenuAction, accountSection, organizationSection, supportSection, signOut, signOutLabel }: Props) => {\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  return (\n    <Menu onClick={clickMenuAction} role=\"menu\" aria-labelledby=\"UserMenuButton\">\n      <AvatarAndName key=\"AvatarAndNameSection\">\n        <StyledAvatarContainer hidePadding={true}>\n          <Avatar size={48} firstName={firstName} lastName={lastName} color={COLORS.primary_500} profileMenuLink=\"#TODO\" />\n        </StyledAvatarContainer>\n        <NameAndEmail>\n          <h5 data-hj-suppress>{`${firstName} ${lastName}`}</h5>\n          <span data-hj-suppress>{email}</span>\n        </NameAndEmail>\n      </AvatarAndName>\n      {accountSection && accountSection?.length > 0 && (\n        <MenuSection key=\"MobileAccountSection\">\n          <MenuSectionList>\n            {accountSection?.map(element => (\n              <MenuLink key={element?.to} to={element?.to} menuText={element?.label} Icon={element?.icon} onClick={element?.onClick} />\n            ))}\n          </MenuSectionList>\n        </MenuSection>\n      )}\n\n      {organizationSection && organizationSection?.length > 0 && (\n        <MenuSection key=\"MobileOrganizationSection\">\n          <OrganizationName>{organizationName || ''}</OrganizationName>\n          <MenuSectionList>\n            {organizationSection?.map(element => (\n              <MenuLink key={element?.to} to={element?.to} menuText={element?.label} Icon={element?.icon} onClick={element?.onClick} />\n            ))}\n          </MenuSectionList>\n        </MenuSection>\n      )}\n\n      <MenuSection key=\"MobileSupportSection\">\n        <MenuSectionList>\n          {supportSection?.map(element => (\n            <MenuLink key={element?.to} isExternal={element.isExternal} to={element?.to} menuText={element?.label} Icon={element?.icon} onClick={element?.onClick} />\n          ))}\n          {signOut && (\n            <Button\n              width=\"90%\"\n              className=\"UserMenuLink sign-out\"\n              variant=\"secondary\"\n              size={Size.Large}\n              onClick={e => {\n                e.preventDefault();\n                signOut(e);\n              }}>\n              {signOutLabel}\n            </Button>\n          )}\n        </MenuSectionList>\n      </MenuSection>\n    </Menu>\n  );\n};\n\nexport default UserMenu;\n"],"file":"UserMenu.js"}

package/dist/js/InputFields/Checkbox.d.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { Size } from '../types';
 interface Props {
     id: string;
     selected: boolean;
@@ -7,8 +8,9 @@ interface Props {
     showWarning?: boolean;
     disabled?: boolean;
     margin?: string;
-    size?: 'small' | 'medium' | 'large';
+    size?: Size;
+    iconPointerEventsTransparent?: boolean;
     semiSelected?: boolean;
 }
-declare const RadioButton: React.FunctionComponent<Props>;
-export default RadioButton;
+declare const Checkbox: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLDivElement>>;
+export default Checkbox;