one/dist/esm/ui/TabSlot.native.js

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

import { jsx as _jsx } from "react/jsx-runtime";
import { useState } from "react";
import { Platform, StyleSheet } from "react-native";
import { ScreenContainer, Screen } from "react-native-screens";
import { TabContext } from "./TabContext.native.js";
import { useNavigatorContext } from "../views/Navigator.native.js";
function useTabSlot() {
  var {
      detachInactiveScreens = ["android", "ios", "web"].includes(Platform.OS),
      style,
      renderFn = defaultTabsSlotRender
    } = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {},
    {
      state,
      descriptors
    } = useNavigatorContext(),
    focusedRouteKey = state.routes[state.index].key,
    [loaded, setLoaded] = useState({
      [focusedRouteKey]: !0
    });
  return loaded[focusedRouteKey] || setLoaded({
    ...loaded,
    [focusedRouteKey]: !0
  }), /* @__PURE__ */_jsx(ScreenContainer, {
    enabled: detachInactiveScreens,
    hasTwoStates: !0,
    style: [styles.screenContainer, style],
    children: state.routes.map(function (route, index) {
      var descriptor = descriptors[route.key];
      return /* @__PURE__ */_jsx(TabContext.Provider, {
        value: descriptor.options,
        children: renderFn(descriptor, {
          index,
          isFocused: state.index === index,
          loaded: loaded[route.key],
          detachInactiveScreens
        })
      }, descriptor.route.key);
    })
  });
}
function TabSlot(props) {
  return useTabSlot(props);
}
function defaultTabsSlotRender(descriptor, param) {
  var {
      isFocused,
      loaded,
      detachInactiveScreens
    } = param,
    {
      lazy = !0,
      unmountOnBlur,
      freezeOnBlur
    } = descriptor.options;
  return unmountOnBlur && !isFocused || lazy && !loaded && !isFocused ? null : /* @__PURE__ */_jsx(Screen, {
    enabled: detachInactiveScreens,
    activityState: isFocused ? 2 : 0,
    freezeOnBlur,
    style: [styles.screen, isFocused ? styles.focused : styles.unfocused],
    children: descriptor.render()
  }, descriptor.route.key);
}
function isTabSlot(child) {
  return child.type === TabSlot;
}
var styles = StyleSheet.create({
  screen: {
    flex: 1,
    position: "relative",
    height: "100%"
  },
  screenContainer: {
    flexShrink: 0,
    flexGrow: 1
  },
  focused: {
    zIndex: 1,
    display: "flex",
    flexShrink: 0,
    flexGrow: 1
  },
  unfocused: {
    zIndex: -1,
    display: "none",
    flexShrink: 1,
    flexGrow: 0
  }
});
export { TabSlot, defaultTabsSlotRender, isTabSlot, useTabSlot };
//# sourceMappingURL=TabSlot.native.js.map