@tinacms/astro 0.0.1 → 0.2.0

package/dist/island-route.js

@@ -0,0 +1,57 @@
+// src/island-route.ts
+import { experimental_AstroContainer as AstroContainer } from "astro/container";
+import { PREVIEW_CONTENT_TYPE } from "@tinacms/bridge/preview";
+
+// src/internal/escape.ts
+function escapeAttr(s) {
+  return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
+}
+
+// src/island-route.ts
+function experimental_createIslandRoute(islands) {
+  return async ({ params, request, url }) => {
+    const rejection = rejectIfUnsafe(request);
+    if (rejection) return rejection;
+    const island = islands[params.name ?? ""];
+    if (!island) {
+      return new Response(`Unknown island "${params.name}"`, { status: 404 });
+    }
+    try {
+      const data = await island.fetch(request, url.searchParams);
+      const container = await AstroContainer.create();
+      const html = await container.renderToString(island.component, {
+        props: island.propsFromData(data, url.searchParams)
+      });
+      return new Response(wrapIsland(html, island.wrapper, url), {
+        headers: {
+          "Content-Type": "text/html; charset=utf-8",
+          "Cache-Control": "no-store"
+        }
+      });
+    } catch {
+      return new Response("Island render failed", { status: 500 });
+    }
+  };
+}
+function rejectIfUnsafe(request) {
+  if (request.method !== "POST") {
+    return new Response("Method Not Allowed", { status: 405 });
+  }
+  const contentType = request.headers.get("content-type") ?? "";
+  if (!contentType.includes(PREVIEW_CONTENT_TYPE)) {
+    return new Response("Not Found", { status: 404 });
+  }
+  const fetchSite = request.headers.get("sec-fetch-site");
+  if (fetchSite === "cross-site" || fetchSite === "cross-origin") {
+    return new Response("Forbidden", { status: 403 });
+  }
+  return null;
+}
+function wrapIsland(html, wrapper, url) {
+  const cls = wrapper.className ? ` class="${escapeAttr(wrapper.className)}"` : "";
+  const marker = escapeAttr(`${url.pathname}${url.search}`);
+  return `<${wrapper.tag}${cls} data-tina-island="${marker}">${html}</${wrapper.tag}>`;
+}
+export {
+  experimental_createIslandRoute
+};

package/dist/middleware.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Astro middleware injected by the `tina()` integration.
+ *
+ * - Resolves `isEditMode(request)` once and stashes it on
+ *   `context.locals.tinaEdit` so pages and components can branch on edit
+ *   context without re-parsing headers.
+ * - Scopes the request and a per-request forms collector via
+ *   AsyncLocalStorage so `tina()` reads them implicitly — the caller
+ *   never threads `Astro.request` through their loaders.
+ * - In edit mode only, splices `<div data-tina-form>` payloads and a
+ *   `<script>` that loads `/_tina/bridge.js` before `</head>`. The user
+ *   writes nothing in their layout, and production HTML is byte-
+ *   identical to a Tina-free Astro app.
+ * - In edit mode only, refreshes the `__tina_edit` cookie so the session
+ *   survives in-iframe link clicks (whose Referer is the previous
+ *   preview page, not `/admin/`).
+ */
+import type { MiddlewareHandler } from 'astro';
+export declare const onRequest: MiddlewareHandler;
+export default onRequest;

package/dist/middleware.js

@@ -0,0 +1,109 @@
+// src/internal/escape.ts
+function escapeAttr(s) {
+  return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
+}
+
+// src/internal/forms-store.ts
+import { AsyncLocalStorage } from "node:async_hooks";
+var STORE_KEY = Symbol.for("@tinacms/astro/forms-store");
+var slot = globalThis;
+var formsStore = slot[STORE_KEY] ??= new AsyncLocalStorage();
+
+// src/internal/request-context.ts
+import { AsyncLocalStorage as AsyncLocalStorage2 } from "node:async_hooks";
+var STORE_KEY2 = Symbol.for("@tinacms/astro/request-context");
+var slot2 = globalThis;
+var requestStore = slot2[STORE_KEY2] ??= new AsyncLocalStorage2();
+
+// src/is-edit-mode.ts
+var EDIT_COOKIE = "__tina_edit";
+var EDIT_COOKIE_HEADER = `${EDIT_COOKIE}=1; Path=/; SameSite=Strict; Max-Age=3600`;
+function isEditMode(request) {
+  const url = new URL(request.url);
+  if (url.searchParams.get("tina-edit") === "1") return true;
+  const dest = request.headers.get("Sec-Fetch-Dest");
+  if (dest !== "iframe") return false;
+  const referer = request.headers.get("Referer");
+  if (referer) {
+    try {
+      const refererUrl = new URL(referer);
+      if (refererUrl.origin === url.origin && refererUrl.pathname.startsWith("/admin/")) {
+        return true;
+      }
+    } catch {
+    }
+  }
+  return readCookie(request, EDIT_COOKIE) === "1";
+}
+function readCookie(request, name) {
+  const header = request.headers.get("Cookie");
+  if (!header) return null;
+  for (const pair of header.split(";")) {
+    const eq = pair.indexOf("=");
+    if (eq === -1) continue;
+    const key = pair.slice(0, eq).trim();
+    if (key === name) return pair.slice(eq + 1).trim();
+  }
+  return null;
+}
+
+// src/middleware.ts
+var HEAD_CLOSE = "</head>";
+var onRequest = (context, next) => {
+  const editing = isEditMode(context.request);
+  context.locals.tinaEdit = editing;
+  const forms = [];
+  return requestStore.run(
+    context.request,
+    () => formsStore.run(forms, async () => {
+      const response = await next();
+      return editing ? injectEditMode(response, forms) : response;
+    })
+  );
+};
+var middleware_default = onRequest;
+async function injectEditMode(response, forms) {
+  const init = editModeInit(response);
+  const contentType = response.headers.get("content-type") ?? "";
+  if (!contentType.includes("text/html")) {
+    return new Response(response.body, init);
+  }
+  const html = await response.text();
+  const headEnd = html.indexOf(HEAD_CLOSE);
+  if (headEnd === -1) {
+    return new Response(html, init);
+  }
+  const injection = renderInjection(forms);
+  return new Response(
+    html.slice(0, headEnd) + injection + html.slice(headEnd),
+    init
+  );
+}
+function editModeInit(response) {
+  const headers = new Headers(response.headers);
+  headers.delete("content-length");
+  headers.append("Set-Cookie", EDIT_COOKIE_HEADER);
+  return { status: response.status, statusText: response.statusText, headers };
+}
+function renderInjection(forms) {
+  const formDivs = forms.map(
+    (form) => `<div data-tina-form="${escapeAttr(JSON.stringify(form))}" hidden></div>`
+  ).join("");
+  return formDivs + bridgeScript();
+}
+function bridgeScript() {
+  const origins = adminOrigins();
+  const initArg = origins ? `{adminOrigin:${JSON.stringify(origins)}}` : "";
+  return `<script type="module">import{init,refreshForms}from"/_tina/bridge.js";init(${initArg});document.addEventListener("astro:page-load",refreshForms);</script>`;
+}
+function adminOrigins() {
+  const env = import.meta.env;
+  const raw = env?.PUBLIC_TINA_ADMIN_ORIGIN;
+  if (!raw) return null;
+  const origins = raw.split(",").map((s) => s.trim()).filter(Boolean);
+  return origins.length > 0 ? origins : null;
+}
+export {
+  middleware_default as default,
+  onRequest
+};

package/dist/sanitize.d.ts

@@ -1 +1,12 @@
-export * from "../src/sanitize"
+/**
+ * Sanitizes a CMS-supplied href, returning a safe URL or the fallback.
+ * Blocks dangerous schemes (javascript:, data:, vbscript:) and
+ * protocol-relative URLs (//evil.com). Allows relative paths, http(s),
+ * and mailto:.
+ */
+export declare function sanitizeHref(value: unknown, fallback?: string): string;
+/**
+ * Validates a CMS-supplied image src, returning the src string if safe or ''
+ * if it is empty, not a string, or uses a non-http(s)/relative scheme.
+ */
+export declare function sanitizeImageSrc(src: unknown): string;

package/dist/sanitize.js

@@ -1,9 +1,8 @@
+// src/sanitize.ts
 function sanitizeHref(value, fallback = "#") {
-  if (typeof value !== "string")
-    return fallback;
+  if (typeof value !== "string") return fallback;
   const trimmed = value.trim();
-  if (!trimmed)
-    return fallback;
+  if (!trimmed) return fallback;
   const lower = trimmed.toLowerCase();
   if (lower.startsWith("javascript:") || lower.startsWith("data:") || lower.startsWith("vbscript:")) {
     return fallback;
@@ -22,18 +21,15 @@ function sanitizeHref(value, fallback = "#") {
   return fallback;
 }
 function sanitizeImageSrc(src) {
-  if (typeof src !== "string")
-    return "";
+  if (typeof src !== "string") return "";
   const trimmed = src.trim();
-  if (!trimmed)
-    return "";
+  if (!trimmed) return "";
   if (trimmed.startsWith("./") || trimmed.startsWith("../") || trimmed.startsWith("/") && !trimmed.startsWith("//")) {
     return trimmed;
   }
   try {
     const url = new URL(trimmed);
-    if (url.protocol === "http:" || url.protocol === "https:")
-      return trimmed;
+    if (url.protocol === "http:" || url.protocol === "https:") return trimmed;
   } catch {
     return "";
   }

package/dist/tina-field.d.ts

@@ -1 +1 @@
-export * from "../src/tina-field"
+export * from '@tinacms/bridge/tina-field';

package/dist/tina-field.js

@@ -1 +1,2 @@
+// src/tina-field.ts
 export * from "@tinacms/bridge/tina-field";

package/dist/types.d.ts

@@ -1 +1,92 @@
-export * from "../src/types"
+/**
+ * Plate AST node types Tina returns from rich-text fields. Mirrors the shape
+ * documented in `packages/@tinacms/mdx/src/parse/plate.ts` — kept inline so
+ * the Astro renderer can stay framework-free and not pull @tinacms/mdx into
+ * the page bundle.
+ */
+/**
+ * Astro doesn't publicly export `AstroComponentFactory`, so we use a
+ * structural placeholder. The consumer's Astro pipeline performs the real
+ * compile-time check that whatever they pass is a valid component.
+ */
+export type AstroComponent = (...args: never[]) => unknown;
+export type TinaRichTextRoot = {
+    type: 'root';
+    children: TinaRichTextNode[];
+};
+export type TinaRichTextNode = BlockElement | InlineElement | TextElement | MdxElement;
+export type LinkElement = {
+    type: 'a';
+    url: string;
+    title?: string;
+    children: InlineElement[];
+};
+export type ImageElement = {
+    type: 'img';
+    url: string;
+    alt?: string;
+    caption?: string;
+};
+export type CodeBlockElement = {
+    type: 'code_block';
+    lang?: string;
+    value?: string;
+    children?: {
+        children: TextElement[];
+    }[];
+};
+export type BlockElement = {
+    type: 'p';
+    children: InlineElement[];
+} | {
+    type: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+    children: InlineElement[];
+} | {
+    type: 'blockquote';
+    children: TinaRichTextNode[];
+} | {
+    type: 'ul' | 'ol';
+    children: TinaRichTextNode[];
+} | {
+    type: 'li';
+    children: TinaRichTextNode[];
+} | {
+    type: 'lic';
+    children: InlineElement[];
+} | {
+    type: 'hr';
+} | {
+    type: 'break';
+} | ImageElement | CodeBlockElement | {
+    type: 'maybe_mdx';
+} | {
+    type: 'html';
+    value: string;
+} | {
+    type: 'invalid_markdown';
+    value: string;
+};
+export type InlineElement = TextElement | LinkElement | {
+    type: 'html_inline';
+    value: string;
+} | MdxElement;
+export type TextElement = {
+    type: 'text';
+    text: string;
+    bold?: boolean;
+    italic?: boolean;
+    underline?: boolean;
+    strikethrough?: boolean;
+    code?: boolean;
+    highlight?: boolean;
+    highlightColor?: string;
+};
+export type MdxElement = {
+    type: 'mdxJsxFlowElement' | 'mdxJsxTextElement';
+    name: string;
+    props: Record<string, unknown>;
+    children?: TinaRichTextNode[];
+};
+export type TinaRichTextContent = TinaRichTextRoot | TinaRichTextNode[] | null | undefined;
+/** A map of mdxJsx name (or default tag override) → Astro component. */
+export type CustomComponentsMap = Record<string, AstroComponent>;

package/dist/types.js

@@ -1 +0,0 @@
-

package/package.json

@@ -1,56 +1,128 @@
 {
   "name": "@tinacms/astro",
-  "version": "0.0.1",
+  "version": "0.2.0",
   "type": "module",
   "main": "src/TinaMarkdown.astro",
   "types": "dist/index.d.ts",
   "files": [
     "package.json",
-    "README.md",
-    "src/TinaMarkdown.astro",
-    "src/Node.astro",
-    "src/Leaf.astro",
+    "src",
     "dist"
   ],
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "default": "./src/TinaMarkdown.astro"
+      "astro": "./src/TinaMarkdown.astro",
+      "default": "./dist/index.js"
     },
+    "./TinaMarkdown.astro": "./src/TinaMarkdown.astro",
+    "./TinaIsland.astro": "./src/TinaIsland.astro",
     "./types": {
       "types": "./dist/types.d.ts",
+      "astro": "./src/types.ts",
       "default": "./dist/types.js"
     },
     "./sanitize": {
       "types": "./dist/sanitize.d.ts",
+      "astro": "./src/sanitize.ts",
       "default": "./dist/sanitize.js"
     },
     "./bridge": {
       "types": "./dist/bridge.d.ts",
+      "astro": "./src/bridge.ts",
       "default": "./dist/bridge.js"
     },
     "./tina-field": {
       "types": "./dist/tina-field.d.ts",
+      "astro": "./src/tina-field.ts",
       "default": "./dist/tina-field.js"
     },
-    "./preview": {
-      "types": "./dist/preview.d.ts",
-      "default": "./dist/preview.js"
+    "./data": {
+      "types": "./dist/data.d.ts",
+      "astro": "./src/data.ts",
+      "default": "./dist/data.js"
+    },
+    "./is-edit-mode": {
+      "types": "./dist/is-edit-mode.d.ts",
+      "astro": "./src/is-edit-mode.ts",
+      "default": "./dist/is-edit-mode.js"
+    },
+    "./middleware": {
+      "types": "./dist/middleware.d.ts",
+      "astro": "./src/middleware.ts",
+      "default": "./dist/middleware.js"
+    },
+    "./integration": {
+      "types": "./dist/integration.d.ts",
+      "astro": "./src/integration.ts",
+      "default": "./dist/integration.js"
+    },
+    "./bridge-route": {
+      "types": "./dist/bridge-route.d.ts",
+      "astro": "./src/bridge-route.ts",
+      "default": "./dist/bridge-route.js"
+    },
+    "./experimental": {
+      "types": "./dist/experimental.d.ts",
+      "astro": "./src/experimental.ts",
+      "default": "./dist/experimental.js"
     }
   },
   "license": "Apache-2.0",
   "buildConfig": {
     "entryPoints": [
-      "src/index.ts",
-      "src/types.ts",
-      "src/sanitize.ts",
-      "src/bridge.ts",
-      "src/tina-field.ts",
-      "src/preview.ts"
+      {
+        "name": "src/index.ts",
+        "target": "node"
+      },
+      {
+        "name": "src/types.ts",
+        "target": "node"
+      },
+      {
+        "name": "src/sanitize.ts",
+        "target": "node"
+      },
+      {
+        "name": "src/bridge.ts",
+        "target": "node"
+      },
+      {
+        "name": "src/tina-field.ts",
+        "target": "node"
+      },
+      {
+        "name": "src/data.ts",
+        "target": "node"
+      },
+      {
+        "name": "src/is-edit-mode.ts",
+        "target": "node"
+      },
+      {
+        "name": "src/middleware.ts",
+        "target": "node"
+      },
+      {
+        "name": "src/integration.ts",
+        "target": "node"
+      },
+      {
+        "name": "src/bridge-route.ts",
+        "target": "node"
+      },
+      {
+        "name": "src/experimental.ts",
+        "target": "node"
+      },
+      {
+        "name": "src/island-route.ts",
+        "target": "node"
+      }
     ]
   },
   "dependencies": {
-    "@tinacms/bridge": "0.0.1"
+    "@tinacms/bridge": "0.2.0"
   },
   "peerDependencies": {
     "astro": "^5.0.0"
@@ -61,7 +133,7 @@
     "typescript": "^5.7.3",
     "vite": "^6.0.0",
     "vitest": "^3.0.0",
-    "@tinacms/scripts": "1.6.0"
+    "@tinacms/scripts": "1.6.1"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org"

package/src/CodeBlockNode.astro

@@ -0,0 +1,28 @@
+---
+/**
+ * `code_block` nodes carry their value as either a flat `value` string or as
+ * `children: [{ children: [{ text }, ...] }, ...]` (one outer entry per line).
+ * Flatten both shapes to a single string before rendering.
+ */
+import type { CodeBlockElement, CustomComponentsMap } from './types';
+
+interface Props {
+  node: CodeBlockElement;
+  components: CustomComponentsMap;
+}
+
+const { node, components } = Astro.props;
+const Override = components.code_block;
+
+const value =
+  node.value ??
+  node.children
+    ?.map((line) => line.children?.map((tn) => tn.text).join('') ?? '')
+    .join('\n') ??
+  '';
+---
+{Override ? (
+  <Override value={value} lang={node.lang} />
+) : (
+  <pre><code class={node.lang ? `language-${node.lang}` : undefined}>{value}</code></pre>
+)}

package/src/Container.astro

@@ -0,0 +1,56 @@
+---
+/**
+ * Renders any node whose default form is `<Tag>{children}</Tag>` —
+ * paragraphs, headings, lists, list items, blockquote, lic. The tag itself
+ * is derived from `node.type`; if the consumer registered an override on
+ * `components[type]`, we render that instead and pass children as a slot.
+ */
+import TinaMarkdown from './TinaMarkdown.astro';
+import type { CustomComponentsMap, TinaRichTextNode } from './types';
+
+interface Props {
+  node: TinaRichTextNode & { children: TinaRichTextNode[] };
+  components: CustomComponentsMap;
+}
+
+const { node, components } = Astro.props;
+const t = node.type;
+const Override = components[t];
+
+const tagFor: Record<
+  string,
+  | 'p'
+  | 'h1'
+  | 'h2'
+  | 'h3'
+  | 'h4'
+  | 'h5'
+  | 'h6'
+  | 'ol'
+  | 'ul'
+  | 'li'
+  | 'div'
+  | 'blockquote'
+> = {
+  p: 'p',
+  h1: 'h1',
+  h2: 'h2',
+  h3: 'h3',
+  h4: 'h4',
+  h5: 'h5',
+  h6: 'h6',
+  ol: 'ol',
+  ul: 'ul',
+  li: 'li',
+  blockquote: 'blockquote',
+  lic: 'div',
+};
+const Tag = tagFor[t];
+---
+{Override ? (
+  <Override>
+    <TinaMarkdown content={node.children} components={components} />
+  </Override>
+) : (
+  <Tag><TinaMarkdown content={node.children} components={components} /></Tag>
+)}

package/src/ImageNode.astro

@@ -0,0 +1,17 @@
+---
+import { sanitizeImageSrc } from './sanitize';
+import type { CustomComponentsMap, ImageElement } from './types';
+
+interface Props {
+  node: ImageElement;
+  components: CustomComponentsMap;
+}
+
+const { node, components } = Astro.props;
+const Override = components.img;
+---
+{Override ? (
+  <Override url={node.url} alt={node.alt} caption={node.caption} />
+) : (
+  <img src={sanitizeImageSrc(node.url)} alt={node.alt ?? ''} />
+)}

package/src/LinkNode.astro

@@ -0,0 +1,22 @@
+---
+import TinaMarkdown from './TinaMarkdown.astro';
+import { sanitizeHref } from './sanitize';
+import type { CustomComponentsMap, LinkElement } from './types';
+
+interface Props {
+  node: LinkElement;
+  components: CustomComponentsMap;
+}
+
+const { node, components } = Astro.props;
+const Override = components.a;
+---
+{Override ? (
+  <Override url={node.url}>
+    <TinaMarkdown content={node.children} components={components} />
+  </Override>
+) : (
+  <a href={sanitizeHref(node.url)}>
+    <TinaMarkdown content={node.children} components={components} />
+  </a>
+)}

package/src/MdxNode.astro

@@ -0,0 +1,24 @@
+---
+/**
+ * mdxJsx{Flow,Text}Element nodes are dispatched by `node.name` — registered
+ * components on the `components` map render with the node's props spread in.
+ * Unregistered names emit a visible placeholder so missing registrations
+ * surface during development.
+ */
+import type { CustomComponentsMap, MdxElement } from './types';
+
+interface Props {
+  node: MdxElement;
+  components: CustomComponentsMap;
+}
+
+const { node, components } = Astro.props;
+const MdxComponent = components[node.name];
+---
+{MdxComponent ? (
+  <MdxComponent {...(node.props ?? {})} />
+) : (
+  <span style="display:inline-block;padding:0.25rem 0.5rem;background:#fee;color:#900;border-radius:0.25rem;font-family:monospace;font-size:0.85em;">
+    No component provided for {node.name}
+  </span>
+)}