@entur/tooltip 5.2.12 → 5.2.13-beta.1

package/dist/tooltip.cjs.js

@@ -0,0 +1,308 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const utils = require("@entur/utils");
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const classNames = require("classnames");
+const react = require("@floating-ui/react");
+const icons = require("@entur/icons");
+const button = require("@entur/button");
+const tokens = require("@entur/tokens");
+const reactDom = require("@floating-ui/react-dom");
+const layout = require("@entur/layout");
+function standardisePlacement(placement) {
+  switch (placement) {
+    case "top-left":
+      return "top-start";
+    case "top-right":
+      return "top-end";
+    case "bottom-left":
+      return "bottom-start";
+    case "bottom-right":
+      return "bottom-end";
+    default:
+      return placement;
+  }
+}
+const error = "error";
+const Tooltip = ({
+  placement,
+  content,
+  children,
+  className,
+  isOpen,
+  onClickCloseButton = () => void 0,
+  disableHoverListener = false,
+  disableFocusListener = false,
+  disableKeyboardListener = true,
+  disableClickListner = true,
+  showCloseButton = true,
+  variant,
+  hoverDelay,
+  style,
+  ...rest
+}) => {
+  const [showTooltip, setShowTooltip] = React.useState(isOpen ?? false);
+  const tooltipArrowRef = React.useRef(null);
+  const tooltipId = utils.useRandomId("eds-tooltip");
+  const hoverOpenTimer = React.useRef();
+  const hoverCloseTimer = React.useRef();
+  const isControlled = isOpen !== void 0;
+  const {
+    refs,
+    floatingStyles,
+    middlewareData,
+    placement: actualPlacement,
+    isPositioned,
+    update,
+    elements
+  } = react.useFloating({
+    placement: standardisePlacement(placement),
+    open: showTooltip,
+    middleware: [
+      react.offset(tokens.space.extraSmall),
+      react.flip(),
+      react.shift({ padding: tokens.space.extraSmall, limiter: react.limitShift({ offset: 8 }) }),
+      react.arrow({
+        element: tooltipArrowRef,
+        padding: tokens.borderRadiuses.medium
+      })
+    ]
+  });
+  React.useEffect(() => {
+    if (showTooltip && elements.reference && elements.floating) {
+      const cleanup = react.autoUpdate(elements.reference, elements.floating, update);
+      return cleanup;
+    }
+  }, [showTooltip, elements, update]);
+  const onMouseEnter = () => {
+    if (isControlled) return;
+    clearTimeout(hoverCloseTimer.current);
+    hoverOpenTimer.current = setTimeout(() => {
+      setShowTooltip(true);
+    }, hoverDelay?.enter ?? 150);
+  };
+  const onMouseLeave = () => {
+    if (isControlled) return;
+    clearTimeout(hoverOpenTimer.current);
+    hoverCloseTimer.current = setTimeout(() => {
+      setShowTooltip(false);
+    }, hoverDelay?.leave ?? 300);
+  };
+  React.useEffect(() => {
+    return () => {
+      clearTimeout(hoverOpenTimer.current);
+      clearTimeout(hoverCloseTimer.current);
+    };
+  }, []);
+  React.useEffect(() => {
+    if (isOpen !== void 0) setShowTooltip(isOpen);
+  }, [isOpen]);
+  const referenceListenerProps = {
+    "aria-describedby": showTooltip ? tooltipId : void 0,
+    // focusListner
+    ...!disableFocusListener && !isControlled && { onFocus: () => setShowTooltip(true) },
+    ...!disableFocusListener && !isControlled && { onBlur: () => setShowTooltip(false) },
+    // hoverListner
+    ...!disableHoverListener && !isControlled && { onMouseEnter },
+    ...!disableHoverListener && !isControlled && { onMouseLeave },
+    // keyboardListner
+    ...!disableKeyboardListener && !isControlled && {
+      onKeyDown: (e) => {
+        if (e.key === "Escape") setShowTooltip(false);
+        if (e.key === " " || e.key === "Enter") {
+          e.preventDefault();
+          setShowTooltip(!showTooltip);
+        }
+      }
+    },
+    // clickListner
+    ...!disableClickListner && !isControlled && {
+      onClick: () => setShowTooltip(!showTooltip)
+    }
+  };
+  const displayTooltipStyle = (!isControlled || isPositioned) && showTooltip && content ? void 0 : "none";
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    React.cloneElement(children, {
+      ref: refs.setReference,
+      ...referenceListenerProps
+    }),
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: classNames(className, "eds-tooltip", {
+          "eds-tooltip--negative": variant === error || variant === "negative"
+        }),
+        ref: refs.setFloating,
+        style: {
+          ...floatingStyles,
+          display: displayTooltipStyle,
+          ...style
+        },
+        role: "tooltip",
+        id: tooltipId,
+        onMouseEnter: !disableHoverListener ? onMouseEnter : void 0,
+        onMouseLeave: !disableHoverListener ? onMouseLeave : void 0,
+        ...rest,
+        children: [
+          content,
+          isOpen && showCloseButton && /* @__PURE__ */ jsxRuntime.jsx(
+            button.IconButton,
+            {
+              className: "eds-tooltip__close-button",
+              onClick: () => {
+                setShowTooltip(false);
+                onClickCloseButton();
+              },
+              type: "button",
+              "aria-label": "Lukk tooltip",
+              children: /* @__PURE__ */ jsxRuntime.jsx(icons.CloseIcon, { "aria-hidden": "true" })
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              className: `eds-tooltip__arrow--${actualPlacement?.split("-")?.[0]}`,
+              ref: tooltipArrowRef,
+              style: {
+                left: middlewareData.arrow?.x,
+                top: middlewareData.arrow?.y
+              }
+            }
+          )
+        ]
+      }
+    )
+  ] });
+};
+const Popover = ({
+  children,
+  placement = "bottom-start",
+  showPopover: controlledState,
+  setShowPopover: setControlledState
+}) => {
+  const [showPopover, setShowPopover, controlled] = useCustomState(
+    controlledState,
+    setControlledState
+  );
+  const { refs, floatingStyles, elements, update } = reactDom.useFloating({
+    placement: standardisePlacement(placement),
+    middleware: [
+      reactDom.offset(tokens.space.extraSmall),
+      reactDom.flip(),
+      reactDom.shift({
+        padding: tokens.space.extraSmall,
+        limiter: reactDom.limitShift({ offset: 8 })
+      })
+    ]
+  });
+  React.useEffect(() => {
+    if (showPopover && elements.reference && elements.floating) {
+      const cleanup = reactDom.autoUpdate(elements.reference, elements.floating, update);
+      return cleanup;
+    }
+  }, [showPopover, elements, update]);
+  utils.useOnClickOutside(
+    [refs.floating, refs.reference],
+    () => setShowPopover(false)
+  );
+  const popoverTriggerProps = {
+    "aria-haspopup": "dialog",
+    "aria-expanded": showPopover,
+    ref: refs.setReference,
+    type: "button",
+    ...!controlled && {
+      onClick: () => setShowPopover((prev) => !prev)
+    }
+  };
+  const popoverContentProps = {
+    role: "dialog",
+    "aria-modal": false,
+    "aria-hidden": !showPopover,
+    ref: refs.setFloating,
+    style: { ...!showPopover && { display: "none" } },
+    onKeyDown: (event) => {
+      if (event.key === "Escape") setShowPopover(false);
+    },
+    onBlur: (event) => {
+      const elementReceivingFocus = event.relatedTarget;
+      if (!elementReceivingFocus || elementReceivingFocus.getAttribute("tabindex") === "-1")
+        return;
+      const focusedElementIsPopover = elementContainsElement(
+        refs.floating.current,
+        elementReceivingFocus
+      );
+      const focusedElementIsTrigger = elementContainsElement(
+        refs.reference.current,
+        elementReceivingFocus
+      );
+      const popoverShouldClose = !focusedElementIsPopover && !focusedElementIsTrigger;
+      if (showPopover && popoverShouldClose) setShowPopover(false);
+    }
+  };
+  const closeButtonProps = {
+    onClick: () => setShowPopover(false),
+    type: "button"
+  };
+  const contextValue = {
+    showPopover,
+    floatingStyles,
+    popoverTriggerProps,
+    popoverContentProps,
+    closeButtonProps
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(PopoverContext.Provider, { value: contextValue, children });
+};
+const PopoverTrigger = ({ children }) => {
+  const { popoverTriggerProps } = usePopoverContext();
+  const child = React.Children.only(children);
+  return React.cloneElement(child, popoverTriggerProps);
+};
+const PopoverCloseButton = ({
+  children,
+  ...rest
+}) => {
+  const { closeButtonProps } = usePopoverContext();
+  return React.cloneElement(children, { ...closeButtonProps, ...rest });
+};
+const PopoverContent = React.forwardRef(({ children, className, style }, ref) => {
+  const { floatingStyles, popoverContentProps } = usePopoverContext();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    layout.Contrast,
+    {
+      className: classNames(className, "eds-popover"),
+      ...popoverContentProps,
+      style: { ...floatingStyles, ...popoverContentProps.style, ...style },
+      ref: utils.mergeRefs(popoverContentProps.ref, ref),
+      children
+    }
+  );
+});
+const PopoverContext = React.createContext(
+  void 0
+);
+const usePopoverContext = () => {
+  const context = React.useContext(PopoverContext);
+  if (context == null) {
+    throw Error("usePopoverContext must be used within <Popover/>");
+  }
+  return context;
+};
+const useCustomState = (state, setState) => {
+  const [internalState, setInternalState] = React.useState(false);
+  const controlled = state !== void 0 && setState !== void 0;
+  if (controlled) return [state, setState, controlled];
+  return [internalState, setInternalState, controlled];
+};
+function elementContainsElement(parent, child) {
+  if (!parent) return false;
+  return parent === child || parent.contains(child);
+}
+utils.warnAboutMissingStyles("tooltip");
+exports.Popover = Popover;
+exports.PopoverCloseButton = PopoverCloseButton;
+exports.PopoverContent = PopoverContent;
+exports.PopoverTrigger = PopoverTrigger;
+exports.Tooltip = Tooltip;
+exports.standardisePlacement = standardisePlacement;
+//# sourceMappingURL=tooltip.cjs.js.map

package/dist/tooltip.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip.cjs.js","sources":["../src/utils.ts","../src/Tooltip.tsx","../src/Popover.tsx","../src/index.tsx"],"sourcesContent":["import { Placement as FloatingUIPlacement } from '@floating-ui/react-dom';\n\nexport type Placement =\n  | 'top'\n  | 'top-left'\n  | 'top-start'\n  | 'top-right'\n  | 'top-end'\n  | 'left'\n  | 'right'\n  | 'bottom-left'\n  | 'bottom-start'\n  | 'bottom'\n  | 'bottom-right'\n  | 'bottom-end';\n\nexport function standardisePlacement(placement: string): FloatingUIPlacement {\n  switch (placement) {\n    case 'top-left':\n      return 'top-start';\n    case 'top-right':\n      return 'top-end';\n    case 'bottom-left':\n      return 'bottom-start';\n    case 'bottom-right':\n      return 'bottom-end';\n    default:\n      return placement as FloatingUIPlacement;\n  }\n}\n","import React, { cloneElement, useEffect, useRef, useState } from 'react';\n\nimport classNames from 'classnames';\nimport {\n  useFloating,\n  autoUpdate,\n  offset,\n  flip,\n  shift,\n  arrow,\n  limitShift,\n} from '@floating-ui/react';\n\nimport { useRandomId } from '@entur/utils';\nimport { CloseIcon } from '@entur/icons';\nimport { IconButton } from '@entur/button';\nimport { space, borderRadiuses } from '@entur/tokens';\n\nimport { Placement, standardisePlacement } from './utils';\n\nimport './Tooltip.scss';\n\ntype Modifier = {\n  name: string;\n  enabled?: boolean;\n  requires?: Array<string>;\n  requiresIfExists?: Array<string>;\n  options?: Record<string, unknown>;\n  data?: Record<string, unknown>;\n  [key: string]: any;\n};\n\ntype ChildEventListner = {\n  'aria-describedby'?: string;\n  onFocus?: () => void;\n  onBlur?: () => void;\n  onMouseEnter?: (e: React.MouseEvent) => void;\n  onMouseLeave?: () => void;\n  onKeyDown?: (e: React.KeyboardEvent) => void;\n  onKeyUp?: (e: React.KeyboardEvent) => void;\n  onClick?: (e: React.MouseEvent) => void;\n};\n\n/** @deprecated use variant=\"negative\" instead */\nconst error = 'error';\n\nexport type TooltipProps = {\n  /** Plassering av tooltip-en */\n  placement: Placement;\n  /** Innholdet i tooltip-boksen */\n  content: React.ReactNode;\n  /** Elementet som skal ha tooltip-funksjonalitet */\n  children: React.ReactElement;\n  /** Om tooltip-en skal vises */\n  isOpen?: boolean;\n  /** Callback-funksjon for når brukeren trykker på lukk-tooltip-knappen\n   * @default () => undefined;\n   */\n  onClickCloseButton?: () => void;\n  /** Ekstra klassenavn for tooltip */\n  className?: string;\n  /** Åpner ikke tooltip ved hover-events\n   * @default false\n   */\n  disableHoverListener?: boolean;\n  /** Åpner ikke tooltip ved focus-events\n   * @default false\n   */\n  disableFocusListener?: boolean;\n  disableKeyboardListener?: boolean;\n  disableClickListner?: boolean;\n  /** Viser en lukkeknapp om man kontrollerer åpningen av Tooltip vha `isOpen`\n   * @default true\n   */\n  showCloseButton?: boolean;\n  /** Valideringsvariant for Tooltip */\n  variant?: 'negative' | typeof error;\n  /** For å kontrollere tiden i millisekunder det tar før tooltip-en\n   *  vises etter hover, og hvor lang tid det tar før den lukkes etter\n   *  hover-slutt.\n   *  @default { enter: 150, leave: 300 }\n   */\n  hoverDelay?: {\n    enter?: number;\n    leave?: number;\n  };\n  /** @deprecated Ikke lenger støttet. Meld fra på #talk-designsystem hvis du trenger støtte for\n   * overskrivinger av plasseringen til Tooltip!\n   */\n  popperModifiers?: Modifier[];\n  [key: string]: any;\n};\n\nexport const Tooltip: React.FC<TooltipProps> = ({\n  placement,\n  content,\n  children,\n  className,\n  isOpen,\n  onClickCloseButton = () => undefined,\n  disableHoverListener = false,\n  disableFocusListener = false,\n  disableKeyboardListener = true,\n  disableClickListner = true,\n  showCloseButton = true,\n  variant,\n  hoverDelay,\n  style,\n  ...rest\n}) => {\n  const [showTooltip, setShowTooltip] = useState(isOpen ?? false);\n  const tooltipArrowRef = useRef(null);\n  const tooltipId = useRandomId('eds-tooltip');\n  const hoverOpenTimer = useRef<ReturnType<typeof setTimeout>>();\n  const hoverCloseTimer = useRef<ReturnType<typeof setTimeout>>();\n\n  const isControlled = isOpen !== undefined;\n\n  // calculations for floating-UI tooltip position\n  const {\n    refs,\n    floatingStyles,\n    middlewareData,\n    placement: actualPlacement,\n    isPositioned,\n    update,\n    elements,\n  } = useFloating({\n    placement: standardisePlacement(placement),\n    open: showTooltip,\n    middleware: [\n      offset(space.extraSmall),\n      flip(),\n      shift({ padding: space.extraSmall, limiter: limitShift({ offset: 8 }) }),\n      arrow({\n        element: tooltipArrowRef,\n        padding: borderRadiuses.medium,\n      }),\n    ],\n  });\n\n  // Since we use CSS instead of conditional rendering when hiding tooltip\n  // we can't use the whileElementsMounted option and need to handle\n  // cleanup ourselves. See https://floating-ui.com/docs/autoupdate\n  useEffect(() => {\n    if (showTooltip && elements.reference && elements.floating) {\n      const cleanup = autoUpdate(elements.reference, elements.floating, update);\n      return cleanup;\n    }\n  }, [showTooltip, elements, update]);\n\n  const onMouseEnter = () => {\n    if (isControlled) return;\n    clearTimeout(hoverCloseTimer.current);\n    hoverOpenTimer.current = setTimeout(() => {\n      setShowTooltip(true);\n    }, hoverDelay?.enter ?? 150);\n  };\n\n  const onMouseLeave = () => {\n    if (isControlled) return;\n    clearTimeout(hoverOpenTimer.current);\n    hoverCloseTimer.current = setTimeout(() => {\n      setShowTooltip(false);\n    }, hoverDelay?.leave ?? 300);\n  };\n\n  React.useEffect(() => {\n    return () => {\n      clearTimeout(hoverOpenTimer.current);\n      clearTimeout(hoverCloseTimer.current);\n    };\n  }, []);\n\n  React.useEffect(() => {\n    if (isOpen !== undefined) setShowTooltip(isOpen);\n  }, [isOpen]);\n\n  const referenceListenerProps: ChildEventListner = {\n    'aria-describedby': showTooltip ? tooltipId : undefined,\n    // focusListner\n    ...(!disableFocusListener &&\n      !isControlled && { onFocus: () => setShowTooltip(true) }),\n    ...(!disableFocusListener &&\n      !isControlled && { onBlur: () => setShowTooltip(false) }),\n    // hoverListner\n    ...(!disableHoverListener && !isControlled && { onMouseEnter }),\n    ...(!disableHoverListener && !isControlled && { onMouseLeave }),\n    // keyboardListner\n    ...(!disableKeyboardListener &&\n      !isControlled && {\n        onKeyDown: e => {\n          if (e.key === 'Escape') setShowTooltip(false);\n          if (e.key === ' ' || e.key === 'Enter') {\n            e.preventDefault();\n            setShowTooltip(!showTooltip);\n          }\n        },\n      }),\n    // clickListner\n    ...(!disableClickListner &&\n      !isControlled && {\n        onClick: () => setShowTooltip(!showTooltip),\n      }),\n  };\n\n  const displayTooltipStyle =\n    (!isControlled || isPositioned) && showTooltip && content\n      ? undefined\n      : 'none';\n\n  return (\n    <>\n      {cloneElement(children, {\n        ref: refs.setReference,\n        ...referenceListenerProps,\n      })}\n      <div\n        className={classNames(className, 'eds-tooltip', {\n          'eds-tooltip--negative': variant === error || variant === 'negative',\n        })}\n        ref={refs.setFloating}\n        style={{\n          ...floatingStyles,\n          display: displayTooltipStyle,\n          ...style,\n        }}\n        role=\"tooltip\"\n        id={tooltipId}\n        onMouseEnter={!disableHoverListener ? onMouseEnter : undefined}\n        onMouseLeave={!disableHoverListener ? onMouseLeave : undefined}\n        {...rest}\n      >\n        {content}\n        {isOpen && showCloseButton && (\n          <IconButton\n            className=\"eds-tooltip__close-button\"\n            onClick={() => {\n              setShowTooltip(false);\n              onClickCloseButton();\n            }}\n            type=\"button\"\n            aria-label=\"Lukk tooltip\"\n          >\n            <CloseIcon aria-hidden=\"true\" />\n          </IconButton>\n        )}\n        <div\n          className={`eds-tooltip__arrow--${actualPlacement?.split('-')?.[0]}`}\n          ref={tooltipArrowRef}\n          style={{\n            left: middlewareData.arrow?.x,\n            top: middlewareData.arrow?.y,\n          }}\n        />\n      </div>\n    </>\n  );\n};\n","import React, {\n  cloneElement,\n  createContext,\n  MutableRefObject,\n  useContext,\n  useEffect,\n} from 'react';\n\nimport classNames from 'classnames';\nimport {\n  useFloating,\n  autoUpdate,\n  offset,\n  flip,\n  shift,\n  limitShift,\n} from '@floating-ui/react-dom';\n\nimport { Contrast } from '@entur/layout';\nimport { mergeRefs, useOnClickOutside } from '@entur/utils';\nimport { space } from '@entur/tokens';\n\nimport { Placement, standardisePlacement } from './utils';\n\nimport './Popover.scss';\n\nexport type PopoverProps = {\n  /** Innholdet i Popover */\n  children: React.ReactNode;\n  /** Plasseringen av Popover\n   * @default \"bottom-start\"\n   */\n  placement?: Placement;\n  /** Hvis du ønsker å styre state selv kan du sende inn state her */\n  showPopover?: boolean;\n  /** Hvis du ønsker å styre state selv kan du sende inn setState her */\n  setShowPopover?: React.Dispatch<React.SetStateAction<boolean>>;\n};\n\nexport const Popover: React.FC<PopoverProps> = ({\n  children,\n  placement = 'bottom-start',\n  showPopover: controlledState,\n  setShowPopover: setControlledState,\n}) => {\n  const [showPopover, setShowPopover, controlled] = useCustomState(\n    controlledState,\n    setControlledState,\n  );\n\n  // calculations for floating-UI popover position\n  const { refs, floatingStyles, elements, update } =\n    useFloating<HTMLButtonElement>({\n      placement: standardisePlacement(placement),\n      middleware: [\n        offset(space.extraSmall),\n        flip(),\n        shift({\n          padding: space.extraSmall,\n          limiter: limitShift({ offset: 8 }),\n        }),\n      ],\n    });\n\n  // Since we use CSS instead of conditional rendering when hiding dropdownlist\n  // we can't use the whileElementsMounted option and need to handle\n  // cleanup ourselves. See https://floating-ui.com/docs/autoupdate\n  useEffect(() => {\n    if (showPopover && elements.reference && elements.floating) {\n      const cleanup = autoUpdate(elements.reference, elements.floating, update);\n      return cleanup;\n    }\n  }, [showPopover, elements, update]);\n\n  useOnClickOutside([refs.floating, refs.reference], () =>\n    setShowPopover(false),\n  );\n\n  const popoverTriggerProps = {\n    'aria-haspopup': 'dialog',\n    'aria-expanded': showPopover,\n    ref: refs.setReference,\n    type: 'button',\n    ...(!controlled && {\n      onClick: () => setShowPopover(prev => !prev),\n    }),\n  };\n\n  const popoverContentProps = {\n    role: 'dialog',\n    'aria-modal': false,\n    'aria-hidden': !showPopover,\n    ref: refs.setFloating,\n    style: { ...(!showPopover && { display: 'none' }) },\n    onKeyDown: (event: React.KeyboardEvent) => {\n      if (event.key === 'Escape') setShowPopover(false);\n    },\n    onBlur: (event: React.FocusEvent) => {\n      const elementReceivingFocus = event.relatedTarget as HTMLElement;\n      // The check for 'tabindex=-1' is a special case for focus handling in Docz\n      if (\n        !elementReceivingFocus ||\n        elementReceivingFocus.getAttribute('tabindex') === '-1'\n      )\n        return;\n      const focusedElementIsPopover = elementContainsElement(\n        refs.floating.current,\n        elementReceivingFocus,\n      );\n      const focusedElementIsTrigger = elementContainsElement(\n        refs.reference.current,\n        elementReceivingFocus,\n      );\n      const popoverShouldClose =\n        !focusedElementIsPopover && !focusedElementIsTrigger;\n      if (showPopover && popoverShouldClose) setShowPopover(false);\n    },\n  };\n\n  const closeButtonProps = {\n    onClick: () => setShowPopover(false),\n    type: 'button',\n  };\n\n  const contextValue: PopoverContextProps = {\n    showPopover,\n    floatingStyles,\n    popoverTriggerProps,\n    popoverContentProps,\n    closeButtonProps,\n  };\n\n  return (\n    <PopoverContext.Provider value={contextValue}>\n      {children}\n    </PopoverContext.Provider>\n  );\n};\n\nexport type PopoverTriggerProps = {\n  /** Knapp som skal brukes for å åpne Popover */\n  children: React.ReactElement;\n};\n\nexport const PopoverTrigger: React.FC<PopoverTriggerProps> = ({ children }) => {\n  const { popoverTriggerProps } = usePopoverContext();\n  const child = React.Children.only(children) as React.ReactElement<any>;\n  return cloneElement(child, popoverTriggerProps);\n};\n\nexport type PopoverCloseButtonProps = {\n  /** En valgfri knapp som kan legges inn for å lukke Popover */\n  children: React.ReactElement;\n};\n\nexport const PopoverCloseButton: React.FC<PopoverCloseButtonProps> = ({\n  children,\n  ...rest\n}) => {\n  const { closeButtonProps } = usePopoverContext();\n  return cloneElement(children, { ...closeButtonProps, ...rest });\n};\n\nexport type PopoverContentProps = {\n  /**Innholdet til Popover */\n  children: React.ReactNode;\n  className?: string;\n  style?: React.CSSProperties;\n};\n\nexport const PopoverContent = React.forwardRef<\n  HTMLDivElement,\n  PopoverContentProps\n>(({ children, className, style }, ref: React.Ref<HTMLDivElement>) => {\n  const { floatingStyles, popoverContentProps } = usePopoverContext();\n  return (\n    <Contrast\n      className={classNames(className, 'eds-popover')}\n      {...popoverContentProps}\n      style={{ ...floatingStyles, ...popoverContentProps.style, ...style }}\n      // @ts-expect-error correct type for floating cannot be set via useFloating\n      ref={mergeRefs(popoverContentProps.ref, ref)}\n    >\n      {children}\n    </Contrast>\n  );\n});\n\ntype PopoverContextProps = {\n  showPopover: boolean;\n  floatingStyles: React.CSSProperties;\n  closeButtonProps: Record<string, unknown>;\n  popoverContentProps: {\n    role: string;\n    'aria-modal': boolean;\n    'aria-hidden': boolean;\n    ref: MutableRefObject<HTMLElement> | ((node: HTMLElement | null) => void);\n    style: React.CSSProperties;\n    onKeyDown: (event: React.KeyboardEvent) => void;\n    onBlur: (event: React.FocusEvent) => void;\n  };\n  popoverTriggerProps: Record<string, unknown>;\n};\n\nconst PopoverContext = createContext<PopoverContextProps | undefined>(\n  undefined,\n);\nconst usePopoverContext = () => {\n  const context = useContext(PopoverContext);\n  if (context == null) {\n    throw Error('usePopoverContext must be used within <Popover/>');\n  }\n  return context;\n};\n\nconst useCustomState = (\n  state?: boolean,\n  setState?: React.Dispatch<React.SetStateAction<boolean>>,\n): [boolean, React.Dispatch<React.SetStateAction<boolean>>, boolean] => {\n  const [internalState, setInternalState] = React.useState<boolean>(false);\n  const controlled = state !== undefined && setState !== undefined;\n  if (controlled) return [state, setState, controlled];\n  return [internalState, setInternalState, controlled];\n};\n\nfunction elementContainsElement(\n  parent: HTMLElement | null,\n  child: HTMLElement,\n) {\n  if (!parent) return false;\n  return parent === child || parent.contains(child);\n}\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('tooltip');\n\nexport * from './Tooltip';\nexport * from './Popover';\nexport * from './utils';\n"],"names":["useState","useRef","useRandomId","useFloating","offset","space","flip","shift","limitShift","arrow","borderRadiuses","useEffect","autoUpdate","jsxs","Fragment","cloneElement","jsx","IconButton","CloseIcon","useOnClickOutside","Contrast","mergeRefs","createContext","useContext","warnAboutMissingStyles"],"mappings":"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"}