one/dist/esm/layouts/Tabs.mjs

One is a new React Framework that makes Vite serve both native and web.

"use client";

import { useNavigationBuilder } from "@react-navigation/core";
import { TabRouter } from "@react-navigation/routers";
import { Children, Fragment, forwardRef, useMemo, useRef } from "react";
import { getPathFromState } from "../fork/getPathFromState.mjs";
import { getCustomNavigatorChildren, isNavigatorConfigChild } from "../headless/children.mjs";
import { devHeadlessNote } from "../headless/devHeadlessNote.mjs";
import { renderKeptMountedScreens, useVisitedScreens } from "../headless/keepMounted.mjs";
import { useTabs } from "../headless/useTabs.mjs";
import { getResolvedLinking } from "../router/linkingConfig.mjs";
import { TabTriggerMapContext } from "../ui/TabContext.mjs";
import { NavigatorContext } from "../views/Navigator.mjs";
import { Protected } from "../views/Protected.mjs";
import { Screen } from "../views/Screen.mjs";
import { withLayoutContext } from "./withLayoutContext.mjs";
import { jsx } from "react/jsx-runtime";
function WebTabsNavigator({
  children,
  headlessChildren,
  initialRouteName,
  screenOptions,
  id,
  ...rest
}) {
  const {
    state,
    navigation,
    descriptors,
    NavigationContent
  } = useNavigationBuilder(TabRouter, {
    ...rest,
    children,
    initialRouteName,
    screenOptions
  });
  const descriptorsRef = useRef(descriptors);
  descriptorsRef.current = descriptors;
  const linking = getResolvedLinking();
  const navigatorContextValue = useMemo(() => ({
    contextKey: id ?? "",
    state,
    navigation,
    descriptorsRef,
    router: TabRouter
  }), [id, navigation, state]);
  const triggerMap = useMemo(() => {
    return Object.fromEntries(state.routes.map((route, index) => {
      const options = descriptors[route.key]?.options ?? {};
      const href = typeof options.href === "string" ? options.href : (linking?.getPathFromState ?? getPathFromState)({
        ...state,
        index
      }, linking?.config);
      return [route.name, {
        type: "internal",
        name: route.name,
        href,
        action: {
          type: "JUMP_TO",
          payload: {
            name: route.name
          }
        },
        index
      }];
    }));
  }, [descriptors, linking, state]);
  return /* @__PURE__ */jsx(NavigationContent, {
    children: /* @__PURE__ */jsx(TabTriggerMapContext.Provider, {
      value: triggerMap,
      children: /* @__PURE__ */jsx(NavigatorContext.Provider, {
        value: navigatorContextValue,
        children: /* @__PURE__ */jsx(HeadlessTabsView, {
          customChildren: headlessChildren
        })
      })
    })
  });
}
function HeadlessTabsView({
  customChildren
}) {
  const {
    screens,
    focused
  } = useTabs();
  const visited = useVisitedScreens(focused.key);
  devHeadlessNote("Tabs");
  if (customChildren?.length) {
    return /* @__PURE__ */jsx(Fragment, {
      children: customChildren
    });
  }
  return renderKeptMountedScreens(screens, visited);
}
const RNTabs = withLayoutContext(WebTabsNavigator);
const TabsWithChildren = forwardRef(function TabsWithChildren2({
  children,
  ...props
}, ref) {
  const configChildren = Children.toArray(children).filter(isNavigatorConfigChild);
  const customChildren = getCustomNavigatorChildren(children);
  return /* @__PURE__ */jsx(RNTabs, {
    ...props,
    ref,
    headlessChildren: customChildren,
    children: configChildren
  });
});
const Tabs = Object.assign(TabsWithChildren, {
  Protected,
  Screen
});
var Tabs_web_default = Tabs;
export { Tabs, Tabs_web_default as default };
//# sourceMappingURL=Tabs.mjs.map