@solidjs/start 2.0.0-beta.0 → 2.0.0-beta.2

package/src/server/routes.ts

@@ -1,126 +0,0 @@
-// @ts-expect-error
-import fileRoutes from "solid-start:routes";
-import { createRouter } from "radix3";
-
-import type { FetchEvent } from "./types.ts";
-
-interface Route {
-  path: string;
-  id: string;
-  children?: Route[];
-  page?: boolean;
-  $component?: any;
-  $HEAD?: any;
-  $GET?: any;
-  $POST?: any;
-  $PUT?: any;
-  $PATCH?: any;
-  $DELETE?: any;
-}
-
-export const pageRoutes = defineRoutes((fileRoutes as unknown as Route[]).filter(o => o.page));
-
-function defineRoutes(fileRoutes: Route[]) {
-  function processRoute(routes: Route[], route: Route, id: string, full: string) {
-    const parentRoute = Object.values(routes).find(o => {
-      return id.startsWith(o.id + "/");
-    });
-
-    if (!parentRoute) {
-      routes.push({
-        ...route,
-        id,
-        path: id.replace(/\([^)/]+\)/g, "").replace(/\/+/g, "/"),
-      });
-      return routes;
-    }
-    processRoute(
-      parentRoute.children || (parentRoute.children = []),
-      route,
-      id.slice(parentRoute.id.length),
-      full,
-    );
-
-    return routes;
-  }
-
-  return fileRoutes
-    .sort((a, b) => a.path.length - b.path.length)
-    .reduce((prevRoutes: Route[], route) => {
-      return processRoute(prevRoutes, route, route.path, route.path);
-    }, []);
-}
-
-const router = createRouter({
-  routes: (fileRoutes as unknown as Route[]).reduce(
-    (memo, route) => {
-      if (!containsHTTP(route)) return memo;
-      const path = route.path
-        .replace(/\([^)/]+\)/g, "")
-        .replace(/\/+/g, "/")
-        .replace(/\*([^/]*)/g, (_, m) => `**:${m}`)
-        .split("/")
-        .map(s => (s.startsWith(":") || s.startsWith("*") ? s : encodeURIComponent(s)))
-        .join("/");
-      if (/:[^/]*\?/g.test(path)) {
-        throw new Error(`Optional parameters are not supported in API routes: ${path}`);
-      }
-      if (memo[path]) {
-        throw new Error(
-          `Duplicate API routes for "${path}" found at "${memo[path]!.route.path}" and "${
-            route.path
-          }"`,
-        );
-      }
-      memo[path] = { route };
-      return memo;
-    },
-    {} as Record<string, { route: Route }>,
-  ),
-});
-
-function containsHTTP(route: Route) {
-  return (
-    route["$HEAD"] ||
-    route["$GET"] ||
-    route["$POST"] ||
-    route["$PUT"] ||
-    route["$PATCH"] ||
-    route["$DELETE"]
-  );
-}
-
-export function matchAPIRoute(
-  path: string,
-  method: string,
-):
-  | {
-      params?: Record<string, any>;
-      handler: {
-        import: () => Promise<Record<string, (e: FetchEvent) => Promise<any>>>;
-      };
-      isPage: boolean;
-    }
-  | undefined {
-  const match = router.lookup(path);
-  if (match && match.route) {
-    const route = match.route;
-
-    // Find the appropriate handler for the HTTP method
-    const handler = method === "HEAD" ? route.$HEAD || route.$GET : route[`$${method}`];
-
-    if (handler === undefined) return;
-
-    // Check if this is a page route
-    const isPage = route.page === true && route.$component !== undefined;
-
-    // Return comprehensive route information
-    return {
-      handler,
-      params: match.params,
-      isPage,
-    };
-  }
-
-  return undefined;
-}

package/src/server/spa/StartServer.tsx

@@ -1,42 +0,0 @@
-// @refresh skip
-// @ts-ignore
-import type { Component } from "solid-js";
-import { NoHydration, getRequestEvent, ssr } from "solid-js/web";
-import { getSsrManifest } from "../manifest/ssr-manifest.ts";
-
-import { TopErrorBoundary } from "../../shared/ErrorBoundary.tsx";
-import { useAssets } from "../assets/index.ts";
-import PatchVirtualDevStyles from "../assets/PatchVirtualDevStyles.tsx";
-import type { DocumentComponentProps, PageEvent } from "../types.ts";
-
-const docType = ssr("<!DOCTYPE html>");
-
-/**
- *
- * Read more: https://docs.solidjs.com/solid-start/reference/server/start-server
- */
-export function StartServer(props: { document: Component<DocumentComponentProps> }) {
-  const context = getRequestEvent() as PageEvent;
-  // @ts-ignore
-  const nonce = context.nonce;
-  useAssets(context.assets, nonce);
-
-  return (
-    <NoHydration>
-      {docType as unknown as any}
-      <TopErrorBoundary>
-        <props.document
-          scripts={
-            <>
-              <PatchVirtualDevStyles nonce={nonce} />
-              <script
-                type="module"
-                src={getSsrManifest("client").path(import.meta.env.START_CLIENT_ENTRY)}
-              />
-            </>
-          }
-        />
-      </TopErrorBoundary>
-    </NoHydration>
-  );
-}

package/src/server/spa/handler.ts

@@ -1,29 +0,0 @@
-import type { JSX } from "solid-js";
-
-import { createBaseHandler } from "../handler.ts";
-import { getSsrManifest } from "../manifest/ssr-manifest.ts";
-import type { FetchEvent, HandlerOptions, PageEvent } from "../types.ts";
-
-/**
- *
- * Read more: https://docs.solidjs.com/solid-start/reference/server/create-handler
- */
-export function createHandler(
-  fn: (context: PageEvent) => JSX.Element,
-  options?: HandlerOptions | ((context: PageEvent) => HandlerOptions),
-) {
-  return createBaseHandler(createPageEvent, fn, options);
-}
-
-async function createPageEvent(ctx: FetchEvent) {
-  const manifest = getSsrManifest("ssr");
-  const pageEvent: PageEvent = Object.assign(ctx, {
-    manifest: "json" in manifest ? await manifest.json() : {},
-    assets: await manifest.getAssets(import.meta.env.START_CLIENT_ENTRY),
-    routes: [],
-    complete: false,
-    $islands: new Set<string>(),
-  });
-
-  return pageEvent;
-}

package/src/server/spa/index.tsx

@@ -1,5 +0,0 @@
-// @refresh skip
-export { default as lazy } from "../../shared/lazy.ts";
-export * from "../types.ts";
-export { StartServer } from "./StartServer.tsx";
-export { createHandler } from "./handler.ts";

package/src/server/types.ts

@@ -1,82 +0,0 @@
-import type { H3Event } from "h3";
-import type { JSX } from "solid-js";
-import type { RequestEvent } from "solid-js/web";
-
-// export const FETCH_EVENT = "$FETCH";
-
-export type DocumentComponentProps = {
-  assets?: JSX.Element;
-  scripts: JSX.Element;
-  children?: JSX.Element;
-};
-
-export type Asset =
-  | {
-      tag: "style";
-      attrs: JSX.StyleHTMLAttributes<HTMLStyleElement> & { key?: string };
-      children?: JSX.Element;
-    }
-  | {
-      tag: "script";
-      attrs: JSX.ScriptHTMLAttributes<HTMLScriptElement> & { key?: string };
-    }
-  | {
-      tag: "link";
-      attrs: JSX.LinkHTMLAttributes<HTMLLinkElement> & { key?: string };
-    };
-
-export type HandlerOptions = {
-  mode?: "sync" | "async" | "stream";
-  nonce?: string;
-  renderId?: string;
-  onCompleteAll?: (options: { write: (v: any) => void }) => void;
-  onCompleteShell?: (options: { write: (v: any) => void }) => void;
-};
-
-export type ContextMatches = {
-  originalPath: string;
-  pattern: string;
-  path: string;
-  params: unknown;
-};
-
-export interface ResponseStub {
-  status?: number;
-  statusText?: string;
-  headers: Headers;
-}
-
-export interface FetchEvent {
-  request: Request;
-  response: ResponseStub;
-  clientAddress?: string;
-  locals: App.RequestEventLocals;
-  nativeEvent: H3Event;
-}
-
-export interface PageEvent extends RequestEvent {
-  assets: any[];
-  routes: any[];
-  // prevUrl: string | null;
-  // $type: typeof FETCH_EVENT;
-  $islands: Set<string>;
-  complete: boolean;
-  nonce?: string;
-  // mutation: boolean;
-}
-
-export interface APIEvent extends FetchEvent {
-  params: { [key: string]: string };
-}
-
-export type APIHandler = (event: APIEvent) => any;
-
-export interface ServerFunctionMeta {
-  id: string;
-}
-
-declare module "solid-js/web" {
-  interface RequestEvent extends FetchEvent {
-    serverOnly?: boolean;
-  }
-}

package/src/server/util.ts

@@ -1,12 +0,0 @@
-import type { ResponseStub } from "./types.ts";
-
-// according to https://developer.mozilla.org/en-US/docs/Web/HTTP/Status#redirection_messages
-const validRedirectStatuses = new Set([301, 302, 303, 307, 308]);
-
-export function getExpectedRedirectStatus(response: ResponseStub): number {
-  if (response.status && validRedirectStatuses.has(response.status)) {
-    return response.status;
-  }
-
-  return 302;
-}

package/src/shared/ErrorBoundary.tsx

@@ -1,52 +0,0 @@
-// @refresh skip
-import { ErrorBoundary as DefaultErrorBoundary, catchError, type ParentProps } from "solid-js";
-import { isServer } from "solid-js/web";
-import { HttpStatusCode } from "./HttpStatusCode.ts";
-import { DevOverlay } from "./dev-overlay/index.tsx";
-
-export const ErrorBoundary =
-  import.meta.env.DEV && import.meta.env.START_DEV_OVERLAY
-    ? (props: ParentProps) => <DevOverlay>{props.children}</DevOverlay>
-    : (props: ParentProps) => {
-        const message = isServer
-          ? "500 | Internal Server Error"
-          : "Error | Uncaught Client Exception";
-        return (
-          <DefaultErrorBoundary
-            fallback={error => {
-              console.error(error);
-              return (
-                <>
-                  <span style="font-size:1.5em;text-align:center;position:fixed;left:0px;bottom:55%;width:100%;">
-                    {message}
-                  </span>
-                  <HttpStatusCode code={500} />
-                </>
-              );
-            }}
-          >
-            {props.children}
-          </DefaultErrorBoundary>
-        );
-      };
-
-export const TopErrorBoundary = (props: ParentProps) => {
-  let isError = false;
-  const res = catchError(
-    () => props.children,
-    err => {
-      console.error(err);
-      isError = !!err;
-    },
-  );
-  return isError ? (
-    <>
-      <span style="font-size:1.5em;text-align:center;position:fixed;left:0px;bottom:55%;width:100%;">
-        500 | Internal Server Error
-      </span>
-      <HttpStatusCode code={500} />
-    </>
-  ) : (
-    res
-  );
-};

package/src/shared/GET.ts

@@ -1,8 +0,0 @@
-// @refresh skip
-/**
- *
- * Read more: https://docs.solidjs.com/solid-start/reference/server/get
- */
-export function GET<T extends (...args: any[]) => any>(fn: T) {
-  return (fn as any).GET as (...args: Parameters<T>) => ReturnType<T>;
-}

package/src/shared/HttpHeader.tsx

@@ -1,42 +0,0 @@
-// @refresh skip
-import { onCleanup } from "solid-js";
-import { getRequestEvent, isServer } from "solid-js/web";
-
-import type { PageEvent } from "../server/types.ts";
-import { appendHeader, setHeader } from "../http/index.ts";
-
-export interface HttpHeaderProps {
-  name: string;
-  value: string;
-  append?: boolean;
-}
-
-/**
- *
- * Read more: https://docs.solidjs.com/solid-start/reference/server/http-header
- */
-export const HttpHeader = isServer
-  ? (props: HttpHeaderProps) => {
-      const event = getRequestEvent() as PageEvent;
-
-      if (props.append) appendHeader(props.name, props.value);
-      else setHeader(props.name, props.value);
-
-      onCleanup(() => {
-        // @ts-expect-error
-        if (event.nativeEvent.handled || event.complete) return;
-        const value = event.response.headers.get(props.name);
-        if (!value) return;
-        if (!value.includes(", ")) {
-          if (value === props.value) event.response.headers.delete(props.name);
-          return;
-        }
-        const values = value.split(", ");
-        const index = values.indexOf(props.value);
-        index !== -1 && values.splice(index, 1);
-        if (values.length) event.response.headers.set(props.name, values.join(","));
-        else event.response.headers.delete(props.name);
-      });
-      return null;
-    }
-  : (_props: HttpHeaderProps) => null;

package/src/shared/HttpStatusCode.ts

@@ -1,27 +0,0 @@
-// @refresh skip
-import { onCleanup } from "solid-js";
-import { getRequestEvent, isServer } from "solid-js/web";
-import type { PageEvent } from "../server/types.ts";
-
-export interface HttpStatusCodeProps {
-  code: number;
-  text?: string;
-}
-
-/**
- *
- * Read more: https://docs.solidjs.com/solid-start/reference/server/http-status-code
- */
-export const HttpStatusCode = isServer
-  ? (props: HttpStatusCodeProps) => {
-      const event = getRequestEvent() as PageEvent;
-      event.response.status = props.code;
-      event.response.statusText = props.text;
-      onCleanup(
-        () =>
-          // !event.nativeEvent.handled &&
-          !event.complete && (event.response.status = 200),
-      );
-      return null;
-    }
-  : (_props: HttpStatusCodeProps) => null;

package/src/shared/clientOnly.ts

@@ -1,44 +0,0 @@
-// @refresh skip
-import type { Component, ComponentProps, JSX, Setter } from "solid-js";
-import { createMemo, createSignal, onMount, sharedConfig, splitProps, untrack } from "solid-js";
-import { isServer } from "solid-js/web";
-
-/**
- *
- * Read more: https://docs.solidjs.com/solid-start/reference/client/client-only
- */
-// not using Suspense
-export default function clientOnly<T extends Component<any>>(
-  fn: () => Promise<{
-    default: T;
-  }>,
-  options: { lazy?: boolean } = {},
-) {
-  if (isServer) return (props: ComponentProps<T> & { fallback?: JSX.Element }) => props.fallback;
-
-  const [comp, setComp] = createSignal<T>();
-  !options.lazy && load(fn, setComp);
-  return (props: ComponentProps<T>) => {
-    let Comp: T | undefined;
-    let m: boolean;
-    const [, rest] = splitProps(props, ["fallback"]);
-    options.lazy && load(fn, setComp);
-    if ((Comp = comp()) && !sharedConfig.context) return Comp(rest);
-    const [mounted, setMounted] = createSignal(!sharedConfig.context);
-    onMount(() => setMounted(true));
-    return createMemo(
-      () => (
-        (Comp = comp()), (m = mounted()), untrack(() => (Comp && m ? Comp(rest) : props.fallback))
-      ),
-    );
-  };
-}
-
-function load<T>(
-  fn: () => Promise<{
-    default: T;
-  }>,
-  setComp: Setter<T>,
-) {
-  fn().then(m => setComp(() => m.default));
-}

package/src/shared/dev-overlay/CodeView.tsx

@@ -1,90 +0,0 @@
-// @refresh skip
-import { type BuiltinLanguage, getSingletonHighlighter, type Highlighter } from "shiki";
-import { loadWasm } from "shiki/engine/oniguruma";
-import langJS from "shiki/langs/javascript.mjs";
-import langJSX from "shiki/langs/jsx.mjs";
-import langTSX from "shiki/langs/tsx.mjs";
-import langTS from "shiki/langs/typescript.mjs";
-import url from "shiki/onig.wasm?url";
-import darkPlus from "shiki/themes/dark-plus.mjs";
-import { createEffect, createResource, type JSX } from "solid-js";
-
-let HIGHLIGHTER: Highlighter;
-
-async function loadHighlighter() {
-  if (!HIGHLIGHTER) {
-    await loadWasm(await fetch(url));
-    HIGHLIGHTER = await getSingletonHighlighter({
-      themes: [darkPlus],
-      langs: [langJS, langJSX, langTS, langTSX],
-    });
-  }
-  return HIGHLIGHTER;
-}
-
-export interface CodeViewProps {
-  fileName: string;
-  content: string;
-  line: number;
-}
-
-const RANGE = 8;
-
-export function CodeView(props: CodeViewProps): JSX.Element | null {
-  const lines = () =>
-    props.content.split("\n").map((item, index) => ({
-      index: index + 1,
-      line: item,
-    }));
-
-  const minLine = () => Math.max(props.line - (1 + RANGE), 0);
-  const maxLine = () => Math.min(props.line + RANGE, lines().length - 1);
-
-  let ref: HTMLDivElement | undefined;
-
-  const [data] = createResource(
-    () =>
-      lines()
-        .slice(minLine(), maxLine())
-        .map(item => item.line)
-        .join("\n"),
-    async value => {
-      const highlighter = await loadHighlighter();
-      const fileExtension = props.fileName.split(/[#?]/)[0]!.split(".").pop()?.trim();
-      let lang = fileExtension as BuiltinLanguage;
-      if (fileExtension === "mjs" || fileExtension === "cjs") {
-        lang = "js";
-      }
-      return highlighter.codeToHtml(value, {
-        theme: "dark-plus",
-        lang,
-      });
-    },
-  );
-
-  createEffect(() => {
-    const result = data();
-    if (ref && result) {
-      ref.innerHTML = result;
-
-      const lines = ref.querySelectorAll('span[class="line"]');
-
-      for (let i = 0, len = lines.length; i < len; i++) {
-        const el = lines[i] as HTMLElement;
-        if (props.line - minLine() - 1 === i) {
-          el.dataset.startDevOverlayErrorLine = '';
-        }
-      }
-    }
-  });
-
-  return (
-    <div
-      ref={ref}
-      data-start-dev-overlay-code-view
-      style={{
-        "--dev-overlay-code-view-start": minLine() + 1,
-      }}
-    />
-  );
-}