@bbl-digital/snorre 4.2.82 → 4.2.83

package/esm/v2/core/TabNav/TabNav.stories.js

@@ -1,311 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.TabNavWithSelectAndLoadsItems = exports.TabNavWithSelect = exports.TabNavWithOneDisabledValue = exports.TabNavWithManyOptions = exports.TabNavWithButton = exports.TabNavWithBreakpoint = exports.TabNavVerticalWithButton = exports.TabNavVertical = exports.TabNavValue = exports.TabNavDefault = exports.TabNavColors = void 0;
-var _ = _interopRequireDefault(require("."));
-var _TabNavItem = _interopRequireDefault(require("./TabNavItem"));
-var _Button = _interopRequireDefault(require("../Button"));
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-var _default = exports.default = {
-  title: 'v2/Core/TabNav',
-  component: _.default
-};
-const TabNavDefault = exports.TabNavDefault = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    onChange: e => console.log('changed to', e),
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "D\xF8rer"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Eiere"
-    })]
-  }),
-  name: 'TabNav Default'
-};
-const TabNavColors = exports.TabNavColors = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    onChange: e => console.log('changed to', e),
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "D\xF8rer"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Eiere"
-    })]
-  }),
-  name: 'TabNav colors'
-};
-const TabNavVertical = exports.TabNavVertical = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    onChange: e => console.log('changed to', e),
-    vertical: true,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "D\xF8rer"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Eiere"
-    })]
-  }),
-  name: 'TabNav vertical'
-};
-const TabNavValue = exports.TabNavValue = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    onChange: e => console.log('changed to', e),
-    value: "Eiere",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "D\xF8rer"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Eiere",
-      displayText: "Bare for visning"
-    })]
-  }),
-  name: 'TabNav value'
-};
-const TabNavWithButton = exports.TabNavWithButton = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    actions: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
-      highlight: true,
-      children: "Press"
-    }),
-    onChange: e => console.log('changed to', e),
-    value: "Eiere",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "D\xF8rer"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Eiere",
-      displayText: "Bare for visning"
-    })]
-  }),
-  name: 'TabNav with button'
-};
-const TabNavWithSelect = exports.TabNavWithSelect = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    onChange: e => console.log('changed to', e),
-    value: "Eiere",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "D\xF8rer"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Eiere"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Alla"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Kosedyr"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Bakd\xF8r"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Alle",
-      isSelect: true,
-      displayText: "Select open",
-      selectItems: [{
-        displayText: 'hello',
-        value: '1'
-      }, {
-        indent: 1,
-        displayText: 'very long text to test how it breaks',
-        value: '24'
-      }, {
-        indent: 2,
-        displayText: 'yo',
-        value: '2'
-      }, {
-        displayText: 'link somewhere',
-        value: '251',
-        onClick: () => console.log('clicked')
-      }]
-    })]
-  }),
-  name: 'TabNav with select'
-};
-const TabNavWithOneDisabledValue = exports.TabNavWithOneDisabledValue = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    onChange: e => console.log('changed to', e),
-    value: "Eiere",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "D\xF8rer"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Eiere"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Alla"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Kosedyr"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Bakd\xF8r"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Alle",
-      isSelect: true,
-      displayText: "Select open",
-      selectItems: [{
-        displayText: 'No values here',
-        value: '1',
-        disabled: true
-      }, {
-        displayText: 'Link somewhere',
-        value: '2',
-        onClick: () => console.log('clicked')
-      }]
-    })]
-  }),
-  name: 'TabNav with one disabled value'
-};
-const TabNavWithBreakpoint = exports.TabNavWithBreakpoint = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    breakpoint: 4000,
-    onChange: e => console.log('changed to', e),
-    value: "Eiere",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "D\xF8rer"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Eiere"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Alla"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Kosedyr"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Bakd\xF8r"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Alle"
-    })]
-  }),
-  name: 'TabNav with breakpoint'
-};
-const TabNavWithSelectAndLoadsItems = exports.TabNavWithSelectAndLoadsItems = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    onChange: e => console.log('changed to', e),
-    value: "Eiere",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "D\xF8rer"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Eiere"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Alla"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Kosedyr"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Bakd\xF8r"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Alle",
-      isSelect: true,
-      displayText: "Select open",
-      selectItems: [{
-        displayText: 'hello',
-        value: '1'
-      }, {
-        displayText: 'aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa',
-        value: '31'
-      }, {
-        displayText: 'hello1',
-        value: '11'
-      }, {
-        displayText: 'hello2',
-        value: '12'
-      }, {
-        displayText: 'hello3',
-        value: '13'
-      }, {
-        displayText: 'hello4',
-        value: '14'
-      }, {
-        displayText: 'hello5',
-        value: '15'
-      }, {
-        displayText: 'hello6',
-        value: '16'
-      }, {
-        displayText: 'hello7',
-        value: '17'
-      }, {
-        displayText: 'hello8',
-        value: '18'
-      }, {
-        displayText: 'yo',
-        value: '2'
-      }, {
-        displayText: 'yo1',
-        value: '21'
-      }, {
-        displayText: 'yo2',
-        value: '22'
-      }, {
-        displayText: 'yo3',
-        value: '23'
-      }, {
-        displayText: 'yo4',
-        value: '24'
-      }, {
-        displayText: 'yo5',
-        value: '25'
-      }, {
-        displayText: 'yo6',
-        value: '26'
-      }, {
-        displayText: 'yo7',
-        value: '27'
-      }, {
-        displayText: 'yo8',
-        value: '28'
-      }, {
-        displayText: 'yo9',
-        value: '29'
-      }, {
-        displayText: 'very long text to test how it breaks should lorem ipsum whatever dont know how it goes',
-        value: '34'
-      }, {
-        displayText: 'link somewhere',
-        value: '299',
-        onClick: () => console.log('clicked')
-      }]
-    })]
-  }),
-  name: 'TabNav with select and loads items'
-};
-const TabNavWithManyOptions = exports.TabNavWithManyOptions = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    actions: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
-      highlight: true,
-      children: "Press"
-    }),
-    onChange: e => console.log('changed to', e),
-    value: "Eiere",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "D\xF8rer"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Eiere"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Alla"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Kosedyr"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Bakd\xF8r"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Velkomstmatte"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Katteluke"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Vinduer"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Herregud"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Test"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Loft"
-    })]
-  }),
-  name: 'TabNav with many options'
-};
-const TabNavVerticalWithButton = exports.TabNavVerticalWithButton = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    actions: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
-      highlight: true,
-      children: "Press"
-    }),
-    onChange: e => console.log('changed to', e),
-    value: "Eiere",
-    vertical: true,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "D\xF8rer"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TabNavItem.default, {
-      value: "Eiere",
-      displayText: "Bare for visning"
-    })]
-  }),
-  name: 'TabNav vertical with button'
-};

package/esm/v2/core/TabNav/TabNavItem/index.js

@@ -1,111 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.TabNavItem = void 0;
-var _react = require("@emotion/react");
-var _react2 = _interopRequireWildcard(require("react"));
-var _TabContext = require("../TabContext");
-var _useContainerDimensions = require("../utils/useContainerDimensions");
-var _styles = require("./styles");
-var _IconCaretDown = _interopRequireDefault(require("../../../../icons/General/IconCaretDown"));
-var _Link = _interopRequireDefault(require("../../../../core/Link"));
-var _jsxRuntime = require("@emotion/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; }
-/** @jsxImportSource @emotion/react */
-
-const TabNavItem = ({
-  value,
-  displayText,
-  trackingEvent,
-  trackingName,
-  className,
-  isSelect,
-  selected,
-  selectItems,
-  isSmall = false
-}) => {
-  const theme = (0, _react.useTheme)();
-  const childrenRef = /*#__PURE__*/_react2.default.createRef();
-  const [open, setOpen] = _react2.default.useState(false);
-  const {
-    active,
-    setActive,
-    setWidth
-  } = (0, _react2.useContext)(_TabContext.TabContext);
-  const isActive = selected && selected === value || value === active;
-  const ref = (0, _react2.useRef)(null);
-  const {
-    width,
-    bottom,
-    left
-  } = (0, _useContainerDimensions.useContainerDimensions)(ref);
-  (0, _react2.useEffect)(() => {
-    const handleClickOutside = e => {
-      const node = childrenRef.current;
-      if (node && node.contains(e.target)) return;
-      setOpen(false);
-    };
-    open ? document.addEventListener('mousedown', handleClickOutside) : document.removeEventListener('mousedown', handleClickOutside);
-    return () => {
-      document.removeEventListener('mousedown', handleClickOutside);
-    };
-  }, [open, childrenRef]);
-  (0, _react2.useEffect)(() => {
-    if (width) setWidth({
-      [value]: width
-    });
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [width]);
-  const onSelectClick = value => {
-    setActive(value);
-    setOpen(false);
-  };
-  return (0, _jsxRuntime.jsxs)(_react2.Fragment, {
-    children: [(0, _jsxRuntime.jsxs)(_styles.TabNavItemWrapper, {
-      ref: ref,
-      onClick: () => isSelect ? setOpen(!open) : setActive(value),
-      theme: theme,
-      css: theme => [isActive && _styles.styles.active(theme), isSmall && _styles.styles.small()],
-      "data-tracking-name": trackingName,
-      "data-tracking-event": trackingEvent,
-      className: className,
-      children: [displayText ? displayText : value, isSelect && (0, _jsxRuntime.jsx)(_IconCaretDown.default, {
-        flipVertical: open,
-        size: 20
-      })]
-    }), isSelect && open && (0, _jsxRuntime.jsx)(_styles.SelectChildrenWrapper, {
-      left: left,
-      theme: theme,
-      bottom: bottom,
-      ref: childrenRef,
-      minWidth: width,
-      children: selectItems?.map(({
-        displayText,
-        value,
-        onClick,
-        indent,
-        disabled
-      }) => onClick ? (0, _jsxRuntime.jsx)(_styles.SelectOption, {
-        tabIndex: 0,
-        children: (0, _jsxRuntime.jsx)(_Link.default, {
-          nopadding: true,
-          onClick: onClick,
-          children: displayText || value
-        }, value)
-      }, value) : (0, _jsxRuntime.jsx)(_styles.SelectOption, {
-        bold: value === active,
-        tabIndex: 0,
-        indent: indent,
-        disabled: disabled,
-        onClick: !disabled ? () => onSelectClick(value) : undefined,
-        children: displayText
-      }, value))
-    })]
-  });
-};
-exports.TabNavItem = TabNavItem;
-var _default = exports.default = TabNavItem;

package/esm/v2/core/TabNav/TabNavItem/styles.js

@@ -1,49 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.styles = exports.TabNavItemWrapper = exports.SelectOption = exports.SelectChildrenWrapper = 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 calculateIndent = indent => {
-  const BASE = 8;
-  const INDENT_PADDING_LI = indent === 1 ? BASE * 3 : (indent + 2) * BASE;
-  return /*#__PURE__*/(0, _react.css)("padding-left:", INDENT_PADDING_LI, "px!important;" + (process.env.NODE_ENV === "production" ? "" : ";label:calculateIndent;"));
-};
-const TabNavItemWrapper = exports.TabNavItemWrapper = /*#__PURE__*/(0, _base.default)("button", process.env.NODE_ENV === "production" ? {
-  target: "eucjil52"
-} : {
-  target: "eucjil52",
-  label: "TabNavItemWrapper"
-})(props => /*#__PURE__*/(0, _react.css)("display:flex;border:none;background:transparent;cursor:pointer;padding:0.75rem 1rem;position:relative;font-size:16px;font-weight:600;transition:background ease 250ms;border-radius:8px;&:hover{background:", props.theme.primary10opa, ";color:", props.theme.defaultText, ";}&:focus,&:focus-visible{outline:2px solid ", props.theme.primary, ";outline-offset:1px;}" + (process.env.NODE_ENV === "production" ? "" : ";label:TabNavItemWrapper;")));
-const SelectChildrenWrapper = exports.SelectChildrenWrapper = /*#__PURE__*/(0, _base.default)("ul", process.env.NODE_ENV === "production" ? {
-  target: "eucjil51"
-} : {
-  target: "eucjil51",
-  label: "SelectChildrenWrapper"
-})(props => /*#__PURE__*/(0, _react.css)("position:absolute;z-index:3;top:calc(", props.bottom, "px - 0.5em);left:", props.left, "px;background:#fff;box-shadow:0px 10px 15px 0px rgba(0, 0, 0, 0.1);list-style:none;margin:0;padding:0;min-width:", props.minWidth, "px;max-width:350px;max-height:40vh;overflow-y:auto;overflow-x:hidden;&>li{word-break:break-all;background:#fff;display:flex;width:calc(100% - 1em);cursor:pointer;list-style:none;padding:0.5em;padding-left:1em;border-top:1px solid ", props.theme.border, ";transition:background 150ms ease-in-out;&:first-of-type{border-top:none;}&:hover,&:focus{background:", props.theme.bgLight, ";}}" + (process.env.NODE_ENV === "production" ? "" : ";label:SelectChildrenWrapper;")));
-const SelectOption = exports.SelectOption = /*#__PURE__*/(0, _base.default)("li", process.env.NODE_ENV === "production" ? {
-  target: "eucjil50"
-} : {
-  target: "eucjil50",
-  label: "SelectOption"
-})(({
-  disabled,
-  bold,
-  indent
-}) => /*#__PURE__*/(0, _react.css)("padding:0;padding-left:8px;padding-right:8px;justify-content:flex-start;height:100%;width:100%;opacity:", disabled ? 0.5 : 1, ";font-weight:", bold ? 600 : 400, ";", indent && calculateIndent(indent), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:SelectOption;")));
-var _ref = process.env.NODE_ENV === "production" ? {
-  name: "m1a2da",
-  styles: "padding:0.5rem"
-} : {
-  name: "1o6kqfy-small",
-  styles: "padding:0.5rem;label:small;",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-};
-const styles = exports.styles = {
-  active: theme => /*#__PURE__*/(0, _react.css)("background-color:", theme.primary5darker, ";color:white;:hover{background-color:", theme.primary5darker, ";color:white;}" + (process.env.NODE_ENV === "production" ? "" : ";label:active;")),
-  small: () => _ref
-};

package/esm/v2/core/TabNav/index.js

@@ -1,133 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.TabNav = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _react2 = require("@emotion/react");
-var _TabContext = require("./TabContext");
-var _styles = require("./styles");
-var _useContainerDimensions = require("./utils/useContainerDimensions");
-var _useIsMobile = require("../../../hooks/useIsMobile");
-var _Select = _interopRequireWildcard(require("../../../core/Select"));
-var _Link = _interopRequireDefault(require("../../../core/Link"));
-var _jsxRuntime = require("@emotion/react/jsx-runtime");
-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; }
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-/** @jsxImportSource @emotion/react */
-
-const TabNav = ({
-  value,
-  children,
-  onChange,
-  css,
-  maxWidth,
-  vertical,
-  actions,
-  className,
-  breakpoint
-}) => {
-  const isMobile = (0, _useIsMobile.useIsMobile)(breakpoint);
-  const theme = (0, _react2.useTheme)();
-
-  // Container dimensions
-  const ref = _react.default.useRef(null);
-  const {
-    width: containerWidth
-  } = (0, _useContainerDimensions.useContainerDimensions)(ref);
-
-  // Button dimensions
-  const buttonRef = _react.default.useRef(null);
-  const {
-    width: actionsWidth
-  } = (0, _useContainerDimensions.useContainerDimensions)(buttonRef);
-  const values = _react.default.Children.map(children, child => child !== null && child.props)?.filter(Boolean) || [];
-  const displayNameFromValue = value => {
-    const item = values.find(item => item.value === value);
-    return item?.displayText || String(value);
-  };
-  const valueWithSelectItemIndex = values.findIndex(item => item.selectItems?.length);
-  const listOfSelectedItems = items => {
-    if (!items) return [];
-    return items.map(prop => ({
-      ...prop
-    }));
-  };
-  if (valueWithSelectItemIndex > -1) {
-    const selectedItems = values[valueWithSelectItemIndex].selectItems;
-
-    // If we have no actual selectedItems, dont show any label while in the mobile/dropdown version
-    const isEverySelectedItemDisabledOrLink = Number(selectedItems?.length) >= 1 && selectedItems?.every(item => item.disabled || item.onClick);
-    if (isEverySelectedItemDisabledOrLink) {
-      const itemsWithOnClick = selectedItems?.filter(item => item.onClick) || [];
-
-      // Remove valueWithSelectItemIndex from the values array, but add on itemsWithOnClick in the list
-      values.splice(valueWithSelectItemIndex, 1, ...listOfSelectedItems(itemsWithOnClick));
-    } else {
-      values.splice(valueWithSelectItemIndex + 1, 0, ...listOfSelectedItems(selectedItems));
-    }
-  }
-  return (0, _jsxRuntime.jsx)(_TabContext.TabContextProvider, {
-    onChange: onChange,
-    value: value || values?.[0].value,
-    children: (0, _jsxRuntime.jsx)(_TabContext.TabContext.Consumer, {
-      children: ({
-        width: childrenTotalWidth,
-        setActive,
-        active
-      }) => {
-        if (breakpoint && isMobile || !breakpoint && actionsWidth + childrenTotalWidth > containerWidth) {
-          // Render dropdown instead of tabs
-
-          return (0, _jsxRuntime.jsxs)(_styles.SelectWrapper, {
-            children: [(0, _jsxRuntime.jsx)(_Select.default, {
-              input: true,
-              width: "auto",
-              text: "Velg",
-              selectedValue: displayNameFromValue(String(active)) || '0',
-              onChange: ({
-                value
-              }) => value && setActive(value),
-              className: className,
-              maxHeight: "40vh",
-              children: values.map(({
-                displayText,
-                value: v,
-                selectItems,
-                onClick,
-                indent,
-                disabled
-              }) => onClick ? (0, _jsxRuntime.jsx)(_styles.SelectLinkWrapper, {
-                children: (0, _jsxRuntime.jsx)(_Link.default, {
-                  nopadding: true,
-                  small: true,
-                  onClick: onClick,
-                  children: displayText || v
-                })
-              }, v) : (0, _jsxRuntime.jsx)(_Select.Option, {
-                value: v,
-                indent: indent,
-                disabled: disabled || Boolean(selectItems?.length),
-                children: displayText || v
-              }, v))
-            }), actions]
-          });
-        }
-        return (0, _jsxRuntime.jsxs)(_styles.TabNavWrapper, {
-          ref: ref,
-          theme: theme,
-          className: className,
-          css: () => [vertical && _styles.styles.vertical, maxWidth && _styles.styles.maxWidth(maxWidth), css],
-          children: [children, actions && (0, _jsxRuntime.jsx)(_styles.TabNavActions, {
-            ref: buttonRef,
-            children: actions
-          })]
-        });
-      }
-    })
-  });
-};
-exports.TabNav = TabNav;
-var _default = exports.default = TabNav;

package/esm/v2/core/TabNav/styles.js

@@ -1,62 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.styles = exports.default = exports.TabNavWrapper = exports.TabNavActions = exports.SelectWrapper = exports.SelectLinkWrapper = void 0;
-var _base = _interopRequireDefault(require("@emotion/styled/base"));
-var _react = require("@emotion/react");
-var _breakpoints = _interopRequireDefault(require("../../../globals/styles/breakpoints"));
-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)."; }
-var _ref = process.env.NODE_ENV === "production" ? {
-  name: "1qytrcl",
-  styles: "display:flex;gap:0.5rem;width:100%;position:relative;padding:0;margin:0;align-content:space-between;align-items:flex-end"
-} : {
-  name: "mniq5c-TabNavWrapper",
-  styles: "display:flex;gap:0.5rem;width:100%;position:relative;padding:0;margin:0;align-content:space-between;align-items:flex-end;label:TabNavWrapper;",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-};
-const TabNavWrapper = exports.TabNavWrapper = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e2i76m83"
-} : {
-  target: "e2i76m83",
-  label: "TabNavWrapper"
-})(props => _ref);
-const TabNavActions = exports.TabNavActions = /*#__PURE__*/(0, _base.default)("span", process.env.NODE_ENV === "production" ? {
-  target: "e2i76m82"
-} : {
-  target: "e2i76m82",
-  label: "TabNavActions"
-})("position:absolute;right:0;bottom:1em;@media (max-width: ", _breakpoints.default.medium, "){bottom:0;padding:1em;&:after{display:none;}}");
-const SelectLinkWrapper = exports.SelectLinkWrapper = /*#__PURE__*/(0, _base.default)("li", process.env.NODE_ENV === "production" ? {
-  target: "e2i76m81"
-} : {
-  target: "e2i76m81",
-  label: "SelectLinkWrapper"
-})();
-const SelectWrapper = exports.SelectWrapper = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e2i76m80"
-} : {
-  target: "e2i76m80",
-  label: "SelectWrapper"
-})(process.env.NODE_ENV === "production" ? {
-  name: "1cickod",
-  styles: "display:flex;flex-direction:column;gap:0.5em;&>span>div>ul>li>button{word-break:break-all;text-align:left;}"
-} : {
-  name: "1cickod",
-  styles: "display:flex;flex-direction:column;gap:0.5em;&>span>div>ul>li>button{word-break:break-all;text-align:left;}",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-const styles = exports.styles = {
-  maxWidth: width => /*#__PURE__*/(0, _react.css)("max-width:", width, "px;" + (process.env.NODE_ENV === "production" ? "" : ";label:maxWidth;")),
-  vertical: process.env.NODE_ENV === "production" ? {
-    name: "1yrkr6r",
-    styles: "flex-direction:column;align-items:flex-start;&:after{left:0;top:0;width:4px;height:100%;}& button::after,& button:hover::after{height:100%;width:4px;top:0;}"
-  } : {
-    name: "qxb6uv-vertical",
-    styles: "flex-direction:column;align-items:flex-start;&:after{left:0;top:0;width:4px;height:100%;}& button::after,& button:hover::after{height:100%;width:4px;top:0;};label:vertical;",
-    toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-  }
-};
-var _default = exports.default = styles;