one/dist/esm/layouts/Stack.mjs

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

import React, { Children, useMemo } from "react";
import { isChildOfType } from "../utils/children.mjs";
import { Protected } from "../views/Protected.mjs";
import { Screen } from "../views/Screen.mjs";
import { createStackNavigator, getStackNavigatorProps } from "./stack-navigator.mjs";
import { appendScreenStackPropsToOptions, StackHeader, StackHeaderComponent, StackHeaderSearchBar, StackScreen, StackToolbar } from "./stack-utils/index.mjs";
import { withLayoutContext } from "./withLayoutContext.mjs";
import { getStackToolbarImplementation } from "./stack-utils/StackToolbarImplementation.mjs";
import { jsx } from "react/jsx-runtime";
const NativeStackNavigator = createStackNavigator().Navigator;
const RNStack = withLayoutContext(NativeStackNavigator);
function mapChildren(children, toolbarImplementation) {
  return Children.toArray(children).map((child, index) => {
    if (isChildOfType(child, StackScreen)) {
      const options = appendScreenStackPropsToOptions({}, child.props, toolbarImplementation);
      const {
        children: _,
        ...rest
      } = child.props;
      return /* @__PURE__ */jsx(Screen, {
        ...rest,
        options
      }, child.props.name ?? index);
    }
    if (isChildOfType(child, Protected)) {
      return React.cloneElement(child, {
        key: `protected-${index}`
      }, mapChildren(child.props.children, toolbarImplementation));
    }
    if (isChildOfType(child, StackHeaderComponent)) {
      return null;
    }
    if (isChildOfType(child, Screen)) {
      return child;
    }
    return null;
  }).filter(Boolean);
}
const StackWithComposition = React.forwardRef((props, ref) => {
  const {
    children,
    screenOptions,
    ...rest
  } = props;
  const toolbarImplementation = getStackToolbarImplementation();
  const screenOptionsWithHeader = useMemo(() => {
    const stackHeader = Children.toArray(children).find(child => isChildOfType(child, StackHeaderComponent));
    if (stackHeader && isChildOfType(stackHeader, StackHeaderComponent)) {
      const headerProps = {
        children: stackHeader
      };
      if (screenOptions) {
        if (typeof screenOptions === "function") {
          return (...args) => {
            const opts = screenOptions(...args);
            return appendScreenStackPropsToOptions(opts, headerProps, toolbarImplementation);
          };
        }
        return appendScreenStackPropsToOptions(screenOptions, headerProps, toolbarImplementation);
      }
      return appendScreenStackPropsToOptions({}, headerProps, toolbarImplementation);
    }
    return screenOptions;
  }, [children, screenOptions, toolbarImplementation]);
  const processedChildren = useMemo(() => mapChildren(children, toolbarImplementation), [children, toolbarImplementation]);
  const navigatorProps = useMemo(() => getStackNavigatorProps(children), [children]);
  return /* @__PURE__ */jsx(RNStack, {
    ...rest,
    ...navigatorProps,
    ref,
    screenOptions: screenOptionsWithHeader,
    children: processedChildren
  });
});
const Stack = Object.assign(StackWithComposition, {
  Screen: StackScreen,
  Header: StackHeader,
  Protected,
  SearchBar: StackHeaderSearchBar,
  Toolbar: StackToolbar
});
var Stack_default = Stack;
export { Stack, Stack_default as default };
//# sourceMappingURL=Stack.mjs.map