@bbl-digital/snorre 3.1.57 → 3.1.58

package/lib/core/Autocomplete/hooks/useHandleDimentions.js

@@ -1,5 +1,4 @@
 import { createRef, useEffect, useState } from 'react';
-
 const useHandleDimentions = () => {
   const [height, setHeight] = useState(0);
   const [width, setWidth] = useState(0);
@@ -7,7 +6,8 @@ const useHandleDimentions = () => {
   useEffect(() => {
     const rect = dimentionsRef.current?.getBoundingClientRect();
     setHeight(rect?.height || 0);
-    setWidth(rect?.width || 0); // eslint-disable-next-line react-hooks/exhaustive-deps
+    setWidth(rect?.width || 0);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [dimentionsRef.current]);
   return {
     height,
@@ -15,5 +15,4 @@ const useHandleDimentions = () => {
     dimentionsRef
   };
 };
-
 export default useHandleDimentions;

package/lib/core/Autocomplete/index.js

@@ -47,16 +47,15 @@ const Autocomplete = /*#__PURE__*/React.forwardRef(({
       if (node && node.contains(e.target)) return;
       setShowValues(false);
     };
-
     if (showValues) {
       document.addEventListener('mousedown', handleClickOutside);
     } else {
       document.removeEventListener('mousedown', handleClickOutside);
     }
-
     return () => {
       document.removeEventListener('mousedown', handleClickOutside);
-    }; // eslint-disable-next-line react-hooks/exhaustive-deps
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [showValues, valuesRef]);
   return _jsxs(_Fragment, {
     children: [_jsxs("label", {

package/lib/core/Autocomplete/styles.d.ts

@@ -1,23 +1,23 @@
 import { IAppTheme } from '../../app-shell/theme';
 declare const styles: {
-    default: (theme: IAppTheme) => import("@emotion/react").SerializedStyles;
-    label: import("@emotion/react").SerializedStyles;
-    clickableLabel: import("@emotion/react").SerializedStyles;
-    inputWrapper: (theme: IAppTheme) => import("@emotion/react").SerializedStyles;
-    inputBox: import("@emotion/react").SerializedStyles;
-    inputValues: import("@emotion/react").SerializedStyles;
-    validation: import("@emotion/react").SerializedStyles;
-    list: (theme: IAppTheme) => import("@emotion/react").SerializedStyles;
-    highlightedItem: (theme: IAppTheme) => import("@emotion/react").SerializedStyles;
-    listWrapper: (width: number) => import("@emotion/react").SerializedStyles;
-    listWrapperMaxWidth: (width: number) => import("@emotion/react").SerializedStyles;
-    listWrapperTopPosition: (top: number) => import("@emotion/react").SerializedStyles;
-    invalid: (theme: IAppTheme) => import("@emotion/react").SerializedStyles;
-    invalidMessage: (theme: IAppTheme) => import("@emotion/react").SerializedStyles;
-    height: (height: string) => import("@emotion/react").SerializedStyles;
-    disabled: (theme: IAppTheme) => import("@emotion/react").SerializedStyles;
+    default: (theme: IAppTheme) => import("@emotion/utils").SerializedStyles;
+    label: import("@emotion/utils").SerializedStyles;
+    clickableLabel: import("@emotion/utils").SerializedStyles;
+    inputWrapper: (theme: IAppTheme) => import("@emotion/utils").SerializedStyles;
+    inputBox: import("@emotion/utils").SerializedStyles;
+    inputValues: import("@emotion/utils").SerializedStyles;
+    validation: import("@emotion/utils").SerializedStyles;
+    list: (theme: IAppTheme) => import("@emotion/utils").SerializedStyles;
+    highlightedItem: (theme: IAppTheme) => import("@emotion/utils").SerializedStyles;
+    listWrapper: (width: number) => import("@emotion/utils").SerializedStyles;
+    listWrapperMaxWidth: (width: number) => import("@emotion/utils").SerializedStyles;
+    listWrapperTopPosition: (top: number) => import("@emotion/utils").SerializedStyles;
+    invalid: (theme: IAppTheme) => import("@emotion/utils").SerializedStyles;
+    invalidMessage: (theme: IAppTheme) => import("@emotion/utils").SerializedStyles;
+    height: (height: string) => import("@emotion/utils").SerializedStyles;
+    disabled: (theme: IAppTheme) => import("@emotion/utils").SerializedStyles;
 };
-export declare const ErrorMessage: (theme: IAppTheme) => import("@emotion/react").SerializedStyles;
+export declare const ErrorMessage: (theme: IAppTheme) => import("@emotion/utils").SerializedStyles;
 export declare const Clear: import("@emotion/styled").StyledComponent<import("../private/ButtonOrLink").Props & {
     success?: boolean | undefined;
     danger?: boolean | undefined;
@@ -26,7 +26,7 @@ export declare const Clear: import("@emotion/styled").StyledComponent<import("..
     nostyle?: boolean | undefined;
     focusable?: boolean | undefined;
     border?: string | undefined;
-    css?: import("@emotion/react").SerializedStyles | undefined;
+    css?: import("@emotion/utils").SerializedStyles | undefined;
     loading?: boolean | undefined;
     back?: boolean | undefined;
     small?: boolean | undefined;

package/lib/core/Autocomplete/styles.js

@@ -1,7 +1,5 @@
 import _styled from "@emotion/styled/base";
-
 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)."; }
-
 import { css } from '@emotion/react';
 import bp from '../../globals/styles/breakpoints';
 import Button from '../Button';

package/lib/core/Banner/Banner.stories.d.ts

@@ -0,0 +1,23 @@
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Default: {
+    render: () => JSX.Element;
+    name: string;
+};
+export declare const Success: {
+    render: () => JSX.Element;
+    name: string;
+};
+export declare const Info: {
+    render: () => JSX.Element;
+    name: string;
+};
+export declare const Danger: {
+    render: () => JSX.Element;
+    name: string;
+};
+export declare const WithoutChildren: {
+    render: () => JSX.Element;
+    name: string;
+};
+//# sourceMappingURL=Banner.stories.d.ts.map

package/lib/core/Banner/Banner.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Banner.stories.d.ts","sourceRoot":"","sources":["../../../src/packages/core/Banner/Banner.stories.tsx"],"names":[],"mappings":";AAKA,wBAGS;AAET,eAAO,MAAM,OAAO;;;CAgBnB,CAAA;AAED,eAAO,MAAM,OAAO;;;CAUnB,CAAA;AAED,eAAO,MAAM,IAAI;;;CAOhB,CAAA;AAED,eAAO,MAAM,MAAM;;;CAOlB,CAAA;AAED,eAAO,MAAM,eAAe;;;CAW3B,CAAA"}

package/lib/core/Banner/Banner.stories.js

@@ -0,0 +1,68 @@
+import Banner from '.';
+import Header from '../Header';
+import Button from '../Button';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default {
+  title: 'Core/Banner',
+  component: Banner
+};
+export const Default = {
+  render: () => /*#__PURE__*/_jsx(Banner, {
+    header: /*#__PURE__*/_jsx(Header, {
+      level: 4,
+      children: "Title"
+    }),
+    actionButton: /*#__PURE__*/_jsx(Button, {
+      onClick: () => console.log('Hello'),
+      children: "Hello I am button"
+    }),
+    children: "Eu irure eiusmod amet tempor nisi veniam cupidatat duis nulla dolor. Eiusmod amet sit nostrud adipisicing qui pariatur do et duis fugiat magna laboris elit irure. Officia fugiat incididunt ipsum commodo quis aute qui reprehenderit reprehenderit fugiat. Voluptate quis tempor ea consequat."
+  }),
+  name: 'Default'
+};
+export const Success = {
+  render: () => /*#__PURE__*/_jsx(Banner, {
+    success: true,
+    header: /*#__PURE__*/_jsx(Header, {
+      level: 4,
+      children: "Title"
+    }),
+    children: "Eu irure eiusmod amet tempor nisi veniam cupidatat duis nulla dolor. Eiusmod amet sit nostrud adipisicing qui pariatur do et duis fugiat magna laboris elit irure. Officia fugiat incididunt ipsum commodo quis aute qui reprehenderit reprehenderit fugiat. Voluptate quis tempor ea consequat."
+  }),
+  name: 'Success'
+};
+export const Info = {
+  render: () => /*#__PURE__*/_jsx(Banner, {
+    info: true,
+    header: /*#__PURE__*/_jsx(Header, {
+      level: 4,
+      children: "Title"
+    }),
+    children: "Content"
+  }),
+  name: 'Info'
+};
+export const Danger = {
+  render: () => /*#__PURE__*/_jsx(Banner, {
+    danger: true,
+    header: /*#__PURE__*/_jsx(Header, {
+      level: 4,
+      children: "Title"
+    }),
+    children: "Content"
+  }),
+  name: 'Danger'
+};
+export const WithoutChildren = {
+  render: () => /*#__PURE__*/_jsx(Banner, {
+    header: /*#__PURE__*/_jsx(Header, {
+      level: 4,
+      children: "Just a header"
+    }),
+    actionButton: /*#__PURE__*/_jsx(Button, {
+      onClick: () => console.log('Hello'),
+      children: "And a button"
+    })
+  }),
+  name: 'Without children'
+};

package/lib/core/Banner/index.js

@@ -4,7 +4,6 @@ import Alert from '../Alert';
 import { Content, LeftSide, RightSide, Wrapper } from './styles';
 import { jsx as _jsx } from "@emotion/react/jsx-runtime";
 import { jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-
 const Banner = ({
   children,
   danger,
@@ -31,5 +30,4 @@ const Banner = ({
     })
   });
 };
-
 export default Banner;

package/lib/core/Banner/styles.js

@@ -1,21 +1,19 @@
 import _styled from "@emotion/styled/base";
-
 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)."; }
-
 import bp from '../../globals/styles/breakpoints';
-export const Wrapper = _styled("div", process.env.NODE_ENV === "production" ? {
+export const Wrapper = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
   target: "ec636p03"
 } : {
   target: "ec636p03",
   label: "Wrapper"
 })("display:flex;flex-direction:row;width:100%;justify-content:space-between;@media screen and (max-width: ", bp.small, "){flex-direction:column;text-align:center;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9wYWNrYWdlcy9jb3JlL0Jhbm5lci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBR2lDIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9wYWNrYWdlcy9jb3JlL0Jhbm5lci9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCBicCBmcm9tICcuLi8uLi9nbG9iYWxzL3N0eWxlcy9icmVha3BvaW50cydcblxuZXhwb3J0IGNvbnN0IFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogcm93O1xuICB3aWR0aDogMTAwJTtcbiAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuO1xuXG4gIEBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6ICR7YnAuc21hbGx9KSB7XG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gIH1cbmBcblxuZXhwb3J0IGNvbnN0IENvbnRlbnQgPSBzdHlsZWQuZGl2YGBcblxuZXhwb3J0IGNvbnN0IExlZnRTaWRlID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZ3JpZDtcbiAgZ3JpZC1yb3ctZ2FwOiAwLjVlbTtcblxuICBoMSxcbiAgaDIsXG4gIGgzLFxuICBoNCxcbiAgaDUge1xuICAgIGFsaWduLXNlbGY6IGNlbnRlcjtcbiAgfVxuYFxuXG5leHBvcnQgY29uc3QgUmlnaHRTaWRlID0gc3R5bGVkLmRpdmBcbiAgbWFyZ2luLWxlZnQ6IDJlbTtcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcblxuICBAbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiAke2JwLnNtYWxsfSkge1xuICAgIG1hcmdpbi1sZWZ0OiAwO1xuICAgIG1hcmdpbi10b3A6IDJlbTtcbiAgICBhbGlnbi1zZWxmOiBjZW50ZXI7XG4gIH1cblxuICBidXR0b24sXG4gIGEge1xuICAgIG1pbi13aWR0aDogMTY5cHg7XG4gIH1cbmBcbiJdfQ== */"));
-export const Content = _styled("div", process.env.NODE_ENV === "production" ? {
+export const Content = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
   target: "ec636p02"
 } : {
   target: "ec636p02",
   label: "Content"
 })(process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9wYWNrYWdlcy9jb3JlL0Jhbm5lci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZWlDIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9wYWNrYWdlcy9jb3JlL0Jhbm5lci9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCBicCBmcm9tICcuLi8uLi9nbG9iYWxzL3N0eWxlcy9icmVha3BvaW50cydcblxuZXhwb3J0IGNvbnN0IFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogcm93O1xuICB3aWR0aDogMTAwJTtcbiAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuO1xuXG4gIEBtZWRpYSBzY3JlZW4gYW5kIChtYXgtd2lkdGg6ICR7YnAuc21hbGx9KSB7XG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gIH1cbmBcblxuZXhwb3J0IGNvbnN0IENvbnRlbnQgPSBzdHlsZWQuZGl2YGBcblxuZXhwb3J0IGNvbnN0IExlZnRTaWRlID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZ3JpZDtcbiAgZ3JpZC1yb3ctZ2FwOiAwLjVlbTtcblxuICBoMSxcbiAgaDIsXG4gIGgzLFxuICBoNCxcbiAgaDUge1xuICAgIGFsaWduLXNlbGY6IGNlbnRlcjtcbiAgfVxuYFxuXG5leHBvcnQgY29uc3QgUmlnaHRTaWRlID0gc3R5bGVkLmRpdmBcbiAgbWFyZ2luLWxlZnQ6IDJlbTtcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcblxuICBAbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiAke2JwLnNtYWxsfSkge1xuICAgIG1hcmdpbi1sZWZ0OiAwO1xuICAgIG1hcmdpbi10b3A6IDJlbTtcbiAgICBhbGlnbi1zZWxmOiBjZW50ZXI7XG4gIH1cblxuICBidXR0b24sXG4gIGEge1xuICAgIG1pbi13aWR0aDogMTY5cHg7XG4gIH1cbmBcbiJdfQ== */");
-export const LeftSide = _styled("div", process.env.NODE_ENV === "production" ? {
+export const LeftSide = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
   target: "ec636p01"
 } : {
   target: "ec636p01",
@@ -29,7 +27,7 @@ export const LeftSide = _styled("div", process.env.NODE_ENV === "production" ? {
   map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9wYWNrYWdlcy9jb3JlL0Jhbm5lci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBaUJrQyIsImZpbGUiOiIuLi8uLi8uLi9zcmMvcGFja2FnZXMvY29yZS9CYW5uZXIvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgYnAgZnJvbSAnLi4vLi4vZ2xvYmFscy9zdHlsZXMvYnJlYWtwb2ludHMnXG5cbmV4cG9ydCBjb25zdCBXcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC1kaXJlY3Rpb246IHJvdztcbiAgd2lkdGg6IDEwMCU7XG4gIGp1c3RpZnktY29udGVudDogc3BhY2UtYmV0d2VlbjtcblxuICBAbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiAke2JwLnNtYWxsfSkge1xuICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG4gICAgdGV4dC1hbGlnbjogY2VudGVyO1xuICB9XG5gXG5cbmV4cG9ydCBjb25zdCBDb250ZW50ID0gc3R5bGVkLmRpdmBgXG5cbmV4cG9ydCBjb25zdCBMZWZ0U2lkZSA9IHN0eWxlZC5kaXZgXG4gIGRpc3BsYXk6IGdyaWQ7XG4gIGdyaWQtcm93LWdhcDogMC41ZW07XG5cbiAgaDEsXG4gIGgyLFxuICBoMyxcbiAgaDQsXG4gIGg1IHtcbiAgICBhbGlnbi1zZWxmOiBjZW50ZXI7XG4gIH1cbmBcblxuZXhwb3J0IGNvbnN0IFJpZ2h0U2lkZSA9IHN0eWxlZC5kaXZgXG4gIG1hcmdpbi1sZWZ0OiAyZW07XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cbiAgQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogJHticC5zbWFsbH0pIHtcbiAgICBtYXJnaW4tbGVmdDogMDtcbiAgICBtYXJnaW4tdG9wOiAyZW07XG4gICAgYWxpZ24tc2VsZjogY2VudGVyO1xuICB9XG5cbiAgYnV0dG9uLFxuICBhIHtcbiAgICBtaW4td2lkdGg6IDE2OXB4O1xuICB9XG5gXG4iXX0= */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
-export const RightSide = _styled("div", process.env.NODE_ENV === "production" ? {
+export const RightSide = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
   target: "ec636p00"
 } : {
   target: "ec636p00",

package/lib/core/BarAndLineComposedChart/BarAndLineComposedChart.stories.d.ts

@@ -0,0 +1,8 @@
+import { LoadedType } from '../../shared/types/LoadedType';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Default: {
+    render: (_args: unknown, { loaded: { theme } }: LoadedType) => JSX.Element;
+    name: string;
+};
+//# sourceMappingURL=BarAndLineComposedChart.stories.d.ts.map

package/lib/core/BarAndLineComposedChart/BarAndLineComposedChart.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BarAndLineComposedChart.stories.d.ts","sourceRoot":"","sources":["../../../src/packages/core/BarAndLineComposedChart/BarAndLineComposedChart.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAA;;AAE1D,wBAGS;AAiBT,eAAO,MAAM,OAAO;oBACF,OAAO,yBAAyB,UAAU;;CA6B3D,CAAA"}

package/lib/core/BarAndLineComposedChart/BarAndLineComposedChart.stories.js

@@ -0,0 +1,94 @@
+import BarAndLineComposedChart from '.';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default {
+  title: 'Core/BarAndLineComposedChart',
+  component: BarAndLineComposedChart
+};
+const DefaultData = [{
+  name: 'Jan',
+  inntekt: 40000,
+  kostnad: -23000,
+  akkumulert: 17000
+}, {
+  name: 'Feb',
+  inntekt: 60000,
+  kostnad: -25000,
+  akkumulert: 35000
+}, {
+  name: 'Mars',
+  inntekt: 50000,
+  kostnad: -34000,
+  akkumulert: 16000
+}, {
+  name: 'April',
+  inntekt: 55000,
+  kostnad: -20000,
+  akkumulert: 35000
+}, {
+  name: 'Mai',
+  inntekt: 54400,
+  kostnad: -30000,
+  akkumulert: 24400
+}, {
+  name: 'Jun',
+  inntekt: 65000,
+  kostnad: -25000,
+  akkumulert: 40000
+}, {
+  name: 'Jul',
+  inntekt: 43000,
+  kostnad: -30000,
+  akkumulert: 13000
+}, {
+  name: 'Aug',
+  inntekt: 60000,
+  kostnad: -40000,
+  akkumulert: 20000
+}, {
+  name: 'Sept',
+  inntekt: 70000,
+  kostnad: -50000,
+  akkumulert: 20000
+}, {
+  name: 'Okt',
+  inntekt: 60000,
+  kostnad: -34000,
+  akkumulert: 26000
+}, {
+  name: 'Nov',
+  inntekt: 40040,
+  kostnad: -24000,
+  akkumulert: 16040
+}, {
+  name: 'Des',
+  inntekt: 56000,
+  kostnad: -5500,
+  akkumulert: 50500
+}];
+export const Default = {
+  render: (_args, {
+    loaded: {
+      theme
+    }
+  }) => /*#__PURE__*/_jsx(BarAndLineComposedChart, {
+    data: DefaultData,
+    bars: [{
+      name: 'Inntekt',
+      dataKey: 'inntekt',
+      fill: theme.primary
+    }, {
+      name: 'Kostnad',
+      dataKey: 'kostnad',
+      fill: theme.primary5darker
+    }],
+    lines: [{
+      name: 'Akkumulert resultat',
+      dataKey: 'akkumulert',
+      stroke: theme.secondary,
+      type: 'monotone',
+      shortName: 'Akk. resultat'
+    }],
+    xAxisDataKey: "name"
+  }),
+  name: 'Default'
+};

package/lib/core/BarAndLineComposedChart/index.js

@@ -6,7 +6,6 @@ import { formatAxisPrice } from '../../utils/formatGraphPrice';
 import { BarAndLineComposedChartContainer } from './styles';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-
 const BarAndLineComposedChart = ({
   data = [],
   bars,
@@ -97,5 +96,4 @@ const BarAndLineComposedChart = ({
     })
   });
 };
-
 export default BarAndLineComposedChart;

package/lib/core/BarAndLineComposedChart/styles.js

@@ -1,5 +1,5 @@
 import _styled from "@emotion/styled/base";
-export const BarAndLineComposedChartContainer = _styled("div", process.env.NODE_ENV === "production" ? {
+export const BarAndLineComposedChartContainer = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
   target: "e15fv7zs0"
 } : {
   target: "e15fv7zs0",

package/lib/core/BarChartWithCustomizedEvent/BarChartWithCustomizedEvent.stories.d.ts

@@ -0,0 +1,14 @@
+import { LoadedType } from '../../shared/types/LoadedType';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
+export default _default;
+export declare const BarChartCustomizedEventData: {
+    year: number;
+    debt: number;
+    interestRates: number;
+    deduction: number;
+}[];
+export declare const Default: {
+    render: (_args: unknown, { loaded: { theme } }: LoadedType) => JSX.Element;
+    name: string;
+};
+//# sourceMappingURL=BarChartWithCustomizedEvent.stories.d.ts.map

package/lib/core/BarChartWithCustomizedEvent/BarChartWithCustomizedEvent.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BarChartWithCustomizedEvent.stories.d.ts","sourceRoot":"","sources":["../../../src/packages/core/BarChartWithCustomizedEvent/BarChartWithCustomizedEvent.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAA;;AAE1D,wBAGS;AAET,eAAO,MAAM,2BAA2B;;;;;GAmEvC,CAAA;AAED,eAAO,MAAM,OAAO;oBACF,OAAO,yBAAyB,UAAU;;CAiB3D,CAAA"}

package/lib/core/BarChartWithCustomizedEvent/BarChartWithCustomizedEvent.stories.js

@@ -0,0 +1,80 @@
+import BarChartWithCustomizedEvent from '.';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default {
+  title: 'Core/BarChartWithCustomizedEvent',
+  component: BarChartWithCustomizedEvent
+};
+export const BarChartCustomizedEventData = [{
+  year: 2020,
+  debt: 2500700,
+  interestRates: 12000,
+  deduction: 140000
+}, {
+  year: 2021,
+  debt: 1950000,
+  interestRates: 12000,
+  deduction: 140000
+}, {
+  year: 2022,
+  debt: 1600000,
+  interestRates: 12000,
+  deduction: 140000
+}, {
+  year: 2023,
+  debt: 1400000,
+  interestRates: 12000,
+  deduction: 140400
+}, {
+  year: 2024,
+  debt: 1100000,
+  interestRates: 12000,
+  deduction: 14000
+}, {
+  year: 2025,
+  debt: 1000000,
+  interestRates: 12000,
+  deduction: 14000
+}, {
+  year: 2026,
+  debt: 900000,
+  interestRates: 12000,
+  deduction: 14000
+}, {
+  year: 2027,
+  debt: 750000,
+  interestRates: 12000,
+  deduction: 14000
+}, {
+  year: 2028,
+  debt: 500000,
+  interestRates: 12000,
+  deduction: 14000
+}, {
+  year: 2029,
+  debt: 300000,
+  interestRates: 12000,
+  deduction: 14000
+}, {
+  year: 2030,
+  debt: 150000,
+  interestRates: 12000,
+  deduction: 14000
+}];
+export const Default = {
+  render: (_args, {
+    loaded: {
+      theme
+    }
+  }) => /*#__PURE__*/_jsx(BarChartWithCustomizedEvent, {
+    data: BarChartCustomizedEventData,
+    bars: [{
+      name: 'Restgjeld',
+      dataKey: 'debt',
+      fill: theme.primary
+    }],
+    xAxisDataKey: "year",
+    selectedIndex: 0,
+    onClickBar: v => console.log('onClickBar', v)
+  }),
+  name: 'Default'
+};

package/lib/core/BarChartWithCustomizedEvent/index.js

@@ -31,10 +31,8 @@ export const BarChartWithCustomizedEvent = ({
 }) => {
   const theme = useTheme();
   const [hoverIndex, setHoverIndex] = useState(undefined);
-
   const handleBarClick = (_, index) => {
     const identicalIndex = index === selectedIndex;
-
     if (onClickBar && !identicalIndex) {
       onClickBar({
         data: data[index],
@@ -42,7 +40,6 @@ export const BarChartWithCustomizedEvent = ({
       });
     }
   };
-
   return /*#__PURE__*/_jsx(CustomEventBarChartContainer, {
     width: width && width,
     height: height && height,

package/lib/core/BarChartWithCustomizedEvent/styles.js

@@ -1,6 +1,6 @@
 import _styled from "@emotion/styled/base";
 import { css } from '@emotion/react';
-export const CustomEventBarChartContainer = _styled("div", process.env.NODE_ENV === "production" ? {
+export const CustomEventBarChartContainer = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
   target: "etqd4lk0"
 } : {
   target: "etqd4lk0",

package/lib/core/Box/Box.stories.d.ts

@@ -0,0 +1,39 @@
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Default: {
+    render: () => JSX.Element;
+    name: string;
+};
+export declare const Collapsable: {
+    render: () => JSX.Element;
+    name: string;
+};
+export declare const Rounded: {
+    render: () => JSX.Element;
+    name: string;
+};
+export declare const WithHeader: {
+    render: () => JSX.Element;
+    name: string;
+};
+export declare const WithHeaderAndCollapse: {
+    render: () => JSX.Element;
+    name: string;
+};
+export declare const CollapsableMysite: {
+    render: () => JSX.Element;
+    name: string;
+};
+export declare const Noshadow: {
+    render: () => JSX.Element;
+    name: string;
+};
+export declare const Background: {
+    render: () => JSX.Element;
+    name: string;
+};
+export declare const HideContent: {
+    render: () => JSX.Element;
+    name: string;
+};
+//# sourceMappingURL=Box.stories.d.ts.map

package/lib/core/Box/Box.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Box.stories.d.ts","sourceRoot":"","sources":["../../../src/packages/core/Box/Box.stories.tsx"],"names":[],"mappings":";AAIA,wBAGS;AAET,eAAO,MAAM,OAAO;;;CAGnB,CAAA;AAED,eAAO,MAAM,WAAW;;;CAOvB,CAAA;AAED,eAAO,MAAM,OAAO;;;CAGnB,CAAA;AAED,eAAO,MAAM,UAAU;;;CAGtB,CAAA;AAED,eAAO,MAAM,qBAAqB;;;CAOjC,CAAA;AAED,eAAO,MAAM,iBAAiB;;;CAO7B,CAAA;AAED,eAAO,MAAM,QAAQ;;;CAGpB,CAAA;AAED,eAAO,MAAM,UAAU;;;CAGtB,CAAA;AAED,eAAO,MAAM,WAAW;;;CAOvB,CAAA"}

package/lib/core/Box/Box.stories.js

@@ -0,0 +1,89 @@
+import Header from '../Header';
+import Box from '.';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default {
+  title: 'Core/Box',
+  component: Box
+};
+export const Default = {
+  render: () => /*#__PURE__*/_jsx(Box, {
+    children: "Stuff"
+  }),
+  name: 'Default'
+};
+export const Collapsable = {
+  render: () => /*#__PURE__*/_jsx(Box, {
+    header: /*#__PURE__*/_jsx(Header, {
+      level: 3,
+      children: "Header"
+    }),
+    collapsable: true,
+    children: "Stuff"
+  }),
+  name: 'Collapsable'
+};
+export const Rounded = {
+  render: () => /*#__PURE__*/_jsx(Box, {
+    type: "mysite",
+    children: "Stuff"
+  }),
+  name: 'Rounded'
+};
+export const WithHeader = {
+  render: () => /*#__PURE__*/_jsx(Box, {
+    header: /*#__PURE__*/_jsx(Header, {
+      level: 3,
+      children: "Header"
+    }),
+    children: "Stuff"
+  }),
+  name: 'With header'
+};
+export const WithHeaderAndCollapse = {
+  render: () => /*#__PURE__*/_jsx(Box, {
+    header: /*#__PURE__*/_jsx(Header, {
+      level: 3,
+      children: "Header"
+    }),
+    collapsable: true,
+    children: "Stuff"
+  }),
+  name: 'With header and collapse'
+};
+export const CollapsableMysite = {
+  render: () => /*#__PURE__*/_jsx(Box, {
+    header: /*#__PURE__*/_jsx(Header, {
+      level: 3,
+      children: "Header"
+    }),
+    collapsable: true,
+    type: "mysite",
+    children: "Stuff"
+  }),
+  name: 'Collapsable mysite'
+};
+export const Noshadow = {
+  render: () => /*#__PURE__*/_jsx(Box, {
+    noshadow: true,
+    children: "Stuff"
+  }),
+  name: 'Noshadow'
+};
+export const Background = {
+  render: () => /*#__PURE__*/_jsx(Box, {
+    background: "#ececec",
+    children: "Stuff"
+  }),
+  name: 'Background'
+};
+export const HideContent = {
+  render: () => /*#__PURE__*/_jsx(Box, {
+    header: /*#__PURE__*/_jsx(Header, {
+      level: 3,
+      children: "Header"
+    }),
+    hideContent: true,
+    children: "Content"
+  }),
+  name: 'Hide content'
+};

package/lib/core/Box/index.js

@@ -6,7 +6,6 @@ import IconPlus from '../../icons/General/IconPlus';
 import IconChevronDown from '../../icons/General/IconChevronDown';
 import { jsx as _jsx } from "@emotion/react/jsx-runtime";
 import { jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-
 const Box = ({
   header,
   collapsable,
@@ -26,11 +25,9 @@ const Box = ({
   useEffect(() => {
     if (handleOpenState !== undefined) setIsOpen(handleOpenState);
   }, [handleOpenState]);
-
   const onCollapseIconClicked = e => {
     setIsOpen(!isOpen);
   };
-
   const icon = collapseIcon === 'plus/minus' ? isOpen ? _jsx(IconMinus, {}) : _jsx(IconPlus, {}) : _jsx(IconChevronDown, {
     flipVertical: isOpen,
     size: "14px"
@@ -56,5 +53,4 @@ const Box = ({
     })]
   });
 };
-
 export default Box;