one
Version:
One is a new React Framework that makes Vite serve both native and web.
584 lines (578 loc) • 22.3 kB
JavaScript
;
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
// If the importer is in node compatibility mode or this is not an ESM
// file that has been converted to a CommonJS file using a Babel-
// compatible transform (i.e. "__esModule" has not been set), then set
// "default" to the CommonJS "module.exports" for node compatibility.
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
value: mod,
enumerable: true
}) : target, mod));
var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
value: true
}), mod);
var useScreens_exports = {};
__export(useScreens_exports, {
Group: () => Group,
Screen: () => Screen,
createGetIdForRoute: () => createGetIdForRoute,
getQualifiedRouteComponent: () => getQualifiedRouteComponent,
useSortedScreens: () => useSortedScreens
});
module.exports = __toCommonJS(useScreens_exports);
var import_jsx_runtime = require("react/jsx-runtime");
var import_react = require("react");
var import_core = require("@react-navigation/core");
require("@react-navigation/elements");
var import_react2 = __toESM(require("react"), 1);
var import_react_native = require("react-native");
require("../server/ServerContextScript.native.js");
var import_getPageExport = require("../utils/getPageExport.native.js");
var import_EmptyRoute = require("../views/EmptyRoute.native.js");
var import_Try = require("../views/Try.native.js");
require("../vite/DevHead.native.js");
var import_one_server_only = require("../vite/one-server-only.native.js");
var import_filterRootHTML = require("./filterRootHTML.native.js");
var import_Route = require("./Route.native.js");
var import_SpaShellContext = require("./SpaShellContext.native.js");
var import_Navigator = require("../views/Navigator.native.js");
var import_sortRoutes = require("./sortRoutes.native.js");
function _assert_this_initialized(self) {
if (self === void 0) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
return self;
}
function _call_super(_this, derived, args) {
derived = _get_prototype_of(derived);
return _possible_constructor_return(_this, _is_native_reflect_construct() ? Reflect.construct(derived, args || [], _get_prototype_of(_this).constructor) : derived.apply(_this, args));
}
function _class_call_check(instance, Constructor) {
if (!(instance instanceof Constructor)) throw new TypeError("Cannot call a class as a function");
}
function _defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, descriptor.key, descriptor);
}
}
function _create_class(Constructor, protoProps, staticProps) {
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
if (staticProps) _defineProperties(Constructor, staticProps);
return Constructor;
}
function _get_prototype_of(o) {
_get_prototype_of = Object.setPrototypeOf ? Object.getPrototypeOf : function getPrototypeOf(o2) {
return o2.__proto__ || Object.getPrototypeOf(o2);
};
return _get_prototype_of(o);
}
function _inherits(subClass, superClass) {
if (typeof superClass !== "function" && superClass !== null) throw new TypeError("Super expression must either be null or a function");
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
writable: true,
configurable: true
}
});
if (superClass) _set_prototype_of(subClass, superClass);
}
function _instanceof(left, right) {
if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) return !!right[Symbol.hasInstance](left);else return left instanceof right;
}
function _possible_constructor_return(self, call) {
if (call && (_type_of(call) === "object" || typeof call === "function")) return call;
return _assert_this_initialized(self);
}
function _set_prototype_of(o, p) {
_set_prototype_of = Object.setPrototypeOf || function setPrototypeOf(o2, p2) {
o2.__proto__ = p2;
return o2;
};
return _set_prototype_of(o, p);
}
function _type_of(obj) {
"@swc/helpers - typeof";
return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
}
function _is_native_reflect_construct() {
try {
var result = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
} catch (_) {}
return (_is_native_reflect_construct = function () {
return !!result;
})();
}
function hasMetaCharset(children) {
if (process.env.NODE_ENV === "development") {
if (!children) return false;
var checkElement = function (child) {
if (! /* @__PURE__ */import_react2.default.isValidElement(child)) return false;
if (child.type === "meta") {
var props = child.props;
if ("charSet" in props || "charset" in props) return true;
}
var childProps = child.props;
if (childProps.children) return hasMetaCharset(childProps.children);
return false;
};
if (Array.isArray(children)) return children.some(checkElement);
return checkElement(children);
}
return true;
}
var {
Screen,
Group
} = (0, import_core.createNavigatorFactory)({})();
typeof document !== "undefined" && function () {
var elements = [];
document.querySelectorAll("style[id^=\"__one_css_\"], link[rel=\"stylesheet\"][data-one-css]").forEach(function (el, i) {
if (el.tagName === "STYLE") elements.push(/* @__PURE__ */(0, import_jsx_runtime.jsx)("style", {
id: el.id,
dangerouslySetInnerHTML: {
__html: el.innerHTML
}
}, `inline-css-${i}`));else {
var href = el.getAttribute("href");
elements.push(/* @__PURE__ */(0, import_jsx_runtime.jsx)("link", {
rel: "stylesheet",
href,
"data-one-css": ""
}, href));
}
});
return elements;
}();
function RootLayoutRenderer(param) {
var {
LayoutComponent,
layoutProps,
forwardedRef
} = param;
if (process.env.NODE_ENV === "development" && false) ;
var out = LayoutComponent(layoutProps, forwardedRef);
var {
children,
bodyProps,
head,
htmlProps
} = (0, import_filterRootHTML.filterRootHTML)(out);
var {
children: headChildren,
...headProps
} = (head === null || head === void 0 ? void 0 : head.props) || {};
(0, import_one_server_only.useServerContext)();
return children;
}
function getSortedChildren(children, order, initialRouteName, options) {
if (!(order === null || order === void 0 ? void 0 : order.length)) return children.sort((0, import_sortRoutes.sortRoutesWithInitial)(initialRouteName)).map(function (route) {
return {
route,
props: {}
};
});
var entries = [...children];
var ordered = order.map(function (param) {
var {
name,
redirect,
initialParams,
listeners,
options: _$options,
getId
} = param;
if (!entries.length) {
console.warn(`[Layout children]: Too many screens defined. Route "${name}" is extraneous.`);
return null;
}
var matchIndex = entries.findIndex(function (child) {
return child.route === name;
});
if (matchIndex === -1) {
console.warn(`[Layout children]: No route named "${name}" exists in nested children:`, children.map(function (param2) {
var {
route
} = param2;
return route;
}));
return null;
}
var match = entries[matchIndex];
entries.splice(matchIndex, 1);
if (redirect) {
if (typeof redirect === "string") throw new Error(`Redirecting to a specific route is not supported yet.`);
return null;
}
return {
route: match,
props: {
initialParams,
listeners,
options: _$options,
getId
}
};
}).filter(Boolean);
if (!(options === null || options === void 0 ? void 0 : options.onlyMatching)) ordered.push(...entries.sort((0, import_sortRoutes.sortRoutesWithInitial)(initialRouteName)).map(function (route) {
return {
route,
props: {}
};
}));
return ordered;
}
function useSortedScreens(order, options) {
var node = (0, import_Route.useRouteNode)();
return import_react2.default.useMemo(function () {
var _node_children;
return ((node === null || node === void 0 ? void 0 : (_node_children = node.children) === null || _node_children === void 0 ? void 0 : _node_children.length) ? getSortedChildren(node.children, order, node.initialRouteName, options) : []).filter(function (value) {
var _options_protectedScreens, _options_protectedScreens1;
var routeName = value.route.route;
var normalized = routeName.replace(/\/index$/, "");
return !((options === null || options === void 0 ? void 0 : (_options_protectedScreens = options.protectedScreens) === null || _options_protectedScreens === void 0 ? void 0 : _options_protectedScreens.has(routeName)) || (options === null || options === void 0 ? void 0 : (_options_protectedScreens1 = options.protectedScreens) === null || _options_protectedScreens1 === void 0 ? void 0 : _options_protectedScreens1.has(normalized)));
}).map(function (value) {
return routeToScreen(value.route, value.props);
});
}, [node === null || node === void 0 ? void 0 : node.children, node === null || node === void 0 ? void 0 : node.initialRouteName, order, options === null || options === void 0 ? void 0 : options.protectedScreens]);
}
function fromImport(param) {
var {
ErrorBoundary,
...component
} = param;
if (ErrorBoundary) return {
default: /* @__PURE__ */import_react2.default.forwardRef(function (props, ref) {
var children = /* @__PURE__ */import_react2.default.createElement((0, import_getPageExport.getPageExport)(component) || import_EmptyRoute.EmptyRoute, {
...props,
ref
});
return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Try.Try, {
catch: ErrorBoundary,
children
});
})
};
if (process.env.NODE_ENV !== "production") {
var exported = (0, import_getPageExport.getPageExport)(component);
if (exported && (typeof exported === "undefined" ? "undefined" : _type_of(exported)) === "object" && Object.keys(exported).length === 0) return {
default: import_EmptyRoute.EmptyRoute
};
}
return {
default: (0, import_getPageExport.getPageExport)(component)
};
}
var qualifiedStore = /* @__PURE__ */new WeakMap();
function getQualifiedRouteComponent(value) {
if (value && qualifiedStore.has(value)) return qualifiedStore.get(value);
var ScreenComponent = /* @__PURE__ */import_react2.default.forwardRef(function (props, ref) {
if (process.env.NODE_ENV === "development" && false) ;
if ((0, import_react2.useContext)(import_SpaShellContext.SpaShellContext) && props.segment !== "") {
var _value_children;
if (!(((_value_children = value.children) === null || _value_children === void 0 ? void 0 : _value_children.length) && (value.layoutRenderMode === "ssg" || value.layoutRenderMode === "ssr"))) return /* @__PURE__ */(0, import_jsx_runtime.jsx)("div", {
"data-one-spa-content": ""
});
}
var res = value.loadRoute();
var Component = (0, import_getPageExport.getPageExport)(fromImport(res));
if (process.env.NODE_ENV === "development" && process.env.DEBUG === "one") {
console.groupCollapsed(`Render ${props.key} ${props.segment}`);
console.info(`value`, value);
console.info(`Component`, Component);
console.groupEnd();
}
var slotProps = {};
if (value.slots && value.slots.size > 0) {
var _iteratorNormalCompletion = true,
_didIteratorError = false,
_iteratorError = void 0;
try {
for (var _iterator = value.slots[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
var [slotName] = _step.value;
slotProps[slotName] = /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Navigator.NamedSlot, {
name: slotName,
layoutContextKey: value.contextKey
});
}
} catch (err) {
_didIteratorError = true;
_iteratorError = err;
} finally {
try {
if (!_iteratorNormalCompletion && _iterator.return != null) _iterator.return();
} finally {
if (_didIteratorError) throw _iteratorError;
}
}
}
if (props.segment === "") return /* @__PURE__ */(0, import_jsx_runtime.jsx)(RootLayoutRenderer, {
LayoutComponent: Component,
layoutProps: {
...props,
...slotProps
},
forwardedRef: ref
});
return /* @__PURE__ */(0, import_jsx_runtime.jsx)(RouteErrorBoundary, {
routeName: value.route,
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(Component, {
...props,
...slotProps,
ref
})
});
});
var wrapSuspense = function (children) {
if (process.env.ONE_SUSPEND_ROUTES_NATIVE === "0" || globalThis.__ONE_DISABLE_SUSPENSE_ROUTES__ === true) return children;
return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react2.Suspense, {
fallback: null,
children
});
};
var QualifiedRoute = /* @__PURE__ */import_react2.default.forwardRef(function (param, ref) {
var {
route,
navigation,
...props
} = param;
return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Route.Route, {
route,
node: value,
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
children: wrapSuspense(/* @__PURE__ */(0, import_jsx_runtime.jsx)(ScreenComponent, {
...props,
ref,
segment: value.route
}))
})
});
});
QualifiedRoute.displayName = `Route(${value.route})`;
qualifiedStore.set(value, QualifiedRoute);
return /* @__PURE__ */(0, import_react2.memo)(QualifiedRoute);
}
function createGetIdForRoute(route) {
var include = /* @__PURE__ */new Map();
if (route.dynamic) {
var _iteratorNormalCompletion = true,
_didIteratorError = false,
_iteratorError = void 0;
try {
for (var _iterator = route.dynamic[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
var segment = _step.value;
include.set(segment.name, segment);
}
} catch (err) {
_didIteratorError = true;
_iteratorError = err;
} finally {
try {
if (!_iteratorNormalCompletion && _iterator.return != null) _iterator.return();
} finally {
if (_didIteratorError) throw _iteratorError;
}
}
}
return function () {
var {
params = {}
} = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
var _segments_join;
var segments = [];
var _iteratorNormalCompletion2 = true,
_didIteratorError2 = false,
_iteratorError2 = void 0;
try {
for (var _iterator2 = include.values()[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
var dynamic = _step2.value;
var value = params === null || params === void 0 ? void 0 : params[dynamic.name];
if (Array.isArray(value) && value.length > 0) segments.push(value.join("/"));else if (value && !Array.isArray(value)) segments.push(value);else if (dynamic.deep) segments.push(`[...${dynamic.name}]`);else segments.push(`[${dynamic.name}]`);
}
} catch (err) {
_didIteratorError2 = true;
_iteratorError2 = err;
} finally {
try {
if (!_iteratorNormalCompletion2 && _iterator2.return != null) _iterator2.return();
} finally {
if (_didIteratorError2) throw _iteratorError2;
}
}
return (_segments_join = segments.join("/")) !== null && _segments_join !== void 0 ? _segments_join : route.contextKey;
};
}
function routeToScreen(route) {
var {
options,
...props
} = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
return /* @__PURE__ */(0, import_react.createElement)(Screen, {
getId: createGetIdForRoute(route),
...props,
name: route.route,
key: route.route,
options: function (args) {
var _route_loadRoute;
var staticOptions = route.generated ? (_route_loadRoute = route.loadRoute()) === null || _route_loadRoute === void 0 ? void 0 : _route_loadRoute.getNavOptions : null;
var staticResult = typeof staticOptions === "function" ? staticOptions(args) : staticOptions;
var dynamicResult = typeof options === "function" ? options === null || options === void 0 ? void 0 : options(args) : options;
var output = {
...staticResult,
...dynamicResult
};
if (route.generated) {
output.tabBarButton = function () {
return null;
};
output.drawerItemStyle = {
height: 0,
display: "none"
};
}
return output;
},
getComponent: function () {
return getQualifiedRouteComponent(route);
}
});
}
var ROUTE_ERROR_BOUNDARY_INITIAL_STATE = {
hasError: false,
error: null,
errorInfo: null
};
var RouteErrorBoundary = /* @__PURE__ */function (_React_Component) {
"use strict";
_inherits(RouteErrorBoundary2, _React_Component);
function RouteErrorBoundary2(props) {
_class_call_check(this, RouteErrorBoundary2);
var _this = _call_super(this, RouteErrorBoundary2, [props]);
_this.state = ROUTE_ERROR_BOUNDARY_INITIAL_STATE;
return _this;
}
_create_class(RouteErrorBoundary2, [{
key: "componentDidCatch",
value: function componentDidCatch(error, errorInfo) {
console.error(`Error occurred while running route "${this.props.routeName}": ${_instanceof(error, Error) ? error.message : error}
${error.stack}
Component Stack:
${errorInfo.componentStack}`);
this.setState({
errorInfo
});
}
}, {
key: "clearError",
value: function clearError() {
this.setState(ROUTE_ERROR_BOUNDARY_INITIAL_STATE);
}
}, {
key: "render",
value: function render() {
if (this.state.hasError) {
var {
error,
errorInfo
} = this.state;
return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.SafeAreaView, {
style: {
backgroundColor: "#000"
},
children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_react_native.View, {
style: {
margin: 16,
gap: 16
},
children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_react_native.Text, {
style: {
alignSelf: "flex-start",
padding: 5,
margin: -5,
backgroundColor: "red",
color: "white",
fontSize: 20,
fontFamily: "monospace"
},
children: ["Error on route \"", this.props.routeName, "\""]
}), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.Text, {
style: {
color: "white",
fontSize: 16,
fontFamily: "monospace"
},
children: _instanceof(error, Error) ? error.message : error
}), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.TouchableOpacity, {
onPress: this.clearError.bind(this),
children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.Text, {
style: {
alignSelf: "flex-start",
margin: -6,
padding: 6,
backgroundColor: "white",
color: "black",
fontSize: 14,
fontFamily: "monospace"
},
children: "Retry"
})
}), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_react_native.ScrollView, {
contentContainerStyle: {
gap: 12
},
children: [_instanceof(error, Error) ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.Text, {
style: {
color: "white",
fontSize: 12,
fontFamily: "monospace"
},
children: error.stack
}) : null, (errorInfo === null || errorInfo === void 0 ? void 0 : errorInfo.componentStack) ? /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_react_native.Text, {
style: {
color: "white",
fontSize: 12,
fontFamily: "monospace"
},
children: ["Component Stack: ", errorInfo.componentStack]
}) : null]
})]
})
});
}
return this.props.children;
}
}], [{
key: "getDerivedStateFromError",
value: function getDerivedStateFromError(error) {
return {
hasError: true,
error
};
}
}]);
return RouteErrorBoundary2;
}(import_react2.default.Component);
//# sourceMappingURL=useScreens.native.js.map