@nori-ui/core 0.0.5 → 1.0.2

package/dist/chunk-XALU6LOT.js

@@ -0,0 +1,306 @@
+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, useId, useState, useRef, useCallback, useMemo, useEffect, useContext } from 'react';
+import { View, Pressable, Text } from 'react-native';
+import { jsx } from 'nativewind/jsx-runtime';
+
+var TabsContext = createContext(null);
+var useTabsContext = /* @__PURE__ */ __name((label) => {
+  const ctx = useContext(TabsContext);
+  if (!ctx) {
+    throw new Error(`<${label}> must be rendered inside a <Tabs>.`);
+  }
+  return ctx;
+}, "useTabsContext");
+var TabsRoot = /* @__PURE__ */ __name(({
+  value,
+  defaultValue,
+  onChange,
+  orientation = "horizontal",
+  activation = "automatic",
+  children,
+  className,
+  testID
+}) => {
+  const baseId = useId();
+  const [inner, setInner] = useState(defaultValue);
+  const isControlled = value !== void 0;
+  const current = isControlled ? value : inner;
+  const refs = useRef(/* @__PURE__ */ new Map());
+  const orderRef = useRef([]);
+  const setValue = useCallback(
+    (next) => {
+      if (!isControlled) {
+        setInner(next);
+      }
+      onChange?.(next);
+    },
+    [isControlled, onChange]
+  );
+  const register = useCallback((v, ref) => {
+    refs.current.set(v, ref);
+    if (!orderRef.current.includes(v)) {
+      orderRef.current.push(v);
+    }
+  }, []);
+  const unregister = useCallback((v) => {
+    refs.current.delete(v);
+    orderRef.current = orderRef.current.filter((x) => x !== v);
+  }, []);
+  const focusValue = useCallback(
+    (next) => {
+      const ref = refs.current.get(next);
+      ref?.current?.focus?.();
+      if (activation === "automatic") {
+        setValue(next);
+      }
+    },
+    [activation, setValue]
+  );
+  const moveFocus = useCallback(
+    (offset, fromValue) => {
+      const order = orderRef.current;
+      if (order.length === 0) {
+        return;
+      }
+      const idx = order.indexOf(fromValue);
+      const start = idx === -1 ? 0 : idx;
+      const len = order.length;
+      const next = order[(start + offset + len) % len];
+      if (next) {
+        focusValue(next);
+      }
+    },
+    [focusValue]
+  );
+  const focusEdge = useCallback(
+    (edge) => {
+      const order = orderRef.current;
+      if (order.length === 0) {
+        return;
+      }
+      const target = edge === "first" ? order[0] : order[order.length - 1];
+      if (target) {
+        focusValue(target);
+      }
+    },
+    [focusValue]
+  );
+  const ctxValue = useMemo(
+    () => ({
+      value: current,
+      setValue,
+      baseId,
+      orientation,
+      activation,
+      register,
+      unregister,
+      moveFocus,
+      focusEdge
+    }),
+    [current, setValue, baseId, orientation, activation, register, unregister, moveFocus, focusEdge]
+  );
+  return /* @__PURE__ */ jsx(TabsContext.Provider, { value: ctxValue, children: /* @__PURE__ */ jsx(
+    TabsViewport,
+    {
+      orientation,
+      ...className !== void 0 ? { className } : {},
+      ...testID !== void 0 ? { testID } : {},
+      children
+    }
+  ) });
+}, "TabsRoot");
+var TabsViewport = /* @__PURE__ */ __name(({
+  orientation,
+  className,
+  testID,
+  children
+}) => {
+  const colors = useThemeColors();
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      ...testID !== void 0 ? { testID } : {},
+      className: cn(orientation === "vertical" ? "flex-row gap-4" : "flex-col gap-3", className),
+      style: orientation === "vertical" ? { flexDirection: "row", gap: px(colors.spacing["4"]) } : { flexDirection: "column", gap: px(colors.spacing["3"]) },
+      children
+    }
+  );
+}, "TabsViewport");
+var LIST_LAYOUT_BASE = {
+  flexDirection: "row",
+  alignItems: "center",
+  borderBottomWidth: 1
+};
+var LIST_VERTICAL_LAYOUT_BASE = {
+  flexDirection: "column",
+  alignItems: "stretch",
+  borderRightWidth: 1
+};
+var TabsList = /* @__PURE__ */ __name(({ children, className, testID }) => {
+  const ctx = useTabsContext("TabsList");
+  const colors = useThemeColors();
+  const gap = px(colors.spacing["1"]);
+  const listStyle = ctx.orientation === "vertical" ? { ...LIST_VERTICAL_LAYOUT_BASE, gap, borderRightColor: colors.semantic.border.default } : { ...LIST_LAYOUT_BASE, gap, borderBottomColor: colors.semantic.border.default };
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      ...testID !== void 0 ? { testID } : {},
+      role: "tablist",
+      accessibilityRole: "tablist",
+      "aria-orientation": ctx.orientation,
+      className: cn(
+        ctx.orientation === "vertical" ? "flex-col gap-1 border-r border-semantic-border-default" : "flex-row items-center gap-1 border-b border-semantic-border-default",
+        className
+      ),
+      style: listStyle,
+      children
+    }
+  );
+}, "TabsList");
+var TRIGGER_TRANSITION = {
+  transitionProperty: "border-color, color",
+  transitionDuration: "200ms",
+  transitionTimingFunction: "ease"
+};
+var TRIGGER_LAYOUT_BASE = {
+  borderBottomWidth: 2,
+  borderBottomColor: "transparent",
+  marginBottom: -1,
+  ...TRIGGER_TRANSITION
+};
+var TRIGGER_LAYOUT_BASE_VERTICAL = {
+  borderRightWidth: 2,
+  borderRightColor: "transparent",
+  marginRight: -1,
+  ...TRIGGER_TRANSITION
+};
+var TabsTrigger = /* @__PURE__ */ __name(({ value, disabled, children, className, testID }) => {
+  const ctx = useTabsContext("TabsTrigger");
+  const colors = useThemeColors();
+  const ownRef = useRef(null);
+  const selected = ctx.value === value;
+  const isVertical = ctx.orientation === "vertical";
+  useEffect(() => {
+    ctx.register(value, ownRef);
+    return () => ctx.unregister(value);
+  }, [ctx, value]);
+  const onPress = useCallback(() => {
+    if (disabled) {
+      return;
+    }
+    ctx.setValue(value);
+  }, [ctx, value, disabled]);
+  const handleKeyDown = useCallback(
+    (event) => {
+      const nextKey = isVertical ? "ArrowDown" : "ArrowRight";
+      const prevKey = isVertical ? "ArrowUp" : "ArrowLeft";
+      switch (event.key) {
+        case nextKey:
+          event.preventDefault();
+          ctx.moveFocus(1, value);
+          return;
+        case prevKey:
+          event.preventDefault();
+          ctx.moveFocus(-1, value);
+          return;
+        case "Home":
+          event.preventDefault();
+          ctx.focusEdge("first");
+          return;
+        case "End":
+          event.preventDefault();
+          ctx.focusEdge("last");
+          return;
+        case "Enter":
+        case " ": {
+          if (ctx.activation === "manual") {
+            event.preventDefault();
+            if (!disabled) {
+              ctx.setValue(value);
+            }
+          }
+          return;
+        }
+      }
+    },
+    [ctx, value, disabled, isVertical]
+  );
+  const accentStyle = selected ? isVertical ? { borderRightColor: colors.semantic.interactive.primary } : { borderBottomColor: colors.semantic.interactive.primary } : null;
+  const triggerProps = {
+    ref: /* @__PURE__ */ __name((node) => {
+      ownRef.current = node;
+    }, "ref"),
+    role: "tab",
+    accessibilityRole: "tab",
+    "aria-selected": selected,
+    "aria-controls": `${ctx.baseId}-panel-${value}`,
+    id: `${ctx.baseId}-tab-${value}`,
+    tabIndex: selected ? 0 : -1,
+    onPress,
+    onKeyDown: handleKeyDown,
+    ...disabled ? { "aria-disabled": true, disabled: true } : {},
+    ...testID !== void 0 ? { testID } : {}
+  };
+  const triggerPadding = {
+    paddingHorizontal: px(colors.spacing["3"]),
+    paddingVertical: px(colors.spacing["2"])
+  };
+  const triggerStyle = isVertical ? { ...TRIGGER_LAYOUT_BASE_VERTICAL, ...triggerPadding } : { ...TRIGGER_LAYOUT_BASE, ...triggerPadding };
+  return /* @__PURE__ */ jsx(
+    Pressable,
+    {
+      ...triggerProps,
+      className: cn(
+        isVertical ? "px-3 py-2 -mr-px border-r-2 border-r-transparent" : "px-3 py-2 -mb-px border-b-2 border-b-transparent",
+        selected ? "border-r-semantic-interactive-primary" : "",
+        disabled ? "opacity-50" : "opacity-100",
+        className
+      ),
+      style: [triggerStyle, accentStyle, disabled ? { opacity: 0.5 } : null],
+      children: typeof children === "string" ? /* @__PURE__ */ jsx(
+        Text,
+        {
+          style: {
+            color: selected ? colors.semantic.interactive.primary : colors.semantic.text.muted,
+            fontFamily: colors.fontFamily.body,
+            fontSize: px(colors.fontSize.sm),
+            fontWeight: selected ? colors.fontWeight.semibold : colors.fontWeight.medium
+          },
+          children
+        }
+      ) : children
+    }
+  );
+}, "TabsTrigger");
+var TabsContent = /* @__PURE__ */ __name(({ value, children, className, testID }) => {
+  const ctx = useTabsContext("TabsContent");
+  const active = ctx.value === value;
+  if (!active) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      ...testID !== void 0 ? { testID } : {},
+      role: "tabpanel",
+      accessibilityRole: "none",
+      id: `${ctx.baseId}-panel-${value}`,
+      "aria-labelledby": `${ctx.baseId}-tab-${value}`,
+      tabIndex: 0,
+      className: cn("outline-none", className),
+      children
+    }
+  );
+}, "TabsContent");
+var Tabs = Object.assign(TabsRoot, {
+  List: TabsList,
+  Trigger: TabsTrigger,
+  Content: TabsContent
+});
+
+export { Tabs };
+//# sourceMappingURL=chunk-XALU6LOT.js.map
+//# sourceMappingURL=chunk-XALU6LOT.js.map

package/dist/chunk-XALU6LOT.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Tabs/Tabs.tsx"],"names":["RNText"],"mappings":"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","file":"chunk-XALU6LOT.js","sourcesContent":["'use client';\n\nimport {\n    createContext,\n    type KeyboardEvent,\n    type ReactNode,\n    type RefObject,\n    useCallback,\n    useContext,\n    useEffect,\n    useId,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport type { ViewStyle } from 'react-native';\nimport { Pressable, Text as RNText, View } from 'react-native';\nimport { px } from '../../theme/px';\nimport { useThemeColors } from '../../theme/use-theme-colors';\nimport { cn } from '../../utils/cn';\n\nexport type TabsOrientation = 'horizontal' | 'vertical';\nexport type TabsActivation = 'automatic' | 'manual';\n\ntype TabsContextValue = {\n    value: string | undefined;\n    setValue: (next: string) => void;\n    baseId: string;\n    orientation: TabsOrientation;\n    activation: TabsActivation;\n    register: (value: string, ref: RefObject<HTMLElement | null>) => void;\n    unregister: (value: string) => void;\n    moveFocus: (offset: 1 | -1, fromValue: string) => void;\n    focusEdge: (edge: 'first' | 'last') => void;\n};\n\nconst TabsContext = createContext<TabsContextValue | null>(null);\n\nconst useTabsContext = (label: string): TabsContextValue => {\n    const ctx = useContext(TabsContext);\n    if (!ctx) {\n        throw new Error(`<${label}> must be rendered inside a <Tabs>.`);\n    }\n    return ctx;\n};\n\nexport type TabsProps = {\n    /** Controlled active tab value. */\n    value?: string;\n    /** Uncontrolled initial value. */\n    defaultValue?: string;\n    /** Fires with the new value when the active tab changes. */\n    onChange?: (next: string) => void;\n    /**\n     * Layout direction of the tablist. Drives the keyboard-nav axis.\n     * @defaultValue 'horizontal'\n     */\n    orientation?: TabsOrientation;\n    /**\n     * Whether arrow keys also activate the focused tab.\n     *  - `automatic` (default) — selection follows focus, matching most UIs.\n     *  - `manual` — arrow keys move focus only; the user presses Enter or\n     *    Space to activate. Use when activating a tab is expensive.\n     * @defaultValue 'automatic'\n     */\n    activation?: TabsActivation;\n    children?: ReactNode;\n    className?: string;\n    testID?: string;\n};\n\n/**\n * Tab pattern with keyboard nav, roving tabindex, and content/trigger\n * association via shared `value`s. Compose:\n *\n *   <Tabs defaultValue=\"overview\">\n *     <TabsList>\n *       <TabsTrigger value=\"overview\">Overview</TabsTrigger>\n *       <TabsTrigger value=\"settings\">Settings</TabsTrigger>\n *     </TabsList>\n *     <TabsContent value=\"overview\">…</TabsContent>\n *     <TabsContent value=\"settings\">…</TabsContent>\n *   </Tabs>\n *\n * Follows the WAI-ARIA tablist pattern: `tablist` / `tab` / `tabpanel` roles,\n * arrow-key navigation that wraps, Home/End for first/last, and roving\n * tabindex so tabbing into the group lands on the active tab.\n */\nconst TabsRoot = ({\n    value,\n    defaultValue,\n    onChange,\n    orientation = 'horizontal',\n    activation = 'automatic',\n    children,\n    className,\n    testID,\n}: TabsProps) => {\n    const baseId = useId();\n    const [inner, setInner] = useState<string | undefined>(defaultValue);\n    const isControlled = value !== undefined;\n    const current = isControlled ? value : inner;\n\n    const refs = useRef<Map<string, RefObject<HTMLElement | null>>>(new Map());\n    const orderRef = useRef<string[]>([]);\n\n    const setValue = useCallback(\n        (next: string) => {\n            if (!isControlled) {\n                setInner(next);\n            }\n            onChange?.(next);\n        },\n        [isControlled, onChange]\n    );\n\n    const register = useCallback((v: string, ref: RefObject<HTMLElement | null>) => {\n        refs.current.set(v, ref);\n        if (!orderRef.current.includes(v)) {\n            orderRef.current.push(v);\n        }\n    }, []);\n\n    const unregister = useCallback((v: string) => {\n        refs.current.delete(v);\n        orderRef.current = orderRef.current.filter((x) => x !== v);\n    }, []);\n\n    const focusValue = useCallback(\n        (next: string) => {\n            const ref = refs.current.get(next);\n            ref?.current?.focus?.();\n            if (activation === 'automatic') {\n                setValue(next);\n            }\n        },\n        [activation, setValue]\n    );\n\n    const moveFocus = useCallback(\n        (offset: 1 | -1, fromValue: string) => {\n            const order = orderRef.current;\n            if (order.length === 0) {\n                return;\n            }\n            const idx = order.indexOf(fromValue);\n            const start = idx === -1 ? 0 : idx;\n            const len = order.length;\n            const next = order[(start + offset + len) % len];\n            if (next) {\n                focusValue(next);\n            }\n        },\n        [focusValue]\n    );\n\n    const focusEdge = useCallback(\n        (edge: 'first' | 'last') => {\n            const order = orderRef.current;\n            if (order.length === 0) {\n                return;\n            }\n            const target = edge === 'first' ? order[0] : order[order.length - 1];\n            if (target) {\n                focusValue(target);\n            }\n        },\n        [focusValue]\n    );\n\n    const ctxValue = useMemo<TabsContextValue>(\n        () => ({\n            value: current,\n            setValue,\n            baseId,\n            orientation,\n            activation,\n            register,\n            unregister,\n            moveFocus,\n            focusEdge,\n        }),\n        [current, setValue, baseId, orientation, activation, register, unregister, moveFocus, focusEdge]\n    );\n\n    return (\n        <TabsContext.Provider value={ctxValue}>\n            <TabsViewport\n                orientation={orientation}\n                {...(className !== undefined ? { className } : {})}\n                {...(testID !== undefined ? { testID } : {})}\n            >\n                {children}\n            </TabsViewport>\n        </TabsContext.Provider>\n    );\n};\n\n// Inner view so we can call useThemeColors() to source the orientation\n// gap from the spacing token scale.\nconst TabsViewport = ({\n    orientation,\n    className,\n    testID,\n    children,\n}: {\n    orientation: TabsOrientation;\n    className?: string;\n    testID?: string;\n    children?: ReactNode;\n}) => {\n    const colors = useThemeColors();\n    return (\n        <View\n            {...(testID !== undefined ? { testID } : {})}\n            className={cn(orientation === 'vertical' ? 'flex-row gap-4' : 'flex-col gap-3', className)}\n            style={\n                orientation === 'vertical'\n                    ? { flexDirection: 'row', gap: px(colors.spacing['4']) }\n                    : { flexDirection: 'column', gap: px(colors.spacing['3']) }\n            }\n        >\n            {children}\n        </View>\n    );\n};\n\nexport type TabsListProps = {\n    children?: ReactNode;\n    className?: string;\n    testID?: string;\n};\n\n// Layout-only bases; theme-driven gap is merged inside TabsList.\nconst LIST_LAYOUT_BASE: ViewStyle = {\n    flexDirection: 'row',\n    alignItems: 'center',\n    borderBottomWidth: 1,\n};\n\nconst LIST_VERTICAL_LAYOUT_BASE: ViewStyle = {\n    flexDirection: 'column',\n    alignItems: 'stretch',\n    borderRightWidth: 1,\n};\n\n/** Container for `TabsTrigger`s. Renders the underline rule on the appropriate edge. */\nexport const TabsList = ({ children, className, testID }: TabsListProps) => {\n    const ctx = useTabsContext('TabsList');\n    const colors = useThemeColors();\n    const gap = px(colors.spacing['1']);\n    const listStyle: ViewStyle =\n        ctx.orientation === 'vertical'\n            ? { ...LIST_VERTICAL_LAYOUT_BASE, gap, borderRightColor: colors.semantic.border.default }\n            : { ...LIST_LAYOUT_BASE, gap, borderBottomColor: colors.semantic.border.default };\n    return (\n        <View\n            {...(testID !== undefined ? { testID } : {})}\n            role=\"tablist\"\n            accessibilityRole=\"tablist\"\n            aria-orientation={ctx.orientation}\n            className={cn(\n                ctx.orientation === 'vertical'\n                    ? 'flex-col gap-1 border-r border-semantic-border-default'\n                    : 'flex-row items-center gap-1 border-b border-semantic-border-default',\n                className\n            )}\n            style={listStyle}\n        >\n            {children}\n        </View>\n    );\n};\n\nexport type TabsTriggerProps = {\n    /** Value linking this trigger to a `<TabsContent>`. */\n    value: string;\n    /** Disable just this trigger. */\n    disabled?: boolean;\n    children?: ReactNode;\n    className?: string;\n    testID?: string;\n};\n\n// Subtle 200ms ease on border + text color so the active tab indicator\n// fades in/out (and the trigger label colors smoothly between selected\n// and idle) instead of snapping. Web only — RN ignores the transition*\n// keys silently. We don't ship a true sliding magic-pill on either\n// platform yet; that would need react-native-reanimated and per-trigger\n// rect measurement, which is more complexity than this earns right now.\nconst TRIGGER_TRANSITION = {\n    transitionProperty: 'border-color, color',\n    transitionDuration: '200ms',\n    transitionTimingFunction: 'ease',\n} as ViewStyle;\n\n// Layout / transition only; theme-driven padding is merged inside TabsTrigger.\nconst TRIGGER_LAYOUT_BASE: ViewStyle = {\n    borderBottomWidth: 2,\n    borderBottomColor: 'transparent',\n    marginBottom: -1,\n    ...TRIGGER_TRANSITION,\n};\n\nconst TRIGGER_LAYOUT_BASE_VERTICAL: ViewStyle = {\n    borderRightWidth: 2,\n    borderRightColor: 'transparent',\n    marginRight: -1,\n    ...TRIGGER_TRANSITION,\n};\n\n/** Clickable tab. Activating it shows the matching `TabsContent`. */\nexport const TabsTrigger = ({ value, disabled, children, className, testID }: TabsTriggerProps) => {\n    const ctx = useTabsContext('TabsTrigger');\n    const colors = useThemeColors();\n    const ownRef = useRef<HTMLElement | null>(null);\n    const selected = ctx.value === value;\n    const isVertical = ctx.orientation === 'vertical';\n\n    useEffect(() => {\n        ctx.register(value, ownRef);\n        return () => ctx.unregister(value);\n    }, [ctx, value]);\n\n    const onPress = useCallback(() => {\n        if (disabled) {\n            return;\n        }\n        ctx.setValue(value);\n    }, [ctx, value, disabled]);\n\n    const handleKeyDown = useCallback(\n        (event: KeyboardEvent<HTMLElement>) => {\n            const nextKey = isVertical ? 'ArrowDown' : 'ArrowRight';\n            const prevKey = isVertical ? 'ArrowUp' : 'ArrowLeft';\n            switch (event.key) {\n                case nextKey:\n                    event.preventDefault();\n                    ctx.moveFocus(1, value);\n                    return;\n                case prevKey:\n                    event.preventDefault();\n                    ctx.moveFocus(-1, value);\n                    return;\n                case 'Home':\n                    event.preventDefault();\n                    ctx.focusEdge('first');\n                    return;\n                case 'End':\n                    event.preventDefault();\n                    ctx.focusEdge('last');\n                    return;\n                case 'Enter':\n                case ' ': {\n                    if (ctx.activation === 'manual') {\n                        event.preventDefault();\n                        if (!disabled) {\n                            ctx.setValue(value);\n                        }\n                    }\n                    return;\n                }\n            }\n        },\n        [ctx, value, disabled, isVertical]\n    );\n\n    const accentStyle = selected\n        ? isVertical\n            ? { borderRightColor: colors.semantic.interactive.primary }\n            : { borderBottomColor: colors.semantic.interactive.primary }\n        : null;\n\n    const triggerProps: Record<string, unknown> = {\n        ref: (node: HTMLElement | null) => {\n            ownRef.current = node;\n        },\n        role: 'tab',\n        accessibilityRole: 'tab',\n        'aria-selected': selected,\n        'aria-controls': `${ctx.baseId}-panel-${value}`,\n        id: `${ctx.baseId}-tab-${value}`,\n        tabIndex: selected ? 0 : -1,\n        onPress,\n        onKeyDown: handleKeyDown,\n        ...(disabled ? { 'aria-disabled': true, disabled: true } : {}),\n        ...(testID !== undefined ? { testID } : {}),\n    };\n\n    const triggerPadding: ViewStyle = {\n        paddingHorizontal: px(colors.spacing['3']),\n        paddingVertical: px(colors.spacing['2']),\n    };\n    const triggerStyle: ViewStyle = isVertical\n        ? { ...TRIGGER_LAYOUT_BASE_VERTICAL, ...triggerPadding }\n        : { ...TRIGGER_LAYOUT_BASE, ...triggerPadding };\n\n    return (\n        <Pressable\n            {...triggerProps}\n            className={cn(\n                isVertical\n                    ? 'px-3 py-2 -mr-px border-r-2 border-r-transparent'\n                    : 'px-3 py-2 -mb-px border-b-2 border-b-transparent',\n                selected ? 'border-r-semantic-interactive-primary' : '',\n                disabled ? 'opacity-50' : 'opacity-100',\n                className\n            )}\n            style={[triggerStyle, accentStyle, disabled ? { opacity: 0.5 } : null]}\n        >\n            {typeof children === 'string' ? (\n                <RNText\n                    style={{\n                        color: selected ? colors.semantic.interactive.primary : colors.semantic.text.muted,\n                        fontFamily: colors.fontFamily.body,\n                        fontSize: px(colors.fontSize.sm),\n                        fontWeight: selected\n                            ? (colors.fontWeight.semibold as '600')\n                            : (colors.fontWeight.medium as '500'),\n                    }}\n                >\n                    {children}\n                </RNText>\n            ) : (\n                children\n            )}\n        </Pressable>\n    );\n};\n\nexport type TabsContentProps = {\n    /** Value of the trigger this panel pairs with. */\n    value: string;\n    children?: ReactNode;\n    className?: string;\n    testID?: string;\n};\n\n/** Panel content shown when its `value` matches the active tab. */\nexport const TabsContent = ({ value, children, className, testID }: TabsContentProps) => {\n    const ctx = useTabsContext('TabsContent');\n    const active = ctx.value === value;\n    if (!active) {\n        return null;\n    }\n    return (\n        <View\n            {...(testID !== undefined ? { testID } : {})}\n            role=\"tabpanel\"\n            accessibilityRole=\"none\"\n            id={`${ctx.baseId}-panel-${value}`}\n            aria-labelledby={`${ctx.baseId}-tab-${value}`}\n            tabIndex={0}\n            className={cn('outline-none', className)}\n        >\n            {children}\n        </View>\n    );\n};\n\n/**\n * Public `Tabs` value — the root function plus its `.List`, `.Trigger`, and\n * `.Content` static members. `Object.assign` produces a value whose inferred\n * type carries the static properties, so `.d.ts` consumers can write\n * `<Tabs.List>` without a separate import.\n */\nexport const Tabs = Object.assign(TabsRoot, {\n    List: TabsList,\n    Trigger: TabsTrigger,\n    Content: TabsContent,\n});\n"]}