@bbl-digital/snorre 4.0.0-beta.4 → 4.0.0-beta.5

package/esm/core/Tag/Tag.stories.js

@@ -0,0 +1,112 @@
+import Tag from '.';
+import IconComment from '../../icons/General/IconComment';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default {
+  title: 'Core/Tag',
+  component: Tag
+};
+export const Default = {
+  render: () => /*#__PURE__*/_jsx(Tag, {
+    children: "Here"
+  }),
+  name: 'Default'
+};
+export const Neutral = {
+  render: () => /*#__PURE__*/_jsx(Tag, {
+    neutral: true,
+    children: "Here"
+  }),
+  name: 'Neutral'
+};
+export const Success = {
+  render: () => /*#__PURE__*/_jsx(Tag, {
+    success: true,
+    children: "Here"
+  }),
+  name: 'Success'
+};
+export const Info = {
+  render: () => /*#__PURE__*/_jsx(Tag, {
+    info: true,
+    children: "Here"
+  }),
+  name: 'Info'
+};
+export const Danger = {
+  render: () => /*#__PURE__*/_jsx(Tag, {
+    danger: true,
+    children: "Here"
+  }),
+  name: 'Danger'
+};
+export const Dark = {
+  render: () => /*#__PURE__*/_jsx(Tag, {
+    dark: true,
+    children: "Here"
+  }),
+  name: 'Dark'
+};
+export const Light = {
+  render: () => /*#__PURE__*/_jsx(Tag, {
+    light: true,
+    children: "Here"
+  }),
+  name: 'Light'
+};
+export const Outline = {
+  render: () => /*#__PURE__*/_jsx(Tag, {
+    outline: true,
+    children: "There"
+  }),
+  name: 'Outline'
+};
+export const TagWithClose = {
+  render: () => /*#__PURE__*/_jsx(Tag, {
+    withclose: true,
+    onClick: () => console.log('close'),
+    children: "Here"
+  }),
+  name: 'Tag with close'
+};
+export const TagWithLoading = {
+  render: () => /*#__PURE__*/_jsx(Tag, {
+    loading: true,
+    children: "Here"
+  }),
+  name: 'Tag with loading'
+};
+export const TagWithCloseAndStrictClick = {
+  render: () => /*#__PURE__*/_jsx(Tag, {
+    strictClose: true,
+    onClick: () => console.log('close'),
+    children: "Here"
+  }),
+  name: 'Tag with close and strict click'
+};
+export const TagWithCloseLoadingAndStrictClick = {
+  render: () => /*#__PURE__*/_jsx(Tag, {
+    strictClose: true,
+    loading: true,
+    onClick: () => console.log('close'),
+    children: "Here"
+  }),
+  name: 'Tag with close, loading and strict click'
+};
+export const TagWithCloseAndStrictClickWithColor = {
+  render: () => /*#__PURE__*/_jsx(Tag, {
+    strictClose: true,
+    closeColor: "red",
+    onClick: () => console.log('close'),
+    children: "Here"
+  }),
+  name: 'Tag with close and strict click with color'
+};
+export const WithIcon = {
+  render: () => /*#__PURE__*/_jsx(Tag, {
+    icon: /*#__PURE__*/_jsx(IconComment, {
+      size: 14
+    }),
+    children: "3"
+  }),
+  name: 'With icon'
+};

package/esm/core/Tag/index.js

@@ -7,7 +7,6 @@ import Spinner from '../Spinner';
 import { jsx as _jsx } from "@emotion/react/jsx-runtime";
 import { Fragment as _Fragment } from "@emotion/react/jsx-runtime";
 import { jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-
 const Tag = ({
   icon,
   trackingEvent,
@@ -41,5 +40,4 @@ const Tag = ({
     })]
   });
 };
-
 export default Tag;

package/esm/core/Tag/styles.js

@@ -1,5 +1,4 @@
 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';
 const styles = {
   default: theme => /*#__PURE__*/css({

package/esm/core/Text/Text.stories.js

@@ -0,0 +1,103 @@
+import Text from '.';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default {
+  title: 'Core/Text',
+  component: Text
+};
+export const Default = {
+  render: () => /*#__PURE__*/_jsx(Text, {
+    children: "Default"
+  }),
+  name: 'Default'
+};
+export const Paragraph = {
+  render: () => /*#__PURE__*/_jsx(Text, {
+    paragraph: true,
+    children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. In placerat neque dapibus diam feugiat pretium. Aliquam blandit massa a massa consectetur fringilla. Fusce convallis euismod erat, sit amet rhoncus justo tempor vel. Ut nec ipsum risus. Integer sapien felis, pellentesque sit amet ante at, commodo efficitur tellus. Vivamus facilisis aliquet arcu in ornare. Vestibulum elementum volutpat nisl ac bibendum. Duis ac quam vulputate, pulvinar libero sit amet, mattis massa. Aenean non libero eu ex lacinia suscipit id eu nisi. Praesent vitae gravida neque. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc suscipit tempor nunc venenatis eleifend. Donec ipsum urna, rutrum quis facilisis non, varius non urna. Integer laoreet, nulla non rhoncus rutrum, sapien elit pretium turpis, sit amet commodo ex augue a leo."
+  }),
+  name: 'Paragraph'
+};
+export const Intro = {
+  render: () => /*#__PURE__*/_jsx(Text, {
+    intro: true,
+    children: "Intro text"
+  }),
+  name: 'Intro'
+};
+export const Small = {
+  render: () => /*#__PURE__*/_jsx(Text, {
+    small: true,
+    children: "Small"
+  }),
+  name: 'Small'
+};
+export const Semibold = {
+  render: () => /*#__PURE__*/_jsx(Text, {
+    semibold: true,
+    children: "Semibold"
+  }),
+  name: 'Semibold'
+};
+export const Customcolor = {
+  render: () => /*#__PURE__*/_jsx(Text, {
+    color: "red",
+    children: "Semibold"
+  }),
+  name: 'Customcolor'
+};
+export const Primary = {
+  render: () => /*#__PURE__*/_jsx(Text, {
+    primary: true,
+    children: "Primary"
+  }),
+  name: 'Primary'
+};
+export const Secondary = {
+  render: () => /*#__PURE__*/_jsx(Text, {
+    secondary: true,
+    children: "Secondary"
+  }),
+  name: 'Secondary'
+};
+export const Title = {
+  render: () => /*#__PURE__*/_jsx(Text, {
+    title: "Hello there",
+    children: "Hover me!"
+  }),
+  name: 'Title'
+};
+export const Italic = {
+  render: () => /*#__PURE__*/_jsx(Text, {
+    italic: true,
+    children: "Italic font style"
+  }),
+  name: 'Italic'
+};
+export const Align = {
+  render: () => /*#__PURE__*/_jsx(Text, {
+    align: "right",
+    children: "Text align right"
+  }),
+  name: 'Align'
+};
+export const WordBreak = {
+  render: () => /*#__PURE__*/_jsx(Text, {
+    wordBreak: "break-all",
+    children: "Really\\_long\\_word\\_being\\_broken\\_up\\_\\_Really\\_long\\_word\\_being\\_broken\\_up\\_\\_Really\\_long\\_word\\_being\\_broken\\_up\\_\\_Really\\_long\\_word\\_being\\_broken\\_up\\_\\_"
+  }),
+  name: 'WordBreak'
+};
+export const WhiteSpace = {
+  render: () => /*#__PURE__*/_jsx(Text, {
+    whiteSpace: "pre-wrap",
+    children: 'Text with\nnewline'
+  }),
+  name: 'WhiteSpace'
+};
+export const Subtle = {
+  render: () => /*#__PURE__*/_jsx(Text, {
+    subtle: true,
+    children: "Subtle text"
+  }),
+  name: 'subtle'
+};

package/esm/core/Text/index.js

@@ -2,7 +2,6 @@
 import React from 'react';
 import { styles } from './styles';
 import { jsx as _jsx } from "@emotion/react/jsx-runtime";
-
 const Text = ({
   paragraph,
   intro,
@@ -32,5 +31,4 @@ const Text = ({
     children: children
   });
 };
-
 export default Text;

package/esm/core/Text/styles.js

@@ -1,5 +1,4 @@
 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';
 const styles = {
   default: (theme, color) => /*#__PURE__*/css({

package/esm/core/Textarea/Textarea.stories.js

@@ -0,0 +1,33 @@
+import Textarea from '.';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default {
+  title: 'Core/Textarea',
+  component: Textarea
+};
+export const Default = {
+  render: () => /*#__PURE__*/_jsx(Textarea, {
+    label: "Textarea",
+    onChange: e => console.log('changes', e),
+    placeholder: "Placeholder...",
+    onBlur: () => console.log('blur')
+  }),
+  name: 'Default'
+};
+export const Value = {
+  render: () => /*#__PURE__*/_jsx(Textarea, {
+    value: "Deafult value"
+  }),
+  name: 'Value'
+};
+export const Validation = {
+  render: () => /*#__PURE__*/_jsx(Textarea, {
+    invalidMessage: "Error"
+  }),
+  name: 'Validation'
+};
+export const MaxHeight = {
+  render: () => /*#__PURE__*/_jsx(Textarea, {
+    maxHeight: "200px"
+  }),
+  name: 'Max height'
+};

package/esm/core/Textarea/index.js

@@ -5,7 +5,6 @@ import { IconErrorOutline } from '../..';
 import { useTheme } from '@emotion/react';
 import { jsx as _jsx } from "@emotion/react/jsx-runtime";
 import { jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-
 const Textarea = ({
   label,
   value = '',
@@ -21,15 +20,12 @@ const Textarea = ({
 }) => {
   const theme = useTheme();
   const [inputValue, setInputValue] = useState(value);
-
   const handleChange = e => {
     setInputValue(e.target.value);
-
     if (onChange) {
       onChange(e.target.value);
     }
   };
-
   useEffect(() => {
     setInputValue(value);
   }, [value]);
@@ -56,5 +52,4 @@ const Textarea = ({
     })]
   });
 };
-
 export default Textarea;

package/esm/core/Textarea/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';
 export const styles = {
   default: theme => /*#__PURE__*/css("width:100%;padding:0.75em;border:1px solid #d7d7d7;border-radius:3px;font-size:16px;box-sizing:border-box;outline:0;min-height:50px;&:focus{border:2px solid ", theme.border, ";padding:calc(0.75em - 1px);}" + (process.env.NODE_ENV === "production" ? "" : ";label:default;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9wYWNrYWdlcy9jb3JlL1RleHRhcmVhL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLb0MiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL3BhY2thZ2VzL2NvcmUvVGV4dGFyZWEvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcbmltcG9ydCB7IElBcHBUaGVtZSB9IGZyb20gJy4uLy4uL2FwcC1zaGVsbC90aGVtZSdcblxuZXhwb3J0IGNvbnN0IHN0eWxlcyA9IHtcbiAgZGVmYXVsdDogKHRoZW1lOiBJQXBwVGhlbWUpID0+IGNzc2BcbiAgICB3aWR0aDogMTAwJTtcbiAgICBwYWRkaW5nOiAwLjc1ZW07XG4gICAgYm9yZGVyOiAxcHggc29saWQgI2Q3ZDdkNztcbiAgICBib3JkZXItcmFkaXVzOiAzcHg7XG4gICAgZm9udC1zaXplOiAxNnB4O1xuICAgIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG4gICAgb3V0bGluZTogMDtcbiAgICBtaW4taGVpZ2h0OiA1MHB4O1xuXG4gICAgJjpmb2N1cyB7XG4gICAgICBib3JkZXI6IDJweCBzb2xpZCAke3RoZW1lLmJvcmRlcn07XG4gICAgICBwYWRkaW5nOiBjYWxjKDAuNzVlbSAtIDFweCk7IC8vIGNvbXBlbnNhdGUgZm9yIGJvcmRlci13aXRoIHJlc2l6ZVxuICAgIH1cbiAgYCxcbiAgcmVzaXplOiAocmVzaXplOiBzdHJpbmcpID0+IGNzc2BcbiAgICByZXNpemU6ICR7cmVzaXplfTtcbiAgYCxcbiAgbWF4SGVpZ2h0OiAodmFsdWU6IHN0cmluZykgPT4gY3NzYFxuICAgIG1heC1oZWlnaHQ6ICR7dmFsdWV9O1xuICBgLFxufVxuXG5leHBvcnQgY29uc3QgV3JhcHBlciA9IHN0eWxlZC5kaXZgXG4gIGRpc3BsYXk6IGdyaWQ7XG4gIGdyaWQtcm93LWdhcDogMC41ZW07XG5gXG5cbmV4cG9ydCBjb25zdCBMYWJlbCA9IHN0eWxlZC5sYWJlbGBcbiAgZm9udC1zaXplOiAxNnB4O1xuICBmb250LXdlaWdodDogNjAwO1xuICBoZWlnaHQ6IDIwcHg7XG4gIGxpbmUtaGVpZ2h0OiAyMHB4O1xuYFxuXG5leHBvcnQgY29uc3QgRXJyb3JNZXNzYWdlID0gc3R5bGVkLnNwYW4oXG4gIChwcm9wczogYW55KSA9PiBjc3NgXG4gICAgZm9udC1zaXplOiAxNHB4O1xuICAgIHBhZGRpbmctbGVmdDogMjVweDtcbiAgICBtYXJnaW4tYm90dG9tOiAwO1xuICAgIGNvbG9yOiAke3Byb3BzLnRoZW1lLmFsZXJ0fTtcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG5cbiAgICBzdmcge1xuICAgICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgICAgbGVmdDogM3B4O1xuICAgICAgcGF0aCB7XG4gICAgICAgIGZpbGw6ICR7cHJvcHMudGhlbWUuYWxlcnR9O1xuICAgICAgfVxuICAgIH1cbiAgYFxuKVxuIl19 */"),

package/esm/core/Timeline/Timeline.stories.js

@@ -0,0 +1,25 @@
+import Timeline from '.';
+import TimelineStep from './TimelineStep';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export default {
+  title: 'Core/Timeline',
+  component: Timeline
+};
+export const TimelineDefault = {
+  render: () => /*#__PURE__*/_jsxs(Timeline, {
+    children: [/*#__PURE__*/_jsx(TimelineStep, {
+      title: "Step 1",
+      text: "Completed step",
+      complete: true
+    }), /*#__PURE__*/_jsx(TimelineStep, {
+      title: "Step 2",
+      text: "This is the active step",
+      active: true
+    }), /*#__PURE__*/_jsx(TimelineStep, {
+      title: "Step 3",
+      text: "Upcoming step"
+    })]
+  }),
+  name: 'Timeline'
+};

package/esm/core/Timeline/TimelineStep/index.js

@@ -5,7 +5,6 @@ import Text from '../../Text';
 import { TextWrapper, Wrapper, Circle, styles } from './styles';
 import { jsx as _jsx } from "@emotion/react/jsx-runtime";
 import { jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-
 const TimelineStep = ({
   title,
   text,
@@ -29,5 +28,4 @@ const TimelineStep = ({
     })]
   });
 };
-
 export default TimelineStep;

package/esm/core/Timeline/TimelineStep/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';
 export const Wrapper = _styled("div", process.env.NODE_ENV === "production" ? {
   target: "e1iuee1r2"

package/esm/core/Timeline/index.js

@@ -1,7 +1,6 @@
 import React from 'react';
 import { Wrapper } from './styles';
 import { jsx as _jsx } from "react/jsx-runtime";
-
 const Timeline = ({
   children
 }) => {
@@ -9,5 +8,4 @@ const Timeline = ({
     children: children
   });
 };
-
 export default Timeline;

package/esm/core/Timeline/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)."; }
-
 export const Wrapper = _styled("div", process.env.NODE_ENV === "production" ? {
   target: "eqhi0tv0"
 } : {

package/esm/core/Timepicker/Timepicker.stories.js

@@ -0,0 +1,77 @@
+import Timepicker from '.';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default {
+  title: 'Core/Timepicker',
+  component: Timepicker
+};
+export const TimepickerDefault = {
+  render: () => /*#__PURE__*/_jsx(Timepicker, {
+    type: "string",
+    value: "00:30",
+    onChange: v => console.log(v),
+    label: "Time",
+    onBlur: () => console.log('blur')
+  }),
+  name: 'Timepicker'
+};
+export const WithSeconds = {
+  render: () => /*#__PURE__*/_jsx(Timepicker, {
+    type: "string",
+    value: "12:30:30",
+    showSeconds: true,
+    onChange: v => console.log(v),
+    label: "Time"
+  }),
+  name: 'With seconds'
+};
+export const Disabled = {
+  render: () => /*#__PURE__*/_jsx(Timepicker, {
+    type: "string",
+    disabled: true,
+    value: "14:00",
+    onChange: v => console.log(v),
+    label: "Time"
+  }),
+  name: 'Disabled'
+};
+export const Nullable = {
+  render: () => /*#__PURE__*/_jsx(Timepicker, {
+    type: "date",
+    isNullable: true,
+    value: null,
+    onChange: v => console.log('onchange CB', v),
+    label: "Time"
+  }),
+  name: 'Nullable'
+};
+export const WithDateAsValue = {
+  render: () => /*#__PURE__*/_jsx(Timepicker, {
+    type: "date",
+    value: new Date(2022, 0, 30, 12, 50, 0),
+    onChange: v => console.log(v),
+    label: "Time"
+  }),
+  name: 'With date as value'
+};
+export const WithError = {
+  render: () => /*#__PURE__*/_jsx(Timepicker, {
+    type: "string",
+    value: "00:30",
+    validation: true,
+    invalidMessage: "Something went wrong",
+    onChange: v => console.log(v),
+    label: "Time",
+    width: "200px"
+  }),
+  name: 'With error'
+};
+export const Focus = {
+  render: () => /*#__PURE__*/_jsx(Timepicker, {
+    type: "string",
+    autoFocus: true,
+    value: "14:00",
+    onChange: v => console.log(v),
+    label: "Time"
+  }),
+  name: 'Focus'
+};

package/esm/core/Timepicker/index.js

@@ -1,4 +1,5 @@
 /** @jsxImportSource @emotion/react */
+
 import React, { useState } from 'react';
 import { IconErrorOutline } from '../..';
 import { DEFAULT_DIVIDER, DEFAULT_VALUE_FULL, DEFAULT_VALUE_FULL_NULLABLE, DEFAULT_VALUE_SHORT, DEFAULT_VALUE_SHORT_NULLABLE, handleDateToStringConvertion, handleStringToDateConvertion, isNumber, validateTimeAndCursor } from '../../utils/time';
@@ -24,22 +25,17 @@ const TimePicker = /*#__PURE__*/React.forwardRef(({
 }, ref) => {
   // Static fields
   const _defaultNullableValue = showSeconds ? DEFAULT_VALUE_FULL_NULLABLE : DEFAULT_VALUE_SHORT_NULLABLE;
-
   const _defaultFilledValue = showSeconds ? DEFAULT_VALUE_FULL : DEFAULT_VALUE_SHORT;
-
   const _defaultValue = isNullable ? _defaultNullableValue : _defaultFilledValue;
-
   const _defaultWidth = width ? width : showSeconds ? '58px' : '35px';
-
   const _divider = divider && divider.length === 1 ? divider : DEFAULT_DIVIDER;
-
   const _isDate = type === 'date';
-
   const removedNumberReplacer = isNullable ? '-' : '0';
   let valueToUse = isNullable && !value ? _defaultNullableValue : _isDate ? handleDateToStringConvertion(value, showSeconds) : value;
   const [validatedTime] = validateTimeAndCursor(showSeconds, valueToUse, _defaultValue, _divider, undefined, isNullable);
-  const [inputStateValue, setInputStateValue] = useState(validatedTime); // Loads of logic to handle string input with divider
+  const [inputStateValue, setInputStateValue] = useState(validatedTime);
 
+  // Loads of logic to handle string input with divider
   const onInputChange = async (event, callback) => {
     const _maxLength = _defaultValue.length;
     const inputValue = event.target.value;
@@ -51,7 +47,6 @@ const TimePicker = /*#__PURE__*/React.forwardRef(({
     const replacedSingleCharacter = inputValue.length === inputStateValue.length ? inputStateValue[position - 1] : null;
     let updatedValue = inputStateValue;
     let currentPosition = position;
-
     if (addedCharacter !== null) {
       if (position > _maxLength) {
         currentPosition = _maxLength;
@@ -63,7 +58,6 @@ const TimePicker = /*#__PURE__*/React.forwardRef(({
       } else if (isNumber(addedCharacter)) {
         // user typed a number
         updatedValue = inputValue.substring(0, position - 1) + addedCharacter + inputValue.substring(position + 1);
-
         if (position === 2 || position === 5) {
           /**
            * If the number has started out as --:--
@@ -72,7 +66,6 @@ const TimePicker = /*#__PURE__*/React.forwardRef(({
           if (isNullable && updatedValue.endsWith('--') && !updatedValue.startsWith('--')) {
             updatedValue = updatedValue.replace('--', '00');
           }
-
           currentPosition = position + 1;
         }
       } else {
@@ -80,7 +73,6 @@ const TimePicker = /*#__PURE__*/React.forwardRef(({
         currentPosition = position - 1;
       }
     }
-
     if (replacedSingleCharacter !== null) {
       // user replaced only a single character
       if (isNumber(cursorCharacter)) {
@@ -107,20 +99,19 @@ const TimePicker = /*#__PURE__*/React.forwardRef(({
         updatedValue = `${inputValue.substring(0, position)}${removedNumberReplacer}${inputValue.substring(position)}`;
       }
     }
+    const [validatedTime, validatedCursorPosition] = validateTimeAndCursor(showSeconds, updatedValue, inputStateValue, _divider, currentPosition, isNullable);
 
-    const [validatedTime, validatedCursorPosition] = validateTimeAndCursor(showSeconds, updatedValue, inputStateValue, _divider, currentPosition, isNullable); // Needs to be awaited, for it to work
-
+    // Needs to be awaited, for it to work
     await setInputStateValue(validatedTime);
     event.target.selectionStart = validatedCursorPosition;
     event.target.selectionEnd = validatedCursorPosition;
     const callbackValue = _isDate ? handleStringToDateConvertion(validatedTime, value) : validatedTime;
     callback(callbackValue);
     event.persist();
-  }; // Select all on input focus
-
+  };
 
+  // Select all on input focus
   const handleFocus = event => event.target.select();
-
   return _jsxs("label", {
     css: theme => [styles.default(theme, height, _defaultWidth), validation && styles.validation, invalidMessage && styles.invalid(theme)],
     children: [label && _jsx(Label, {

package/esm/core/Timepicker/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';
 export const Label = _styled("span", process.env.NODE_ENV === "production" ? {
   target: "edalgqg1"

package/esm/core/Tooltip/Tooptip.stories.js

@@ -0,0 +1,14 @@
+import Tooltip from '.';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default {
+  title: 'Core/Tooltip',
+  component: Tooltip
+};
+export const TooltipDefault = {
+  render: () => /*#__PURE__*/_jsx(Tooltip, {
+    tooltip: "I React",
+    delay: 0,
+    children: "geaugaeuhgaehugaehu"
+  }),
+  name: 'Tooltip'
+};

package/esm/core/Tooltip/index.js

@@ -5,7 +5,6 @@ import { useTooltipTriggerState } from 'react-stately';
 import { styles } from './styles';
 import { jsx as _jsx } from "@emotion/react/jsx-runtime";
 import { jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-
 const TooltipChild = ({
   state,
   ...props
@@ -19,7 +18,6 @@ const TooltipChild = ({
     children: props.children
   });
 };
-
 const Tooltip = props => {
   let state = useTooltipTriggerState(props);
   let ref = React.useRef(null);
@@ -38,5 +36,4 @@ const Tooltip = props => {
     })]
   });
 };
-
 export default Tooltip;

package/esm/core/Tooltip/styles.js

@@ -1,5 +1,4 @@
 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';
 export const styles = {
   default: process.env.NODE_ENV === "production" ? {

package/esm/core/UnitIllustration/index.js

@@ -7,7 +7,6 @@ import IllustrationSmallHouseComposition from '../../illustrations/General/Illus
 import IllustrationTerraceBlockComposition from '../../illustrations/General/IllustrationTerraceBlockComposition';
 import IllustrationTownHouseComposition from '../../illustrations/General/IllustrationTownHouseComposition';
 import { jsx as _jsx } from "react/jsx-runtime";
-
 const UnitIllustration = ({
   type
 }) => {
@@ -16,46 +15,39 @@ const UnitIllustration = ({
       return /*#__PURE__*/_jsx(IllustrationLowHouseComposition, {
         withBackground: true
       });
-
     case 'Rekkehus':
       return /*#__PURE__*/_jsx(IllustrationTownHouseComposition, {
         withBackground: true
       });
-
     case 'Høyblokk':
     case 'Blokk':
       return /*#__PURE__*/_jsx(IllustrationHighHouseComposition, {
         withBackground: true
       });
-
     case 'Terrasseblokk':
       return /*#__PURE__*/_jsx(IllustrationTerraceBlockComposition, {
         withBackground: true
       });
-
     case 'Hus':
       return /*#__PURE__*/_jsx(IllustrationHouseComposition, {
         withBackground: true
       });
-
     case 'Småhus':
       return /*#__PURE__*/_jsx(IllustrationSmallHouseComposition, {
         withBackground: true
       });
-
     case 'Flermannsbolig':
       return /*#__PURE__*/_jsx(IllustrationSemiDetachedHouseComposition, {
         withBackground: true
       });
-
     default:
       return /*#__PURE__*/_jsx(IllustrationHouseComposition, {
         withBackground: true
       });
   }
 };
-
 export default UnitIllustration;
+
 /*
 Lavblokk
 Høyblokk