@rigel-cms/rigel 0.1.0-beta.1 → 0.1.4-beta.1

package/src/editor/lib/tooltip.ts

@@ -0,0 +1,120 @@
+export function tooltipPosition(rect: Pick<DOMRect, "left" | "right" | "top" | "bottom">, width: number, height: number, viewportWidth: number, viewportHeight: number) {
+  return {
+    left: Math.max(8, Math.min((rect.left + rect.right - width) / 2, viewportWidth - width - 8)),
+    top: Math.max(8, Math.min(rect.top >= height + 14 ? rect.top - height - 6 : rect.bottom + 6, viewportHeight - height - 8)),
+  };
+}
+
+let provider: ReturnType<typeof createTooltips> | undefined;
+
+export function tooltipRoot(root: HTMLElement) {
+  provider ??= createTooltips();
+  const remove = provider.register(root);
+  return { destroy: remove };
+}
+
+function createTooltips() {
+  let tip: HTMLDivElement | undefined;
+  let anchor: HTMLElement | null = null;
+  let timer: ReturnType<typeof setTimeout> | undefined;
+  let opening: ReturnType<typeof setTimeout> | undefined;
+  let frame = 0;
+  let view: Window | null = null;
+  let pointerTime = 0;
+  let users = 0;
+  const id = "rigel-tooltip";
+
+  function hide() {
+    clearTimeout(timer);
+    clearTimeout(opening);
+    if (view) view.cancelAnimationFrame(frame);
+    if (anchor) {
+      const ids = (anchor.getAttribute("aria-describedby") ?? "").split(/\s+/).filter(value => value && value !== id);
+      if (ids.length) anchor.setAttribute("aria-describedby", ids.join(" ")); else anchor.removeAttribute("aria-describedby");
+    }
+    anchor = null;
+    if (tip?.matches(":popover-open")) tip.hidePopover();
+    tip?.remove();
+  }
+
+  function update() {
+    if (!anchor || !tip || !view) return;
+    if (!anchor.isConnected || !anchor.checkVisibility() || !anchor.dataset.tooltip) { hide(); return; }
+    if (tip.textContent !== anchor.dataset.tooltip) tip.textContent = anchor.dataset.tooltip;
+    const position = tooltipPosition(anchor.getBoundingClientRect(), tip.offsetWidth, tip.offsetHeight, view.innerWidth, view.innerHeight);
+    tip.style.left = `${position.left}px`;
+    tip.style.top = `${position.top}px`;
+    frame = view.requestAnimationFrame(update);
+  }
+
+  function show(target: HTMLElement) {
+    hide();
+    if (!target.isConnected || !target.checkVisibility() || !target.dataset.tooltip) return;
+    const doc = target.ownerDocument;
+    tip ??= doc.createElement("div");
+    tip.id = id;
+    tip.className = "rigel-tooltip";
+    tip.setAttribute("role", "tooltip");
+    tip.popover = "manual";
+    anchor = target;
+    view = doc.defaultView;
+    const scope = target.closest("dialog, .rigel") ?? target.parentElement!;
+    scope.append(tip);
+    tip.textContent = target.dataset.tooltip;
+    target.setAttribute("aria-describedby", [...new Set([...(target.getAttribute("aria-describedby") ?? "").split(/\s+/).filter(Boolean), id])].join(" "));
+    try { tip.showPopover(); update(); }
+    catch (error) {
+      if ((error as DOMException)?.name !== "InvalidStateError") throw error;
+      opening = setTimeout(() => { if (anchor !== target) return; if (!target.isConnected || !target.checkVisibility()) { hide(); return; } tip!.showPopover(); update(); }, 0);
+    }
+  }
+
+  function register(root: HTMLElement) {
+    users++;
+    const doc = root.ownerDocument;
+    const win = doc.defaultView!;
+    const target = (event: Event) => {
+      const element = (event.target as Element)?.closest?.<HTMLElement>("[data-tooltip]");
+      return element && root.contains(element) && element.closest(".rigel") ? element : null;
+    };
+    const over = (event: PointerEvent) => {
+      if (event.pointerType === "touch") return;
+      if (event.target === tip) { clearTimeout(timer); return; }
+      const element = target(event);
+      if (!element || element.contains(event.relatedTarget as Node | null) || element === anchor || element === doc.activeElement) return;
+      hide(); timer = setTimeout(() => show(element), 450);
+    };
+    const out = (event: PointerEvent) => {
+      const element = target(event);
+      if (element?.contains(event.relatedTarget as Node | null)) return;
+      if (event.relatedTarget === tip || anchor?.contains(event.relatedTarget as Node | null)) return;
+      if (anchor === doc.activeElement) return;
+      clearTimeout(timer); timer = setTimeout(hide, 150);
+    };
+    const focus = (event: FocusEvent) => {
+      const element = target(event);
+      if (element && Date.now() - pointerTime > 700) show(element);
+    };
+    const down = () => { pointerTime = Date.now(); hide(); };
+    const key = (event: KeyboardEvent) => {
+      pointerTime = 0;
+      if (event.key !== "Escape") return;
+      const visible = !!anchor;
+      hide();
+      if (visible) { event.preventDefault(); event.stopImmediatePropagation(); }
+    };
+    const listeners = [["pointerover", over], ["pointerout", out], ["focusin", focus], ["focusout", hide], ["pointerdown", down], ["click", hide], ["keydown", key]] as const;
+    for (const [name, listener] of listeners) root.addEventListener(name, listener as EventListener, true);
+    win.addEventListener("blur", hide);
+    win.addEventListener("resize", hide);
+    win.addEventListener("scroll", hide, true);
+    return () => {
+      hide();
+      for (const [name, listener] of listeners) root.removeEventListener(name, listener as EventListener, true);
+      win.removeEventListener("blur", hide); win.removeEventListener("resize", hide);
+      win.removeEventListener("scroll", hide, true);
+      if (!--users) { tip = undefined; provider = undefined; }
+    };
+  }
+  return { register };
+}

package/src/editor/styles.css

@@ -1,4 +1,7 @@
 .rigel, .rigel *, .rigel *::before, .rigel *::after { box-sizing: border-box; }
+.rigel .rigel-tooltip { position: fixed; pointer-events: auto; inset: auto; margin: 0; padding: 0.375rem 0.625rem; max-width: min(20rem, calc(100vw - 16px)); max-height: calc(100dvh - 16px); overflow: auto; border: 1px solid var(--border-control); border-radius: var(--radius); background: var(--text); color: var(--panel); box-shadow: var(--shadow-md); font: 500 0.75rem/1.5 -apple-system, BlinkMacSystemFont, system-ui, sans-serif; overflow-wrap: anywhere; text-align: start; white-space: normal; }
+.rigel .rigel-tooltip::backdrop { background: transparent; pointer-events: none; }
+@media (forced-colors: active) { .rigel .rigel-tooltip { background: Canvas; color: CanvasText; border-color: CanvasText; } }
 .rigel {
   --rigel-50: #EFFBFF;
   --rigel-100: #D9F4FF;
@@ -26,6 +29,9 @@
 
 .rigel.connection-shell { align-items: center; justify-content: center; padding: 1.5rem; min-height: 100dvh; }
 .rigel .connection-card { flex: none; width: 100%; max-width: 560px; margin: 0; padding: 2rem; background: var(--panel); border: 1px solid var(--border); overflow-wrap: anywhere; }
+.rigel .connection-brand { display: flex; align-items: center; gap: 0.75rem; font-size: 1.5rem; font-weight: 650; letter-spacing: -0.04em; }
+.rigel .brand-suffix { font-weight: 450; }
+.rigel .connection-brand img { flex-shrink: 0; }
 .rigel .connection-card h1 { margin: 1rem 0; font-size: 1.75rem; line-height: 1.2; }
 .rigel .connection-card p { margin: 1rem 0; }
 .rigel .connection-card :is(button, a.primary) { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0.625rem 1rem; font: inherit; text-decoration: none; text-align: center; }
@@ -263,6 +269,7 @@
   justify-content: center;
   flex-shrink: 0;
 }
+.rigel .avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
 .rigel .uname { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
 .rigel .user-details { display: flex; flex: 1; min-width: 0; flex-direction: column; gap: 0.125rem; }
 .rigel .user-details small { color: var(--text-muted); font-size: 0.75rem; font-weight: 400; }
@@ -958,6 +965,10 @@
   font-size: 0.875rem; font-weight: 600; text-transform: none;
   letter-spacing: 0; color: var(--text); margin: 0 0 0.75rem;
 }
+.rigel .connection-details { margin: 0; }
+.rigel .connection-details dt { margin-top: 1rem; font-size: 0.75rem; font-weight: 600; color: var(--text-2); }
+.rigel .connection-details dd { margin: 0.375rem 0 0; font-size: 0.875rem; overflow-wrap: anywhere; }
+.rigel .connection-details small { display: block; margin-top: 0.125rem; color: var(--text-muted); }
 .rigel .settings-pane fieldset { border: none; padding: 0; margin: 0 0 1rem; }
 .rigel .settings-pane fieldset.accessibility-options { margin-top: 1.5rem; }
 .rigel .accessibility-options label.inline { margin-top: 0; }

package/src/manifest/collections.ts

@@ -0,0 +1,27 @@
+import type { CollectionField } from "./types";
+import type { ContentDocument } from "../schema/types";
+import { validateCollectionReferences } from "./references";
+
+export function initialCollectionValues(fields: CollectionField[], title: string): Record<string, unknown> {
+  return Object.fromEntries(fields.map(field => [field.key,
+    field.type === "boolean" ? field.key === "draft" :
+    field.type === "tags" || (field.type === "reference" && field.multiple) ? [] :
+    field.type === "date" ? new Date().toISOString().slice(0, 10) :
+    field.key === "title" && field.type === "string" ? title : "",
+  ]));
+}
+
+export function validateCollectionValues(fields: CollectionField[], values: Record<string, unknown>, documents: ContentDocument[] = []): void {
+  if (!values || typeof values !== "object" || Array.isArray(values)) throw new Error("Invalid article frontmatter");
+  for (const field of fields) {
+    const value = values[field.key];
+    if (field.required && (value === undefined || value === null || (typeof value === "string" && !value.trim()) || (Array.isArray(value) && !value.length))) throw new Error(`${field.label}: required`);
+    if (value === undefined || field.type === "reference") continue;
+    const valid = field.type === "boolean" ? typeof value === "boolean" :
+      field.type === "tags" ? Array.isArray(value) && value.every(tag => typeof tag === "string") :
+      field.type === "date" ? typeof value === "string" && (value === "" || (/^\d{4}-\d{2}-\d{2}$/.test(value) && Number.isFinite(Date.parse(value)) && new Date(value).toISOString().slice(0, 10) === value)) :
+      typeof value === "string";
+    if (!valid) throw new Error(`${field.label}: expected ${field.type}`);
+  }
+  validateCollectionReferences(fields, values, documents);
+}

package/src/manifest/types.ts

@@ -52,6 +52,7 @@ export interface CollectionField {
   type: "string" | "text" | "boolean" | "date" | "tags" | "markdown" | "image" | "reference";
   to?: string;
   multiple?: boolean;
+  required?: boolean;
   options?: import("./references").ReferenceOption[];
 }
 

package/src/preview-urls.ts

@@ -1,3 +1,12 @@
 export function safePreviewUrl(value: string, image = false): boolean {
   return !!value && !/[ \t\r\n\f\v\u0000-\u001f\u007f\\]/.test(value) && !value.startsWith("//") && (!/^[a-z][a-z\d+.-]*:/i.test(value) || (image ? /^https?:/i : /^(https?:|mailto:)/i).test(value));
 }
+
+export function previewBaseUrl(value: unknown): string {
+  try {
+    if (typeof value !== "string" || !/^https?:\/\/[^/@]+(?:\/|$)/.test(value) || /[\s\u0000-\u001f\u007f\\%?#]/.test(value) || value.split("/").some(part => part === "." || part === "..")) throw new Error();
+    const url = new URL(value);
+    if (url.username || url.password || (url.protocol !== "https:" && !["localhost", "127.0.0.1", "[::1]"].includes(url.hostname))) throw new Error();
+    return `${url.origin}${url.pathname.replace(/\/$/, "")}/`;
+  } catch { throw new Error("rigel: preview.liveUrl and preview.draftUrl must be absolute HTTPS base URLs without credentials, query or fragment (HTTP allowed on loopback)"); }
+}

package/src/preview.ts

@@ -2,7 +2,7 @@ import MarkdownIt from "markdown-it";
 import DOMPurify from "dompurify";
 import { pageRoute } from "./schema/paths";
 import { renderArticle } from "./article-render";
-import { safePreviewUrl } from "./preview-urls";
+import { safePreviewUrl, previewBaseUrl } from "./preview-urls";
 export { safePreviewUrl } from "./preview-urls";
 
 export interface PreviewDocumentMapping {
@@ -11,6 +11,8 @@ export interface PreviewDocumentMapping {
 }
 
 export interface PreviewConfig {
+  liveUrl?: string;
+  draftUrl?: string;
   pages?: Record<string, string>;
   collections?: Record<string, { url: string; new: string }>;
   documents?: Record<string, PreviewDocumentMapping>;
@@ -23,10 +25,16 @@ export interface PreviewTarget {
 }
 
 export function previewPath(config: PreviewConfig, target: PreviewTarget, isNew = false): string | null {
-  if (target.kind === "document") return pageRoute(target.slug, config.documents?.[target.type ?? ""]);
   const mapping = target.kind === "post" ? config.collections?.[target.collection ?? ""] : undefined;
-  const path = target.kind === "page" ? config.pages?.[target.slug] : mapping ? (isNew ? mapping.new : mapping.url.replaceAll("{slug}", encodeURIComponent(target.slug))) : undefined;
-  return typeof path === "string" && /^\/(?!\/)/.test(path) && !/[\\\s?#]/.test(path) && !path.split("/").includes("..") && !/^\/rigel(?:\/|$)/.test(path) ? path : null;
+  const path = target.kind === "document" ? pageRoute(target.slug, config.documents?.[target.type ?? ""]) : target.kind === "page" ? config.pages?.[target.slug] : mapping ? (isNew ? mapping.new : mapping.url.replaceAll("{slug}", encodeURIComponent(target.slug))) : undefined;
+  return typeof path === "string" && /^\/(?!\/)/.test(path) && !/[\\\s?#]/.test(path) && !/%(?:2e|2f|5c)/i.test(path) && !path.split("/").some(part => part === "." || part === "..") && !/^\/rigel(?:\/|$)/.test(path) ? path : null;
+}
+
+export function previewUrl(config: PreviewConfig, target: PreviewTarget, mode: "live" | "draft" | "website" = "draft", isNew = false): string | null {
+  const path = previewPath(config, target, mode === "draft" && (target.kind === "post" || isNew));
+  const base = mode === "live" ? config.liveUrl : config.draftUrl;
+  if (!path || base === undefined) return path;
+  try { return new URL(path.slice(1), previewBaseUrl(base)).href; } catch { return null; }
 }
 
 export function anchorValue(values: unknown, path: string): { found: boolean; value: unknown } {

package/src/routes/local-post.ts

@@ -1,11 +1,11 @@
 import type { APIRoute } from "astro";
-import { writeFile, mkdir, rm, readFile, rename } from "node:fs/promises";
+import { writeFile, mkdir, rm, readFile, rename, link } from "node:fs/promises";
 import { randomUUID } from "node:crypto";
 import path from "node:path";
 
 import { validateBody, type ArticleBody } from "../article-body";
 import config from "virtual:rigel-config";
-import { validateCollectionReferences } from "../manifest/references";
+import { validateCollectionValues } from "../manifest/collections";
 import { readDocuments } from "../schema/store";
 import { fileURLToPath } from "node:url";
 import type { CollectionConfig } from "../config";
@@ -46,16 +46,22 @@ export const POST: APIRoute = async ({ request, params }) => {
     validateBody(body.body);
     const fields = config.collections?.find((collection: CollectionConfig) => collection.name === params.collection)?.fields ?? [];
     const documents = config.schema && config.root ? await readDocuments(config.schema, fileURLToPath(config.root)) : [];
-    validateCollectionReferences(fields, body.frontmatter, documents);
+    validateCollectionValues(fields, body.frontmatter, documents);
   } catch (error) {
-    return new Response(error instanceof Error ? error.message : "Invalid references", { status: 400 });
+    return new Response(error instanceof Error ? error.message : "Invalid article", { status: 400 });
   }
   await mkdir(path.dirname(file), { recursive: true });
   const fm = { ...body.frontmatter, slug };
   const temporary = `${file}.${randomUUID()}.tmp`;
   try {
     await writeFile(temporary, JSON.stringify({ frontmatter: fm, body: body.body }, null, 2) + "\n", { flag: "wx" });
-    await rename(temporary, file);
+    if (request.headers.get("If-None-Match") === "*") {
+      try { await link(temporary, file); }
+      catch (error) {
+        if ((error as NodeJS.ErrnoException).code === "EEXIST") return new Response("A post with that slug already exists. Reload the collection and create the draft again.", { status: 409 });
+        throw error;
+      }
+    } else await rename(temporary, file);
   } finally { await rm(temporary, { force: true }); }
   return new Response(null, { status: 204 });
 };

package/src/vite/manifest-plugin.ts

@@ -50,6 +50,7 @@ const __rigelReservedSlugs = new Set(documents.filter((doc) => !documentTypes.fi
     ).map(([path, raw]) => {
       const post = JSON.parse(raw);
       __rigelValidateBody(post.body);
+      __rigelValidateCollectionValues(${JSON.stringify(c.fields)}, post.frontmatter, documents);
       post.slug = path.split("/").pop().replace(/\\.json$/, "");
       return post;
     }),
@@ -165,6 +166,7 @@ export function derefDocument(value) { return deref(value, __rigelIndex); }
       }
       return `
 import { validateBody as __rigelValidateBody } from ${JSON.stringify(fileURLToPath(new URL("../article-body.ts", import.meta.url)))};
+import { validateCollectionValues as __rigelValidateCollectionValues } from ${JSON.stringify(fileURLToPath(new URL("../manifest/collections.ts", import.meta.url)))};
 const modules = import.meta.glob(${JSON.stringify(pattern)}, { eager: true });
 const loaded = Object.values(modules).map((m) => m.default);
 ${documentsSrc}