@webtypen/webframez-react 0.0.1

package/dist/router.js

@@ -0,0 +1,355 @@
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined")
+    return require.apply(this, arguments);
+  throw Error('Dynamic require of "' + x + '" is not supported');
+});
+
+// src/file-router.tsx
+import fs from "node:fs";
+import path from "node:path";
+
+// src/router-runtime.tsx
+import React from "react";
+var ROUTE_CHILDREN_TAG = "webframez-route-children";
+var ROUTE_CHILDREN_SENTINEL = "__webframezRouteChildren";
+var ROUTE_CHILDREN_DISPLAY_NAME = "WebframezRouteChildren";
+var RouteChildrenImpl = () => React.createElement(ROUTE_CHILDREN_TAG);
+RouteChildrenImpl.displayName = ROUTE_CHILDREN_DISPLAY_NAME;
+RouteChildrenImpl[ROUTE_CHILDREN_SENTINEL] = true;
+var RouteChildren = RouteChildrenImpl;
+function isRouteChildrenType(type) {
+  if (type === ROUTE_CHILDREN_TAG || type === RouteChildren) {
+    return true;
+  }
+  if (!type || typeof type !== "function" && typeof type !== "object") {
+    return false;
+  }
+  try {
+    const candidate = type;
+    return candidate[ROUTE_CHILDREN_SENTINEL] === true || candidate.displayName === ROUTE_CHILDREN_DISPLAY_NAME || candidate.name === "RouteChildren";
+  } catch {
+    return false;
+  }
+}
+function injectRouteChildren(node, routeChildren) {
+  if (node === null || node === void 0 || typeof node === "boolean") {
+    return node;
+  }
+  if (Array.isArray(node)) {
+    let changed = false;
+    const next = node.map((child) => {
+      const injected = injectRouteChildren(child, routeChildren);
+      if (injected !== child) {
+        changed = true;
+      }
+      return injected;
+    });
+    return changed ? next : node;
+  }
+  if (!React.isValidElement(node)) {
+    return node;
+  }
+  if (isRouteChildrenType(node.type)) {
+    return routeChildren;
+  }
+  const props = node.props;
+  if (!("children" in props)) {
+    return node;
+  }
+  const nextChildren = injectRouteChildren(props.children, routeChildren);
+  if (nextChildren === props.children) {
+    return node;
+  }
+  if (Array.isArray(nextChildren)) {
+    return React.cloneElement(node, void 0, ...nextChildren);
+  }
+  return React.cloneElement(node, void 0, nextChildren);
+}
+
+// src/file-router.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function normalizePathname(pathname) {
+  const trimmed = pathname.replace(/\/+$/, "") || "/";
+  return trimmed.startsWith("/") ? trimmed : `/${trimmed}`;
+}
+function splitSegments(pathname) {
+  const normalized = normalizePathname(pathname);
+  if (normalized === "/") {
+    return [];
+  }
+  return normalized.slice(1).split("/").filter(Boolean);
+}
+function walkFiles(dir) {
+  if (!fs.existsSync(dir)) {
+    return [];
+  }
+  const result = [];
+  const stack = [dir];
+  while (stack.length > 0) {
+    const current = stack.pop();
+    if (!current) {
+      continue;
+    }
+    for (const entry of fs.readdirSync(current, { withFileTypes: true })) {
+      const fullPath = path.join(current, entry.name);
+      if (entry.isDirectory()) {
+        stack.push(fullPath);
+      } else if (entry.isFile()) {
+        result.push(fullPath);
+      }
+    }
+  }
+  return result;
+}
+function readSearchParams(urlSearchParams) {
+  const output = {};
+  for (const key of urlSearchParams.keys()) {
+    const values = urlSearchParams.getAll(key);
+    output[key] = values.length <= 1 ? values[0] ?? "" : values;
+  }
+  return output;
+}
+function escapeHtml(value) {
+  return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/\"/g, "&quot;").replace(/'/g, "&#39;");
+}
+function toRouteEntry(pagesDir, filePath) {
+  const normalized = filePath.replace(/\\/g, "/");
+  if (!normalized.endsWith("/index.js")) {
+    return null;
+  }
+  const relativeDir = path.dirname(path.relative(pagesDir, filePath)).replace(/\\/g, "/");
+  const segments = relativeDir === "." ? [] : relativeDir.split("/").filter(Boolean);
+  const staticCount = segments.filter((segment) => !segment.startsWith("[")).length;
+  return {
+    filePath,
+    segments,
+    staticCount
+  };
+}
+function matchRoute(entry, pathname) {
+  const targetSegments = splitSegments(pathname);
+  if (entry.segments.length !== targetSegments.length) {
+    return null;
+  }
+  const params = {};
+  for (let index = 0; index < entry.segments.length; index += 1) {
+    const routeSegment = entry.segments[index];
+    const targetSegment = targetSegments[index];
+    if (routeSegment.startsWith("[") && routeSegment.endsWith("]")) {
+      const paramName = routeSegment.slice(1, -1);
+      if (!paramName) {
+        return null;
+      }
+      params[paramName] = decodeURIComponent(targetSegment);
+      continue;
+    }
+    if (routeSegment !== targetSegment) {
+      return null;
+    }
+  }
+  return params;
+}
+function mergeHead(...configs) {
+  const merged = {
+    meta: [],
+    links: []
+  };
+  for (const config of configs) {
+    if (!config) {
+      continue;
+    }
+    if (config.title) {
+      merged.title = config.title;
+    }
+    if (config.description) {
+      merged.description = config.description;
+    }
+    if (config.favicon) {
+      merged.favicon = config.favicon;
+    }
+    if (config.meta) {
+      merged.meta?.push(...config.meta);
+    }
+    if (config.links) {
+      merged.links?.push(...config.links);
+    }
+  }
+  return merged;
+}
+function renderHeadToString(head) {
+  const tags = [];
+  if (head.description) {
+    tags.push(
+      `<meta name="description" content="${escapeHtml(head.description)}" />`
+    );
+  }
+  if (head.favicon) {
+    tags.push(`<link rel="icon" href="${escapeHtml(head.favicon)}" />`);
+  }
+  for (const meta of head.meta ?? []) {
+    const attrs = Object.entries(meta).filter(([, value]) => Boolean(value)).map(([key, value]) => `${key}="${escapeHtml(String(value))}"`).join(" ");
+    tags.push(`<meta ${attrs} />`);
+  }
+  for (const link of head.links ?? []) {
+    const attrs = Object.entries(link).filter(([, value]) => Boolean(value)).map(([key, value]) => `${key}="${escapeHtml(String(value))}"`).join(" ");
+    tags.push(`<link ${attrs} />`);
+  }
+  return tags.join("\n");
+}
+function resolveModule(modulePath) {
+  delete __require.cache[modulePath];
+  return __require(modulePath);
+}
+async function resolveHead(candidate, context) {
+  if (!candidate.Head) {
+    return void 0;
+  }
+  return candidate.Head(context);
+}
+function findBestMatch(entries, pathname) {
+  const matches = [];
+  for (const entry of entries) {
+    const params = matchRoute(entry, pathname);
+    if (params) {
+      matches.push({ entry, params });
+    }
+  }
+  matches.sort((a, b) => {
+    if (b.entry.staticCount !== a.entry.staticCount) {
+      return b.entry.staticCount - a.entry.staticCount;
+    }
+    return b.entry.segments.length - a.entry.segments.length;
+  });
+  return matches[0] ?? null;
+}
+function normalizeAbortStatus(value) {
+  if (typeof value !== "number" || !Number.isFinite(value)) {
+    return 404;
+  }
+  const normalized = Math.trunc(value);
+  if (normalized < 100 || normalized > 599) {
+    return 404;
+  }
+  return normalized;
+}
+function createAbort(options) {
+  return {
+    __webframezRouteAbort: true,
+    statusCode: normalizeAbortStatus(options?.status),
+    message: options?.message?.trim() || "Page not found",
+    payload: options?.payload
+  };
+}
+function isRouteAbort(value) {
+  if (!value || typeof value !== "object") {
+    return false;
+  }
+  try {
+    return value.__webframezRouteAbort === true;
+  } catch {
+    return false;
+  }
+}
+function createFileRouter(options) {
+  const pagesDir = options.pagesDir;
+  const layoutPath = path.join(pagesDir, "layout.js");
+  const errorPath = path.join(pagesDir, "errors.js");
+  function buildRouteEntries() {
+    const files = walkFiles(pagesDir);
+    return files.map((filePath) => toRouteEntry(pagesDir, filePath)).filter((entry) => entry !== null).sort((a, b) => {
+      if (b.staticCount !== a.staticCount) {
+        return b.staticCount - a.staticCount;
+      }
+      return b.segments.length - a.segments.length;
+    });
+  }
+  async function renderError(context, statusCode, message, payload) {
+    const errorProps = {
+      ...context,
+      statusCode,
+      message,
+      payload
+    };
+    const layoutModule = fs.existsSync(layoutPath) ? resolveModule(layoutPath) : null;
+    if (!fs.existsSync(errorPath)) {
+      const fallback = /* @__PURE__ */ jsxs("main", { style: { fontFamily: "system-ui, sans-serif", padding: 24 }, children: [
+        /* @__PURE__ */ jsx("h1", { children: statusCode }),
+        /* @__PURE__ */ jsx("p", { children: message })
+      ] });
+      return {
+        statusCode,
+        model: fallback,
+        head: {
+          title: `${statusCode} - ${message}`
+        }
+      };
+    }
+    const errorModule = resolveModule(errorPath);
+    const errorNode = errorModule.default(errorProps);
+    const layoutHead = layoutModule ? await resolveHead(layoutModule, context) : void 0;
+    const errorHead = await resolveHead(errorModule, errorProps);
+    const model = layoutModule ? injectRouteChildren(layoutModule.default(context), errorNode) : errorNode;
+    return {
+      statusCode,
+      model,
+      head: mergeHead(layoutHead, errorHead)
+    };
+  }
+  async function resolve(input) {
+    const pathname = normalizePathname(input.pathname);
+    const contextBase = {
+      pathname,
+      params: {},
+      searchParams: input.searchParams,
+      cookies: input.cookies ?? {},
+      abort: (options2) => {
+        throw createAbort(options2);
+      }
+    };
+    let activeContext = contextBase;
+    try {
+      const entries = buildRouteEntries();
+      const match = findBestMatch(entries, pathname);
+      if (!match) {
+        return renderError(contextBase, 404, "Page not found");
+      }
+      const context = {
+        ...contextBase,
+        params: match.params
+      };
+      activeContext = context;
+      const pageModule = resolveModule(match.entry.filePath);
+      const layoutModule = fs.existsSync(layoutPath) ? resolveModule(layoutPath) : null;
+      const pageNode = pageModule.default(context);
+      const layoutHead = layoutModule ? await resolveHead(layoutModule, context) : void 0;
+      const pageHead = await resolveHead(pageModule, context);
+      const model = layoutModule ? injectRouteChildren(layoutModule.default(context), pageNode) : pageNode;
+      return {
+        statusCode: 200,
+        model,
+        head: mergeHead(layoutHead, pageHead)
+      };
+    } catch (error) {
+      if (isRouteAbort(error)) {
+        return renderError(activeContext, error.statusCode, error.message, error.payload);
+      }
+      console.error("[webframez-react] Failed to resolve route", error);
+      return renderError(contextBase, 500, "Internal server error");
+    }
+  }
+  return {
+    resolve,
+    readSearchParams
+  };
+}
+function parseSearchParams(query) {
+  return readSearchParams(query);
+}
+export {
+  RouteChildren,
+  createFileRouter,
+  parseSearchParams,
+  renderHeadToString
+};

package/dist/types.cjs

@@ -0,0 +1,17 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/types.ts
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);

package/dist/types.d.ts

@@ -0,0 +1,87 @@
+import type { ReactNode } from "react";
+
+export type RouteParams = Record<string, string>;
+export type RouteSearchParams = Record<string, string | string[]>;
+
+export type AbortRouteOptions = {
+  status?: number;
+  message?: string;
+  payload?: unknown;
+};
+
+export type RouteContext = {
+  pathname: string;
+  params: RouteParams;
+  searchParams: RouteSearchParams;
+  cookies: Record<string, string>;
+  abort: (options?: AbortRouteOptions) => never;
+};
+
+export type PageProps = RouteContext;
+
+export type ErrorPageProps = RouteContext & {
+  statusCode: number;
+  message: string;
+  payload?: unknown;
+};
+
+export type HeadMetaTag = {
+  name?: string;
+  property?: string;
+  content: string;
+  httpEquiv?: string;
+  charset?: string;
+};
+
+export type HeadLinkTag = {
+  rel: string;
+  href: string;
+  type?: string;
+  sizes?: string;
+  media?: string;
+};
+
+export type HeadConfig = {
+  title?: string;
+  description?: string;
+  favicon?: string;
+  meta?: HeadMetaTag[];
+  links?: HeadLinkTag[];
+};
+
+export type HeadResolver<TContext = RouteContext> = (
+  context: TContext
+) => HeadConfig | Promise<HeadConfig>;
+
+export type PageModule = {
+  default: (props: PageProps) => ReactNode;
+  Head?: HeadResolver<RouteContext>;
+};
+
+export type LayoutModule = {
+  default: (props: RouteContext) => ReactNode;
+  Head?: HeadResolver<RouteContext>;
+};
+
+export type ErrorModule = {
+  default: (props: ErrorPageProps) => ReactNode;
+  Head?: HeadResolver<ErrorPageProps>;
+};
+
+export type CreateHtmlShellOptions = {
+  title?: string;
+  rscEndpoint?: string;
+  clientScriptUrl?: string;
+  headTags?: string;
+  rootHtml?: string;
+  basename?: string;
+  liveReloadPath?: string;
+  liveReloadServerId?: string;
+};
+
+export type SendRSCOptions = {
+  moduleMap?: Record<string, unknown>;
+  onError?: (error: unknown) => void;
+  statusCode?: number;
+  contentType?: string;
+};