import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useMemo } from "react";
import { description, namespace, project } from "../../package.js";
import { getOrigin } from "../../listen/index.js";
import { useConfig, useData, useIsTrusted, useQuerySearch } from "./data/index.js";
import { importmapPath, name } from "../../package.js";
import { readFile } from "node:fs/promises";
const { IS_LOCAL, DISABLE_ALPHA_WARNING_BANNER } = process.env;
export const importMapJSON = await readFile(importmapPath, "utf-8");
const publicItems = [
    {
        path: "/",
        name: "Home",
    },
    {
        path: "/feedback",
        name: "Feedback",
    },
];
const MENU_ICON_CLASS = "h-6 w-6 shrink-0 text-indigo-200 group-hover:text-white";
const items = [
    {
        path: "/home",
        name: "Home",
        icon: (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", strokeWidth: 1.5, stroke: "currentColor", className: MENU_ICON_CLASS, children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M8.25 21v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21m0 0h4.5V3.545M12.75 21h7.5V10.75M2.25 21h1.5m18 0h-18M2.25 9l4.5-1.636M18.75 3l-1.5.545m0 6.205l3 1m1.5.5l-1.5-.5M6.75 7.364V3h-3v18m3-13.636l10.5-3.819" }) })),
    },
    {
        path: "/logout",
        name: "Logout",
        icon: (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", strokeWidth: 1.5, stroke: "currentColor", className: MENU_ICON_CLASS, children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15.75 9V5.25A2.25 2.25 0 0013.5 3h-6a2.25 2.25 0 00-2.25 2.25v13.5A2.25 2.25 0 007.5 21h6a2.25 2.25 0 002.25-2.25V15M12 9l-3 3m0 0l3 3m-3-3h12.75" }) })),
    },
];
function Logo() {
    return (_jsx("div", { className: "flex flex-row align-start items-center", children: _jsx("img", { role: "presentation", src: `/${name}/public/example-3.svg`, alt: "Brand Image", className: "h-8 w-auto fill-white", title: "Open Network Happening" }) }));
}
const SETTINGS_ICON = (_jsxs("svg", { className: "h-6 w-6 shrink-0 text-indigo-200 group-hover:text-white", fill: "none", viewBox: "0 0 24 24", strokeWidth: "1.5", stroke: "currentColor", "aria-hidden": "true", children: [_jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.324.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 011.37.49l1.296 2.247a1.125 1.125 0 01-.26 1.431l-1.003.827c-.293.24-.438.613-.431.992a6.759 6.759 0 010 .255c-.007.378.138.75.43.99l1.005.828c.424.35.534.954.26 1.43l-1.298 2.247a1.125 1.125 0 01-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.57 6.57 0 01-.22.128c-.331.183-.581.495-.644.869l-.213 1.28c-.09.543-.56.941-1.11.941h-2.594c-.55 0-1.02-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 01-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 01-1.369-.49l-1.297-2.247a1.125 1.125 0 01.26-1.431l1.004-.827c.292-.24.437-.613.43-.992a6.932 6.932 0 010-.255c.007-.378-.138-.75-.43-.99l-1.004-.828a1.125 1.125 0 01-.26-1.43l1.297-2.247a1.125 1.125 0 011.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.087.22-.128.332-.183.582-.495.644-.869l.214-1.281z" }), _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15 12a3 3 0 11-6 0 3 3 0 016 0z" })] }));
export function BaseLayout({ children, title, }) {
    const { Head, Foot } = useConfig();
    const script = `
    const { client } = await import("/${name}/client/pages/index.js");
    try {
        await client();
    } catch (error) {
       console.error(error);
    }
    `;
    return (_jsxs("html", { lang: "en", className: "h-full bg-white", children: [_jsxs("head", { children: [_jsx("meta", { charSet: "utf-8" }), _jsx("meta", { httpEquiv: "Content-Type", content: "text/html; charset=UTF-8" }), _jsx("meta", { name: "viewport", content: "width=device-width, initial-scale=1" }), _jsx("title", { children: title || project }), _jsx("meta", { name: "description", content: description }), _jsx("meta", { name: "author", content: namespace }), _jsx("link", { href: `/${name}/server.css`, rel: "stylesheet" }), _jsx("script", { type: "importmap", dangerouslySetInnerHTML: { __html: importMapJSON } }), Head ? _jsx(Head, {}) : undefined] }), _jsxs("body", { className: "h-full", children: [!IS_LOCAL && !DISABLE_ALPHA_WARNING_BANNER ? (_jsx("div", { className: "lg:pl-72 flex items-center gap-x-6 bg-gray-900 px-6 py-2.5 sm:px-3.5 sm:before:flex-1 sm:after:flex-1 justify-center", children: _jsx("p", { className: "text-sm leading-6 text-white", children: _jsxs("span", { className: "flex items-center flex-row justify-center", children: [_jsx("strong", { className: "font-semibold", children: "This software is still being refined" }), "\u00A0\u00A0", _jsx("svg", { viewBox: "0 0 2 2", className: "hidden lg:block mx-2 inline h-0.5 w-0.5 fill-current", "aria-hidden": "true", children: _jsx("circle", { cx: "1", cy: "1", r: "1" }) }), "\u00A0\u00A0", _jsxs("span", { children: ["Data displayed is not currently verified or checked, and will be removed without further notice.", _jsx("br", {}), "Data is intended to be used only for user experience testing."] })] }) }) })) : undefined, children, _jsx("script", { type: "module", dangerouslySetInnerHTML: { __html: script } }), Foot ? _jsx(Foot, {}) : undefined] })] }));
}
export function UnauthenticatedLayout(props) {
    const { children } = props;
    const { url } = useData();
    const { pathname } = new URL(url, getOrigin());
    return (_jsx(BaseLayout, { ...props, children: _jsxs("div", { className: "min-h-full", children: [_jsx("nav", { className: "bg-indigo-600", children: _jsx("div", { className: "mx-auto max-w-7xl px-4 sm:px-6 lg:px-8", children: _jsx("div", { className: "flex h-16 items-center justify-between", children: _jsxs("div", { className: "flex items-center", children: [_jsx("div", { className: "flex-shrink-0", children: _jsx(Logo, {}) }), _jsx("div", { className: "flex flex-row", children: publicItems.map(({ path, name }, index) => {
                                            const isPath = path === "/"
                                                ? pathname === path || pathname === "/home"
                                                : pathname.startsWith(path);
                                            return (_jsx("div", { className: "ml-10 flex items-baseline space-x-4", children: _jsx("a", { href: path, className: `${isPath ? "bg-indigo-700" : ""} text-white hover:bg-indigo-500 hover:bg-opacity-75 rounded-md px-3 py-2 text-sm font-medium`, children: name }) }, index));
                                        }) })] }) }) }) }), _jsx("main", { children: _jsx("div", { className: "mx-auto max-w-7xl py-6 sm:px-6 lg:px-8", children: children }) })] }) }));
}
export function Layout(props) {
    const { children, url } = props;
    const { pathname } = new URL(url, getOrigin());
    const search = useQuerySearch();
    const isTrusted = useIsTrusted();
    const userMenuItems = useMemo(() => {
        return items.filter(({ trusted }) => !trusted || isTrusted);
    }, [items, isTrusted]);
    return (_jsx(BaseLayout, { ...props, children: _jsxs("div", { children: [_jsxs("noscript", { className: "lg:hidden", children: [_jsxs("ul", { role: "list", className: "-mx-2 space-y-1 list-none dynamic-sidebar-nojs", children: [userMenuItems.map(({ path, name, icon }, index) => (_jsx("li", { children: _jsxs("a", { href: path, className: "text-blue-600 hover:bg-white underline hover:underline-offset-2 flex flex-row align-center justify-left p-4", children: [icon, _jsx("span", { className: "px-4", children: name })] }) }, index))), _jsx("li", { children: _jsxs("a", { href: "/settings", className: "text-blue-600 hover:bg-white underline hover:underline-offset-2 flex flex-row align-center justify-left p-4", children: [SETTINGS_ICON, _jsx("span", { className: "px-4", children: "Settings" })] }) })] }), _jsx("hr", {})] }), _jsxs("div", { className: "hidden sidebar lg:hidden dynamic-sidebar-mobile", role: "dialog", "aria-modal": "true", children: [_jsx("div", { className: "fixed inset-0 bg-gray-900/80 sidebar-backdrop" }), _jsx("div", { className: "fixed inset-0 flex", children: _jsxs("div", { className: "relative mr-16 flex w-full max-w-xs flex-1 sidebar-menu", children: [_jsx("div", { className: "absolute left-full top-0 flex w-16 justify-center pt-5", children: _jsxs("button", { type: "button", className: "sidebar-close-button -m-2.5 p-2.5", children: [_jsx("span", { className: "sr-only", children: "Close sidebar" }), _jsx("svg", { className: "h-6 w-6 text-white", fill: "none", viewBox: "0 0 24 24", strokeWidth: "1.5", stroke: "currentColor", "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12" }) })] }) }), _jsxs("div", { className: "flex grow flex-col gap-y-5 overflow-y-auto bg-indigo-600 px-6 pb-4 sidebar-contents", children: [_jsx("div", { className: "flex h-16 shrink-0 items-center", children: _jsx(Logo, {}) }), _jsx("nav", { className: "flex flex-1 flex-col", children: _jsxs("ul", { role: "list", className: "flex flex-1 flex-col gap-y-7", children: [_jsx("li", { children: _jsx("ul", { role: "list", className: "-mx-2 space-y-1", children: userMenuItems.map(({ path, name, icon }, index) => (_jsx("li", { children: _jsxs("a", { href: path, className: `${pathname.startsWith(path)
                                                                            ? "bg-indigo-700 text-white"
                                                                            : "text-indigo-200 hover:text-white hover:bg-indigo-700"} group flex gap-x-3 rounded-md p-2 text-sm leading-6 font-semibold`, children: [icon, name] }) }, index))) }) }), _jsx("li", { className: "mt-auto", children: _jsxs("a", { href: "/settings", className: "group -mx-2 flex gap-x-3 rounded-md p-2 text-sm font-semibold leading-6 text-indigo-200 hover:bg-indigo-700 hover:text-white", children: [SETTINGS_ICON, "Settings"] }) })] }) })] })] }) })] }), _jsx("div", { className: "hidden lg:fixed lg:inset-y-0 lg:z-50 lg:flex lg:w-72 lg:flex-col dynamic-sidebar-desktop", children: _jsxs("div", { className: "flex grow flex-col gap-y-5 overflow-y-auto bg-indigo-600 px-6 pb-4", children: [_jsx("div", { className: "flex h-16 shrink-0 items-center", children: _jsx(Logo, {}) }), _jsx("nav", { className: "flex flex-1 flex-col", children: _jsxs("ul", { role: "list", className: "flex flex-1 flex-col gap-y-7", children: [_jsx("li", { children: _jsx("ul", { role: "list", className: "-mx-2 space-y-1", children: userMenuItems.map(({ path, name, icon }, index) => (_jsx("li", { children: _jsxs("a", { href: path, className: `${pathname.startsWith(path)
                                                            ? "bg-indigo-700 text-white"
                                                            : "text-indigo-200 hover:text-white hover:bg-indigo-700"} group flex gap-x-3 rounded-md p-2 text-sm leading-6 font-semibold`, children: [icon, name] }) }, index))) }) }), _jsx("li", { className: "mt-auto", children: _jsxs("a", { href: "/settings", className: "group -mx-2 flex gap-x-3 rounded-md p-2 text-sm font-semibold leading-6 text-indigo-200 hover:bg-indigo-700 hover:text-white", children: [SETTINGS_ICON, "Settings"] }) })] }) })] }) }), _jsxs("div", { className: "lg:pl-72", children: [_jsxs("div", { className: "sticky top-0 z-40 flex h-16 shrink-0 items-center gap-x-4 border-b border-gray-200 bg-white px-4 shadow-sm sm:gap-x-6 sm:px-6 lg:px-8", children: [_jsxs("button", { type: "button", className: "hidden script-visible sidebar-open-button -m-2.5 p-2.5 text-gray-700 lg:hidden", children: [_jsx("span", { className: "sr-only", children: "Open sidebar" }), _jsx("svg", { className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", strokeWidth: "1.5", stroke: "currentColor", "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" }) })] }), _jsx("div", { className: "h-6 w-px bg-gray-900/10 lg:hidden hidden script-visible", "aria-hidden": "true" }), _jsx("div", { className: "flex flex-1 gap-x-4 self-stretch lg:gap-x-6", children: _jsxs("form", { className: "relative flex flex-1", action: "/products", method: "GET", children: [_jsx("label", { htmlFor: "search-field", className: "sr-only", children: "Search Products" }), _jsx("svg", { className: "pointer-events-none absolute inset-y-0 left-0 h-full w-5 text-gray-400", viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true", children: _jsx("path", { fillRule: "evenodd", d: "M9 3.5a5.5 5.5 0 100 11 5.5 5.5 0 000-11zM2 9a7 7 0 1112.452 4.391l3.328 3.329a.75.75 0 11-1.06 1.06l-3.329-3.328A7 7 0 012 9z", clipRule: "evenodd" }) }), _jsx("input", { id: "search-field", className: "block h-full w-full border-0 py-0 pl-8 pr-0 text-gray-900 placeholder:text-gray-400 focus:ring-0 sm:text-sm", placeholder: "Search products...", type: "search", name: "search", defaultValue: search })] }) })] }), _jsx("main", { className: "py-10", children: _jsx("div", { className: "px-4 sm:px-6 lg:px-8", children: children }) })] })] }) }));
}
//# sourceMappingURL=layout.js.map