@rimelight/cms 0.0.1

package/src/astro/blocks/ScriptBlock.astro

@@ -0,0 +1,59 @@
+---
+import type { BaseBlock } from "@rimelight/cms"
+
+interface Props {
+  block: BaseBlock
+  locale?: string
+}
+
+const { block } = Astro.props
+const { title, synopsis, characters, aPlot, bPlot, cPlot, stinger } = block.props
+---
+
+<div class="my-6 p-4 border-l-4 border-amber-400 bg-amber-50/20 dark:bg-amber-950/10 rounded-r-lg">
+  <div class="mb-4">
+    <h3 class="text-xl font-bold text-amber-900 dark:text-amber-100">{title}</h3>
+    {synopsis && <p class="text-sm text-gray-600 dark:text-gray-400 mt-1 italic">{synopsis}</p>}
+    {characters && characters.length > 0 && (
+      <div class="flex flex-wrap gap-3 mt-3 text-xs">
+        {characters.map((char: string) => (
+          <span class="px-2 py-0.5 rounded-full bg-amber-100 dark:bg-amber-900/30 text-amber-800 dark:text-amber-200">
+            {char}
+          </span>
+        ))}
+      </div>
+    )}
+  </div>
+  {(aPlot || bPlot || cPlot) && (
+    <div class="grid grid-cols-1 md:grid-cols-3 gap-3 my-3">
+      {aPlot && (
+        <div class="bg-white/50 dark:bg-neutral-900/30 rounded p-2 border border-gray-200 dark:border-gray-700">
+          <div class="text-[10px] font-bold uppercase tracking-wider text-gray-600 dark:text-gray-400">A Plot</div>
+          <div class="text-sm mt-0.5">{aPlot}</div>
+        </div>
+      )}
+      {bPlot && (
+        <div class="bg-white/50 dark:bg-neutral-900/30 rounded p-2 border border-gray-200 dark:border-gray-700">
+          <div class="text-[10px] font-bold uppercase tracking-wider text-gray-600 dark:text-gray-400">B Plot</div>
+          <div class="text-sm mt-0.5">{bPlot}</div>
+        </div>
+      )}
+      {cPlot && (
+        <div class="bg-white/50 dark:bg-neutral-900/30 rounded p-2 border border-gray-200 dark:border-gray-700">
+          <div class="text-[10px] font-bold uppercase tracking-wider text-gray-600 dark:text-gray-400">C Plot</div>
+          <div class="text-sm mt-0.5">{cPlot}</div>
+        </div>
+      )}
+    </div>
+  )}
+  {stinger && (
+    <p class="text-sm text-gray-600 dark:text-gray-400 italic mt-2 border-t border-gray-200 dark:border-gray-700 pt-2">
+      Stinger: {stinger}
+    </p>
+  )}
+  {((block.children && block.children.length > 0) || (block.props?.children && block.props.children.length > 0)) && (
+    <div class="mt-4">
+      <slot />
+    </div>
+  )}
+</div>

package/src/astro/blocks/SectionBlock.astro

@@ -0,0 +1,46 @@
+---
+import { type BaseBlock, type HeadingLevel, calculateHeadingLevel } from "../../core/types/blocks"
+
+interface Props {
+  block: BaseBlock
+  locale?: string
+  sectionDepth?: number
+}
+
+const { block, sectionDepth = 0 } = Astro.props
+const { title = "", description = "" } = block.props || {}
+
+function slugify(text: string): string {
+  return text
+    .toString()
+    .toLowerCase()
+    .normalize("NFD")
+    .replace(/[\u0300-\u036f]/g, "")
+    .replace(/\s+/g, "-")
+    .replace(/[^\w-]+/g, "")
+    .replace(/-{2,}/g, "-")
+    .replace(/^-+/, "")
+    .replace(/-+$/, "")
+}
+
+const safeLevel = calculateHeadingLevel(sectionDepth)
+const headingId = title ? slugify(title) : undefined
+
+const headingClasses: Record<HeadingLevel, string> = {
+  2: "text-3xl font-bold text-neutral-900 dark:text-white mt-6 mb-3 border-b border-gray-200 dark:border-gray-800 pb-2",
+  3: "text-2xl font-semibold text-neutral-900 dark:text-white mt-5 mb-2.5",
+  4: "text-xl font-medium text-neutral-900 dark:text-white mt-4 mb-2",
+  5: "text-lg font-medium text-neutral-800 dark:text-neutral-200 mt-3 mb-1.5",
+  6: "text-base font-normal text-neutral-700 dark:text-neutral-300 mt-2 mb-1"
+}
+
+const Tag = `h${safeLevel}` as any
+---
+
+<section id={headingId} class="cms-section my-6 scroll-mt-20" data-block-id={block.id}>
+  {title && <Tag class={headingClasses[safeLevel] || headingClasses[2]}>{title}</Tag>}
+  {description && <p class="text-sm text-gray-500 dark:text-gray-400 mt-1 mb-4 italic">{description}</p>}
+  <div class="mt-4">
+    <slot />
+  </div>
+</section>

package/src/astro/blocks/StepItemBlock.astro

@@ -0,0 +1,25 @@
+---
+import type { BaseBlock } from "../../core/types/blocks"
+
+interface Props {
+  block: BaseBlock
+  locale?: string
+  index?: number
+}
+
+const { block, index = 0 } = Astro.props
+const { title = "", description = "" } = block.props || {}
+---
+
+<div class="cms-step-item relative" data-block-id={block.id}>
+  <div class="absolute -left-[35px] top-0 flex size-6 items-center justify-center rounded-full bg-neutral-900 text-white dark:bg-white dark:text-neutral-900 text-xs font-bold ring-4 ring-white dark:ring-neutral-950">
+    {index + 1}
+  </div>
+  <div class="space-y-2">
+    {title && <h3 class="text-base font-semibold text-neutral-900 dark:text-white mt-0">{title}</h3>}
+    {description && <p class="text-sm text-neutral-600 dark:text-neutral-400 mt-1">{description}</p>}
+    <div class="mt-3">
+      <slot />
+    </div>
+  </div>
+</div>

package/src/astro/blocks/StepsBlock.astro

@@ -0,0 +1,14 @@
+---
+import type { BaseBlock } from "../../core/types/blocks"
+
+interface Props {
+  block: BaseBlock
+  locale?: string
+}
+
+const { block } = Astro.props
+---
+
+<div class="cms-steps my-6 relative border-l-2 border-neutral-200 dark:border-neutral-800 ml-4 pl-6 space-y-6" data-block-id={block.id}>
+  <slot />
+</div>

package/src/astro/blocks/TabItemBlock.astro

@@ -0,0 +1,19 @@
+---
+import type { BaseBlock } from "../../core/types/blocks"
+
+interface Props {
+  block: BaseBlock
+  locale?: string
+  index?: number
+  isFirst?: boolean
+}
+
+const { block, isFirst = false } = Astro.props
+---
+
+<div
+  class={`cms-tab-panel ${isFirst ? "" : "hidden"}`}
+  data-block-id={block.id}
+>
+  <slot />
+</div>

package/src/astro/blocks/TableBlock.astro

@@ -0,0 +1,49 @@
+---
+import type { BaseBlock } from "../../core/types/blocks"
+
+interface Props {
+  block: BaseBlock
+  locale?: string
+}
+
+const { block } = Astro.props
+const { columns = [], rows = [], caption } = block.props || {}
+---
+
+<div class="cms-table my-6 overflow-x-auto rounded-lg border border-neutral-200 dark:border-neutral-800" data-block-id={block.id}>
+  <table class="w-full text-left text-sm border-collapse">
+    {caption && (
+      <caption class="p-2 text-xs text-neutral-500 dark:text-neutral-400 italic text-left">
+        {caption}
+      </caption>
+    )}
+    {columns.length > 0 && (
+      <thead class="bg-neutral-50 dark:bg-neutral-900 border-b border-neutral-200 dark:border-neutral-800 font-medium text-neutral-700 dark:text-neutral-200">
+        <tr>
+          {columns.map((col: any) => (
+            <th
+              class="px-4 py-3 text-xs font-semibold uppercase tracking-wider"
+              style={col.align ? `text-align: ${col.align};` : undefined}
+            >
+              {col.header || col.key}
+            </th>
+          ))}
+        </tr>
+      </thead>
+    )}
+    <tbody class="divide-y divide-neutral-200 dark:divide-neutral-800 bg-white dark:bg-neutral-950">
+      {rows.map((row: any) => (
+        <tr class="hover:bg-neutral-50/50 dark:hover:bg-neutral-900/50 transition-colors">
+          {columns.map((col: any) => (
+            <td
+              class="px-4 py-3 text-neutral-800 dark:text-neutral-200"
+              style={col.align ? `text-align: ${col.align};` : undefined}
+            >
+              {row[col.key] ?? ""}
+            </td>
+          ))}
+        </tr>
+      ))}
+    </tbody>
+  </table>
+</div>

package/src/astro/blocks/TabsBlock.astro

@@ -0,0 +1,67 @@
+---
+import type { BaseBlock } from "../../core/types/blocks"
+
+interface Props {
+  block: BaseBlock
+  locale?: string
+}
+
+const { block } = Astro.props
+const children: BaseBlock[] = block.children || block.props?.children || []
+const defaultValue = block.props?.defaultValue || (children[0]?.props?.value || children[0]?.props?.label || "tab-0")
+const tabsId = `tabs-${block.id}`
+---
+
+<div class="cms-tabs my-6 border border-neutral-200 dark:border-neutral-800 rounded-xl overflow-hidden" data-block-id={block.id} id={tabsId}>
+  <div class="flex items-center gap-1 border-b border-neutral-200 dark:border-neutral-800 bg-neutral-50 dark:bg-neutral-900 px-3 pt-2">
+    {children.map((child, index) => {
+      const val = child.props?.value || child.props?.label || `tab-${index}`
+      const isDefault = val === defaultValue || (!defaultValue && index === 0)
+      return (
+        <button
+          type="button"
+          class={`cms-tab-btn px-3 py-1.5 text-xs font-medium rounded-t-md transition-all border-b-2 -mb-px ${
+            isDefault
+              ? "text-primary-600 dark:text-primary-400 border-primary-500 bg-white dark:bg-neutral-950 font-semibold"
+              : "text-neutral-600 dark:text-neutral-400 border-transparent hover:text-neutral-900 dark:hover:text-neutral-200"
+          }`}
+          data-tab-target={`${tabsId}-panel-${index}`}
+        >
+          {child.props?.icon && <span class={`${child.props.icon} mr-1.5 inline-block size-3.5 align-text-bottom`} />}
+          {child.props?.label || `Tab ${index + 1}`}
+        </button>
+      )
+    })}
+  </div>
+  <div class="cms-tabs-content p-4 bg-white dark:bg-neutral-950">
+    <slot />
+  </div>
+</div>
+
+<script is:inline define:vars={{ tabsId }}>
+  (() => {
+    const root = document.getElementById(tabsId);
+    if (!root) return;
+    const btns = root.querySelectorAll('.cms-tab-btn');
+    const panels = root.querySelectorAll('.cms-tab-panel');
+
+    btns.forEach((btn, idx) => {
+      btn.addEventListener('click', () => {
+        btns.forEach((b) => {
+          b.classList.remove('text-primary-600', 'dark:text-primary-400', 'border-primary-500', 'bg-white', 'dark:bg-neutral-950', 'font-semibold');
+          b.classList.add('text-neutral-600', 'dark:text-neutral-400', 'border-transparent');
+        });
+        btn.classList.add('text-primary-600', 'dark:text-primary-400', 'border-primary-500', 'bg-white', 'dark:bg-neutral-950', 'font-semibold');
+        btn.classList.remove('text-neutral-600', 'dark:text-neutral-400', 'border-transparent');
+
+        panels.forEach((p, pIdx) => {
+          if (pIdx === idx) {
+            p.classList.remove('hidden');
+          } else {
+            p.classList.add('hidden');
+          }
+        });
+      });
+    });
+  })();
+</script>

package/src/astro/blocks/UnorderedListBlock.astro

@@ -0,0 +1,55 @@
+---
+import type { BaseBlock } from "../../core/types/blocks"
+import type { InlineNode } from "../../core/types/inline"
+
+interface Props {
+  block: BaseBlock
+  locale?: string
+}
+
+const { block } = Astro.props
+const items = block.props?.items || block.children || []
+
+function escapeHtml(str: string): string {
+  return (str || "")
+    .replace(/&/g, "&")
+    .replace(/</g, "&lt;")
+    .replace(/>/g, "&gt;")
+    .replace(/"/g, "&quot;")
+}
+
+function renderNodesToHtml(nodes: InlineNode[]): string {
+  if (!Array.isArray(nodes)) return ""
+  return nodes
+    .map((node) => {
+      if (!node) return ""
+      if (node.type === "text") {
+        let t = escapeHtml(node.text || "")
+        if (node.marks && Array.isArray(node.marks)) {
+          if (node.marks.includes("bold")) t = `<strong>${t}</strong>`
+          if (node.marks.includes("italic")) t = `<em>${t}</em>`
+          if (node.marks.includes("underline")) t = `<u>${t}</u>`
+          if (node.marks.includes("strikethrough")) t = `<s>${t}</s>`
+          if (node.marks.includes("code")) {
+            t = `<code class="bg-neutral-800 text-neutral-200 px-1.5 py-0.5 rounded text-sm font-mono">${t}</code>`
+          }
+        }
+        return t
+      }
+      if (node.type === "link") {
+        const inner = node.children ? renderNodesToHtml(node.children) : escapeHtml((node as any).text || "")
+        const target = node.openInNewTab ? ' target="_blank" rel="noopener noreferrer"' : ""
+        const href = escapeHtml(node.url || "#")
+        return `<a href="${href}"${target} class="text-blue-500 hover:text-blue-400 underline underline-offset-2">${inner}</a>`
+      }
+      return ""
+    })
+    .join("")
+}
+---
+
+<ul class="cms-unordered-list list-disc list-inside space-y-2 my-4 text-base text-neutral-800 dark:text-neutral-200" data-block-id={block.id}>
+  {items.map((item: BaseBlock) => (
+    <li set:html={renderNodesToHtml(item.props?.content || [])} />
+  ))}
+</ul>

package/src/auth/editor-guards.ts

@@ -0,0 +1,148 @@
+import type { BaseBlock } from "../core/types/blocks"
+import type { UserSessionContext } from "./permissions"
+
+/**
+ * Checks if a user has edit rights over a specific block
+ */
+export function canUserEditBlock(block: BaseBlock, session?: UserSessionContext): boolean {
+  if (block.allowedRoles && block.allowedRoles.length > 0) {
+    if (!session || !session.roles.some((r) => block.allowedRoles!.includes(r))) {
+      return false
+    }
+  }
+  if (block.requiredPermission) {
+    if (!session || !session.permissions.includes(block.requiredPermission)) {
+      return false
+    }
+  }
+  return true
+}
+
+/**
+ * Recursively checks if a block or ANY of its descendants are locked or un-editable
+ */
+export function hasLockedDescendants(block: BaseBlock, session?: UserSessionContext): boolean {
+  if (!canUserEditBlock(block, session)) return true
+  if (block.isTemplated) return true
+
+  if (block.children?.length) {
+    return block.children.some((child) => hasLockedDescendants(child, session))
+  }
+
+  return false
+}
+
+/**
+ * Server-Side Guard: Validates that an incoming edited block tree obeys templated & authorization
+ * invariants
+ */
+export function validateServerBlockPayload(
+  existingTree: BaseBlock[],
+  incomingTree: BaseBlock[],
+  session?: UserSessionContext
+): { valid: boolean; reason?: string } {
+  const existingTemplated = extractTemplatedBlocks(existingTree)
+  const incomingTemplated = extractTemplatedBlocks(incomingTree)
+
+  if (existingTemplated.length !== incomingTemplated.length) {
+    return { valid: false, reason: "Forbidden: One or more templated blocks were removed." }
+  }
+
+  for (let i = 0; i < existingTemplated.length; i++) {
+    const existing = existingTemplated[i]
+    const incoming = incomingTemplated[i]
+    if (!existing || !incoming || existing.id !== incoming.id || existing.type !== incoming.type) {
+      return { valid: false, reason: "Forbidden: Reordering of templated blocks is forbidden." }
+    }
+  }
+
+  for (const existingBlock of existingTemplated) {
+    const incomingBlock = incomingTemplated.find(
+      (b) => b.type === existingBlock.type && b.id === existingBlock.id
+    )
+    if (!incomingBlock) {
+      return {
+        valid: false,
+        reason: `Forbidden: Templated block ${existingBlock.type} (ID: ${existingBlock.id}) missing in payload.`
+      }
+    }
+
+    if (existingBlock.templatedProps === true) {
+      if (JSON.stringify(existingBlock.props) !== JSON.stringify(incomingBlock.props)) {
+        return {
+          valid: false,
+          reason: `Forbidden: Cannot modify locked properties on ${existingBlock.type}.`
+        }
+      }
+    } else if (Array.isArray(existingBlock.templatedProps)) {
+      for (const key of existingBlock.templatedProps) {
+        if (JSON.stringify(existingBlock.props[key]) !== JSON.stringify(incomingBlock.props[key])) {
+          return {
+            valid: false,
+            reason: `Forbidden: Cannot modify locked property '${key}' on ${existingBlock.type}.`
+          }
+        }
+      }
+    }
+  }
+
+  if (session) {
+    const existingProtected = extractProtectedBlocks(existingTree)
+    const incomingMap = new Map(flattenBlocks(incomingTree).map((b) => [b.id, b]))
+
+    for (const existingBlock of existingProtected) {
+      const incomingBlock = incomingMap.get(existingBlock.id)
+      if (!canUserEditBlock(existingBlock, session)) {
+        if (!incomingBlock) {
+          return {
+            valid: false,
+            reason: `Forbidden: Cannot delete protected block ${existingBlock.type} (ID: ${existingBlock.id}).`
+          }
+        }
+        if (JSON.stringify(existingBlock.props) !== JSON.stringify(incomingBlock.props)) {
+          return {
+            valid: false,
+            reason: `Forbidden: Cannot modify protected block ${existingBlock.type} (ID: ${existingBlock.id}).`
+          }
+        }
+      }
+    }
+  }
+
+  return { valid: true }
+}
+
+function getChildren(b: BaseBlock): BaseBlock[] {
+  if (!b) return []
+  if (Array.isArray(b.props?.children)) return b.props.children
+  if (Array.isArray(b.children)) return b.children
+  return []
+}
+
+function flattenBlocks(blocks: BaseBlock[]): BaseBlock[] {
+  let result: BaseBlock[] = []
+  for (const b of blocks) {
+    if (!b) continue
+    result.push(b)
+    const children = getChildren(b)
+    if (children.length) result = result.concat(flattenBlocks(children))
+  }
+  return result
+}
+
+function extractTemplatedBlocks(blocks: BaseBlock[]): BaseBlock[] {
+  let result: BaseBlock[] = []
+  for (const b of blocks) {
+    if (!b) continue
+    if (b.isTemplated) result.push(b)
+    const children = getChildren(b)
+    if (children.length) result = result.concat(extractTemplatedBlocks(children))
+  }
+  return result
+}
+
+function extractProtectedBlocks(blocks: BaseBlock[]): BaseBlock[] {
+  return flattenBlocks(blocks).filter(
+    (b) => (b.allowedRoles && b.allowedRoles.length > 0) || !!b.requiredPermission
+  )
+}

package/src/auth/filter-blocks.ts

@@ -0,0 +1,44 @@
+import type { BaseBlock } from "../core/types/blocks"
+import type { UserSessionContext } from "./permissions"
+
+/**
+ * Pure immutable function for Astro SSR Reader. Returns new array; never mutates input AST
+ */
+export function filterBlocksForReader(
+  blocks: BaseBlock[],
+  session?: UserSessionContext
+): BaseBlock[] {
+  const filtered: BaseBlock[] = []
+
+  for (const block of blocks) {
+    if (block.allowedRoles && block.allowedRoles.length > 0) {
+      if (!session || !session.roles.some((r) => block.allowedRoles!.includes(r))) {
+        continue
+      }
+    }
+    if (block.requiredPermission) {
+      if (!session || !session.permissions.includes(block.requiredPermission)) {
+        continue
+      }
+    }
+
+    const filteredChildren = block.children?.length
+      ? filterBlocksForReader(block.children, session)
+      : block.children
+
+    const newBlock: BaseBlock = {
+      id: block.id,
+      type: block.type,
+      props: block.props
+    }
+    if (filteredChildren !== undefined) newBlock.children = filteredChildren
+    if (block.isTemplated !== undefined) newBlock.isTemplated = block.isTemplated
+    if (block.templatedProps !== undefined) newBlock.templatedProps = block.templatedProps
+    if (block.allowedRoles !== undefined) newBlock.allowedRoles = block.allowedRoles
+    if (block.requiredPermission !== undefined)
+      newBlock.requiredPermission = block.requiredPermission
+    filtered.push(newBlock)
+  }
+
+  return filtered
+}

package/src/auth/filter-templates.ts

@@ -0,0 +1,81 @@
+import type { PageTemplate } from "../core/types/templates"
+import type { UserSessionContext } from "./permissions"
+
+export function canUserCreateFromTemplate(
+  template: PageTemplate,
+  session?: UserSessionContext
+): boolean {
+  const allowedCreate = template.rolePermissions?.whoCanCreate?.length
+    ? template.rolePermissions.whoCanCreate
+    : template.allowedRoles
+
+  if (allowedCreate && allowedCreate.length > 0) {
+    if (!session || !session.roles.some((r) => allowedCreate.includes(r))) {
+      return false
+    }
+  }
+
+  if (template.requiredPermission) {
+    if (!session || !session.permissions.includes(template.requiredPermission)) {
+      return false
+    }
+  }
+
+  return true
+}
+
+export function canUserEditFromTemplate(
+  template: PageTemplate,
+  session?: UserSessionContext
+): boolean {
+  const allowedEdit = template.rolePermissions?.whoCanEdit
+  if (allowedEdit && allowedEdit.length > 0) {
+    if (!session || !session.roles.some((r) => allowedEdit.includes(r))) {
+      return false
+    }
+  }
+  return true
+}
+
+export function canUserReviewFromTemplate(
+  template: PageTemplate,
+  session?: UserSessionContext
+): boolean {
+  const allowedReview = template.rolePermissions?.whoCanReview?.length
+    ? template.rolePermissions.whoCanReview
+    : template.approvalRules?.requiredRolesForApproval
+
+  if (allowedReview && allowedReview.length > 0) {
+    if (!session || !session.roles.some((r) => allowedReview.includes(r))) {
+      return false
+    }
+  }
+  return true
+}
+
+export function canUserViewFromTemplate(
+  template: PageTemplate,
+  session?: UserSessionContext
+): boolean {
+  const allowedView = template.rolePermissions?.whoCanView
+  if (allowedView && allowedView.length > 0) {
+    if (!session || !session.roles.some((r) => allowedView.includes(r))) {
+      return false
+    }
+  }
+  return true
+}
+
+export function canUserInstantiateTemplate(
+  template: PageTemplate,
+  session?: UserSessionContext
+): boolean {
+  return canUserCreateFromTemplate(template, session)
+}
+
+export function filterTemplatesForUser(
+  templates: PageTemplate[],
+  session?: UserSessionContext
+): PageTemplate[] {
+  return templates.filter((t) => canUserInstantiateTemplate(t, session))
+}

package/src/auth/permissions.ts

@@ -0,0 +1,40 @@
+export const cmsStatements = {
+  page: ["create", "read", "update", "delete", "publish", "approve"],
+  template: ["create", "read", "update", "delete", "instantiate"],
+  draft: ["checkout", "edit", "release", "force_unlock"],
+  version: ["create", "review", "approve", "publish"]
+} as const
+
+export const cmsAc = {
+  page: {
+    read: ["admin", "editor"],
+    update: ["admin", "editor"],
+    delete: ["admin"],
+    publish: ["admin"],
+    approve: ["admin"]
+  },
+  template: {
+    read: ["admin", "editor"],
+    update: ["admin"],
+    delete: ["admin"],
+    instantiate: ["admin", "editor"]
+  },
+  draft: {
+    checkout: ["admin", "editor"],
+    edit: ["admin", "editor"],
+    release: ["admin", "editor"],
+    force_unlock: ["admin"]
+  },
+  version: {
+    create: ["admin", "editor"],
+    review: ["admin", "editor"],
+    approve: ["admin"],
+    publish: ["admin"]
+  }
+} as const
+
+export interface UserSessionContext {
+  userId: string
+  roles: string[]
+  permissions: string[]
+}