@nori-ui/core 0.0.5 → 1.0.2

package/dist/components/Tooltip/index.cjs

@@ -0,0 +1,813 @@
+'use strict';
+
+var react = require('react');
+var reactNative = require('react-native');
+var jsxRuntime = require('nativewind/jsx-runtime');
+
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+
+// src/slot/compose-refs.ts
+function composeRefs(...refs) {
+  return (node) => {
+    for (const ref of refs) {
+      if (ref == null) {
+        continue;
+      }
+      if (typeof ref === "function") {
+        ref(node);
+      } else {
+        ref.current = node;
+      }
+    }
+  };
+}
+__name(composeRefs, "composeRefs");
+var Slot = react.forwardRef(/* @__PURE__ */ __name(function Slot2(props, forwardedRef) {
+  const { children, ...slotProps } = props;
+  if (!react.isValidElement(children)) {
+    return null;
+  }
+  const child = react.Children.only(children);
+  const merged = mergeProps(slotProps, child.props);
+  const childRef = child.ref;
+  if (forwardedRef || childRef) {
+    merged.ref = composeRefs(forwardedRef, childRef);
+  }
+  return react.cloneElement(child, merged);
+}, "Slot"));
+Slot.displayName = "Slot";
+function mergeProps(outer, inner) {
+  const merged = { ...outer };
+  for (const key of Object.keys(inner)) {
+    const outerValue = outer[key];
+    const innerValue = inner[key];
+    if (key === "className" || key === "class") {
+      merged[key] = joinClass(outerValue, innerValue);
+      continue;
+    }
+    if (key === "style") {
+      merged[key] = {
+        ...outerValue,
+        ...innerValue
+      };
+      continue;
+    }
+    if (isEventHandler(key, outerValue, innerValue)) {
+      merged[key] = composeHandlers(outerValue, innerValue);
+      continue;
+    }
+    merged[key] = innerValue;
+  }
+  return merged;
+}
+__name(mergeProps, "mergeProps");
+function joinClass(outer, inner) {
+  const a = typeof outer === "string" ? outer : "";
+  const b = typeof inner === "string" ? inner : "";
+  const joined = [a, b].filter(Boolean).join(" ");
+  return joined.length > 0 ? joined : void 0;
+}
+__name(joinClass, "joinClass");
+function isEventHandler(key, outer, inner) {
+  if (!key.startsWith("on") || key.length < 3) {
+    return false;
+  }
+  if (key[2] !== key[2]?.toUpperCase()) {
+    return false;
+  }
+  return typeof outer === "function" && typeof inner === "function";
+}
+__name(isEventHandler, "isEventHandler");
+function composeHandlers(outer, inner) {
+  return (...args) => {
+    outer(...args);
+    inner(...args);
+  };
+}
+__name(composeHandlers, "composeHandlers");
+
+// src/theme/px.ts
+function px(value) {
+  if (typeof value === "number") {
+    return value;
+  }
+  const n = Number.parseFloat(value);
+  return Number.isFinite(n) ? n : 0;
+}
+__name(px, "px");
+
+// ../tokens/build/theme.ts
+var theme = {
+  color: {
+    danger: "#ef4444",
+    info: "#3b82f6",
+    neutral: {
+      "100": "#f4f4f5",
+      "200": "#e4e4e7",
+      "300": "#d4d4d8",
+      "400": "#a1a1aa",
+      "50": "#fafafa",
+      "500": "#71717a",
+      "600": "#52525b",
+      "700": "#3f3f46",
+      "800": "#27272a",
+      "900": "#18181b"
+    },
+    primary: {
+      "100": "#ccfbf1",
+      "200": "#99f6e4",
+      "300": "#5eead4",
+      "400": "#2dd4bf",
+      "50": "#f0fdfa",
+      "500": "#14b8a6",
+      "600": "#0d9488",
+      "700": "#0f766e",
+      "800": "#115e59",
+      "900": "#134e4a"
+    },
+    success: "#22c55e",
+    warning: "#f59e0b"
+  },
+  fontFamily: {
+    body: "system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
+    display: "ui-serif, Georgia, 'Times New Roman', serif",
+    mono: "ui-monospace, 'SF Mono', Menlo, Consolas, 'DejaVu Sans Mono', monospace"
+  },
+  fontSize: {
+    "2xl": "24px",
+    "3xl": "30px",
+    "4xl": "36px",
+    lg: "18px",
+    md: "16px",
+    sm: "14px",
+    xl: "20px",
+    xs: "12px"
+  },
+  fontWeight: {
+    bold: "700",
+    medium: "500",
+    regular: "400",
+    semibold: "600"
+  },
+  lineHeight: {
+    normal: "1.4",
+    relaxed: "1.6",
+    tight: "1.2"
+  },
+  radius: {
+    "2xl": "16px",
+    full: "9999px",
+    lg: "8px",
+    md: "6px",
+    none: "0px",
+    sm: "4px",
+    xl: "12px"
+  },
+  semantic: {
+    background: {
+      default: "#fafafa",
+      elevated: "#ffffff",
+      subtle: "#f4f4f5"
+    },
+    border: {
+      default: "#e4e4e7",
+      strong: "#d4d4d8"
+    },
+    interactive: {
+      destructive: "#ef4444",
+      primary: "#0d9488",
+      primaryHover: "#0f766e",
+      primaryPressed: "#115e59"
+    },
+    text: {
+      default: "#18181b",
+      inverted: "#fafafa",
+      muted: "#52525b"
+    }
+  },
+  shadow: {
+    lg: "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1)",
+    md: "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1)",
+    sm: "0 1px 2px 0 rgba(0, 0, 0, 0.05)"
+  },
+  spacing: {
+    "0": "0px",
+    "1": "4px",
+    "10": "40px",
+    "12": "48px",
+    "16": "64px",
+    "2": "8px",
+    "20": "80px",
+    "24": "96px",
+    "3": "12px",
+    "4": "16px",
+    "5": "20px",
+    "6": "24px",
+    "8": "32px"
+  }
+};
+var themeDark = {
+  color: {
+    danger: "#ef4444",
+    info: "#3b82f6",
+    neutral: {
+      "100": "#f4f4f5",
+      "200": "#e4e4e7",
+      "300": "#d4d4d8",
+      "400": "#a1a1aa",
+      "50": "#fafafa",
+      "500": "#71717a",
+      "600": "#52525b",
+      "700": "#3f3f46",
+      "800": "#27272a",
+      "900": "#18181b"
+    },
+    primary: {
+      "100": "#ccfbf1",
+      "200": "#99f6e4",
+      "300": "#5eead4",
+      "400": "#2dd4bf",
+      "50": "#f0fdfa",
+      "500": "#14b8a6",
+      "600": "#0d9488",
+      "700": "#0f766e",
+      "800": "#115e59",
+      "900": "#134e4a"
+    },
+    success: "#22c55e",
+    warning: "#f59e0b"
+  },
+  fontFamily: {
+    body: "system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
+    display: "ui-serif, Georgia, 'Times New Roman', serif",
+    mono: "ui-monospace, 'SF Mono', Menlo, Consolas, 'DejaVu Sans Mono', monospace"
+  },
+  fontSize: {
+    "2xl": "24px",
+    "3xl": "30px",
+    "4xl": "36px",
+    lg: "18px",
+    md: "16px",
+    sm: "14px",
+    xl: "20px",
+    xs: "12px"
+  },
+  fontWeight: {
+    bold: "700",
+    medium: "500",
+    regular: "400",
+    semibold: "600"
+  },
+  lineHeight: {
+    normal: "1.4",
+    relaxed: "1.6",
+    tight: "1.2"
+  },
+  radius: {
+    "2xl": "16px",
+    full: "9999px",
+    lg: "8px",
+    md: "6px",
+    none: "0px",
+    sm: "4px",
+    xl: "12px"
+  },
+  semantic: {
+    background: {
+      default: "#18181b",
+      elevated: "#3f3f46",
+      subtle: "#27272a"
+    },
+    border: {
+      default: "#3f3f46",
+      strong: "#52525b"
+    },
+    interactive: {
+      destructive: "#ef4444",
+      primary: "#2dd4bf",
+      primaryHover: "#5eead4",
+      primaryPressed: "#99f6e4"
+    },
+    text: {
+      default: "#fafafa",
+      inverted: "#18181b",
+      muted: "#a1a1aa"
+    }
+  },
+  shadow: {
+    lg: "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1)",
+    md: "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1)",
+    sm: "0 1px 2px 0 rgba(0, 0, 0, 0.05)"
+  },
+  spacing: {
+    "0": "0px",
+    "1": "4px",
+    "10": "40px",
+    "12": "48px",
+    "16": "64px",
+    "2": "8px",
+    "20": "80px",
+    "24": "96px",
+    "3": "12px",
+    "4": "16px",
+    "5": "20px",
+    "6": "24px",
+    "8": "32px"
+  }
+};
+var defaultTheme = {
+  light: theme,
+  dark: themeDark
+};
+var ThemeContext = react.createContext(defaultTheme);
+ThemeContext.displayName = "ThemeContext";
+var ColorSchemeOverrideContext = react.createContext(null);
+ColorSchemeOverrideContext.displayName = "ColorSchemeOverrideContext";
+var isWeb = reactNative.Platform.OS === "web";
+function readWebScheme() {
+  if (typeof document === "undefined") {
+    return "light";
+  }
+  const root = document.documentElement;
+  if (root.classList.contains("dark")) {
+    return "dark";
+  }
+  if (root.getAttribute("data-theme") === "dark") {
+    return "dark";
+  }
+  return "light";
+}
+__name(readWebScheme, "readWebScheme");
+function useColorScheme() {
+  const override = react.useContext(ColorSchemeOverrideContext);
+  const [scheme, setScheme] = react.useState(() => {
+    if (isWeb) {
+      return readWebScheme();
+    }
+    return reactNative.Appearance.getColorScheme() ?? "light";
+  });
+  react.useEffect(() => {
+    if (isWeb) {
+      const root = document.documentElement;
+      const update = /* @__PURE__ */ __name(() => setScheme(readWebScheme()), "update");
+      const observer = new MutationObserver(update);
+      observer.observe(root, { attributes: true, attributeFilter: ["class", "data-theme"] });
+      update();
+      return () => observer.disconnect();
+    }
+    const sub = reactNative.Appearance.addChangeListener(({ colorScheme }) => {
+      setScheme(colorScheme ?? "light");
+    });
+    return () => sub.remove();
+  }, []);
+  return override ?? scheme;
+}
+__name(useColorScheme, "useColorScheme");
+
+// src/theme/use-theme-colors.ts
+function useThemeColors() {
+  const scheme = useColorScheme();
+  const themePair = react.useContext(ThemeContext);
+  return scheme === "dark" ? themePair.dark : themePair.light;
+}
+__name(useThemeColors, "useThemeColors");
+
+// src/utils/cn.ts
+function cn(...inputs) {
+  const out = [];
+  for (const input of inputs) {
+    append(out, input);
+  }
+  return out.join(" ");
+}
+__name(cn, "cn");
+function append(out, input) {
+  if (!input) {
+    return;
+  }
+  if (typeof input === "string") {
+    if (input.length > 0) {
+      out.push(input);
+    }
+    return;
+  }
+  if (typeof input === "number") {
+    return;
+  }
+  if (Array.isArray(input)) {
+    for (const inner of input) {
+      append(out, inner);
+    }
+    return;
+  }
+  if (typeof input === "object") {
+    for (const key of Object.keys(input)) {
+      if (input[key]) {
+        out.push(key);
+      }
+    }
+  }
+}
+__name(append, "append");
+var TooltipContext = react.createContext(null);
+var useTooltipContext = /* @__PURE__ */ __name((label) => {
+  const ctx = react.useContext(TooltipContext);
+  if (!ctx) {
+    throw new Error(`<${label}> must be rendered inside a <Tooltip>.`);
+  }
+  return ctx;
+}, "useTooltipContext");
+var DEFAULT_OPEN_DELAY_MS = 500;
+var DEFAULT_CLOSE_DELAY_MS = 0;
+var LONG_PRESS_MS = 500;
+var TooltipRoot = /* @__PURE__ */ __name(({
+  open,
+  defaultOpen = false,
+  onOpenChange,
+  delayMs = DEFAULT_OPEN_DELAY_MS,
+  closeDelayMs = DEFAULT_CLOSE_DELAY_MS,
+  children
+}) => {
+  const [inner, setInner] = react.useState(defaultOpen);
+  const isControlled = open !== void 0;
+  const current = isControlled ? open : inner;
+  const setOpen = react.useCallback(
+    (next) => {
+      if (!isControlled) {
+        setInner(next);
+      }
+      onOpenChange?.(next);
+    },
+    [isControlled, onOpenChange]
+  );
+  const openTimer = react.useRef(null);
+  const closeTimer = react.useRef(null);
+  const cancelTimers = react.useCallback(() => {
+    if (openTimer.current) {
+      clearTimeout(openTimer.current);
+      openTimer.current = null;
+    }
+    if (closeTimer.current) {
+      clearTimeout(closeTimer.current);
+      closeTimer.current = null;
+    }
+  }, []);
+  const requestOpen = react.useCallback(() => {
+    if (closeTimer.current) {
+      clearTimeout(closeTimer.current);
+      closeTimer.current = null;
+    }
+    if (openTimer.current) {
+      return;
+    }
+    if (delayMs <= 0) {
+      setOpen(true);
+      return;
+    }
+    openTimer.current = setTimeout(() => {
+      openTimer.current = null;
+      setOpen(true);
+    }, delayMs);
+  }, [delayMs, setOpen]);
+  const requestClose = react.useCallback(() => {
+    if (openTimer.current) {
+      clearTimeout(openTimer.current);
+      openTimer.current = null;
+    }
+    if (closeTimer.current) {
+      return;
+    }
+    if (closeDelayMs <= 0) {
+      setOpen(false);
+      return;
+    }
+    closeTimer.current = setTimeout(() => {
+      closeTimer.current = null;
+      setOpen(false);
+    }, closeDelayMs);
+  }, [closeDelayMs, setOpen]);
+  react.useEffect(() => () => cancelTimers(), [cancelTimers]);
+  const baseId = react.useId();
+  const triggerRef = react.useRef(null);
+  const contentRef = react.useRef(null);
+  const [triggerRect, setTriggerRect] = react.useState(null);
+  const measureTrigger = react.useCallback(() => {
+    const node = triggerRef.current;
+    if (!node || typeof node.getBoundingClientRect !== "function") {
+      return;
+    }
+    const rect = node.getBoundingClientRect();
+    setTriggerRect({ top: rect.top, left: rect.left, width: rect.width, height: rect.height });
+  }, []);
+  const ctxValue = {
+    open: current,
+    setOpen,
+    requestOpen,
+    requestClose,
+    cancelTimers,
+    contentId: `${baseId}-content`,
+    triggerRef,
+    contentRef,
+    triggerRect,
+    measureTrigger
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(TooltipContext.Provider, { value: ctxValue, children });
+}, "TooltipRoot");
+var TooltipTrigger = /* @__PURE__ */ __name(({ asChild = true, children, className, testID }) => {
+  const ctx = useTooltipContext("TooltipTrigger");
+  const handleMouseEnter = react.useCallback(() => {
+    ctx.measureTrigger();
+    ctx.requestOpen();
+  }, [ctx]);
+  const handleMouseLeave = react.useCallback(() => {
+    ctx.requestClose();
+  }, [ctx]);
+  const handleFocus = react.useCallback(() => {
+    ctx.measureTrigger();
+    ctx.requestOpen();
+  }, [ctx]);
+  const handleBlur = react.useCallback(() => {
+    ctx.requestClose();
+  }, [ctx]);
+  const handleLongPress = react.useCallback(() => {
+    ctx.measureTrigger();
+    ctx.setOpen(true);
+  }, [ctx]);
+  const handlePress = react.useCallback(() => {
+    if (reactNative.Platform.OS !== "web" && ctx.open) {
+      ctx.setOpen(false);
+    }
+  }, [ctx]);
+  if (asChild && react.isValidElement(children)) {
+    const child = children;
+    const compose = /* @__PURE__ */ __name((existing, next) => (event) => {
+      existing?.(event);
+      next(event);
+    }, "compose");
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Slot,
+      {
+        ref: (node) => {
+          ctx.triggerRef.current = node;
+        },
+        onMouseEnter: compose(child.props.onMouseEnter, handleMouseEnter),
+        onMouseLeave: compose(child.props.onMouseLeave, handleMouseLeave),
+        onFocus: compose(child.props.onFocus, handleFocus),
+        onBlur: compose(child.props.onBlur, handleBlur),
+        ...reactNative.Platform.OS !== "web" ? {
+          onLongPress: compose(
+            child.props.onLongPress,
+            handleLongPress
+          ),
+          onPress: compose(child.props.onPress, handlePress),
+          delayLongPress: LONG_PRESS_MS
+        } : {},
+        "aria-describedby": ctx.open ? ctx.contentId : void 0,
+        ...testID !== void 0 ? { "data-testid": testID } : {},
+        ...className !== void 0 ? { className } : {},
+        children: child
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    reactNative.Pressable,
+    {
+      ref: (node) => {
+        ctx.triggerRef.current = node;
+      },
+      ...reactNative.Platform.OS !== "web" ? { onLongPress: handleLongPress, onPress: handlePress, delayLongPress: LONG_PRESS_MS } : {},
+      ...{
+        onMouseEnter: handleMouseEnter,
+        onMouseLeave: handleMouseLeave,
+        onFocus: handleFocus,
+        onBlur: handleBlur,
+        "aria-describedby": ctx.open ? ctx.contentId : void 0
+      },
+      ...testID !== void 0 ? { testID } : {},
+      ...className !== void 0 ? { className } : {},
+      children: wrapStringChildren(children)
+    }
+  );
+}, "TooltipTrigger");
+function wrapStringChildren(children) {
+  if (typeof children === "string" || typeof children === "number") {
+    return /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { children });
+  }
+  return children;
+}
+__name(wrapStringChildren, "wrapStringChildren");
+var GAP = 4;
+var MIN_WIDTH = 0;
+function computePosition(rect, side, align, contentSize) {
+  const cw = contentSize?.width ?? MIN_WIDTH;
+  const ch = contentSize?.height ?? 0;
+  let top = 0;
+  let left = 0;
+  switch (side) {
+    case "top":
+      top = rect.top - GAP - ch;
+      break;
+    case "bottom":
+      top = rect.top + rect.height + GAP;
+      break;
+    case "left":
+      left = rect.left - GAP - cw;
+      break;
+    case "right":
+      left = rect.left + rect.width + GAP;
+      break;
+  }
+  if (side === "top" || side === "bottom") {
+    switch (align) {
+      case "start":
+        left = rect.left;
+        break;
+      case "center":
+        left = rect.left + rect.width / 2 - cw / 2;
+        break;
+      case "end":
+        left = rect.left + rect.width - cw;
+        break;
+    }
+  } else {
+    switch (align) {
+      case "start":
+        top = rect.top;
+        break;
+      case "center":
+        top = rect.top + rect.height / 2 - ch / 2;
+        break;
+      case "end":
+        top = rect.top + rect.height - ch;
+        break;
+    }
+  }
+  return { top, left };
+}
+__name(computePosition, "computePosition");
+var TooltipContent = /* @__PURE__ */ __name(({
+  side = "top",
+  align = "center",
+  children,
+  className,
+  testID
+}) => {
+  const ctx = useTooltipContext("TooltipContent");
+  const colors = useThemeColors();
+  const [contentSize, setContentSize] = react.useState(null);
+  const domRef = react.useRef(null);
+  const [entered, setEntered] = react.useState(false);
+  react.useEffect(() => {
+    if (!ctx.open) {
+      return;
+    }
+    if (reactNative.Platform.OS !== "web") {
+      return;
+    }
+    if (typeof document === "undefined") {
+      return;
+    }
+    ctx.measureTrigger();
+    const onKeyDown = /* @__PURE__ */ __name((event) => {
+      if (event.key === "Escape") {
+        event.preventDefault();
+        ctx.setOpen(false);
+      }
+    }, "onKeyDown");
+    const onResize = /* @__PURE__ */ __name(() => ctx.measureTrigger(), "onResize");
+    const onScroll = /* @__PURE__ */ __name(() => ctx.measureTrigger(), "onScroll");
+    document.addEventListener("keydown", onKeyDown);
+    window.addEventListener("resize", onResize);
+    window.addEventListener("scroll", onScroll, true);
+    return () => {
+      document.removeEventListener("keydown", onKeyDown);
+      window.removeEventListener("resize", onResize);
+      window.removeEventListener("scroll", onScroll, true);
+    };
+  }, [ctx.open, ctx.measureTrigger, ctx.setOpen]);
+  react.useEffect(() => {
+    if (!ctx.open) {
+      setContentSize(null);
+      setEntered(false);
+    }
+  }, [ctx.open]);
+  react.useEffect(() => {
+    if (reactNative.Platform.OS !== "web") {
+      return;
+    }
+    if (!ctx.open) {
+      return;
+    }
+    const node = domRef.current;
+    if (!node) {
+      return;
+    }
+    node.style.transformOrigin = "center";
+    node.style.transitionProperty = "opacity, transform";
+    node.style.transitionDuration = "100ms";
+    node.style.transitionTimingFunction = "ease-out";
+    node.style.opacity = entered ? "1" : "0";
+    node.style.transform = entered ? "scale(1)" : "scale(0.95)";
+  }, [ctx.open, entered]);
+  react.useEffect(() => {
+    if (reactNative.Platform.OS !== "web") {
+      return;
+    }
+    if (!ctx.open) {
+      return;
+    }
+    const id = requestAnimationFrame(() => setEntered(true));
+    return () => cancelAnimationFrame(id);
+  }, [ctx.open]);
+  if (!ctx.open) {
+    return null;
+  }
+  const position = ctx.triggerRect ? computePosition(ctx.triggerRect, side, align, contentSize) : null;
+  const contentBaseStyle = {
+    borderRadius: px(colors.radius.md),
+    backgroundColor: colors.semantic.text.default,
+    paddingVertical: px(colors.spacing["2"]) - 2,
+    // closest theme-rooted approximation of legacy 6
+    paddingHorizontal: px(colors.spacing["2"]),
+    ...reactNative.Platform.OS === "web" ? {
+      boxShadow: "0 4px 6px -2px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.06)"
+    } : { elevation: 4 }
+  };
+  const positionedStyle = reactNative.Platform.OS === "web" ? position ? {
+    position: "fixed",
+    top: position.top,
+    left: position.left,
+    zIndex: 60
+  } : {
+    // Trigger not yet measured — render off-screen for a
+    // frame to avoid a flash at (0,0).
+    position: "fixed",
+    top: -9999,
+    left: -9999,
+    zIndex: 60
+  } : {
+    // Native: rely on the parent allowing overflow. We anchor
+    // by absolute positioning relative to wherever the
+    // tooltip is mounted in the tree (typically right next
+    // to the trigger).
+    position: "absolute",
+    top: position?.top ?? 0,
+    left: position?.left ?? 0
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    reactNative.View,
+    {
+      ref: (node) => {
+        ctx.contentRef.current = node;
+        domRef.current = node;
+        if (reactNative.Platform.OS !== "web") {
+          return;
+        }
+        if (!node) {
+          return;
+        }
+        if (typeof node.getBoundingClientRect !== "function") {
+          return;
+        }
+        const rect = node.getBoundingClientRect();
+        if (!contentSize || contentSize.width !== rect.width || contentSize.height !== rect.height) {
+          setContentSize({ width: rect.width, height: rect.height });
+        }
+      },
+      ...{
+        role: "tooltip",
+        id: ctx.contentId,
+        // Don't soak up pointer events — hovering the tooltip
+        // itself should NOT block the trigger's mouse-leave from
+        // firing. Tooltips are presentational; if you need
+        // interactivity, reach for Popover.
+        pointerEvents: "none"
+      },
+      ...testID !== void 0 ? { testID } : {},
+      className: cn("rounded-md", className),
+      style: [contentBaseStyle, positionedStyle],
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        reactNative.Text,
+        {
+          className: "text-xs",
+          style: {
+            color: colors.semantic.text.inverted,
+            fontFamily: colors.fontFamily.body,
+            fontSize: px(colors.fontSize.sm),
+            lineHeight: px(colors.fontSize.sm) * Number(colors.lineHeight.tight)
+          },
+          children
+        }
+      )
+    }
+  );
+}, "TooltipContent");
+var Tooltip = Object.assign(TooltipRoot, {
+  Trigger: TooltipTrigger,
+  Content: TooltipContent
+});
+
+exports.Tooltip = Tooltip;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map