@kasperrt/smolter 0.2.0 → 0.3.1

package/.generated/preact/lazy-route.ts

@@ -0,0 +1,100 @@
+import { serverRoute } from "../client/index.ts";
+import type { DataArgs, RouteModule, Router } from "../core/index.ts";
+import { type ComponentType, createElement } from "preact";
+import { useRouter } from "./context.ts";
+import type { AppRoute } from "./route-types.ts";
+import type { ErrorProps } from "./routes.ts";
+import { useSyncExternalStore } from "./runtime.ts";
+
+export interface LazyRouteOptions {
+  path: string;
+  id?: string;
+  loader?: boolean;
+  action?: boolean;
+  clientAction?: boolean;
+  meta?: boolean;
+  shouldRevalidate?: boolean;
+  ErrorBoundary?: boolean;
+}
+
+type LoadedRoute = RouteModule & Pick<AppRoute, "meta">;
+
+interface LazyAppRoute extends AppRoute {
+  resolveComponent: () => ComponentType | undefined;
+}
+
+// A shared wrapper preserves component identity across routes using the same view.
+function LazyView() {
+  const router = useRouter<Router>();
+  const { path } = useSyncExternalStore(router.subscribe, router.getSnapshot);
+  const route = router.routes.find((item) => item.path === path) as
+    | LazyAppRoute
+    | undefined;
+  const Component = route?.resolveComponent();
+
+  return Component && createElement(Component, {});
+}
+
+export function lazyRoute(
+  options: LazyRouteOptions,
+  importer: () => Promise<LoadedRoute>,
+): LazyAppRoute {
+  let module: LoadedRoute | undefined;
+  let pending: Promise<void> | undefined;
+
+  function preload() {
+    pending ??= importer()
+      .then((loaded) => {
+        module = serverRoute(options.path, loaded, {
+          loader: options.loader,
+          action: options.action,
+        });
+      })
+      .catch((error: unknown) => {
+        pending = undefined;
+        throw error;
+      });
+
+    return pending;
+  }
+
+  async function run(args: DataArgs, action = false) {
+    await preload();
+
+    if (args.signal.aborted) return new Error("Navigation cancelled");
+
+    const handler = action
+      ? (module!.clientAction ?? module!.action)
+      : (module!.clientLoader ?? module!.loader);
+
+    // serverRoute supplies serverLoader/serverAction to client handlers.
+    return (handler as ((args: DataArgs) => unknown) | undefined)?.(args);
+  }
+
+  function ErrorBoundary(props: ErrorProps) {
+    const Component = module?.ErrorBoundary as
+      | ComponentType<ErrorProps>
+      | undefined;
+
+    if (!Component) return props.error.message;
+
+    return createElement(Component, props);
+  }
+
+  return {
+    path: options.path,
+    id: options.id,
+    preload,
+    default: LazyView,
+    resolveComponent: () => module?.default as ComponentType | undefined,
+    clientLoader: (args) => run(args),
+    ...((options.action || options.clientAction) && {
+      clientAction: (args: DataArgs) => run(args, true),
+    }),
+    ...(options.meta && { meta: (args) => module?.meta?.(args) ?? [] }),
+    ...(options.shouldRevalidate && {
+      shouldRevalidate: (args) => module?.shouldRevalidate?.(args) ?? true,
+    }),
+    ...(options.ErrorBoundary && { ErrorBoundary }),
+  };
+}

package/.generated/preact/navigation-state.ts

@@ -0,0 +1,9 @@
+import type { Router } from "../core/index.ts";
+import { navigationStore } from "../core/navigation.ts";
+import { useSyncExternalStore } from "./runtime.ts";
+
+export function useNavigationSnapshot(router: Router) {
+  const store = navigationStore(router);
+
+  return useSyncExternalStore(store.subscribe, store.getSnapshot);
+}

package/.generated/preact/navigation.tsx

@@ -0,0 +1,147 @@
+import { matchRoutes, type NavigateOptions } from "../core/index.ts";
+import {
+  handoffDocument,
+  resolveApplicationURL,
+} from "../core/environment.ts";
+import { navigationClick } from "../core/url.ts";
+import type { TargetedMouseEvent } from "preact";
+import type { ComponentProps, ReactNode } from "preact/compat";
+import { useRouter, useSnapshot } from "./context.ts";
+import { useURLLocation } from "./route-hooks.tsx";
+import type { AppRoute } from "./route-types.ts";
+import { createElement } from "./runtime.ts";
+
+export type { NavigateOptions } from "../core/index.ts";
+
+export type { NavigationType } from "../core/navigation.ts";
+
+export type NavigateFunction = (
+  to: string | number | Partial<Pick<URL, "pathname" | "search" | "hash">>,
+  options?: NavigateOptions,
+) => void;
+
+export interface LinkProps extends Omit<ComponentProps<"a">, "href" | "role"> {
+  to?: string;
+  href?: string;
+  replace?: boolean;
+  role?:
+    | "link"
+    | "button"
+    | "checkbox"
+    | "menuitem"
+    | "menuitemcheckbox"
+    | "menuitemradio"
+    | "option"
+    | "radio"
+    | "switch"
+    | "tab"
+    | "treeitem"
+    | "doc-backlink"
+    | "doc-biblioref"
+    | "doc-glossref"
+    | "doc-noteref";
+  prefetch?: string;
+  state?: unknown;
+  preventScrollReset?: boolean;
+  viewTransition?: boolean;
+  reloadDocument?: boolean;
+}
+
+export interface NavLinkRenderProps {
+  isActive: boolean;
+  isPending: boolean;
+}
+
+export interface NavLinkProps
+  extends Omit<LinkProps, "className" | "children"> {
+  end?: boolean;
+  className?: string | ((state: NavLinkRenderProps) => string);
+  children?: ReactNode | ((state: NavLinkRenderProps) => ReactNode);
+}
+
+export function Link(options: LinkProps): ReactNode {
+  const {
+    href: hrefProp,
+    to = hrefProp ?? "/",
+    replace,
+    preventScrollReset,
+    viewTransition,
+    prefetch,
+    state,
+    reloadDocument,
+    ...props
+  } = options;
+  const router = useRouter();
+  const current = new URL(useSnapshot("url"));
+  const destination = resolveApplicationURL(new URL(to, current));
+  const internal = destination.origin === current.origin;
+  const preload = () => {
+    const route = matchRoutes(router.routes, destination.pathname)?.route as
+      | AppRoute
+      | undefined;
+
+    void route?.preload?.().catch(() => {});
+  };
+
+  if (!reloadDocument && prefetch !== "none" && internal) {
+    for (const name of ["onPointerEnter", "onFocus", "onTouchStart"] as const) {
+      const handler = props[name] as ((event: Event) => void) | undefined;
+
+      props[name] = (event) => {
+        handler?.(event);
+        preload();
+      };
+    }
+  }
+
+  return createElement("a", {
+    ...props,
+    href: destination.href,
+    onClick(event: TargetedMouseEvent<HTMLAnchorElement>) {
+      props.onClick?.(event);
+
+      if (reloadDocument || !navigationClick(event, event.currentTarget))
+        return;
+
+      if (!internal) {
+        handoffDocument(event, destination);
+
+        return;
+      }
+
+      event.preventDefault();
+      void router.navigate(destination.href, options);
+    },
+  });
+}
+
+export function NavLink({
+  href,
+  to = href ?? "/",
+  end,
+  className,
+  children,
+  ...props
+}: NavLinkProps): ReactNode {
+  const location = useURLLocation();
+  const target = new URL(to, location.href).pathname;
+  const isActive =
+    location.pathname === target ||
+    (!end && target !== "/" && location.pathname.startsWith(`${target}/`));
+  const state = { isActive, isPending: false };
+
+  return createElement(Link, {
+    ...props,
+    to,
+    className: typeof className === "function" ? className(state) : className,
+    ...(isActive && { "aria-current": "page" }),
+    children: typeof children === "function" ? children(state) : children,
+  });
+}
+
+export {
+  useNavigate,
+  useNavigationType,
+  useSearchParams,
+  useURLLocation,
+} from "./route-hooks.tsx";

package/.generated/preact/root-context.ts

@@ -0,0 +1,21 @@
+import type { Router } from "../core/index.ts";
+import type { AppRoute, Hydration, RootModule } from "./route-types.ts";
+import { createContext, useContext } from "./runtime.ts";
+
+export interface ApplicationContext {
+  router: Router;
+  routes: AppRoute[];
+  root: unknown;
+  rootModule?: RootModule;
+  hydration?: Hydration;
+  entry?: string;
+}
+
+export const Application = createContext<ApplicationContext | null>(null);
+export const OutletContext = createContext<unknown>(undefined);
+
+export function useApplication() {
+  const app = useContext(Application);
+
+  return app!;
+}

package/.generated/preact/root-data.ts

@@ -0,0 +1,45 @@
+import type { Router } from "../core/index.ts";
+import type { RootModule } from "./route-types.ts";
+
+export { createStore as createRootStore } from "../core/store.ts";
+
+import { createStore } from "../core/store.ts";
+
+export function attachRootData(
+  router: Router,
+  initial: unknown,
+  rootModule?: RootModule,
+) {
+  const store = createStore(initial);
+  const loaderPath = rootModule?.loaderPath;
+
+  if (!rootModule || !loaderPath) return store;
+
+  let pending: ReturnType<Router["createFetcher"]> | undefined;
+  const unregister = router.registerRevalidator(
+    rootModule.id ?? "root",
+    async (args) => {
+      if (rootModule.shouldRevalidate?.(args) === false) return;
+
+      pending?.dispose();
+      const fetcher = router.createFetcher();
+      pending = fetcher;
+      const result = await fetcher.load(loaderPath);
+
+      if (pending === fetcher && !result.error) store.update(result.data);
+
+      fetcher.dispose();
+
+      if (pending === fetcher) pending = undefined;
+    },
+  );
+  const dispose = router.dispose;
+  router.dispose = () => {
+    pending?.dispose();
+    pending = undefined;
+    unregister();
+    dispose();
+  };
+
+  return store;
+}

package/.generated/preact/route-hooks.tsx

@@ -0,0 +1,170 @@
+import type { NavigateOptions, Router, SubmitOptions } from "../core/index.ts";
+import type { NavigationType } from "../core/navigation.ts";
+import { pendingLocation } from "../core/presentation.ts";
+import {
+  type Submission,
+  type SubmissionOptions,
+  submissionBody,
+  submissionSearch,
+} from "../core/submission.ts";
+import { useCallback } from "preact/hooks";
+import { useRouter, useSnapshot } from "./context.ts";
+import type { NavigateFunction } from "./navigation.tsx";
+import { useNavigationSnapshot } from "./navigation-state.ts";
+import { OutletContext, useApplication } from "./root-context.ts";
+import type { RouteData } from "./route-types.ts";
+import { useContext, useMemo } from "./runtime.ts";
+
+export function useRootData<T = unknown>(): RouteData<T> {
+  return useApplication().root as RouteData<T>;
+}
+
+/** Read root data or the active route's data by its manifest identifier. */
+export function useRouteLoaderData<T = unknown>(
+  id: string,
+): RouteData<T> | undefined {
+  const app = useApplication();
+  const snapshot = useSnapshot();
+
+  if (id === "root") return app.root as RouteData<T>;
+
+  const route = app.routes.find((item) => item.id === id);
+
+  if (!route || route.path !== snapshot.path) return undefined;
+
+  return snapshot.data as RouteData<T>;
+}
+
+export { useSnapshot };
+
+export function useRouteError(): Error | undefined {
+  return useSnapshot("error");
+}
+
+export function useNavigation(): {
+  state: "idle" | "loading" | "submitting";
+  location: URL | undefined;
+} {
+  const router = useRouter<Router>();
+  const snapshot = useSnapshot();
+  const location = pendingLocation(router);
+
+  return useMemo(
+    () => ({
+      state: snapshot.state,
+      location,
+    }),
+    [snapshot.state, location?.href],
+  );
+}
+
+export function useMatches(): {
+  id: string;
+  data: unknown;
+  params: import("../core/index.ts").Params;
+}[] {
+  const { routes } = useApplication();
+  const snapshot = useSnapshot();
+  const route = routes.find((item) => item.path === snapshot.path);
+
+  return [
+    { id: route?.id ?? "", data: snapshot.data, params: snapshot.params },
+  ];
+}
+
+export function useOutletContext<T>(): T {
+  return useContext(OutletContext) as T;
+}
+
+export function useSubmit(): (
+  value: Submission,
+  options?: SubmissionOptions,
+) => Promise<void> | Promise<import("../core/index.ts").Result<unknown>> {
+  const router = useRouter<Router>();
+
+  return useCallback(
+    (value: Submission, options: SubmissionOptions = {}) => {
+      const body = submissionBody(value, options.encType);
+      const method = options.method?.toUpperCase();
+      const target = options.action ?? router.getSnapshot().url;
+
+      if (method === "GET") {
+        const url = new URL(target, router.getSnapshot().url);
+        url.search = submissionSearch(body);
+
+        return router.navigate(url.href, options);
+      }
+
+      return router.submit(target, body, {
+        method: method as SubmitOptions["method"],
+      });
+    },
+    [router],
+  );
+}
+
+export function useURLLocation(): URL & { state: unknown; key: string } {
+  const href = useSnapshot("url");
+  const snapshot = useNavigationSnapshot(useRouter<Router>());
+
+  return useMemo(
+    () =>
+      Object.assign(new URL(href), {
+        state: snapshot.state,
+        key: snapshot.key,
+      }),
+    [href, snapshot.state, snapshot.key],
+  );
+}
+
+export function useNavigate(): NavigateFunction {
+  const router = useRouter<Router>();
+
+  return useCallback(
+    (to, options) => {
+      if (typeof to === "number") {
+        window.history.go(to);
+
+        return;
+      }
+
+      const current = new URL(router.getSnapshot().url);
+      const target =
+        typeof to === "string"
+          ? to
+          : `${to.pathname ?? current.pathname}${to.search ?? current.search}${to.hash ?? current.hash}`;
+      void router.navigate(target, options);
+    },
+    [router],
+  );
+}
+
+export function useSearchParams(): [
+  URLSearchParams,
+  (
+    value: URLSearchParams | Record<string, string>,
+    options?: NavigateOptions,
+  ) => void,
+] {
+  const location = useURLLocation();
+  const navigate = useNavigate();
+  const params = useMemo(
+    () => new URLSearchParams(location.search),
+    [location.search],
+  );
+  const set = useCallback(
+    (
+      value: URLSearchParams | Record<string, string>,
+      options?: NavigateOptions,
+    ) => {
+      navigate(`${location.pathname}?${new URLSearchParams(value)}`, options);
+    },
+    [location.pathname, navigate],
+  );
+
+  return [params, set];
+}
+
+export function useNavigationType(): NavigationType {
+  return useNavigationSnapshot(useRouter<Router>()).type;
+}

package/.generated/preact/route-types.ts

@@ -0,0 +1,76 @@
+import type {
+  DataArgs,
+  RevalidationArgs,
+  Route,
+  Snapshot,
+} from "../core/index.ts";
+import type { DataResponse } from "../core/responses.ts";
+import type { ComponentType, ReactNode } from "preact/compat";
+
+export interface LoaderFunctionArgs extends DataArgs {
+  context?: unknown;
+}
+
+export type ActionFunctionArgs = LoaderFunctionArgs;
+
+export interface ClientLoaderFunctionArgs extends LoaderFunctionArgs {
+  serverLoader: <T = unknown>() => Promise<T>;
+}
+
+export interface ClientActionFunctionArgs extends LoaderFunctionArgs {
+  serverAction: <T = unknown>() => Promise<T>;
+}
+
+export type ShouldRevalidateFunctionArgs = RevalidationArgs;
+
+type UnwrapData<T> = T extends DataResponse<infer V> ? V : T;
+
+export type RouteData<T> = T extends (...args: never[]) => infer R
+  ? UnwrapData<Exclude<Awaited<R>, Response | Error>>
+  : T;
+
+export type MetaDescriptor = Record<string, unknown>;
+
+export interface MetaArgs<T> {
+  data: RouteData<T> | undefined;
+  loaderData: RouteData<T> | undefined;
+  error?: unknown;
+  params: Record<string, string>;
+  location: URL;
+}
+
+export type MetaFunction<T = unknown> = (args: MetaArgs<T>) => MetaDescriptor[];
+
+export type LinksFunction = () => Record<string, string>[];
+
+export interface AppRoute extends Route {
+  resolveComponent?: () => ComponentType | undefined;
+  preload?: () => Promise<void>;
+  id?: string;
+  routePath?: string;
+  meta?: MetaFunction;
+}
+
+export interface RootModule {
+  /** Route identity used by targeted revalidation. Defaults to root. */
+  id?: string;
+  /** Optional registered route URL used to revalidate root data after mutations. */
+  loaderPath?: string;
+  ErrorBoundary?: ComponentType;
+  default: ComponentType;
+  Layout: ComponentType<{ children: ReactNode }>;
+  loader?: (args: LoaderFunctionArgs) => unknown;
+  links?: LinksFunction;
+  meta?: MetaFunction;
+  shouldRevalidate?: (args: RevalidationArgs) => boolean;
+}
+
+export interface Hydration {
+  root: unknown;
+  snapshot: Snapshot;
+}
+
+export type HandleDataRequestFunction = (
+  response: Response,
+  args: LoaderFunctionArgs,
+) => Response | Promise<Response>;

package/.generated/preact/router.tsx

@@ -0,0 +1,107 @@
+/** @jsxImportSource preact */
+
+import type { DataFunction } from "../core/index.ts";
+import { normalizeResult } from "../core/responses.ts";
+import type { ReactNode } from "preact/compat";
+import { RouterProvider } from "./context.ts";
+import {
+  Application,
+  type ApplicationContext,
+  OutletContext,
+} from "./root-context.ts";
+import { createRootStore } from "./root-data.ts";
+import type { AppRoute } from "./route-types.ts";
+import { Routes } from "./routes.ts";
+import { useContext, useMemo, useSyncExternalStore } from "./runtime.ts";
+
+export interface OutletProps {
+  context?: unknown;
+  children?: ReactNode;
+}
+
+export function Outlet({
+  context,
+  children,
+}: OutletProps): import("preact").JSX.Element {
+  const current = useContext(OutletContext);
+
+  return (
+    <OutletContext value={context ?? current}>
+      {children ?? <Routes fallback={<p role="status">Loading…</p>} />}
+    </OutletContext>
+  );
+}
+
+export interface ApplicationProps extends ApplicationContext {
+  document?: boolean;
+  rootStore?: ReturnType<typeof createRootStore>;
+}
+
+export function RouterApplication(
+  props: ApplicationProps,
+): import("preact").JSX.Element {
+  const rootStore = useMemo(
+    () => props.rootStore ?? createRootStore(props.root),
+    [props.rootStore, props.root],
+  );
+  const root = useSyncExternalStore(rootStore.subscribe, rootStore.getSnapshot);
+  const snapshot = useSyncExternalStore(
+    props.router.subscribe,
+    props.router.getSnapshot,
+  );
+  const route = props.routes.find((item) => item.path === snapshot.path);
+  const Root =
+    snapshot.error && !route?.ErrorBoundary
+      ? (props.rootModule?.ErrorBoundary ?? Outlet)
+      : (props.rootModule?.default ?? Outlet);
+  const Layout = props.rootModule?.Layout;
+  const children = <Root />;
+
+  return (
+    <RouterProvider router={props.router}>
+      <Application value={{ ...props, root }}>
+        {props.document ? Layout && <Layout>{children}</Layout> : children}
+      </Application>
+    </RouterProvider>
+  );
+}
+
+export function prepareRoutes(routes: AppRoute[]): AppRoute[] {
+  return routes.map((route) => {
+    const wrapped: AppRoute = {
+      ...route,
+      path: route.routePath ?? route.path,
+      shouldRevalidate: (args) => {
+        const { currentUrl, nextUrl } = args;
+
+        if (
+          args.reason === "navigation" &&
+          currentUrl.pathname === nextUrl.pathname &&
+          currentUrl.search === nextUrl.search &&
+          currentUrl.hash !== nextUrl.hash
+        )
+          return false;
+
+        return route.shouldRevalidate?.(args) ?? args.defaultShouldRevalidate;
+      },
+    };
+
+    for (const key of [
+      "loader",
+      "action",
+      "clientLoader",
+      "clientAction",
+    ] as const) {
+      const handler = route[key] as DataFunction | undefined;
+
+      if (!handler) continue;
+
+      wrapped[key] = (args) =>
+        Promise.resolve()
+          .then(() => handler(args))
+          .then(normalizeResult, normalizeResult);
+    }
+
+    return wrapped;
+  });
+}