@nori-ui/core 0.0.5 → 1.0.2

package/dist/chunk-YNKKEO2A.js

@@ -0,0 +1,336 @@
+import { Slot } from './chunk-ZIBNLXIV.js';
+import { px } from './chunk-5A2QOOVN.js';
+import { cn } from './chunk-CHXHRJNZ.js';
+import { useThemeColors } from './chunk-R5JMDDCB.js';
+import { __name } from './chunk-WCQVDF3K.js';
+import { createContext, useState, useCallback, useId, useRef, useEffect, isValidElement, useContext } from 'react';
+import { Text, Platform, Dimensions, View, Modal, Pressable } from 'react-native';
+import { jsx } from 'nativewind/jsx-runtime';
+
+var PopoverContext = createContext(null);
+var usePopoverContext = /* @__PURE__ */ __name((label) => {
+  const ctx = useContext(PopoverContext);
+  if (!ctx) {
+    throw new Error(`<${label}> must be rendered inside a <Popover>.`);
+  }
+  return ctx;
+}, "usePopoverContext");
+var PopoverRoot = /* @__PURE__ */ __name(({ open, defaultOpen = false, onOpenChange, children }) => {
+  const [inner, setInner] = useState(defaultOpen);
+  const isControlled = open !== void 0;
+  const current = isControlled ? open : inner;
+  const setOpen = useCallback(
+    (next) => {
+      if (!isControlled) {
+        setInner(next);
+      }
+      onOpenChange?.(next);
+    },
+    [isControlled, onOpenChange]
+  );
+  const baseId = useId();
+  const triggerRef = useRef(null);
+  const contentRef = useRef(null);
+  const [triggerRect, setTriggerRect] = useState(null);
+  const measureTrigger = 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,
+    contentId: `${baseId}-content`,
+    triggerRef,
+    contentRef,
+    triggerRect,
+    measureTrigger
+  };
+  return /* @__PURE__ */ jsx(PopoverContext.Provider, { value: ctxValue, children });
+}, "PopoverRoot");
+var PopoverTrigger = /* @__PURE__ */ __name(({ asChild = true, children, className, testID }) => {
+  const ctx = usePopoverContext("PopoverTrigger");
+  const onPress = useCallback(() => {
+    ctx.measureTrigger();
+    ctx.setOpen(!ctx.open);
+  }, [ctx]);
+  if (asChild && isValidElement(children)) {
+    const child = children;
+    const fire = /* @__PURE__ */ __name((existing) => (event) => {
+      existing?.(event);
+      ctx.measureTrigger();
+      ctx.setOpen(!ctx.open);
+    }, "fire");
+    return /* @__PURE__ */ jsx(
+      Slot,
+      {
+        ref: (node) => {
+          ctx.triggerRef.current = node;
+        },
+        onClick: fire(child.props.onClick),
+        onPress: fire(child.props.onPress),
+        "aria-haspopup": "dialog",
+        "aria-expanded": ctx.open,
+        "aria-controls": ctx.contentId,
+        ...testID !== void 0 ? { "data-testid": testID } : {},
+        ...className !== void 0 ? { className } : {},
+        children: child
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    Pressable,
+    {
+      ref: (node) => {
+        ctx.triggerRef.current = node;
+      },
+      onPress,
+      ...{
+        "aria-haspopup": "dialog",
+        "aria-expanded": ctx.open,
+        "aria-controls": ctx.contentId
+      },
+      ...testID !== void 0 ? { testID } : {},
+      ...className !== void 0 ? { className } : {},
+      children: wrapStringChildren(children)
+    }
+  );
+}, "PopoverTrigger");
+function wrapStringChildren(children) {
+  if (typeof children === "string" || typeof children === "number") {
+    return /* @__PURE__ */ jsx(Text, { children });
+  }
+  return children;
+}
+__name(wrapStringChildren, "wrapStringChildren");
+var GAP = 4;
+var MIN_WIDTH = 200;
+var VIEWPORT_MARGIN = 8;
+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 PopoverContent = /* @__PURE__ */ __name(({
+  side = "bottom",
+  align = "center",
+  children,
+  className,
+  testID,
+  ...rest
+}) => {
+  const ctx = usePopoverContext("PopoverContent");
+  const colors = useThemeColors();
+  const ariaLabel = rest["aria-label"];
+  const [contentSize, setContentSize] = useState(null);
+  useEffect(() => {
+    if (!ctx.open) {
+      return;
+    }
+    if (Platform.OS !== "web") {
+      return;
+    }
+    if (typeof document === "undefined") {
+      return;
+    }
+    ctx.measureTrigger();
+    const onDocMouseDown = /* @__PURE__ */ __name((event) => {
+      const target = event.target;
+      const trigger = ctx.triggerRef.current;
+      const content2 = ctx.contentRef.current;
+      if (trigger?.contains(target)) {
+        return;
+      }
+      if (content2?.contains(target)) {
+        return;
+      }
+      ctx.setOpen(false);
+    }, "onDocMouseDown");
+    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("mousedown", onDocMouseDown);
+    document.addEventListener("keydown", onKeyDown);
+    window.addEventListener("resize", onResize);
+    window.addEventListener("scroll", onScroll, true);
+    return () => {
+      document.removeEventListener("mousedown", onDocMouseDown);
+      document.removeEventListener("keydown", onKeyDown);
+      window.removeEventListener("resize", onResize);
+      window.removeEventListener("scroll", onScroll, true);
+    };
+  }, [ctx.open, ctx.measureTrigger, ctx.setOpen, ctx.triggerRef, ctx.contentRef]);
+  useEffect(() => {
+    if (!ctx.open) {
+      setContentSize(null);
+    }
+  }, [ctx.open]);
+  if (!ctx.open) {
+    return null;
+  }
+  const position = ctx.triggerRect ? computePosition(ctx.triggerRect, side, align, contentSize) : null;
+  const viewportWidth = Dimensions.get("window").width;
+  const maxContentWidth = Math.max(MIN_WIDTH, viewportWidth - VIEWPORT_MARGIN * 2);
+  const contentBaseStyle = {
+    minWidth: MIN_WIDTH,
+    maxWidth: maxContentWidth,
+    borderRadius: px(colors.radius.lg),
+    borderWidth: 1,
+    borderColor: colors.semantic.border.default,
+    backgroundColor: colors.semantic.background.elevated,
+    padding: px(colors.spacing["4"]),
+    ...Platform.OS === "web" ? {
+      boxShadow: "0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1)",
+      // Subtle scale-in. Skipped on native (do nothing fancy there).
+      transition: "opacity 120ms ease-out, transform 120ms ease-out",
+      transform: "scale(1)",
+      opacity: 1
+    } : { elevation: 8 }
+  };
+  const measuredWidth = contentSize?.width ?? maxContentWidth;
+  const clampedLeft = position ? Math.min(
+    Math.max(VIEWPORT_MARGIN, position.left),
+    Math.max(VIEWPORT_MARGIN, viewportWidth - measuredWidth - VIEWPORT_MARGIN)
+  ) : 0;
+  const positionedStyle = Platform.OS === "web" ? position ? {
+    position: "fixed",
+    top: position.top,
+    left: clampedLeft,
+    zIndex: 50
+  } : {
+    // Trigger not yet measured — render off-screen for a
+    // frame to avoid a flash at (0,0).
+    position: "fixed",
+    top: -9999,
+    left: -9999,
+    zIndex: 50
+  } : {};
+  const content = /* @__PURE__ */ jsx(
+    View,
+    {
+      ref: (node) => {
+        ctx.contentRef.current = node;
+        if (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: "dialog",
+        id: ctx.contentId,
+        ...ariaLabel !== void 0 ? { "aria-label": ariaLabel, accessibilityLabel: ariaLabel } : {}
+      },
+      ...testID !== void 0 ? { testID } : {},
+      className: cn(
+        "rounded-lg border border-semantic-border-default bg-semantic-background-elevated",
+        className
+      ),
+      style: [contentBaseStyle, positionedStyle],
+      children
+    }
+  );
+  if (Platform.OS === "web") {
+    return content;
+  }
+  return /* @__PURE__ */ jsx(Modal, { visible: ctx.open, transparent: true, animationType: "fade", onRequestClose: () => ctx.setOpen(false), children: /* @__PURE__ */ jsx(
+    Pressable,
+    {
+      accessibilityRole: "none",
+      "aria-hidden": true,
+      onPress: () => ctx.setOpen(false),
+      style: {
+        position: "absolute",
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0,
+        backgroundColor: "transparent"
+      },
+      children: /* @__PURE__ */ jsx(
+        Pressable,
+        {
+          onPress: (event) => event.stopPropagation?.(),
+          style: {
+            position: "absolute",
+            top: ctx.triggerRect ? side === "top" ? Math.max(VIEWPORT_MARGIN, ctx.triggerRect.top - GAP - 80) : ctx.triggerRect.top + ctx.triggerRect.height + GAP : 80,
+            // Clamp horizontally so a wide popover near the
+            // right edge can still grow leftward without
+            // overflowing the screen.
+            left: ctx.triggerRect ? Math.min(
+              Math.max(VIEWPORT_MARGIN, ctx.triggerRect.left),
+              Math.max(VIEWPORT_MARGIN, viewportWidth - measuredWidth - VIEWPORT_MARGIN)
+            ) : VIEWPORT_MARGIN * 2
+          },
+          children: content
+        }
+      )
+    }
+  ) });
+}, "PopoverContent");
+var Popover = Object.assign(PopoverRoot, {
+  Trigger: PopoverTrigger,
+  Content: PopoverContent
+});
+
+export { Popover };
+//# sourceMappingURL=chunk-YNKKEO2A.js.map
+//# sourceMappingURL=chunk-YNKKEO2A.js.map

package/dist/chunk-YNKKEO2A.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Popover/Popover.tsx"],"names":["RNText","content"],"mappings":"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","file":"chunk-YNKKEO2A.js","sourcesContent":["'use client';\n\nimport {\n    createContext,\n    isValidElement,\n    type ReactElement,\n    type ReactNode,\n    useCallback,\n    useContext,\n    useEffect,\n    useId,\n    useRef,\n    useState,\n} from 'react';\nimport type { ViewStyle } from 'react-native';\nimport { Dimensions, Modal, Platform, Pressable, Text as RNText, View } from 'react-native';\nimport { Slot } from '../../slot';\nimport { px } from '../../theme/px';\nimport { useThemeColors } from '../../theme/use-theme-colors';\nimport { cn } from '../../utils/cn';\n\nexport type PopoverSide = 'top' | 'right' | 'bottom' | 'left';\nexport type PopoverAlign = 'start' | 'center' | 'end';\n\ntype TriggerRect = { top: number; left: number; width: number; height: number };\n\ntype PopoverContextValue = {\n    open: boolean;\n    setOpen: (next: boolean) => void;\n    contentId: string;\n    triggerRef: { current: HTMLElement | null };\n    contentRef: { current: HTMLDivElement | null };\n    triggerRect: TriggerRect | null;\n    measureTrigger: () => void;\n};\n\nconst PopoverContext = createContext<PopoverContextValue | null>(null);\n\nconst usePopoverContext = (label: string): PopoverContextValue => {\n    const ctx = useContext(PopoverContext);\n    if (!ctx) {\n        throw new Error(`<${label}> must be rendered inside a <Popover>.`);\n    }\n    return ctx;\n};\n\nexport type PopoverProps = {\n    /** Controlled open state. */\n    open?: boolean;\n    /** Uncontrolled initial open state. @defaultValue false */\n    defaultOpen?: boolean;\n    /** Fires with the new open state. */\n    onOpenChange?: (open: boolean) => void;\n    children?: ReactNode;\n};\n\n/**\n * Non-modal floating panel anchored to a trigger element. Use for help\n * tooltips with rich content, color pickers, or profile previews.\n *\n * Composition: `Popover` (root, owns open state), `PopoverTrigger`\n * (forwards events to its child via Slot when `asChild`), `PopoverContent`\n * (the floating surface).\n *\n * Differences from `Dialog`: non-modal — does NOT trap focus or lock\n * scroll. Tab moves outside as normal. Differences from `Tooltip`: can\n * contain interactive content (buttons, inputs, links) and dismisses on\n * outside-click + Escape rather than mouse-leave.\n *\n * Behavior:\n *   - Trigger click toggles open/close.\n *   - Click outside the content (and outside the trigger) closes.\n *   - Escape closes.\n *\n * Cross-platform: uses RN `<Modal>` as the visibility/portal primitive on\n * native (transparent backdrop, tap-outside-to-close). On web, the content\n * uses `position: fixed` + a measured trigger rect so it escapes any\n * ancestor `overflow: hidden`.\n */\nconst PopoverRoot = ({ open, defaultOpen = false, onOpenChange, children }: PopoverProps) => {\n    const [inner, setInner] = useState<boolean>(defaultOpen);\n    const isControlled = open !== undefined;\n    const current = isControlled ? open : inner;\n\n    const setOpen = useCallback(\n        (next: boolean) => {\n            if (!isControlled) {\n                setInner(next);\n            }\n            onOpenChange?.(next);\n        },\n        [isControlled, onOpenChange]\n    );\n\n    const baseId = useId();\n    const triggerRef = useRef<HTMLElement | null>(null);\n    const contentRef = useRef<HTMLDivElement | null>(null);\n\n    // Measure the trigger so the content can render with `position: fixed` +\n    // computed coords. position:fixed escapes any ancestor's overflow:hidden\n    // (e.g. fumadocs Tabs panes, our Preview frame), which is the single\n    // biggest source of \"the popup got cut off\" bugs.\n    const [triggerRect, setTriggerRect] = useState<TriggerRect | null>(null);\n    const measureTrigger = useCallback(() => {\n        const node = triggerRef.current;\n        if (!node || typeof node.getBoundingClientRect !== 'function') {\n            return;\n        }\n        const rect = node.getBoundingClientRect();\n        setTriggerRect({ top: rect.top, left: rect.left, width: rect.width, height: rect.height });\n    }, []);\n\n    const ctxValue: PopoverContextValue = {\n        open: current,\n        setOpen,\n        contentId: `${baseId}-content`,\n        triggerRef,\n        contentRef,\n        triggerRect,\n        measureTrigger,\n    };\n\n    return <PopoverContext.Provider value={ctxValue}>{children}</PopoverContext.Provider>;\n};\n\nexport type PopoverTriggerProps = {\n    /** Render the child as the trigger (Slot pattern). Default true — pass `false` for an inline pressable. */\n    asChild?: boolean;\n    children?: ReactNode;\n    className?: string;\n    testID?: string;\n};\n\n/**\n * Element that toggles the popover. Uses `asChild` by default so any\n * element (Button, Link, custom Pressable) becomes the trigger.\n *\n * The trigger element gets `aria-haspopup=\"dialog\"` and `aria-expanded`\n * so assistive tech announces the relationship.\n */\nexport const PopoverTrigger = ({ asChild = true, children, className, testID }: PopoverTriggerProps) => {\n    const ctx = usePopoverContext('PopoverTrigger');\n    const onPress = useCallback(() => {\n        ctx.measureTrigger();\n        ctx.setOpen(!ctx.open);\n    }, [ctx]);\n\n    if (asChild && isValidElement(children)) {\n        const child = children as ReactElement<Record<string, unknown>>;\n        // Pass both onClick (web HTML buttons) AND onPress (RN Pressable /\n        // our own Button) so the trigger fires regardless of which event\n        // model the wrapped child speaks. The child's existing handler\n        // runs first, then we toggle.\n        const fire = (existing: ((e: unknown) => void) | undefined) => (event: unknown) => {\n            existing?.(event);\n            ctx.measureTrigger();\n            ctx.setOpen(!ctx.open);\n        };\n        return (\n            <Slot\n                ref={(node: HTMLElement | null) => {\n                    ctx.triggerRef.current = node;\n                }}\n                onClick={fire(child.props.onClick as ((e: unknown) => void) | undefined)}\n                onPress={fire(child.props.onPress as ((e: unknown) => void) | undefined)}\n                aria-haspopup=\"dialog\"\n                aria-expanded={ctx.open}\n                aria-controls={ctx.contentId}\n                {...(testID !== undefined ? { 'data-testid': testID } : {})}\n                {...(className !== undefined ? { className } : {})}\n            >\n                {child}\n            </Slot>\n        );\n    }\n\n    return (\n        <Pressable\n            ref={(node) => {\n                ctx.triggerRef.current = node as unknown as HTMLElement | null;\n            }}\n            onPress={onPress}\n            {...({\n                'aria-haspopup': 'dialog',\n                'aria-expanded': ctx.open,\n                'aria-controls': ctx.contentId,\n            } as Record<string, unknown>)}\n            {...(testID !== undefined ? { testID } : {})}\n            {...(className !== undefined ? { className } : {})}\n        >\n            {wrapStringChildren(children)}\n        </Pressable>\n    );\n};\n\n// On native, raw strings rendered as children of a non-Text component\n// throw \"Text strings must be rendered within a <Text> component\". On\n// web, react-native-web silently tolerates it. Wrap any string/number\n// children in an RNText so the same JSX renders cleanly on both\n// platforms. Non-string children are passed through unchanged.\nfunction wrapStringChildren(children: ReactNode): ReactNode {\n    if (typeof children === 'string' || typeof children === 'number') {\n        return <RNText>{children}</RNText>;\n    }\n    return children;\n}\n\nconst GAP = 4; // visual gap between trigger and content\nconst MIN_WIDTH = 200;\n// Margin reserved on each side so the popover never butts against the\n// viewport edge. Matches the 8px safe-area we use for native modal pads.\nconst VIEWPORT_MARGIN = 8;\n\nfunction computePosition(\n    rect: TriggerRect,\n    side: PopoverSide,\n    align: PopoverAlign,\n    contentSize: { width: number; height: number } | null\n): { top: number; left: number } {\n    const cw = contentSize?.width ?? MIN_WIDTH;\n    const ch = contentSize?.height ?? 0;\n\n    let top = 0;\n    let left = 0;\n\n    switch (side) {\n        case 'top':\n            top = rect.top - GAP - ch;\n            break;\n        case 'bottom':\n            top = rect.top + rect.height + GAP;\n            break;\n        case 'left':\n            left = rect.left - GAP - cw;\n            break;\n        case 'right':\n            left = rect.left + rect.width + GAP;\n            break;\n    }\n\n    if (side === 'top' || side === 'bottom') {\n        switch (align) {\n            case 'start':\n                left = rect.left;\n                break;\n            case 'center':\n                left = rect.left + rect.width / 2 - cw / 2;\n                break;\n            case 'end':\n                left = rect.left + rect.width - cw;\n                break;\n        }\n    } else {\n        switch (align) {\n            case 'start':\n                top = rect.top;\n                break;\n            case 'center':\n                top = rect.top + rect.height / 2 - ch / 2;\n                break;\n            case 'end':\n                top = rect.top + rect.height - ch;\n                break;\n        }\n    }\n\n    return { top, left };\n}\n\nexport type PopoverContentProps = {\n    /** Side of the trigger to anchor on. @defaultValue 'bottom' */\n    side?: PopoverSide;\n    /** Alignment along the trigger edge. @defaultValue 'center' */\n    align?: PopoverAlign;\n    children?: ReactNode;\n    className?: string;\n    testID?: string;\n    /** Accessible label when no visible heading is present. */\n    'aria-label'?: string;\n};\n\n/**\n * The floating popover surface. Renders only while open. On web uses\n * `position: fixed` with a measured trigger rect so it escapes any\n * ancestor `overflow: hidden`. Non-modal: focus is NOT trapped inside —\n * the user can tab back out as normal.\n *\n * ARIA: `role=\"dialog\"` (without `aria-modal`) so assistive tech\n * announces it as a grouping but doesn't suppress the rest of the page.\n */\nexport const PopoverContent = ({\n    side = 'bottom',\n    align = 'center',\n    children,\n    className,\n    testID,\n    ...rest\n}: PopoverContentProps) => {\n    const ctx = usePopoverContext('PopoverContent');\n    const colors = useThemeColors();\n    const ariaLabel = rest['aria-label'];\n\n    // Measure content size after first paint so we can anchor `top`-style\n    // popups (which need to know content height to render above the trigger).\n    const [contentSize, setContentSize] = useState<{ width: number; height: number } | null>(null);\n\n    // Web-only side effects: outside-click close, Escape close, re-measure\n    // on resize. RN Modal handles its own dismissal on native (tap-outside\n    // is the transparent overlay's onPress).\n    useEffect(() => {\n        if (!ctx.open) {\n            return;\n        }\n        if (Platform.OS !== 'web') {\n            return;\n        }\n        if (typeof document === 'undefined') {\n            return;\n        }\n\n        ctx.measureTrigger();\n\n        const onDocMouseDown = (event: MouseEvent) => {\n            const target = event.target as Node;\n            const trigger = ctx.triggerRef.current;\n            const content = ctx.contentRef.current;\n            if (trigger?.contains(target)) {\n                return;\n            }\n            if (content?.contains(target)) {\n                return;\n            }\n            ctx.setOpen(false);\n        };\n        const onKeyDown = (event: KeyboardEvent) => {\n            if (event.key === 'Escape') {\n                event.preventDefault();\n                ctx.setOpen(false);\n            }\n        };\n        const onResize = () => ctx.measureTrigger();\n        const onScroll = () => ctx.measureTrigger();\n\n        document.addEventListener('mousedown', onDocMouseDown);\n        document.addEventListener('keydown', onKeyDown);\n        window.addEventListener('resize', onResize);\n        window.addEventListener('scroll', onScroll, true);\n        return () => {\n            document.removeEventListener('mousedown', onDocMouseDown);\n            document.removeEventListener('keydown', onKeyDown);\n            window.removeEventListener('resize', onResize);\n            window.removeEventListener('scroll', onScroll, true);\n        };\n        // ctx is the provider's stable identity; we only care about open transitions.\n    }, [ctx.open, ctx.measureTrigger, ctx.setOpen, ctx.triggerRef, ctx.contentRef]);\n\n    // Reset measured size when popover closes so reopening re-measures fresh.\n    useEffect(() => {\n        if (!ctx.open) {\n            setContentSize(null);\n        }\n    }, [ctx.open]);\n\n    if (!ctx.open) {\n        return null;\n    }\n\n    const position = ctx.triggerRect ? computePosition(ctx.triggerRect, side, align, contentSize) : null;\n\n    // Viewport-aware max width. Web uses Dimensions.get('window') which\n    // react-native-web maps to window.innerWidth; native uses the same API\n    // for the device window. Subtract margin on both sides so content\n    // doesn't kiss the screen edge.\n    const viewportWidth = Dimensions.get('window').width;\n    const maxContentWidth = Math.max(MIN_WIDTH, viewportWidth - VIEWPORT_MARGIN * 2);\n\n    const contentBaseStyle: ViewStyle = {\n        minWidth: MIN_WIDTH,\n        maxWidth: maxContentWidth,\n        borderRadius: px(colors.radius.lg),\n        borderWidth: 1,\n        borderColor: colors.semantic.border.default,\n        backgroundColor: colors.semantic.background.elevated,\n        padding: px(colors.spacing['4']),\n        ...(Platform.OS === 'web'\n            ? ({\n                  boxShadow: '0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1)',\n                  // Subtle scale-in. Skipped on native (do nothing fancy there).\n                  transition: 'opacity 120ms ease-out, transform 120ms ease-out',\n                  transform: 'scale(1)',\n                  opacity: 1,\n              } as ViewStyle)\n            : { elevation: 8 }),\n    };\n\n    // Clamp `left` so the popover stays within the viewport even when the\n    // trigger sits near the right edge. First-paint fallback uses\n    // `maxContentWidth` (the cap we apply via maxWidth above) — content\n    // is allowed to grow up to that size, so assuming worst-case avoids\n    // a one-frame overflow before measurement settles.\n    const measuredWidth = contentSize?.width ?? maxContentWidth;\n    const clampedLeft = position\n        ? Math.min(\n              Math.max(VIEWPORT_MARGIN, position.left),\n              Math.max(VIEWPORT_MARGIN, viewportWidth - measuredWidth - VIEWPORT_MARGIN)\n          )\n        : 0;\n\n    const positionedStyle: ViewStyle =\n        Platform.OS === 'web'\n            ? position\n                ? ({\n                      position: 'fixed' as unknown as 'absolute',\n                      top: position.top,\n                      left: clampedLeft,\n                      zIndex: 50,\n                  } as ViewStyle)\n                : ({\n                      // Trigger not yet measured — render off-screen for a\n                      // frame to avoid a flash at (0,0).\n                      position: 'fixed' as unknown as 'absolute',\n                      top: -9999,\n                      left: -9999,\n                      zIndex: 50,\n                  } as ViewStyle)\n            : {};\n\n    const content = (\n        <View\n            ref={(node) => {\n                ctx.contentRef.current = node as unknown as HTMLDivElement | null;\n                if (Platform.OS !== 'web') {\n                    return;\n                }\n                if (!node) {\n                    return;\n                }\n                if (typeof (node as unknown as HTMLDivElement).getBoundingClientRect !== 'function') {\n                    return;\n                }\n                const rect = (node as unknown as HTMLDivElement).getBoundingClientRect();\n                if (!contentSize || contentSize.width !== rect.width || contentSize.height !== rect.height) {\n                    setContentSize({ width: rect.width, height: rect.height });\n                }\n            }}\n            {...({\n                role: 'dialog',\n                id: ctx.contentId,\n                ...(ariaLabel !== undefined ? { 'aria-label': ariaLabel, accessibilityLabel: ariaLabel } : {}),\n            } as Record<string, unknown>)}\n            {...(testID !== undefined ? { testID } : {})}\n            className={cn(\n                'rounded-lg border border-semantic-border-default bg-semantic-background-elevated',\n                className\n            )}\n            style={[contentBaseStyle, positionedStyle]}\n        >\n            {children}\n        </View>\n    );\n\n    if (Platform.OS === 'web') {\n        return content;\n    }\n\n    // Native: use Modal as the floating layer with a transparent backdrop.\n    // Tap on the backdrop closes the popover.\n    return (\n        <Modal visible={ctx.open} transparent animationType=\"fade\" onRequestClose={() => ctx.setOpen(false)}>\n            <Pressable\n                accessibilityRole=\"none\"\n                aria-hidden={true}\n                onPress={() => ctx.setOpen(false)}\n                style={{\n                    position: 'absolute',\n                    top: 0,\n                    left: 0,\n                    right: 0,\n                    bottom: 0,\n                    backgroundColor: 'transparent',\n                }}\n            >\n                <Pressable\n                    onPress={(event) => event.stopPropagation?.()}\n                    style={{\n                        position: 'absolute',\n                        top: ctx.triggerRect\n                            ? side === 'top'\n                                ? Math.max(VIEWPORT_MARGIN, ctx.triggerRect.top - GAP - 80)\n                                : ctx.triggerRect.top + ctx.triggerRect.height + GAP\n                            : 80,\n                        // Clamp horizontally so a wide popover near the\n                        // right edge can still grow leftward without\n                        // overflowing the screen.\n                        left: ctx.triggerRect\n                            ? Math.min(\n                                  Math.max(VIEWPORT_MARGIN, ctx.triggerRect.left),\n                                  Math.max(VIEWPORT_MARGIN, viewportWidth - measuredWidth - VIEWPORT_MARGIN)\n                              )\n                            : VIEWPORT_MARGIN * 2,\n                    }}\n                >\n                    {content}\n                </Pressable>\n            </Pressable>\n        </Modal>\n    );\n};\n\n/**\n * Public `Popover` value — the root function plus its `.Trigger` and `.Content`\n * static members. `Object.assign` produces a value whose inferred type carries\n * the static properties, so `.d.ts` consumers can write `<Popover.Trigger>`\n * without a separate import.\n */\nexport const Popover = Object.assign(PopoverRoot, {\n    Trigger: PopoverTrigger,\n    Content: PopoverContent,\n});\n"]}

package/dist/chunk-ZBW3BA5R.js

@@ -0,0 +1,148 @@
+import { useAnimatedNumber } from './chunk-RB3YBWQ4.js';
+import { AnimatedView } from './chunk-RGJ3NBKE.js';
+import { Slot } from './chunk-ZIBNLXIV.js';
+import { px } from './chunk-5A2QOOVN.js';
+import { cn } from './chunk-CHXHRJNZ.js';
+import { useThemeColors } from './chunk-R5JMDDCB.js';
+import { __name } from './chunk-WCQVDF3K.js';
+import { useState, useCallback } from 'react';
+import { Pressable, View, Text } from 'react-native';
+import { jsx, jsxs } from 'nativewind/jsx-runtime';
+
+var ROW_LAYOUT_BASE = { flexDirection: "row", alignItems: "center" };
+var TRACK_BASE = {
+  width: 40,
+  height: 24,
+  borderRadius: 12,
+  // Relative so the absolutely-positioned thumb anchors against the
+  // track (not the page). The thumb's `left` value transitions between
+  // 2 (off) and 18 (on) — see thumb style below.
+  position: "relative"
+};
+var THUMB_BASE_STYLE = {
+  width: 20,
+  height: 20,
+  borderRadius: 10,
+  // Web: boxShadow (the modern CSS-style replacement for the legacy RN
+  // `shadow*` props that react-native-web has deprecated).
+  // Native: elevation (Android) — RN ignores boxShadow there.
+  ...{ boxShadow: "0 1px 2px rgba(0, 0, 0, 0.15)" },
+  elevation: 2
+};
+var Switch = /* @__PURE__ */ __name(({
+  checked,
+  defaultChecked = false,
+  disabled,
+  onChange,
+  label,
+  className,
+  testID,
+  asChild,
+  children
+}) => {
+  const colors = useThemeColors();
+  const [inner, setInner] = useState(defaultChecked);
+  const isControlled = checked !== void 0;
+  const value = isControlled ? Boolean(checked) : inner;
+  const slide = useAnimatedNumber("left", value ? 18 : 2);
+  const toggle = useCallback(() => {
+    if (disabled) {
+      return;
+    }
+    const next = !value;
+    if (!isControlled) {
+      setInner(next);
+    }
+    onChange?.(next);
+  }, [disabled, value, isControlled, onChange]);
+  const ariaChecked = value ? "true" : "false";
+  const commonProps = {
+    role: "switch",
+    "aria-checked": ariaChecked,
+    accessibilityRole: "switch",
+    accessibilityState: { checked: value, disabled: Boolean(disabled) },
+    testID
+  };
+  if (disabled) {
+    commonProps["aria-disabled"] = true;
+  }
+  if (label !== void 0) {
+    commonProps["aria-label"] = label;
+    commonProps.accessibilityLabel = label;
+  }
+  if (asChild) {
+    const slotProps = {
+      role: "switch",
+      "aria-checked": ariaChecked,
+      onClick: toggle
+    };
+    if (disabled) {
+      slotProps["aria-disabled"] = true;
+    }
+    if (label !== void 0) {
+      slotProps["aria-label"] = label;
+    }
+    if (testID !== void 0) {
+      slotProps["data-testid"] = testID;
+    }
+    if (className !== void 0) {
+      slotProps.className = className;
+    }
+    return /* @__PURE__ */ jsx(Slot, { ...slotProps, children });
+  }
+  const trackClasses = cn(
+    "w-10 h-6 rounded-full justify-center px-0.5 transition-colors",
+    value ? "bg-semantic-interactive-primary" : "bg-neutral-300 dark:bg-neutral-700",
+    disabled ? "opacity-60" : void 0
+  );
+  const thumbClasses = cn("w-5 h-5 rounded-full bg-white dark:bg-neutral-100 shadow-sm");
+  const trackStyle = [
+    TRACK_BASE,
+    {
+      backgroundColor: value ? colors.semantic.interactive.primary : colors.color.neutral["600"],
+      // Subtle 180ms color transition between off → on. Web only;
+      // native has no equivalent for the track tint in v1.
+      ...{ transitionProperty: "background-color", transitionDuration: "180ms" }
+    },
+    disabled ? { opacity: 0.6 } : null
+  ];
+  const thumbStyle = [
+    THUMB_BASE_STYLE,
+    {
+      backgroundColor: colors.color.neutral["50"],
+      position: "absolute",
+      top: 2
+    },
+    slide
+  ];
+  const rowStyle = { ...ROW_LAYOUT_BASE, gap: px(colors.spacing["2"]) };
+  return /* @__PURE__ */ jsxs(
+    Pressable,
+    {
+      onPress: toggle,
+      ...commonProps,
+      className: cn("flex-row items-center gap-2", className),
+      style: rowStyle,
+      children: [
+        /* @__PURE__ */ jsx(View, { className: trackClasses, style: trackStyle, children: /* @__PURE__ */ jsx(AnimatedView, { className: thumbClasses, style: thumbStyle }) }),
+        label ? /* @__PURE__ */ jsx(
+          Text,
+          {
+            className: "text-md text-semantic-text-default",
+            style: {
+              color: colors.semantic.text.default,
+              fontFamily: colors.fontFamily.body,
+              fontSize: px(colors.fontSize.md)
+            },
+            children: label
+          }
+        ) : null,
+        children
+      ]
+    }
+  );
+}, "Switch");
+
+export { Switch };
+//# sourceMappingURL=chunk-ZBW3BA5R.js.map
+//# sourceMappingURL=chunk-ZBW3BA5R.js.map

package/dist/chunk-ZBW3BA5R.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Switch/Switch.tsx"],"names":["RNText"],"mappings":"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","file":"chunk-ZBW3BA5R.js","sourcesContent":["'use client';\n\nimport type { ReactNode } from 'react';\nimport { useCallback, useState } from 'react';\nimport type { ViewStyle } from 'react-native';\nimport { Pressable, Text as RNText, View } from 'react-native';\nimport { AnimatedView } from '../../animation/animated-view';\nimport { useAnimatedNumber } from '../../animation/use-animated-number';\nimport { Slot } from '../../slot';\nimport { px } from '../../theme/px';\nimport { useThemeColors } from '../../theme/use-theme-colors';\nimport { cn } from '../../utils/cn';\n\nexport type SwitchProps = {\n    checked?: boolean;\n    defaultChecked?: boolean;\n    disabled?: boolean;\n    onChange?: (next: boolean) => void;\n    label?: string;\n    className?: string;\n    testID?: string;\n    asChild?: boolean;\n    children?: ReactNode;\n};\n\n// Layout-only base; row gap is theme-driven inside the component.\nconst ROW_LAYOUT_BASE: ViewStyle = { flexDirection: 'row', alignItems: 'center' };\n// Switch track + thumb are tightly coupled — width 40, height 24, thumb\n// 20×20, travel 18px. Component-density literals — not from theme.\nconst TRACK_BASE: ViewStyle = {\n    width: 40,\n    height: 24,\n    borderRadius: 12,\n    // Relative so the absolutely-positioned thumb anchors against the\n    // track (not the page). The thumb's `left` value transitions between\n    // 2 (off) and 18 (on) — see thumb style below.\n    position: 'relative',\n};\nconst THUMB_BASE_STYLE: ViewStyle = {\n    width: 20,\n    height: 20,\n    borderRadius: 10,\n    // Web: boxShadow (the modern CSS-style replacement for the legacy RN\n    // `shadow*` props that react-native-web has deprecated).\n    // Native: elevation (Android) — RN ignores boxShadow there.\n    ...({ boxShadow: '0 1px 2px rgba(0, 0, 0, 0.15)' } as ViewStyle),\n    elevation: 2,\n};\n\n/**\n * Switch — a toggle control with role=\"switch\". Supports controlled + uncontrolled,\n * disabled state, asChild (via Slot), and a visible label that doubles as the\n * accessibility label.\n */\nexport const Switch = ({\n    checked,\n    defaultChecked = false,\n    disabled,\n    onChange,\n    label,\n    className,\n    testID,\n    asChild,\n    children,\n}: SwitchProps) => {\n    const colors = useThemeColors();\n    const [inner, setInner] = useState<boolean>(defaultChecked);\n    const isControlled = checked !== undefined;\n    const value = isControlled ? Boolean(checked) : inner;\n    // Pulled up here (above the asChild early-return) so the hook is\n    // called on every render path, not conditionally. The slide isn't\n    // used in the asChild branch, but the wasted work is tiny.\n    const slide = useAnimatedNumber('left', value ? 18 : 2);\n\n    const toggle = useCallback(() => {\n        if (disabled) {\n            return;\n        }\n        const next = !value;\n        if (!isControlled) {\n            setInner(next);\n        }\n        onChange?.(next);\n    }, [disabled, value, isControlled, onChange]);\n\n    const ariaChecked: 'true' | 'false' = value ? 'true' : 'false';\n\n    const commonProps: Record<string, unknown> = {\n        role: 'switch',\n        'aria-checked': ariaChecked,\n        accessibilityRole: 'switch' as const,\n        accessibilityState: { checked: value, disabled: Boolean(disabled) },\n        testID,\n    };\n    if (disabled) {\n        commonProps['aria-disabled'] = true;\n    }\n    if (label !== undefined) {\n        commonProps['aria-label'] = label;\n        commonProps.accessibilityLabel = label;\n    }\n\n    if (asChild) {\n        const slotProps: Record<string, unknown> = {\n            role: 'switch',\n            'aria-checked': ariaChecked,\n            onClick: toggle,\n        };\n        if (disabled) {\n            slotProps['aria-disabled'] = true;\n        }\n        if (label !== undefined) {\n            slotProps['aria-label'] = label;\n        }\n        if (testID !== undefined) {\n            slotProps['data-testid'] = testID;\n        }\n        if (className !== undefined) {\n            slotProps.className = className;\n        }\n        return <Slot {...slotProps}>{children}</Slot>;\n    }\n\n    const trackClasses = cn(\n        'w-10 h-6 rounded-full justify-center px-0.5 transition-colors',\n        value ? 'bg-semantic-interactive-primary' : 'bg-neutral-300 dark:bg-neutral-700',\n        disabled ? 'opacity-60' : undefined\n    );\n    // Position is set inline below (absolute + animated `left`), so no\n    // self-start/self-end classes here — they'd fight the inline position.\n    const thumbClasses = cn('w-5 h-5 rounded-full bg-white dark:bg-neutral-100 shadow-sm');\n\n    const trackStyle = [\n        TRACK_BASE,\n        {\n            backgroundColor: value ? colors.semantic.interactive.primary : colors.color.neutral['600'],\n            // Subtle 180ms color transition between off → on. Web only;\n            // native has no equivalent for the track tint in v1.\n            ...({ transitionProperty: 'background-color', transitionDuration: '180ms' } as ViewStyle),\n        },\n        disabled ? { opacity: 0.6 } : null,\n    ];\n    // Thumb stays a near-white disc — we deliberately don't go to a dark\n    // grey on dark mode because the thumb needs to read as the \"moveable\n    // puck\" against the track in both schemes.\n    //\n    // Animation: thumb slides between left:2 (off) and left:18 (on) —\n    // track width 40 - padding 2 - thumb 20 = 18 px travel. The\n    // useAnimatedNumber hook picks the right engine per platform (web\n    // CSS transition / reanimated spring / RN Animated). The hook is\n    // called once at the top of the function — see the `slide` above.\n    const thumbStyle = [\n        THUMB_BASE_STYLE,\n        {\n            backgroundColor: colors.color.neutral['50'],\n            position: 'absolute' as const,\n            top: 2,\n        } as ViewStyle,\n        slide as ViewStyle,\n    ];\n\n    // Whole-row Pressable so clicking the label toggles the switch. The\n    // visible track is a non-interactive View — one role=\"switch\" per\n    // logical control, not two competing hit-areas.\n    const rowStyle: ViewStyle = { ...ROW_LAYOUT_BASE, gap: px(colors.spacing['2']) };\n\n    return (\n        <Pressable\n            onPress={toggle}\n            {...commonProps}\n            className={cn('flex-row items-center gap-2', className)}\n            style={rowStyle}\n        >\n            <View className={trackClasses} style={trackStyle}>\n                {/*\n                 * Animated.View — the slide style fragment from\n                 * `useAnimatedNumber` contains an `Animated.Value` on\n                 * native; a plain `View` would render the value as 0\n                 * (no animation). On web, the same fragment is plain\n                 * CSS and `Animated.View` falls through to a regular\n                 * div via react-native-web.\n                 */}\n                <AnimatedView className={thumbClasses} style={thumbStyle} />\n            </View>\n            {label ? (\n                <RNText\n                    className=\"text-md text-semantic-text-default\"\n                    style={{\n                        color: colors.semantic.text.default,\n                        fontFamily: colors.fontFamily.body,\n                        fontSize: px(colors.fontSize.md),\n                    }}\n                >\n                    {label}\n                </RNText>\n            ) : null}\n            {children}\n        </Pressable>\n    );\n};\n"]}

package/dist/{chunk-FXKIWONG.js → chunk-ZIBNLXIV.js}

@@ -1,11 +1,13 @@
-import { __name } from './chunk-7QVYU63E.js';
+import { __name } from './chunk-WCQVDF3K.js';
 import { forwardRef, isValidElement, Children, cloneElement } from 'react';
 
 // src/slot/compose-refs.ts
 function composeRefs(...refs) {
   return (node) => {
     for (const ref of refs) {
-      if (ref == null) continue;
+      if (ref == null) {
+        continue;
+      }
       if (typeof ref === "function") {
         ref(node);
       } else {
@@ -62,8 +64,12 @@ function joinClass(outer, inner) {
 }
 __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;
+  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");
@@ -76,5 +82,5 @@ function composeHandlers(outer, inner) {
 __name(composeHandlers, "composeHandlers");
 
 export { Slot, composeRefs };
-//# sourceMappingURL=chunk-FXKIWONG.js.map
-//# sourceMappingURL=chunk-FXKIWONG.js.map
+//# sourceMappingURL=chunk-ZIBNLXIV.js.map
+//# sourceMappingURL=chunk-ZIBNLXIV.js.map

package/dist/chunk-ZIBNLXIV.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/slot/compose-refs.ts","../src/slot/slot.tsx"],"names":["Slot"],"mappings":"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","file":"chunk-ZIBNLXIV.js","sourcesContent":["// composeRefs — merges multiple React refs (callback or object) into a single callback.\n// Derived from Radix UI's approach; reimplemented here so we don't take a Radix dependency.\n\nimport type { MutableRefObject, Ref, RefCallback } from 'react';\n\ntype PossibleRef<T> = Ref<T> | undefined;\n\nexport function composeRefs<T>(...refs: Array<PossibleRef<T>>): RefCallback<T> {\n    return (node: T | null) => {\n        for (const ref of refs) {\n            if (ref == null) {\n                continue;\n            }\n            if (typeof ref === 'function') {\n                ref(node);\n            } else {\n                // React's MutableRefObject typing — we assign .current directly.\n                (ref as MutableRefObject<T | null>).current = node;\n            }\n        }\n    };\n}\n","import type { CSSProperties, ReactElement, Ref } from 'react';\nimport { Children, cloneElement, forwardRef, isValidElement } from 'react';\nimport { composeRefs } from './compose-refs';\n\ntype AnyProps = Record<string, unknown>;\n\nexport type SlotProps = {\n    children?: React.ReactNode;\n} & AnyProps;\n\nexport const Slot = forwardRef<unknown, SlotProps>(function Slot(props, forwardedRef) {\n    const { children, ...slotProps } = props;\n\n    if (!isValidElement(children)) {\n        return null;\n    }\n\n    // Assert that children is a single React element with props — we've narrowed above.\n    const child = Children.only(children) as ReactElement<AnyProps> & { ref?: Ref<unknown> };\n    const merged = mergeProps(slotProps, child.props);\n\n    // Merge refs: Slot's forwarded ref + the child's own ref (if any).\n    const childRef = (child as unknown as { ref?: Ref<unknown> }).ref;\n    if (forwardedRef || childRef) {\n        (merged as AnyProps).ref = composeRefs(forwardedRef, childRef);\n    }\n\n    return cloneElement(child, merged);\n});\nSlot.displayName = 'Slot';\n\nfunction mergeProps(outer: AnyProps, inner: AnyProps): AnyProps {\n    // Inner (child) wins for everything except: className (concatenated), style (merged), and\n    // event handlers (composed — outer runs first, then inner).\n    const merged: AnyProps = { ...outer };\n\n    for (const key of Object.keys(inner)) {\n        const outerValue = outer[key];\n        const innerValue = inner[key];\n\n        if (key === 'className' || key === 'class') {\n            merged[key] = joinClass(outerValue, innerValue);\n            continue;\n        }\n\n        if (key === 'style') {\n            merged[key] = {\n                ...(outerValue as CSSProperties | undefined),\n                ...(innerValue as CSSProperties | undefined),\n            };\n            continue;\n        }\n\n        if (isEventHandler(key, outerValue, innerValue)) {\n            merged[key] = composeHandlers(outerValue as Fn, innerValue as Fn);\n            continue;\n        }\n\n        merged[key] = innerValue;\n    }\n\n    return merged;\n}\n\nfunction joinClass(outer: unknown, inner: unknown): string | undefined {\n    const a = typeof outer === 'string' ? outer : '';\n    const b = typeof inner === 'string' ? inner : '';\n    const joined = [a, b].filter(Boolean).join(' ');\n    return joined.length > 0 ? joined : undefined;\n}\n\ntype Fn = (...args: unknown[]) => unknown;\n\nfunction isEventHandler(key: string, outer: unknown, inner: unknown): boolean {\n    if (!key.startsWith('on') || key.length < 3) {\n        return false;\n    }\n    if (key[2] !== key[2]?.toUpperCase()) {\n        return false;\n    }\n    return typeof outer === 'function' && typeof inner === 'function';\n}\n\nfunction composeHandlers(outer: Fn, inner: Fn): Fn {\n    return (...args: unknown[]) => {\n        outer(...args);\n        inner(...args);\n    };\n}\n"]}