UNPKG

one

Version:

One is a React framework for web, iOS, and Android apps.

122 lines (119 loc) • 3.5 kB
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", headerLargeTitleEnabled: 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 ? .6 : 1 }, children: [/* @__PURE__ */ jsxs("span", { style: { fontSize: 20 }, children: [ route.children.length ? "🗀" : "📄", " ", 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: "›" })] })] }); 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