@laerdal/life-react-components 2.0.1-dev.9 → 2.1.0-dev.3

package/dist/Modals/ModalStyles.cjs

@@ -1,37 +1,25 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getNoteMessageColor = exports.getBackgroundColor = exports.StyledModalHeader = exports.ModalTitleSection = exports.ModalTitle = exports.ModalNoteSection = exports.ModalHoverModifier = exports.ModalHeaderActionsWithImage = exports.ModalHeaderActions = exports.ModalHeader = exports.ModalFooter = exports.ModalBody = exports.ImageOverlay = exports.ImageContainer = exports.FlexContainer = exports.Column = exports.CloseButtonWrapper = exports.BackButtonWrapper = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
-
 var _ = require("..");
-
 var _styles = require("../styles");
-
 var _types = require("../types");
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18;
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
-
 /**
  * Modal styles
  */
 var ModalHeader = _styledComponents.default.section(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: ", ";\n"])), function (props) {
   return props.marginBottom || '24px';
 });
-
 exports.ModalHeader = ModalHeader;
 var StyledModalHeader = (0, _styledComponents.default)(ModalHeader)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  flex: 1 0 calc(50% - 5px);\n  flex-direction: column;\n  flex-basis: auto;\n  text-align: left;\n  height: ", ";\n  img {\n    width: 100%;\n    height: ", ";\n    object-fit: cover;\n    border-radius: 8px 8px 0 0;\n  }\n"])), function (props) {
   return props.$height ? "".concat(props.$height - (props.size === 'small' ? 16 : props.size === 'large' ? 32 : 24), "px") : '';
@@ -39,63 +27,40 @@ var StyledModalHeader = (0, _styledComponents.default)(ModalHeader)(_templateObj
   return "".concat(props.$height, "px");
 });
 exports.StyledModalHeader = StyledModalHeader;
-
 var ImageContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ", ";\n\n  #imgWithFallbackLoadingIndicator {\n    position: absolute;\n    left: 50%;\n    top: 0;\n  }\n"])), function (props) {
   return "".concat(props.$height, "px");
 });
-
 exports.ImageContainer = ImageContainer;
-
 var ImageOverlay = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  position: absolute;\n  content: '';\n  top: 0;\n  left: 0;\n  height: ", ";\n  width: 100%;\n  background: rgba(255, 255, 255, 0.5);\n  border-radius: 8px 8px 0 0;\n\n  :after {\n    position: absolute;\n    height: ", ";\n    border-radius: 8px 8px 0 0;\n    content: '';\n    top: 0;\n    left: 0;\n    width: 100%;\n    background: #888888;\n    mix-blend-mode: saturation;\n  }\n"])), function (props) {
   return "".concat(props.$height, "px");
 }, function (props) {
   return "".concat(props.$height, "px");
 });
-
 exports.ImageOverlay = ImageOverlay;
-
 var Column = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: column;\n  justify-content: stretch;\n  height: 100%;\n"])));
-
 exports.Column = Column;
-
 var ModalTitleSection = _styledComponents.default.section(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  word-break: break-word;\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n"])));
-
 exports.ModalTitleSection = ModalTitleSection;
-
 var ModalHeaderActionsWithImage = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: ", ";\n  justify-content: space-between;\n  width: 100%;\n  z-index: 1;\n"])), function (props) {
   return !props.hasBackButton ? 'row-reverse' : 'row';
 });
-
 exports.ModalHeaderActionsWithImage = ModalHeaderActionsWithImage;
-
 var ModalHeaderActions = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  margin: -12px -12px 0 0;\n"])));
-
 exports.ModalHeaderActions = ModalHeaderActions;
-
 var FlexContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  width: 100%;\n"])));
-
 exports.FlexContainer = FlexContainer;
-
 var ModalHoverModifier = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n  button:hover {\n    cursor: help !important;\n  }\n"])));
-
 exports.ModalHoverModifier = ModalHoverModifier;
-
 var CloseButtonWrapper = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n  button {\n    ", "\n  }\n"])), function (props) {
   return props.hasImage ? (0, _styledComponents.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n            margin: -12px -12px 0 0 !important;\n          "]))) : (0, _styledComponents.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n            left: unset;\n          "])));
 });
-
 exports.CloseButtonWrapper = CloseButtonWrapper;
-
 var BackButtonWrapper = _styledComponents.default.div(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n  button {\n    margin: -12px 0 0 -12px !important;\n  }\n"])));
-
 exports.BackButtonWrapper = BackButtonWrapper;
-
 var ModalTitle = _styledComponents.default.h5(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2.default)(["\n  margin: 0;\n  font-size: ", ";\n  font-weight: bold;\n"])), function (props) {
   return props.fontSize || '1.25em';
 });
-
 exports.ModalTitle = ModalTitle;
-
 var ModalNoteSection = _styledComponents.default.section(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2.default)(["\n  background-color: ", ";\n  font-size: ", ";\n  margin-top: ", ";\n  margin-bottom: ", ";\n  display: flex;\n  flex-direction: row;\n  padding: ", ";\n  border-radius: 2px;\n\n  span {\n    display: block;\n    width: calc(100% - 32px);\n    margin-left: 8px;\n    color: ", ";\n  }\n"])), function (props) {
   return getBackgroundColor(props.state);
 }, function (props) {
@@ -109,12 +74,9 @@ var ModalNoteSection = _styledComponents.default.section(_templateObject16 || (_
 }, function (props) {
   return getNoteMessageColor(props.state);
 });
-
 exports.ModalNoteSection = ModalNoteSection;
-
 var ModalBody = _styledComponents.default.section(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2.default)(["\n  flex: 1 1 auto;\n  overflow: ", ";\n  margin: ", ";\n\n  border-top: ", ";\n  border-bottom: ", ";\n\n  ", "\n"])), function (props) {
   var _props$overflow;
-
   return (_props$overflow = props === null || props === void 0 ? void 0 : props.overflow) !== null && _props$overflow !== void 0 ? _props$overflow : 'unset';
 }, function (props) {
   return (props === null || props === void 0 ? void 0 : props.size) === 'small' ? "8px 0" : (props === null || props === void 0 ? void 0 : props.size) === 'large' ? '16px 0' : '12px 0';
@@ -123,9 +85,7 @@ var ModalBody = _styledComponents.default.section(_templateObject17 || (_templat
 }, function (props) {
   return props !== null && props !== void 0 && props.hasContentBorders ? "1px solid ".concat(_.COLORS.neutral_100) : 'none';
 }, (0, _styles.scrollBarStyling)(_types.Size.Small));
-
 exports.ModalBody = ModalBody;
-
 var ModalFooter = _styledComponents.default.section(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  justify-content: flex-end;\n\n  gap: ", ";\n\n  .footer-action {\n    order: -1;\n    margin-right: auto;\n    display: flex;\n    align-items: center;\n    font-size: ", ";\n    gap: ", ";\n  }\n\n  .footer-action.note {\n    color: ", ";\n  }\n"])), function (props) {
   return (props === null || props === void 0 ? void 0 : props.size) === 'large' ? "16px" : '8px';
 }, function (props) {
@@ -133,42 +93,31 @@ var ModalFooter = _styledComponents.default.section(_templateObject18 || (_templ
 }, function (props) {
   return (props === null || props === void 0 ? void 0 : props.size) === _types.Size.Large ? "8px" : (props === null || props === void 0 ? void 0 : props.size) === _types.Size.Small ? '4px' : '6px';
 }, _.COLORS.neutral_600);
-
 exports.ModalFooter = ModalFooter;
-
 var getBackgroundColor = function getBackgroundColor(state) {
   switch (state) {
     case 'positive':
       return _.COLORS.correct_100;
-
     case 'warning':
       return _.COLORS.warning_100;
-
     case 'critical':
       return _.COLORS.critical_100;
-
     default:
       return _.COLORS.primary_100;
   }
 };
-
 exports.getBackgroundColor = getBackgroundColor;
-
 var getNoteMessageColor = function getNoteMessageColor(state) {
   switch (state) {
     case 'positive':
       return _.COLORS.correct_700;
-
     case 'warning':
       return _.COLORS.warning_700;
-
     case 'critical':
       return _.COLORS.critical_700;
-
     default:
       return _.COLORS.primary_700;
   }
 };
-
 exports.getNoteMessageColor = getNoteMessageColor;
 //# sourceMappingURL=ModalStyles.cjs.map

package/dist/Modals/ModalStyles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ModalStyles.cjs","names":["ModalHeader","styled","section","props","marginBottom","StyledModalHeader","$height","size","ImageContainer","div","ImageOverlay","Column","ModalTitleSection","ModalHeaderActionsWithImage","hasBackButton","ModalHeaderActions","FlexContainer","ModalHoverModifier","CloseButtonWrapper","hasImage","css","BackButtonWrapper","ModalTitle","h5","fontSize","ModalNoteSection","getBackgroundColor","state","getNoteMessageColor","ModalBody","overflow","hasContentBorders","COLORS","neutral_100","scrollBarStyling","Size","Small","ModalFooter","Large","neutral_600","correct_100","warning_100","critical_100","primary_100","correct_700","warning_700","critical_700","primary_700"],"sources":["../../src/Modals/ModalStyles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { COLORS } from '..';\nimport { scrollBarStyling } from '../styles';\nimport { Size } from '../types';\n\n/**\n * Modal styles\n */\nexport const ModalHeader = styled.section<{ marginBottom?: string }>`\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: ${(props) => props.marginBottom || '24px'};\n`;\n\nexport const StyledModalHeader = styled(ModalHeader)<{ marginBottom?: string; size?: string; $height?: number }>`\n  flex: 1 0 calc(50% - 5px);\n  flex-direction: column;\n  flex-basis: auto;\n  text-align: left;\n  height: ${(props) => (props.$height ? `${props.$height - (props.size === 'small' ? 16 : props.size === 'large' ? 32 : 24)}px` : '')};\n  img {\n    width: 100%;\n    height: ${(props) => `${props.$height}px`};\n    object-fit: cover;\n    border-radius: 8px 8px 0 0;\n  }\n`;\n\nexport const ImageContainer = styled.div<{ $height: number }>`\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ${(props) => `${props.$height}px`};\n\n  #imgWithFallbackLoadingIndicator {\n    position: absolute;\n    left: 50%;\n    top: 0;\n  }\n`;\n\nexport const ImageOverlay = styled.div<{ $height: number }>`\n  position: absolute;\n  content: '';\n  top: 0;\n  left: 0;\n  height: ${(props) => `${props.$height}px`};\n  width: 100%;\n  background: rgba(255, 255, 255, 0.5);\n  border-radius: 8px 8px 0 0;\n\n  :after {\n    position: absolute;\n    height: ${(props) => `${props.$height}px`};\n    border-radius: 8px 8px 0 0;\n    content: '';\n    top: 0;\n    left: 0;\n    width: 100%;\n    background: #888888;\n    mix-blend-mode: saturation;\n  }\n`;\n\nexport const Column = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: stretch;\n  height: 100%;\n`;\n\nexport const ModalTitleSection = styled.section`\n  word-break: break-word;\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n`;\n\nexport const ModalHeaderActionsWithImage = styled.div<{ hasBackButton?: boolean }>`\n  display: flex;\n  flex-direction: ${(props) => (!props.hasBackButton ? 'row-reverse' : 'row')};\n  justify-content: space-between;\n  width: 100%;\n  z-index: 1;\n`;\n\nexport const ModalHeaderActions = styled.div`\n  display: flex;\n  margin: -12px -12px 0 0;\n`;\n\nexport const FlexContainer = styled.div`\n  display: flex;\n  width: 100%;\n`;\n\nexport const ModalHoverModifier = styled.div`\n  button:hover {\n    cursor: help !important;\n  }\n`;\n\nexport const CloseButtonWrapper = styled.div<{ size?: Size; hasImage?: boolean }>`\n  button {\n    ${(props) =>\n      props.hasImage\n        ? css`\n            margin: -12px -12px 0 0 !important;\n          `\n        : css`\n            left: unset;\n          `}\n  }\n`;\n\nexport const BackButtonWrapper = styled.div<{ size?: Size; hasImage?: boolean }>`\n  button {\n    margin: -12px 0 0 -12px !important;\n  }\n`;\n\nexport const ModalTitle = styled.h5<{ fontSize?: string }>`\n  margin: 0;\n  font-size: ${(props) => props.fontSize || '1.25em'};\n  font-weight: bold;\n`;\n\nexport const ModalNoteSection = styled.section<{ state: string; size?: string }>`\n  background-color: ${(props) => getBackgroundColor(props.state)};\n  font-size: ${(props) => (props?.size === 'small' ? `16px` : props?.size === 'large' ? '20px' : '18px')};\n  margin-top: ${(props) => (props?.size === 'small' ? `0px` : props?.size === 'large' ? '16px' : '4px')};\n  margin-bottom: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '24px' : '16px')};\n  display: flex;\n  flex-direction: row;\n  padding: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '16px' : '12px')};\n  border-radius: 2px;\n\n  span {\n    display: block;\n    width: calc(100% - 32px);\n    margin-left: 8px;\n    color: ${(props) => getNoteMessageColor(props.state)};\n  }\n`;\n\nexport const ModalBody = styled.section<{ size?: string; overflow?: string; hasContentBorders?: boolean }>`\n  flex: 1 1 auto;\n  overflow: ${(props) => props?.overflow ?? 'unset'};\n  margin: ${(props) => (props?.size === 'small' ? `8px 0` : props?.size === 'large' ? '16px 0' : '12px 0')};\n\n  border-top: ${(props) => (props?.hasContentBorders ? `1px solid ${COLORS.neutral_100}` : 'none')};\n  border-bottom: ${(props) => (props?.hasContentBorders ? `1px solid ${COLORS.neutral_100}` : 'none')};\n\n  ${scrollBarStyling(Size.Small)}\n`;\n\nexport const ModalFooter = styled.section<{ size?: Size }>`\n  display: flex;\n  justify-content: flex-end;\n\n  gap: ${(props) => (props?.size === 'large' ? `16px` : '8px')};\n\n  .footer-action {\n    order: -1;\n    margin-right: auto;\n    display: flex;\n    align-items: center;\n    font-size: ${(props) => (props?.size === 'small' ? `16px` : props?.size === 'large' ? '20px' : '18px')};\n    gap: ${(props) => (props?.size === Size.Large ? `8px` : props?.size === Size.Small ? '4px' : '6px')};\n  }\n\n  .footer-action.note {\n    color: ${COLORS.neutral_600};\n  }\n`;\n\nexport const getBackgroundColor = (state: string) => {\n  switch (state) {\n    case 'positive':\n      return COLORS.correct_100;\n    case 'warning':\n      return COLORS.warning_100;\n    case 'critical':\n      return COLORS.critical_100;\n    default:\n      return COLORS.primary_100;\n  }\n};\n\nexport const getNoteMessageColor = (state: string) => {\n  switch (state) {\n    case 'positive':\n      return COLORS.correct_700;\n    case 'warning':\n      return COLORS.warning_700;\n    case 'critical':\n      return COLORS.critical_700;\n    default:\n      return COLORS.primary_700;\n  }\n};\n"],"mappings":"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"}
+{"version":3,"file":"ModalStyles.cjs","names":["ModalHeader","styled","section","props","marginBottom","StyledModalHeader","$height","size","ImageContainer","div","ImageOverlay","Column","ModalTitleSection","ModalHeaderActionsWithImage","hasBackButton","ModalHeaderActions","FlexContainer","ModalHoverModifier","CloseButtonWrapper","hasImage","css","BackButtonWrapper","ModalTitle","h5","fontSize","ModalNoteSection","getBackgroundColor","state","getNoteMessageColor","ModalBody","overflow","hasContentBorders","COLORS","neutral_100","scrollBarStyling","Size","Small","ModalFooter","Large","neutral_600","correct_100","warning_100","critical_100","primary_100","correct_700","warning_700","critical_700","primary_700"],"sources":["../../src/Modals/ModalStyles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { COLORS } from '..';\nimport { scrollBarStyling } from '../styles';\nimport { Size } from '../types';\n\n/**\n * Modal styles\n */\nexport const ModalHeader = styled.section<{ marginBottom?: string }>`\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: ${(props) => props.marginBottom || '24px'};\n`;\n\nexport const StyledModalHeader = styled(ModalHeader)<{ marginBottom?: string; size?: string; $height?: number }>`\n  flex: 1 0 calc(50% - 5px);\n  flex-direction: column;\n  flex-basis: auto;\n  text-align: left;\n  height: ${(props) => (props.$height ? `${props.$height - (props.size === 'small' ? 16 : props.size === 'large' ? 32 : 24)}px` : '')};\n  img {\n    width: 100%;\n    height: ${(props) => `${props.$height}px`};\n    object-fit: cover;\n    border-radius: 8px 8px 0 0;\n  }\n`;\n\nexport const ImageContainer = styled.div<{ $height: number }>`\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ${(props) => `${props.$height}px`};\n\n  #imgWithFallbackLoadingIndicator {\n    position: absolute;\n    left: 50%;\n    top: 0;\n  }\n`;\n\nexport const ImageOverlay = styled.div<{ $height: number }>`\n  position: absolute;\n  content: '';\n  top: 0;\n  left: 0;\n  height: ${(props) => `${props.$height}px`};\n  width: 100%;\n  background: rgba(255, 255, 255, 0.5);\n  border-radius: 8px 8px 0 0;\n\n  :after {\n    position: absolute;\n    height: ${(props) => `${props.$height}px`};\n    border-radius: 8px 8px 0 0;\n    content: '';\n    top: 0;\n    left: 0;\n    width: 100%;\n    background: #888888;\n    mix-blend-mode: saturation;\n  }\n`;\n\nexport const Column = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: stretch;\n  height: 100%;\n`;\n\nexport const ModalTitleSection = styled.section`\n  word-break: break-word;\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n`;\n\nexport const ModalHeaderActionsWithImage = styled.div<{ hasBackButton?: boolean }>`\n  display: flex;\n  flex-direction: ${(props) => (!props.hasBackButton ? 'row-reverse' : 'row')};\n  justify-content: space-between;\n  width: 100%;\n  z-index: 1;\n`;\n\nexport const ModalHeaderActions = styled.div`\n  display: flex;\n  margin: -12px -12px 0 0;\n`;\n\nexport const FlexContainer = styled.div`\n  display: flex;\n  width: 100%;\n`;\n\nexport const ModalHoverModifier = styled.div`\n  button:hover {\n    cursor: help !important;\n  }\n`;\n\nexport const CloseButtonWrapper = styled.div<{ size?: Size; hasImage?: boolean }>`\n  button {\n    ${(props) =>\n      props.hasImage\n        ? css`\n            margin: -12px -12px 0 0 !important;\n          `\n        : css`\n            left: unset;\n          `}\n  }\n`;\n\nexport const BackButtonWrapper = styled.div<{ size?: Size; hasImage?: boolean }>`\n  button {\n    margin: -12px 0 0 -12px !important;\n  }\n`;\n\nexport const ModalTitle = styled.h5<{ fontSize?: string }>`\n  margin: 0;\n  font-size: ${(props) => props.fontSize || '1.25em'};\n  font-weight: bold;\n`;\n\nexport const ModalNoteSection = styled.section<{ state: string; size?: string }>`\n  background-color: ${(props) => getBackgroundColor(props.state)};\n  font-size: ${(props) => (props?.size === 'small' ? `16px` : props?.size === 'large' ? '20px' : '18px')};\n  margin-top: ${(props) => (props?.size === 'small' ? `0px` : props?.size === 'large' ? '16px' : '4px')};\n  margin-bottom: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '24px' : '16px')};\n  display: flex;\n  flex-direction: row;\n  padding: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '16px' : '12px')};\n  border-radius: 2px;\n\n  span {\n    display: block;\n    width: calc(100% - 32px);\n    margin-left: 8px;\n    color: ${(props) => getNoteMessageColor(props.state)};\n  }\n`;\n\nexport const ModalBody = styled.section<{ size?: string; overflow?: string; hasContentBorders?: boolean }>`\n  flex: 1 1 auto;\n  overflow: ${(props) => props?.overflow ?? 'unset'};\n  margin: ${(props) => (props?.size === 'small' ? `8px 0` : props?.size === 'large' ? '16px 0' : '12px 0')};\n\n  border-top: ${(props) => (props?.hasContentBorders ? `1px solid ${COLORS.neutral_100}` : 'none')};\n  border-bottom: ${(props) => (props?.hasContentBorders ? `1px solid ${COLORS.neutral_100}` : 'none')};\n\n  ${scrollBarStyling(Size.Small)}\n`;\n\nexport const ModalFooter = styled.section<{ size?: Size }>`\n  display: flex;\n  justify-content: flex-end;\n\n  gap: ${(props) => (props?.size === 'large' ? `16px` : '8px')};\n\n  .footer-action {\n    order: -1;\n    margin-right: auto;\n    display: flex;\n    align-items: center;\n    font-size: ${(props) => (props?.size === 'small' ? `16px` : props?.size === 'large' ? '20px' : '18px')};\n    gap: ${(props) => (props?.size === Size.Large ? `8px` : props?.size === Size.Small ? '4px' : '6px')};\n  }\n\n  .footer-action.note {\n    color: ${COLORS.neutral_600};\n  }\n`;\n\nexport const getBackgroundColor = (state: string) => {\n  switch (state) {\n    case 'positive':\n      return COLORS.correct_100;\n    case 'warning':\n      return COLORS.warning_100;\n    case 'critical':\n      return COLORS.critical_100;\n    default:\n      return COLORS.primary_100;\n  }\n};\n\nexport const getNoteMessageColor = (state: string) => {\n  switch (state) {\n    case 'positive':\n      return COLORS.correct_700;\n    case 'warning':\n      return COLORS.warning_700;\n    case 'critical':\n      return COLORS.critical_700;\n    default:\n      return COLORS.primary_700;\n  }\n};\n"],"mappings":"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"}

package/dist/Modals/ModalStyles.js

@@ -1,15 +1,13 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18;
-
 import styled, { css } from 'styled-components';
 import { COLORS } from '..';
 import { scrollBarStyling } from '../styles';
 import { Size } from '../types';
+
 /**
  * Modal styles
  */
-
 export var ModalHeader = styled.section(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: ", ";\n"])), function (props) {
   return props.marginBottom || '24px';
 });
@@ -56,7 +54,6 @@ export var ModalNoteSection = styled.section(_templateObject16 || (_templateObje
 });
 export var ModalBody = styled.section(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n  flex: 1 1 auto;\n  overflow: ", ";\n  margin: ", ";\n\n  border-top: ", ";\n  border-bottom: ", ";\n\n  ", "\n"])), function (props) {
   var _props$overflow;
-
   return (_props$overflow = props === null || props === void 0 ? void 0 : props.overflow) !== null && _props$overflow !== void 0 ? _props$overflow : 'unset';
 }, function (props) {
   return (props === null || props === void 0 ? void 0 : props.size) === 'small' ? "8px 0" : (props === null || props === void 0 ? void 0 : props.size) === 'large' ? '16px 0' : '12px 0';
@@ -76,13 +73,10 @@ export var getBackgroundColor = function getBackgroundColor(state) {
   switch (state) {
     case 'positive':
       return COLORS.correct_100;
-
     case 'warning':
       return COLORS.warning_100;
-
     case 'critical':
       return COLORS.critical_100;
-
     default:
       return COLORS.primary_100;
   }
@@ -91,13 +85,10 @@ export var getNoteMessageColor = function getNoteMessageColor(state) {
   switch (state) {
     case 'positive':
       return COLORS.correct_700;
-
     case 'warning':
       return COLORS.warning_700;
-
     case 'critical':
       return COLORS.critical_700;
-
     default:
       return COLORS.primary_700;
   }

package/dist/Modals/ModalStyles.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalStyles.js","names":["styled","css","COLORS","scrollBarStyling","Size","ModalHeader","section","props","marginBottom","StyledModalHeader","$height","size","ImageContainer","div","ImageOverlay","Column","ModalTitleSection","ModalHeaderActionsWithImage","hasBackButton","ModalHeaderActions","FlexContainer","ModalHoverModifier","CloseButtonWrapper","hasImage","BackButtonWrapper","ModalTitle","h5","fontSize","ModalNoteSection","getBackgroundColor","state","getNoteMessageColor","ModalBody","overflow","hasContentBorders","neutral_100","Small","ModalFooter","Large","neutral_600","correct_100","warning_100","critical_100","primary_100","correct_700","warning_700","critical_700","primary_700"],"sources":["../../src/Modals/ModalStyles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { COLORS } from '..';\nimport { scrollBarStyling } from '../styles';\nimport { Size } from '../types';\n\n/**\n * Modal styles\n */\nexport const ModalHeader = styled.section<{ marginBottom?: string }>`\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: ${(props) => props.marginBottom || '24px'};\n`;\n\nexport const StyledModalHeader = styled(ModalHeader)<{ marginBottom?: string; size?: string; $height?: number }>`\n  flex: 1 0 calc(50% - 5px);\n  flex-direction: column;\n  flex-basis: auto;\n  text-align: left;\n  height: ${(props) => (props.$height ? `${props.$height - (props.size === 'small' ? 16 : props.size === 'large' ? 32 : 24)}px` : '')};\n  img {\n    width: 100%;\n    height: ${(props) => `${props.$height}px`};\n    object-fit: cover;\n    border-radius: 8px 8px 0 0;\n  }\n`;\n\nexport const ImageContainer = styled.div<{ $height: number }>`\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ${(props) => `${props.$height}px`};\n\n  #imgWithFallbackLoadingIndicator {\n    position: absolute;\n    left: 50%;\n    top: 0;\n  }\n`;\n\nexport const ImageOverlay = styled.div<{ $height: number }>`\n  position: absolute;\n  content: '';\n  top: 0;\n  left: 0;\n  height: ${(props) => `${props.$height}px`};\n  width: 100%;\n  background: rgba(255, 255, 255, 0.5);\n  border-radius: 8px 8px 0 0;\n\n  :after {\n    position: absolute;\n    height: ${(props) => `${props.$height}px`};\n    border-radius: 8px 8px 0 0;\n    content: '';\n    top: 0;\n    left: 0;\n    width: 100%;\n    background: #888888;\n    mix-blend-mode: saturation;\n  }\n`;\n\nexport const Column = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: stretch;\n  height: 100%;\n`;\n\nexport const ModalTitleSection = styled.section`\n  word-break: break-word;\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n`;\n\nexport const ModalHeaderActionsWithImage = styled.div<{ hasBackButton?: boolean }>`\n  display: flex;\n  flex-direction: ${(props) => (!props.hasBackButton ? 'row-reverse' : 'row')};\n  justify-content: space-between;\n  width: 100%;\n  z-index: 1;\n`;\n\nexport const ModalHeaderActions = styled.div`\n  display: flex;\n  margin: -12px -12px 0 0;\n`;\n\nexport const FlexContainer = styled.div`\n  display: flex;\n  width: 100%;\n`;\n\nexport const ModalHoverModifier = styled.div`\n  button:hover {\n    cursor: help !important;\n  }\n`;\n\nexport const CloseButtonWrapper = styled.div<{ size?: Size; hasImage?: boolean }>`\n  button {\n    ${(props) =>\n      props.hasImage\n        ? css`\n            margin: -12px -12px 0 0 !important;\n          `\n        : css`\n            left: unset;\n          `}\n  }\n`;\n\nexport const BackButtonWrapper = styled.div<{ size?: Size; hasImage?: boolean }>`\n  button {\n    margin: -12px 0 0 -12px !important;\n  }\n`;\n\nexport const ModalTitle = styled.h5<{ fontSize?: string }>`\n  margin: 0;\n  font-size: ${(props) => props.fontSize || '1.25em'};\n  font-weight: bold;\n`;\n\nexport const ModalNoteSection = styled.section<{ state: string; size?: string }>`\n  background-color: ${(props) => getBackgroundColor(props.state)};\n  font-size: ${(props) => (props?.size === 'small' ? `16px` : props?.size === 'large' ? '20px' : '18px')};\n  margin-top: ${(props) => (props?.size === 'small' ? `0px` : props?.size === 'large' ? '16px' : '4px')};\n  margin-bottom: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '24px' : '16px')};\n  display: flex;\n  flex-direction: row;\n  padding: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '16px' : '12px')};\n  border-radius: 2px;\n\n  span {\n    display: block;\n    width: calc(100% - 32px);\n    margin-left: 8px;\n    color: ${(props) => getNoteMessageColor(props.state)};\n  }\n`;\n\nexport const ModalBody = styled.section<{ size?: string; overflow?: string; hasContentBorders?: boolean }>`\n  flex: 1 1 auto;\n  overflow: ${(props) => props?.overflow ?? 'unset'};\n  margin: ${(props) => (props?.size === 'small' ? `8px 0` : props?.size === 'large' ? '16px 0' : '12px 0')};\n\n  border-top: ${(props) => (props?.hasContentBorders ? `1px solid ${COLORS.neutral_100}` : 'none')};\n  border-bottom: ${(props) => (props?.hasContentBorders ? `1px solid ${COLORS.neutral_100}` : 'none')};\n\n  ${scrollBarStyling(Size.Small)}\n`;\n\nexport const ModalFooter = styled.section<{ size?: Size }>`\n  display: flex;\n  justify-content: flex-end;\n\n  gap: ${(props) => (props?.size === 'large' ? `16px` : '8px')};\n\n  .footer-action {\n    order: -1;\n    margin-right: auto;\n    display: flex;\n    align-items: center;\n    font-size: ${(props) => (props?.size === 'small' ? `16px` : props?.size === 'large' ? '20px' : '18px')};\n    gap: ${(props) => (props?.size === Size.Large ? `8px` : props?.size === Size.Small ? '4px' : '6px')};\n  }\n\n  .footer-action.note {\n    color: ${COLORS.neutral_600};\n  }\n`;\n\nexport const getBackgroundColor = (state: string) => {\n  switch (state) {\n    case 'positive':\n      return COLORS.correct_100;\n    case 'warning':\n      return COLORS.warning_100;\n    case 'critical':\n      return COLORS.critical_100;\n    default:\n      return COLORS.primary_100;\n  }\n};\n\nexport const getNoteMessageColor = (state: string) => {\n  switch (state) {\n    case 'positive':\n      return COLORS.correct_700;\n    case 'warning':\n      return COLORS.warning_700;\n    case 'critical':\n      return COLORS.critical_700;\n    default:\n      return COLORS.primary_700;\n  }\n};\n"],"mappings":"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"}
+{"version":3,"file":"ModalStyles.js","names":["styled","css","COLORS","scrollBarStyling","Size","ModalHeader","section","props","marginBottom","StyledModalHeader","$height","size","ImageContainer","div","ImageOverlay","Column","ModalTitleSection","ModalHeaderActionsWithImage","hasBackButton","ModalHeaderActions","FlexContainer","ModalHoverModifier","CloseButtonWrapper","hasImage","BackButtonWrapper","ModalTitle","h5","fontSize","ModalNoteSection","getBackgroundColor","state","getNoteMessageColor","ModalBody","overflow","hasContentBorders","neutral_100","Small","ModalFooter","Large","neutral_600","correct_100","warning_100","critical_100","primary_100","correct_700","warning_700","critical_700","primary_700"],"sources":["../../src/Modals/ModalStyles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { COLORS } from '..';\nimport { scrollBarStyling } from '../styles';\nimport { Size } from '../types';\n\n/**\n * Modal styles\n */\nexport const ModalHeader = styled.section<{ marginBottom?: string }>`\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: ${(props) => props.marginBottom || '24px'};\n`;\n\nexport const StyledModalHeader = styled(ModalHeader)<{ marginBottom?: string; size?: string; $height?: number }>`\n  flex: 1 0 calc(50% - 5px);\n  flex-direction: column;\n  flex-basis: auto;\n  text-align: left;\n  height: ${(props) => (props.$height ? `${props.$height - (props.size === 'small' ? 16 : props.size === 'large' ? 32 : 24)}px` : '')};\n  img {\n    width: 100%;\n    height: ${(props) => `${props.$height}px`};\n    object-fit: cover;\n    border-radius: 8px 8px 0 0;\n  }\n`;\n\nexport const ImageContainer = styled.div<{ $height: number }>`\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ${(props) => `${props.$height}px`};\n\n  #imgWithFallbackLoadingIndicator {\n    position: absolute;\n    left: 50%;\n    top: 0;\n  }\n`;\n\nexport const ImageOverlay = styled.div<{ $height: number }>`\n  position: absolute;\n  content: '';\n  top: 0;\n  left: 0;\n  height: ${(props) => `${props.$height}px`};\n  width: 100%;\n  background: rgba(255, 255, 255, 0.5);\n  border-radius: 8px 8px 0 0;\n\n  :after {\n    position: absolute;\n    height: ${(props) => `${props.$height}px`};\n    border-radius: 8px 8px 0 0;\n    content: '';\n    top: 0;\n    left: 0;\n    width: 100%;\n    background: #888888;\n    mix-blend-mode: saturation;\n  }\n`;\n\nexport const Column = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: stretch;\n  height: 100%;\n`;\n\nexport const ModalTitleSection = styled.section`\n  word-break: break-word;\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n`;\n\nexport const ModalHeaderActionsWithImage = styled.div<{ hasBackButton?: boolean }>`\n  display: flex;\n  flex-direction: ${(props) => (!props.hasBackButton ? 'row-reverse' : 'row')};\n  justify-content: space-between;\n  width: 100%;\n  z-index: 1;\n`;\n\nexport const ModalHeaderActions = styled.div`\n  display: flex;\n  margin: -12px -12px 0 0;\n`;\n\nexport const FlexContainer = styled.div`\n  display: flex;\n  width: 100%;\n`;\n\nexport const ModalHoverModifier = styled.div`\n  button:hover {\n    cursor: help !important;\n  }\n`;\n\nexport const CloseButtonWrapper = styled.div<{ size?: Size; hasImage?: boolean }>`\n  button {\n    ${(props) =>\n      props.hasImage\n        ? css`\n            margin: -12px -12px 0 0 !important;\n          `\n        : css`\n            left: unset;\n          `}\n  }\n`;\n\nexport const BackButtonWrapper = styled.div<{ size?: Size; hasImage?: boolean }>`\n  button {\n    margin: -12px 0 0 -12px !important;\n  }\n`;\n\nexport const ModalTitle = styled.h5<{ fontSize?: string }>`\n  margin: 0;\n  font-size: ${(props) => props.fontSize || '1.25em'};\n  font-weight: bold;\n`;\n\nexport const ModalNoteSection = styled.section<{ state: string; size?: string }>`\n  background-color: ${(props) => getBackgroundColor(props.state)};\n  font-size: ${(props) => (props?.size === 'small' ? `16px` : props?.size === 'large' ? '20px' : '18px')};\n  margin-top: ${(props) => (props?.size === 'small' ? `0px` : props?.size === 'large' ? '16px' : '4px')};\n  margin-bottom: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '24px' : '16px')};\n  display: flex;\n  flex-direction: row;\n  padding: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '16px' : '12px')};\n  border-radius: 2px;\n\n  span {\n    display: block;\n    width: calc(100% - 32px);\n    margin-left: 8px;\n    color: ${(props) => getNoteMessageColor(props.state)};\n  }\n`;\n\nexport const ModalBody = styled.section<{ size?: string; overflow?: string; hasContentBorders?: boolean }>`\n  flex: 1 1 auto;\n  overflow: ${(props) => props?.overflow ?? 'unset'};\n  margin: ${(props) => (props?.size === 'small' ? `8px 0` : props?.size === 'large' ? '16px 0' : '12px 0')};\n\n  border-top: ${(props) => (props?.hasContentBorders ? `1px solid ${COLORS.neutral_100}` : 'none')};\n  border-bottom: ${(props) => (props?.hasContentBorders ? `1px solid ${COLORS.neutral_100}` : 'none')};\n\n  ${scrollBarStyling(Size.Small)}\n`;\n\nexport const ModalFooter = styled.section<{ size?: Size }>`\n  display: flex;\n  justify-content: flex-end;\n\n  gap: ${(props) => (props?.size === 'large' ? `16px` : '8px')};\n\n  .footer-action {\n    order: -1;\n    margin-right: auto;\n    display: flex;\n    align-items: center;\n    font-size: ${(props) => (props?.size === 'small' ? `16px` : props?.size === 'large' ? '20px' : '18px')};\n    gap: ${(props) => (props?.size === Size.Large ? `8px` : props?.size === Size.Small ? '4px' : '6px')};\n  }\n\n  .footer-action.note {\n    color: ${COLORS.neutral_600};\n  }\n`;\n\nexport const getBackgroundColor = (state: string) => {\n  switch (state) {\n    case 'positive':\n      return COLORS.correct_100;\n    case 'warning':\n      return COLORS.warning_100;\n    case 'critical':\n      return COLORS.critical_100;\n    default:\n      return COLORS.primary_100;\n  }\n};\n\nexport const getNoteMessageColor = (state: string) => {\n  switch (state) {\n    case 'positive':\n      return COLORS.correct_700;\n    case 'warning':\n      return COLORS.warning_700;\n    case 'critical':\n      return COLORS.critical_700;\n    default:\n      return COLORS.primary_700;\n  }\n};\n"],"mappings":"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"}

package/dist/Modals/index.cjs

@@ -1,9 +1,7 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -61,18 +59,11 @@ Object.defineProperty(exports, "ModalTitle", {
     return _ModalStyles.ModalTitle;
   }
 });
-
 var _Modal = _interopRequireWildcard(require("./Modal"));
-
 var _ModalContainer = _interopRequireDefault(require("./ModalContainer"));
-
 var _ModalStyles = require("./ModalStyles");
-
 var _ModalDialog = _interopRequireDefault(require("./ModalDialog"));
-
 var _ModalContent = _interopRequireDefault(require("./ModalContent"));
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
 //# sourceMappingURL=index.cjs.map

package/dist/Modals/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":[],"sources":["../../src/Modals/index.tsx"],"sourcesContent":["import Modal, { ModalCloseButton } from './Modal';\nimport ModalContainer from './ModalContainer';\nimport { ModalHeader, ModalTitle, ModalBody, ModalFooter } from './ModalStyles';\nimport ModalDialog from './ModalDialog';\nimport ModalContent from './ModalContent';\n\nexport { Modal, ModalContainer, ModalHeader, ModalBody, ModalFooter, ModalTitle, ModalCloseButton, ModalDialog, ModalContent };\n\nexport type {LeftFooterAction, LeftFooterHyperlink, LeftFooterActionBase, LeftFooterButton, IconButtonAction} from './ModalTypes';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA"}
+{"version":3,"file":"index.cjs","names":[],"sources":["../../src/Modals/index.tsx"],"sourcesContent":["import Modal, { ModalCloseButton } from './Modal';\nimport ModalContainer from './ModalContainer';\nimport { ModalHeader, ModalTitle, ModalBody, ModalFooter } from './ModalStyles';\nimport ModalDialog from './ModalDialog';\nimport ModalContent from './ModalContent';\n\nexport { Modal, ModalContainer, ModalHeader, ModalBody, ModalFooter, ModalTitle, ModalCloseButton, ModalDialog, ModalContent };\n\nexport type {LeftFooterAction, LeftFooterHyperlink, LeftFooterActionBase, LeftFooterButton, IconButtonAction} from './ModalTypes';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AAA0C;AAAA"}

package/dist/Modals/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Modal","ModalCloseButton","ModalContainer","ModalHeader","ModalTitle","ModalBody","ModalFooter","ModalDialog","ModalContent"],"sources":["../../src/Modals/index.tsx"],"sourcesContent":["import Modal, { ModalCloseButton } from './Modal';\nimport ModalContainer from './ModalContainer';\nimport { ModalHeader, ModalTitle, ModalBody, ModalFooter } from './ModalStyles';\nimport ModalDialog from './ModalDialog';\nimport ModalContent from './ModalContent';\n\nexport { Modal, ModalContainer, ModalHeader, ModalBody, ModalFooter, ModalTitle, ModalCloseButton, ModalDialog, ModalContent };\n\nexport type {LeftFooterAction, LeftFooterHyperlink, LeftFooterActionBase, LeftFooterButton, IconButtonAction} from './ModalTypes';\n"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,gBAAhB,QAAwC,SAAxC;AACA,OAAOC,cAAP,MAA2B,kBAA3B;AACA,SAASC,WAAT,EAAsBC,UAAtB,EAAkCC,SAAlC,EAA6CC,WAA7C,QAAgE,eAAhE;AACA,OAAOC,WAAP,MAAwB,eAAxB;AACA,OAAOC,YAAP,MAAyB,gBAAzB;AAEA,SAASR,KAAT,EAAgBE,cAAhB,EAAgCC,WAAhC,EAA6CE,SAA7C,EAAwDC,WAAxD,EAAqEF,UAArE,EAAiFH,gBAAjF,EAAmGM,WAAnG,EAAgHC,YAAhH"}
+{"version":3,"file":"index.js","names":["Modal","ModalCloseButton","ModalContainer","ModalHeader","ModalTitle","ModalBody","ModalFooter","ModalDialog","ModalContent"],"sources":["../../src/Modals/index.tsx"],"sourcesContent":["import Modal, { ModalCloseButton } from './Modal';\nimport ModalContainer from './ModalContainer';\nimport { ModalHeader, ModalTitle, ModalBody, ModalFooter } from './ModalStyles';\nimport ModalDialog from './ModalDialog';\nimport ModalContent from './ModalContent';\n\nexport { Modal, ModalContainer, ModalHeader, ModalBody, ModalFooter, ModalTitle, ModalCloseButton, ModalDialog, ModalContent };\n\nexport type {LeftFooterAction, LeftFooterHyperlink, LeftFooterActionBase, LeftFooterButton, IconButtonAction} from './ModalTypes';\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,gBAAgB,QAAQ,SAAS;AACjD,OAAOC,cAAc,MAAM,kBAAkB;AAC7C,SAASC,WAAW,EAAEC,UAAU,EAAEC,SAAS,EAAEC,WAAW,QAAQ,eAAe;AAC/E,OAAOC,WAAW,MAAM,eAAe;AACvC,OAAOC,YAAY,MAAM,gBAAgB;AAEzC,SAASR,KAAK,EAAEE,cAAc,EAAEC,WAAW,EAAEE,SAAS,EAAEC,WAAW,EAAEF,UAAU,EAAEH,gBAAgB,EAAEM,WAAW,EAAEC,YAAY"}

package/dist/NavItem/NavItem.cjs

@@ -1,47 +1,30 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _styles = require("../styles");
-
 var _typography = require("../styles/typography");
-
 var _zIndexes = require("../styles/z-indexes");
-
 var _common = require("../common");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 var _templateObject;
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 var NavItemDiv = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n\n  margin: 0;\n  padding: 0 21px 0 21px;\n  height: 64px;\n\n  display: flex;\n  align-items: center;\n  text-align: center;\n  position: relative;\n\n  &:after {\n    content: '';\n    display: block;\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: 3px;\n    background-color: transparent;\n  }\n\n  &.active:not(.disabled) {\n    z-index: ", ";\n    background-color: ", ";\n    color: ", ";\n    &:after {\n      background-color: ", ";\n    }\n  }\n\n  &.disabled {\n    color: ", ";\n    background-color: ", ";\n    &:after {\n      background-color: ", ";\n    }\n  }\n\n  &:hover:not(.disabled) {\n    z-index: ", ";\n    background-color: ", ";\n    color: ", ";\n    &:after {\n      background-color: ", ";\n    }\n  }\n\n  &.focus-visible {\n    ", "\n  }\n"])), (0, _typography.ComponentMStyling)(_typography.ComponentTextStyle.Regular, _styles.COLORS.neutral_600), _zIndexes.Z_INDEXES.active, _styles.COLORS.neutral_20, _styles.COLORS.neutral_800, _styles.COLORS.primary_600, _styles.COLORS.neutral_300, _styles.COLORS.neutral_100, _styles.COLORS.neutral_100, _zIndexes.Z_INDEXES.hover, _styles.COLORS.primary_20, _styles.COLORS.primary_700, _styles.COLORS.primary_600, _styles.focusStyles);
-
 var NavItem = function NavItem(props) {
   var focusVisibleRef = (0, _common.useFocusVisibleRef)();
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(NavItemDiv, _objectSpread(_objectSpread({}, props), {}, {
     ref: focusVisibleRef
   }));
 };
-
 var _default = NavItem;
 exports.default = _default;
 //# sourceMappingURL=NavItem.cjs.map

package/dist/NavItem/NavItem.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"NavItem.cjs","names":["NavItemDiv","styled","div","ComponentMStyling","ComponentTextStyle","Regular","COLORS","neutral_600","Z_INDEXES","active","neutral_20","neutral_800","primary_600","neutral_300","neutral_100","hover","primary_20","primary_700","focusStyles","NavItem","props","focusVisibleRef","useFocusVisibleRef"],"sources":["../../src/NavItem/NavItem.tsx"],"sourcesContent":["import styled, { StyledComponentProps } from 'styled-components';\nimport React from 'react';\nimport {COLORS, focusStyles} from '../styles';\nimport { ComponentMStyling, ComponentTextStyle } from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\nimport { useFocusVisibleRef } from '../common';\n\nexport type StyledComponentPropsWithAs<\n    C extends string | React.ComponentType<any>,\n    T extends object,\n    O extends object,\n    A extends keyof any,\n    AsC extends string | React.ComponentType<any> = C,\n    FAsC extends string | React.ComponentType<any> = C\n> = StyledComponentProps<C, T, O, A, FAsC> & { as?: AsC | undefined; forwardedAs?: FAsC | undefined };\n\n\nconst NavItemDiv = styled.div`\n  ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n  margin: 0;\n  padding: 0 21px 0 21px;\n  height: 64px;\n\n  display: flex;\n  align-items: center;\n  text-align: center;\n  position: relative;\n\n  &:after {\n    content: '';\n    display: block;\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: 3px;\n    background-color: transparent;\n  }\n\n  &.active:not(.disabled) {\n    z-index: ${Z_INDEXES.active};\n    background-color: ${COLORS.neutral_20};\n    color: ${COLORS.neutral_800};\n    &:after {\n      background-color: ${COLORS.primary_600};\n    }\n  }\n\n  &.disabled {\n    color: ${COLORS.neutral_300};\n    background-color: ${COLORS.neutral_100};\n    &:after {\n      background-color: ${COLORS.neutral_100};\n    }\n  }\n\n  &:hover:not(.disabled) {\n    z-index: ${Z_INDEXES.hover};\n    background-color: ${COLORS.primary_20};\n    color: ${COLORS.primary_700};\n    &:after {\n      background-color: ${COLORS.primary_600};\n    }\n  }\n\n  &.focus-visible {\n    ${focusStyles}\n  }\n`;\n\n\nconst NavItem = (props: StyledComponentPropsWithAs<string | React.ComponentType<any>, any, {}, never, string | React.ComponentType<any>, \"div\">) => {\n  const focusVisibleRef = useFocusVisibleRef();\n  return (\n    <NavItemDiv {...props} ref={focusVisibleRef} />\n  );\n};\n\nexport default NavItem;\n"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAYA,IAAMA,UAAU,GAAGC,yBAAA,CAAOC,GAAV,m4BACZ,IAAAC,6BAAA,EAAkBC,8BAAA,CAAmBC,OAArC,EAA8CC,cAAA,CAAOC,WAArD,CADY,EAwBDC,mBAAA,CAAUC,MAxBT,EAyBQH,cAAA,CAAOI,UAzBf,EA0BHJ,cAAA,CAAOK,WA1BJ,EA4BUL,cAAA,CAAOM,WA5BjB,EAiCHN,cAAA,CAAOO,WAjCJ,EAkCQP,cAAA,CAAOQ,WAlCf,EAoCUR,cAAA,CAAOQ,WApCjB,EAyCDN,mBAAA,CAAUO,KAzCT,EA0CQT,cAAA,CAAOU,UA1Cf,EA2CHV,cAAA,CAAOW,WA3CJ,EA6CUX,cAAA,CAAOM,WA7CjB,EAkDVM,mBAlDU,CAAhB;;AAuDA,IAAMC,OAAO,GAAG,SAAVA,OAAU,CAACC,KAAD,EAAoI;EAClJ,IAAMC,eAAe,GAAG,IAAAC,0BAAA,GAAxB;EACA,oBACE,qBAAC,UAAD,kCAAgBF,KAAhB;IAAuB,GAAG,EAAEC;EAA5B,GADF;AAGD,CALD;;eAOeF,O"}
+{"version":3,"file":"NavItem.cjs","names":["NavItemDiv","styled","div","ComponentMStyling","ComponentTextStyle","Regular","COLORS","neutral_600","Z_INDEXES","active","neutral_20","neutral_800","primary_600","neutral_300","neutral_100","hover","primary_20","primary_700","focusStyles","NavItem","props","focusVisibleRef","useFocusVisibleRef"],"sources":["../../src/NavItem/NavItem.tsx"],"sourcesContent":["import styled, { StyledComponentProps } from 'styled-components';\nimport React from 'react';\nimport {COLORS, focusStyles} from '../styles';\nimport { ComponentMStyling, ComponentTextStyle } from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\nimport { useFocusVisibleRef } from '../common';\n\nexport type StyledComponentPropsWithAs<\n    C extends string | React.ComponentType<any>,\n    T extends object,\n    O extends object,\n    A extends keyof any,\n    AsC extends string | React.ComponentType<any> = C,\n    FAsC extends string | React.ComponentType<any> = C\n> = StyledComponentProps<C, T, O, A, FAsC> & { as?: AsC | undefined; forwardedAs?: FAsC | undefined };\n\n\nconst NavItemDiv = styled.div`\n  ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n  margin: 0;\n  padding: 0 21px 0 21px;\n  height: 64px;\n\n  display: flex;\n  align-items: center;\n  text-align: center;\n  position: relative;\n\n  &:after {\n    content: '';\n    display: block;\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: 3px;\n    background-color: transparent;\n  }\n\n  &.active:not(.disabled) {\n    z-index: ${Z_INDEXES.active};\n    background-color: ${COLORS.neutral_20};\n    color: ${COLORS.neutral_800};\n    &:after {\n      background-color: ${COLORS.primary_600};\n    }\n  }\n\n  &.disabled {\n    color: ${COLORS.neutral_300};\n    background-color: ${COLORS.neutral_100};\n    &:after {\n      background-color: ${COLORS.neutral_100};\n    }\n  }\n\n  &:hover:not(.disabled) {\n    z-index: ${Z_INDEXES.hover};\n    background-color: ${COLORS.primary_20};\n    color: ${COLORS.primary_700};\n    &:after {\n      background-color: ${COLORS.primary_600};\n    }\n  }\n\n  &.focus-visible {\n    ${focusStyles}\n  }\n`;\n\n\nconst NavItem = (props: StyledComponentPropsWithAs<string | React.ComponentType<any>, any, {}, never, string | React.ComponentType<any>, \"div\">) => {\n  const focusVisibleRef = useFocusVisibleRef();\n  return (\n    <NavItemDiv {...props} ref={focusVisibleRef} />\n  );\n};\n\nexport default NavItem;\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AAA+C;AAAA;AAAA;AAAA;AAY/C,IAAMA,UAAU,GAAGC,yBAAM,CAACC,GAAG,m4BACzB,IAAAC,6BAAiB,EAACC,8BAAkB,CAACC,OAAO,EAAEC,cAAM,CAACC,WAAW,CAAC,EAuBtDC,mBAAS,CAACC,MAAM,EACPH,cAAM,CAACI,UAAU,EAC5BJ,cAAM,CAACK,WAAW,EAELL,cAAM,CAACM,WAAW,EAK/BN,cAAM,CAACO,WAAW,EACPP,cAAM,CAACQ,WAAW,EAEhBR,cAAM,CAACQ,WAAW,EAK7BN,mBAAS,CAACO,KAAK,EACNT,cAAM,CAACU,UAAU,EAC5BV,cAAM,CAACW,WAAW,EAELX,cAAM,CAACM,WAAW,EAKtCM,mBAAW,CAEhB;AAGD,IAAMC,OAAO,GAAG,SAAVA,OAAO,CAAIC,KAA8H,EAAK;EAClJ,IAAMC,eAAe,GAAG,IAAAC,0BAAkB,GAAE;EAC5C,oBACE,qBAAC,UAAU,kCAAKF,KAAK;IAAE,GAAG,EAAEC;EAAgB,GAAG;AAEnD,CAAC;AAAC,eAEaF,OAAO;AAAA"}

package/dist/NavItem/NavItem.js

@@ -1,13 +1,9 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
 import _pt from "prop-types";
-
 var _templateObject;
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 import styled from 'styled-components';
 import React from 'react';
 import { COLORS, focusStyles } from '../styles';
@@ -16,13 +12,11 @@ import { Z_INDEXES } from '../styles/z-indexes';
 import { useFocusVisibleRef } from '../common';
 import { jsx as _jsx } from "react/jsx-runtime";
 var NavItemDiv = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", "\n\n  margin: 0;\n  padding: 0 21px 0 21px;\n  height: 64px;\n\n  display: flex;\n  align-items: center;\n  text-align: center;\n  position: relative;\n\n  &:after {\n    content: '';\n    display: block;\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: 3px;\n    background-color: transparent;\n  }\n\n  &.active:not(.disabled) {\n    z-index: ", ";\n    background-color: ", ";\n    color: ", ";\n    &:after {\n      background-color: ", ";\n    }\n  }\n\n  &.disabled {\n    color: ", ";\n    background-color: ", ";\n    &:after {\n      background-color: ", ";\n    }\n  }\n\n  &:hover:not(.disabled) {\n    z-index: ", ";\n    background-color: ", ";\n    color: ", ";\n    &:after {\n      background-color: ", ";\n    }\n  }\n\n  &.focus-visible {\n    ", "\n  }\n"])), ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600), Z_INDEXES.active, COLORS.neutral_20, COLORS.neutral_800, COLORS.primary_600, COLORS.neutral_300, COLORS.neutral_100, COLORS.neutral_100, Z_INDEXES.hover, COLORS.primary_20, COLORS.primary_700, COLORS.primary_600, focusStyles);
-
 var NavItem = function NavItem(props) {
   var focusVisibleRef = useFocusVisibleRef();
   return /*#__PURE__*/_jsx(NavItemDiv, _objectSpread(_objectSpread({}, props), {}, {
     ref: focusVisibleRef
   }));
 };
-
 export default NavItem;
 //# sourceMappingURL=NavItem.js.map

package/dist/NavItem/NavItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavItem.js","names":["styled","React","COLORS","focusStyles","ComponentMStyling","ComponentTextStyle","Z_INDEXES","useFocusVisibleRef","NavItemDiv","div","Regular","neutral_600","active","neutral_20","neutral_800","primary_600","neutral_300","neutral_100","hover","primary_20","primary_700","NavItem","props","focusVisibleRef"],"sources":["../../src/NavItem/NavItem.tsx"],"sourcesContent":["import styled, { StyledComponentProps } from 'styled-components';\nimport React from 'react';\nimport {COLORS, focusStyles} from '../styles';\nimport { ComponentMStyling, ComponentTextStyle } from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\nimport { useFocusVisibleRef } from '../common';\n\nexport type StyledComponentPropsWithAs<\n    C extends string | React.ComponentType<any>,\n    T extends object,\n    O extends object,\n    A extends keyof any,\n    AsC extends string | React.ComponentType<any> = C,\n    FAsC extends string | React.ComponentType<any> = C\n> = StyledComponentProps<C, T, O, A, FAsC> & { as?: AsC | undefined; forwardedAs?: FAsC | undefined };\n\n\nconst NavItemDiv = styled.div`\n  ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n  margin: 0;\n  padding: 0 21px 0 21px;\n  height: 64px;\n\n  display: flex;\n  align-items: center;\n  text-align: center;\n  position: relative;\n\n  &:after {\n    content: '';\n    display: block;\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: 3px;\n    background-color: transparent;\n  }\n\n  &.active:not(.disabled) {\n    z-index: ${Z_INDEXES.active};\n    background-color: ${COLORS.neutral_20};\n    color: ${COLORS.neutral_800};\n    &:after {\n      background-color: ${COLORS.primary_600};\n    }\n  }\n\n  &.disabled {\n    color: ${COLORS.neutral_300};\n    background-color: ${COLORS.neutral_100};\n    &:after {\n      background-color: ${COLORS.neutral_100};\n    }\n  }\n\n  &:hover:not(.disabled) {\n    z-index: ${Z_INDEXES.hover};\n    background-color: ${COLORS.primary_20};\n    color: ${COLORS.primary_700};\n    &:after {\n      background-color: ${COLORS.primary_600};\n    }\n  }\n\n  &.focus-visible {\n    ${focusStyles}\n  }\n`;\n\n\nconst NavItem = (props: StyledComponentPropsWithAs<string | React.ComponentType<any>, any, {}, never, string | React.ComponentType<any>, \"div\">) => {\n  const focusVisibleRef = useFocusVisibleRef();\n  return (\n    <NavItemDiv {...props} ref={focusVisibleRef} />\n  );\n};\n\nexport default NavItem;\n"],"mappings":";;;;;;;;;;AAAA,OAAOA,MAAP,MAA6C,mBAA7C;AACA,OAAOC,KAAP,MAAkB,OAAlB;AACA,SAAQC,MAAR,EAAgBC,WAAhB,QAAkC,WAAlC;AACA,SAASC,iBAAT,EAA4BC,kBAA5B,QAAsD,sBAAtD;AACA,SAAQC,SAAR,QAAwB,qBAAxB;AACA,SAASC,kBAAT,QAAmC,WAAnC;;AAYA,IAAMC,UAAU,GAAGR,MAAM,CAACS,GAAV,q3BACZL,iBAAiB,CAACC,kBAAkB,CAACK,OAApB,EAA6BR,MAAM,CAACS,WAApC,CADL,EAwBDL,SAAS,CAACM,MAxBT,EAyBQV,MAAM,CAACW,UAzBf,EA0BHX,MAAM,CAACY,WA1BJ,EA4BUZ,MAAM,CAACa,WA5BjB,EAiCHb,MAAM,CAACc,WAjCJ,EAkCQd,MAAM,CAACe,WAlCf,EAoCUf,MAAM,CAACe,WApCjB,EAyCDX,SAAS,CAACY,KAzCT,EA0CQhB,MAAM,CAACiB,UA1Cf,EA2CHjB,MAAM,CAACkB,WA3CJ,EA6CUlB,MAAM,CAACa,WA7CjB,EAkDVZ,WAlDU,CAAhB;;AAuDA,IAAMkB,OAAO,GAAG,SAAVA,OAAU,CAACC,KAAD,EAAoI;EAClJ,IAAMC,eAAe,GAAGhB,kBAAkB,EAA1C;EACA,oBACE,KAAC,UAAD,kCAAgBe,KAAhB;IAAuB,GAAG,EAAEC;EAA5B,GADF;AAGD,CALD;;AAOA,eAAeF,OAAf"}
+{"version":3,"file":"NavItem.js","names":["styled","React","COLORS","focusStyles","ComponentMStyling","ComponentTextStyle","Z_INDEXES","useFocusVisibleRef","NavItemDiv","div","Regular","neutral_600","active","neutral_20","neutral_800","primary_600","neutral_300","neutral_100","hover","primary_20","primary_700","NavItem","props","focusVisibleRef"],"sources":["../../src/NavItem/NavItem.tsx"],"sourcesContent":["import styled, { StyledComponentProps } from 'styled-components';\nimport React from 'react';\nimport {COLORS, focusStyles} from '../styles';\nimport { ComponentMStyling, ComponentTextStyle } from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\nimport { useFocusVisibleRef } from '../common';\n\nexport type StyledComponentPropsWithAs<\n    C extends string | React.ComponentType<any>,\n    T extends object,\n    O extends object,\n    A extends keyof any,\n    AsC extends string | React.ComponentType<any> = C,\n    FAsC extends string | React.ComponentType<any> = C\n> = StyledComponentProps<C, T, O, A, FAsC> & { as?: AsC | undefined; forwardedAs?: FAsC | undefined };\n\n\nconst NavItemDiv = styled.div`\n  ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n  margin: 0;\n  padding: 0 21px 0 21px;\n  height: 64px;\n\n  display: flex;\n  align-items: center;\n  text-align: center;\n  position: relative;\n\n  &:after {\n    content: '';\n    display: block;\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: 3px;\n    background-color: transparent;\n  }\n\n  &.active:not(.disabled) {\n    z-index: ${Z_INDEXES.active};\n    background-color: ${COLORS.neutral_20};\n    color: ${COLORS.neutral_800};\n    &:after {\n      background-color: ${COLORS.primary_600};\n    }\n  }\n\n  &.disabled {\n    color: ${COLORS.neutral_300};\n    background-color: ${COLORS.neutral_100};\n    &:after {\n      background-color: ${COLORS.neutral_100};\n    }\n  }\n\n  &:hover:not(.disabled) {\n    z-index: ${Z_INDEXES.hover};\n    background-color: ${COLORS.primary_20};\n    color: ${COLORS.primary_700};\n    &:after {\n      background-color: ${COLORS.primary_600};\n    }\n  }\n\n  &.focus-visible {\n    ${focusStyles}\n  }\n`;\n\n\nconst NavItem = (props: StyledComponentPropsWithAs<string | React.ComponentType<any>, any, {}, never, string | React.ComponentType<any>, \"div\">) => {\n  const focusVisibleRef = useFocusVisibleRef();\n  return (\n    <NavItemDiv {...props} ref={focusVisibleRef} />\n  );\n};\n\nexport default NavItem;\n"],"mappings":";;;;;;AAAA,OAAOA,MAAM,MAAgC,mBAAmB;AAChE,OAAOC,KAAK,MAAM,OAAO;AACzB,SAAQC,MAAM,EAAEC,WAAW,QAAO,WAAW;AAC7C,SAASC,iBAAiB,EAAEC,kBAAkB,QAAQ,sBAAsB;AAC5E,SAAQC,SAAS,QAAO,qBAAqB;AAC7C,SAASC,kBAAkB,QAAQ,WAAW;AAAC;AAY/C,IAAMC,UAAU,GAAGR,MAAM,CAACS,GAAG,q3BACzBL,iBAAiB,CAACC,kBAAkB,CAACK,OAAO,EAAER,MAAM,CAACS,WAAW,CAAC,EAuBtDL,SAAS,CAACM,MAAM,EACPV,MAAM,CAACW,UAAU,EAC5BX,MAAM,CAACY,WAAW,EAELZ,MAAM,CAACa,WAAW,EAK/Bb,MAAM,CAACc,WAAW,EACPd,MAAM,CAACe,WAAW,EAEhBf,MAAM,CAACe,WAAW,EAK7BX,SAAS,CAACY,KAAK,EACNhB,MAAM,CAACiB,UAAU,EAC5BjB,MAAM,CAACkB,WAAW,EAELlB,MAAM,CAACa,WAAW,EAKtCZ,WAAW,CAEhB;AAGD,IAAMkB,OAAO,GAAG,SAAVA,OAAO,CAAIC,KAA8H,EAAK;EAClJ,IAAMC,eAAe,GAAGhB,kBAAkB,EAAE;EAC5C,oBACE,KAAC,UAAU,kCAAKe,KAAK;IAAE,GAAG,EAAEC;EAAgB,GAAG;AAEnD,CAAC;AAED,eAAeF,OAAO"}

package/dist/NavItem/index.cjs

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -11,6 +10,5 @@ Object.defineProperty(exports, "NavItem", {
     return _NavItem.default;
   }
 });
-
 var _NavItem = _interopRequireDefault(require("./NavItem"));
 //# sourceMappingURL=index.cjs.map

package/dist/NavItem/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":[],"sources":["../../src/NavItem/index.ts"],"sourcesContent":["export { default as NavItem } from './NavItem';\nexport { type StyledComponentPropsWithAs } from './NavItem';\n"],"mappings":";;;;;;;;;;;;;;AAAA"}
+{"version":3,"file":"index.cjs","names":[],"sources":["../../src/NavItem/index.ts"],"sourcesContent":["export { default as NavItem } from './NavItem';\nexport { type StyledComponentPropsWithAs } from './NavItem';\n"],"mappings":";;;;;;;;;;;;AAAA"}

package/dist/NavItem/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["default","NavItem"],"sources":["../../src/NavItem/index.ts"],"sourcesContent":["export { default as NavItem } from './NavItem';\nexport { type StyledComponentPropsWithAs } from './NavItem';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,OAApB,QAAmC,WAAnC"}
+{"version":3,"file":"index.js","names":["default","NavItem"],"sources":["../../src/NavItem/index.ts"],"sourcesContent":["export { default as NavItem } from './NavItem';\nexport { type StyledComponentPropsWithAs } from './NavItem';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,OAAO,QAAQ,WAAW"}

package/dist/NotificationDot/NotificationDot.cjs

@@ -1,34 +1,21 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var React = _interopRequireWildcard(require("react"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _types = require("../types");
-
 var _ = require("..");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 var _templateObject, _templateObject2;
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
-
 var ContentWrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: ", ";\n  height: ", ";\n  padding: ", ";\n  box-sizing: border-box;\n"])), function (props) {
   return props.size === _types.Size.Small ? '16px' : props.size === _types.Size.Large ? '24px' : '20px';
 }, function (props) {
@@ -36,7 +23,6 @@ var ContentWrapper = _styledComponents.default.div(_templateObject || (_template
 }, function (props) {
   return props.size === _types.Size.Small ? '3px' : props.size === _types.Size.Large ? '4px' : '4px';
 });
-
 var Content = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  background-color: ", ";\n  height: ", ";\n  width: ", ";\n  border-radius: ", ";\n  border: ", ";\n  box-sizing: border-box;\n"])), function (props) {
   return props.variant === 'positive' ? _.COLORS.correct_500 : _.COLORS.critical_500;
 }, function (props) {
@@ -48,12 +34,11 @@ var Content = _styledComponents.default.div(_templateObject2 || (_templateObject
 }, function (props) {
   return props.size === _types.Size.Small ? '2px solid ' + _.COLORS.white : props.size === _types.Size.Large ? '3px solid ' + _.COLORS.white : '2px solid ' + _.COLORS.white;
 });
-
 var NotificationDot = function NotificationDot(_ref) {
   var _ref$size = _ref.size,
-      size = _ref$size === void 0 ? _types.Size.Medium : _ref$size,
-      variant = _ref.variant,
-      testId = _ref.testId;
+    size = _ref$size === void 0 ? _types.Size.Medium : _ref$size,
+    variant = _ref.variant,
+    testId = _ref.testId;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(ContentWrapper, {
     size: size,
     variant: variant,
@@ -64,7 +49,6 @@ var NotificationDot = function NotificationDot(_ref) {
     })
   });
 };
-
 NotificationDot.propTypes = {
   variant: _propTypes.default.oneOf(['critical', 'positive']).isRequired,
   testId: _propTypes.default.string