@velastack/cms 0.2.6 → 0.3.0

package/dist/backend/factory.js

@@ -37,6 +37,7 @@ export const createCmsBackend = (options = {}) => {
     const storage = createStorage(uploadDir);
     const editors = createEditorStore(db);
     const auth = options.auth ?? localEditors();
+    const deploy = options.deploy;
     const restParam = options.restParam ?? 'path';
     const cookieName = options.cookie?.name ?? 'cms_session';
     const resolveProject = options.resolveProject ?? (() => 'default');
@@ -167,6 +168,7 @@ export const createCmsBackend = (options = {}) => {
             respond,
             storage,
             auth,
+            deploy,
             authCtx,
             mediaUrl: mediaUrlFor(event),
             mountPath,

package/dist/backend/index.d.ts

@@ -31,12 +31,14 @@
  * show up in `vela dev`.
  */
 export { createCmsBackend, type CmsBackend } from './factory.js';
+export { CmsDeployError } from './routes/deploy.js';
 export { localEditors, type LocalEditorsOptions } from './auth/local-editors.js';
 export { createEditorStore, type CmsEditorStore, type CreateEditorInput, type CmsSessionToken } from './auth/editors.js';
 export { hashPassword, verifyPassword, type ScryptParams } from './auth/scrypt.js';
 export { createCmsTestClient, type CmsTestClient, type TestResponse } from './testing/harness.js';
 export { createTestFixture, TEST_SCRYPT, type TestFixture, type TestFixtureOptions } from './testing/fixtures.js';
-export type { CmsAuthAdapter, CmsAuthContext, CmsBackendOptions, CmsCookieOptions, CmsCorsOptions, CmsEditor, CmsSessionGrant } from './types.js';
+export type { CmsAuthAdapter, CmsAuthContext, CmsBackendOptions, CmsCookieOptions, CmsCorsOptions, CmsDeployAdapter, CmsDeployContext, CmsDeployRun, CmsDeployState, CmsEditor, CmsSessionGrant } from './types.js';
+export type { CmsStore } from './store/queries.js';
 export type { SqliteDb, SqliteStatement } from './store/sqlite.js';
 export type { Migration } from './store/migrations/index.js';
 export { MIGRATIONS } from './store/migrations/index.js';

package/dist/backend/index.js

@@ -31,6 +31,7 @@
  * show up in `vela dev`.
  */
 export { createCmsBackend } from './factory.js';
+export { CmsDeployError } from './routes/deploy.js';
 export { localEditors } from './auth/local-editors.js';
 export { createEditorStore } from './auth/editors.js';
 export { hashPassword, verifyPassword } from './auth/scrypt.js';

package/dist/backend/routes/context.d.ts

@@ -11,7 +11,7 @@ import type { CmsStore } from '../store/queries.js';
 import type { ReadCache } from '../store/cache.js';
 import type { CmsResponders } from '../http.js';
 import type { CmsStorage } from '../storage.js';
-import type { CmsAuthAdapter, CmsAuthContext, CmsEditor } from '../types.js';
+import type { CmsAuthAdapter, CmsAuthContext, CmsDeployAdapter, CmsEditor } from '../types.js';
 export type RouteCtx = {
     event: RequestEvent;
     /** The tenant this request is for. `'default'` in a single-tenant mount. */
@@ -25,6 +25,8 @@ export type RouteCtx = {
     respond: CmsResponders;
     storage: CmsStorage;
     auth: CmsAuthAdapter;
+    /** The host's deploy adapter, when configured. */
+    deploy?: CmsDeployAdapter;
     authCtx: CmsAuthContext;
     /** Absolute-or-root-relative URL for an uploaded file, per the host's
      * configured media base. */

package/dist/backend/routes/deploy.d.ts

@@ -0,0 +1,9 @@
+import { type RouteCtx } from './context.js';
+/** Thrown by an adapter to map a failure to a status: 409 while a run is in
+ * flight, 503 when the project has no pipeline to deploy through. */
+export declare class CmsDeployError extends Error {
+    readonly status: number;
+    constructor(status: number, message: string);
+}
+export declare const getDeploy: (ctx: RouteCtx) => Promise<Response>;
+export declare const postDeploy: (ctx: RouteCtx) => Promise<Response>;

package/dist/backend/routes/deploy.js

@@ -0,0 +1,46 @@
+import { requireUser } from './context.js';
+/** Thrown by an adapter to map a failure to a status: 409 while a run is in
+ * flight, 503 when the project has no pipeline to deploy through. */
+export class CmsDeployError extends Error {
+    status;
+    constructor(status, message) {
+        super(message);
+        this.status = status;
+        this.name = 'CmsDeployError';
+    }
+}
+const deployContext = (ctx) => ({
+    event: ctx.event,
+    projectId: ctx.projectId,
+    user: requireUser(ctx),
+    store: ctx.store
+});
+/** Adapter errors carry their own status; anything else is a bare 500 so a
+ * host bug never reaches the bar as an HTML error page it would try to parse. */
+const respond = async (run, status) => {
+    try {
+        return Response.json(await run(), { status });
+    }
+    catch (err) {
+        if (err instanceof CmsDeployError) {
+            return new Response(err.message, {
+                status: err.status,
+                headers: { 'content-type': 'text/plain; charset=utf-8' }
+            });
+        }
+        return new Response(null, { status: 500 });
+    }
+};
+export const getDeploy = (ctx) => {
+    const { deploy } = ctx;
+    if (!deploy) {
+        return Promise.resolve(Response.json({ available: false }));
+    }
+    return respond(() => deploy.status(deployContext(ctx)), 200);
+};
+export const postDeploy = (ctx) => {
+    const { deploy } = ctx;
+    if (!deploy)
+        return Promise.resolve(new Response(null, { status: 404 }));
+    return respond(() => deploy.trigger(deployContext(ctx)), 202);
+};

package/dist/backend/routes/table.js

@@ -5,6 +5,7 @@ import { getUser, postLogout } from './user.js';
 import { getLogin, getLoginSuccess, postLogin } from './login.js';
 import { deleteReleaseItems, getRelease, getReleaseHistory, postReleaseDiscard, postReleaseHistoryPreviewKey, postReleaseItems, postReleasePreviewKey, postReleasePublish, postReleaseRevert } from './release.js';
 import { deleteMediaItem, getMedia, getUpload, postMedia } from './media.js';
+import { getDeploy, postDeploy } from './deploy.js';
 import { postTestReset } from './test-reset.js';
 export const ROUTES = [
     { method: 'GET', segments: ['docs'], auth: 'public', handler: getDocs },
@@ -62,6 +63,8 @@ export const ROUTES = [
         auth: 'required',
         handler: postReleaseHistoryPreviewKey
     },
+    { method: 'GET', segments: ['deploy'], auth: 'required', handler: getDeploy },
+    { method: 'POST', segments: ['deploy'], auth: 'required', handler: postDeploy },
     { method: 'GET', segments: ['media'], auth: 'required', handler: getMedia },
     { method: 'POST', segments: ['media'], auth: 'required', handler: postMedia },
     { method: 'DELETE', segments: ['media', ':id'], auth: 'required', handler: deleteMediaItem },

package/dist/backend/types.d.ts

@@ -1,5 +1,8 @@
 import type { RequestEvent } from '@sveltejs/kit';
+import type { CmsDeployState } from '../core/wire.js';
+import type { CmsStore } from './store/queries.js';
 import type { SqliteDb } from './store/sqlite.js';
+export type { CmsDeployRun, CmsDeployState } from '../core/wire.js';
 /** An authenticated content editor. */
 export type CmsEditor = {
     id: string;
@@ -41,6 +44,29 @@ export type CmsAuthAdapter = {
      * regardless. */
     logout?(event: RequestEvent, ctx: CmsAuthContext): Promise<void>;
 };
+/** Handed to every deploy adapter method. `store` is the CMS store, so the
+ * host can read which release is current (`store.getReleaseHistory`). */
+export type CmsDeployContext = {
+    event: RequestEvent;
+    projectId: string;
+    user: CmsEditor;
+    store: CmsStore;
+};
+/**
+ * The seam between the CMS and whatever rebuilds the site.
+ *
+ * A static site bakes published content in at build time, so a publish only
+ * reaches visitors once the site is built again. The host owns that pipeline;
+ * the CMS only exposes it: `status()` backs the admin bar's menu and dialog,
+ * `trigger()` starts a run. Throw `CmsDeployError(409, …)` while a run is in
+ * flight and `CmsDeployError(503, …)` when the project has nothing to deploy to.
+ */
+export type CmsDeployAdapter = {
+    /** Can this project be deployed from the bar, and what happened last. */
+    status(ctx: CmsDeployContext): Promise<CmsDeployState>;
+    /** Start a deploy; resolves with the new state. */
+    trigger(ctx: CmsDeployContext): Promise<CmsDeployState>;
+};
 export type CmsCookieOptions = {
     name?: string;
     path?: string;
@@ -85,6 +111,10 @@ export type CmsBackendOptions = {
     restParam?: string;
     /** Identity and authorization. Defaults to `localEditors()`. */
     auth?: CmsAuthAdapter;
+    /** Rebuilds and deploys the site from the admin bar. Omit it — the default —
+     * and the bar never shows the action, which is right for a same-origin
+     * mount where the site reads the CMS live. */
+    deploy?: CmsDeployAdapter;
     cookie?: CmsCookieOptions;
     /**
      * Cross-origin access. `false` (the default) emits no CORS headers, which is

package/dist/components/admin-bar/admin-bar-internal.svelte

@@ -13,10 +13,13 @@
 	import type { CmsPayload, CmsScopeEntry } from '../cms/scope.js';
 	import CssRoot from './css-root.svelte';
 	import { adminBarTheme, type AdminBarTheme } from './theme.svelte.js';
+	import type { CmsDeployState } from '../../core/wire.js';
 	import DeletePageDialog, {
 		type DeletePageMode,
 		type RedirectTarget
 	} from './delete-page-dialog.svelte';
+	import DeployDialog from './deploy-dialog.svelte';
+	import { isDeploying } from './deploy-state.js';
 	import HistoryPanel from './history-panel.svelte';
 	import KeyboardShortcutsDialog from './keyboard-shortcuts-dialog.svelte';
 	import MediaPanel from './media-panel.svelte';
@@ -83,6 +86,7 @@
 	let shareLinkOpen = $state(false);
 	let shortcutsOpen = $state(false);
 	let siteSettingsOpen = $state(false);
+	let deployOpen = $state(false);
 	const anyPanelOpen = $derived(
 		seoOpen ||
 			historyOpen ||
@@ -93,7 +97,8 @@
 			chooserOpen ||
 			shareLinkOpen ||
 			shortcutsOpen ||
-			siteSettingsOpen
+			siteSettingsOpen ||
+			deployOpen
 	);
 	let publishing = $state(false);
 	let publishError = $state<string | null>(null);
@@ -145,6 +150,7 @@
 		shareLinkOpen = false;
 		shortcutsOpen = false;
 		siteSettingsOpen = false;
+		deployOpen = false;
 		newDialog = null;
 		newPageError = null;
 		duplicateSource = null;
@@ -625,6 +631,71 @@
 		}
 	};
 
+	// Live-site deploy. A static site only shows visitors what was published
+	// when it was last built; the host's deploy adapter rebuilds it. The
+	// backend answers `available: false` unless the host configured one, so a
+	// same-origin mount never shows the item; an older backend 404s and the
+	// state simply stays null.
+	const DEPLOY_POLL_MS = 5000;
+	const DEPLOY_POLL_LIMIT = 120; // ~10 minutes, then leave it to the next mount
+	let deployState = $state<CmsDeployState | null>(null);
+	let deploying = $state(false);
+	let deployError = $state<string | null>(null);
+	const deployAvailable = $derived(deployState?.available === true);
+	const deployInFlight = $derived(isDeploying(deployState));
+
+	const fetchDeployState = async () => {
+		try {
+			const res = await fetch(`${endpoint}/deploy`, { credentials: 'include' });
+			if (!res.ok) return;
+			deployState = (await res.json()) as CmsDeployState;
+		} catch {
+			// Network failure: keep whatever we last knew.
+		}
+	};
+
+	$effect(() => {
+		void fetchDeployState();
+	});
+
+	// Poll while a run is in flight, dialog open or not; the interval is
+	// cleared when the run finishes or the bar unmounts.
+	$effect(() => {
+		if (!deployInFlight) return;
+		let ticks = 0;
+		const id = setInterval(() => {
+			if (++ticks > DEPLOY_POLL_LIMIT) {
+				clearInterval(id);
+				return;
+			}
+			void fetchDeployState();
+		}, DEPLOY_POLL_MS);
+		return () => clearInterval(id);
+	});
+
+	const onOpenDeploy = () => {
+		if (!deployAvailable || deployInFlight) return;
+		closeAllPanels();
+		deployError = null;
+		deployOpen = true;
+	};
+
+	const onConfirmDeploy = async () => {
+		deploying = true;
+		deployError = null;
+		try {
+			const res = await fetch(`${endpoint}/deploy`, { method: 'POST', credentials: 'include' });
+			if (!res.ok) {
+				deployError = (await res.text()) || 'Could not start the deploy.';
+				return;
+			}
+			deployState = (await res.json()) as CmsDeployState;
+			deployOpen = false;
+		} finally {
+			deploying = false;
+		}
+	};
+
 	const refreshAfterReleaseChange = async () => {
 		const key = cmsStore.openRelease?.preview_key ?? null;
 		await setPreviewParam(key, { replace: true });
@@ -1350,6 +1421,17 @@
 								Discard All Changes…
 							</Menubar.Item>
 
+							{#if deployAvailable}
+								<Menubar.Label class={menuLabelClass}>Live site</Menubar.Label>
+								<Menubar.Item
+									class={menuItemClass}
+									onSelect={onOpenDeploy}
+									disabled={deployInFlight}
+								>
+									{deployInFlight ? 'Deploying…' : 'Deploy Site…'}
+								</Menubar.Item>
+							{/if}
+
 							<Menubar.Label class={menuLabelClass}>History</Menubar.Label>
 							<Menubar.Item class={menuItemClass} onSelect={onOpenHistory}>
 								Recent Releases
@@ -1688,6 +1770,18 @@
 			onRegenerate={onRegeneratePreviewKey}
 		/>
 
+		{#if deployState?.available}
+			<DeployDialog
+				open={deployOpen}
+				onOpenChange={(next) => (deployOpen = next)}
+				deploy={deployState}
+				unpublishedCount={counts.total}
+				{deploying}
+				error={deployError}
+				onConfirm={onConfirmDeploy}
+			/>
+		{/if}
+
 		<KeyboardShortcutsDialog open={shortcutsOpen} onOpenChange={(next) => (shortcutsOpen = next)} />
 	</div>
 </CssRoot>

package/dist/components/admin-bar/deploy-dialog.svelte

@@ -0,0 +1,76 @@
+<script lang="ts">
+	import type { CmsDeployState } from '../../core/wire.js';
+	import { describeLatestRun, isDeploying } from './deploy-state.js';
+	import { Button } from './ui/button/index.js';
+	import * as Dialog from './ui/dialog/index.js';
+
+	type Props = {
+		open: boolean;
+		onOpenChange: (open: boolean) => void;
+		deploy: CmsDeployState;
+		/** Items in the working copy; they are not part of a deploy. */
+		unpublishedCount: number;
+		/** The POST is in flight. */
+		deploying: boolean;
+		error: string | null;
+		onConfirm: () => void;
+	};
+	let { open, onOpenChange, deploy, unpublishedCount, deploying, error, onConfirm }: Props =
+		$props();
+
+	const inFlight = $derived(isDeploying(deploy));
+	const status = $derived(describeLatestRun(deploy.latest));
+</script>
+
+<Dialog.Root
+	{open}
+	onOpenChange={(next) => {
+		if (!next && deploying) return;
+		onOpenChange(next);
+	}}
+>
+	<Dialog.Content class="vela:max-w-[28rem]">
+		<Dialog.Header>
+			<Dialog.Title>Deploy site</Dialog.Title>
+			<Dialog.Description>
+				Rebuilds the site with the latest published content and puts it live at
+				<span class="vela:font-mono vela:text-bar-text">{deploy.site?.url ?? 'the live site'}</span
+				>. Visitors only see published changes after a deploy.
+			</Dialog.Description>
+		</Dialog.Header>
+
+		<div class="vela:px-6 vela:pb-4 vela:flex vela:flex-col vela:gap-3">
+			<p class="vela:m-0 vela:text-[12px] vela:text-bar-text-secondary">{status}</p>
+
+			{#if unpublishedCount > 0}
+				<p
+					class="vela:m-0 vela:px-3 vela:py-2 vela:rounded-md vela:text-[12px]
+						vela:bg-[var(--cms-status-warn-bg)] vela:text-[var(--cms-status-warn-text)]"
+				>
+					{unpublishedCount}
+					{unpublishedCount === 1 ? 'unpublished change' : 'unpublished changes'} in your working copy
+					will not be included. Publish first to put them live.
+				</p>
+			{/if}
+
+			{#if error}
+				<p
+					role="alert"
+					class="vela:m-0 vela:px-3 vela:py-2 vela:rounded-md vela:text-[12px]
+						vela:bg-[var(--cms-status-error-bg)] vela:text-[var(--cms-status-error-text)]"
+				>
+					{error}
+				</p>
+			{/if}
+		</div>
+
+		<Dialog.Footer class="vela:justify-end vela:pt-2">
+			<Button variant="ghost" onclick={() => onOpenChange(false)} disabled={deploying}
+				>Cancel</Button
+			>
+			<Button variant="default" onclick={onConfirm} disabled={deploying || inFlight}>
+				{deploying ? 'Deploying…' : 'Deploy'}
+			</Button>
+		</Dialog.Footer>
+	</Dialog.Content>
+</Dialog.Root>

package/dist/components/admin-bar/deploy-dialog.svelte.d.ts

@@ -0,0 +1,15 @@
+import type { CmsDeployState } from '../../core/wire.js';
+type Props = {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    deploy: CmsDeployState;
+    /** Items in the working copy; they are not part of a deploy. */
+    unpublishedCount: number;
+    /** The POST is in flight. */
+    deploying: boolean;
+    error: string | null;
+    onConfirm: () => void;
+};
+declare const DeployDialog: import("svelte").Component<Props, {}, "">;
+type DeployDialog = ReturnType<typeof DeployDialog>;
+export default DeployDialog;

package/dist/components/admin-bar/deploy-state.d.ts

@@ -0,0 +1,7 @@
+/**
+ * What the bar shows for a site deploy, kept out of the component so it can be
+ * unit tested: whether a run is in flight, and the one-line status of the last.
+ */
+import type { CmsDeployRun, CmsDeployState } from '../../core/wire.js';
+export declare const isDeploying: (state: CmsDeployState | null) => boolean;
+export declare const describeLatestRun: (latest: CmsDeployRun | null | undefined, now?: number) => string;

package/dist/components/admin-bar/deploy-state.js

@@ -0,0 +1,13 @@
+import { formatRelative } from './format-relative.js';
+export const isDeploying = (state) => state?.latest?.status === 'pending' || state?.latest?.status === 'building';
+export const describeLatestRun = (latest, now = Date.now()) => {
+    if (!latest)
+        return 'Never deployed';
+    if (latest.status === 'pending' || latest.status === 'building')
+        return 'Deploying…';
+    const when = formatRelative(latest.finishedAt ?? latest.createdAt, now);
+    if (latest.status === 'failed') {
+        return latest.error ? `Deploy failed ${when}: ${latest.error}` : `Deploy failed ${when}`;
+    }
+    return `Deployed ${when}`;
+};

package/dist/components/admin-bar/format-relative.d.ts

@@ -0,0 +1,6 @@
+/**
+ * A timestamp as the bar speaks about it: "just now", "5 minutes ago", "this
+ * afternoon", "yesterday", then a short date. Shared by the publish and
+ * deploy dialogs; `now` is a parameter so tests can pin it.
+ */
+export declare const formatRelative: (iso: string, now?: number) => string;

package/dist/components/admin-bar/format-relative.js

@@ -0,0 +1,37 @@
+/**
+ * A timestamp as the bar speaks about it: "just now", "5 minutes ago", "this
+ * afternoon", "yesterday", then a short date. Shared by the publish and
+ * deploy dialogs; `now` is a parameter so tests can pin it.
+ */
+export const formatRelative = (iso, now = Date.now()) => {
+    const t = new Date(iso).getTime();
+    if (Number.isNaN(t))
+        return '';
+    const seconds = Math.max(0, Math.floor((now - t) / 1000));
+    if (seconds < 45)
+        return 'just now';
+    const minutes = Math.floor(seconds / 60);
+    if (minutes < 60)
+        return minutes <= 1 ? '1 minute ago' : `${minutes} minutes ago`;
+    const d = new Date(t);
+    const today = new Date(now);
+    const sameDay = d.getFullYear() === today.getFullYear() &&
+        d.getMonth() === today.getMonth() &&
+        d.getDate() === today.getDate();
+    if (sameDay) {
+        const h = d.getHours();
+        if (h < 12)
+            return 'this morning';
+        if (h < 17)
+            return 'this afternoon';
+        return 'this evening';
+    }
+    const yesterday = new Date(today);
+    yesterday.setDate(yesterday.getDate() - 1);
+    const isYesterday = d.getFullYear() === yesterday.getFullYear() &&
+        d.getMonth() === yesterday.getMonth() &&
+        d.getDate() === yesterday.getDate();
+    if (isYesterday)
+        return 'yesterday';
+    return d.toLocaleDateString(undefined, { month: 'short', day: 'numeric' });
+};

package/dist/components/admin-bar/publish-dialog.svelte

@@ -3,6 +3,7 @@
 	import type { ReleaseItem } from '../cms/cms-store.svelte.js';
 	import type { CmsPayload } from '../cms/scope.js';
 	import { diffPaths, type Tree } from '../../core/path.js';
+	import { formatRelative } from './format-relative.js';
 	import { resolveRouteOnlyParams, resolveRouteUrl } from './resolve-route.js';
 	import { Badge, type BadgeVariant } from './ui/badge/index.js';
 	import { Button } from './ui/button/index.js';
@@ -229,36 +230,6 @@
 		return summarizeNames(meta, 'Updated');
 	};
 
-	const formatRelative = (iso: string): string => {
-		const t = new Date(iso).getTime();
-		if (Number.isNaN(t)) return '';
-		const now = Date.now();
-		const seconds = Math.max(0, Math.floor((now - t) / 1000));
-		if (seconds < 45) return 'just now';
-		const minutes = Math.floor(seconds / 60);
-		if (minutes < 60) return minutes <= 1 ? '1 minute ago' : `${minutes} minutes ago`;
-		const d = new Date(t);
-		const today = new Date(now);
-		const sameDay =
-			d.getFullYear() === today.getFullYear() &&
-			d.getMonth() === today.getMonth() &&
-			d.getDate() === today.getDate();
-		if (sameDay) {
-			const h = d.getHours();
-			if (h < 12) return 'this morning';
-			if (h < 17) return 'this afternoon';
-			return 'this evening';
-		}
-		const yesterday = new Date(today);
-		yesterday.setDate(yesterday.getDate() - 1);
-		const isYesterday =
-			d.getFullYear() === yesterday.getFullYear() &&
-			d.getMonth() === yesterday.getMonth() &&
-			d.getDate() === yesterday.getDate();
-		if (isYesterday) return 'yesterday';
-		return d.toLocaleDateString(undefined, { month: 'short', day: 'numeric' });
-	};
-
 	/** Submit-disabled gate: nothing to publish when there are no items at all.
 	 *  (Group count is fine here too — no items → no groups.) */
 	const total = $derived(items.length);

package/dist/core/wire.d.ts

@@ -155,6 +155,23 @@ export type ListMediaResult = {
     items: MediaItem[];
     total: number;
 };
+/** One build-and-deploy of the site, as the host's deploy adapter reports it. */
+export type CmsDeployRun = {
+    id: string;
+    status: 'pending' | 'building' | 'deployed' | 'failed';
+    createdAt: string;
+    finishedAt?: string;
+    error?: string;
+};
+/** `GET /deploy` and `POST /deploy`. `available` is `false` when the backend
+ * has no deploy adapter, which is how a same-origin mount hides the action. */
+export type CmsDeployState = {
+    available: boolean;
+    site?: {
+        url: string;
+    };
+    latest?: CmsDeployRun | null;
+};
 export type DocsResponse = {
     contents: Tree;
 } | PageDeleteOutcome;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@velastack/cms",
-	"version": "0.2.6",
+	"version": "0.3.0",
 	"description": "A scope-aware CMS for SvelteKit, for static or dynamic sites.",
 	"keywords": [
 		"svelte",