@laerdal/life-react-components 3.5.2-uss.hackathon → 3.5.2

package/dist/umd/InputFields/QuickSearch.js

@@ -1,254 +0,0 @@
-(function (global, factory) {
-  if (typeof define === "function" && define.amd) {
-    define(["exports", "prop-types", "react", "styled-components", "../Button/Iconbutton", "./styling", "../types", "..", "../icons/systemicons/SystemIcons", "./components/SearchBarInput", "./components/SearchField"], factory);
-  } else if (typeof exports !== "undefined") {
-    factory(exports, require("prop-types"), require("react"), require("styled-components"), require("../Button/Iconbutton"), require("./styling"), require("../types"), require(".."), require("../icons/systemicons/SystemIcons"), require("./components/SearchBarInput"), require("./components/SearchField"));
-  } else {
-    var mod = {
-      exports: {}
-    };
-    factory(mod.exports, global.propTypes, global.react, global.styledComponents, global.Iconbutton, global.styling, global.types, global._, global.SystemIcons, global.SearchBarInput, global.SearchField);
-    global.undefined = mod.exports;
-  }
-})(this, function (exports, _propTypes, _react, _styledComponents, _Iconbutton, _styling, _types, _, _SystemIcons, _SearchBarInput, _SearchField) {
-  "use strict";
-
-  Object.defineProperty(exports, "__esModule", {
-    value: true
-  });
-
-  var _propTypes2 = _interopRequireDefault(_propTypes);
-
-  var React = _interopRequireWildcard(_react);
-
-  var _styledComponents2 = _interopRequireDefault(_styledComponents);
-
-  var _Iconbutton2 = _interopRequireDefault(_Iconbutton);
-
-  var _SearchBarInput2 = _interopRequireDefault(_SearchBarInput);
-
-  function _getRequireWildcardCache(nodeInterop) {
-    if (typeof WeakMap !== "function") return null;
-    var cacheBabelInterop = new WeakMap();
-    var cacheNodeInterop = new WeakMap();
-    return (_getRequireWildcardCache = function (nodeInterop) {
-      return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
-    })(nodeInterop);
-  }
-
-  function _interopRequireWildcard(obj, nodeInterop) {
-    if (!nodeInterop && obj && obj.__esModule) {
-      return obj;
-    }
-
-    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
-      return {
-        default: obj
-      };
-    }
-
-    var cache = _getRequireWildcardCache(nodeInterop);
-
-    if (cache && cache.has(obj)) {
-      return cache.get(obj);
-    }
-
-    var newObj = {};
-    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
-
-    for (var key in obj) {
-      if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
-        var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
-
-        if (desc && (desc.get || desc.set)) {
-          Object.defineProperty(newObj, key, desc);
-        } else {
-          newObj[key] = obj[key];
-        }
-      }
-    }
-
-    newObj.default = obj;
-
-    if (cache) {
-      cache.set(obj, newObj);
-    }
-
-    return newObj;
-  }
-
-  function _interopRequireDefault(obj) {
-    return obj && obj.__esModule ? obj : {
-      default: obj
-    };
-  }
-
-  const QuickSearchField = (0, _styledComponents2.default)(_SearchField.StyledSearchField)`
-  ${props => props.margin ? `margin: ${props.margin};` : ''}
-  -webkit-transition: box-shadow 0.2s ease-in-out, width 0.2s ease-in-out;
-  transition: box-shadow 0.2s ease-in-out, width 0.2s ease-in-out;
-
-  background-color: transparent;
-  &.small {
-    width: 48px;
-  }
-
-  &.medium {
-    width: 56px;
-  }
-  
-  &.expanded{
-    width: 100%;
-    background-color: ${_.COLORS.white};
-  }
-
-  input {
-    ::placeholder {
-      font-style: italic;
-      color: ${_.COLORS.neutral_600};
-    }
-  }
-
-  box-shadow: ${props => props.expanded ? `inset 0px 0px 0px 2px ${_.COLORS.primary_800}` : 'none !important'};
-
-  &:hover {
-    box-shadow: ${props => props.expanded ? `inset 0px 0px 0px 2px ${_.COLORS.primary_700}` : 'none !important'};
-  }
-`;
-
-  const QuickSearch = ({
-    id,
-    searchTerm,
-    setSearchTerm,
-    enterSearch,
-    removeSearch,
-    placeholder,
-    performSearchLabel,
-    disabled,
-    onKeyDown,
-    size,
-    margin,
-    loading
-  }) => {
-    const searchFieldRef = React.useRef(null);
-    const searchFieldInputRef = React.useRef(null);
-    const [searchFieldVisible, setSearchFieldVisible] = React.useState(false);
-    const [tabbedHere, setTabbedHere] = React.useState(false);
-
-    const handleClickOutside = e => {
-      if (searchFieldRef?.current && !searchFieldRef.current.contains(e.target)) {
-        if (searchFieldVisible && !searchTerm?.length) {
-          setSearchFieldVisible(false);
-        }
-      }
-    };
-
-    React.useEffect(() => {
-      if (searchTerm?.length) {
-        setSearchFieldVisible(true);
-      }
-    }, [searchTerm]);
-    React.useEffect(() => {
-      document.addEventListener('click', handleClickOutside);
-      return () => {
-        document.removeEventListener('click', handleClickOutside);
-      };
-    });
-    React.useEffect(() => {
-      if (searchFieldVisible) {
-        searchFieldInputRef?.current?.focus();
-      }
-    }, [searchFieldVisible, searchFieldInputRef, id]);
-
-    const handleKeyDown = e => {
-      if (onKeyDown) {
-        onKeyDown(e);
-      }
-
-      if (e.key === 'Escape') {
-        if (searchFieldVisible && !searchTerm?.length) {
-          setSearchFieldVisible(false);
-        }
-      }
-    };
-
-    return /*#__PURE__*/React.createElement(QuickSearchField, {
-      ref: searchFieldRef,
-      expanded: searchFieldVisible,
-      id: `${id}_main`,
-      onBlur: event => {
-        if (event.relatedTarget && searchFieldRef?.current && !searchFieldRef.current.contains(event.relatedTarget) && !searchTerm) {
-          setSearchFieldVisible(false);
-        }
-      },
-      "data-testid": `${id}_main`,
-      className: (searchTerm !== '' ? 'searchactive ' : '').concat(size ? size : '').concat(searchFieldVisible ? ' expanded' : ''),
-      tabbedHere: tabbedHere,
-      tabIndex: -1,
-      margin: margin
-    }, searchFieldVisible && /*#__PURE__*/React.createElement(_SearchBarInput2.default, {
-      placeholder: disabled ? '' : placeholder,
-      id: id,
-      ref: searchFieldInputRef,
-      disabled: disabled,
-      onKeyDown: handleKeyDown,
-      size: size,
-      setTabbedHere: setTabbedHere,
-      setSearchTerm: term => setSearchTerm(term),
-      searchTerm: searchTerm,
-      enterSearch: enterSearch
-    }), /*#__PURE__*/React.createElement(_styling.SearchIconWrapper, {
-      className: size ? size : '',
-      role: "button",
-      "aria-label": performSearchLabel,
-      tabIndex: -1
-    }, /*#__PURE__*/React.createElement(_Iconbutton2.default, {
-      id: `${id}_Searchbutton`,
-      variant: "secondary",
-      shape: "circular",
-      tabIndex: searchFieldVisible ? -1 : 0,
-      action: e => searchFieldVisible ? enterSearch(e) : setSearchFieldVisible(searchFieldVisible ? false : true)
-    }, /*#__PURE__*/React.createElement(_SystemIcons.Search, {
-      size: "24px",
-      color: disabled ? _.COLORS.neutral_300 : _.COLORS.neutral_600
-    }))), /*#__PURE__*/React.createElement(_styling.StyledIcon, {
-      className: size ? size : '',
-      role: "button",
-      tabIndex: -1,
-      hidden: searchTerm === '' || searchTerm === undefined || !searchFieldVisible
-    }, /*#__PURE__*/React.createElement(_Iconbutton2.default, {
-      id: `${id}_Clearicon`,
-      variant: "secondary",
-      shape: "circular",
-      action: e => {
-        removeSearch(e);
-        searchFieldInputRef?.current?.focus();
-      }
-    }, /*#__PURE__*/React.createElement(_SystemIcons.Clear, {
-      size: "24px",
-      color: disabled ? _.COLORS.neutral_300 : _.COLORS.neutral_600
-    }))), loading && searchFieldVisible && /*#__PURE__*/React.createElement(_styling.StyledIcon, {
-      className: size ? size : '',
-      tabIndex: -1
-    }, /*#__PURE__*/React.createElement(_.LoadingIndicator, {
-      size: _types.Size.Small,
-      color: _.COLORS.neutral_600
-    })));
-  };
-
-  QuickSearch.propTypes = {
-    id: _propTypes2.default.string.isRequired,
-    searchTerm: _propTypes2.default.string,
-    setSearchTerm: _propTypes2.default.func.isRequired,
-    enterSearch: _propTypes2.default.func.isRequired,
-    removeSearch: _propTypes2.default.func.isRequired,
-    placeholder: _propTypes2.default.string,
-    performSearchLabel: _propTypes2.default.string,
-    disabled: _propTypes2.default.bool,
-    onKeyDown: _propTypes2.default.func,
-    margin: _propTypes2.default.string,
-    loading: _propTypes2.default.bool
-  };
-  exports.default = QuickSearch;
-});
-//# sourceMappingURL=QuickSearch.js.map

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

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

package/dist/umd/InputFields/RadioButton.js

@@ -1,262 +0,0 @@
-(function (global, factory) {
-  if (typeof define === "function" && define.amd) {
-    define(["exports", "prop-types", "react", "styled-components", "../icons/systemicons/SystemIcons", "../styles", "../types", "../styles/typography"], factory);
-  } else if (typeof exports !== "undefined") {
-    factory(exports, require("prop-types"), require("react"), require("styled-components"), require("../icons/systemicons/SystemIcons"), require("../styles"), require("../types"), require("../styles/typography"));
-  } else {
-    var mod = {
-      exports: {}
-    };
-    factory(mod.exports, global.propTypes, global.react, global.styledComponents, global.SystemIcons, global.styles, global.types, global.typography);
-    global.undefined = mod.exports;
-  }
-})(this, function (exports, _propTypes, _react, _styledComponents, _SystemIcons, _styles, _types, _typography) {
-  "use strict";
-
-  Object.defineProperty(exports, "__esModule", {
-    value: true
-  });
-
-  var _propTypes2 = _interopRequireDefault(_propTypes);
-
-  var React = _interopRequireWildcard(_react);
-
-  var _styledComponents2 = _interopRequireDefault(_styledComponents);
-
-  function _getRequireWildcardCache(nodeInterop) {
-    if (typeof WeakMap !== "function") return null;
-    var cacheBabelInterop = new WeakMap();
-    var cacheNodeInterop = new WeakMap();
-    return (_getRequireWildcardCache = function (nodeInterop) {
-      return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
-    })(nodeInterop);
-  }
-
-  function _interopRequireWildcard(obj, nodeInterop) {
-    if (!nodeInterop && obj && obj.__esModule) {
-      return obj;
-    }
-
-    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
-      return {
-        default: obj
-      };
-    }
-
-    var cache = _getRequireWildcardCache(nodeInterop);
-
-    if (cache && cache.has(obj)) {
-      return cache.get(obj);
-    }
-
-    var newObj = {};
-    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
-
-    for (var key in obj) {
-      if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
-        var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
-
-        if (desc && (desc.get || desc.set)) {
-          Object.defineProperty(newObj, key, desc);
-        } else {
-          newObj[key] = obj[key];
-        }
-      }
-    }
-
-    newObj.default = obj;
-
-    if (cache) {
-      cache.set(obj, newObj);
-    }
-
-    return newObj;
-  }
-
-  function _interopRequireDefault(obj) {
-    return obj && obj.__esModule ? obj : {
-      default: obj
-    };
-  }
-
-  const StyledRadioButton = _styledComponents2.default.div`
-  display: flex;
-  width: 100%;
-  min-height: 48px;
-  min-width: 48px;
-
-  ${props => props.margin ? `margin: ${props.margin};` : ''}
-  cursor: pointer;
- 
-  color: ${_styles.COLORS.black};
-
-  .pointerTransparent {
-    pointer-events: none;
-  }
-
-  .radio-button-icon {
-    margin: 6px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    box-sizing: border-box;
-    height: 36px;
-    min-width: 36px;
-    border-radius: 50%;
-
-    svg {
-      color: ${props => props.selected ? _styles.COLORS.primary_500 : props.showWarning ? _styles.COLORS.warning_400 : _styles.COLORS.neutral_600};
-    }
-  }
-
-  .radio-button-label {
-    user-select: none;
-    display: flex;
-    flex-direction: column;
-
-    label{
-      cursor: inherit;
-    }
-
-    span {
-      ${(0, _typography.ComponentXXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.black)}
-    }
-  }
-
-  &.small {
-    ${(0, _typography.ComponentSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.black)}
-    .radio-button-label {
-      padding-top: 14px;
-    }
-  }
-
-  &.medium {
-    ${(0, _typography.ComponentMStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.black)}
-    .radio-button-label {
-      padding-top: 12px;
-    }
-  }
-
-  &.large {
-    ${(0, _typography.ComponentLStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.black)}
-    .radio-button-label {
-      padding-top: 12px;
-    }
-  }
-
-  &:not(.disabled):focus {
-    outline: none;
-
-    .radio-button-icon {
-      background-color: ${_styles.COLORS.white};
-      box-shadow: 0 0 8px ${_styles.COLORS.primary_500}, 0px 4px 12px rgba(46, 127, 161, 0.25);
-
-      svg {
-        color: ${_styles.COLORS.neutral_600};
-      }
-    }
-  }
-
-  &:not(.disabled):hover {
-    .radio-button-icon {
-      background-color: ${_styles.COLORS.primary_20};
-
-      svg {
-        color: ${_styles.COLORS.primary_700};
-      }
-    }
-  }
-
-  &:not(.disabled):active {
-    .radio-button-icon {
-      background: ${_styles.COLORS.primary_100};
-      box-shadow: none;
-
-      svg {
-        color: ${_styles.COLORS.primary_800};
-      }
-    }
-  }
-
-  &.disabled {
-    box-shadow: none;
-    cursor: not-allowed;
-
-    color: ${_styles.COLORS.neutral_300};
-
-    .radio-button-icon,
-    .radio-button-label {
-      pointer-events: none;
-    }
-
-    .radio-button-icon{
-      background-color: ${_styles.COLORS.white};
-    }
-    
-    .radio-button-icon svg {
-      color: ${_styles.COLORS.neutral_300};
-    }
-  }
-`;
-  const RadioButton = /*#__PURE__*/React.forwardRef(({
-    id,
-    selected,
-    label,
-    additionalLabel,
-    showWarning,
-    select,
-    disabled,
-    margin,
-    iconPointerEventsTransparent,
-    size,
-    tabIndexVal
-  }, ref) => {
-    const onKeyPress = e => {
-      if (e.keyCode === 13 && !disabled) {
-        select(!selected);
-      }
-    };
-
-    size = size ?? _types.Size.Medium;
-    return /*#__PURE__*/React.createElement(StyledRadioButton, {
-      key: id,
-      margin: margin,
-      ref: ref,
-      onClick: () => !disabled && select(!selected),
-      onMouseDown: e => e.preventDefault(),
-      onKeyDown: onKeyPress,
-      disabled: disabled,
-      className: size.toString().toLowerCase().concat(disabled ? ' disabled' : ''),
-      tabIndex: disabled ? -1 : tabIndexVal ? tabIndexVal : 0,
-      showWarning: showWarning,
-      selected: selected
-    }, /*#__PURE__*/React.createElement("div", {
-      className: 'radio-button-icon',
-      id: id
-    }, selected && /*#__PURE__*/React.createElement(_SystemIcons.RadioButtonOn, {
-      className: iconPointerEventsTransparent ? "pointerTransparent" : "",
-      size: "24px"
-    }), !selected && /*#__PURE__*/React.createElement(_SystemIcons.RadioButtonOff, {
-      className: iconPointerEventsTransparent ? "pointerTransparent" : "",
-      size: "24px"
-    })), /*#__PURE__*/React.createElement("div", {
-      className: 'radio-button-label'
-    }, label && /*#__PURE__*/React.createElement("label", {
-      htmlFor: id
-    }, label), additionalLabel !== undefined && /*#__PURE__*/React.createElement("span", null, additionalLabel)));
-  });
-  RadioButton.propTypes = {
-    id: _propTypes2.default.string.isRequired,
-    selected: _propTypes2.default.bool.isRequired,
-    select: _propTypes2.default.func.isRequired,
-    label: _propTypes2.default.string,
-    additionalLabel: _propTypes2.default.string,
-    showWarning: _propTypes2.default.bool,
-    disabled: _propTypes2.default.bool,
-    iconPointerEventsTransparent: _propTypes2.default.bool,
-    margin: _propTypes2.default.string,
-    tabIndexVal: _propTypes2.default.number
-  };
-  exports.default = RadioButton;
-});
-//# sourceMappingURL=RadioButton.js.map

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

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/InputFields/RadioButton.tsx"],"names":["StyledRadioButton","styled","div","props","margin","COLORS","black","neutral_600","ComponentXXSStyling","ComponentTextStyle","ComponentSStyling","ComponentMStyling","ComponentLStyling","white","primary_500","primary_20","primary_700","primary_100","primary_800","neutral_300","id","selected","select","label","additionalLabel","showWarning","disabled","iconPointerEventsTransparent","tabIndexVal","RadioButton","onKeyPress","e","size","Size"],"mappings":"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","sourcesContent":["import * as React from 'react';\r\nimport styled, {css} from 'styled-components';\r\nimport {RadioButtonOff, RadioButtonOn} from '../icons/systemicons/SystemIcons';\r\nimport {COLORS, ComponentTextStyle} from '../styles';\r\nimport { Size } from '../types';\r\nimport {ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentXXSStyling} from '../styles/typography';\r\n\r\nconst StyledRadioButton = styled.div<{ margin?: string, disabled?: boolean, showWarning?: boolean, selected?: boolean }>`\r\n  display: flex;\r\n  width: 100%;\r\n  min-height: 48px;\r\n  min-width: 48px;\r\n\r\n  ${props => (props.margin ? `margin: ${props.margin};` : '')}\r\n  cursor: pointer;\r\n \r\n  color: ${COLORS.black};\r\n\r\n  .pointerTransparent {\r\n    pointer-events: none;\r\n  }\r\n\r\n  .radio-button-icon {\r\n    margin: 6px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    box-sizing: border-box;\r\n    height: 36px;\r\n    min-width: 36px;\r\n    border-radius: 50%;\r\n\r\n    svg {\r\n      color: ${props => (props.selected ? COLORS.primary_500 : props.showWarning ? COLORS.warning_400 : COLORS.neutral_600)};\r\n    }\r\n  }\r\n\r\n  .radio-button-label {\r\n    user-select: none;\r\n    display: flex;\r\n    flex-direction: column;\r\n\r\n    label{\r\n      cursor: inherit;\r\n    }\r\n\r\n    span {\r\n      ${ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n    }\r\n  }\r\n\r\n  &.small {\r\n    ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n    .radio-button-label {\r\n      padding-top: 14px;\r\n    }\r\n  }\r\n\r\n  &.medium {\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n    .radio-button-label {\r\n      padding-top: 12px;\r\n    }\r\n  }\r\n\r\n  &.large {\r\n    ${ComponentLStyling(ComponentTextStyle.Regular, COLORS.black)}\r\n    .radio-button-label {\r\n      padding-top: 12px;\r\n    }\r\n  }\r\n\r\n  &:not(.disabled):focus {\r\n    outline: none;\r\n\r\n    .radio-button-icon {\r\n      background-color: ${COLORS.white};\r\n      box-shadow: 0 0 8px ${COLORS.primary_500}, 0px 4px 12px rgba(46, 127, 161, 0.25);\r\n\r\n      svg {\r\n        color: ${COLORS.neutral_600};\r\n      }\r\n    }\r\n  }\r\n\r\n  &:not(.disabled):hover {\r\n    .radio-button-icon {\r\n      background-color: ${COLORS.primary_20};\r\n\r\n      svg {\r\n        color: ${COLORS.primary_700};\r\n      }\r\n    }\r\n  }\r\n\r\n  &:not(.disabled):active {\r\n    .radio-button-icon {\r\n      background: ${COLORS.primary_100};\r\n      box-shadow: none;\r\n\r\n      svg {\r\n        color: ${COLORS.primary_800};\r\n      }\r\n    }\r\n  }\r\n\r\n  &.disabled {\r\n    box-shadow: none;\r\n    cursor: not-allowed;\r\n\r\n    color: ${COLORS.neutral_300};\r\n\r\n    .radio-button-icon,\r\n    .radio-button-label {\r\n      pointer-events: none;\r\n    }\r\n\r\n    .radio-button-icon{\r\n      background-color: ${COLORS.white};\r\n    }\r\n    \r\n    .radio-button-icon svg {\r\n      color: ${COLORS.neutral_300};\r\n    }\r\n  }\r\n`;\r\n\r\ninterface Props {\r\n  id: string;\r\n  selected: boolean;\r\n  select: (selected: boolean) => void;\r\n  label?: string;\r\n  additionalLabel?: string;\r\n  showWarning?: boolean;\r\n  disabled?: boolean;\r\n  iconPointerEventsTransparent?: boolean;\r\n  margin?: string;\r\n  size?: Size;\r\n  tabIndexVal?: number;\r\n}\r\n\r\nconst RadioButton = React.forwardRef<HTMLDivElement, Props>(({\r\n  id,\r\n  selected,\r\n  label,\r\n  additionalLabel,\r\n  showWarning,\r\n  select,\r\n  disabled,\r\n  margin,\r\n  iconPointerEventsTransparent,\r\n  size,\r\n  tabIndexVal\r\n}: Props, ref) => {\r\n  const onKeyPress = (e: any) => {\r\n    if (e.keyCode === 13 && !disabled) {\r\n      select(!selected);\r\n    }\r\n  };\r\n\r\n  size = size ?? Size.Medium;\r\n\r\n  return (\r\n    <StyledRadioButton key={id} margin={margin}\r\n                       ref={ref}\r\n                       onClick={() => !disabled && select(!selected)}\r\n                       onMouseDown={e => e.preventDefault()}\r\n                       onKeyDown={onKeyPress}\r\n                       disabled={disabled}\r\n                       className={size.toString().toLowerCase().concat(disabled ? ' disabled' : '')}\r\n                       tabIndex={disabled ? -1 : (tabIndexVal ? tabIndexVal : 0)}\r\n                       showWarning={showWarning}\r\n                       selected={selected}>\r\n      <div className={'radio-button-icon'} id={id}>\r\n        { selected && <RadioButtonOn className={iconPointerEventsTransparent ? \"pointerTransparent\" : \"\"} size=\"24px\"/>}\r\n        { !selected && <RadioButtonOff className={iconPointerEventsTransparent ? \"pointerTransparent\" : \"\"} size=\"24px\"/>}\r\n      </div>\r\n      <div className={'radio-button-label'}>\r\n        {label && <label htmlFor={id}>{label}</label>}\r\n        {additionalLabel !== undefined && <span>{additionalLabel}</span>}\r\n      </div>\r\n    </StyledRadioButton>\r\n  );\r\n});\r\n\r\nexport default RadioButton;\r\n"],"file":"RadioButton.js"}

package/dist/umd/InputFields/ResponsiveComponentWrapper.js

@@ -1,113 +0,0 @@
-(function (global, factory) {
-  if (typeof define === "function" && define.amd) {
-    define(["exports", "prop-types", "react", "../types", "../styles"], factory);
-  } else if (typeof exports !== "undefined") {
-    factory(exports, require("prop-types"), require("react"), require("../types"), require("../styles"));
-  } else {
-    var mod = {
-      exports: {}
-    };
-    factory(mod.exports, global.propTypes, global.react, global.types, global.styles);
-    global.undefined = mod.exports;
-  }
-})(this, function (exports, _propTypes, _react, _types, _styles) {
-  "use strict";
-
-  Object.defineProperty(exports, "__esModule", {
-    value: true
-  });
-
-  var _propTypes2 = _interopRequireDefault(_propTypes);
-
-  var React = _interopRequireWildcard(_react);
-
-  function _getRequireWildcardCache(nodeInterop) {
-    if (typeof WeakMap !== "function") return null;
-    var cacheBabelInterop = new WeakMap();
-    var cacheNodeInterop = new WeakMap();
-    return (_getRequireWildcardCache = function (nodeInterop) {
-      return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
-    })(nodeInterop);
-  }
-
-  function _interopRequireWildcard(obj, nodeInterop) {
-    if (!nodeInterop && obj && obj.__esModule) {
-      return obj;
-    }
-
-    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
-      return {
-        default: obj
-      };
-    }
-
-    var cache = _getRequireWildcardCache(nodeInterop);
-
-    if (cache && cache.has(obj)) {
-      return cache.get(obj);
-    }
-
-    var newObj = {};
-    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
-
-    for (var key in obj) {
-      if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
-        var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
-
-        if (desc && (desc.get || desc.set)) {
-          Object.defineProperty(newObj, key, desc);
-        } else {
-          newObj[key] = obj[key];
-        }
-      }
-    }
-
-    newObj.default = obj;
-
-    if (cache) {
-      cache.set(obj, newObj);
-    }
-
-    return newObj;
-  }
-
-  function _interopRequireDefault(obj) {
-    return obj && obj.__esModule ? obj : {
-      default: obj
-    };
-  }
-
-  /**
-   * Import React libraries.
-   */
-
-  /**
-   * Import custom styles.
-   */
-  // Add component-specific types
-  const ReponsiveComponentWrapper = ({
-    children,
-    size
-  }) => {
-    // Globally used variables within the component
-    const [isMediumView, setIsMediumView] = React.useState(false);
-    React.useEffect(() => {
-      const handleResize = () => {
-        const mql = window.matchMedia(`${_styles.BREAKPOINTS.MEDIUM.replace('@media ', '')}`);
-        setIsMediumView(mql.matches);
-      };
-
-      window.addEventListener('resize', handleResize);
-      return function cleanup() {
-        window.removeEventListener('resize', handleResize);
-      };
-    });
-    return size && size === _types.Size.Medium ? /*#__PURE__*/React.createElement(_styles.ComponentXS, null, children) : size && size === _types.Size.Small ? /*#__PURE__*/React.createElement(_styles.ComponentXXS, null, children) : isMediumView ? /*#__PURE__*/React.createElement(_styles.ComponentXS, null, children) : /*#__PURE__*/React.createElement(_styles.ComponentXXS, null, children);
-  };
-
-  ReponsiveComponentWrapper.propTypes = {
-    children: _propTypes2.default.any
-  };
-  exports.default = ReponsiveComponentWrapper;
-});
-//# sourceMappingURL=ResponsiveComponentWrapper.js.map

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

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