@acms-subir/core 0.3.10 → 0.3.12

package/cli/preview.mjs

@@ -17,7 +17,7 @@ export async function prepareFixture(p,dir,slug){
   await writeFile(join(root,'package.json'),JSON.stringify({name:'acms-isolated-preview',type:'module',private:true}));
   await writeFile(join(root,'astro.config.mjs'),`import {defineConfig,passthroughImageService} from 'astro/config';\nimport react from '@astrojs/react';\nimport node from '@astrojs/node';\nimport cloudflare from '@astrojs/cloudflare';\nimport acms from '@acms-subir/core';\nexport default defineConfig({output:'server',vite:{resolve:{preserveSymlinks:true}},integrations:[react(),acms({seed:{siteTitle:'Theme preview — synthetic content'}})],adapter:process.env.DEPLOY_TARGET==='cloudflare'?cloudflare({platformProxy:{enabled:false},imageService:'passthrough'}):node({mode:'standalone'}),image:{service:passthroughImageService()}});\n`);
   await writeFile(join(root,'src/pages/acms-theme-preview/setup.astro'),`---
-import {getRepo} from '@acms-subir/core/lib/repo/index';
+import {getRepo} from ${JSON.stringify(join(CORE,'src/lib/repo/index.ts'))};
 const repo=await getRepo(Astro.locals);
 let home=await repo.getPageBySlug('preview-home');
 if(!home){

package/deploy/Dockerfile

@@ -25,10 +25,14 @@ ENV NODE_ENV=production HOST=0.0.0.0 PORT=4321
 RUN npm install --no-save --no-audit --no-fund "@libsql/client@^0.15.0"
 COPY --from=build /app/dist ./dist
 COPY --from=build /app/node_modules/@acms-subir/core/email-runner.mjs ./email-runner.mjs
+# acms migrate: applies pending migrations under the database lock before
+# the server starts (the app's own first-request migration is the fallback)
+COPY --from=build /app/node_modules/@acms-subir/core/migrate.mjs ./acms/migrate.mjs
+COPY --from=build /app/node_modules/@acms-subir/core/cli/migrate.mjs /app/node_modules/@acms-subir/core/cli/migrations.generated.mjs ./acms/cli/
 # ./data holds the SQLite database and uploaded media — mount a volume here.
 # Only data/ needs to be writable (a chown -R of /app would copy-on-write
 # duplicate every node_modules file into a fresh layer)
 RUN mkdir -p data && chown node:node data
 USER node
 EXPOSE 4321
-CMD ["node", "./dist/server/entry.mjs"]
+CMD ["sh", "-c", "node ./acms/migrate.mjs && exec node ./dist/server/entry.mjs"]

package/deploy/compose.yml

@@ -14,8 +14,29 @@ services:
       - PORT=4321
       - ADMIN_PASSWORD=${ADMIN_PASSWORD:?set ADMIN_PASSWORD in .env}
       - SESSION_SECRET=${SESSION_SECRET:?set SESSION_SECRET in .env}
+      # Optional Clerk staff authentication (provider selected in astro.config).
+      - PUBLIC_CLERK_PUBLISHABLE_KEY=${PUBLIC_CLERK_PUBLISHABLE_KEY:-}
+      - CLERK_SECRET_KEY=${CLERK_SECRET_KEY:-}
+      - CLERK_AUTHORIZED_PARTIES=${CLERK_AUTHORIZED_PARTIES:-}
+      - CLERK_JWT_KEY=${CLERK_JWT_KEY:-}
+      - CLERK_OWNER_USER_ID=${CLERK_OWNER_USER_ID:-}
+      - CLERK_OWNER_LOCAL_USER_ID=${CLERK_OWNER_LOCAL_USER_ID:-}
       - EMAIL_RUNNER_SECRET=${EMAIL_RUNNER_SECRET:?set EMAIL_RUNNER_SECRET in .env}
       - EMAIL_ENCRYPTION_KEY=${EMAIL_ENCRYPTION_KEY:-}
+      # Optional: behind the Cloudflare proxy, clear its cache on every content
+      # change (token needs Zone → Cache Purge). See docs/caching.md.
+      - CLOUDFLARE_ZONE_ID=${CLOUDFLARE_ZONE_ID:-}
+      - CLOUDFLARE_API_TOKEN=${CLOUDFLARE_API_TOKEN:-}
+      # Optional scheduled off-site backups to S3-compatible storage (R2,
+      # Oracle Object Storage, AWS S3). See docs/production-deployment.md.
+      - BACKUP_S3_ENDPOINT=${BACKUP_S3_ENDPOINT:-}
+      - BACKUP_S3_BUCKET=${BACKUP_S3_BUCKET:-}
+      - BACKUP_S3_REGION=${BACKUP_S3_REGION:-}
+      - BACKUP_S3_ACCESS_KEY_ID=${BACKUP_S3_ACCESS_KEY_ID:-}
+      - BACKUP_S3_SECRET_ACCESS_KEY=${BACKUP_S3_SECRET_ACCESS_KEY:-}
+      - BACKUP_PREFIX=${BACKUP_PREFIX:-}
+      - BACKUP_KEEP=${BACKUP_KEEP:-}
+      - BACKUP_EVERY_HOURS=${BACKUP_EVERY_HOURS:-}
       - SQLITE_URL=file:./data/acms.db
     healthcheck:
       test: ["CMD", "node", "-e", "fetch('http://127.0.0.1:4321/api/v1/content?limit=1').then(r=>process.exit(r.ok?0:1),()=>process.exit(1))"]

package/docs/live-video.md

@@ -45,7 +45,7 @@ Rate-limit/quota errors back off. The UI reports estimated workload and provider
 - **Design → Pages:** add a **Live video** section; choose `card` or `player`, preview and publish using the existing design flow.
 - **Links:** add a **Live video** block and save. This is a compact card referencing the same site-wide status.
 - **Older widget pages:** add a **Live video** widget and choose its display mode. Rich-text-only/custom coded homepages must opt into a Design section or explicitly render the component.
-- **Custom themes:** import `LiveCard.astro` from `@acms-subir/core/components/LiveCard.astro`, or use the built-in `live` section. ACMS never injects a new placement automatically into a custom template. If a custom route renders the component, set `Astro.response.headers.set('Cache-Control', 'no-store')` in that route's frontmatter; the built-in page routes handle this for you.
+- **Custom themes:** import `LiveCard.astro` from `@acms-subir/core/theme/components/LiveCard.astro`, or use the built-in `live` section. ACMS never injects a new placement automatically into a custom template. If a custom route renders the component, set `Astro.response.headers.set('Cache-Control', 'no-store')` in that route's frontmatter; the built-in page routes handle this for you.
 
 ### How it looks
 

package/docs/theme-authoring.md

@@ -34,6 +34,31 @@ const { page, posts } = Astro.props;
 
 Public types: ChromeProps (site), HomeProps (settings, page, posts, tags), PageProps (settings, page, html), PostProps (settings, post, html, authors, related), EventProps (settings, event, occurrence, calendars, html, upcoming, origin, preview, rsvp), SectionProps (settings, page, variant, data). Public components: PostCard with card/row/feature variants, Pager with base/page/count, TagLabel with name/href/accent. Helpers include collectionUrl, postUrl, postsIndexUrl, tagUrl, formatDate, slugify, authorSlug, localeFromPath, localeHomeUrl and CONTENT. Use collectionUrl for non-default collections; postUrl is the built-in posts alias.
 
+### Upcoming events in coded templates
+
+Use the server-side calendar helpers from the public theme entry point. Replace imports from `@acms-subir/core/lib/repo/*` and `@acms-subir/core/lib/calendar/*`; internal folders are not package exports.
+
+```astro
+---
+import { upcomingEvents, calendarConfig, eventUrl } from '@acms-subir/core/theme';
+const calendar = calendarConfig();
+const upcoming = await upcomingEvents(Astro, { limit: 4, horizonDays: 90 });
+const date = new Intl.DateTimeFormat('en', { dateStyle: 'medium', timeZone: Astro.props.settings.timezone || 'UTC' });
+---
+{calendar.enabled && <section>
+  <a href={calendar.base}>Calendar</a>
+  {upcoming.map(({ event, start }) => (
+    <a href={eventUrl(event.slug)}>
+      {event.title} <time datetime={new Date(start).toISOString()}>{date.format(start)}</time>
+    </a>
+  ))}
+</section>}
+```
+
+`calendarConfig()` returns a fresh `{ enabled, base, eventsBase }` object; `eventUrl(slug)` uses the configured event base. `upcomingEvents(Astro, options?)` resolves storage through `Astro.locals` and loads the site's timezone settings. It returns the next or ongoing occurrence of each distinct published, publicly listed native event, soonest first, including recurring and all-day events. Private/unlisted calendars and external feed entries are excluded; cancelled public events remain visible so templates can label them. Disabled calendars and a zero limit return `[]` without accessing storage. Storage errors propagate to the template.
+
+Options default to `{ limit: 6, horizonDays: 400 }`. The limit must be a non-negative safe integer and the horizon a positive finite number. Each `UpcomingEvent` contains `{ event, start, end, allDay, days }`, with start/end in Unix milliseconds. Format occurrence timestamps using the site's timezone rather than the authored `event.start` when displaying recurring events. `UpcomingEvent`, `UpcomingEventsOptions`, and `ThemeCalendarConfig` are exported types.
+
 Template filenames: `home.astro`, `event.astro`, `header.astro`, `footer.astro`, `post-<name>.astro`, `page-<name>.astro`.
 
 `header.astro` and `footer.astro` replace the site header and footer on every public page. They receive `ChromeProps` — one `site` prop (`SiteChrome`) with everything already resolved for the request: `title`, `tagline`, `logo`, `logoDark`, `homeUrl`, `links` (header nav, each `{ label, url, current, external }`, already localized), `footerLinks`, `social` (with inline SVG `icon`), `readLinks`, `footerHtml`, `languages` (`{ code, label, url, current }`, where `label` is the language's own name, e.g. "Español"), `search` (`{ url, label }` or null), `schemeToggle`, `liveHeader`, `headerStyle`, `footerStyle`. Core behaviors attach through data hooks, so keep them on your own elements: `data-search-open` (opens search), `data-scheme-toggle` (light/dark), `data-menu-open` (phone menu sheet, built from `site.links`) and a hidden `data-live-header` link (shown during a live stream).
@@ -91,6 +116,12 @@ The theme API version covers documented template/section contracts and public co
 
 `theme diff` compares against the creation snapshot; `--baseline <folder>` selects another version. Runtime settings/navigation differences are available in `design pull`.
 
+## Moving a theme between sites or machines
+
+Design → **Export** downloads the design as the Design screen shows it (draft over live) as one `<slug>-<date>.acms-theme.zip`: `manifest.json` (format `acms-theme` v1, theme slug/name/version, core version), `design.json` (token overrides, logo/dark logo/favicon/cover, section layouts keyed by page slug, link targets by URL, and navigation only when ticked) and `media/<key>` with `media.json` for the images it uses. It never contains posts, page text, keys or other settings. Design → **Import** previews the file against the receiving site, uploads its images (kept by id, so `/media/` URLs stay valid), and stages everything as a draft; publish it from Review as usual. Layouts land on the page with the same slug (the exported home page falls back to this site's home); pages with no match are reported and skipped. Section links follow the item at the same URL, otherwise keep their typed address. Owners only; editors cannot export or import.
+
+Theme **code** is not in the file: it is compiled into the build. When the file names a theme this site lacks, the import keeps the current theme and says so. Move `src/themes/<slug>/` with git, or `acms theme pack` / `acms theme install`, then rebuild. The same endpoints are scriptable with a scoped key: `GET /api/design/export` (`design:read`, plus `media:read` unless `?media=0`; `?nav=1` adds menus) and `POST /api/design/import` with `{ revision, design, nav?, dryRun? }` (`design:write-draft`).
+
 ## Sharing, versions and rollback
 
 `theme pack` produces a deterministic theme-only tgz. `theme install` validates the archive before writing, rejects traversal/links/unexpected files/incompatible core versions, and never runs install scripts. Use `--force` for intentional replacement: the previous directory is retained in `.acms/theme-backups/`. `.acms/themes.lock.json` records the pinned version, digest and backup path. Copy a retained backup to a new theme identity or re-pack/install it to roll code back; rebuild and redeploy. No automatic download of theme dependencies occurs.

package/integration.mjs

@@ -88,6 +88,8 @@ const ROUTES = [
   ['/api/design/keys', 'api/design/keys.ts'],
   ['/api/design/capabilities', 'api/design/capabilities.ts'],
   ['/api/design/media', 'api/design/media.ts'],
+  ['/api/design/export', 'api/design/export.ts'],
+  ['/api/design/import', 'api/design/import.ts'],
   ['/api/design/ai', 'api/design/ai.ts'],
   ['/api/design/translate', 'api/design/translate.ts'],
   ['/api/agent', 'api/agent/index.ts'],
@@ -235,6 +237,28 @@ function resolveI18n(i18n, contentBases) {
 // Defaults + validation for acms({ search }). Search ships on; disabling it
 // removes the /search page(s), /api/search and /api/v1/search from the route table, and the
 // layout skips the header trigger + modal (lib/search-config.ts).
+// acms({ cache }): CDN caching of public pages and the public app API.
+// `false` turns it off (every response is private, no-store); `memory` is the
+// Node-only in-process cache of public API data, keyed by content version.
+function resolveCache(cache) {
+  const defaults = { enabled: true, maxAge: 60, staleWhileRevalidate: 86400, memory: true };
+  if (cache === undefined || cache === true) return defaults;
+  if (cache === false) return { ...defaults, enabled: false, memory: false };
+  if (!cache || typeof cache !== 'object' || Array.isArray(cache)) throw new Error('acms: cache must be false or { maxAge?, staleWhileRevalidate?, memory? }');
+  const unknown = Object.keys(cache).filter((k) => !['maxAge', 'staleWhileRevalidate', 'memory'].includes(k));
+  if (unknown.length > 0) {
+    throw new Error(`acms: unknown cache key${unknown.length > 1 ? 's' : ''} ${unknown.map((k) => `"${k}"`).join(', ')} — valid keys are maxAge, staleWhileRevalidate and memory`);
+  }
+  const out = { ...defaults, ...cache };
+  for (const k of ['maxAge', 'staleWhileRevalidate']) {
+    if (!Number.isInteger(out[k]) || out[k] < 0 || out[k] > 31_536_000) throw new Error(`acms: cache.${k} must be a whole number of seconds (0–31536000)`);
+  }
+  if (typeof out.memory !== 'boolean') throw new Error('acms: cache.memory must be true or false');
+  // maxAge 0 means "don't let the CDN store anything" — same as cache: false
+  if (out.maxAge === 0) return { ...out, enabled: false };
+  return out;
+}
+
 function resolveSearch(search) {
   if (search === undefined) return { enabled: true };
   const unknown = Object.keys(search).filter((k) => k !== 'enabled');
@@ -493,6 +517,15 @@ function acmsVitePlugin(userConfig) {
  *   pasted map links still work.
  * @param {false | {enabled?: boolean, operatorName?: string, contactEmail?: string, updatedAt?: string}} [options.legal]
  *   Default privacy/terms routes and footer links; published CMS pages at those slugs override the text.
+ * @param {{provider?: 'builtin' | 'clerk'}} [options.auth] Staff authentication provider. Defaults to builtin.
+ * @param {false | {maxAge?: number, staleWhileRevalidate?: number, memory?: boolean}} [options.cache]
+ *   Shared caching of public pages and the public app API (`/api/v1/*`):
+ *   `Cache-Control: public, s-maxage=<maxAge>, stale-while-revalidate=<staleWhileRevalidate>`
+ *   (defaults 60 and 86400). Admin, previews, signed-in visitors, bookings,
+ *   forms and every non-GET request stay `private, no-store`. Every content
+ *   change clears the cache (Workers Cache, or the Cloudflare zone when
+ *   CLOUDFLARE_ZONE_ID + CLOUDFLARE_API_TOKEN are set). `memory: false` turns
+ *   off the Node in-process API cache. `cache: false` turns all of it off.
  * @returns {import('astro').AstroIntegration}
  */
 export default function acms(options = {}) {
@@ -503,6 +536,7 @@ export default function acms(options = {}) {
   ]);
   const i18n = resolveI18n(options.i18n, contentBases);
   const search = resolveSearch(options.search);
+  const cache = resolveCache(options.cache);
   const mobile = resolveMobile(options.mobile);
   const calendar = resolveCalendar(options.calendar, contentBases, i18n.locales);
   const maps = resolveMaps(options.maps);
@@ -510,13 +544,18 @@ export default function acms(options = {}) {
   if (typeof legal.enabled !== 'boolean' || ['operatorName','contactEmail','updatedAt'].some(k => typeof legal[k] !== 'string')) throw new Error('acms: invalid legal configuration');
   if (legal.contactEmail && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(legal.contactEmail)) throw new Error('acms: legal.contactEmail must be an email address');
   if (legal.updatedAt && (!/^\d{4}-\d{2}-\d{2}$/.test(legal.updatedAt) || !Number.isFinite(Date.parse(legal.updatedAt)) || new Date(legal.updatedAt).toISOString().slice(0,10) !== legal.updatedAt)) throw new Error('acms: legal.updatedAt must be a valid YYYY-MM-DD date');
+  const auth = { provider: options.auth?.provider === undefined ? 'builtin' : options.auth.provider };
+  if (options.auth !== undefined && (!options.auth || typeof options.auth !== 'object' || Array.isArray(options.auth) || Object.keys(options.auth).some(k => k !== 'provider'))) throw new Error('acms: auth accepts only provider');
+  if (!['builtin', 'clerk'].includes(auth.provider)) throw new Error('acms: auth.provider must be builtin or clerk');
   const userConfig = {
+    auth,
     coreVersion: CORE_VERSION,
     brand: options.brand ?? {},
     seed: options.seed ?? {},
     content,
     i18n,
     search,
+    cache,
     mobile,
     calendar,
     maps,

package/migrate.mjs

@@ -0,0 +1,5 @@
+#!/usr/bin/env node
+// acms-migrate: apply pending schema migrations under the database lock.
+// The Docker image runs this before the server; see cli/migrate.mjs.
+import { main } from './cli/migrate.mjs';
+await main();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@acms-subir/core",
-  "version": "0.3.10",
+  "version": "0.3.12",
   "publishConfig": {
     "access": "public"
   },
@@ -24,22 +24,16 @@
   "bin": {
     "acms": "cli.mjs",
     "acms-email-runner": "email-runner.mjs",
-    "acms-check-deployment": "ops-check.mjs"
+    "acms-check-deployment": "ops-check.mjs",
+    "acms-migrate": "migrate.mjs"
   },
   "exports": {
     ".": "./integration.mjs",
     "./package.json": "./package.json",
     "./actions": "./src/actions/index.ts",
-    "./middleware": "./src/middleware.ts",
-    "./worker": "./src/worker.ts",
-    "./lib/*": "./src/lib/*",
-    "./pages/*": "./src/pages/*",
-    "./components/*": "./src/components/*",
-    "./layouts/*": "./src/layouts/*",
-    "./styles/*": "./src/styles/*",
-    "./themes/*": "./src/themes/*",
     "./theme": "./src/theme-sdk/index.ts",
     "./theme/schema": "./src/theme-sdk/contract.mjs",
+    "./theme/components/LiveCard.astro": "./src/components/LiveCard.astro",
     "./theme/components/*": "./src/components/site/*"
   },
   "files": [
@@ -50,12 +44,14 @@
     "email-runner.mjs",
     "deploy",
     "ops-check.mjs",
+    "migrate.mjs",
     "cli",
     "docs",
     "section-library",
     "mobile-template"
   ],
   "dependencies": {
+    "@clerk/backend": "^3.22.0",
     "@cloudflare/workers-types": "^5.20260927.1",
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/sortable": "^10.0.0",
@@ -109,10 +105,12 @@
     "@types/react-dom": "^19.2.4",
     "@types/sanitize-html": "^2.16.1",
     "@types/turndown": "^5.0.6",
+    "esbuild": "^0.28.1",
     "miniflare": "^5.20260801.0-alpha",
     "vitest": "^3.2.0"
   },
   "scripts": {
-    "test": "vitest run"
+    "test": "vitest run",
+    "gen:migrations": "node scripts/gen-migrations.mjs"
   }
 }

package/src/actions/index.ts

@@ -7,12 +7,12 @@ import { z } from 'astro:schema';
 import type { ActionAPIContext } from 'astro:actions';
 import { getRepo } from '../lib/repo';
 import { getMediaStore } from '../lib/media/store';
-import { validateSession, SESSION_COOKIE } from '../lib/auth';
+import { validateRequestSession } from '../lib/auth/request';
 import { DocTranslations, LinkKind, parseConfig, slugify, widgetTypes, type WidgetType } from '../lib/schema';
 import { env } from '../lib/env';
 import { CONTENT, collectionUrl } from '../lib/content';
 import { invalidateRedirectCache } from '../middleware';
-import { isPrivateHost } from '../lib/net';
+import { resolvesToPrivate } from '../lib/net';
 import { normalizeCalendarSrc } from '../lib/calendar/src';
 import { saveCalendar } from '../lib/calendar/admin';
 import { getCalendarEvents } from '../lib/calendar/ics';
@@ -50,7 +50,7 @@ async function designChanges(repo: Awaited<ReturnType<typeof getRepo>>) {
 // All admin mutations live here. The middleware only guards /admin pages,
 // so every action re-checks the session itself.
 async function requireAdmin(ctx: ActionAPIContext) {
-  if (!(await validateSession(ctx.cookies.get(SESSION_COOKIE)?.value, ctx.locals))) {
+  if (!(await validateRequestSession(ctx.request, ctx.cookies, ctx.locals))) {
     throw new ActionError({ code: 'UNAUTHORIZED', message: 'Not signed in.' });
   }
 }
@@ -537,7 +537,7 @@ export const server = {
     applyDesign: defineAction({
       input: z.object({}),
       handler: async (_input, ctx) => {
-        const userId = await validateSession(ctx.cookies.get(SESSION_COOKIE)?.value, ctx.locals);
+        const userId = await validateRequestSession(ctx.request, ctx.cookies, ctx.locals);
         if (!userId) throw new ActionError({ code: 'UNAUTHORIZED', message: 'Not signed in.' });
         const repo = await getRepo(ctx.locals);
         const changes = await designChanges(repo);
@@ -776,7 +776,7 @@ export const server = {
         let res: Response | null = null;
         for (let hop = 0; hop < 5; hop++) {
           const u = new URL(current);
-          if (!/^https?:$/.test(u.protocol) || isPrivateHost(u.hostname)) {
+          if (!/^https?:$/.test(u.protocol) || await resolvesToPrivate(u.hostname)) {
             throw new ActionError({ code: 'BAD_REQUEST', message: 'That URL can’t be bookmarked.' });
           }
           res = await fetch(u.href, {

package/src/components/DesignManager.tsx

@@ -7,12 +7,13 @@ import ThemeSectionsEditor, { SectionsReview, useDesignApi, type SectionFocus }
 import { checkLayouts, type Check } from './sections/checks';
 import { EMPTY_TARGETS } from './sections/SectionFields';
 import DesignAccess from './DesignAccess';
+import ThemeTransfer, { type ThemeTransferHandle } from './ThemeTransfer';
 import '../styles/theme-editor.css';
 
 // Design screen: pick a code-first theme (src/themes/<slug>/), layer sparse
 // token overrides on top (saved to settings.designOverrides — the theme files
-// are never written to), set the site logo, and export the effective design
-// as a committable theme.json.
+// are never written to), set the site logo, and export/import the design as
+// an .acms-theme.zip (ThemeTransfer) or the effective tokens as theme.json.
 //
 // Every change stages into settings.draftDesign — the preview iframe renders
 // the staged design (?designPreview=1, admin-only) while visitors keep the
@@ -30,6 +31,8 @@ interface ThemeInfo {
   version: string;
   templateCount: number;
   sectionCount: number;
+  /** from the project's src/themes/ (its code lives in the site repo) */
+  project: boolean;
 }
 
 // post-page toggles: designOverrides key + which theme default backs it
@@ -147,6 +150,8 @@ export default function DesignManager({ settings, pendingDesign, themes, pairing
   const [faviconPickerOpen, setFaviconPickerOpen] = useState(false);
   const [coverPickerOpen, setCoverPickerOpen] = useState(false);
   const [copied, setCopied] = useState(false);
+  const transferRef = useRef<ThemeTransferHandle>(null);
+  const [justPublished, setJustPublished] = useState(false);
   const [tick, setTick] = useState(0);
   const [previewPage, setPreviewPage] = useState<'home' | 'post'>('home');
   // open on the device you're most likely designing for: desktop on a wide
@@ -301,6 +306,7 @@ export default function DesignManager({ settings, pendingDesign, themes, pairing
     setPending(false);
     setChanges([]);
     setVersions(null);
+    setJustPublished(true);
     setTick((t) => t + 1);
     void designApi.reload();
   };
@@ -348,6 +354,12 @@ export default function DesignManager({ settings, pendingDesign, themes, pairing
     location.reload();
   };
 
+  // export/import read the stored draft: land queued edits first
+  const flushAll = async () => {
+    if (timer.current) { clearTimeout(timer.current); timer.current = null; if (!(await doSave())) return false; }
+    return flushSections.current();
+  };
+
   const discardDesign = async () => {
     if (!window.confirm('Discard the staged design changes and go back to the live design? This cannot be undone.')) return;
     if (timer.current) { clearTimeout(timer.current); timer.current = null; }
@@ -433,7 +445,11 @@ export default function DesignManager({ settings, pendingDesign, themes, pairing
               <span className={`lm-savestate ${saveState}`}>
                 {saveState === 'saving' ? 'Saving…' : saveState === 'error' ? (saveMessage || 'Save failed') : null}
               </span>
-              {!editorOnly && <button className="btn sm ghost" type="button" onClick={() => void openHistory()}>History</button>}
+              {!editorOnly && <>
+                <button className="btn sm ghost" type="button" onClick={() => transferRef.current?.openImport()} title="Bring in a theme exported from another site or machine">Import</button>
+                <button className="btn sm ghost" type="button" onClick={() => transferRef.current?.openExport()} title="Download this design as a theme file">Export</button>
+                <button className="btn sm ghost" type="button" onClick={() => void openHistory()}>History</button>
+              </>}
             </div>
           </div>
 
@@ -442,7 +458,9 @@ export default function DesignManager({ settings, pendingDesign, themes, pairing
               {hasDraft ? (
                 <><span className="dm-st is-draft">Draft</span><span className="dm-st-sub">· {changes.length > 0 ? `${changes.length} ${changes.length === 1 ? 'change' : 'changes'}` : 'page layouts'}, not live</span></>
               ) : (
-                <><span className="dm-st is-live">Live</span><span className="dm-st-sub">· no unpublished changes</span></>
+                <><span className="dm-st is-live">Live</span><span className="dm-st-sub">· {justPublished && !editorOnly
+                  ? <>published. Working on another machine? <button className="dm-resetlink" type="button" onClick={() => transferRef.current?.openExport()}>Export this theme</button></>
+                  : 'no unpublished changes'}</span></>
               )}
               <span className="dm-status-actions">
                 {overrideCount > 0 && !editorOnly && (
@@ -633,7 +651,7 @@ export default function DesignManager({ settings, pendingDesign, themes, pairing
                 <span className="dm-theme-name">{t.name}</span>
                 <span className="dm-theme-desc">{t.description.split(' — ')[0]}</span>
                 <span className="dm-chip">v{t.version} · {t.sectionCount} sections</span>
-                <span className="dm-theme-desc">{t.templateCount} custom templates · installed</span>
+                <span className="dm-theme-desc">{t.templateCount} custom templates · {t.project ? 'project theme' : 'built-in'}</span>
               </button>
             ))}
           </div>
@@ -789,13 +807,12 @@ export default function DesignManager({ settings, pendingDesign, themes, pairing
 
           <div className="dm-row">
             <div className="dm-lab">
-              <span>Export</span>
-              <small>Effective design (theme + your overrides) as a committable <code>theme.json</code></small>
+              <span>Move this theme</span>
+              <small>Export your design as one file and import it on another site or machine</small>
             </div>
             <div className="dm-ctl">
-              <button className="btn sm" type="button" onClick={copyThemeJson}>
-                {copied ? 'Copied ✓' : 'Copy as theme.json'}
-              </button>
+              <button className="btn sm" type="button" onClick={() => transferRef.current?.openExport()}>Export…</button>
+              <button className="btn sm" type="button" onClick={() => transferRef.current?.openImport()}>Import…</button>
             </div>
           </div>
           </div>
@@ -1032,6 +1049,8 @@ export default function DesignManager({ settings, pendingDesign, themes, pairing
         </div>
       </dialog>
 
+      <ThemeTransfer ref={transferRef} theme={theme} flush={flushAll} onCopyThemeJson={copyThemeJson} copied={copied} />
+
       <ImagePicker
         open={logoPickerOpen}
         unsplashEnabled={unsplashEnabled}

package/src/components/EmailSettings.tsx

@@ -1,11 +1,14 @@
 import { useEffect, useId, useRef, useState, type KeyboardEvent } from 'react';
 import type { Credentials, EmailConfig, PublicEmailSettings } from '../lib/email/types';
+import { checkReverified, signInAgain } from './auth/clerk';
 import '../styles/email-settings.css';
 
 // Settings → Email: Setup, Notifications, Templates, Activity over /api/email/settings.
 // Secrets are write-only: inputs start empty, blank keeps the saved value, and a
 // successful save wipes password and secret fields. Nothing goes to browser
 // storage, nothing polls, and no email is sent unless the owner types an address.
+// Saves are confirmed with the current password, or, when the site signs in
+// with Clerk, by a sign-in from the last ten minutes.
 
 type Choice = EmailConfig['provider'];
 type Job = PublicEmailSettings['activity'][number];
@@ -72,11 +75,12 @@ async function api<T>(body?: unknown, signal?: AbortSignal): Promise<T> {
     body: body === undefined ? undefined : JSON.stringify(body),
   });
   const data = await res.json().catch(() => null);
-  if (!res.ok) throw new Error(data?.error || `${res.status} ${res.statusText || 'Request failed'}`);
+  if (!res.ok) throw Object.assign(new Error(data?.error || `${res.status} ${res.statusText || 'Request failed'}`), { status: res.status });
   if (!data) throw new Error('The server sent an empty response.');
   return data as T;
 }
 const errText = (e: unknown) => (e instanceof Error ? e.message : String(e));
+const refused = (e: unknown) => (e as { status?: number } | null)?.status === 403;
 const validAddress = (s: string) => s.length <= 254 && /^[^\s<>@,;]+@[^\s<>@,;]+\.[^\s<>@,;]+$/.test(s);
 // mirrors the server's parseFrom: `address` or `Name <address>`
 function validSender(raw: string) {
@@ -115,6 +119,8 @@ export default function EmailSettings() {
   const [notifyMsg, setNotifyMsg] = useState(NO_MSG);
   const [testMsg, setTestMsg] = useState(NO_MSG);
   const [actMsg, setActMsg] = useState(NO_MSG);
+  // Clerk: the sign-in is too old for a save; offer to sign in again
+  const [stale, setStale] = useState(false);
 
   const live = (c = ctl.current) => !!c && !c.signal.aborted;
 
@@ -175,6 +181,22 @@ export default function EmailSettings() {
   const hbStale = !data.heartbeat || Date.now() - data.heartbeat > 15 * 60000;
   const set = <K extends keyof EmailConfig>(k: K, v: EmailConfig[K]) => setForm((f) => f && { ...f, [k]: v });
   const savedOff = data.config.provider === 'none' || !data.config.enabled;
+  const clerk = data.authProvider === 'clerk';
+
+  // Clerk: check for a recent sign-in before saving, keeping the edits on the
+  // page when it's too old. If Clerk can't be reached the save still goes
+  // through and the server decides.
+  async function confirmIdentity(fail: (err: string) => void) {
+    if (!clerk) return true;
+    const r = await checkReverified();
+    if (!live()) return false;
+    if (r === 'needed') { setStale(true); fail('Saving needs a sign-in from the last ten minutes. Nothing was saved; your edits are still here.'); return false; }
+    setStale(false);
+    return true;
+  }
+  function reSignIn() {
+    if (confirm('Sign in again? You’ll come back to this page, but unsaved edits here are cleared.')) void signInAgain();
+  }
 
   function pickProvider(next: Choice) {
     setCreds({});
@@ -194,31 +216,33 @@ export default function EmailSettings() {
     if (f.from && !validSender(f.from)) return fail('Sender must be an address or Name <address>.');
     if (f.replyTo && !validSender(f.replyTo)) return fail('Reply-to must be an address or Name <address>.');
     if (f.provider === 'mailgun' && !usesEnv && !/^[a-z0-9.-]+$/i.test(f.domain)) return fail('Enter the Mailgun sending domain, like mg.example.com.');
-    if (!setupPw) return fail('Enter your current password to save.');
+    if (!clerk && !setupPw) return fail('Enter your current password to save.');
     const credentials: Credentials = {};
     if (!usesEnv) for (const c of CREDS[f.provider]) { const v = creds[c.key]?.trim(); if (v) credentials[c.key] = v; }
     await run('save', async () => {
       try {
-        const next = await api<PublicEmailSettings>({ action: 'save', config: f, credentials, reauthPassword: setupPw });
+        if (!await confirmIdentity(fail)) return;
+        const next = await api<PublicEmailSettings>({ action: 'save', config: f, credentials, reauthPassword: clerk ? '' : setupPw });
         if (!live()) return;
         adopt(next); setTested(false);
         setSetupMsg({
           ok: next.configured ? 'Saved. The configuration is valid; send a test to check the connection.' : `Saved, but email isn’t ready yet: ${next.error || 'no provider is configured.'}`,
           err: '',
         });
-      } catch (e) { if (live()) { setSetupPw(''); fail(errText(e)); } }
+      } catch (e) { if (live()) { setSetupPw(''); fail(errText(e)); setStale(clerk && refused(e)); } }
     });
   }
 
   async function saveNotify() {
     setNotifyMsg(NO_MSG);
-    if (!notify.pw) return setNotifyMsg({ ok: '', err: 'Enter your current password to save.' });
+    if (!clerk && !notify.pw) return setNotifyMsg({ ok: '', err: 'Enter your current password to save.' });
     const config = { ...data!.config, reminders: notify.reminders, staffNotifications: notify.staff };
     await run('notify', async () => {
       try {
-        const next = await api<PublicEmailSettings>({ action: 'save', config, credentials: {}, reauthPassword: notify.pw });
+        if (!await confirmIdentity((err) => setNotifyMsg({ ok: '', err }))) return;
+        const next = await api<PublicEmailSettings>({ action: 'save', config, credentials: {}, reauthPassword: clerk ? '' : notify.pw });
         if (live()) { adopt(next, 'notify'); setNotifyMsg({ ok: 'Notification settings saved.', err: '' }); }
-      } catch (e) { if (live()) { setNotify((n) => ({ ...n, pw: '' })); setNotifyMsg({ ok: '', err: errText(e) }); } }
+      } catch (e) { if (live()) { setNotify((n) => ({ ...n, pw: '' })); setNotifyMsg({ ok: '', err: errText(e) }); setStale(clerk && refused(e)); } }
     });
   }
 
@@ -262,7 +286,22 @@ export default function EmailSettings() {
       <div className="ems-status" role="alert">{m.err && <p className="flash error">{m.err}</p>}</div>
     </>
   );
-  const pwField = (value: string, onChange: (v: string) => void, key: string) => (
+  const pwField = (value: string, onChange: (v: string) => void, key: string) => clerk ? (
+    <div className="ems-verify" id={id(key)}>
+      <span className="ems-verify-mark" aria-hidden="true">
+        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"><path d="M12 3l7 3v5c0 4.5-3 8.3-7 10-4-1.7-7-5.5-7-10V6zM9 12l2 2 4-4" /></svg>
+      </span>
+      <p>
+        <b>Confirmed with your sign-in.</b>{' '}
+        {stale ? 'Your sign-in is more than ten minutes old. Sign in again, then save; your edits stay here until you do.' : 'Saving needs a sign-in from the last ten minutes. If yours is older, you’ll be asked to sign in again.'}
+      </p>
+      {stale && (
+        <span className="ems-verify-actions">
+          <button type="button" className="btn sm" onClick={reSignIn} disabled={!!busy}>Sign in again</button>
+        </span>
+      )}
+    </div>
+  ) : (
     <label className="field ems-pw">
       <span>Your current password</span>
       <input type="password" autoComplete="current-password" value={value} onChange={(e) => onChange(e.target.value)} aria-describedby={id(key)} />
@@ -427,9 +466,10 @@ export default function EmailSettings() {
         <form className="ems-card" onSubmit={(e) => { e.preventDefault(); void saveNotify(); }} noValidate>
           <header className="ems-head"><div><h2>Always sent</h2><p>Essential messages go out whenever email is on and a provider is configured, unless the address is suppressed after a bounce or complaint.</p></div></header>
           <ul className="ems-list">
-            <li>Account invitations, password resets and password-changed notices</li>
+            {!clerk && <li>Account invitations, password resets and password-changed notices</li>}
             <li>Booking received, confirmed, declined, cancelled and rescheduled</li>
           </ul>
+          {clerk && <p className="hint">Sign-in email (invitations, verification codes and password recovery) comes from Clerk, not from this connection.</p>}
           <h3 className="ems-sub">Optional</h3>
           <label className="ems-toggle">
             <input type="checkbox" checked={notify.reminders} onChange={(e) => setNotify((n) => ({ ...n, reminders: e.target.checked }))} />
@@ -452,7 +492,7 @@ export default function EmailSettings() {
           <header className="ems-head"><div><h2>Built-in templates</h2><p>Every message has HTML and plain-text versions. The logo, name and colors come from your site settings. This sample uses made-up example.com data; real account links are never previewed.</p></div></header>
           <div className="ems-row">
             <div className="seg" role="group" aria-label="Sample message">
-              {(Object.keys(SAMPLES) as (keyof typeof SAMPLES)[]).map((k) => (
+              {(Object.keys(SAMPLES) as (keyof typeof SAMPLES)[]).filter((k) => !clerk || !ACCOUNT_SAMPLES.has(k)).map((k) => (
                 <button key={k} type="button" aria-pressed={tpl === k} onClick={() => setTpl(k)}>{SAMPLES[k].label}</button>
               ))}
             </div>
@@ -461,7 +501,7 @@ export default function EmailSettings() {
               <button type="button" aria-pressed={plain} onClick={() => setPlain(true)}>Plain text</button>
             </div>
           </div>
-          <Preview s={SAMPLES[tpl]} plain={plain} />
+          <Preview s={SAMPLES[clerk && ACCOUNT_SAMPLES.has(tpl) ? 'booking' : tpl]} plain={plain} />
         </div>
       </section>
 
@@ -506,6 +546,8 @@ const SAMPLES = {
   reset: { label: 'Password reset', subject: 'Reset your Example Studio password', heading: 'Reset your password', body: ['Someone asked to reset the password for sam@example.com.', 'The link works once and expires in 30 minutes.'], action: 'Choose a new password', foot: 'If this wasn’t you, ignore this email; your password stays the same.' },
   booking: { label: 'Booking confirmed', subject: 'Confirmed: Studio tour, Tue 14 Oct', heading: 'Your booking is confirmed', body: ['Studio tour with Example Studio', 'Tuesday 14 October 2026, 10:00–10:45 (America/New_York)', '123 Example Street, Springfield'], action: 'Manage booking', ics: true, foot: 'Need to change it? Use the link above or reply to this email.' },
 } satisfies Record<string, Sample>;
+// sign-in email that Clerk sends instead when the site uses Clerk
+const ACCOUNT_SAMPLES = new Set<keyof typeof SAMPLES>(['invite', 'reset']);
 
 function Preview({ s, plain }: { s: Sample; plain: boolean }) {
   const text = [s.heading, '', ...s.body, '', `${s.action}: [link omitted in preview]`, '', s.foot, '', '— Example Studio'].join('\n');