one
Version:
One is a new React Framework that makes Vite serve both native and web.
135 lines (134 loc) • 3.86 kB
JavaScript
import * as React from "react";
import { Link } from "../link/Link.mjs";
import { matchDeepDynamicRouteName } from "../router/matchers.mjs";
import { getSortedRoutes } from "../router/router.mjs";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
const INDENT = 24;
function getNavOptions() {
return {
title: "sitemap",
headerShown: false,
presentation: "modal",
animation: "default",
headerLargeTitle: false,
headerTitleStyle: {
color: "white"
},
headerTintColor: "white",
headerLargeTitleStyle: {
color: "white"
},
headerStyle: {
backgroundColor: "black"
}
};
}
function Sitemap() {
return /* @__PURE__ */jsx("main", {
style: {
minHeight: "100vh",
boxSizing: "border-box",
backgroundColor: "black",
color: "white",
padding: 12
},
children: /* @__PURE__ */jsxs("div", {
style: {
width: "min(960px, 90vw)",
margin: "0 auto"
},
children: [/* @__PURE__ */jsx("h1", {
style: {
fontSize: 28,
margin: "12px 0 20px"
},
children: "Sitemap"
}), getSortedRoutes().map(route => /* @__PURE__ */jsx("div", {
style: {
border: "1px solid #323232",
borderRadius: 19,
marginBottom: 12,
overflow: "hidden"
},
children: /* @__PURE__ */jsx(FileItem, {
route
})
}, route.contextKey))]
})
});
}
function FileItem({
route,
level = 0,
parents = [],
isInitial = false
}) {
const disabled = route.children.length > 0;
const segments = React.useMemo(() => [...parents, ...route.route.split("/")], [parents, route.route]);
const href = React.useMemo(() => "/" + segments.map(segment => {
if (matchDeepDynamicRouteName(segment)) {
return `${segment}/${Date.now()}`;
}
return segment === "index" ? "" : segment;
}).filter(Boolean).join("/"), [segments]);
const filename = React.useMemo(() => {
const contextSegments = route.contextKey.split("/");
if (route.contextKey.match(/_layout\.[jt]sx?$/)) {
return contextSegments.slice(-2).join("/");
}
return contextSegments.slice(-route.route.split("/").length).join("/");
}, [route]);
const content = /* @__PURE__ */jsxs("div", {
style: {
display: "flex",
alignItems: "center",
justifyContent: "space-between",
gap: 16,
minHeight: 56,
boxSizing: "border-box",
padding: `16px ${INDENT}px 16px ${INDENT + level * INDENT}px`,
color: "white",
opacity: disabled ? 0.6 : 1
},
children: [/* @__PURE__ */jsxs("span", {
style: {
fontSize: 20
},
children: [route.children.length ? "\u{1F5C0}" : "\u{1F4C4}", " ", filename]
}), /* @__PURE__ */jsxs("span", {
style: {
display: "flex",
alignItems: "center",
gap: 8
},
children: [(isInitial || route.generated) && /* @__PURE__ */jsx("span", {
style: {
fontSize: 13
},
children: isInitial ? "Initial" : "Virtual"
}), !disabled && /* @__PURE__ */jsx("span", {
"aria-hidden": "true",
children: "\u203A"
})]
})]
});
return /* @__PURE__ */jsxs(Fragment, {
children: [!route.internal && (disabled ? content : /* @__PURE__ */jsx(Link, {
href,
replace: true,
accessibilityLabel: route.contextKey,
style: {
display: "block",
textDecoration: "none"
},
children: content
})), route.children.map(child => /* @__PURE__ */jsx(FileItem, {
route: child,
isInitial: route.initialRouteName === child.route,
parents: segments,
level: level + (route.generated ? 0 : 1)
}, child.contextKey))]
});
}
export { Sitemap, getNavOptions };
//# sourceMappingURL=Sitemap.mjs.map