@entur/alert 0.17.13-beta.0 → 0.17.13-beta.10

package/dist/alert.esm.js

@@ -1,482 +1,399 @@
-import { warnAboutMissingStyles } from "@entur/utils";
-import { jsxs, jsx } from "react/jsx-runtime";
-import React from "react";
-import { ValidationErrorIcon, ValidationInfoIcon, ValidationExclamationIcon, ValidationSuccessIcon, CloseIcon, CopyIcon } from "@entur/icons";
-import { IconButton } from "@entur/button";
-import { Tooltip } from "@entur/tooltip";
-import { PreformattedText } from "@entur/typography";
-import { BaseExpand, ExpandArrow } from "@entur/expand";
-function getDefaultExportFromCjs(x) {
-  return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x;
+import { warnAboutMissingStyles } from '@entur/utils';
+import React from 'react';
+import classNames from 'classnames';
+import { CloseIcon, ValidationSuccessIcon, ValidationInfoIcon, ValidationExclamationIcon, ValidationErrorIcon, CopyIcon } from '@entur/icons';
+import { IconButton } from '@entur/button';
+import { Tooltip } from '@entur/tooltip';
+import copy from 'copy-text-to-clipboard';
+import { PreformattedText } from '@entur/typography';
+import { BaseExpand, ExpandArrow } from '@entur/expand/';
+
+function _extends() {
+  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 n;
+  }, _extends.apply(null, arguments);
 }
-var classnames = { exports: {} };
-/*!
-	Copyright (c) 2018 Jed Watson.
-	Licensed under the MIT License (MIT), see
-	http://jedwatson.github.io/classnames
-*/
-var hasRequiredClassnames;
-function requireClassnames() {
-  if (hasRequiredClassnames) return classnames.exports;
-  hasRequiredClassnames = 1;
-  (function(module) {
-    (function() {
-      var hasOwn = {}.hasOwnProperty;
-      function classNames2() {
-        var classes = "";
-        for (var i = 0; i < arguments.length; i++) {
-          var arg = arguments[i];
-          if (arg) {
-            classes = appendClass(classes, parseValue(arg));
-          }
-        }
-        return classes;
-      }
-      function parseValue(arg) {
-        if (typeof arg === "string" || typeof arg === "number") {
-          return arg;
-        }
-        if (typeof arg !== "object") {
-          return "";
-        }
-        if (Array.isArray(arg)) {
-          return classNames2.apply(null, arg);
-        }
-        if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes("[native code]")) {
-          return arg.toString();
-        }
-        var classes = "";
-        for (var key in arg) {
-          if (hasOwn.call(arg, key) && arg[key]) {
-            classes = appendClass(classes, key);
-          }
-        }
-        return classes;
-      }
-      function appendClass(value, newClass) {
-        if (!newClass) {
-          return value;
-        }
-        if (value) {
-          return value + " " + newClass;
-        }
-        return value + newClass;
-      }
-      if (module.exports) {
-        classNames2.default = classNames2;
-        module.exports = classNames2;
-      } else {
-        window.classNames = classNames2;
-      }
-    })();
-  })(classnames);
-  return classnames.exports;
+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 t;
 }
-var classnamesExports = requireClassnames();
-const classNames = /* @__PURE__ */ getDefaultExportFromCjs(classnamesExports);
-const iconsMap = {
+
+var _excluded$3 = ["children", "className", "closable", "closeButtonLabel", "variant", "onClose", "size", "title", "toastIsBeingRemoved"];
+var iconsMap = {
   success: {
     icon: ValidationSuccessIcon,
-    description: "Suksessmelding"
+    description: 'Suksessmelding'
+  },
+  information: {
+    icon: ValidationInfoIcon,
+    description: 'Infomelding'
   },
-  information: { icon: ValidationInfoIcon, description: "Infomelding" },
   warning: {
     icon: ValidationExclamationIcon,
-    description: "Varselmelding"
+    description: 'Varselmelding'
+  },
+  negative: {
+    icon: ValidationErrorIcon,
+    description: 'Feilmelding'
   },
-  negative: { icon: ValidationErrorIcon, description: "Feilmelding" },
   //deprecated
-  info: { icon: ValidationInfoIcon, description: "Infomelding" },
-  error: { icon: ValidationErrorIcon, description: "Feilmelding" }
+  info: {
+    icon: ValidationInfoIcon,
+    description: 'Infomelding'
+  },
+  error: {
+    icon: ValidationErrorIcon,
+    description: 'Feilmelding'
+  }
 };
-const BaseAlertBox = ({
-  children,
-  className,
-  closable = false,
-  closeButtonLabel = "Lukk",
-  variant,
-  onClose = () => ({}),
-  size,
-  title,
-  toastIsBeingRemoved,
-  ...rest
-}) => {
-  const [isClosed, setClosed] = React.useState(false);
+var BaseAlertBox = function BaseAlertBox(_ref) {
+  var children = _ref.children,
+    className = _ref.className,
+    _ref$closable = _ref.closable,
+    closable = _ref$closable === void 0 ? false : _ref$closable,
+    _ref$closeButtonLabel = _ref.closeButtonLabel,
+    closeButtonLabel = _ref$closeButtonLabel === void 0 ? 'Lukk' : _ref$closeButtonLabel,
+    variant = _ref.variant,
+    _ref$onClose = _ref.onClose,
+    onClose = _ref$onClose === void 0 ? function () {
+      return {};
+    } : _ref$onClose,
+    size = _ref.size,
+    title = _ref.title,
+    toastIsBeingRemoved = _ref.toastIsBeingRemoved,
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
+  var _React$useState = React.useState(false),
+    isClosed = _React$useState[0],
+    setClosed = _React$useState[1];
   if (isClosed) {
     return null;
   }
-  const handleClose = () => {
+  var handleClose = function handleClose() {
     setClosed(true);
     onClose();
   };
-  const Icon = iconsMap[variant].icon;
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: classNames(
-        "eds-alert-box",
-        `eds-alert-box--${size}`,
-        `eds-alert-box--${variant}`,
-        {
-          "eds-alert-box--toast--exit-animation": toastIsBeingRemoved,
-          "eds-alert-box--no-title": !title
-        },
-        className
-      ),
-      ...rest,
-      children: [
-        /* @__PURE__ */ jsx(
-          Icon,
-          {
-            role: "img",
-            className: "eds-alert-box__icon",
-            "aria-label": iconsMap[variant].description
-          }
-        ),
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            className: classNames("eds-alert-box__content", {
-              "eds-alert-box__content--no-children": !children
-            }),
-            children: [
-              title && /* @__PURE__ */ jsx("div", { className: "eds-alert-box__title", children: title }),
-              children && children
-            ]
-          }
-        ),
-        closable && /* @__PURE__ */ jsx(
-          Tooltip,
-          {
-            className: "eds-alert-box__tooltip",
-            "aria-hidden": true,
-            placement: "bottom",
-            content: "Lukk",
-            children: /* @__PURE__ */ jsx(
-              IconButton,
-              {
-                className: "eds-alert-box__close-button",
-                "aria-label": closeButtonLabel,
-                onClick: handleClose,
-                type: "button",
-                children: /* @__PURE__ */ jsx(CloseIcon, {})
-              }
-            )
-          }
-        )
-      ]
-    }
-  );
+  var Icon = iconsMap[variant].icon;
+  return React.createElement("div", _extends({
+    className: classNames('eds-alert-box', "eds-alert-box--" + size, "eds-alert-box--" + variant, {
+      'eds-alert-box--toast--exit-animation': toastIsBeingRemoved,
+      'eds-alert-box--no-title': !title
+    }, className)
+  }, rest), React.createElement(Icon, {
+    role: "img",
+    className: "eds-alert-box__icon",
+    "aria-label": iconsMap[variant].description
+  }), React.createElement("div", {
+    className: classNames('eds-alert-box__content', {
+      'eds-alert-box__content--no-children': !children
+    })
+  }, title && React.createElement("div", {
+    className: "eds-alert-box__title"
+  }, title), children && children), closable && React.createElement(Tooltip, {
+    className: "eds-alert-box__tooltip",
+    "aria-hidden": true,
+    placement: "bottom",
+    content: "Lukk"
+  }, React.createElement(IconButton, {
+    className: "eds-alert-box__close-button",
+    "aria-label": closeButtonLabel,
+    onClick: handleClose,
+    type: "button"
+  }, React.createElement(CloseIcon, null))));
 };
-const BannerAlertBox = (props) => /* @__PURE__ */ jsx(BaseAlertBox, { ...props, size: "banner" });
-const ToastAlertBox = (props) => /* @__PURE__ */ jsx(BaseAlertBox, { ...props, size: "toast", role: "status" });
-const SmallAlertBox = ({
-  className,
-  width,
-  onClose,
-  closable = false,
-  closeButtonLabel,
-  ...rest
-}) => /* @__PURE__ */ jsx(
-  BaseAlertBox,
-  {
+
+var BannerAlertBox = function BannerAlertBox(props) {
+  return React.createElement(BaseAlertBox, _extends({}, props, {
+    size: "banner"
+  }));
+};
+
+var ToastAlertBox = function ToastAlertBox(props) {
+  return React.createElement(BaseAlertBox, _extends({}, props, {
+    size: "toast",
+    role: "status"
+  }));
+};
+
+var _excluded$2 = ["className", "width", "onClose", "closable", "closeButtonLabel"];
+var SmallAlertBox = function SmallAlertBox(_ref) {
+  var className = _ref.className,
+    width = _ref.width,
+    onClose = _ref.onClose,
+    _ref$closable = _ref.closable,
+    closable = _ref$closable === void 0 ? false : _ref$closable,
+    closeButtonLabel = _ref.closeButtonLabel,
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
+  return React.createElement(BaseAlertBox, _extends({
     className: classNames(className, {
-      "eds-alert-box--fit-content": width === "fit-content"
-    }),
-    ...rest,
-    onClose,
-    closable,
-    closeButtonLabel,
+      'eds-alert-box--fit-content': width === 'fit-content'
+    })
+  }, rest, {
+    onClose: onClose,
+    closable: closable,
+    closeButtonLabel: closeButtonLabel,
     size: "small"
-  }
-);
-const EXIT_ANIMATION_TIME = 400;
-const ToastContext = React.createContext(null);
-const toastReducer = (prevToasts, action) => {
+  }));
+};
+
+var EXIT_ANIMATION_TIME = 400;
+var ToastContext = /*#__PURE__*/React.createContext(null);
+var toastReducer = function toastReducer(prevToasts, action) {
   switch (action.type) {
-    case "ADD_TOAST":
-      return [action.payload, ...prevToasts];
-    case "PLAY_EXIT_ANIMATION":
-      return prevToasts.map((toast) => {
-        if (toast.id === action.payload)
-          return { ...toast, isBeingRemoved: true };
+    case 'ADD_TOAST':
+      return [action.payload].concat(prevToasts);
+    case 'PLAY_EXIT_ANIMATION':
+      return prevToasts.map(function (toast) {
+        if (toast.id === action.payload) return _extends({}, toast, {
+          isBeingRemoved: true
+        });
         return toast;
       });
-    case "REMOVE_TOAST":
-      return prevToasts.filter((toast) => toast.id !== action.payload);
+    case 'REMOVE_TOAST':
+      return prevToasts.filter(function (toast) {
+        return toast.id !== action.payload;
+      });
   }
 };
-const createUniqueId = () => Math.random().toString().substring(2);
-const createToast = (toast, id) => {
-  if (typeof toast === "string") {
-    return { id, content: toast, variant: "success", isBeingRemoved: false };
+var createUniqueId = function createUniqueId() {
+  return Math.random().toString().substring(2);
+};
+var createToast = function createToast(toast, id) {
+  if (typeof toast === 'string') {
+    return {
+      id: id,
+      content: toast,
+      variant: 'success',
+      isBeingRemoved: false
+    };
   } else {
-    return { id, variant: "success", isBeingRemoved: false, ...toast };
+    return _extends({
+      id: id,
+      variant: 'success',
+      isBeingRemoved: false
+    }, toast);
   }
 };
-const ToastProvider = ({
-  delay = 6e3,
-  children,
-  position = "bottom-right",
-  className,
-  style
-}) => {
-  const [toasts, dispatch] = React.useReducer(toastReducer, []);
-  const [hoveringId, setHovering] = React.useState();
-  const timeoutIdRefs = React.useRef({});
-  const removeToast = React.useCallback((id) => {
+var ToastProvider = function ToastProvider(_ref) {
+  var _ref$delay = _ref.delay,
+    delay = _ref$delay === void 0 ? 6000 : _ref$delay,
+    children = _ref.children,
+    _ref$position = _ref.position,
+    position = _ref$position === void 0 ? 'bottom-right' : _ref$position,
+    className = _ref.className,
+    style = _ref.style;
+  var _React$useReducer = React.useReducer(toastReducer, []),
+    toasts = _React$useReducer[0],
+    dispatch = _React$useReducer[1];
+  var _React$useState = React.useState(),
+    hoveringId = _React$useState[0],
+    setHovering = _React$useState[1];
+  var timeoutIdRefs = React.useRef({});
+  var removeToast = React.useCallback(function (id) {
     window.clearTimeout(timeoutIdRefs.current[id]);
-    dispatch({ type: "REMOVE_TOAST", payload: id });
+    dispatch({
+      type: 'REMOVE_TOAST',
+      payload: id
+    });
     delete timeoutIdRefs.current[id];
   }, []);
-  const playExitAnimation = React.useCallback((id) => {
-    window.clearTimeout(timeoutIdRefs.current[id + "animation"]);
-    dispatch({ type: "PLAY_EXIT_ANIMATION", payload: id });
-    delete timeoutIdRefs.current[id + "animation"];
+  var playExitAnimation = React.useCallback(function (id) {
+    window.clearTimeout(timeoutIdRefs.current[id + 'animation']);
+    dispatch({
+      type: 'PLAY_EXIT_ANIMATION',
+      payload: id
+    });
+    delete timeoutIdRefs.current[id + 'animation'];
   }, []);
-  const removeToastWithAnimationAfterDelay = React.useCallback(
-    (id, delay2) => {
-      timeoutIdRefs.current[id + "animation"] = window.setTimeout(
-        () => playExitAnimation(id),
-        delay2 - EXIT_ANIMATION_TIME
-      );
-      timeoutIdRefs.current[id] = window.setTimeout(
-        () => removeToast(id),
-        delay2
-      );
-    },
-    [timeoutIdRefs, playExitAnimation, removeToast]
-  );
-  const addToast = React.useCallback(
-    (toast) => {
-      const id = createUniqueId();
-      const payload = createToast(toast, id);
-      dispatch({ type: "ADD_TOAST", payload });
-      removeToastWithAnimationAfterDelay(id, delay);
-    },
-    [delay, removeToastWithAnimationAfterDelay]
-  );
-  const handleMouseEnter = (toast) => () => {
-    if (toast.isBeingRemoved) return;
-    setHovering(toast.id);
-    Object.values(timeoutIdRefs.current).forEach((timeoutId) => {
-      window.clearTimeout(timeoutId);
+  var removeToastWithAnimationAfterDelay = React.useCallback(function (id, delay) {
+    timeoutIdRefs.current[id + 'animation'] = window.setTimeout(function () {
+      return playExitAnimation(id);
+    }, delay - EXIT_ANIMATION_TIME);
+    timeoutIdRefs.current[id] = window.setTimeout(function () {
+      return removeToast(id);
+    }, delay);
+  }, [timeoutIdRefs, playExitAnimation, removeToast]);
+  var addToast = React.useCallback(function (toast) {
+    var id = createUniqueId();
+    var payload = createToast(toast, id);
+    dispatch({
+      type: 'ADD_TOAST',
+      payload: payload
     });
-    timeoutIdRefs.current = {};
+    removeToastWithAnimationAfterDelay(id, delay);
+  }, [delay, removeToastWithAnimationAfterDelay]);
+  var handleMouseEnter = function handleMouseEnter(toast) {
+    return function () {
+      if (toast.isBeingRemoved) return;
+      setHovering(toast.id);
+      Object.values(timeoutIdRefs.current).forEach(function (timeoutId) {
+        window.clearTimeout(timeoutId);
+      });
+      timeoutIdRefs.current = {};
+    };
   };
-  const handleMouseLeave = () => {
-    setHovering(void 0);
-    toasts.forEach((toast) => {
+  var handleMouseLeave = function handleMouseLeave() {
+    setHovering(undefined);
+    toasts.forEach(function (toast) {
       removeToastWithAnimationAfterDelay(toast.id, delay);
     });
   };
-  const handleClose = (toastId) => () => {
-    removeToast(toastId);
-    handleMouseLeave();
+  var handleClose = function handleClose(toastId) {
+    return function () {
+      removeToast(toastId);
+      handleMouseLeave();
+    };
   };
-  const contextValue = React.useMemo(
-    () => ({ toasts, addToast, removeToast }),
-    [addToast, removeToast, toasts]
-  );
-  return /* @__PURE__ */ jsxs(ToastContext.Provider, { value: contextValue, children: [
-    toasts.length > 0 && /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: classNames(
-          "eds-toast-container",
-          `eds-toast-container--${position}`,
-          className
-        ),
-        style,
-        children: toasts.slice(0, 3).map((toastToShow) => /* @__PURE__ */ jsx(
-          ToastAlertBox,
-          {
-            variant: toastToShow.variant,
-            title: toastToShow.title,
-            onClose: handleClose(toastToShow.id),
-            onMouseEnter: handleMouseEnter(toastToShow),
-            onMouseLeave: handleMouseLeave,
-            closable: hoveringId === toastToShow.id,
-            toastIsBeingRemoved: toastToShow.isBeingRemoved,
-            children: toastToShow.content
-          },
-          toastToShow.id
-        ))
-      }
-    ),
-    children
-  ] });
+  var contextValue = React.useMemo(function () {
+    return {
+      toasts: toasts,
+      addToast: addToast,
+      removeToast: removeToast
+    };
+  }, [addToast, removeToast, toasts]);
+  return React.createElement(ToastContext.Provider, {
+    value: contextValue
+  }, toasts.length > 0 && React.createElement("div", {
+    className: classNames('eds-toast-container', "eds-toast-container--" + position, className),
+    style: style
+  }, toasts.slice(0, 3).map(function (toastToShow) {
+    return React.createElement(ToastAlertBox, {
+      variant: toastToShow.variant,
+      title: toastToShow.title,
+      onClose: handleClose(toastToShow.id),
+      onMouseEnter: handleMouseEnter(toastToShow),
+      onMouseLeave: handleMouseLeave,
+      closable: hoveringId === toastToShow.id,
+      toastIsBeingRemoved: toastToShow.isBeingRemoved,
+      key: toastToShow.id
+    }, toastToShow.content);
+  })), children);
 };
-const useToast = () => {
-  const context = React.useContext(ToastContext);
+var useToast = function useToast() {
+  var context = React.useContext(ToastContext);
   if (!context) {
-    throw new Error(
-      "You need to wrap your component in a ToastProvider component in order to use the useToast hook"
-    );
+    throw new Error('You need to wrap your component in a ToastProvider component in ' + 'order to use the useToast hook');
   }
-  const { addToast } = context;
+  var addToast = context.addToast;
   return {
-    addToast
+    addToast: addToast
   };
 };
-var copyTextToClipboard = { exports: {} };
-var hasRequiredCopyTextToClipboard;
-function requireCopyTextToClipboard() {
-  if (hasRequiredCopyTextToClipboard) return copyTextToClipboard.exports;
-  hasRequiredCopyTextToClipboard = 1;
-  const copyTextToClipboard$1 = (input, { target = document.body } = {}) => {
-    const element = document.createElement("textarea");
-    const previouslyFocusedElement = document.activeElement;
-    element.value = input;
-    element.setAttribute("readonly", "");
-    element.style.contain = "strict";
-    element.style.position = "absolute";
-    element.style.left = "-9999px";
-    element.style.fontSize = "12pt";
-    const selection = document.getSelection();
-    let originalRange = false;
-    if (selection.rangeCount > 0) {
-      originalRange = selection.getRangeAt(0);
-    }
-    target.append(element);
-    element.select();
-    element.selectionStart = 0;
-    element.selectionEnd = input.length;
-    let isSuccess = false;
-    try {
-      isSuccess = document.execCommand("copy");
-    } catch (_) {
-    }
-    element.remove();
-    if (originalRange) {
-      selection.removeAllRanges();
-      selection.addRange(originalRange);
-    }
-    if (previouslyFocusedElement) {
-      previouslyFocusedElement.focus();
-    }
-    return isSuccess;
-  };
-  copyTextToClipboard.exports = copyTextToClipboard$1;
-  copyTextToClipboard.exports.default = copyTextToClipboard$1;
-  return copyTextToClipboard.exports;
-}
-var copyTextToClipboardExports = requireCopyTextToClipboard();
-const copy = /* @__PURE__ */ getDefaultExportFromCjs(copyTextToClipboardExports);
-const CopyableText = ({
-  children,
-  successHeading = "Kopiert!",
-  successMessage,
-  textToCopy,
-  className,
-  "aria-label": ariaLabel = `Kopier ${textToCopy ?? children} til utklippstavlen`,
-  ...rest
-}) => {
-  const { addToast } = useToast();
-  const buttonRef = React.useRef(null);
-  const _textToCopy = textToCopy ?? children;
-  const _successMessage = successMessage ?? `${_textToCopy} ble kopiert til utklippstavlen.`;
-  const handleClick = () => {
+
+var _excluded$1 = ["children", "successHeading", "successMessage", "textToCopy", "className", "aria-label"];
+var CopyableText = function CopyableText(_ref) {
+  var children = _ref.children,
+    _ref$successHeading = _ref.successHeading,
+    successHeading = _ref$successHeading === void 0 ? 'Kopiert!' : _ref$successHeading,
+    successMessage = _ref.successMessage,
+    textToCopy = _ref.textToCopy,
+    className = _ref.className,
+    _ref$ariaLabel = _ref['aria-label'],
+    ariaLabel = _ref$ariaLabel === void 0 ? "Kopier " + (textToCopy != null ? textToCopy : children) + " til utklippstavlen" : _ref$ariaLabel,
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
+  var _useToast = useToast(),
+    addToast = _useToast.addToast;
+  var buttonRef = React.useRef(null);
+  var _textToCopy = textToCopy != null ? textToCopy : children;
+  var _successMessage = successMessage != null ? successMessage : _textToCopy + " ble kopiert til utklippstavlen.";
+  var handleClick = function handleClick() {
     buttonRef.current && copy(_textToCopy, {
       target: buttonRef.current
-    }) && addToast({ title: successHeading, content: _successMessage });
+    }) && addToast({
+      title: successHeading,
+      content: _successMessage
+    });
   };
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: "eds-copyable-text " + className,
-      style: { ...rest.style },
-      type: "button",
-      onClick: handleClick,
-      tabIndex: -1,
-      "aria-label": "",
-      ...rest,
-      children: /* @__PURE__ */ jsxs(PreformattedText, { className: "eds-copyable-text__preformatted-text", children: [
-        /* @__PURE__ */ jsx("span", { className: "eds-copyable-text__displayed-text", children }),
-        /* @__PURE__ */ jsx(
-          IconButton,
-          {
-            className: "eds-copyable-text__button",
-            "aria-label": ariaLabel,
-            type: "button",
-            ref: buttonRef,
-            children: /* @__PURE__ */ jsx(CopyIcon, { className: "eds-copyable-text__button__icon" })
-          }
-        )
-      ] })
-    }
-  );
+  return React.createElement("div", _extends({
+    className: 'eds-copyable-text ' + className,
+    style: _extends({}, rest.style),
+    type: "button",
+    onClick: handleClick,
+    tabIndex: -1,
+    "aria-label": ""
+  }, rest), React.createElement(PreformattedText, {
+    className: "eds-copyable-text__preformatted-text"
+  }, React.createElement("span", {
+    className: "eds-copyable-text__displayed-text"
+  }, children), React.createElement(IconButton, {
+    className: "eds-copyable-text__button",
+    "aria-label": ariaLabel,
+    type: "button",
+    ref: buttonRef
+  }, React.createElement(CopyIcon, {
+    className: 'eds-copyable-text__button__icon'
+  }))));
 };
-const SmallExpandableAlertBox = (props) => {
-  return /* @__PURE__ */ jsx(ExpandableAlertBox, { size: "small", ...props });
-};
-const BannerExpandableAlertBox = (props) => {
-  return /* @__PURE__ */ jsx(ExpandableAlertBox, { size: "banner", ...props });
+
+var _excluded = ["variant", "title", "children", "size", "className", "openLabel", "closeLabel"];
+var SmallExpandableAlertBox = function SmallExpandableAlertBox(props) {
+  return React.createElement(ExpandableAlertBox, _extends({
+    size: "small"
+  }, props));
 };
-const ExpandableAlertBox = ({
-  variant,
-  title,
-  children,
-  size,
-  className,
-  openLabel,
-  closeLabel,
-  ...rest
-}) => {
-  const [open, setopen] = React.useState(false);
-  return /* @__PURE__ */ jsx(
-    BaseAlertBox,
-    {
-      size,
-      variant,
-      className: classNames("eds-expandable-alert-box", className),
-      title: /* @__PURE__ */ jsx(
-        ExpandableAlertBoxTitle,
-        {
-          open,
-          title,
-          onClick: () => setopen(!open),
-          openLabel,
-          closeLabel
-        }
-      ),
-      ...rest,
-      children: /* @__PURE__ */ jsx(BaseExpand, { open, children })
-    }
-  );
+var BannerExpandableAlertBox = function BannerExpandableAlertBox(props) {
+  return React.createElement(ExpandableAlertBox, _extends({
+    size: "banner"
+  }, props));
 };
-const ExpandableAlertBoxTitle = ({
-  title,
-  open,
-  openLabel = "Les mer",
-  closeLabel = "Lukk",
-  onClick
-}) => {
-  return /* @__PURE__ */ jsxs("div", { className: "eds-expandable-alert-box__title", children: [
-    /* @__PURE__ */ jsx("div", { children: title }),
-    /* @__PURE__ */ jsxs(
-      "button",
-      {
-        className: "eds-expandable-alert-box__button",
-        onClick,
-        type: "button",
-        children: [
-          open ? closeLabel : openLabel,
-          /* @__PURE__ */ jsx(ExpandArrow, { open, inline: true })
-        ]
-      }
-    )
-  ] });
+var ExpandableAlertBox = function ExpandableAlertBox(_ref) {
+  var variant = _ref.variant,
+    title = _ref.title,
+    children = _ref.children,
+    size = _ref.size,
+    className = _ref.className,
+    openLabel = _ref.openLabel,
+    closeLabel = _ref.closeLabel,
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded);
+  var _React$useState = React.useState(false),
+    open = _React$useState[0],
+    setopen = _React$useState[1];
+  return React.createElement(BaseAlertBox, _extends({
+    size: size,
+    variant: variant,
+    className: classNames('eds-expandable-alert-box', className),
+    title: React.createElement(ExpandableAlertBoxTitle, {
+      open: open,
+      title: title,
+      onClick: function onClick() {
+        return setopen(!open);
+      },
+      openLabel: openLabel,
+      closeLabel: closeLabel
+    })
+  }, rest), React.createElement(BaseExpand, {
+    open: open
+  }, children));
 };
-warnAboutMissingStyles("alert", "icons");
-export {
-  BannerAlertBox,
-  BannerExpandableAlertBox,
-  CopyableText,
-  SmallAlertBox,
-  SmallExpandableAlertBox,
-  ToastAlertBox,
-  ToastProvider,
-  useToast
+var ExpandableAlertBoxTitle = function ExpandableAlertBoxTitle(_ref2) {
+  var title = _ref2.title,
+    open = _ref2.open,
+    _ref2$openLabel = _ref2.openLabel,
+    openLabel = _ref2$openLabel === void 0 ? 'Les mer' : _ref2$openLabel,
+    _ref2$closeLabel = _ref2.closeLabel,
+    closeLabel = _ref2$closeLabel === void 0 ? 'Lukk' : _ref2$closeLabel,
+    onClick = _ref2.onClick;
+  return React.createElement("div", {
+    className: "eds-expandable-alert-box__title"
+  }, React.createElement("div", null, title), React.createElement("button", {
+    className: "eds-expandable-alert-box__button",
+    onClick: onClick,
+    type: "button"
+  }, open ? closeLabel : openLabel, React.createElement(ExpandArrow, {
+    open: open,
+    inline: true
+  })));
 };
+
+warnAboutMissingStyles('alert', 'icons');
+
+export { BannerAlertBox, BannerExpandableAlertBox, CopyableText, SmallAlertBox, SmallExpandableAlertBox, ToastAlertBox, ToastProvider, useToast };
 //# sourceMappingURL=alert.esm.js.map