@ampless/admin 0.2.0-alpha.8 → 1.0.0-alpha.27

package/dist/chunk-YFWHKIVH.js

@@ -0,0 +1,1187 @@
+'use client';
+import {
+  invalidateSiteSettingsCache
+} from "./chunk-6LQGVDCW.js";
+import {
+  setAdminCmsConfigClient
+} from "./chunk-CTGFMK2J.js";
+import {
+  setAdminMediaContext
+} from "./chunk-2ITWLRYF.js";
+import {
+  useLocale,
+  useT
+} from "./chunk-Q66BLMNJ.js";
+
+// src/lib/amplify-client.ts
+import { Amplify } from "aws-amplify";
+var configured = false;
+function configureAmplify(outputs) {
+  if (configured) return;
+  Amplify.configure(outputs, { ssr: true });
+  configured = true;
+}
+
+// src/lib/posts-provider.ts
+import { generateClient } from "aws-amplify/api";
+import {
+  setPostsProvider,
+  decodeAwsJson,
+  encodeAwsJson
+} from "ampless";
+function decodeMetadata(value) {
+  if (value === null || value === void 0) return void 0;
+  const parsed = decodeAwsJson(value);
+  return parsed && typeof parsed === "object" && !Array.isArray(parsed) ? parsed : void 0;
+}
+function toCorePost(p) {
+  return {
+    postId: p.postId,
+    slug: p.slug,
+    title: p.title,
+    excerpt: p.excerpt ?? void 0,
+    format: p.format ?? "markdown",
+    body: decodeAwsJson(p.body),
+    status: p.status ?? "draft",
+    publishedAt: p.publishedAt ?? void 0,
+    tags: (p.tags ?? []).filter((t) => typeof t === "string"),
+    metadata: decodeMetadata(p.metadata)
+  };
+}
+function postTagEntries(post) {
+  if (post.status !== "published" || !post.publishedAt || !post.tags?.length) return [];
+  return post.tags.map((tag) => ({
+    tag,
+    publishedAtPostId: `${post.publishedAt}#${post.postId}`
+  }));
+}
+function entryKey(e) {
+  return `${e.tag}|${e.publishedAtPostId}`;
+}
+var installed = false;
+function installAdminPostsProvider() {
+  if (installed) return;
+  installed = true;
+  const client = generateClient();
+  async function syncPostTags(post, oldPost) {
+    const oldEntries = oldPost ? postTagEntries(oldPost) : [];
+    const newEntries = postTagEntries(post);
+    const oldKeys = new Set(oldEntries.map(entryKey));
+    const newKeys = new Set(newEntries.map(entryKey));
+    function fullRow(e) {
+      return {
+        tag: e.tag,
+        publishedAtPostId: e.publishedAtPostId,
+        postId: post.postId,
+        publishedAt: post.publishedAt,
+        slug: post.slug,
+        title: post.title,
+        excerpt: post.excerpt,
+        tags: post.tags ?? []
+      };
+    }
+    async function upsertPostTag(e) {
+      const row = fullRow(e);
+      const upd = await client.models.PostTag.update(row);
+      if (!upd.errors) return;
+      const cre = await client.models.PostTag.create(row);
+      if (cre.errors) {
+        throw new Error(upd.errors[0]?.message ?? "PostTag.update failed");
+      }
+    }
+    await Promise.all(
+      oldEntries.filter((e) => !newKeys.has(entryKey(e))).map((e) => client.models.PostTag.delete(e))
+    );
+    await Promise.all(
+      newEntries.filter((e) => !oldKeys.has(entryKey(e))).map(async (e) => {
+        const cre = await client.models.PostTag.create(fullRow(e));
+        if (!cre.errors) return;
+        const upd = await client.models.PostTag.update(fullRow(e));
+        if (upd.errors)
+          throw new Error(cre.errors[0]?.message ?? "PostTag.create failed");
+      })
+    );
+    await Promise.all(
+      newEntries.filter((e) => oldKeys.has(entryKey(e))).map(upsertPostTag)
+    );
+  }
+  const provider = {
+    async list(opts = {}) {
+      const status = opts.status ?? "published";
+      const filter = {};
+      if (status !== "all") filter.status = { eq: status };
+      const hasFilter = Object.keys(filter).length > 0;
+      const { data } = await client.models.Post.list({
+        filter: hasFilter ? filter : void 0,
+        limit: opts.limit ?? 100
+      });
+      return data.map(toCorePost);
+    },
+    async get(slug) {
+      const { data } = await client.models.Post.list({
+        filter: { slug: { eq: slug } },
+        limit: 1
+      });
+      return data[0] ? toCorePost(data[0]) : null;
+    },
+    async getById(postId) {
+      const { data } = await client.models.Post.get({ postId });
+      return data ? toCorePost(data) : null;
+    },
+    async create(input) {
+      const postId = input.postId ?? `post-${Date.now()}-${Math.random().toString(36).slice(2, 8)}`;
+      const { data, errors } = await client.models.Post.create({
+        postId,
+        slug: input.slug,
+        title: input.title,
+        excerpt: input.excerpt,
+        format: input.format,
+        body: encodeAwsJson(input.body),
+        status: input.status,
+        publishedAt: input.publishedAt,
+        tags: input.tags,
+        ...input.metadata !== void 0 && { metadata: encodeAwsJson(input.metadata) }
+      });
+      if (errors || !data) throw new Error(errors?.[0]?.message ?? "Failed to create post");
+      const created = toCorePost(data);
+      await syncPostTags(created, null);
+      return created;
+    },
+    async update(postId, patch) {
+      const oldPost = await this.getById(postId);
+      const { data, errors } = await client.models.Post.update({
+        postId,
+        ...patch.slug !== void 0 && { slug: patch.slug },
+        ...patch.title !== void 0 && { title: patch.title },
+        ...patch.excerpt !== void 0 && { excerpt: patch.excerpt },
+        ...patch.format !== void 0 && { format: patch.format },
+        ...patch.body !== void 0 && { body: encodeAwsJson(patch.body) },
+        ...patch.status !== void 0 && { status: patch.status },
+        ...patch.publishedAt !== void 0 && { publishedAt: patch.publishedAt },
+        ...patch.tags !== void 0 && { tags: patch.tags },
+        ...patch.metadata !== void 0 && { metadata: encodeAwsJson(patch.metadata) }
+      });
+      if (errors || !data) throw new Error(errors?.[0]?.message ?? "Failed to update post");
+      const updated = toCorePost(data);
+      await syncPostTags(updated, oldPost);
+      return updated;
+    },
+    async remove(postId) {
+      const oldPost = await this.getById(postId);
+      if (oldPost) {
+        await syncPostTags({ ...oldPost, status: "draft" }, oldPost);
+      }
+      const { errors } = await client.models.Post.delete({ postId });
+      if (errors) throw new Error(errors[0]?.message ?? "Failed to delete post");
+    }
+  };
+  setPostsProvider(provider);
+}
+
+// src/lib/kv-provider.ts
+import { generateClient as generateClient2 } from "aws-amplify/api";
+import { decodeAwsJson as decodeAwsJson2, encodeAwsJson as encodeAwsJson2, setKvStore } from "ampless";
+var installed2 = false;
+function installAdminKvProvider() {
+  if (installed2) return;
+  installed2 = true;
+  const client = generateClient2();
+  function requireModel() {
+    const m = client.models.KvStore;
+    if (!m) {
+      throw new Error(
+        "KvStore model is not available on the AppSync client. Did you redeploy the sandbox? Run `npx ampx sandbox` and wait for it to finish, then reload this page."
+      );
+    }
+    return m;
+  }
+  const store = {
+    async get(pk, sk) {
+      const model = requireModel();
+      const { data } = await model.get({ pk, sk });
+      return data ? decodeAwsJson2(data.value) : null;
+    },
+    async query(pk) {
+      const model = requireModel();
+      const { data } = await model.list({
+        filter: { pk: { eq: pk } },
+        limit: 1e3
+      });
+      return (data ?? []).map((row) => ({
+        pk: row.pk,
+        sk: row.sk,
+        value: decodeAwsJson2(row.value),
+        ttl: row.ttl ?? void 0
+      }));
+    },
+    async put(pk, sk, value, opts) {
+      const model = requireModel();
+      const ttl = opts?.ttlSeconds ? Math.floor(Date.now() / 1e3) + opts.ttlSeconds : void 0;
+      const existing = await model.get({ pk, sk });
+      if (existing.data) {
+        const { errors } = await model.update({
+          pk,
+          sk,
+          value: encodeAwsJson2(value),
+          ttl: ttl ?? null
+        });
+        if (errors) throw new Error(errors[0]?.message ?? "KvStore.update failed");
+      } else {
+        const { errors } = await model.create({
+          pk,
+          sk,
+          value: encodeAwsJson2(value),
+          ttl
+        });
+        if (errors) throw new Error(errors[0]?.message ?? "KvStore.create failed");
+      }
+    },
+    async remove(pk, sk) {
+      const model = requireModel();
+      const { errors } = await model.delete({ pk, sk });
+      if (errors) throw new Error(errors[0]?.message ?? "KvStore.delete failed");
+    }
+  };
+  setKvStore(store);
+}
+
+// src/components/admin-providers.tsx
+import { Fragment, jsx } from "react/jsx-runtime";
+function AdminProviders({ outputs, cmsConfig, children }) {
+  configureAmplify(outputs);
+  setAdminCmsConfigClient(cmsConfig);
+  setAdminMediaContext(outputs, cmsConfig);
+  installAdminPostsProvider();
+  installAdminKvProvider();
+  return /* @__PURE__ */ jsx(Fragment, { children });
+}
+
+// src/components/sidebar.tsx
+import { useEffect, useState } from "react";
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+import { signOut } from "aws-amplify/auth";
+import {
+  LayoutDashboard,
+  FileText,
+  Image,
+  Globe,
+  Users,
+  Key,
+  LogOut,
+  ExternalLink,
+  Menu,
+  X
+} from "lucide-react";
+import { Button, cn } from "@ampless/runtime/ui";
+import { Fragment as Fragment2, jsx as jsx2, jsxs } from "react/jsx-runtime";
+var navItems = [
+  { href: "/admin", key: "sidebar.dashboard", icon: LayoutDashboard },
+  { href: "/admin/posts", key: "sidebar.posts", icon: FileText },
+  { href: "/admin/media", key: "sidebar.media", icon: Image },
+  // ampless runs one site per deployment, so this links directly to
+  // the single site's settings page instead of a list landing.
+  { href: "/admin/sites/default", key: "sidebar.sites", icon: Globe },
+  { href: "/admin/users", key: "sidebar.users", icon: Users, adminOnly: true },
+  { href: "/admin/mcp-tokens", key: "sidebar.mcpTokens", icon: Key, adminOnly: true }
+];
+function Sidebar({
+  email,
+  isAdmin
+}) {
+  const pathname = usePathname();
+  const t = useT();
+  const [open, setOpen] = useState(false);
+  useEffect(() => {
+    setOpen(false);
+  }, [pathname]);
+  useEffect(() => {
+    if (!open) return;
+    const prev = document.body.style.overflow;
+    document.body.style.overflow = "hidden";
+    return () => {
+      document.body.style.overflow = prev;
+    };
+  }, [open]);
+  return /* @__PURE__ */ jsxs(Fragment2, { children: [
+    /* @__PURE__ */ jsxs("header", { className: "sticky top-0 z-30 flex h-14 items-center justify-between border-b bg-background px-4 md:hidden", children: [
+      /* @__PURE__ */ jsx2(Link, { href: "/admin", className: "font-semibold", children: t("sidebar.brand") }),
+      /* @__PURE__ */ jsx2(
+        Button,
+        {
+          variant: "ghost",
+          size: "icon",
+          "aria-label": t("sidebar.openMenu"),
+          "aria-expanded": open,
+          onClick: () => setOpen(true),
+          children: /* @__PURE__ */ jsx2(Menu, { className: "h-5 w-5" })
+        }
+      )
+    ] }),
+    open && /* @__PURE__ */ jsx2(
+      "div",
+      {
+        className: "fixed inset-0 z-40 bg-black/40 md:hidden",
+        "aria-hidden": "true",
+        onClick: () => setOpen(false)
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      "aside",
+      {
+        className: cn(
+          // Mobile drawer overlays page content (`fixed` + `z-50`), so
+          // it must be fully opaque to stay readable. The desktop rail
+          // (`md:sticky`) sits in its own column with nothing behind it,
+          // so the original subtle muted tint is fine there.
+          "fixed inset-y-0 left-0 z-50 flex w-60 flex-col border-r bg-background transition-transform md:sticky md:top-0 md:h-screen md:translate-x-0 md:bg-muted/30",
+          open ? "translate-x-0" : "-translate-x-full md:translate-x-0"
+        ),
+        "aria-label": t("sidebar.brand"),
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-b p-4", children: [
+            /* @__PURE__ */ jsx2(Link, { href: "/admin", className: "font-semibold", children: t("sidebar.brand") }),
+            /* @__PURE__ */ jsx2(
+              Button,
+              {
+                variant: "ghost",
+                size: "icon",
+                className: "md:hidden",
+                "aria-label": t("sidebar.closeMenu"),
+                onClick: () => setOpen(false),
+                children: /* @__PURE__ */ jsx2(X, { className: "h-5 w-5" })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx2("nav", { className: "flex-1 space-y-1 overflow-y-auto p-2", children: navItems.map((item) => {
+            if (item.adminOnly && !isAdmin) return null;
+            const Icon = item.icon;
+            const isActive = pathname === item.href || item.href !== "/admin" && pathname?.startsWith(item.href);
+            return /* @__PURE__ */ jsxs(
+              Link,
+              {
+                href: item.href,
+                className: cn(
+                  "flex items-center gap-3 rounded-md px-3 py-2 text-sm transition-colors",
+                  isActive ? "bg-accent text-accent-foreground" : "text-muted-foreground hover:bg-accent hover:text-accent-foreground"
+                ),
+                children: [
+                  /* @__PURE__ */ jsx2(Icon, { className: "h-4 w-4" }),
+                  t(item.key)
+                ]
+              },
+              item.href
+            );
+          }) }),
+          /* @__PURE__ */ jsxs("div", { className: "border-t p-2 space-y-1", children: [
+            /* @__PURE__ */ jsxs(
+              Link,
+              {
+                href: "/",
+                target: "_blank",
+                className: "flex items-center gap-3 rounded-md px-3 py-2 text-sm text-muted-foreground hover:bg-accent hover:text-accent-foreground",
+                children: [
+                  /* @__PURE__ */ jsx2(ExternalLink, { className: "h-4 w-4" }),
+                  t("sidebar.viewSite")
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx2("div", { className: "px-3 py-2 text-xs text-muted-foreground truncate", children: email }),
+            /* @__PURE__ */ jsxs(
+              Button,
+              {
+                variant: "ghost",
+                size: "sm",
+                className: "w-full justify-start gap-3",
+                onClick: async () => {
+                  await signOut();
+                  window.location.href = "/login";
+                },
+                children: [
+                  /* @__PURE__ */ jsx2(LogOut, { className: "h-4 w-4" }),
+                  t("sidebar.signOut")
+                ]
+              }
+            )
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+
+// src/components/site-settings-form.tsx
+import { useState as useState2 } from "react";
+import { useRouter } from "next/navigation";
+import { setSiteSetting } from "ampless";
+import { Button as Button2, Input, Label, Textarea } from "@ampless/runtime/ui";
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+var KEYS = [
+  "site.name",
+  "site.url",
+  "site.description",
+  "media.imageDisplay",
+  "media.imageMaxWidth",
+  "dateFormat",
+  "timezone"
+];
+function SiteSettingsForm({ initial, fallback }) {
+  const router = useRouter();
+  const t = useT();
+  const [values, setValues] = useState2(initial);
+  const [saving, setSaving] = useState2(false);
+  const [error, setError] = useState2(null);
+  const [info, setInfo] = useState2(null);
+  function update(key, value) {
+    setValues((prev) => ({ ...prev, [key]: value }));
+  }
+  async function save(e) {
+    e.preventDefault();
+    setSaving(true);
+    setError(null);
+    setInfo(null);
+    try {
+      await Promise.all(
+        KEYS.map((key) => {
+          const value = values[key];
+          if (value === void 0 || value === "") return Promise.resolve();
+          return setSiteSetting(key, value);
+        })
+      );
+      setInfo(t("sites.edit.saved"));
+      router.refresh();
+    } catch (err) {
+      setError(err instanceof Error ? err.message : String(err));
+    } finally {
+      setSaving(false);
+    }
+  }
+  return /* @__PURE__ */ jsxs2("form", { onSubmit: save, className: "space-y-6 max-w-xl", children: [
+    /* @__PURE__ */ jsxs2("fieldset", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsx3("legend", { className: "text-sm font-medium uppercase tracking-wide text-muted-foreground", children: t("sites.edit.site") }),
+      /* @__PURE__ */ jsxs2("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx3(Label, { htmlFor: "name", children: t("common.name") }),
+        /* @__PURE__ */ jsx3(
+          Input,
+          {
+            id: "name",
+            value: values["site.name"] ?? "",
+            placeholder: fallback["site.name"] ?? "",
+            onChange: (e) => update("site.name", e.target.value)
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs2("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx3(Label, { htmlFor: "url", children: t("common.url") }),
+        /* @__PURE__ */ jsx3(
+          Input,
+          {
+            id: "url",
+            value: values["site.url"] ?? "",
+            placeholder: fallback["site.url"] ?? "",
+            onChange: (e) => update("site.url", e.target.value)
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs2("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx3(Label, { htmlFor: "description", children: t("common.description") }),
+        /* @__PURE__ */ jsx3(
+          Textarea,
+          {
+            id: "description",
+            value: values["site.description"] ?? "",
+            placeholder: fallback["site.description"] ?? "",
+            rows: 2,
+            onChange: (e) => update("site.description", e.target.value)
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs2("fieldset", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsx3("legend", { className: "text-sm font-medium uppercase tracking-wide text-muted-foreground", children: t("sites.edit.media") }),
+      /* @__PURE__ */ jsxs2("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx3(Label, { htmlFor: "imageDisplay", children: t("sites.edit.imageDisplay") }),
+        /* @__PURE__ */ jsxs2(
+          "select",
+          {
+            id: "imageDisplay",
+            className: "w-full rounded-md border bg-background px-2 py-1.5 text-sm",
+            value: values["media.imageDisplay"] ?? "",
+            onChange: (e) => update("media.imageDisplay", e.target.value),
+            children: [
+              /* @__PURE__ */ jsx3("option", { value: "", children: t("sites.edit.defaultPlaceholder", {
+                value: fallback["media.imageDisplay"] ?? "inline"
+              }) }),
+              /* @__PURE__ */ jsx3("option", { value: "inline", children: t("sites.edit.imageDisplayInline") }),
+              /* @__PURE__ */ jsx3("option", { value: "lightbox", children: t("sites.edit.imageDisplayLightbox") })
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs2("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx3(Label, { htmlFor: "imageMaxWidth", children: t("sites.edit.imageMaxWidth") }),
+        /* @__PURE__ */ jsx3(
+          Input,
+          {
+            id: "imageMaxWidth",
+            value: values["media.imageMaxWidth"] ?? "",
+            placeholder: fallback["media.imageMaxWidth"] ?? "100%",
+            onChange: (e) => update("media.imageMaxWidth", e.target.value)
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs2("fieldset", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsx3("legend", { className: "text-sm font-medium uppercase tracking-wide text-muted-foreground", children: t("sites.edit.dateDisplay") }),
+      /* @__PURE__ */ jsxs2("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx3(Label, { htmlFor: "dateFormat", children: t("sites.edit.dateFormat") }),
+        /* @__PURE__ */ jsxs2(
+          "select",
+          {
+            id: "dateFormat",
+            className: "w-full rounded-md border bg-background px-2 py-1.5 text-sm",
+            value: values["dateFormat"] ?? "",
+            onChange: (e) => update("dateFormat", e.target.value),
+            children: [
+              /* @__PURE__ */ jsx3("option", { value: "", children: t("sites.edit.defaultPlaceholder", {
+                value: fallback["dateFormat"] ?? "iso"
+              }) }),
+              /* @__PURE__ */ jsx3("option", { value: "iso", children: t("sites.edit.dateFormatIso") }),
+              /* @__PURE__ */ jsx3("option", { value: "long", children: t("sites.edit.dateFormatLong") }),
+              /* @__PURE__ */ jsx3("option", { value: "locale", children: t("sites.edit.dateFormatLocale") })
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs2("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx3(Label, { htmlFor: "timezone", children: t("sites.edit.timezone") }),
+        /* @__PURE__ */ jsx3(
+          Input,
+          {
+            id: "timezone",
+            value: values["timezone"] ?? "",
+            placeholder: fallback["timezone"] ?? "UTC",
+            onChange: (e) => update("timezone", e.target.value)
+          }
+        )
+      ] })
+    ] }),
+    info && /* @__PURE__ */ jsx3("p", { className: "text-sm text-muted-foreground", children: info }),
+    error && /* @__PURE__ */ jsx3("p", { className: "text-sm text-destructive", children: error }),
+    /* @__PURE__ */ jsx3(Button2, { type: "submit", disabled: saving, children: saving ? t("common.saving") : t("sites.edit.saveButton") })
+  ] });
+}
+
+// src/components/theme-settings-form.tsx
+import { useEffect as useEffect2, useState as useState3 } from "react";
+import { useRouter as useRouter2 } from "next/navigation";
+import {
+  setSiteSetting as setSiteSetting2,
+  deleteSiteSetting,
+  themeSettingKey,
+  validateThemeValue,
+  resolveLocalized,
+  parseLinkList,
+  stringifyLinkList,
+  parseColorPair,
+  formatColorPair
+} from "ampless";
+import {
+  COLOR_SCHEME_SETTING_KEY,
+  DEFAULT_COLOR_SCHEME,
+  validateColorScheme
+} from "@ampless/runtime";
+import { Button as Button3, Input as Input2, Label as Label2 } from "@ampless/runtime/ui";
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+var CACHE_REBUILD_DELAY_MS = 8e3;
+function ThemeSettingsForm({
+  manifest,
+  activeTheme,
+  themeOptions,
+  initial,
+  initialColorScheme
+}) {
+  const router = useRouter2();
+  const t = useT();
+  const locale = useLocale();
+  const [state, setState] = useState3({ values: initial, touched: {} });
+  const [pendingTheme, setPendingTheme] = useState3(activeTheme);
+  const [optimisticActive, setOptimisticActive] = useState3(activeTheme);
+  const [saving, setSaving] = useState3(false);
+  const [switching, setSwitching] = useState3(false);
+  const [error, setError] = useState3(null);
+  const [info, setInfo] = useState3(null);
+  const [invalid, setInvalid] = useState3({});
+  const [colorScheme, setColorScheme] = useState3(
+    initialColorScheme ?? DEFAULT_COLOR_SCHEME
+  );
+  const [colorSchemeTouched, setColorSchemeTouched] = useState3(false);
+  function update(key, value) {
+    setState((prev) => ({
+      values: { ...prev.values, [key]: value },
+      touched: { ...prev.touched, [key]: true }
+    }));
+  }
+  function scheduleCacheInvalidation() {
+    setTimeout(async () => {
+      try {
+        await invalidateSiteSettingsCache();
+      } catch (err) {
+        console.warn("[theme] cache invalidation failed", err);
+      }
+    }, CACHE_REBUILD_DELAY_MS);
+  }
+  function scheduleHardReload() {
+    setTimeout(async () => {
+      try {
+        await invalidateSiteSettingsCache();
+      } catch (err) {
+        console.warn("[theme] cache invalidation failed", err);
+      }
+      window.location.reload();
+    }, CACHE_REBUILD_DELAY_MS);
+  }
+  async function switchTheme(e) {
+    e.preventDefault();
+    if (pendingTheme === optimisticActive) return;
+    setSwitching(true);
+    setError(null);
+    setInfo(null);
+    try {
+      await setSiteSetting2("theme.active", pendingTheme);
+      setOptimisticActive(pendingTheme);
+      setInfo(t("theme.switched", { theme: pendingTheme }));
+      scheduleHardReload();
+    } catch (err) {
+      console.error("[theme] switch failed", err);
+      setError(err instanceof Error ? err.message : String(err));
+    } finally {
+      setSwitching(false);
+    }
+  }
+  async function save(e) {
+    e.preventDefault();
+    setSaving(true);
+    setError(null);
+    setInfo(null);
+    setInvalid({});
+    const newInvalid = {};
+    const writes = [];
+    for (const field of manifest.fields) {
+      if (!state.touched[field.key]) continue;
+      const raw = (state.values[field.key] ?? "").trim();
+      const storeKey = themeSettingKey(field.key);
+      if (raw === "") {
+        writes.push(deleteSiteSetting(storeKey));
+        continue;
+      }
+      const validated = validateThemeValue(field, raw);
+      if (validated === null) {
+        newInvalid[field.key] = true;
+        continue;
+      }
+      writes.push(setSiteSetting2(storeKey, validated));
+    }
+    if (colorSchemeTouched) {
+      if (colorScheme === DEFAULT_COLOR_SCHEME) {
+        writes.push(deleteSiteSetting(COLOR_SCHEME_SETTING_KEY));
+      } else {
+        writes.push(setSiteSetting2(COLOR_SCHEME_SETTING_KEY, colorScheme));
+      }
+    }
+    if (Object.keys(newInvalid).length > 0) {
+      setInvalid(newInvalid);
+      setSaving(false);
+      setError(t("theme.invalidValues"));
+      return;
+    }
+    try {
+      await Promise.all(writes);
+      setInfo(t("theme.saved"));
+      setState((prev) => ({ values: prev.values, touched: {} }));
+      setColorSchemeTouched(false);
+      scheduleCacheInvalidation();
+    } catch (err) {
+      console.error("[theme] save failed", err);
+      setError(err instanceof Error ? err.message : String(err));
+    } finally {
+      setSaving(false);
+    }
+  }
+  const groups = groupFields(manifest.fields);
+  return /* @__PURE__ */ jsxs3("div", { className: "space-y-8", children: [
+    /* @__PURE__ */ jsxs3("form", { onSubmit: switchTheme, className: "max-w-xl space-y-3 rounded-md border p-4", children: [
+      /* @__PURE__ */ jsxs3("div", { className: "space-y-1", children: [
+        /* @__PURE__ */ jsx4(Label2, { htmlFor: "active-theme", className: "text-sm font-medium", children: t("theme.activeLabel") }),
+        /* @__PURE__ */ jsxs3("p", { className: "text-xs text-muted-foreground", children: [
+          t("theme.currentlyActive", { theme: optimisticActive }),
+          optimisticActive !== activeTheme && t("theme.propagating")
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx4(
+        "select",
+        {
+          id: "active-theme",
+          className: "w-full rounded-md border bg-background px-2 py-1.5 text-sm",
+          value: pendingTheme,
+          onChange: (e) => setPendingTheme(e.target.value),
+          children: themeOptions.map((opt) => /* @__PURE__ */ jsxs3("option", { value: opt.value, children: [
+            resolveLocalized(opt.label, locale),
+            " (",
+            opt.value,
+            ")"
+          ] }, opt.value))
+        }
+      ),
+      (() => {
+        const desc = themeOptions.find((o) => o.value === pendingTheme)?.description;
+        return desc ? /* @__PURE__ */ jsx4("p", { className: "text-xs text-muted-foreground", children: resolveLocalized(desc, locale) }) : null;
+      })(),
+      /* @__PURE__ */ jsx4(
+        Button3,
+        {
+          type: "submit",
+          disabled: switching || pendingTheme === optimisticActive,
+          variant: pendingTheme === optimisticActive ? "outline" : "default",
+          children: switching ? t("theme.switching") : t("theme.switchButton")
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs3("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsx4(Label2, { className: "text-sm font-medium", children: t("theme.previewLabel") }),
+      /* @__PURE__ */ jsx4(
+        "iframe",
+        {
+          src: `/?previewTheme=${encodeURIComponent(pendingTheme)}&previewColorScheme=${encodeURIComponent(colorScheme)}`,
+          title: t("theme.previewLabel"),
+          className: "h-[600px] w-full rounded-md border bg-[var(--background)]"
+        },
+        `${pendingTheme}-${colorScheme}`
+      ),
+      /* @__PURE__ */ jsx4("p", { className: "text-xs text-muted-foreground", children: t("theme.previewHint") })
+    ] }),
+    /* @__PURE__ */ jsxs3("form", { onSubmit: save, className: "max-w-xl space-y-6", children: [
+      /* @__PURE__ */ jsxs3("div", { children: [
+        /* @__PURE__ */ jsx4("h2", { className: "text-lg font-semibold", children: t("theme.customizationHeading", {
+          theme: resolveLocalized(manifest.label, locale)
+        }) }),
+        manifest.description && /* @__PURE__ */ jsx4("p", { className: "text-sm text-muted-foreground", children: resolveLocalized(manifest.description, locale) }),
+        /* @__PURE__ */ jsx4("p", { className: "mt-1 text-xs text-muted-foreground", children: t("theme.customizationHint") })
+      ] }),
+      /* @__PURE__ */ jsxs3("fieldset", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx4(Label2, { htmlFor: "color-scheme", className: "text-sm font-medium", children: t("theme.colorScheme.label") }),
+        /* @__PURE__ */ jsxs3(
+          "select",
+          {
+            id: "color-scheme",
+            className: "w-full rounded-md border bg-background px-2 py-1.5 text-sm",
+            value: colorScheme,
+            onChange: (e) => {
+              setColorScheme(validateColorScheme(e.target.value));
+              setColorSchemeTouched(true);
+            },
+            children: [
+              /* @__PURE__ */ jsx4("option", { value: "auto", children: t("theme.colorScheme.auto") }),
+              /* @__PURE__ */ jsx4("option", { value: "light", children: t("theme.colorScheme.light") }),
+              /* @__PURE__ */ jsx4("option", { value: "dark", children: t("theme.colorScheme.dark") })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx4("p", { className: "text-xs text-muted-foreground", children: t("theme.colorScheme.hint") })
+      ] }),
+      groups.map(({ key, name, fields }) => /* @__PURE__ */ jsxs3("fieldset", { className: "space-y-4", children: [
+        /* @__PURE__ */ jsx4("legend", { className: "text-sm font-medium uppercase tracking-wide text-muted-foreground", children: resolveLocalized(name, locale) }),
+        fields.map((field) => /* @__PURE__ */ jsx4(
+          FieldRow,
+          {
+            field,
+            value: state.values[field.key] ?? "",
+            invalid: !!invalid[field.key],
+            onChange: (v) => update(field.key, v)
+          },
+          field.key
+        ))
+      ] }, key)),
+      info && /* @__PURE__ */ jsx4("p", { className: "text-sm text-muted-foreground", children: info }),
+      error && /* @__PURE__ */ jsx4("p", { className: "text-sm text-destructive", children: error }),
+      /* @__PURE__ */ jsx4(Button3, { type: "submit", disabled: saving, children: saving ? t("theme.saving") : t("theme.saveButton") })
+    ] })
+  ] });
+}
+function groupFields(fields) {
+  const map = /* @__PURE__ */ new Map();
+  for (const field of fields) {
+    const g = field.group ?? "General";
+    const k = typeof g === "string" ? g : JSON.stringify(g);
+    const existing = map.get(k);
+    if (existing) {
+      existing.fields.push(field);
+    } else {
+      map.set(k, { name: g, fields: [field] });
+    }
+  }
+  return Array.from(map.entries()).map(([key, { name, fields: fields2 }]) => ({ key, name, fields: fields2 }));
+}
+function FieldRow({ field, value, invalid, onChange }) {
+  const t = useT();
+  const locale = useLocale();
+  const id = `theme-${field.key}`;
+  const labelEl = /* @__PURE__ */ jsx4(Label2, { htmlFor: id, className: invalid ? "text-destructive" : void 0, children: resolveLocalized(field.label, locale) });
+  const description = field.description ? /* @__PURE__ */ jsx4("p", { className: "text-xs text-muted-foreground", children: resolveLocalized(field.description, locale) }) : null;
+  switch (field.type) {
+    case "color":
+      return /* @__PURE__ */ jsx4(ColorField, { field, id, labelEl, description, value, invalid, onChange });
+    case "length":
+      return /* @__PURE__ */ jsxs3("div", { className: "space-y-2", children: [
+        labelEl,
+        description,
+        /* @__PURE__ */ jsx4(
+          Input2,
+          {
+            id,
+            value,
+            placeholder: field.default,
+            onChange: (e) => onChange(e.target.value),
+            "aria-invalid": invalid,
+            className: "font-mono text-xs"
+          }
+        ),
+        /* @__PURE__ */ jsx4("p", { className: "text-xs text-muted-foreground", children: t("theme.lengthHelp") })
+      ] });
+    case "select":
+    case "fontFamily":
+      return /* @__PURE__ */ jsxs3("div", { className: "space-y-2", children: [
+        labelEl,
+        description,
+        /* @__PURE__ */ jsxs3(
+          "select",
+          {
+            id,
+            className: "w-full rounded-md border bg-background px-2 py-1.5 text-sm",
+            value: value || "",
+            onChange: (e) => onChange(e.target.value),
+            "aria-invalid": invalid,
+            children: [
+              /* @__PURE__ */ jsx4("option", { value: "", children: t("common.default") }),
+              field.options.map((opt) => /* @__PURE__ */ jsx4("option", { value: opt.value, children: resolveLocalized(opt.label, locale) }, opt.value))
+            ]
+          }
+        )
+      ] });
+    case "image":
+      return /* @__PURE__ */ jsxs3("div", { className: "space-y-2", children: [
+        labelEl,
+        description,
+        /* @__PURE__ */ jsx4(
+          Input2,
+          {
+            id,
+            value,
+            placeholder: field.default || t("theme.imagePlaceholder"),
+            onChange: (e) => onChange(e.target.value),
+            "aria-invalid": invalid
+          }
+        )
+      ] });
+    case "text":
+      return /* @__PURE__ */ jsxs3("div", { className: "space-y-2", children: [
+        labelEl,
+        description,
+        /* @__PURE__ */ jsx4(
+          Input2,
+          {
+            id,
+            value,
+            placeholder: field.default,
+            maxLength: field.maxLength,
+            onChange: (e) => onChange(e.target.value),
+            "aria-invalid": invalid
+          }
+        )
+      ] });
+    case "linkList":
+      return /* @__PURE__ */ jsx4(
+        LinkListField,
+        {
+          field,
+          labelEl,
+          description,
+          value,
+          onChange
+        }
+      );
+  }
+}
+function LinkListField({ field, labelEl, description, value, onChange }) {
+  const items = parseLinkList(value);
+  const max = field.maxItems ?? 50;
+  function commit(next) {
+    onChange(stringifyLinkList(next));
+  }
+  function update(idx, patch) {
+    commit(items.map((it, i) => i === idx ? { ...it, ...patch } : it));
+  }
+  function add() {
+    if (items.length >= max) return;
+    commit([...items, { label: "", url: "" }]);
+  }
+  function remove(idx) {
+    commit(items.filter((_, i) => i !== idx));
+  }
+  function move(idx, delta) {
+    const target = idx + delta;
+    if (target < 0 || target >= items.length) return;
+    const next = items.slice();
+    const [moved] = next.splice(idx, 1);
+    next.splice(target, 0, moved);
+    commit(next);
+  }
+  return /* @__PURE__ */ jsxs3("div", { className: "space-y-2", children: [
+    labelEl,
+    description,
+    /* @__PURE__ */ jsxs3("div", { className: "space-y-2 rounded-md border bg-muted/20 p-3", children: [
+      items.length === 0 && /* @__PURE__ */ jsx4("p", { className: "text-xs text-muted-foreground", children: "No links yet." }),
+      items.map((item, idx) => {
+        const isTagRef = /^tag:/.test(item.url.trim());
+        return /* @__PURE__ */ jsxs3("div", { className: "flex flex-wrap items-start gap-2", children: [
+          /* @__PURE__ */ jsxs3("div", { className: "grid flex-1 grid-cols-1 gap-2 sm:grid-cols-2", children: [
+            /* @__PURE__ */ jsx4(
+              Input2,
+              {
+                value: item.label,
+                placeholder: "Label",
+                onChange: (e) => update(idx, { label: e.target.value })
+              }
+            ),
+            /* @__PURE__ */ jsx4(
+              Input2,
+              {
+                value: item.url,
+                placeholder: "/path or https://\u2026 or tag:name",
+                onChange: (e) => update(idx, { url: e.target.value }),
+                className: isTagRef ? "font-mono text-xs" : void 0
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs3("div", { className: "flex shrink-0 items-center gap-1", children: [
+            /* @__PURE__ */ jsx4(
+              Button3,
+              {
+                type: "button",
+                variant: "ghost",
+                size: "icon",
+                onClick: () => move(idx, -1),
+                disabled: idx === 0,
+                "aria-label": "Move up",
+                children: "\u2191"
+              }
+            ),
+            /* @__PURE__ */ jsx4(
+              Button3,
+              {
+                type: "button",
+                variant: "ghost",
+                size: "icon",
+                onClick: () => move(idx, 1),
+                disabled: idx === items.length - 1,
+                "aria-label": "Move down",
+                children: "\u2193"
+              }
+            ),
+            /* @__PURE__ */ jsx4(
+              Button3,
+              {
+                type: "button",
+                variant: "ghost",
+                size: "icon",
+                onClick: () => remove(idx),
+                "aria-label": "Remove",
+                children: "\xD7"
+              }
+            )
+          ] })
+        ] }, idx);
+      }),
+      /* @__PURE__ */ jsx4(
+        Button3,
+        {
+          type: "button",
+          variant: "outline",
+          size: "sm",
+          onClick: add,
+          disabled: items.length >= max,
+          children: "+ Add link"
+        }
+      ),
+      /* @__PURE__ */ jsxs3("p", { className: "text-xs text-muted-foreground", children: [
+        "Tip: use ",
+        /* @__PURE__ */ jsx4("code", { children: "tag:<name>" }),
+        " as a URL to render a list of posts with that tag instead of a single link."
+      ] })
+    ] })
+  ] });
+}
+function ColorField({
+  field,
+  id,
+  labelEl,
+  description,
+  value,
+  invalid,
+  onChange
+}) {
+  const parsed = parseColorPair(value);
+  const lightInput = parsed.dark !== null ? parsed.light : value;
+  const darkInput = parsed.dark ?? "";
+  const [showDark, setShowDark] = useState3(parsed.dark !== null);
+  function emit(nextLight, nextDark) {
+    if (!nextDark.trim()) {
+      onChange(nextLight);
+      return;
+    }
+    onChange(formatColorPair(nextLight || field.default, nextDark));
+  }
+  const lightEffective = lightInput || field.default;
+  const darkEffective = darkInput || lightEffective;
+  return /* @__PURE__ */ jsxs3("div", { className: "space-y-2", children: [
+    labelEl,
+    description,
+    /* @__PURE__ */ jsx4(
+      ColorRow,
+      {
+        id,
+        label: showDark ? "Light" : void 0,
+        value: lightInput,
+        effective: lightEffective,
+        placeholder: field.default,
+        ariaLabel: `${typeof field.label === "string" ? field.label : id} (light)`,
+        invalid,
+        onChange: (v) => emit(v, darkInput)
+      }
+    ),
+    showDark ? /* @__PURE__ */ jsx4(
+      ColorRow,
+      {
+        id: `${id}-dark`,
+        label: "Dark",
+        value: darkInput,
+        effective: darkEffective,
+        placeholder: lightEffective,
+        ariaLabel: `${typeof field.label === "string" ? field.label : id} (dark)`,
+        invalid,
+        onChange: (v) => emit(lightInput, v)
+      }
+    ) : null,
+    /* @__PURE__ */ jsx4("div", { className: "flex items-center gap-3 text-xs", children: /* @__PURE__ */ jsx4(
+      "button",
+      {
+        type: "button",
+        className: "text-muted-foreground underline-offset-2 hover:underline",
+        onClick: () => {
+          if (showDark) {
+            setShowDark(false);
+            emit(lightInput, "");
+          } else {
+            setShowDark(true);
+          }
+        },
+        children: showDark ? "\u2212 Remove dark variant" : "+ Add dark variant (optional)"
+      }
+    ) })
+  ] });
+}
+function ColorRow({
+  id,
+  label,
+  value,
+  effective,
+  placeholder,
+  ariaLabel,
+  invalid,
+  onChange
+}) {
+  const hex = useColorAsHex(effective);
+  return /* @__PURE__ */ jsxs3("div", { className: "space-y-1", children: [
+    label ? /* @__PURE__ */ jsx4(Label2, { htmlFor: id, className: "text-xs uppercase tracking-wide text-muted-foreground", children: label }) : null,
+    /* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx4(
+        "input",
+        {
+          type: "color",
+          value: hex,
+          onChange: (e) => onChange(e.target.value),
+          className: "h-9 w-12 cursor-pointer rounded border border-input bg-background p-0",
+          "aria-label": `${ariaLabel} swatch`
+        }
+      ),
+      /* @__PURE__ */ jsx4(
+        Input2,
+        {
+          id,
+          value,
+          placeholder,
+          onChange: (e) => onChange(e.target.value),
+          "aria-invalid": invalid,
+          className: "font-mono text-xs"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx4(
+        "span",
+        {
+          className: "inline-block h-4 w-4 rounded border",
+          style: { background: effective },
+          "aria-hidden": true
+        }
+      ),
+      /* @__PURE__ */ jsx4("code", { className: "text-xs text-muted-foreground", children: effective })
+    ] })
+  ] });
+}
+function useColorAsHex(value) {
+  const [hex, setHex] = useState3(() => directHex(value) ?? "#000000");
+  useEffect2(() => {
+    const direct = directHex(value);
+    if (direct) {
+      setHex(direct);
+      return;
+    }
+    if (typeof document === "undefined") return;
+    try {
+      const el = document.createElement("span");
+      el.style.color = value;
+      el.style.display = "none";
+      document.body.appendChild(el);
+      const computed = getComputedStyle(el).color;
+      document.body.removeChild(el);
+      const next = rgbStringToHex(computed);
+      if (next) setHex(next);
+    } catch {
+    }
+  }, [value]);
+  return hex;
+}
+function directHex(value) {
+  const m = /^#([0-9a-fA-F]{6})$/.exec(value.trim());
+  return m ? value.trim().toLowerCase() : null;
+}
+function rgbStringToHex(rgb) {
+  const m = /^rgba?\(\s*(\d+)[\s,]+(\d+)[\s,]+(\d+)/.exec(rgb);
+  if (!m) return null;
+  const r = clampToHex(m[1]);
+  const g = clampToHex(m[2]);
+  const b = clampToHex(m[3]);
+  return `#${r}${g}${b}`;
+}
+function clampToHex(s) {
+  const n = Math.max(0, Math.min(255, parseInt(s, 10)));
+  return n.toString(16).padStart(2, "0");
+}
+
+export {
+  AdminProviders,
+  Sidebar,
+  SiteSettingsForm,
+  ThemeSettingsForm
+};