@pramen/cms 0.0.14 → 0.0.16

package/dist/react.d.ts

@@ -0,0 +1,41 @@
+import type { ComponentType, ReactElement } from "react";
+import type { RenderedBlock, BlockTypeDef, BlockFieldsOf } from "./index";
+/** Props a component for a specific typed block type receives — `fields` is inferred from
+ * the block type's schema via `BlockFieldsOf` (see `defineBlockType`). */
+export interface TypedBlockProps<D extends BlockTypeDef> {
+    fields: BlockFieldsOf<D>;
+    block: RenderedBlock;
+    region?: string;
+    position: number;
+}
+/** A React component for a typed block type: `const Hero: TypedBlockComponent<typeof heroDef>`. */
+export type TypedBlockComponent<D extends BlockTypeDef> = ComponentType<TypedBlockProps<D>>;
+/** Props a block component receives. `fields` is the block's (override-merged) content. */
+export interface BlockComponentProps {
+    fields: Record<string, unknown>;
+    block: RenderedBlock;
+    region?: string;
+    position: number;
+}
+export type BlockComponents = Record<string, ComponentType<BlockComponentProps>>;
+export interface BlockRendererProps {
+    blocks: RenderedBlock[];
+    region?: string;
+    components: BlockComponents;
+    /** Rendered when no component is registered for a block's type. Defaults to a text node. */
+    fallback?: ComponentType<{
+        block: RenderedBlock;
+    }>;
+}
+/** Render an ordered list of blocks, each via its registered component. */
+export declare function BlockRenderer({ blocks, region, components, fallback }: BlockRendererProps): ReactElement;
+export interface RegionRendererProps {
+    regions: Record<string, RenderedBlock[]>;
+    name: string;
+    components: BlockComponents;
+    fallback?: ComponentType<{
+        block: RenderedBlock;
+    }>;
+}
+/** Render a single named region from an AssembledPage's `regions` map. */
+export declare function RegionRenderer({ regions, name, components, fallback }: RegionRendererProps): ReactElement;

package/dist/react.js

@@ -0,0 +1,30 @@
+// @pramen/cms/react — the headless renderer. Like WollyCMS's BlockRenderer, it maps a
+// block's `block_type` slug to a React component from a registry you provide; the CMS
+// stays headless and never dictates markup. Pair with useLiveQuery from @pramen/react
+// for a live-updating page:
+//
+//   import { BlockRenderer, RegionRenderer } from "@pramen/cms/react";
+//   const components = { hero: Hero, rich_text: RichText, cta: Cta };
+//   const { data } = useLiveQuery(client, "getPage", { slug });   // AssembledPage
+//   return RegionRenderer({ regions: data.regions, name: "content", components });
+//
+// Written with `createElement` (not JSX) so the package needs no DOM lib / JSX build
+// config and stays on the same tsconfig as the rest of pramen. In a JSX codebase you'd
+// normally write `<BlockRenderer .../>` — it's an ordinary component either way.
+import { createElement, Fragment } from "react";
+/** Render an ordered list of blocks, each via its registered component. */
+export function BlockRenderer({ blocks, region, components, fallback }) {
+    return createElement(Fragment, null, blocks.map((block, index) => {
+        const Component = components[block.block_type];
+        if (!Component) {
+            return fallback
+                ? createElement(fallback, { key: block.id, block })
+                : createElement(Fragment, { key: block.id }, `Unknown block type: ${block.block_type}`);
+        }
+        return createElement(Component, { key: block.id, fields: block.fields, block, region, position: index });
+    }));
+}
+/** Render a single named region from an AssembledPage's `regions` map. */
+export function RegionRenderer({ regions, name, components, fallback }) {
+    return BlockRenderer({ blocks: regions[name] ?? [], region: name, components, fallback });
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pramen/cms",
-  "version": "0.0.14",
+  "version": "0.0.16",
   "description": "Optional block/page builder for pramen — Drupal-Paragraphs-style typed blocks in named regions, reusable blocks, scheduled publishing, built entirely from pramen primitives.",
   "license": "MIT",
   "repository": {
@@ -30,7 +30,10 @@
   },
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
-  "files": ["dist", "src"],
+  "files": [
+    "dist",
+    "src"
+  ],
   "scripts": {
     "build": "rm -rf dist && tsc -p tsconfig.build.json"
   },
@@ -38,7 +41,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@pramen/server": "workspace:*"
+    "@pramen/server": "0.0.16"
   },
   "peerDependencies": {
     "react": ">=18"

package/src/index.ts

@@ -58,6 +58,8 @@ export interface FieldDefinition {
     | "url"
     | "number"
     | "boolean"
+    | "date"
+    | "datetime"
     | "media"
     | "select"
     | "repeater"
@@ -101,7 +103,7 @@ export type RichText = string | { type: string; content?: unknown[] };
 
 /** Map one FieldDefinition (as a const literal) to the TS type of its RENDERED value.
  * Media resolves to `ResolvedMedia` (the assemble-time shape a component receives). */
-export type FieldTsType<D extends FieldDefinition> = D["type"] extends "text" | "textarea" | "url" | "select"
+export type FieldTsType<D extends FieldDefinition> = D["type"] extends "text" | "textarea" | "url" | "select" | "date" | "datetime"
   ? string
   : D["type"] extends "richtext"
     ? RichText
@@ -171,6 +173,8 @@ function tsTypeOf(f: FieldDefinition): string {
     case "textarea":
     case "url":
     case "select":
+    case "date":
+    case "datetime":
       return "string";
     case "richtext":
       return "RichText";
@@ -356,6 +360,15 @@ export interface ValidateOpts {
 
 /** Validate a block/page's `fields` payload against a field schema, throwing a 400 on
  * the first violation. Recursive (repeater/group). Lenient on unknown field types. */
+/** A calendar date, `YYYY-MM-DD` (what an <input type="date"> emits) — must also parse. */
+function isDateString(v: string): boolean {
+  return /^\d{4}-\d{2}-\d{2}$/.test(v) && Number.isFinite(Date.parse(v));
+}
+/** A date-time: `YYYY-MM-DDTHH:MM[:SS[.sss]][Z|±HH:MM]` (ISO 8601 / datetime-local). */
+function isDateTimeString(v: string): boolean {
+  return /^\d{4}-\d{2}-\d{2}[T ]\d{2}:\d{2}(:\d{2})?(\.\d+)?(Z|[+-]\d{2}:\d{2})?$/.test(v) && Number.isFinite(Date.parse(v));
+}
+
 export function validateFields(schema: FieldDefinition[] | undefined | null, values: unknown, path = "", opts: ValidateOpts = {}): void {
   const requireRequired = opts.requireRequired !== false;
   const defs = Array.isArray(schema) ? schema : [];
@@ -388,6 +401,12 @@ export function validateFields(schema: FieldDefinition[] | undefined | null, val
       case "boolean":
         if (typeof v !== "boolean") throw new BadRequest(`field '${at}' must be a boolean`);
         break;
+      case "date":
+        if (typeof v !== "string" || !isDateString(v)) throw new BadRequest(`field '${at}' must be a date (YYYY-MM-DD)`);
+        break;
+      case "datetime":
+        if (typeof v !== "string" || !isDateTimeString(v)) throw new BadRequest(`field '${at}' must be a date-time (ISO 8601)`);
+        break;
       case "media":
         // Media ids are uuids (strings) — reject numbers so the value always resolves
         // (collectMediaIds/resolveMediaFields only handle string ids).
@@ -872,6 +891,20 @@ export function createCmsHandlers(opts: CmsHandlerOpts = {}) {
       },
     }),
 
+    /** Edit a media asset's metadata (currently just `alt` text). Editor-gated. */
+    updateMedia: mutation(async (ctx, input: { id: string; alt: string | null }) => {
+      const updated = await cdb(ctx).update("cms_media", input.id, { alt: input.alt ?? null });
+      if (!updated) throw notFound("media");
+      return updated;
+    }, {
+      ...editor,
+      input: (raw): { id: string; alt: string | null } => {
+        const o = asObj(raw);
+        if (typeof o.id !== "string") throw new BadRequest("id is required");
+        return { id: o.id, alt: typeof o.alt === "string" ? o.alt : null };
+      },
+    }),
+
     /** Delete a media row AND its R2 blob. (Automatic orphan sweeping — media no longer
      * referenced by any block — is future work; refs live inside opaque block JSON.) */
     deleteMedia: mutation(async (ctx, input: { id: string }) => {