one/dist/cjs/ui/TabTrigger.native.js

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

"use strict";

var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all) __defProp(target, name, {
    get: all[name],
    enumerable: true
  });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
      get: () => from[key],
      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
    });
  }
  return to;
};
var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
  value: true
}), mod);
var TabTrigger_exports = {};
__export(TabTrigger_exports, {
  TabTrigger: () => TabTrigger,
  isTabTrigger: () => isTabTrigger,
  useTabTrigger: () => useTabTrigger
});
module.exports = __toCommonJS(TabTrigger_exports);
var import_jsx_runtime = require("react/jsx-runtime");
var import_react_slot = require("@radix-ui/react-slot");
var import_react = require("react");
var import_react_native = require("react-native");
var import_getPathFromState_mods = require("../fork/getPathFromState-mods.native.js");
var import_imperative_api = require("../router/imperative-api.native.js");
var import_matchers = require("../router/matchers.native.js");
var import_Navigator = require("../views/Navigator.native.js");
var import_TabContext = require("./TabContext.native.js");
var TabTriggerSlot = import_react_slot.Slot;
function shouldHandleMouseEvent(e) {
  if (!e) return true;
  if ("button" in e) {
    return !e.metaKey && !e.altKey && !e.ctrlKey && !e.shiftKey && (e.button == null || e.button === 0) && [void 0, null, "", "self"].includes(e.currentTarget.target);
  }
  return true;
}
function TabTrigger(param) {
  var {
    asChild,
    name,
    href,
    resetOnFocus,
    ...props
  } = param;
  var {
    trigger,
    triggerProps
  } = useTabTrigger({
    name,
    resetOnFocus,
    ...props
  });
  if (asChild) {
    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(TabTriggerSlot, {
      style: styles.tabTrigger,
      ...props,
      ...triggerProps,
      href: trigger === null || trigger === void 0 ? void 0 : trigger.resolvedHref,
      children: props.children
    });
  } else {
    var reactNativeWebProps = {
      href: trigger === null || trigger === void 0 ? void 0 : trigger.resolvedHref
    };
    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.Pressable, {
      style: styles.tabTrigger,
      ...reactNativeWebProps,
      ...props,
      ...triggerProps,
      children: props.children
    });
  }
}
function isTabTrigger(child) {
  return child.type === TabTrigger;
}
function useTabTrigger(options) {
  var {
    state,
    navigation
  } = (0, import_Navigator.useNavigatorContext)();
  var {
    name,
    resetOnFocus,
    onPress,
    onLongPress
  } = options;
  var triggerMap = (0, import_react.use)(import_TabContext.TabTriggerMapContext);
  var getTrigger = (0, import_react.useCallback)(function (name2) {
    var config = triggerMap[name2];
    if (!config) {
      return;
    }
    return {
      isFocused: state.index === config.index,
      route: state.routes[config.index],
      resolvedHref: (0, import_matchers.stripGroupSegmentsFromPath)((0, import_getPathFromState_mods.appendBaseUrl)(config.href)),
      ...config
    };
  }, [triggerMap, state]);
  var trigger = name !== void 0 ? getTrigger(name) : void 0;
  var switchTab = (0, import_react.useCallback)(function (name2, options2) {
    var config = triggerMap[name2];
    if (config) {
      if (config.type === "external") {
        return import_imperative_api.router.navigate(config.href);
      } else {
        return navigation === null || navigation === void 0 ? void 0 : navigation.dispatch({
          ...config.action,
          type: "JUMP_TO",
          payload: {
            ...config.action.payload,
            ...options2
          }
        });
      }
    } else {
      return navigation === null || navigation === void 0 ? void 0 : navigation.dispatch({
        type: "JUMP_TO",
        payload: {
          name: name2
        }
      });
    }
  }, [navigation, triggerMap]);
  var handleOnPress = (0, import_react.useCallback)(function (event) {
    onPress === null || onPress === void 0 ? void 0 : onPress(event);
    if (!trigger) return;
    if (event === null || event === void 0 ? void 0 : event.isDefaultPrevented()) return;
    navigation === null || navigation === void 0 ? void 0 : navigation.emit({
      type: "tabPress",
      target: trigger.type === "internal" ? trigger.route.key : trigger === null || trigger === void 0 ? void 0 : trigger.href,
      canPreventDefault: true
    });
    if (!shouldHandleMouseEvent(event)) return;
    if (trigger.isFocused) return;
    switchTab(name, {
      resetOnFocus
    });
  }, [onPress, name, resetOnFocus, trigger, navigation, switchTab]);
  var handleOnLongPress = (0, import_react.useCallback)(function (event) {
    onLongPress === null || onLongPress === void 0 ? void 0 : onLongPress(event);
    if (!trigger) return;
    if (event === null || event === void 0 ? void 0 : event.isDefaultPrevented()) return;
    navigation === null || navigation === void 0 ? void 0 : navigation.emit({
      type: "tabLongPress",
      target: trigger.type === "internal" ? trigger.route.key : trigger === null || trigger === void 0 ? void 0 : trigger.href
    });
    if (!shouldHandleMouseEvent(event)) return;
    switchTab(name, {
      resetOnFocus
    });
  }, [onLongPress, name, resetOnFocus, trigger, navigation, switchTab]);
  var triggerProps = {
    isFocused: Boolean(trigger === null || trigger === void 0 ? void 0 : trigger.isFocused),
    onPress: handleOnPress,
    onLongPress: handleOnLongPress
  };
  return {
    switchTab,
    getTrigger,
    trigger,
    triggerProps
  };
}
var styles = import_react_native.StyleSheet.create({
  tabTrigger: {
    flexDirection: "row",
    justifyContent: "space-between"
  }
});
//# sourceMappingURL=TabTrigger.native.js.map