@webtypen/webframez-react 0.0.1

package/dist/navigation.cjs

@@ -0,0 +1,149 @@
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+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/navigation.tsx
+var navigation_exports = {};
+__export(navigation_exports, {
+  Link: () => Link,
+  Redirect: () => Redirect
+});
+module.exports = __toCommonJS(navigation_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+function getDefaultBasename() {
+  const globalValue = globalThis.__RSC_BASENAME;
+  if (globalValue && globalValue !== "/") {
+    return globalValue;
+  }
+  if (typeof window === "undefined") {
+    return "";
+  }
+  const value = window.__RSC_BASENAME;
+  return value && value !== "/" ? value : "";
+}
+function getClientRouter() {
+  if (typeof window === "undefined") {
+    return null;
+  }
+  const value = window.__WEBFRAMEZ_ROUTER__;
+  return value ?? null;
+}
+function withLeadingSlash(value) {
+  return value.startsWith("/") ? value : `/${value}`;
+}
+function normalizeBase(base) {
+  if (!base || base.trim() === "" || base === "/") {
+    return "";
+  }
+  const withSlash = withLeadingSlash(base.trim());
+  return withSlash.endsWith("/") ? withSlash.slice(0, -1) : withSlash;
+}
+function isExternal(href) {
+  return /^[a-zA-Z][a-zA-Z\d+\-.]*:/.test(href) || href.startsWith("//");
+}
+function resolveHref(to, basename) {
+  if (!to || to.trim() === "") {
+    return "/";
+  }
+  const trimmed = to.trim();
+  if (isExternal(trimmed) || trimmed.startsWith("#")) {
+    return trimmed;
+  }
+  const [pathPart, hashPart] = trimmed.split("#", 2);
+  const [pathnamePart, queryPart] = pathPart.split("?", 2);
+  const pathname = withLeadingSlash(pathnamePart || "/");
+  const base = normalizeBase(basename);
+  let resolvedPath = pathname;
+  if (base && pathname !== "/" && !pathname.startsWith(`${base}/`) && pathname !== base) {
+    resolvedPath = `${base}${pathname}`;
+  } else if (base && pathname === "/") {
+    resolvedPath = base;
+  }
+  const query = queryPart ? `?${queryPart}` : "";
+  const hash = hashPart ? `#${hashPart}` : "";
+  return `${resolvedPath}${query}${hash}`;
+}
+function Link({ to, basename, onClick, ...rest }) {
+  const resolvedHref = resolveHref(to, basename ?? getDefaultBasename());
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "a",
+    {
+      ...rest,
+      href: resolvedHref,
+      onClick: (event) => {
+        onClick?.(event);
+        if (event.defaultPrevented) {
+          return;
+        }
+        if (event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey) {
+          return;
+        }
+        if (rest.target && rest.target !== "_self") {
+          return;
+        }
+        if (isExternal(resolvedHref)) {
+          return;
+        }
+        const router = getClientRouter();
+        if (!router) {
+          return;
+        }
+        event.preventDefault();
+        router.push(resolvedHref);
+      }
+    }
+  );
+}
+function Redirect({ to, basename, replace = true }) {
+  const resolvedHref = resolveHref(to, basename ?? getDefaultBasename());
+  if (typeof window !== "undefined") {
+    const currentHref = `${window.location.pathname}${window.location.search}${window.location.hash}`;
+    if (resolvedHref !== currentHref) {
+      setTimeout(() => {
+        if (isExternal(resolvedHref)) {
+          if (replace) {
+            window.location.replace(resolvedHref);
+          } else {
+            window.location.assign(resolvedHref);
+          }
+          return;
+        }
+        const router = getClientRouter();
+        if (router) {
+          if (replace) {
+            router.replace(resolvedHref);
+          } else {
+            router.push(resolvedHref);
+          }
+          return;
+        }
+        if (replace) {
+          window.location.replace(resolvedHref);
+        } else {
+          window.location.assign(resolvedHref);
+        }
+      }, 0);
+    }
+  }
+  return null;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Link,
+  Redirect
+});

package/dist/navigation.d.ts

@@ -0,0 +1,16 @@
+import type React from "react";
+
+export type LinkProps = Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "href"> & {
+  to: string;
+  basename?: string;
+};
+
+export function Link(props: LinkProps): React.ReactElement;
+
+export type RedirectProps = {
+  to: string;
+  basename?: string;
+  replace?: boolean;
+};
+
+export function Redirect(props: RedirectProps): null;

package/dist/navigation.js

@@ -0,0 +1,125 @@
+"use client";
+
+// src/navigation.tsx
+import { jsx } from "react/jsx-runtime";
+function getDefaultBasename() {
+  const globalValue = globalThis.__RSC_BASENAME;
+  if (globalValue && globalValue !== "/") {
+    return globalValue;
+  }
+  if (typeof window === "undefined") {
+    return "";
+  }
+  const value = window.__RSC_BASENAME;
+  return value && value !== "/" ? value : "";
+}
+function getClientRouter() {
+  if (typeof window === "undefined") {
+    return null;
+  }
+  const value = window.__WEBFRAMEZ_ROUTER__;
+  return value ?? null;
+}
+function withLeadingSlash(value) {
+  return value.startsWith("/") ? value : `/${value}`;
+}
+function normalizeBase(base) {
+  if (!base || base.trim() === "" || base === "/") {
+    return "";
+  }
+  const withSlash = withLeadingSlash(base.trim());
+  return withSlash.endsWith("/") ? withSlash.slice(0, -1) : withSlash;
+}
+function isExternal(href) {
+  return /^[a-zA-Z][a-zA-Z\d+\-.]*:/.test(href) || href.startsWith("//");
+}
+function resolveHref(to, basename) {
+  if (!to || to.trim() === "") {
+    return "/";
+  }
+  const trimmed = to.trim();
+  if (isExternal(trimmed) || trimmed.startsWith("#")) {
+    return trimmed;
+  }
+  const [pathPart, hashPart] = trimmed.split("#", 2);
+  const [pathnamePart, queryPart] = pathPart.split("?", 2);
+  const pathname = withLeadingSlash(pathnamePart || "/");
+  const base = normalizeBase(basename);
+  let resolvedPath = pathname;
+  if (base && pathname !== "/" && !pathname.startsWith(`${base}/`) && pathname !== base) {
+    resolvedPath = `${base}${pathname}`;
+  } else if (base && pathname === "/") {
+    resolvedPath = base;
+  }
+  const query = queryPart ? `?${queryPart}` : "";
+  const hash = hashPart ? `#${hashPart}` : "";
+  return `${resolvedPath}${query}${hash}`;
+}
+function Link({ to, basename, onClick, ...rest }) {
+  const resolvedHref = resolveHref(to, basename ?? getDefaultBasename());
+  return /* @__PURE__ */ jsx(
+    "a",
+    {
+      ...rest,
+      href: resolvedHref,
+      onClick: (event) => {
+        onClick?.(event);
+        if (event.defaultPrevented) {
+          return;
+        }
+        if (event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey) {
+          return;
+        }
+        if (rest.target && rest.target !== "_self") {
+          return;
+        }
+        if (isExternal(resolvedHref)) {
+          return;
+        }
+        const router = getClientRouter();
+        if (!router) {
+          return;
+        }
+        event.preventDefault();
+        router.push(resolvedHref);
+      }
+    }
+  );
+}
+function Redirect({ to, basename, replace = true }) {
+  const resolvedHref = resolveHref(to, basename ?? getDefaultBasename());
+  if (typeof window !== "undefined") {
+    const currentHref = `${window.location.pathname}${window.location.search}${window.location.hash}`;
+    if (resolvedHref !== currentHref) {
+      setTimeout(() => {
+        if (isExternal(resolvedHref)) {
+          if (replace) {
+            window.location.replace(resolvedHref);
+          } else {
+            window.location.assign(resolvedHref);
+          }
+          return;
+        }
+        const router = getClientRouter();
+        if (router) {
+          if (replace) {
+            router.replace(resolvedHref);
+          } else {
+            router.push(resolvedHref);
+          }
+          return;
+        }
+        if (replace) {
+          window.location.replace(resolvedHref);
+        } else {
+          window.location.assign(resolvedHref);
+        }
+      }, 0);
+    }
+  }
+  return null;
+}
+export {
+  Link,
+  Redirect
+};

package/dist/router.cjs

@@ -0,0 +1,386 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/router.ts
+var router_exports = {};
+__export(router_exports, {
+  RouteChildren: () => RouteChildren,
+  createFileRouter: () => createFileRouter,
+  parseSearchParams: () => parseSearchParams,
+  renderHeadToString: () => renderHeadToString
+});
+module.exports = __toCommonJS(router_exports);
+
+// src/file-router.tsx
+var import_node_fs = __toESM(require("node:fs"), 1);
+var import_node_path = __toESM(require("node:path"), 1);
+
+// src/router-runtime.tsx
+var import_react = __toESM(require("react"), 1);
+var ROUTE_CHILDREN_TAG = "webframez-route-children";
+var ROUTE_CHILDREN_SENTINEL = "__webframezRouteChildren";
+var ROUTE_CHILDREN_DISPLAY_NAME = "WebframezRouteChildren";
+var RouteChildrenImpl = () => import_react.default.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 (!import_react.default.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 import_react.default.cloneElement(node, void 0, ...nextChildren);
+  }
+  return import_react.default.cloneElement(node, void 0, nextChildren);
+}
+
+// src/file-router.tsx
+var import_jsx_runtime = require("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 (!import_node_fs.default.existsSync(dir)) {
+    return [];
+  }
+  const result = [];
+  const stack = [dir];
+  while (stack.length > 0) {
+    const current = stack.pop();
+    if (!current) {
+      continue;
+    }
+    for (const entry of import_node_fs.default.readdirSync(current, { withFileTypes: true })) {
+      const fullPath = import_node_path.default.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 = import_node_path.default.dirname(import_node_path.default.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 = import_node_path.default.join(pagesDir, "layout.js");
+  const errorPath = import_node_path.default.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 = import_node_fs.default.existsSync(layoutPath) ? resolveModule(layoutPath) : null;
+    if (!import_node_fs.default.existsSync(errorPath)) {
+      const fallback = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("main", { style: { fontFamily: "system-ui, sans-serif", padding: 24 }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", { children: statusCode }),
+        /* @__PURE__ */ (0, import_jsx_runtime.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 = import_node_fs.default.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);
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  RouteChildren,
+  createFileRouter,
+  parseSearchParams,
+  renderHeadToString
+});

package/dist/router.d.ts

@@ -0,0 +1,21 @@
+import type { ReactNode } from "react";
+import type { HeadConfig, RouteSearchParams } from "./types";
+
+export type ResolvedRoute = {
+  statusCode: number;
+  model: ReactNode;
+  head: HeadConfig;
+};
+
+export function createFileRouter(options: { pagesDir: string }): {
+  resolve(input: {
+    pathname: string;
+    searchParams: RouteSearchParams;
+    cookies?: Record<string, string>;
+  }): Promise<ResolvedRoute>;
+  readSearchParams(urlSearchParams: URLSearchParams): RouteSearchParams;
+};
+
+export function parseSearchParams(query: URLSearchParams): RouteSearchParams;
+export function renderHeadToString(head: HeadConfig): string;
+export function RouteChildren(): ReactNode;