@entur/alert 0.17.11 → 0.17.13-beta.0

package/dist/alert.esm.js

@@ -1,399 +1,482 @@
-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);
+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;
 }
-function _objectWithoutPropertiesLoose(r, e) {
-  if (null == r) return {};
-  var t = {};
-  for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
-    if (e.includes(n)) continue;
-    t[n] = r[n];
-  }
-  return t;
+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;
 }
-
-var _excluded$3 = ["children", "className", "closable", "closeButtonLabel", "variant", "onClose", "size", "title", "toastIsBeingRemoved"];
-var iconsMap = {
+var classnamesExports = requireClassnames();
+const classNames = /* @__PURE__ */ getDefaultExportFromCjs(classnamesExports);
+const iconsMap = {
   success: {
     icon: ValidationSuccessIcon,
-    description: 'Suksessmelding'
-  },
-  information: {
-    icon: ValidationInfoIcon,
-    description: 'Infomelding'
+    description: "Suksessmelding"
   },
+  information: { icon: ValidationInfoIcon, description: "Infomelding" },
   warning: {
     icon: ValidationExclamationIcon,
-    description: 'Varselmelding'
-  },
-  negative: {
-    icon: ValidationErrorIcon,
-    description: 'Feilmelding'
+    description: "Varselmelding"
   },
+  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" }
 };
-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];
+const BaseAlertBox = ({
+  children,
+  className,
+  closable = false,
+  closeButtonLabel = "Lukk",
+  variant,
+  onClose = () => ({}),
+  size,
+  title,
+  toastIsBeingRemoved,
+  ...rest
+}) => {
+  const [isClosed, setClosed] = React.useState(false);
   if (isClosed) {
     return null;
   }
-  var handleClose = function handleClose() {
+  const handleClose = () => {
     setClosed(true);
     onClose();
   };
-  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))));
-};
-
-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"
-  }));
+  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 _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({
+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,
+  {
     className: classNames(className, {
-      'eds-alert-box--fit-content': width === 'fit-content'
-    })
-  }, rest, {
-    onClose: onClose,
-    closable: closable,
-    closeButtonLabel: closeButtonLabel,
+      "eds-alert-box--fit-content": width === "fit-content"
+    }),
+    ...rest,
+    onClose,
+    closable,
+    closeButtonLabel,
     size: "small"
-  }));
-};
-
-var EXIT_ANIMATION_TIME = 400;
-var ToastContext = /*#__PURE__*/React.createContext(null);
-var toastReducer = function toastReducer(prevToasts, action) {
+  }
+);
+const EXIT_ANIMATION_TIME = 400;
+const ToastContext = React.createContext(null);
+const toastReducer = (prevToasts, action) => {
   switch (action.type) {
-    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
-        });
+    case "ADD_TOAST":
+      return [action.payload, ...prevToasts];
+    case "PLAY_EXIT_ANIMATION":
+      return prevToasts.map((toast) => {
+        if (toast.id === action.payload)
+          return { ...toast, isBeingRemoved: true };
         return toast;
       });
-    case 'REMOVE_TOAST':
-      return prevToasts.filter(function (toast) {
-        return toast.id !== action.payload;
-      });
+    case "REMOVE_TOAST":
+      return prevToasts.filter((toast) => toast.id !== action.payload);
   }
 };
-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
-    };
+const createUniqueId = () => Math.random().toString().substring(2);
+const createToast = (toast, id) => {
+  if (typeof toast === "string") {
+    return { id, content: toast, variant: "success", isBeingRemoved: false };
   } else {
-    return _extends({
-      id: id,
-      variant: 'success',
-      isBeingRemoved: false
-    }, toast);
+    return { id, variant: "success", isBeingRemoved: false, ...toast };
   }
 };
-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) {
+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) => {
     window.clearTimeout(timeoutIdRefs.current[id]);
-    dispatch({
-      type: 'REMOVE_TOAST',
-      payload: id
-    });
+    dispatch({ type: "REMOVE_TOAST", payload: id });
     delete timeoutIdRefs.current[id];
   }, []);
-  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 playExitAnimation = React.useCallback((id) => {
+    window.clearTimeout(timeoutIdRefs.current[id + "animation"]);
+    dispatch({ type: "PLAY_EXIT_ANIMATION", payload: id });
+    delete timeoutIdRefs.current[id + "animation"];
   }, []);
-  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
+  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);
     });
-    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 = {};
-    };
+    timeoutIdRefs.current = {};
   };
-  var handleMouseLeave = function handleMouseLeave() {
-    setHovering(undefined);
-    toasts.forEach(function (toast) {
+  const handleMouseLeave = () => {
+    setHovering(void 0);
+    toasts.forEach((toast) => {
       removeToastWithAnimationAfterDelay(toast.id, delay);
     });
   };
-  var handleClose = function handleClose(toastId) {
-    return function () {
-      removeToast(toastId);
-      handleMouseLeave();
-    };
+  const handleClose = (toastId) => () => {
+    removeToast(toastId);
+    handleMouseLeave();
   };
-  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 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 useToast = function useToast() {
-  var context = React.useContext(ToastContext);
+const useToast = () => {
+  const 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"
+    );
   }
-  var addToast = context.addToast;
+  const { addToast } = context;
   return {
-    addToast: addToast
+    addToast
   };
 };
-
-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() {
+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 = () => {
     buttonRef.current && copy(_textToCopy, {
       target: buttonRef.current
-    }) && addToast({
-      title: successHeading,
-      content: _successMessage
-    });
+    }) && addToast({ title: successHeading, content: _successMessage });
   };
-  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'
-  }))));
+  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" })
+          }
+        )
+      ] })
+    }
+  );
 };
-
-var _excluded = ["variant", "title", "children", "size", "className", "openLabel", "closeLabel"];
-var SmallExpandableAlertBox = function SmallExpandableAlertBox(props) {
-  return React.createElement(ExpandableAlertBox, _extends({
-    size: "small"
-  }, props));
+const SmallExpandableAlertBox = (props) => {
+  return /* @__PURE__ */ jsx(ExpandableAlertBox, { size: "small", ...props });
+};
+const BannerExpandableAlertBox = (props) => {
+  return /* @__PURE__ */ jsx(ExpandableAlertBox, { size: "banner", ...props });
 };
-var BannerExpandableAlertBox = function BannerExpandableAlertBox(props) {
-  return React.createElement(ExpandableAlertBox, _extends({
-    size: "banner"
-  }, 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 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));
+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 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
 };
-
-warnAboutMissingStyles('alert', 'icons');
-
-export { BannerAlertBox, BannerExpandableAlertBox, CopyableText, SmallAlertBox, SmallExpandableAlertBox, ToastAlertBox, ToastProvider, useToast };
 //# sourceMappingURL=alert.esm.js.map