@bbl-digital/snorre 4.2.98 → 4.2.99

package/esm/core/Button/styles.js

@@ -0,0 +1,94 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.styles = exports.default = exports.Btn = void 0;
+var _base = _interopRequireDefault(require("@emotion/styled/base"));
+var _react = require("@emotion/react");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+const Btn = exports.Btn = /*#__PURE__*/(0, _base.default)("button", process.env.NODE_ENV === "production" ? {
+  target: "ebr9ex40"
+} : {
+  target: "ebr9ex40",
+  label: "Btn"
+})();
+var _ref = process.env.NODE_ENV === "production" ? {
+  name: "1g8p5l7",
+  styles: "background-color:transparent;color:black"
+} : {
+  name: "xfcu8k-successOutline",
+  styles: "background-color:transparent;color:black;label:successOutline;",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+const styles = exports.styles = {
+  default: theme => /*#__PURE__*/(0, _react.css)("display:flex;align-items:center;justify-content:center;height:38px;padding:0 1.5em;border-radius:19px;background-color:", theme.btnDefault, ";border:1px solid ", theme.btnDefault, ";color:", theme.btnDefaultFontColor, ";text-align:center;line-height:20px;font-size:14px;font-weight:600;cursor:pointer;text-decoration:none;&:focus{text-decoration:underline;background-color:", theme.btnDefaultLighter, ";border-color:", theme.btnDefaultLighter, ";color:", theme.btnHoverTextColor, ";outline:none;}&:hover{background-color:", theme.btnDefaultDarker, ";border-color:", theme.btnDefaultDarker, ";color:", theme.btnHoverTextColor, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:default;")),
+  highlighted: process.env.NODE_ENV === "production" ? {
+    name: "1qllkub",
+    styles: "height:46px;font-size:16px;line-height:22px;border-radius:23px"
+  } : {
+    name: "lx2bay-highlighted",
+    styles: "height:46px;font-size:16px;line-height:22px;border-radius:23px;label:highlighted;",
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+  },
+  icon: theme => /*#__PURE__*/(0, _react.css)("display:inline-flex;justify-content:space-between;&>svg>polygon{fill:", theme.btnDefaultFontColor, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:icon;")),
+  beforeIcon: process.env.NODE_ENV === "production" ? {
+    name: "182kuw3",
+    styles: "padding-left:0.75em;&>svg{margin-right:5px;}"
+  } : {
+    name: "1gn9sdw-beforeIcon",
+    styles: "padding-left:0.75em;&>svg{margin-right:5px;};label:beforeIcon;",
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+  },
+  afterIcon: process.env.NODE_ENV === "production" ? {
+    name: "1sby9l6",
+    styles: "padding-right:0.75em;&>svg{margin-left:5px;}"
+  } : {
+    name: "vx4r34-afterIcon",
+    styles: "padding-right:0.75em;&>svg{margin-left:5px;};label:afterIcon;",
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+  },
+  outline: theme => /*#__PURE__*/(0, _react.css)("border:2px solid ", theme.btnDefault, ";color:black;background-color:white;&>svg>polygon{fill:black!important;}&:hover,&:focus{&>svg>polygon,&>svg>path{fill:", theme.btnHoverTextColor, "!important;}}&:focus{color:", theme.btnHoverTextColor, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:outline;")),
+  success: theme => /*#__PURE__*/(0, _react.css)("background-color:", theme.btnSuccess, ";border-color:", theme.btnSuccess, ";color:black;&:focus{text-decoration:underline;background-color:", theme.btnSuccessLighter, ";border-color:", theme.btnSuccessLighter, ";color:black;}&:hover{background-color:", theme.btnSuccessDarker, ";border-color:", theme.btnSuccessDarker, ";color:black;}" + (process.env.NODE_ENV === "production" ? "" : ";label:success;")),
+  danger: theme => /*#__PURE__*/(0, _react.css)("background-color:", theme.btnDanger, ";border-color:", theme.btnDanger, ";color:white;&:focus{text-decoration:underline;background-color:", theme.btnDangerLighter, ";border-color:", theme.btnDangerLighter, ";}&:hover{background-color:", theme.btnDangerDarker, ";border-color:", theme.btnDangerDarker, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:danger;")),
+  disabled: theme => /*#__PURE__*/(0, _react.css)("background-color:", theme.btnDisabled, ";border-color:", theme.btnDisabled, ";color:black;&:hover{background-color:", theme.btnDisabled, ";border-color:", theme.btnDisabled, ";color:black;cursor:default;}" + (process.env.NODE_ENV === "production" ? "" : ";label:disabled;")),
+  border: color => /*#__PURE__*/(0, _react.css)("border-color:", color, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:border;")),
+  loading: theme => /*#__PURE__*/(0, _react.css)("opacity:0.8;cursor:default;&:hover{&>span>div>div{background:", theme.btnDefaultFontColor, ";}}" + (process.env.NODE_ENV === "production" ? "" : ";label:loading;")),
+  nostyle: process.env.NODE_ENV === "production" ? {
+    name: "423zxq",
+    styles: "padding:0;outline:none;border:none;background-color:transparent;height:auto;color:black;&:hover,&:focus,&:active{background-color:transparent;border:none;color:black;}&>svg>polygon{fill:black;}"
+  } : {
+    name: "4mfvfl-nostyle",
+    styles: "padding:0;outline:none;border:none;background-color:transparent;height:auto;color:black;&:hover,&:focus,&:active{background-color:transparent;border:none;color:black;}&>svg>polygon{fill:black;};label:nostyle;",
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+  },
+  back: theme => /*#__PURE__*/(0, _react.css)("background-color:transparent;color:black;border:2px solid ", theme.btnBackBorder, ";height:32px;padding:0 1.5em;&>span{padding:0 0.5em;}&:focus{border-color:", theme.secondary, ";background-color:transparent;color:black;text-decoration:none;}&:hover,&:active{background-color:", theme.secondary, ";border:2px solid ", theme.btnBackBorder, ";color:", theme.btnHoverTextColor, ";&>svg{fill:", theme.btnHoverTextColor, "!important;}}" + (process.env.NODE_ENV === "production" ? "" : ";label:back;")),
+  small: process.env.NODE_ENV === "production" ? {
+    name: "db171r",
+    styles: "height:30px;padding:0 1.5em"
+  } : {
+    name: "14e3blf-small",
+    styles: "height:30px;padding:0 1.5em;label:small;",
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+  },
+  dangerOutline: theme => /*#__PURE__*/(0, _react.css)("background-color:transparent;color:", theme.btnDanger, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:dangerOutline;")),
+  successOutline: theme => _ref,
+  transparentBg: process.env.NODE_ENV === "production" ? {
+    name: "1peqg37",
+    styles: "background-color:transparent"
+  } : {
+    name: "x2hhac-transparentBg",
+    styles: "background-color:transparent;label:transparentBg;",
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+  },
+  focusable: process.env.NODE_ENV === "production" ? {
+    name: "1qjpqms",
+    styles: "&:focus-visible{outline:1px dotted #212121;outline:5px auto -webkit-focus-ring-color;}"
+  } : {
+    name: "jatm0f-focusable",
+    styles: "&:focus-visible{outline:1px dotted #212121;outline:5px auto -webkit-focus-ring-color;};label:focusable;",
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+  }
+};
+var _default = exports.default = styles;

package/esm/core/Calendar/Calendar.stories.js

@@ -0,0 +1,46 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Small = exports.CalendarWithEvent = exports.Calendar = void 0;
+var _ = _interopRequireDefault(require("."));
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _default = exports.default = {
+  title: 'Core/Calendar',
+  component: _.default
+};
+const now = new Date();
+const events = [{
+  title: 'test tittel veldig lang',
+  date: now,
+  dateNote: 'Årlig',
+  description: 'Her kommer en tekst som skal beskrive masse stuff'
+}, {
+  title: 'test tittel veldig lang',
+  date: now,
+  dateNote: 'Årlig',
+  description: 'Her kommer en tekst som skal beskrive masse stuff'
+}];
+const Calendar = exports.Calendar = {
+  render: () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
+    month: now
+  }),
+  name: 'Calendar'
+};
+const CalendarWithEvent = exports.CalendarWithEvent = {
+  render: () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
+    month: now,
+    events: events
+  }),
+  name: 'Calendar with event'
+};
+const Small = exports.Small = {
+  render: () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
+    small: true,
+    month: now,
+    events: events
+  }),
+  name: 'Small'
+};

package/esm/core/Calendar/CalendarEvent/index.js

@@ -0,0 +1,92 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _styles = require("./styles");
+var _Text = _interopRequireDefault(require("../../Text"));
+var _react2 = require("@emotion/react");
+var _format = require("../../../utils/format");
+var _Header = _interopRequireDefault(require("../../Header"));
+var _dates = require("../../../utils/dates");
+var _react3 = require("motion/react");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const CalendarEvent = ({
+  trackingName,
+  event
+}) => {
+  const theme = (0, _react2.useTheme)();
+  const ref = /*#__PURE__*/(0, _react.createRef)();
+  const [showTooltip, setShowTooltip] = (0, _react.useState)(false);
+  const handleClick = e => {
+    e.stopPropagation();
+    setShowTooltip(!showTooltip);
+  };
+  (0, _react.useEffect)(() => {
+    const handleClickOutside = e => {
+      const node = ref.current;
+      if (node && node.contains(e.target)) {
+        return;
+      }
+      setShowTooltip(false);
+    };
+    if (showTooltip) {
+      document.addEventListener('mousedown', handleClickOutside);
+    } else {
+      document.removeEventListener('mousedown', handleClickOutside);
+    }
+    return () => {
+      document.removeEventListener('mousedown', handleClickOutside);
+    };
+  }, [showTooltip, ref]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.InformationWrapper, {
+    ref: ref,
+    "aria-label": `Kalenderhendelse ${(0, _format.getFormattedDate)(event.date, _dates.DDMMYYYY)}`,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.CalendarEventBtn, {
+      trackingName: trackingName,
+      onClick: handleClick,
+      background: theme.illustrationPrimary10,
+      children: event.title
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_react3.AnimatePresence, {
+      children: showTooltip && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.InformationBox, {
+        initial: {
+          opacity: 0
+        },
+        animate: {
+          opacity: 1
+        },
+        exit: {
+          opacity: 0
+        },
+        transition: {
+          duration: 0.1
+        },
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.EventContent, {
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Header.default, {
+            level: 5,
+            children: event.title
+          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Div, {
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.default, {
+              size: "14px",
+              children: (0, _format.getFormattedDate)(event.date, _dates.ddmmyyyy)
+            }), event.dateNote && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.default, {
+              size: "14px",
+              children: event.dateNote
+            })]
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.default, {
+            size: "14px",
+            paragraph: true,
+            align: "left",
+            children: event.description
+          })]
+        })
+      })
+    })]
+  });
+};
+var _default = exports.default = CalendarEvent;

package/esm/core/Calendar/CalendarEvent/styles.js

@@ -0,0 +1,69 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.InformationWrapper = exports.InformationBox = exports.EventContent = exports.Div = exports.CalendarEventBtn = void 0;
+var _base = _interopRequireDefault(require("@emotion/styled/base"));
+var _react = require("@emotion/react");
+var _react2 = require("motion/react");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+const CalendarEventBtn = exports.CalendarEventBtn = /*#__PURE__*/(0, _base.default)("button", process.env.NODE_ENV === "production" ? {
+  target: "emupss04"
+} : {
+  target: "emupss04",
+  label: "CalendarEventBtn"
+})(props => /*#__PURE__*/(0, _react.css)("width:90%;border:none;border-radius:4px;background-color:", props.background, ";font-weight:600;cursor:pointer;text-align:left;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;" + (process.env.NODE_ENV === "production" ? "" : ";label:CalendarEventBtn;")));
+const InformationWrapper = exports.InformationWrapper = /*#__PURE__*/(0, _base.default)("span", process.env.NODE_ENV === "production" ? {
+  target: "emupss03"
+} : {
+  target: "emupss03",
+  label: "InformationWrapper"
+})(process.env.NODE_ENV === "production" ? {
+  name: "1xdkr60",
+  styles: "display:block;position:relative;font-weight:400"
+} : {
+  name: "1xdkr60",
+  styles: "display:block;position:relative;font-weight:400",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+const InformationBox = exports.InformationBox = /*#__PURE__*/(0, _base.default)(_react2.motion.div, process.env.NODE_ENV === "production" ? {
+  target: "emupss02"
+} : {
+  target: "emupss02",
+  label: "InformationBox"
+})(process.env.NODE_ENV === "production" ? {
+  name: "1nkktzb",
+  styles: "position:absolute;width:22vw;text-align:center;border-radius:10px;background-color:white;z-index:1;top:-20px;left:calc(100% + 10px);box-shadow:0px 10px 15px 0px rgba(0, 0, 0, 0.2);&::after{content:'';position:absolute;border-width:12px;border-style:solid;top:20px;right:100%;margin-left:-5px;border-color:transparent white transparent transparent;}"
+} : {
+  name: "1nkktzb",
+  styles: "position:absolute;width:22vw;text-align:center;border-radius:10px;background-color:white;z-index:1;top:-20px;left:calc(100% + 10px);box-shadow:0px 10px 15px 0px rgba(0, 0, 0, 0.2);&::after{content:'';position:absolute;border-width:12px;border-style:solid;top:20px;right:100%;margin-left:-5px;border-color:transparent white transparent transparent;}",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+const EventContent = exports.EventContent = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
+  target: "emupss01"
+} : {
+  target: "emupss01",
+  label: "EventContent"
+})(process.env.NODE_ENV === "production" ? {
+  name: "gi73bv",
+  styles: "display:grid;grid-template-columns:1fr;grid-row-gap:0.5em;justify-items:start;padding:1em"
+} : {
+  name: "gi73bv",
+  styles: "display:grid;grid-template-columns:1fr;grid-row-gap:0.5em;justify-items:start;padding:1em",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+const Div = exports.Div = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
+  target: "emupss00"
+} : {
+  target: "emupss00",
+  label: "Div"
+})(process.env.NODE_ENV === "production" ? {
+  name: "1deiktd",
+  styles: "display:flex;justify-content:space-between;width:95%"
+} : {
+  name: "1deiktd",
+  styles: "display:flex;justify-content:space-between;width:95%",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});

package/esm/core/Calendar/CalendarSmallEvent/index.js

@@ -0,0 +1,93 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _styles = require("./styles");
+var _react2 = require("motion/react");
+var _Text = _interopRequireDefault(require("../../Text"));
+var _react3 = require("@emotion/react");
+var _format = require("../../../utils/format");
+var _Header = _interopRequireDefault(require("../../Header"));
+var _dates = require("../../../utils/dates");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const CalendarSmallEvent = ({
+  trackingName,
+  events
+}) => {
+  const theme = (0, _react3.useTheme)();
+  const ref = /*#__PURE__*/(0, _react.createRef)();
+  const [showTooltip, setShowTooltip] = (0, _react.useState)(false);
+  const handleClick = e => {
+    e.stopPropagation();
+    setShowTooltip(!showTooltip);
+  };
+  (0, _react.useEffect)(() => {
+    const handleClickOutside = e => {
+      const node = ref.current;
+      if (node && node.contains(e.target)) {
+        return;
+      }
+      setShowTooltip(false);
+    };
+    if (showTooltip) {
+      document.addEventListener('mousedown', handleClickOutside);
+    } else {
+      document.removeEventListener('mousedown', handleClickOutside);
+    }
+    return () => {
+      document.removeEventListener('mousedown', handleClickOutside);
+    };
+  }, [showTooltip, ref]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.InformationWrapper, {
+    ref: ref,
+    onClick: handleClick,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.CalendarSmallEventBtn, {
+      trackingName: trackingName,
+      background: theme.primary
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_react2.AnimatePresence, {
+      children: showTooltip && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.InformationBox, {
+        initial: {
+          opacity: 0,
+          scale: 0.9
+        },
+        animate: {
+          opacity: 1,
+          scale: 1
+        },
+        exit: {
+          opacity: 0,
+          scale: 0.9
+        },
+        transition: {
+          duration: 0.1
+        },
+        children: events.length > 0 && events.map((event, i) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.EventContent, {
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Header.default, {
+            level: 5,
+            children: event.title
+          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Div, {
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.default, {
+              size: "14px",
+              children: (0, _format.getFormattedDate)(event.date, _dates.ddmmyyyy)
+            }), event.dateNote && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.default, {
+              size: "14px",
+              children: event.dateNote
+            })]
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.default, {
+            size: "14px",
+            paragraph: true,
+            align: "left",
+            children: event.description
+          })]
+        }, i))
+      })
+    })]
+  });
+};
+var _default = exports.default = CalendarSmallEvent;

package/esm/core/Calendar/CalendarSmallEvent/styles.js

@@ -0,0 +1,69 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.InformationWrapper = exports.InformationBox = exports.EventContent = exports.Div = exports.CalendarSmallEventBtn = void 0;
+var _base = _interopRequireDefault(require("@emotion/styled/base"));
+var _react = require("@emotion/react");
+var _react2 = require("motion/react");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+const CalendarSmallEventBtn = exports.CalendarSmallEventBtn = /*#__PURE__*/(0, _base.default)("button", process.env.NODE_ENV === "production" ? {
+  target: "e1xd50go4"
+} : {
+  target: "e1xd50go4",
+  label: "CalendarSmallEventBtn"
+})(props => /*#__PURE__*/(0, _react.css)("height:8px;width:8px;border-radius:50%;padding:0;border:none;background-color:", props.background, ";margin-top:30px;" + (process.env.NODE_ENV === "production" ? "" : ";label:CalendarSmallEventBtn;")));
+const InformationWrapper = exports.InformationWrapper = /*#__PURE__*/(0, _base.default)("span", process.env.NODE_ENV === "production" ? {
+  target: "e1xd50go3"
+} : {
+  target: "e1xd50go3",
+  label: "InformationWrapper"
+})(process.env.NODE_ENV === "production" ? {
+  name: "x6u1u8",
+  styles: "display:block;font-weight:400;height:50px;margin-top:-22px;cursor:pointer;&:active{outline:none;}"
+} : {
+  name: "x6u1u8",
+  styles: "display:block;font-weight:400;height:50px;margin-top:-22px;cursor:pointer;&:active{outline:none;}",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+const InformationBox = exports.InformationBox = /*#__PURE__*/(0, _base.default)(_react2.motion.div, process.env.NODE_ENV === "production" ? {
+  target: "e1xd50go2"
+} : {
+  target: "e1xd50go2",
+  label: "InformationBox"
+})(process.env.NODE_ENV === "production" ? {
+  name: "1agvjtb",
+  styles: "position:absolute;width:100%;left:0;text-align:center;border-radius:10px;background-color:white;box-shadow:0px 10px 15px 0px rgba(0, 0, 0, 0.2);z-index:3;h5{text-align:left;}&.tooltip-enter{opacity:0;transform:scale(0.8);}&.tooltip-enter-active{opacity:1;transform:translateX(0);transition:opacity 80ms,transform 80ms;}&.tooltip-exit{opacity:1;}&.tooltip-exit-active{opacity:0;transform:scale(0.9);transition:opacity 80ms,transform 80ms;}"
+} : {
+  name: "1agvjtb",
+  styles: "position:absolute;width:100%;left:0;text-align:center;border-radius:10px;background-color:white;box-shadow:0px 10px 15px 0px rgba(0, 0, 0, 0.2);z-index:3;h5{text-align:left;}&.tooltip-enter{opacity:0;transform:scale(0.8);}&.tooltip-enter-active{opacity:1;transform:translateX(0);transition:opacity 80ms,transform 80ms;}&.tooltip-exit{opacity:1;}&.tooltip-exit-active{opacity:0;transform:scale(0.9);transition:opacity 80ms,transform 80ms;}",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+const EventContent = exports.EventContent = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
+  target: "e1xd50go1"
+} : {
+  target: "e1xd50go1",
+  label: "EventContent"
+})(process.env.NODE_ENV === "production" ? {
+  name: "nd6z26",
+  styles: "display:grid;grid-template-columns:1fr;grid-row-gap:0.5em;justify-items:start;padding:1em;border-bottom:1px solid #efefef;&:last-of-type{border-bottom:none;}"
+} : {
+  name: "nd6z26",
+  styles: "display:grid;grid-template-columns:1fr;grid-row-gap:0.5em;justify-items:start;padding:1em;border-bottom:1px solid #efefef;&:last-of-type{border-bottom:none;}",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+const Div = exports.Div = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
+  target: "e1xd50go0"
+} : {
+  target: "e1xd50go0",
+  label: "Div"
+})(process.env.NODE_ENV === "production" ? {
+  name: "1deiktd",
+  styles: "display:flex;justify-content:space-between;width:95%"
+} : {
+  name: "1deiktd",
+  styles: "display:flex;justify-content:space-between;width:95%",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});

package/esm/core/Calendar/index.js

@@ -0,0 +1,79 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactDayPicker = require("react-day-picker");
+var _dates = require("../../utils/dates");
+var _locale = require("date-fns/locale");
+var _styles = require("./styles");
+var _Text = _interopRequireDefault(require("../Text"));
+var _util = require("./util");
+var _CalendarEvent = _interopRequireDefault(require("./CalendarEvent"));
+var _CalendarSmallEvent = _interopRequireDefault(require("./CalendarSmallEvent"));
+var _format = require("../../utils/format");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const Calendar = ({
+  month,
+  small,
+  events
+}) => {
+  const renderDay = ({
+    day
+  }) => {
+    return small ? renderSmall(day) : renderNormal(day);
+  };
+  const renderSmall = day => {
+    const date = day.date.getDate();
+    const dayEvents = events && (0, _util.getEventForDay)(events, day.date);
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.CalendarSmallCell, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.CalendarSmallDate, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Text.default, {
+          semibold: day.date.getMonth() === month.getMonth(),
+          subtle: day.date.getMonth() !== month.getMonth(),
+          children: [date, date === 1 && !small ? ' ' + _dates.MONTHS_SHORT[day.date.getMonth()] : '']
+        })
+      }), dayEvents && dayEvents.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_CalendarSmallEvent.default, {
+        events: dayEvents
+      })]
+    });
+  };
+  const renderNormal = day => {
+    const date = day.date.getDate();
+    const dayEvents = events && (0, _util.getEventForDay)(events, day.date);
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.CalendarCell, {
+      className: "rdp-cell",
+      subtle: day.date.getDay() === 6 || day.date.getDay() === 0,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.CalendarDate, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Text.default, {
+          semibold: day.date.getMonth() === month.getMonth(),
+          subtle: day.date.getMonth() !== month.getMonth(),
+          children: [date, date === 1 ? ' ' + _dates.MONTHS_SHORT[day.date.getMonth()] : '']
+        })
+      }), dayEvents && dayEvents.length > 0 && dayEvents.map((e, i) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_CalendarEvent.default, {
+        event: e
+      }, i))]
+    });
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Wrapper, {
+    small: small,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactDayPicker.DayPicker, {
+      disableNavigation: true,
+      month: month,
+      components: {
+        Day: renderDay
+      },
+      hideNavigation: true,
+      pagedNavigation: false,
+      locale: _locale.nb,
+      weekStartsOn: 1,
+      showWeekNumber: true,
+      showOutsideDays: true,
+      "aria-label": `Kalender for ${(0, _format.getFormattedDate)(month, _dates.mmYYYY)}`
+    })
+  });
+};
+var _default = exports.default = Calendar;

package/esm/core/Calendar/styles.js

@@ -0,0 +1,63 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Wrapper = exports.CalendarSmallDate = exports.CalendarSmallCell = exports.CalendarDate = exports.CalendarCell = void 0;
+var _base = _interopRequireDefault(require("@emotion/styled/base"));
+var _react = require("@emotion/react");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+const Wrapper = exports.Wrapper = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
+  target: "e150zp874"
+} : {
+  target: "e150zp874",
+  label: "Wrapper"
+})(({
+  small
+}) => /*#__PURE__*/(0, _react.css)(".rdp-root{margin:0;}.rdp-weeks{padding-left:", small ? '20px' : '0', ";}.rdp-week{position:relative;border-top:", small ? '1px solid #d7d7d7' : 'none', ";margin-left:", small ? '20px' : '0', ";}.rdp-week_number{opacity:0.5;}.rdp-week:first-of-type{z-index:2;padding:0;border-right:none;cursor:default;span{color:#8b9898;font-size:", small ? '12px' : '16px', ";width:fit-content;height:unset;}}.rdp-cell{padding:0;border-right:", small ? 'none' : '2px solid #d7d7d7', ";&:focus{outline:none;}}.rdp-week{display:flex;}.rdp-month_grid{&>thead{display:none;}}.rdp-caption_label{display:none;}" + (process.env.NODE_ENV === "production" ? "" : ";label:Wrapper;")));
+const CalendarCell = exports.CalendarCell = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
+  target: "e150zp873"
+} : {
+  target: "e150zp873",
+  label: "CalendarCell"
+})(props => /*#__PURE__*/(0, _react.css)("position:relative;height:8vw;width:10vw;background-color:", props.subtle ? '#F3F3F3' : 'white', ";&.rdp-cell{padding-top:30px;}" + (process.env.NODE_ENV === "production" ? "" : ";label:CalendarCell;")));
+const CalendarDate = exports.CalendarDate = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
+  target: "e150zp872"
+} : {
+  target: "e150zp872",
+  label: "CalendarDate"
+})(process.env.NODE_ENV === "production" ? {
+  name: "1q4vxyr",
+  styles: "margin-left:8px"
+} : {
+  name: "1q4vxyr",
+  styles: "margin-left:8px",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+const CalendarSmallCell = exports.CalendarSmallCell = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
+  target: "e150zp871"
+} : {
+  target: "e150zp871",
+  label: "CalendarSmallCell"
+})(process.env.NODE_ENV === "production" ? {
+  name: "wam8zk",
+  styles: "height:50px;width:10vw"
+} : {
+  name: "wam8zk",
+  styles: "height:50px;width:10vw",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+const CalendarSmallDate = exports.CalendarSmallDate = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
+  target: "e150zp870"
+} : {
+  target: "e150zp870",
+  label: "CalendarSmallDate"
+})(process.env.NODE_ENV === "production" ? {
+  name: "kjj0ot",
+  styles: "padding-top:2px"
+} : {
+  name: "kjj0ot",
+  styles: "padding-top:2px",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});

package/esm/core/Calendar/util.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getEventForDay = void 0;
+var _dates = require("../../utils/dates");
+const getEventForDay = (events, day) => {
+  const res = [];
+  for (let event of events) {
+    if ((0, _dates.datesAreOnSameDay)(event.date, day)) res.push(event);
+  }
+  return res;
+};
+exports.getEventForDay = getEventForDay;