@entur-partner/common 9.3.2 → 9.3.3-alpha.1

package/dist/common.esm.js

@@ -1,58 +1,78 @@
-import React, { Children, useState, useEffect, useRef, Component } from 'react';
+import React, { Children, Component, useState, useEffect, useRef } from 'react';
+import { localeDate, localeDateTime, isDate, isDateString, splitUrlPath, isString, isFunction, assertIsDefined, hasAllPermissions, hasOneOfPermissions } from '@entur-partner/util';
 import cx from 'classnames';
-import { Link as Link$1, Heading6, Paragraph } from '@entur/typography';
-import { UserIcon, DownArrowIcon, NorwayIcon, UKIcon, ChannelsIcon, LogOutIcon, CookieIcon } from '@entur/icons';
-import { SecondaryButton, Button, PrimaryButton, ButtonGroup } from '@entur/button';
-import { useNavigate, Link as Link$2, useInRouterContext, useBlocker } from 'react-router-dom';
-import { SearchableDropdown } from '@entur/dropdown';
-import { SegmentedControl, SegmentedChoice } from '@entur/form';
-import { assertIsDefined, localeDate, localeDateTime, isDate, isDateString, isString, hasAllPermissions, hasOneOfPermissions, splitUrlPath } from '@entur-partner/util';
-import { ExpandablePanel } from '@entur/expand';
-import { BannerAlertBox } from '@entur/alert';
+import { BreadcrumbItem, BreadcrumbNavigation, Pagination } from '@entur/menu';
+import { Link as Link$1, useInRouterContext, useBlocker, useNavigate } from 'react-router-dom';
+import { ButtonGroup, SecondaryButton, PrimaryButton, Button } from '@entur/button';
 import { Modal } from '@entur/modal';
-import { Pagination, BreadcrumbItem, BreadcrumbNavigation } from '@entur/menu';
+import { Paragraph, Link as Link$2, Heading6 } from '@entur/typography';
+import { BannerAlertBox } from '@entur/alert';
+import { ExpandablePanel } from '@entur/expand';
+import { SegmentedControl, SegmentedChoice } from '@entur/form';
 import { Helmet } from 'react-helmet-async';
+import { SearchableDropdown } from '@entur/dropdown';
+import { CookieIcon, UserIcon, DownArrowIcon, NorwayIcon, UKIcon, LogOutIcon, ChannelsIcon } from '@entur/icons';
+
+var ActionBarLeft = function ActionBarLeft(_ref) {
+  var children = _ref.children;
+  return React.createElement("div", {
+    className: "eps-action-bar-left"
+  }, children);
+};
+var ActionBarRight = function ActionBarRight(_ref2) {
+  var children = _ref2.children;
+  return React.createElement("div", {
+    className: "eps-action-bar-right"
+  }, children);
+};
+var ActionBar = function ActionBar(_ref3) {
+  var children = _ref3.children;
+  return React.createElement(React.Fragment, null, React.createElement("div", {
+    className: "eps-action-bar-padding"
+  }), React.createElement("div", {
+    className: "eps-action-bar"
+  }, children));
+};
 
 function _extends() {
-  _extends = Object.assign ? Object.assign.bind() : function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
+  return _extends = Object.assign ? Object.assign.bind() : function (n) {
+    for (var e = 1; e < arguments.length; e++) {
+      var t = arguments[e];
+      for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
     }
-    return target;
-  };
-  return _extends.apply(this, arguments);
-}
-function _inheritsLoose(subClass, superClass) {
-  subClass.prototype = Object.create(superClass.prototype);
-  subClass.prototype.constructor = subClass;
-  _setPrototypeOf(subClass, superClass);
+    return n;
+  }, _extends.apply(null, arguments);
 }
-function _setPrototypeOf(o, p) {
-  _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
-    o.__proto__ = p;
-    return o;
-  };
-  return _setPrototypeOf(o, p);
+function _inheritsLoose(t, o) {
+  t.prototype = Object.create(o.prototype), t.prototype.constructor = t, _setPrototypeOf(t, o);
 }
-function _objectWithoutPropertiesLoose(source, excluded) {
-  if (source == null) return {};
-  var target = {};
-  var sourceKeys = Object.keys(source);
-  var key, i;
-  for (i = 0; i < sourceKeys.length; i++) {
-    key = sourceKeys[i];
-    if (excluded.indexOf(key) >= 0) continue;
-    target[key] = source[key];
+function _objectWithoutPropertiesLoose(r, e) {
+  if (null == r) return {};
+  var t = {};
+  for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
+    if (-1 !== e.indexOf(n)) continue;
+    t[n] = r[n];
   }
-  return target;
+  return t;
+}
+function _setPrototypeOf(t, e) {
+  return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) {
+    return t.__proto__ = e, t;
+  }, _setPrototypeOf(t, e);
 }
 
-var _excluded$e = ["as", "children", "contrast", "paddingTop", "paddingRight", "paddingBottom", "paddingLeft", "paddingX", "paddingY", "padding", "marginTop", "marginRight", "marginBottom", "marginLeft", "marginX", "marginY", "margin", "display", "justifyContent", "alignItems", "maxWidth", "width", "background", "color", "flexDirection", "flexWrap", "className"];
+var _excluded$e = ["date", "locale", "as", "hideTime"];
+var FormatDateTime = function FormatDateTime(_ref) {
+  var date = _ref.date,
+    locale = _ref.locale,
+    _ref$as = _ref.as,
+    Component = _ref$as === void 0 ? "main" : _ref$as,
+    hideTime = _ref.hideTime,
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$e);
+  return React.createElement(Component, _extends({}, rest), hideTime ? localeDate(date, locale) : localeDateTime(date, locale));
+};
+
+var _excluded$d = ["as", "children", "contrast", "paddingTop", "paddingRight", "paddingBottom", "paddingLeft", "paddingX", "paddingY", "padding", "marginTop", "marginRight", "marginBottom", "marginLeft", "marginX", "marginY", "margin", "display", "justifyContent", "alignItems", "maxWidth", "width", "background", "color", "flexDirection", "flexWrap", "className"];
 function responsiveProp(prefix, prop) {
   if (Array.isArray(prop)) {
     var classes = [];
@@ -65,7 +85,7 @@ function responsiveProp(prefix, prop) {
 }
 var Box = function Box(_ref) {
   var _ref$as = _ref.as,
-    Component = _ref$as === void 0 ? 'div' : _ref$as,
+    Component = _ref$as === void 0 ? "div" : _ref$as,
     children = _ref.children,
     contrast = _ref.contrast,
     paddingTop = _ref.paddingTop,
@@ -92,7 +112,7 @@ var Box = function Box(_ref) {
     flexDirection = _ref.flexDirection,
     flexWrap = _ref.flexWrap,
     className = _ref.className,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$e);
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$d);
   var classes = [];
   var resolvedPaddingTop = paddingTop || paddingY || padding;
   var resolvedPaddingBottom = paddingBottom || paddingY || padding;
@@ -102,32 +122,33 @@ var Box = function Box(_ref) {
   var resolvedMarginBottom = marginBottom || marginY || margin;
   var resolvedMarginLeft = marginLeft || marginX || margin;
   var resolvedMarginRight = marginRight || marginX || margin;
-  contrast && classes.push('eds-contrast');
-  resolvedPaddingTop && classes.push.apply(classes, responsiveProp('eps-pt-', resolvedPaddingTop));
-  resolvedPaddingBottom && classes.push.apply(classes, responsiveProp('eps-pb-', resolvedPaddingBottom));
-  resolvedPaddingLeft && classes.push.apply(classes, responsiveProp('eps-pl-', resolvedPaddingLeft));
-  resolvedPaddingRight && classes.push.apply(classes, responsiveProp('eps-pr-', resolvedPaddingRight));
-  resolvedMarginTop && classes.push.apply(classes, responsiveProp('eps-mt-', resolvedMarginTop));
-  resolvedMarginBottom && classes.push.apply(classes, responsiveProp('eps-mb-', resolvedMarginBottom));
-  resolvedMarginLeft && classes.push.apply(classes, responsiveProp('eps-ml-', resolvedMarginLeft));
-  resolvedMarginRight && classes.push.apply(classes, responsiveProp('eps-mr-', resolvedMarginRight));
-  display && classes.push.apply(classes, responsiveProp('eps-', display));
-  justifyContent && classes.push.apply(classes, responsiveProp('eps-justify-', justifyContent));
+  contrast && classes.push("eds-contrast");
+  resolvedPaddingTop && classes.push.apply(classes, responsiveProp("eps-pt-", resolvedPaddingTop));
+  resolvedPaddingBottom && classes.push.apply(classes, responsiveProp("eps-pb-", resolvedPaddingBottom));
+  resolvedPaddingLeft && classes.push.apply(classes, responsiveProp("eps-pl-", resolvedPaddingLeft));
+  resolvedPaddingRight && classes.push.apply(classes, responsiveProp("eps-pr-", resolvedPaddingRight));
+  resolvedMarginTop && classes.push.apply(classes, responsiveProp("eps-mt-", resolvedMarginTop));
+  resolvedMarginBottom && classes.push.apply(classes, responsiveProp("eps-mb-", resolvedMarginBottom));
+  resolvedMarginLeft && classes.push.apply(classes, responsiveProp("eps-ml-", resolvedMarginLeft));
+  resolvedMarginRight && classes.push.apply(classes, responsiveProp("eps-mr-", resolvedMarginRight));
+  display && classes.push.apply(classes, responsiveProp("eps-", display));
+  justifyContent && classes.push.apply(classes, responsiveProp("eps-justify-", justifyContent));
   if (alignItems) {
-    classes.push.apply(classes, responsiveProp('eps-items-', alignItems));
+    classes.push.apply(classes, responsiveProp("eps-items-", alignItems));
   }
-  maxWidth && classes.push.apply(classes, responsiveProp('eps-max-w-', maxWidth));
-  width && classes.push.apply(classes, responsiveProp('eps-w-', width));
+  maxWidth && classes.push.apply(classes, responsiveProp("eps-max-w-", maxWidth));
+  width && classes.push.apply(classes, responsiveProp("eps-w-", width));
   color && classes.push("eps-color-" + color);
   background && classes.push("eps-bg-" + background);
-  flexDirection && classes.push.apply(classes, responsiveProp('eps-flex-', flexDirection));
-  flexWrap && classes.push.apply(classes, responsiveProp('eps-flex-wrap-', flexWrap));
+  flexDirection && classes.push.apply(classes, responsiveProp("eps-flex-", flexDirection));
+  flexWrap && classes.push.apply(classes, responsiveProp("eps-flex-wrap-", flexWrap));
   var classList = cx(classes, className);
   return React.createElement(Component, _extends({
     className: classList
   }, rest), children);
 };
 
+/** biome-ignore-all lint/suspicious/noArrayIndexKey: Ignore for now. Should be tested properly before doing changes */
 var Stack = function Stack(_ref) {
   var children = _ref.children,
     space = _ref.space,
@@ -148,68 +169,106 @@ var Stack = function Stack(_ref) {
   }));
 };
 
-var ActionBarLeft = function ActionBarLeft(_ref) {
-  var children = _ref.children;
-  return React.createElement("div", {
-    className: "eps-action-bar-left"
-  }, children);
-};
-var ActionBarRight = function ActionBarRight(_ref2) {
-  var children = _ref2.children;
-  return React.createElement("div", {
-    className: "eps-action-bar-right"
-  }, children);
+var _excluded$c = ["items", "locale", "className"];
+var AuditInfo = function AuditInfo(_ref) {
+  var items = _ref.items,
+    locale = _ref.locale,
+    className = _ref.className,
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$c);
+  var classNames = cx("ep-audit-info", className);
+  return React.createElement("div", _extends({
+    className: classNames
+  }, rest), items.map(function (_ref2) {
+    var label = _ref2.label,
+      value = _ref2.value;
+    return React.createElement(Stack, {
+      space: "small",
+      key: value.toString()
+    }, React.createElement("div", {
+      className: "ep-audit-info-label"
+    }, label), React.createElement("div", null, isDate(value) || isDateString(value) ? React.createElement(FormatDateTime, {
+      date: value,
+      locale: locale
+    }) : React.createElement("span", null, value)));
+  }));
 };
-var ActionBar = function ActionBar(_ref3) {
-  var children = _ref3.children;
-  return React.createElement(React.Fragment, null, React.createElement("div", {
-    className: "eps-action-bar-padding"
-  }), React.createElement("div", {
-    className: "eps-action-bar"
-  }, children));
+
+var Breadcrumbs = function Breadcrumbs(_ref) {
+  var prependBreadcrumbItem = _ref.prependBreadcrumbItem,
+    pathname = _ref.pathname,
+    onBreadcrumbLookup = _ref.onBreadcrumbLookup;
+  var paths = splitUrlPath(pathname);
+  var breadcrumbs = paths.map(function (path) {
+    return {
+      title: onBreadcrumbLookup(path),
+      path: path
+    };
+  }).filter(function (_ref2) {
+    var title = _ref2.title;
+    return title !== undefined;
+  });
+  var breadcrumbElements = breadcrumbs.map(function (_ref3, i) {
+    var title = _ref3.title,
+      path = _ref3.path;
+    var isLast = i === breadcrumbs.length - 1;
+    if (isLast) {
+      return React.createElement(BreadcrumbItem, {
+        key: path,
+        as: "span"
+      }, title);
+    }
+    return React.createElement(BreadcrumbItem, {
+      key: path,
+      as: Link$1,
+      to: path
+    }, title);
+  });
+  if (prependBreadcrumbItem) {
+    return React.createElement(BreadcrumbNavigation, null, [prependBreadcrumbItem].concat(breadcrumbElements));
+  }
+  return React.createElement(BreadcrumbNavigation, null, breadcrumbElements);
 };
 
-var _excluded$d = ["children", "className"];
-var LinkButton = function LinkButton(_ref) {
-  var children = _ref.children,
-    className = _ref.className,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$d);
-  return React.createElement(Link$1, _extends({}, rest, {
-    as: "button",
-    className: cx('eps-link-button', className)
-  }), children);
+var _excluded$b = ["isOpen", "children", "message", "size", "buttons", "onConfirm", "messages", "onClose", "onDismiss"];
+var ConfirmModal = function ConfirmModal(_ref) {
+  var _ref$isOpen = _ref.isOpen,
+    isOpen = _ref$isOpen === void 0 ? false : _ref$isOpen,
+    children = _ref.children,
+    message = _ref.message,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? "medium" : _ref$size,
+    buttons = _ref.buttons,
+    onConfirm = _ref.onConfirm,
+    messages = _ref.messages,
+    onClose = _ref.onClose,
+    onDismiss = _ref.onDismiss,
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$b);
+  var childrenToRender = children ? children : message;
+  var handleDismiss = onClose ? onClose : onDismiss;
+  return React.createElement(Modal, _extends({
+    size: size,
+    open: isOpen,
+    onDismiss: handleDismiss
+  }, rest), isString(childrenToRender) ? React.createElement(Paragraph, null, childrenToRender) : React.createElement(Box, {
+    paddingBottom: "medium"
+  }, childrenToRender), React.createElement(ButtonGroup, null, onConfirm ? React.createElement(React.Fragment, null, React.createElement(SecondaryButton, {
+    onClick: handleDismiss,
+    "data-testid": "cancel-modal-button"
+  }, messages.cancel), React.createElement(PrimaryButton, {
+    onClick: onConfirm,
+    "data-testid": "confirm-modal-button"
+  }, messages.confirm)) : buttons));
 };
 
-/// <reference types="vite/client" />
-/**
- * Returns true if the provided flag exist in localStorage
- * or is set as an environment variable.
- *
- * @param flag case sensitive flag. If it is an environment variable
- * you can drop the VITE_APP_ prefix.
- */
-function featureFlag(flag) {
-  var _window$localStorage, _window$localStorage2;
-  return import.meta.env["VITE_APP_" + flag] === 'true' || ((_window$localStorage = window.localStorage) == null ? void 0 : _window$localStorage.getItem(flag)) === 'true' || ((_window$localStorage2 = window.localStorage) == null ? void 0 : _window$localStorage2.getItem("VITE_APP_" + flag)) === 'true';
-}
-/**
- * Returns true if the provided flag exist in localStorage
- * or is set as an environment variable.
- *
- * @param flag case sensitive flag. If it is an environment variable
- * you can drop the VITE_APP_ prefix.
- */
-function useFeatureToggle(flag) {
-  return featureFlag(flag);
-}
-var FeatureToggle = function FeatureToggle(_ref) {
-  var children = _ref.children,
-    flag = _ref.flag;
-  var feature = useFeatureToggle(flag);
-  if (feature) {
-    return React.createElement(React.Fragment, null, children);
-  }
-  return null;
+var Content = function Content(_ref) {
+  var _ref$as = _ref.as,
+    Component = _ref$as === void 0 ? "main" : _ref$as,
+    className = _ref.className,
+    children = _ref.children;
+  var classList = cx(["eps-content", className]);
+  return React.createElement(Component, {
+    className: classList
+  }, children);
 };
 
 var _environmentColors, _humanReadableEnviron;
@@ -220,26 +279,26 @@ var Environment;
   Environment["Staging"] = "staging";
   Environment["Production"] = "prod";
 })(Environment || (Environment = {}));
-var environmentColors = (_environmentColors = {}, _environmentColors[Environment.Local] = '#B482FB', _environmentColors[Environment.Development] = '#5AC39A', _environmentColors[Environment.Staging] = '#FFCA28', _environmentColors);
-/**
- * Gets the color for the given environment. This is the color used for the environment
- * indicator. There is no color for production as it should not have any special environment
- * indication.
+var environmentColors = (_environmentColors = {}, _environmentColors[Environment.Local] = "#B482FB", _environmentColors[Environment.Development] = "#5AC39A", _environmentColors[Environment.Staging] = "#FFCA28", _environmentColors);
+/**
+ * Gets the color for the given environment. This is the color used for the environment
+ * indicator. There is no color for production as it should not have any special environment
+ * indication.
  */
 var getColorForEnvironment = function getColorForEnvironment(environment) {
   return environmentColors[environment];
 };
-var humanReadableEnvironment = (_humanReadableEnviron = {}, _humanReadableEnviron[Environment.Local] = 'Local', _humanReadableEnviron[Environment.Development] = 'Dev', _humanReadableEnviron[Environment.Staging] = 'Staging', _humanReadableEnviron[Environment.Production] = 'Prod', _humanReadableEnviron);
+var humanReadableEnvironment = (_humanReadableEnviron = {}, _humanReadableEnviron[Environment.Local] = "Local", _humanReadableEnviron[Environment.Development] = "Dev", _humanReadableEnviron[Environment.Staging] = "Staging", _humanReadableEnviron[Environment.Production] = "Prod", _humanReadableEnviron);
 var getHumanReadableEnvironment = function getHumanReadableEnvironment(environment) {
   return humanReadableEnvironment[environment];
 };
 
-var _excluded$c = ["title", "accentColor"];
+var _excluded$a = ["title", "accentColor"];
 var EnturPartnerLogoSvg = function EnturPartnerLogoSvg(_ref) {
   var title = _ref.title,
     _ref$accentColor = _ref.accentColor,
-    accentColor = _ref$accentColor === void 0 ? '#FF5959' : _ref$accentColor,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$c);
+    accentColor = _ref$accentColor === void 0 ? "#FF5959" : _ref$accentColor,
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$a);
   return React.createElement("svg", _extends({
     width: 257,
     height: 37,
@@ -264,11 +323,11 @@ var EnturPartnerLogoSvg = function EnturPartnerLogoSvg(_ref) {
 };
 var EnturPartnerLogo = function EnturPartnerLogo(_ref2) {
   var _ref2$as = _ref2.as,
-    Component = _ref2$as === void 0 ? 'nav' : _ref2$as,
+    Component = _ref2$as === void 0 ? "nav" : _ref2$as,
     className = _ref2.className,
     altText = _ref2.altText,
     environment = _ref2.environment;
-  var classList = cx(['eps-logo-wrapper', className]);
+  var classList = cx(["eps-logo-wrapper", className]);
   return React.createElement(Component, {
     className: classList
   }, React.createElement(EnturPartnerLogoSvg, {
@@ -278,425 +337,254 @@ var EnturPartnerLogo = function EnturPartnerLogo(_ref2) {
   }));
 };
 
-var Menu = function Menu(_ref) {
-  var _ref$as = _ref.as,
-    Component = _ref$as === void 0 ? 'nav' : _ref$as,
-    className = _ref.className,
-    children = _ref.children;
-  var classList = cx(['eds-contrast', 'eps-menu', className]);
-  return React.createElement(Component, {
-    className: classList
-  }, children);
-};
-
-var Content = function Content(_ref) {
-  var _ref$as = _ref.as,
-    Component = _ref$as === void 0 ? 'main' : _ref$as,
-    className = _ref.className,
-    children = _ref.children;
-  var classList = cx(['eps-content', className]);
-  return React.createElement(Component, {
-    className: classList
-  }, children);
-};
-
-function useOutsideClick(ref, buttonRef, handler) {
-  React.useEffect(function () {
-    var listener = function listener(event) {
-      if (elementContainsEventTarget(ref.current, event) || elementContainsEventTarget(buttonRef.current, event)) {
-        return;
-      }
-      handler();
-    };
-    document.addEventListener('mousedown', listener);
-    document.addEventListener('touchstart', listener);
-    return function () {
-      document.removeEventListener('mousedown', listener);
-      document.removeEventListener('touchstart', listener);
+var newAppVersionErrorMessage = "Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.";
+var ErrorBoundary = /*#__PURE__*/function (_Component) {
+  function ErrorBoundary(props) {
+    var _this;
+    _this = _Component.call(this, props) || this;
+    _this.state = {
+      error: null
     };
-  }, [ref, buttonRef, handler]);
-}
-function elementContainsEventTarget(element, event) {
-  if (!element) {
-    return false;
-  }
-  if (element.contains(event.target)) {
-    return true;
+    return _this;
   }
-  // For elements inside a Shadow DOM we need to check the composedPath
-  if (event.composed && event.composedPath) {
-    var contains = event.composedPath().find(function (target) {
-      if (target === window) {
-        return false;
+  _inheritsLoose(ErrorBoundary, _Component);
+  ErrorBoundary.getDerivedStateFromError = function getDerivedStateFromError(error) {
+    return {
+      error: error
+    };
+  };
+  var _proto = ErrorBoundary.prototype;
+  _proto.componentDidCatch = function componentDidCatch(error, errorInfo) {
+    var _this$props$handleErr, _this$props;
+    // React always logs in development
+    (_this$props$handleErr = (_this$props = this.props).handleError) == null || _this$props$handleErr.call(_this$props, error, errorInfo);
+  };
+  _proto.render = function render() {
+    var _this2 = this;
+    var error = this.state.error;
+    var _this$props2 = this.props,
+      fallback = _this$props2.fallback,
+      children = _this$props2.children;
+    if (error) {
+      if (isFunction(fallback)) {
+        return fallback({
+          retry: function retry() {
+            return _this2.setState({
+              error: null
+            });
+          },
+          error: error
+        });
+      } else if (error.name === "NotFoundError" && error.message === newAppVersionErrorMessage) {
+        return React.createElement(RefreshBannerInfo, null);
       }
-      return element.contains(target);
-    });
-    return !!contains;
-  }
-  return false;
-}
-
-var _excluded$b = ["className", "children", "userName", "open", "onOpenChange", "environment"];
-var CustomOverflowMenu = function CustomOverflowMenu(_ref) {
-  var className = _ref.className,
-    children = _ref.children,
-    userName = _ref.userName,
-    open = _ref.open,
-    onOpenChange = _ref.onOpenChange,
-    environment = _ref.environment,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$b);
-  var overflowItemsClasses = cx('eps-overflow-menu__group', {
-    'eps-overflow-menu__group--open': open
-  });
-  var overflowContentRef = React.useRef(null);
-  var overflowMenuTriggerRef = React.useRef(null);
-  useOutsideClick(overflowContentRef, overflowMenuTriggerRef, function () {
-    return onOpenChange(false);
-  });
-  return React.createElement("div", null, React.createElement(SecondaryButton, _extends({
-    className: cx('eps-overflow-menu__button', className),
+      return fallback;
+    }
+    return children;
+  };
+  return ErrorBoundary;
+}(Component);
+var LANGUAGE_STORAGE_KEY = "EP::locale";
+function RefreshBannerInfo() {
+  // Taken from ./app-shell/src/storage.ts
+  var language = localStorage.getItem(LANGUAGE_STORAGE_KEY);
+  var isNorwegian = language === "nb" || language === "nb-NO";
+  return React.createElement(Box, {
+    maxWidth: "large"
+  }, React.createElement(BannerAlertBox, {
+    variant: "info",
+    title: isNorwegian ? "En ny versjon av nettsiden er tilgjengelig." : "A new version of the website is available."
+  }, React.createElement(Box, {
+    paddingBottom: "medium"
+  }, React.createElement(Paragraph, {
+    margin: "none"
+  }, isNorwegian ? "Vennligst oppdater." : "Please refresh.")), React.createElement(PrimaryButton, {
     onClick: function onClick() {
-      return onOpenChange(open ? false : true);
-    },
-    "aria-haspopup": true,
-    role: "button",
-    "aria-expanded": open,
-    ref: overflowMenuTriggerRef
-  }, rest), React.createElement("div", {
-    className: "eps-overflow-menu__button-contents"
-  }, React.createElement("span", {
-    className: "eds-overflow-menu__user-icon"
-  }, React.createElement(UserIcon, {
-    inline: true
-  })), React.createElement(Heading6, {
-    margin: "none",
-    as: "span"
-  }, userName, environment !== undefined && environment !== Environment.Production && React.createElement("span", {
-    style: {
-      color: getColorForEnvironment(environment)
+      return window.location.reload();
     }
-  }, ' ', "(", getHumanReadableEnvironment(environment), ")")), React.createElement("span", {
-    className: "eps-arrow-icon"
-  }, React.createElement(DownArrowIcon, {
-    inline: true
-  })))), open && React.createElement("div", {
-    className: overflowItemsClasses,
-    role: "menu",
-    ref: overflowContentRef
-  }, children));
+  }, isNorwegian ? "Oppdater" : "Refresh")));
+}
+
+var _excluded$9 = ["title", "inputComponent", "languages", "values", "onChange", "name", "variant", "feedback"];
+var ExpandableMultiLanguageInput = function ExpandableMultiLanguageInput(_ref) {
+  var title = _ref.title,
+    InputComponent = _ref.inputComponent,
+    languages = _ref.languages,
+    values = _ref.values,
+    onChange = _ref.onChange,
+    name = _ref.name,
+    variant = _ref.variant,
+    feedback = _ref.feedback,
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$9);
+  var handleOnChange = function handleOnChange(language, value) {
+    var changes = _extends({}, values);
+    if (value === "" || !value) {
+      delete changes[language];
+    } else {
+      changes[language] = value;
+    }
+    onChange(changes);
+  };
+  return React.createElement(ExpandablePanel, {
+    title: title,
+    defaultOpen: true,
+    contentStyle: {
+      padding: "4px 4px 4px 4px",
+      marginTop: "16px",
+      marginBottom: "16px"
+    }
+  }, React.createElement(Stack, {
+    space: "medium"
+  }, languages.map(function (_ref2) {
+    var langKey = _ref2.value,
+      label = _ref2.label,
+      required = _ref2.required;
+    return React.createElement(InputComponent, _extends({
+      "data-testid": "multi-lang-input-" + name + "-" + langKey,
+      key: title + langKey,
+      label: required ? label + "*" : label,
+      variant: variant == null ? void 0 : variant(langKey),
+      feedback: feedback == null ? void 0 : feedback(langKey),
+      name: name,
+      onChange: function onChange(e) {
+        handleOnChange(langKey, e.target.value);
+      },
+      value: values[langKey] || ""
+    }, rest));
+  })));
 };
 
-var CustomOverflowMenuItem = function CustomOverflowMenuItem(props) {
-  return React.createElement("button", _extends({
-    className: cx(props.className, 'eps-overflow-menu__item'),
-    role: "menuitem"
-  }, props));
+/// <reference types="vite/client" />
+/**
+ * Returns true if the provided flag exist in localStorage
+ * or is set as an environment variable.
+ *
+ * @param flag case sensitive flag. If it is an environment variable
+ * you can drop the VITE_APP_ prefix.
+ */
+function featureFlag(flag) {
+  var _window$localStorage, _window$localStorage2;
+  return import.meta.env["VITE_APP_" + flag] === "true" || ((_window$localStorage = window.localStorage) == null ? void 0 : _window$localStorage.getItem(flag)) === "true" || ((_window$localStorage2 = window.localStorage) == null ? void 0 : _window$localStorage2.getItem("VITE_APP_" + flag)) === "true";
+}
+/**
+ * Returns true if the provided flag exist in localStorage
+ * or is set as an environment variable.
+ *
+ * @param flag case sensitive flag. If it is an environment variable
+ * you can drop the VITE_APP_ prefix.
+ */
+function useFeatureToggle(flag) {
+  return featureFlag(flag);
+}
+var FeatureToggle = function FeatureToggle(_ref) {
+  var children = _ref.children,
+    flag = _ref.flag;
+  var feature = useFeatureToggle(flag);
+  if (feature) {
+    return React.createElement(React.Fragment, null, children);
+  }
+  return null;
 };
 
-var LanguageSwitchMenuItem = function LanguageSwitchMenuItem(_ref) {
+var _excluded$8 = ["amount", "as"];
+var FormatCurrencyAmount = function FormatCurrencyAmount(_ref) {
+  var amount = _ref.amount,
+    _ref$as = _ref.as,
+    Component = _ref$as === void 0 ? "span" : _ref$as,
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$8);
+  var parsedAmount = Number(amount) || 0;
+  var formattedAmount = new Intl.NumberFormat("nb-NO", {
+    maximumFractionDigits: 2,
+    minimumFractionDigits: 2
+  }).format(parsedAmount);
+  return React.createElement(Component, _extends({}, rest), formattedAmount);
+};
+
+var _excluded$7 = ["language", "options", "className", "onChange"];
+var LanguageSelect = function LanguageSelect(_ref) {
   var language = _ref.language,
-    onLanguageChange = _ref.onLanguageChange,
-    setOpen = _ref.setOpen,
-    name = _ref.name;
-  var useB47LanguageKey = useFeatureToggle('USE_BCP-47_LANGUAGE_KEY');
-  var norwegianLanguageKey = useB47LanguageKey ? 'nb-NO' : 'nb';
-  var englishLanguageKey = useB47LanguageKey ? 'en-GB' : 'en';
-  return React.createElement(React.Fragment, null, language === englishLanguageKey ? React.createElement(CustomOverflowMenuItem, {
-    onClick: function onClick() {
-      onLanguageChange(norwegianLanguageKey);
-      setOpen(false);
-    },
-    className: "eps-overflow-menu__item"
-  }, React.createElement("span", {
-    "aria-hidden": true,
-    className: "eps-overflow-menu__icon-margin"
-  }, React.createElement(NorwayIcon, {
-    size: "1rem",
-    inline: true
-  })), name) : React.createElement(CustomOverflowMenuItem, {
-    onClick: function onClick() {
-      onLanguageChange(englishLanguageKey);
-      setOpen(false);
+    options = _ref.options,
+    className = _ref.className,
+    _onChange = _ref.onChange,
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$7);
+  var classNames = cx("eps-language-select", className);
+  return React.createElement("div", _extends({}, rest, {
+    className: classNames
+  }), React.createElement(SegmentedControl, {
+    onChange: function onChange(language) {
+      assertIsDefined(language);
+      _onChange(language);
     },
-    className: "eps-overflow-menu__item"
-  }, React.createElement("span", {
-    "aria-hidden": true,
-    className: "eps-overflow-menu__icon-margin"
-  }, React.createElement(UKIcon, {
-    size: "1rem",
-    inline: true
-  })), name));
+    selectedValue: language
+  }, options.map(function (option) {
+    return React.createElement(SegmentedChoice, {
+      key: option.value,
+      value: option.value
+    }, option.label, option.required && React.createElement("span", {
+      className: "asterisk-margin"
+    }, "*"));
+  })));
 };
 
-var VersionMenuItem = function VersionMenuItem(_ref) {
-  var title = _ref.title,
-    setOpen = _ref.setOpen;
-  var navigate = useNavigate(); // Hide useNavigate from standalone micro-frontends because it is not under RouterProvider
-  return React.createElement(CustomOverflowMenuItem, {
-    onClick: function onClick() {
-      navigate('/app-version');
-      setOpen(false);
-    },
-    className: "eps-overflow-menu__item"
-  }, React.createElement("span", {
-    "aria-hidden": true
-  }, React.createElement(ChannelsIcon, {
-    className: "eps-version-icon",
-    size: "1rem",
-    inline: true
-  })), title);
+/**
+ * @deprecated Won't work with React 19, because of react-helmet-async
+ * This component changes page title by using helmet and current path. It will translate subpaths, join them with a dash
+ * and display it on browser tab.
+ *
+ * @param Props.pathname - The current path from react-router-dom.useLocation()
+ * @param Props.onBreadcrumbLookup - A function that takes a path and returns a i18n translated string or undefined
+ * @returns A Helmet component with updated title
+ */
+var LegacyPageTitle = function LegacyPageTitle(_ref) {
+  var pathname = _ref.pathname,
+    onBreadcrumbLookup = _ref.onBreadcrumbLookup;
+  var paths = splitUrlPath(pathname);
+  var pageTitles = paths.map(function (path) {
+    return {
+      title: onBreadcrumbLookup(path),
+      path: path
+    };
+  }).filter(function (_ref2) {
+    var title = _ref2.title;
+    return title !== undefined;
+  }).map(function (_ref3) {
+    var title = _ref3.title;
+    return title;
+  }).reverse().join(" | ");
+  return React.createElement(Helmet, null, React.createElement("title", null, pageTitles, " | Entur Partner"));
 };
 
-var UserMenuItem = function UserMenuItem(_ref) {
-  var name = _ref.name,
-    setOpen = _ref.setOpen,
-    onNavigateToMyProfile = _ref.onNavigateToMyProfile;
-  return React.createElement(Link$2, {
-    to: "/permission-admin/my-profile",
-    style: {
-      textDecoration: 'none'
-    }
-  }, React.createElement(CustomOverflowMenuItem, {
-    onClick: function onClick() {
-      setOpen(false);
-      onNavigateToMyProfile();
-    },
-    className: "eps-overflow-menu__item"
-  }, React.createElement("span", {
-    "aria-hidden": true
-  }, React.createElement(UserIcon, {
-    size: "1rem",
-    inline: true
-  })), name));
+var Link = function Link(props) {
+  return React.createElement(Link$2, _extends({}, props, {
+    as: Link$1
+  }), props.children);
 };
 
-var LogOutMenuItem = function LogOutMenuItem(_ref) {
-  var name = _ref.name,
-    setOpen = _ref.setOpen,
-    onLogout = _ref.onLogout;
-  return React.createElement(CustomOverflowMenuItem, {
-    onClick: function onClick() {
-      onLogout();
-      setOpen(false);
-    },
-    "data-testid": "user-menu-logout",
-    className: "eps-overflow-menu__item"
-  }, React.createElement("span", {
-    "aria-hidden": true
-  }, React.createElement(LogOutIcon, {
-    size: "1rem",
-    inline: true
-  })), name);
+var _excluded$6 = ["children", "className"];
+var LinkButton = function LinkButton(_ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$6);
+  return React.createElement(Link$2, _extends({}, rest, {
+    as: "button",
+    className: cx("eps-link-button", className)
+  }), children);
 };
 
-var CookieSettingsMenuItem = function CookieSettingsMenuItem(_ref) {
-  var name = _ref.name,
-    setOpen = _ref.setOpen,
-    onCookieSettingsOpen = _ref.onCookieSettingsOpen;
-  return React.createElement(CustomOverflowMenuItem, {
-    onClick: function onClick() {
-      onCookieSettingsOpen();
-      setOpen(false);
-    },
-    className: "eps-overflow-menu__item"
-  }, React.createElement("span", {
-    "aria-hidden": true
-  }, React.createElement(CookieIcon, {
-    size: "1rem",
-    inline: true
-  })), name);
-};
-
-var UserMenu = function UserMenu(_ref) {
-  var className = _ref.className,
-    messages = _ref.messages,
-    onLogout = _ref.onLogout,
-    onLanguageChange = _ref.onLanguageChange,
-    userName = _ref.userName,
-    language = _ref.language,
-    environment = _ref.environment,
-    showVersionItem = _ref.showVersionItem,
-    showMyProfileItem = _ref.showMyProfileItem,
-    showCookieSettingsItem = _ref.showCookieSettingsItem,
-    onNavigateToMyProfile = _ref.onNavigateToMyProfile,
-    _ref$onCookieSettings = _ref.onCookieSettingsOpen,
-    onCookieSettingsOpen = _ref$onCookieSettings === void 0 ? function () {} : _ref$onCookieSettings;
-  var triggerClassList = cx(['eps-user-menu__trigger-button', className]);
-  var _useState = useState(false),
-    open = _useState[0],
-    setOpen = _useState[1];
-  return React.createElement("div", {
-    id: "eps-user-menu"
-  }, React.createElement(CustomOverflowMenu, {
-    open: open,
-    onOpenChange: setOpen,
-    className: triggerClassList,
-    userName: userName,
-    environment: environment
-  }, React.createElement("div", {
-    id: "eps-overflow-menu"
-  }, React.createElement(LanguageSwitchMenuItem, {
-    name: messages.switchLanguage,
-    language: language,
-    onLanguageChange: onLanguageChange,
-    setOpen: setOpen
-  }), showVersionItem && messages.appVersion && React.createElement(VersionMenuItem, {
-    title: messages.appVersion,
-    setOpen: setOpen
-  }), showMyProfileItem && messages.myProfile && React.createElement(UserMenuItem, {
-    name: messages.myProfile,
-    setOpen: setOpen,
-    onNavigateToMyProfile: onNavigateToMyProfile
-  }), showCookieSettingsItem && messages.cookieSettings && React.createElement(CookieSettingsMenuItem, {
-    name: messages.cookieSettings,
-    setOpen: setOpen,
-    onCookieSettingsOpen: onCookieSettingsOpen
-  }), React.createElement(LogOutMenuItem, {
-    name: messages.logout,
-    setOpen: setOpen,
-    onLogout: onLogout
-  }))));
-};
-
-var _excluded$a = ["label", "organisations", "onChange", "selectedOrganisationId"];
-var OrganisationDropDown = function OrganisationDropDown(_ref) {
-  var label = _ref.label,
-    organisations = _ref.organisations,
-    handleChange = _ref.onChange,
-    selectedOrganisationId = _ref.selectedOrganisationId,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$a);
-  var _useState = useState(),
-    selectedOrganisation = _useState[0],
-    setSelectedOrganisation = _useState[1];
-  useEffect(function () {
-    setSelectedOrganisation(organisations.find(function (org) {
-      return org.organisationId === selectedOrganisationId;
-    }));
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [selectedOrganisationId]);
-  return React.createElement(SearchableDropdown, _extends({
-    label: label,
-    items: [].concat(organisations.sort(function (a, b) {
-      return a.tradingName.localeCompare(b.tradingName, 'nb');
-    }).map(function (organisation) {
-      return {
-        value: organisation.organisationId,
-        label: organisation.tradingName
-      };
-    })),
-    selectedItem: selectedOrganisation ? {
-      value: selectedOrganisation.organisationId,
-      label: selectedOrganisation.tradingName
-    } : null,
-    onChange: function onChange(selectedValue) {
-      if (selectedValue) {
-        handleChange(selectedValue.value);
-      }
-    },
-    clearable: false
-  }, rest));
-};
-
-/*global EventListener WindowEventHandlers*/
-function useEventListener(eventName, handler, element) {
-  if (element === void 0) {
-    element = window;
-  }
-  var savedHandler = useRef();
-  useEffect(function () {
-    savedHandler.current = handler;
-  }, [handler]);
-  useEffect(function () {
-    var isSupported = element && element.addEventListener;
-    if (!isSupported) return;
-    var eventListener = function eventListener(event) {
-      return savedHandler.current == null ? void 0 : savedHandler.current(event);
-    };
-    element.addEventListener(eventName, eventListener);
-    return function () {
-      element.removeEventListener(eventName, eventListener);
-    };
-  }, [eventName, element]);
-}
-
-var _excluded$9 = ["language", "options", "className", "onChange"];
-var LanguageSelect = function LanguageSelect(_ref) {
-  var language = _ref.language,
-    options = _ref.options,
+var Menu = function Menu(_ref) {
+  var _ref$as = _ref.as,
+    Component = _ref$as === void 0 ? "nav" : _ref$as,
     className = _ref.className,
-    _onChange = _ref.onChange,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$9);
-  var classNames = cx('eps-language-select', className);
-  return React.createElement("div", _extends({}, rest, {
-    className: classNames
-  }), React.createElement(SegmentedControl, {
-    onChange: function onChange(language) {
-      assertIsDefined(language);
-      _onChange(language);
-    },
-    selectedValue: language
-  }, options.map(function (option) {
-    return React.createElement(SegmentedChoice, {
-      key: option.value,
-      value: option.value
-    }, option.label, option.required && React.createElement("span", {
-      className: "asterisk-margin"
-    }, '*'));
-  })));
-};
-
-var _excluded$8 = ["title", "inputComponent", "languages", "values", "onChange", "name", "variant", "feedback"];
-var ExpandableMultiLanguageInput = function ExpandableMultiLanguageInput(_ref) {
-  var title = _ref.title,
-    InputComponent = _ref.inputComponent,
-    languages = _ref.languages,
-    values = _ref.values,
-    onChange = _ref.onChange,
-    name = _ref.name,
-    variant = _ref.variant,
-    feedback = _ref.feedback,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$8);
-  var handleOnChange = function handleOnChange(language, value) {
-    var changes = _extends({}, values);
-    if (value === '' || !value) {
-      delete changes[language];
-    } else {
-      changes[language] = value;
-    }
-    onChange(changes);
-  };
-  return React.createElement(ExpandablePanel, {
-    title: title,
-    defaultOpen: true,
-    contentStyle: {
-      padding: '4px 4px 4px 4px',
-      marginTop: '16px',
-      marginBottom: '16px'
-    }
-  }, React.createElement(Stack, {
-    space: "medium"
-  }, languages.map(function (_ref2) {
-    var langKey = _ref2.value,
-      label = _ref2.label,
-      required = _ref2.required;
-    return React.createElement(InputComponent, _extends({
-      "data-testid": "multi-lang-input-" + name + "-" + langKey,
-      key: title + langKey,
-      label: required ? label + '*' : label,
-      variant: variant && variant(langKey),
-      feedback: feedback && feedback(langKey),
-      name: name,
-      onChange: function onChange(e) {
-        handleOnChange(langKey, e.target.value);
-      },
-      value: values[langKey] || ''
-    }, rest));
-  })));
+    children = _ref.children;
+  var classList = cx(["eds-contrast", "eps-menu", className]);
+  return React.createElement(Component, {
+    className: classList
+  }, children);
 };
 
-var _excluded$7 = ["className", "inputComponent", "alertLabel", "alertLevel", "name", "languages", "values", "onChange", "defaultLanguage", "label", "onBlur"];
-/**
- * @deprecated use ExpandableMultiLanguageInput
+var _excluded$5 = ["className", "inputComponent", "alertLabel", "alertLevel", "name", "languages", "values", "onChange", "defaultLanguage", "label", "onBlur"];
+/**
+ * @deprecated use ExpandableMultiLanguageInput
  */
 var MultiLanguageInput = function MultiLanguageInput(_ref) {
   var className = _ref.className,
@@ -708,16 +596,16 @@ var MultiLanguageInput = function MultiLanguageInput(_ref) {
     values = _ref.values,
     onChange = _ref.onChange,
     _ref$defaultLanguage = _ref.defaultLanguage,
-    defaultLanguage = _ref$defaultLanguage === void 0 ? 'nob' : _ref$defaultLanguage,
+    defaultLanguage = _ref$defaultLanguage === void 0 ? "nob" : _ref$defaultLanguage,
     _ref$label = _ref.label,
-    label = _ref$label === void 0 ? '' : _ref$label,
+    label = _ref$label === void 0 ? "" : _ref$label,
     _ref$onBlur = _ref.onBlur,
     onBlur = _ref$onBlur === void 0 ? function () {} : _ref$onBlur,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$7);
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$5);
   var _useState = useState(defaultLanguage),
     language = _useState[0],
     setLanguage = _useState[1];
-  var classNames = cx('multi-language-input', className);
+  var classNames = cx("multi-language-input", className);
   var currentValue = values[language];
   var handleOnBlur = function handleOnBlur(e) {
     e.persist();
@@ -733,208 +621,143 @@ var MultiLanguageInput = function MultiLanguageInput(_ref) {
   };
   var handleOnChange = function handleOnChange(value) {
     var changes = Object.assign({}, values);
-    if (value === '' || !value) {
+    if (value === "" || !value) {
       delete changes[language];
     } else {
       changes[language] = value;
     }
     onChange(changes);
   };
-  return React.createElement("div", {
-    className: classNames,
-    tabIndex: 0,
-    onBlur: handleOnBlur,
-    "data-testid": "multi-lang-input-" + name
-  }, React.createElement(Stack, {
-    space: "extraSmall"
-  }, React.createElement(LanguageSelect, {
-    language: language,
-    options: languages,
-    onChange: function onChange(lang) {
-      return handleLanguageChange(lang);
-    }
-  }), React.createElement(InputComponent, _extends({
+  return (
+    // biome-ignore lint/a11y/noStaticElementInteractions: Legacy component
+    React.createElement("div", {
+      className: classNames,
+      // biome-ignore lint/a11y/noNoninteractiveTabindex: Legacy component
+      tabIndex: 0,
+      onBlur: handleOnBlur,
+      "data-testid": "multi-lang-input-" + name
+    }, React.createElement(Stack, {
+      space: "extraSmall"
+    }, React.createElement(LanguageSelect, {
+      language: language,
+      options: languages,
+      onChange: function onChange(lang) {
+        return handleLanguageChange(lang);
+      }
+    }), React.createElement(InputComponent, _extends({
+      label: label,
+      variant: alertLevel,
+      feedback: alertLabel,
+      name: name,
+      className: "language-item",
+      onChange: function onChange(e) {
+        return handleOnChange(e.target.value);
+      },
+      value: currentValue || ""
+    }, rest))))
+  );
+};
+
+var _excluded$4 = ["label", "organisations", "onChange", "selectedOrganisationId"];
+var OrganisationDropDown = function OrganisationDropDown(_ref) {
+  var label = _ref.label,
+    organisations = _ref.organisations,
+    handleChange = _ref.onChange,
+    selectedOrganisationId = _ref.selectedOrganisationId,
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
+  var _useState = useState(),
+    selectedOrganisation = _useState[0],
+    setSelectedOrganisation = _useState[1];
+  useEffect(function () {
+    setSelectedOrganisation(organisations.find(function (org) {
+      return org.organisationId === selectedOrganisationId;
+    }));
+  }, [selectedOrganisationId, organisations]);
+  return React.createElement(SearchableDropdown, _extends({
     label: label,
-    variant: alertLevel,
-    feedback: alertLabel,
-    name: name,
-    className: "language-item",
-    onChange: function onChange(e) {
-      return handleOnChange(e.target.value);
+    items: [].concat(organisations.sort(function (a, b) {
+      return a.tradingName.localeCompare(b.tradingName, "nb");
+    }).map(function (organisation) {
+      return {
+        value: organisation.organisationId,
+        label: organisation.tradingName
+      };
+    })),
+    selectedItem: selectedOrganisation ? {
+      value: selectedOrganisation.organisationId,
+      label: selectedOrganisation.tradingName
+    } : null,
+    onChange: function onChange(selectedValue) {
+      if (selectedValue) {
+        handleChange(selectedValue.value);
+      }
     },
-    value: currentValue || ''
-  }, rest))));
+    clearable: false
+  }, rest));
 };
 
-var _excluded$6 = ["children", "className"];
-var Unbutton = function Unbutton(_ref) {
-  var children = _ref.children,
-    className = _ref.className,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$6);
-  return React.createElement(Button, _extends({
-    variant: "primary"
-  }, rest, {
-    className: cx('eps-unbutton', className)
-  }), children);
+var Pager = function Pager(_ref) {
+  var collectionSize = _ref.collectionSize,
+    pageSize = _ref.pageSize,
+    _onPageChange = _ref.onPageChange,
+    currentPage = _ref.currentPage;
+  var pageCount = Math.ceil(collectionSize / pageSize);
+  return React.createElement(Pagination, {
+    pageCount: pageCount,
+    currentPage: currentPage,
+    onPageChange: function onPageChange(page) {
+      _onPageChange(page);
+    }
+  });
 };
 
-function isFunction(functionToCheck) {
-  return functionToCheck && {}.toString.call(functionToCheck) === '[object Function]';
-}
-
-var newAppVersionErrorMessage = "Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.";
-var ErrorBoundary = /*#__PURE__*/function (_Component) {
-  function ErrorBoundary(props) {
-    var _this;
-    _this = _Component.call(this, props) || this;
-    _this.state = {
-      error: null
-    };
-    return _this;
-  }
-  _inheritsLoose(ErrorBoundary, _Component);
-  ErrorBoundary.getDerivedStateFromError = function getDerivedStateFromError(error) {
+var PageTitle = function PageTitle(_ref) {
+  var pathname = _ref.pathname,
+    onBreadcrumbLookup = _ref.onBreadcrumbLookup;
+  var paths = splitUrlPath(pathname);
+  var pageTitles = paths.map(function (path) {
     return {
-      error: error
+      title: onBreadcrumbLookup(path),
+      path: path
     };
-  };
-  var _proto = ErrorBoundary.prototype;
-  _proto.componentDidCatch = function componentDidCatch(error, errorInfo) {
-    var _this$props$handleErr, _this$props;
-    // React always logs in development
-    (_this$props$handleErr = (_this$props = this.props).handleError) == null || _this$props$handleErr.call(_this$props, error, errorInfo);
-  };
-  _proto.render = function render() {
-    var _this2 = this;
-    var error = this.state.error;
-    var _this$props2 = this.props,
-      fallback = _this$props2.fallback,
-      children = _this$props2.children;
-    if (error) {
-      if (isFunction(fallback)) {
-        return fallback({
-          retry: function retry() {
-            return _this2.setState({
-              error: null
-            });
-          },
-          error: error
-        });
-      } else if (error.name === 'NotFoundError' && error.message === newAppVersionErrorMessage) {
-        return React.createElement(RefreshBannerInfo, null);
-      }
-      return fallback;
-    }
-    return children;
-  };
-  return ErrorBoundary;
-}(Component);
-var LANGUAGE_STORAGE_KEY = 'EP::locale';
-function RefreshBannerInfo() {
-  // Taken from ./app-shell/src/storage.ts
-  var language = localStorage.getItem(LANGUAGE_STORAGE_KEY);
-  var isNorwegian = language === 'nb' || language === 'nb-NO';
-  return React.createElement(Box, {
-    maxWidth: "large"
-  }, React.createElement(BannerAlertBox, {
-    variant: "info",
-    title: isNorwegian ? 'En ny versjon av nettsiden er tilgjengelig.' : 'A new version of the website is available.'
-  }, React.createElement(Box, {
-    paddingBottom: "medium"
-  }, React.createElement(Paragraph, {
-    margin: "none"
-  }, isNorwegian ? 'Vennligst oppdater.' : 'Please refresh.')), React.createElement(PrimaryButton, {
-    onClick: function onClick() {
-      return window.location.reload();
-    }
-  }, isNorwegian ? 'Oppdater' : 'Refresh')));
-}
-
-var _excluded$5 = ["date", "locale", "as", "hideTime"];
-var FormatDateTime = function FormatDateTime(_ref) {
-  var date = _ref.date,
-    locale = _ref.locale,
-    _ref$as = _ref.as,
-    Component = _ref$as === void 0 ? 'main' : _ref$as,
-    hideTime = _ref.hideTime,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$5);
-  return React.createElement(Component, _extends({}, rest), hideTime ? localeDate(date, locale) : localeDateTime(date, locale));
-};
-
-var _excluded$4 = ["amount", "as"];
-var FormatCurrencyAmount = function FormatCurrencyAmount(_ref) {
-  var amount = _ref.amount,
-    _ref$as = _ref.as,
-    Component = _ref$as === void 0 ? 'span' : _ref$as,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
-  var parsedAmount = Number(amount) || 0;
-  var formattedAmount = new Intl.NumberFormat('nb-NO', {
-    maximumFractionDigits: 2,
-    minimumFractionDigits: 2
-  }).format(parsedAmount);
-  return React.createElement(Component, _extends({}, rest), formattedAmount);
-};
-
-var _excluded$3 = ["items", "locale", "className"];
-var AuditInfo = function AuditInfo(_ref) {
-  var items = _ref.items,
-    locale = _ref.locale,
-    className = _ref.className,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
-  var classNames = cx('ep-audit-info', className);
-  return React.createElement("div", _extends({
-    className: classNames
-  }, rest), items.map(function (_ref2, i) {
-    var label = _ref2.label,
-      value = _ref2.value;
-    return React.createElement(Stack, {
-      space: "small",
-      key: i
-    }, React.createElement("div", {
-      className: "ep-audit-info-label"
-    }, label), React.createElement("div", null, isDate(value) || isDateString(value) ? React.createElement(FormatDateTime, {
-      date: value,
-      locale: locale
-    }) : React.createElement("span", null, value)));
-  }));
+  }).filter(function (_ref2) {
+    var title = _ref2.title;
+    return title !== undefined;
+  }).map(function (_ref3) {
+    var title = _ref3.title;
+    return title;
+  }).reverse().join(" | ");
+  useEffect(function () {
+    document.title = pageTitles + " | Entur Partner";
+  }, [pageTitles]);
+  return null;
 };
 
-var _excluded$2 = ["isOpen", "children", "message", "size", "buttons", "onConfirm", "messages", "onClose", "onDismiss"];
-var ConfirmModal = function ConfirmModal(_ref) {
-  var _ref$isOpen = _ref.isOpen,
-    isOpen = _ref$isOpen === void 0 ? false : _ref$isOpen,
-    children = _ref.children,
-    message = _ref.message,
-    _ref$size = _ref.size,
-    size = _ref$size === void 0 ? 'medium' : _ref$size,
-    buttons = _ref.buttons,
-    onConfirm = _ref.onConfirm,
-    messages = _ref.messages,
-    onClose = _ref.onClose,
-    onDismiss = _ref.onDismiss,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
-  var childrenToRender = children ? children : message;
-  var handleDismiss = onClose ? onClose : onDismiss;
-  return React.createElement(Modal, _extends({
-    size: size,
-    open: isOpen,
-    onDismiss: handleDismiss
-  }, rest), isString(childrenToRender) ? React.createElement(Paragraph, null, childrenToRender) : React.createElement(Box, {
-    paddingBottom: "medium"
-  }, childrenToRender), React.createElement(ButtonGroup, null, onConfirm ? React.createElement(React.Fragment, null, React.createElement(SecondaryButton, {
-    onClick: handleDismiss,
-    "data-testid": "cancel-modal-button"
-  }, messages.cancel), React.createElement(PrimaryButton, {
-    onClick: onConfirm,
-    "data-testid": "confirm-modal-button"
-  }, messages.confirm)) : buttons));
+/**
+ * Note: This component uses BusinessCapability, not because we only want to
+ * check BusinessCapabilities but because it represents a minimal subset of
+ * what we need to check.
+ */
+var PermissionCheck = function PermissionCheck(_ref) {
+  var children = _ref.children,
+    _ref$fallback = _ref.fallback,
+    fallback = _ref$fallback === void 0 ? null : _ref$fallback,
+    permissions = _ref.permissions,
+    _ref$oneOf = _ref.oneOf,
+    oneOf = _ref$oneOf === void 0 ? [] : _ref$oneOf,
+    _ref$all = _ref.all,
+    all = _ref$all === void 0 ? [] : _ref$all;
+  var allIsAllowed = hasAllPermissions(all, permissions);
+  var oneOfIsAllowed = hasOneOfPermissions(oneOf, permissions);
+  var allowed = allIsAllowed && oneOfIsAllowed;
+  return React.createElement(React.Fragment, null, allowed ? children : fallback);
 };
 
-var _excluded$1 = ["children", "shouldBlockNavigation"];
+var _excluded$3 = ["children", "shouldBlockNavigation"];
 var RouteLeavingGuard = function RouteLeavingGuard(_ref) {
   var children = _ref.children,
     shouldBlockNavigation = _ref.shouldBlockNavigation,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
   assertIsDefined(useInRouterContext() ? true : undefined, "RouteLeavingGuard must be used within a data router.");
   var blocker = useBlocker(function (_ref2) {
     var currentLocation = _ref2.currentLocation,
@@ -943,47 +766,32 @@ var RouteLeavingGuard = function RouteLeavingGuard(_ref) {
   });
   return React.createElement(ConfirmModal, _extends({
     onDismiss: function onDismiss() {
-      if (blocker.state === 'blocked') {
+      if (blocker.state === "blocked") {
         blocker.reset();
       }
     },
-    open: blocker.state === 'blocked',
+    open: blocker.state === "blocked",
     onConfirm: function onConfirm() {
-      if (blocker.state === 'blocked') {
+      if (blocker.state === "blocked") {
         blocker.proceed();
       }
     }
   }, rest), children);
 };
 
-var Pager = function Pager(_ref) {
-  var collectionSize = _ref.collectionSize,
-    pageSize = _ref.pageSize,
-    _onPageChange = _ref.onPageChange,
-    currentPage = _ref.currentPage;
-  var pageCount = Math.ceil(collectionSize / pageSize);
-  return React.createElement(Pagination, {
-    pageCount: pageCount,
-    currentPage: currentPage,
-    onPageChange: function onPageChange(page) {
-      _onPageChange(page);
-    }
-  });
-};
-
 var StatusLabel = function StatusLabel(_ref) {
   var _ref$active = _ref.active,
     active = _ref$active === void 0 ? false : _ref$active,
     _ref$label = _ref.label,
-    label = _ref$label === void 0 ? '' : _ref$label,
+    label = _ref$label === void 0 ? "" : _ref$label,
     aggressiveInactive = _ref.aggressiveInactive,
     showBullet = _ref.showBullet,
     center = _ref.center;
-  var bulletClassNames = cx('eps-status-label__bullet', {
+  var bulletClassNames = cx("eps-status-label__bullet", {
     active: active,
     aggressive: aggressiveInactive
   });
-  var statusLabelClassNames = cx('eps-status-label', {
+  var statusLabelClassNames = cx("eps-status-label", {
     center: center
   });
   return React.createElement("div", {
@@ -993,83 +801,21 @@ var StatusLabel = function StatusLabel(_ref) {
   }), React.createElement("div", null, label));
 };
 
-/**
- * Note: This component uses BusinessCapability, not because we only want to
- * check BusinessCapabilities but because it represents a minimal subset of
- * what we need to check.
- */
-var PermissionCheck = function PermissionCheck(_ref) {
-  var children = _ref.children,
-    _ref$fallback = _ref.fallback,
-    fallback = _ref$fallback === void 0 ? null : _ref$fallback,
-    permissions = _ref.permissions,
-    _ref$oneOf = _ref.oneOf,
-    oneOf = _ref$oneOf === void 0 ? [] : _ref$oneOf,
-    _ref$all = _ref.all,
-    all = _ref$all === void 0 ? [] : _ref$all;
-  var allIsAllowed = hasAllPermissions(all, permissions);
-  var oneOfIsAllowed = hasOneOfPermissions(oneOf, permissions);
-  var allowed = allIsAllowed && oneOfIsAllowed;
-  return React.createElement(React.Fragment, null, allowed ? children : fallback);
-};
-
-var Breadcrumbs = function Breadcrumbs(_ref) {
-  var prependBreadcrumbItem = _ref.prependBreadcrumbItem,
-    pathname = _ref.pathname,
-    onBreadcrumbLookup = _ref.onBreadcrumbLookup;
-  var paths = splitUrlPath(pathname);
-  var breadcrumbs = paths.map(function (path) {
-    return {
-      title: onBreadcrumbLookup(path),
-      path: path
-    };
-  }).filter(function (_ref2) {
-    var title = _ref2.title;
-    return title !== undefined;
-  });
-  var breadcrumbElements = breadcrumbs.map(function (_ref3, i) {
-    var title = _ref3.title,
-      path = _ref3.path;
-    var isLast = i === breadcrumbs.length - 1;
-    if (isLast) {
-      return React.createElement(BreadcrumbItem, {
-        key: path,
-        as: 'span'
-      }, title);
-    }
-    return React.createElement(BreadcrumbItem, {
-      key: path,
-      as: Link$2,
-      to: path
-    }, title);
-  });
-  if (prependBreadcrumbItem) {
-    return React.createElement(BreadcrumbNavigation, null, [prependBreadcrumbItem].concat(breadcrumbElements));
-  }
-  return React.createElement(BreadcrumbNavigation, null, breadcrumbElements);
-};
-
-var Link = function Link(props) {
-  return React.createElement(Link$1, _extends({}, props, {
-    as: Link$2
-  }), props.children);
-};
-
-var _excluded = ["as", "children", "fontSize", "color", "lineHeight", "fontWeight", "className"];
+var _excluded$2 = ["as", "children", "fontSize", "color", "lineHeight", "fontWeight", "className"];
 var Text = function Text(_ref) {
   var _ref$as = _ref.as,
-    component = _ref$as === void 0 ? 'span' : _ref$as,
+    component = _ref$as === void 0 ? "span" : _ref$as,
     children = _ref.children,
     fontSize = _ref.fontSize,
     color = _ref.color,
     lineHeight = _ref.lineHeight,
     fontWeight = _ref.fontWeight,
     className = _ref.className,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded);
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
   var classes = [];
-  fontSize && classes.push.apply(classes, responsiveProp('eps-font-size-', fontSize));
-  lineHeight && classes.push.apply(classes, responsiveProp('eps-line-height-', lineHeight));
-  fontWeight && classes.push('eps-font-weight-' + fontWeight);
+  fontSize && classes.push.apply(classes, responsiveProp("eps-font-size-", fontSize));
+  lineHeight && classes.push.apply(classes, responsiveProp("eps-line-height-", lineHeight));
+  fontWeight && classes.push("eps-font-weight-" + fontWeight);
   var classList = cx(classes, className);
   return React.createElement(Box, _extends({
     as: component,
@@ -1078,32 +824,298 @@ var Text = function Text(_ref) {
   }, rest), children);
 };
 
-/**
- * This component changes page title by using helmet and current path. It will translate subpaths, join them with a dash
- * and display it on browser tab.
- *
- * @param Props.pathname - The current path from react-router-dom.useLocation()
- * @param Props.onBreadcrumbLookup - A function that takes a path and returns a i18n translated string or undefined
- * @returns A Helmet component with updated title
- */
-function PageTitle(_ref) {
-  var pathname = _ref.pathname,
-    onBreadcrumbLookup = _ref.onBreadcrumbLookup;
-  var paths = splitUrlPath(pathname);
-  var pageTitles = paths.map(function (path) {
-    return {
-      title: onBreadcrumbLookup(path),
-      path: path
+var _excluded$1 = ["children", "className"];
+var Unbutton = function Unbutton(_ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
+  return React.createElement(Button, _extends({
+    variant: "primary"
+  }, rest, {
+    className: cx("eps-unbutton", className)
+  }), children);
+};
+
+var CustomOverflowMenuItem = function CustomOverflowMenuItem(props) {
+  return React.createElement("button", _extends({
+    className: cx(props.className, "eps-overflow-menu__item"),
+    role: "menuitem"
+  }, props));
+};
+
+var CookieSettingsMenuItem = function CookieSettingsMenuItem(_ref) {
+  var name = _ref.name,
+    setOpen = _ref.setOpen,
+    onCookieSettingsOpen = _ref.onCookieSettingsOpen;
+  return React.createElement(CustomOverflowMenuItem, {
+    onClick: function onClick() {
+      onCookieSettingsOpen();
+      setOpen(false);
+    },
+    className: "eps-overflow-menu__item"
+  }, React.createElement("span", {
+    "aria-hidden": true
+  }, React.createElement(CookieIcon, {
+    size: "1rem",
+    inline: true
+  })), name);
+};
+
+function useOutsideClick(ref, buttonRef, handler) {
+  React.useEffect(function () {
+    var listener = function listener(event) {
+      if (elementContainsEventTarget(ref.current, event) || elementContainsEventTarget(buttonRef.current, event)) {
+        return;
+      }
+      handler();
     };
-  }).filter(function (_ref2) {
-    var title = _ref2.title;
-    return title !== undefined;
-  }).map(function (_ref3) {
-    var title = _ref3.title;
-    return title;
-  }).reverse().join(' | ');
-  return React.createElement(Helmet, null, React.createElement("title", null, pageTitles, " | Entur Partner"));
+    document.addEventListener("mousedown", listener);
+    document.addEventListener("touchstart", listener);
+    return function () {
+      document.removeEventListener("mousedown", listener);
+      document.removeEventListener("touchstart", listener);
+    };
+  }, [ref, buttonRef, handler]);
+}
+function elementContainsEventTarget(element, event) {
+  if (!element) {
+    return false;
+  }
+  if (element.contains(event.target)) {
+    return true;
+  }
+  // For elements inside a Shadow DOM we need to check the composedPath
+  if (event.composed && event.composedPath) {
+    var contains = event.composedPath().find(function (target) {
+      if (target === window) {
+        return false;
+      }
+      return element.contains(target);
+    });
+    return !!contains;
+  }
+  return false;
+}
+
+var _excluded = ["className", "children", "userName", "open", "onOpenChange", "environment"];
+var CustomOverflowMenu = function CustomOverflowMenu(_ref) {
+  var className = _ref.className,
+    children = _ref.children,
+    userName = _ref.userName,
+    open = _ref.open,
+    onOpenChange = _ref.onOpenChange,
+    environment = _ref.environment,
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded);
+  var overflowItemsClasses = cx("eps-overflow-menu__group", {
+    "eps-overflow-menu__group--open": open
+  });
+  var overflowContentRef = React.useRef(null);
+  var overflowMenuTriggerRef = React.useRef(null);
+  useOutsideClick(overflowContentRef, overflowMenuTriggerRef, function () {
+    return onOpenChange(false);
+  });
+  return React.createElement("div", null, React.createElement(SecondaryButton, _extends({
+    className: cx("eps-overflow-menu__button", className),
+    onClick: function onClick() {
+      return onOpenChange(!open);
+    },
+    "aria-haspopup": true,
+    "aria-expanded": open,
+    ref: overflowMenuTriggerRef
+  }, rest), React.createElement("div", {
+    className: "eps-overflow-menu__button-contents"
+  }, React.createElement("span", {
+    className: "eds-overflow-menu__user-icon"
+  }, React.createElement(UserIcon, {
+    inline: true
+  })), React.createElement(Heading6, {
+    margin: "none",
+    as: "span"
+  }, userName, environment !== undefined && environment !== Environment.Production && React.createElement("span", {
+    style: {
+      color: getColorForEnvironment(environment)
+    }
+  }, " ", "(", getHumanReadableEnvironment(environment), ")")), React.createElement("span", {
+    className: "eps-arrow-icon"
+  }, React.createElement(DownArrowIcon, {
+    inline: true
+  })))), open && React.createElement("div", {
+    className: overflowItemsClasses,
+    role: "menu",
+    ref: overflowContentRef
+  }, children));
+};
+
+var LanguageSwitchMenuItem = function LanguageSwitchMenuItem(_ref) {
+  var language = _ref.language,
+    onLanguageChange = _ref.onLanguageChange,
+    setOpen = _ref.setOpen,
+    name = _ref.name;
+  var useB47LanguageKey = useFeatureToggle("USE_BCP-47_LANGUAGE_KEY");
+  var norwegianLanguageKey = useB47LanguageKey ? "nb-NO" : "nb";
+  var englishLanguageKey = useB47LanguageKey ? "en-GB" : "en";
+  return React.createElement(React.Fragment, null, language === englishLanguageKey ? React.createElement(CustomOverflowMenuItem, {
+    onClick: function onClick() {
+      onLanguageChange(norwegianLanguageKey);
+      setOpen(false);
+    },
+    className: "eps-overflow-menu__item"
+  }, React.createElement("span", {
+    "aria-hidden": true,
+    className: "eps-overflow-menu__icon-margin"
+  }, React.createElement(NorwayIcon, {
+    size: "1rem",
+    inline: true
+  })), name) : React.createElement(CustomOverflowMenuItem, {
+    onClick: function onClick() {
+      onLanguageChange(englishLanguageKey);
+      setOpen(false);
+    },
+    className: "eps-overflow-menu__item"
+  }, React.createElement("span", {
+    "aria-hidden": true,
+    className: "eps-overflow-menu__icon-margin"
+  }, React.createElement(UKIcon, {
+    size: "1rem",
+    inline: true
+  })), name));
+};
+
+var LogOutMenuItem = function LogOutMenuItem(_ref) {
+  var name = _ref.name,
+    setOpen = _ref.setOpen,
+    onLogout = _ref.onLogout;
+  return React.createElement(CustomOverflowMenuItem, {
+    onClick: function onClick() {
+      onLogout();
+      setOpen(false);
+    },
+    "data-testid": "user-menu-logout",
+    className: "eps-overflow-menu__item"
+  }, React.createElement("span", {
+    "aria-hidden": true
+  }, React.createElement(LogOutIcon, {
+    size: "1rem",
+    inline: true
+  })), name);
+};
+
+var UserMenuItem = function UserMenuItem(_ref) {
+  var name = _ref.name,
+    setOpen = _ref.setOpen,
+    onNavigateToMyProfile = _ref.onNavigateToMyProfile;
+  return React.createElement(Link$1, {
+    to: "/permission-admin/my-profile",
+    style: {
+      textDecoration: "none"
+    }
+  }, React.createElement(CustomOverflowMenuItem, {
+    onClick: function onClick() {
+      setOpen(false);
+      onNavigateToMyProfile();
+    },
+    className: "eps-overflow-menu__item"
+  }, React.createElement("span", {
+    "aria-hidden": true
+  }, React.createElement(UserIcon, {
+    size: "1rem",
+    inline: true
+  })), name));
+};
+
+var VersionMenuItem = function VersionMenuItem(_ref) {
+  var title = _ref.title,
+    setOpen = _ref.setOpen;
+  var navigate = useNavigate(); // Hide useNavigate from standalone micro-frontends because it is not under RouterProvider
+  return React.createElement(CustomOverflowMenuItem, {
+    onClick: function onClick() {
+      navigate("/app-version");
+      setOpen(false);
+    },
+    className: "eps-overflow-menu__item"
+  }, React.createElement("span", {
+    "aria-hidden": true
+  }, React.createElement(ChannelsIcon, {
+    className: "eps-version-icon",
+    size: "1rem",
+    inline: true
+  })), title);
+};
+
+/** biome-ignore-all lint/correctness/useUniqueElementIds: Ignore unique id for now */
+var UserMenu = function UserMenu(_ref) {
+  var className = _ref.className,
+    messages = _ref.messages,
+    onLogout = _ref.onLogout,
+    onLanguageChange = _ref.onLanguageChange,
+    userName = _ref.userName,
+    language = _ref.language,
+    environment = _ref.environment,
+    showVersionItem = _ref.showVersionItem,
+    showMyProfileItem = _ref.showMyProfileItem,
+    showCookieSettingsItem = _ref.showCookieSettingsItem,
+    onNavigateToMyProfile = _ref.onNavigateToMyProfile,
+    _ref$onCookieSettings = _ref.onCookieSettingsOpen,
+    onCookieSettingsOpen = _ref$onCookieSettings === void 0 ? function () {} : _ref$onCookieSettings;
+  var triggerClassList = cx(["eps-user-menu__trigger-button", className]);
+  var _useState = useState(false),
+    open = _useState[0],
+    setOpen = _useState[1];
+  return React.createElement("div", {
+    id: "eps-user-menu"
+  }, React.createElement(CustomOverflowMenu, {
+    open: open,
+    onOpenChange: setOpen,
+    className: triggerClassList,
+    userName: userName,
+    environment: environment
+  }, React.createElement("div", {
+    id: "eps-overflow-menu"
+  }, React.createElement(LanguageSwitchMenuItem, {
+    name: messages.switchLanguage,
+    language: language,
+    onLanguageChange: onLanguageChange,
+    setOpen: setOpen
+  }), showVersionItem && messages.appVersion && React.createElement(VersionMenuItem, {
+    title: messages.appVersion,
+    setOpen: setOpen
+  }), showMyProfileItem && messages.myProfile && React.createElement(UserMenuItem, {
+    name: messages.myProfile,
+    setOpen: setOpen,
+    onNavigateToMyProfile: onNavigateToMyProfile
+  }), showCookieSettingsItem && messages.cookieSettings && React.createElement(CookieSettingsMenuItem, {
+    name: messages.cookieSettings,
+    setOpen: setOpen,
+    onCookieSettingsOpen: onCookieSettingsOpen
+  }), React.createElement(LogOutMenuItem, {
+    name: messages.logout,
+    setOpen: setOpen,
+    onLogout: onLogout
+  }))));
+};
+
+/*global EventListener WindowEventHandlers*/
+function useEventListener(eventName, handler, element) {
+  if (element === void 0) {
+    element = window;
+  }
+  var savedHandler = useRef();
+  useEffect(function () {
+    savedHandler.current = handler;
+  }, [handler]);
+  useEffect(function () {
+    var _element;
+    var isSupported = (_element = element) == null ? void 0 : _element.addEventListener;
+    if (!isSupported) return;
+    var eventListener = function eventListener(event) {
+      return savedHandler.current == null ? void 0 : savedHandler.current(event);
+    };
+    element.addEventListener(eventName, eventListener);
+    return function () {
+      element.removeEventListener(eventName, eventListener);
+    };
+  }, [eventName, element]);
 }
 
-export { ActionBar, ActionBarLeft, ActionBarRight, AuditInfo, Box, Breadcrumbs, ConfirmModal, Content, EnturPartnerLogo, EnturPartnerLogoSvg, Environment, ErrorBoundary, ExpandableMultiLanguageInput, FeatureToggle, FormatCurrencyAmount, FormatDateTime, LanguageSelect, Link, LinkButton, Menu, MultiLanguageInput, OrganisationDropDown, PageTitle, Pager, PermissionCheck, RouteLeavingGuard, Stack, StatusLabel, Text, Unbutton, UserMenu, featureFlag, getColorForEnvironment, getHumanReadableEnvironment, responsiveProp, useEventListener, useFeatureToggle };
+export { ActionBar, ActionBarLeft, ActionBarRight, AuditInfo, Box, Breadcrumbs, ConfirmModal, Content, EnturPartnerLogo, EnturPartnerLogoSvg, Environment, ErrorBoundary, ExpandableMultiLanguageInput, FeatureToggle, FormatCurrencyAmount, FormatDateTime, LanguageSelect, LegacyPageTitle, Link, LinkButton, Menu, MultiLanguageInput, OrganisationDropDown, PageTitle, Pager, PermissionCheck, RouteLeavingGuard, Stack, StatusLabel, Text, Unbutton, UserMenu, featureFlag, getColorForEnvironment, getHumanReadableEnvironment, responsiveProp, useEventListener, useFeatureToggle };
 //# sourceMappingURL=common.esm.js.map