@dxos/react-ui 0.8.4-main.84f28bd → 0.8.4-main.8baae0fced

package/dist/lib/browser/chunk-LY5XDQR5.mjs

@@ -0,0 +1,846 @@
+// src/components/DensityProvider/DensityProvider.tsx
+import React, { createContext } from "react";
+var DensityContext = /* @__PURE__ */ createContext({
+  density: "fine"
+});
+var DensityProvider = ({ density, children }) => /* @__PURE__ */ React.createElement(DensityContext.Provider, {
+  value: {
+    density
+  }
+}, children);
+
+// src/components/ElevationProvider/ElevationProvider.tsx
+import React2, { createContext as createContext2 } from "react";
+var ElevationContext = /* @__PURE__ */ createContext2({
+  elevation: "base"
+});
+var ElevationProvider = ({ elevation, children }) => /* @__PURE__ */ React2.createElement(ElevationContext.Provider, {
+  value: {
+    elevation
+  }
+}, children);
+
+// src/hooks/useElevationContext.ts
+import { useContext as useContext3 } from "react";
+
+// src/components/ThemeProvider/ThemeProvider.tsx
+import { createKeyborg } from "keyborg";
+import React4, { createContext as createContext4, useEffect as useEffect2, useMemo } from "react";
+
+// src/hooks/useThemeContext.ts
+import { useContext } from "react";
+import { raise } from "@dxos/debug";
+var useThemeContext = () => useContext(ThemeContext) ?? raise(new Error("Missing ThemeContext"));
+
+// src/hooks/useSafeArea.ts
+import { useCallback, useState } from "react";
+import { useViewportResize } from "@dxos/react-hooks";
+var initialSafeArea = {
+  top: NaN,
+  right: NaN,
+  bottom: NaN,
+  left: NaN
+};
+var useSafeArea = () => {
+  const [padding, setPadding] = useState(initialSafeArea);
+  const handleResize = useCallback(() => {
+    setPadding({
+      top: parseFloat(getComputedStyle(document.documentElement).getPropertyValue("--safe-area-top")),
+      right: parseFloat(getComputedStyle(document.documentElement).getPropertyValue("--safe-area-right")),
+      bottom: parseFloat(getComputedStyle(document.documentElement).getPropertyValue("--safe-area-bottom")),
+      left: parseFloat(getComputedStyle(document.documentElement).getPropertyValue("--safe-area-left"))
+    });
+  }, []);
+  useViewportResize(handleResize);
+  return padding;
+};
+
+// src/components/ThemeProvider/TranslationsProvider.tsx
+import { enUS as dtLocaleEnUs } from "date-fns/locale";
+import i18Next from "i18next";
+import React3, { Suspense, createContext as createContext3, useContext as useContext2, useEffect, useState as useState2 } from "react";
+import { initReactI18next, useTranslation as useI18NextTranslation } from "react-i18next";
+var initialLng = "en-US";
+var initialNs = "dxos-common";
+var initialDtLocale = dtLocaleEnUs;
+var resources = {
+  [initialLng]: {
+    [initialNs]: {
+      "loading translations": "Loading translations\u2026"
+    }
+  }
+};
+void i18Next.use(initReactI18next).init({
+  resources,
+  lng: initialLng,
+  defaultNS: initialNs,
+  interpolation: {
+    escapeValue: false
+  }
+});
+var TranslationsContext = /* @__PURE__ */ createContext3({
+  appNs: initialNs,
+  dtLocale: initialDtLocale
+});
+var useTranslation = (...args) => {
+  const result = useI18NextTranslation(...args);
+  const { dtLocale } = useContext2(TranslationsContext);
+  return {
+    ...result,
+    dtLocale
+  };
+};
+var TranslationsProvider = ({ fallback, resourceExtensions, children, appNs, dtLocale }) => {
+  const [loaded, setLoaded] = useState2(false);
+  useEffect(() => {
+    setLoaded(false);
+    if (resourceExtensions && resourceExtensions.length) {
+      resourceExtensions.forEach((resource) => {
+        Object.keys(resource).forEach((language) => {
+          Object.keys(resource[language]).forEach((ns) => {
+            i18Next.addResourceBundle(language, ns, resource[language][ns]);
+          });
+        });
+      });
+    }
+    setLoaded(true);
+  }, [
+    resourceExtensions
+  ]);
+  return /* @__PURE__ */ React3.createElement(TranslationsContext.Provider, {
+    value: {
+      appNs: appNs ?? initialNs,
+      dtLocale: dtLocale ?? initialDtLocale
+    }
+  }, /* @__PURE__ */ React3.createElement(Suspense, {
+    fallback
+  }, loaded ? children : fallback));
+};
+
+// src/util/hasIosKeyboard.ts
+var hasIosKeyboard = () => {
+  return !!navigator.userAgent.match(/iP(ad|od|hone).+Safari/);
+};
+
+// src/components/ThemeProvider/ThemeProvider.tsx
+var ThemeContext = /* @__PURE__ */ createContext4(void 0);
+var ThemeProvider = ({ children, fallback = null, resourceExtensions, appNs, tx = (_path, _styleProps, ..._options) => void 0, themeMode = "dark", rootDensity = "fine", noCache, platform }) => {
+  useEffect2(() => {
+    if (document.defaultView) {
+      const kb = createKeyborg(document.defaultView);
+      kb.subscribe(handleInputModalityChange);
+      return () => kb.unsubscribe(handleInputModalityChange);
+    }
+  }, []);
+  const safeAreaPadding = useSafeArea();
+  const contextValue = useMemo(() => ({
+    tx,
+    themeMode,
+    hasIosKeyboard: hasIosKeyboard(),
+    safeAreaPadding,
+    noCache,
+    platform
+  }), [
+    tx,
+    themeMode,
+    safeAreaPadding,
+    noCache,
+    platform
+  ]);
+  return /* @__PURE__ */ React4.createElement(ThemeContext.Provider, {
+    value: contextValue
+  }, /* @__PURE__ */ React4.createElement(TranslationsProvider, {
+    fallback,
+    resourceExtensions,
+    appNs
+  }, /* @__PURE__ */ React4.createElement(ElevationProvider, {
+    elevation: "base"
+  }, /* @__PURE__ */ React4.createElement(DensityProvider, {
+    density: rootDensity
+  }, children))));
+};
+var handleInputModalityChange = (isUsingKeyboard) => {
+  if (isUsingKeyboard) {
+    document.body.setAttribute("data-w-keyboard", "true");
+  } else {
+    document.body.removeAttribute("data-w-keyboard");
+  }
+};
+
+// src/components/Tooltip/Tooltip.tsx
+import { composeEventHandlers } from "@radix-ui/primitive";
+import { useComposedRefs } from "@radix-ui/react-compose-refs";
+import { createContextScope } from "@radix-ui/react-context";
+import { DismissableLayer } from "@radix-ui/react-dismissable-layer";
+import { useId } from "@radix-ui/react-id";
+import * as PopperPrimitive from "@radix-ui/react-popper";
+import { createPopperScope } from "@radix-ui/react-popper";
+import { Portal as PortalPrimitive } from "@radix-ui/react-portal";
+import { Presence } from "@radix-ui/react-presence";
+import { Primitive } from "@radix-ui/react-primitive";
+import { Slottable } from "@radix-ui/react-slot";
+import { useControllableState } from "@radix-ui/react-use-controllable-state";
+import * as VisuallyHiddenPrimitive from "@radix-ui/react-visually-hidden";
+import React5, { forwardRef, useCallback as useCallback2, useEffect as useEffect3, useMemo as useMemo2, useRef, useState as useState3 } from "react";
+var [createTooltipContext, createTooltipScope] = createContextScope("Tooltip", [
+  createPopperScope
+]);
+var usePopperScope = createPopperScope();
+var DEFAULT_DELAY_DURATION = 700;
+var TOOLTIP_OPEN = "tooltip.open";
+var TOOLTIP_NAME = "Tooltip";
+var [TooltipContextProvider, useTooltipContext] = createTooltipContext(TOOLTIP_NAME);
+var TooltipProvider = (props) => {
+  const { __scopeTooltip, children, open: openProp, defaultOpen = false, onOpenChange, disableHoverableContent = false, delayDuration = DEFAULT_DELAY_DURATION, skipDelayDuration = 300 } = props;
+  const isOpenDelayedRef = useRef(true);
+  const isPointerInTransitRef = useRef(false);
+  const skipDelayTimerRef = useRef(0);
+  useEffect3(() => {
+    const skipDelayTimer = skipDelayTimerRef.current;
+    return () => window.clearTimeout(skipDelayTimer);
+  }, []);
+  const popperScope = usePopperScope(__scopeTooltip);
+  const [trigger, setTrigger] = useState3(null);
+  const [content, setContent] = useState3(null);
+  const [side, setSide] = useState3(void 0);
+  const triggerRef = useRef(trigger);
+  const handleTriggerChange = useCallback2((nextTrigger, nextContent, nextSide) => {
+    setTrigger(nextTrigger);
+    triggerRef.current = nextTrigger;
+    setContent(nextContent ?? null);
+    setSide(nextSide);
+  }, []);
+  const contentId = useId();
+  const openTimerRef = useRef(0);
+  const wasOpenDelayedRef = useRef(false);
+  const handleOpenChange = useCallback2((open2) => {
+    if (open2) {
+      window.clearTimeout(skipDelayTimerRef.current);
+      isOpenDelayedRef.current = false;
+      document.dispatchEvent(new CustomEvent(TOOLTIP_OPEN));
+    } else {
+      window.clearTimeout(skipDelayTimerRef.current);
+      skipDelayTimerRef.current = window.setTimeout(() => isOpenDelayedRef.current = true, skipDelayDuration);
+    }
+    onOpenChange?.(open2);
+  }, [
+    skipDelayDuration,
+    onOpenChange
+  ]);
+  const [open = false, setOpen] = useControllableState({
+    prop: openProp,
+    defaultProp: defaultOpen,
+    onChange: handleOpenChange
+  });
+  const stateAttribute = useMemo2(() => {
+    return open ? wasOpenDelayedRef.current ? "delayed-open" : "instant-open" : "closed";
+  }, [
+    open
+  ]);
+  const handleOpen = useCallback2(() => {
+    window.clearTimeout(openTimerRef.current);
+    openTimerRef.current = 0;
+    wasOpenDelayedRef.current = false;
+    setOpen(true);
+  }, [
+    setOpen
+  ]);
+  const handleClose = useCallback2(() => {
+    window.clearTimeout(openTimerRef.current);
+    openTimerRef.current = 0;
+    setOpen(false);
+  }, [
+    setOpen
+  ]);
+  const handleDelayedOpen = useCallback2(() => {
+    window.clearTimeout(openTimerRef.current);
+    openTimerRef.current = window.setTimeout(() => {
+      wasOpenDelayedRef.current = true;
+      setOpen(true);
+      openTimerRef.current = 0;
+    }, delayDuration);
+  }, [
+    delayDuration,
+    setOpen
+  ]);
+  useEffect3(() => {
+    return () => {
+      if (openTimerRef.current) {
+        window.clearTimeout(openTimerRef.current);
+        openTimerRef.current = 0;
+      }
+    };
+  }, []);
+  const { tx } = useThemeContext();
+  const elevation = useElevationContext();
+  return /* @__PURE__ */ React5.createElement(PopperPrimitive.Root, popperScope, /* @__PURE__ */ React5.createElement(TooltipContextProvider, {
+    scope: __scopeTooltip,
+    contentId,
+    open,
+    stateAttribute,
+    trigger,
+    onTriggerChange: handleTriggerChange,
+    onTriggerEnter: useCallback2(() => {
+      if (isOpenDelayedRef.current) {
+        handleDelayedOpen();
+      } else {
+        handleOpen();
+      }
+    }, [
+      isOpenDelayedRef,
+      handleDelayedOpen,
+      handleOpen
+    ]),
+    onTriggerLeave: useCallback2(() => {
+      if (disableHoverableContent) {
+        handleClose();
+      } else {
+        window.clearTimeout(openTimerRef.current);
+        openTimerRef.current = 0;
+      }
+    }, [
+      handleClose,
+      disableHoverableContent
+    ]),
+    onOpen: handleOpen,
+    onClose: handleClose,
+    disableHoverableContent,
+    isPointerInTransitRef,
+    onPointerInTransitChange: useCallback2((inTransit) => {
+      isPointerInTransitRef.current = inTransit;
+    }, [])
+  }, /* @__PURE__ */ React5.createElement(TooltipContent, {
+    side,
+    className: tx("tooltip.content", {
+      elevation
+    })
+  }, content, /* @__PURE__ */ React5.createElement(TooltipArrow, {
+    className: tx("tooltip.arrow")
+  })), /* @__PURE__ */ React5.createElement(TooltipVirtualTrigger, {
+    virtualRef: triggerRef
+  }), children));
+};
+TooltipProvider.displayName = TOOLTIP_NAME;
+var TooltipVirtualTrigger = ({ virtualRef, __scopeTooltip }) => {
+  const popperScope = usePopperScope(__scopeTooltip);
+  return /* @__PURE__ */ React5.createElement(PopperPrimitive.Anchor, {
+    asChild: true,
+    ...popperScope,
+    virtualRef
+  });
+};
+var TRIGGER_NAME = "TooltipTrigger";
+var TooltipTrigger = /* @__PURE__ */ forwardRef((props, forwardedRef) => {
+  const {
+    __scopeTooltip,
+    onInteract,
+    // TODO(thure): Pass `delayDuration` into the context.
+    delayDuration: _delayDuration,
+    side,
+    content,
+    ...triggerProps
+  } = props;
+  const context = useTooltipContext(TRIGGER_NAME, __scopeTooltip);
+  const ref = useRef(null);
+  const composedRefs = useComposedRefs(forwardedRef, ref);
+  const isPointerDownRef = useRef(false);
+  const hasPointerMoveOpenedRef = useRef(false);
+  const handlePointerUp = useCallback2(() => isPointerDownRef.current = false, []);
+  useEffect3(() => {
+    return () => document.removeEventListener("pointerup", handlePointerUp);
+  }, [
+    handlePointerUp
+  ]);
+  return /* @__PURE__ */ React5.createElement(Primitive.button, {
+    // We purposefully avoid adding `type=button` here because tooltip triggers are also
+    // commonly anchors and the anchor `type` attribute signifies MIME type.
+    "aria-describedby": context.open ? context.contentId : void 0,
+    "data-state": context.stateAttribute,
+    ...triggerProps,
+    ref: composedRefs,
+    onPointerMove: composeEventHandlers(props.onPointerMove, (event) => {
+      if (event.pointerType === "touch") {
+        return;
+      }
+      if (!hasPointerMoveOpenedRef.current && !context.isPointerInTransitRef.current) {
+        onInteract?.(event);
+        if (event.defaultPrevented) {
+          return;
+        }
+        context.onTriggerChange(ref.current, content, side);
+        context.onTriggerEnter();
+        hasPointerMoveOpenedRef.current = true;
+      }
+    }),
+    onPointerLeave: composeEventHandlers(props.onPointerLeave, () => {
+      context.onTriggerLeave();
+      hasPointerMoveOpenedRef.current = false;
+    }),
+    onPointerDown: composeEventHandlers(props.onPointerDown, () => {
+      if (context.open) {
+        context.onClose();
+      }
+      isPointerDownRef.current = true;
+      document.addEventListener("pointerup", handlePointerUp, {
+        once: true
+      });
+    }),
+    onFocus: props.onFocus,
+    onBlur: composeEventHandlers(props.onBlur, context.onClose),
+    onClick: composeEventHandlers(props.onClick, context.onClose)
+  });
+});
+TooltipTrigger.displayName = TRIGGER_NAME;
+var PORTAL_NAME = "TooltipPortal";
+var [PortalProvider, usePortalContext] = createTooltipContext(PORTAL_NAME, {
+  forceMount: void 0
+});
+var TooltipPortal = (props) => {
+  const { __scopeTooltip, forceMount, children, container } = props;
+  const context = useTooltipContext(PORTAL_NAME, __scopeTooltip);
+  return /* @__PURE__ */ React5.createElement(PortalProvider, {
+    scope: __scopeTooltip,
+    forceMount
+  }, /* @__PURE__ */ React5.createElement(Presence, {
+    present: forceMount || context.open
+  }, /* @__PURE__ */ React5.createElement(PortalPrimitive, {
+    asChild: true,
+    container
+  }, children)));
+};
+TooltipPortal.displayName = PORTAL_NAME;
+var CONTENT_NAME = "TooltipContent";
+var TooltipContent = /* @__PURE__ */ forwardRef((props, forwardedRef) => {
+  const portalContext = usePortalContext(CONTENT_NAME, props.__scopeTooltip);
+  const { forceMount = portalContext.forceMount, side = "top", ...contentProps } = props;
+  const context = useTooltipContext(CONTENT_NAME, props.__scopeTooltip);
+  return /* @__PURE__ */ React5.createElement(Presence, {
+    present: forceMount || context.open
+  }, context.disableHoverableContent ? /* @__PURE__ */ React5.createElement(TooltipContentImpl, {
+    side,
+    ...contentProps,
+    ref: forwardedRef
+  }) : /* @__PURE__ */ React5.createElement(TooltipContentHoverable, {
+    side,
+    ...contentProps,
+    ref: forwardedRef
+  }));
+});
+var TooltipContentHoverable = /* @__PURE__ */ forwardRef((props, forwardedRef) => {
+  const context = useTooltipContext(CONTENT_NAME, props.__scopeTooltip);
+  const ref = useRef(null);
+  const composedRefs = useComposedRefs(forwardedRef, ref);
+  const [pointerGraceArea, setPointerGraceArea] = useState3(null);
+  const { trigger, onClose } = context;
+  const content = ref.current;
+  const { onPointerInTransitChange } = context;
+  const handleRemoveGraceArea = useCallback2(() => {
+    setPointerGraceArea(null);
+    onPointerInTransitChange(false);
+  }, [
+    onPointerInTransitChange
+  ]);
+  const handleCreateGraceArea = useCallback2((event, hoverTarget) => {
+    const currentTarget = event.currentTarget;
+    const exitPoint = {
+      x: event.clientX,
+      y: event.clientY
+    };
+    const exitSide = getExitSideFromRect(exitPoint, currentTarget.getBoundingClientRect());
+    const paddedExitPoints = getPaddedExitPoints(exitPoint, exitSide);
+    const hoverTargetPoints = getPointsFromRect(hoverTarget.getBoundingClientRect());
+    const graceArea = getHull([
+      ...paddedExitPoints,
+      ...hoverTargetPoints
+    ]);
+    setPointerGraceArea(graceArea);
+    onPointerInTransitChange(true);
+  }, [
+    onPointerInTransitChange
+  ]);
+  useEffect3(() => {
+    return () => handleRemoveGraceArea();
+  }, [
+    handleRemoveGraceArea
+  ]);
+  useEffect3(() => {
+    if (trigger && content) {
+      const handleTriggerLeave = (event) => handleCreateGraceArea(event, content);
+      const handleContentLeave = (event) => handleCreateGraceArea(event, trigger);
+      trigger.addEventListener("pointerleave", handleTriggerLeave);
+      content.addEventListener("pointerleave", handleContentLeave);
+      return () => {
+        trigger.removeEventListener("pointerleave", handleTriggerLeave);
+        content.removeEventListener("pointerleave", handleContentLeave);
+      };
+    }
+  }, [
+    trigger,
+    content,
+    handleCreateGraceArea,
+    handleRemoveGraceArea
+  ]);
+  useEffect3(() => {
+    if (pointerGraceArea) {
+      const handleTrackPointerGrace = (event) => {
+        const target = event.target;
+        const pointerPosition = {
+          x: event.clientX,
+          y: event.clientY
+        };
+        const hasEnteredTarget = trigger?.contains(target) || content?.contains(target);
+        const isPointerOutsideGraceArea = !isPointInPolygon(pointerPosition, pointerGraceArea);
+        if (hasEnteredTarget) {
+          handleRemoveGraceArea();
+        } else if (isPointerOutsideGraceArea) {
+          handleRemoveGraceArea();
+          onClose();
+        }
+      };
+      document.addEventListener("pointermove", handleTrackPointerGrace);
+      return () => document.removeEventListener("pointermove", handleTrackPointerGrace);
+    }
+  }, [
+    trigger,
+    content,
+    pointerGraceArea,
+    onClose,
+    handleRemoveGraceArea
+  ]);
+  return /* @__PURE__ */ React5.createElement(TooltipContentImpl, {
+    ...props,
+    ref: composedRefs
+  });
+});
+var [VisuallyHiddenContentContextProvider, useVisuallyHiddenContentContext] = createTooltipContext(TOOLTIP_NAME, {
+  isInside: false
+});
+var TooltipContentImpl = /* @__PURE__ */ forwardRef((props, forwardedRef) => {
+  const { __scopeTooltip, children, "aria-label": ariaLabel, onEscapeKeyDown, onPointerDownOutside, ...contentProps } = props;
+  const context = useTooltipContext(CONTENT_NAME, __scopeTooltip);
+  const popperScope = usePopperScope(__scopeTooltip);
+  const { onClose } = context;
+  useEffect3(() => {
+    document.addEventListener(TOOLTIP_OPEN, onClose);
+    return () => document.removeEventListener(TOOLTIP_OPEN, onClose);
+  }, [
+    onClose
+  ]);
+  useEffect3(() => {
+    if (context.trigger) {
+      const handleScroll = (event) => {
+        const target = event.target;
+        if (target?.contains(context.trigger)) {
+          onClose();
+        }
+      };
+      window.addEventListener("scroll", handleScroll, {
+        capture: true
+      });
+      return () => window.removeEventListener("scroll", handleScroll, {
+        capture: true
+      });
+    }
+  }, [
+    context.trigger,
+    onClose
+  ]);
+  return /* @__PURE__ */ React5.createElement(DismissableLayer, {
+    asChild: true,
+    disableOutsidePointerEvents: false,
+    onEscapeKeyDown,
+    onPointerDownOutside,
+    onFocusOutside: (event) => event.preventDefault(),
+    onDismiss: onClose
+  }, /* @__PURE__ */ React5.createElement(PopperPrimitive.Content, {
+    "data-state": context.stateAttribute,
+    ...popperScope,
+    ...contentProps,
+    ref: forwardedRef,
+    style: {
+      ...contentProps.style,
+      // re-namespace exposed content custom properties
+      ...{
+        "--radix-tooltip-content-transform-origin": "var(--radix-popper-transform-origin)",
+        "--radix-tooltip-content-available-width": "var(--radix-popper-available-width)",
+        "--radix-tooltip-content-available-height": "var(--radix-popper-available-height)",
+        "--radix-tooltip-trigger-width": "var(--radix-popper-anchor-width)",
+        "--radix-tooltip-trigger-height": "var(--radix-popper-anchor-height)"
+      }
+    }
+  }, /* @__PURE__ */ React5.createElement(Slottable, null, children), /* @__PURE__ */ React5.createElement(VisuallyHiddenContentContextProvider, {
+    scope: __scopeTooltip,
+    isInside: true
+  }, /* @__PURE__ */ React5.createElement(VisuallyHiddenPrimitive.Root, {
+    id: context.contentId,
+    role: "tooltip"
+  }, ariaLabel || children))));
+});
+TooltipContent.displayName = CONTENT_NAME;
+var ARROW_NAME = "TooltipArrow";
+var TooltipArrow = /* @__PURE__ */ forwardRef((props, forwardedRef) => {
+  const { __scopeTooltip, ...arrowProps } = props;
+  const popperScope = usePopperScope(__scopeTooltip);
+  const visuallyHiddenContentContext = useVisuallyHiddenContentContext(ARROW_NAME, __scopeTooltip);
+  return visuallyHiddenContentContext.isInside ? null : /* @__PURE__ */ React5.createElement(PopperPrimitive.Arrow, {
+    ...popperScope,
+    ...arrowProps,
+    ref: forwardedRef
+  });
+});
+TooltipArrow.displayName = ARROW_NAME;
+var getExitSideFromRect = (point, rect) => {
+  const top = Math.abs(rect.top - point.y);
+  const bottom = Math.abs(rect.bottom - point.y);
+  const right = Math.abs(rect.right - point.x);
+  const left = Math.abs(rect.left - point.x);
+  switch (Math.min(top, bottom, right, left)) {
+    case left:
+      return "left";
+    case right:
+      return "right";
+    case top:
+      return "top";
+    case bottom:
+      return "bottom";
+    default:
+      throw new Error("unreachable");
+  }
+};
+var getPaddedExitPoints = (exitPoint, exitSide, padding = 5) => {
+  const paddedExitPoints = [];
+  switch (exitSide) {
+    case "top":
+      paddedExitPoints.push({
+        x: exitPoint.x - padding,
+        y: exitPoint.y + padding
+      }, {
+        x: exitPoint.x + padding,
+        y: exitPoint.y + padding
+      });
+      break;
+    case "bottom":
+      paddedExitPoints.push({
+        x: exitPoint.x - padding,
+        y: exitPoint.y - padding
+      }, {
+        x: exitPoint.x + padding,
+        y: exitPoint.y - padding
+      });
+      break;
+    case "left":
+      paddedExitPoints.push({
+        x: exitPoint.x + padding,
+        y: exitPoint.y - padding
+      }, {
+        x: exitPoint.x + padding,
+        y: exitPoint.y + padding
+      });
+      break;
+    case "right":
+      paddedExitPoints.push({
+        x: exitPoint.x - padding,
+        y: exitPoint.y - padding
+      }, {
+        x: exitPoint.x - padding,
+        y: exitPoint.y + padding
+      });
+      break;
+  }
+  return paddedExitPoints;
+};
+var getPointsFromRect = (rect) => {
+  const { top, right, bottom, left } = rect;
+  return [
+    {
+      x: left,
+      y: top
+    },
+    {
+      x: right,
+      y: top
+    },
+    {
+      x: right,
+      y: bottom
+    },
+    {
+      x: left,
+      y: bottom
+    }
+  ];
+};
+var isPointInPolygon = (point, polygon) => {
+  const { x, y } = point;
+  let inside = false;
+  for (let i = 0, j = polygon.length - 1; i < polygon.length; j = i++) {
+    const xi = polygon[i].x;
+    const yi = polygon[i].y;
+    const xj = polygon[j].x;
+    const yj = polygon[j].y;
+    const intersect = yi > y !== yj > y && x < (xj - xi) * (y - yi) / (yj - yi) + xi;
+    if (intersect) {
+      inside = !inside;
+    }
+  }
+  return inside;
+};
+var getHull = (points) => {
+  const newPoints = points.slice();
+  newPoints.sort((a, b) => {
+    if (a.x < b.x) {
+      return -1;
+    } else if (a.x > b.x) {
+      return 1;
+    } else if (a.y < b.y) {
+      return -1;
+    } else if (a.y > b.y) {
+      return 1;
+    } else {
+      return 0;
+    }
+  });
+  return getHullPresorted(newPoints);
+};
+var getHullPresorted = (points) => {
+  if (points.length <= 1) {
+    return points.slice();
+  }
+  const upperHull = [];
+  for (let i = 0; i < points.length; i++) {
+    const p = points[i];
+    while (upperHull.length >= 2) {
+      const q = upperHull[upperHull.length - 1];
+      const r = upperHull[upperHull.length - 2];
+      if ((q.x - r.x) * (p.y - r.y) >= (q.y - r.y) * (p.x - r.x)) {
+        upperHull.pop();
+      } else {
+        break;
+      }
+    }
+    upperHull.push(p);
+  }
+  upperHull.pop();
+  const lowerHull = [];
+  for (let i = points.length - 1; i >= 0; i--) {
+    const p = points[i];
+    while (lowerHull.length >= 2) {
+      const q = lowerHull[lowerHull.length - 1];
+      const r = lowerHull[lowerHull.length - 2];
+      if ((q.x - r.x) * (p.y - r.y) >= (q.y - r.y) * (p.x - r.x)) {
+        lowerHull.pop();
+      } else {
+        break;
+      }
+    }
+    lowerHull.push(p);
+  }
+  lowerHull.pop();
+  if (upperHull.length === 1 && lowerHull.length === 1 && upperHull[0].x === lowerHull[0].x && upperHull[0].y === lowerHull[0].y) {
+    return upperHull;
+  } else {
+    return upperHull.concat(lowerHull);
+  }
+};
+var Tooltip = {
+  Provider: TooltipProvider,
+  Trigger: TooltipTrigger
+};
+
+// src/components/ErrorFallback/ErrorStack.tsx
+import ErrorStackParser from "error-stack-parser";
+import React6 from "react";
+import { mx } from "@dxos/ui-theme";
+var parseCaptureOwnerStack = (stack) => {
+  if (stack == null || stack.length === 0) {
+    return null;
+  }
+  const err = new Error();
+  err.stack = stack;
+  try {
+    return ErrorStackParser.parse(err);
+  } catch {
+    err.stack = `Error
+${stack}`;
+    try {
+      return ErrorStackParser.parse(err);
+    } catch {
+      return null;
+    }
+  }
+};
+var ErrorStack = ({ error, frames: framesProp }) => {
+  const frames = framesProp ?? (error ? ErrorStackParser.parse(error) : []);
+  if (frames.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ React6.createElement("div", {
+    className: "font-mono text-sm"
+  }, frames.map((frame, i) => {
+    const isLast = i === frames.length - 1;
+    const local = frame.fileName ? parseLocalFrame(frame.fileName, frame.lineNumber, frame.columnNumber) : void 0;
+    const name = frame.functionName ?? "<anonymous>";
+    return /* @__PURE__ */ React6.createElement("div", {
+      key: i,
+      className: mx("grid grid-cols-[16px_1fr_auto_auto] items-stretch gap-x-2", local && "cursor-pointer hover:bg-hover-surface")
+    }, /* @__PURE__ */ React6.createElement("div", {
+      className: "relative"
+    }, /* @__PURE__ */ React6.createElement("div", {
+      className: mx("absolute left-1/2 -translate-x-1/2 w-px bg-neutral-500", isLast ? "top-0 h-1/2" : "inset-y-0")
+    }), /* @__PURE__ */ React6.createElement("div", {
+      className: "absolute top-1/2 -translate-y-1/2 left-1/2 right-0 h-px bg-neutral-500"
+    })), local ? /* @__PURE__ */ React6.createElement("a", {
+      href: local.href,
+      className: "truncate self-center"
+    }, name) : /* @__PURE__ */ React6.createElement("span", {
+      className: "text-subdued truncate self-center"
+    }, name), /* @__PURE__ */ React6.createElement("span", {
+      className: "text-xs text-subdued truncate self-center"
+    }, local?.fileName ?? ""), /* @__PURE__ */ React6.createElement("span", {
+      className: "text-xs text-subdued text-right self-center"
+    }, local ? `${frame.lineNumber}:${frame.columnNumber}` : ""));
+  }));
+};
+var parseLocalFrame = (fileUrl, line, col) => {
+  try {
+    const { pathname } = new URL(fileUrl);
+    if (!pathname.startsWith("/@fs/")) {
+      return void 0;
+    }
+    const localPath = pathname.slice(4);
+    return {
+      href: `vscode://file/${localPath}:${line ?? 1}:${col ?? 1}`,
+      fileName: pathname.split("/").pop() ?? localPath
+    };
+  } catch {
+    return void 0;
+  }
+};
+
+// src/hooks/useElevationContext.ts
+var useElevationContext = (propsElevation) => {
+  const { elevation } = useContext3(ElevationContext);
+  return propsElevation ?? elevation;
+};
+
+export {
+  DensityContext,
+  DensityProvider,
+  ElevationContext,
+  ElevationProvider,
+  useElevationContext,
+  useThemeContext,
+  initialSafeArea,
+  useSafeArea,
+  TranslationsContext,
+  useTranslation,
+  hasIosKeyboard,
+  ThemeContext,
+  ThemeProvider,
+  createTooltipScope,
+  useTooltipContext,
+  Tooltip,
+  parseCaptureOwnerStack,
+  ErrorStack
+};
+//# sourceMappingURL=chunk-LY5XDQR5.mjs.map