nextblogkit 0.6.2 → 0.7.1

package/README.md

@@ -18,8 +18,8 @@ A complete blog engine for Next.js — admin panel, block editor, SEO, media sto
 
 - **Next.js 14+** with App Router
 - **MongoDB** (Atlas or self-hosted)
-- **Cloudflare R2** bucket (for media storage)
 - **Node.js 18+**
+- **Cloudflare R2** bucket (optional — for persistent image storage)
 
 ## Quick Start
 
@@ -61,24 +61,31 @@ cp .env.local.example .env.local
 Fill in your values:
 
 ```env
+# ── REQUIRED ─────────────────────────────────────────────
 # MongoDB Connection
 NEXTBLOGKIT_MONGODB_URI=mongodb+srv://user:pass@cluster.mongodb.net/mydb
 
-# Cloudflare R2 Storage
-NEXTBLOGKIT_R2_ACCOUNT_ID=your-account-id
-NEXTBLOGKIT_R2_ACCESS_KEY=your-access-key
-NEXTBLOGKIT_R2_SECRET_KEY=your-secret-key
-NEXTBLOGKIT_R2_BUCKET=blog-media
-NEXTBLOGKIT_R2_PUBLIC_URL=https://media.yourdomain.com
-
-# Authentication
+# Authentication (must be at least 32 characters)
 NEXTBLOGKIT_API_KEY=your-secure-api-key-must-be-at-least-32-characters-long
 
-# Site Info
-NEXTBLOGKIT_SITE_URL=https://yourdomain.com
-NEXTBLOGKIT_SITE_NAME="Your Site Name"
+# ── OPTIONAL ─────────────────────────────────────────────
+# Database name (optional — defaults to the database in your connection URI)
+# NEXTBLOGKIT_MONGODB_DB=nextblogkit
+
+# Cloudflare R2 Storage (needed for image uploads; without it, images use temporary blob URLs)
+# NEXTBLOGKIT_R2_ACCOUNT_ID=your-account-id
+# NEXTBLOGKIT_R2_ACCESS_KEY=your-access-key
+# NEXTBLOGKIT_R2_SECRET_KEY=your-secret-key
+# NEXTBLOGKIT_R2_BUCKET=blog-media
+# NEXTBLOGKIT_R2_PUBLIC_URL=https://media.yourdomain.com
+
+# Site Info (used in SEO meta tags, RSS, sitemap)
+# NEXTBLOGKIT_SITE_URL=https://yourdomain.com
+# NEXTBLOGKIT_SITE_NAME="Your Site Name"
 ```
 
+> **Only `NEXTBLOGKIT_MONGODB_URI` and `NEXTBLOGKIT_API_KEY` are required to start.** `NEXTBLOGKIT_MONGODB_DB` overrides the database name from the URI. R2 variables are needed for persistent image uploads. Site URL/name are used for SEO — defaults are empty/`"Blog"` if omitted.
+
 ### 4. Run database migrations
 
 ```bash
@@ -525,7 +532,7 @@ import {
 | Component | Description |
 |-----------|-------------|
 | `BlogCard` | Post preview card (vertical or horizontal layout) |
-| `BlogSearch` | Search input with instant results dropdown |
+| `BlogSearch` | Search input with instant results dropdown (accepts `basePath` prop) |
 | `TableOfContents` | Heading list with scroll-to and active heading tracking |
 | `ShareButtons` | Social share buttons (Twitter, Facebook, LinkedIn, copy link) |
 | `ReadingProgressBar` | Top-of-page progress bar tied to scroll position |
@@ -552,6 +559,8 @@ import {
   SEOPanel,
   useAdminApi,
   setApiBase,
+  setBasePath,
+  getBasePath,
 } from 'nextblogkit/admin';
 ```
 
@@ -565,8 +574,9 @@ Wraps all admin pages with sidebar navigation and authentication.
 | `apiKey` | `string` | — | Pre-set API key (bypasses login prompt) |
 | `apiPath` | `string` | `'/api/blog'` | API route prefix for all admin API calls |
 | `adminPath` | `string` | `'/admin/blog'` | Admin route prefix for sidebar nav links |
+| `basePath` | `string` | `'/blog'` | Public blog URL prefix (used for "View" links in post list and SEO preview) |
 
-**Important:** If you change `apiPath` in your config, you **must** pass it to `AdminLayout`:
+**Important:** If you change `apiPath` or `basePath` in your config, you **must** pass them to `AdminLayout`:
 
 ```tsx
 // app/admin/blog/layout.tsx
@@ -575,7 +585,7 @@ import 'nextblogkit/styles/admin.css';
 
 export default function AdminBlogLayout({ children }: { children: React.ReactNode }) {
   return (
-    <AdminLayout apiPath="/api/blogs" adminPath="/admin/blog">
+    <AdminLayout apiPath="/api/blogs" adminPath="/admin/blog" basePath="/blogs">
       {children}
     </AdminLayout>
   );
@@ -636,6 +646,7 @@ export { GET, POST, PUT, DELETE } from 'nextblogkit/api/posts';
 export { GET, POST, DELETE } from 'nextblogkit/api/media';
 export { GET, POST, PUT, DELETE } from 'nextblogkit/api/categories';
 export { GET, PUT } from 'nextblogkit/api/settings';
+export { GET, POST, DELETE } from 'nextblogkit/api/tokens';
 export { GET } from 'nextblogkit/api/sitemap';
 export { GET } from 'nextblogkit/api/rss';
 
@@ -727,17 +738,67 @@ All API routes require a Bearer token (`NEXTBLOGKIT_API_KEY`) for write operatio
 
 > **Note:** These endpoints use the default `/api/blog` prefix. If you changed `apiPath` in your config, replace `/api/blog` with your custom path.
 
+### Tokens
+
+| Method | Endpoint | Description |
+|--------|----------|-------------|
+| GET | `/api/blog/tokens` | List API tokens (master key only) |
+| POST | `/api/blog/tokens` | Generate new token (master key only) |
+| DELETE | `/api/blog/tokens?id=abc123` | Revoke token (master key only) |
+
 ### Authentication
 
-Include the API key as a Bearer token:
+Include the API key or a generated token as a Bearer token:
 
 ```bash
 curl -X POST http://localhost:3000/api/blog/posts \
   -H "Authorization: Bearer your-api-key-here" \
   -H "Content-Type: application/json" \
-  -d '{"title": "My Post", "content": {...}}'
+  -d '{"title": "My Post", "content": [...], "status": "published"}'
+```
+
+**API Tokens** — You can generate scoped API tokens from the admin Settings page (API Access section). Generated tokens work the same as the master key for read/write operations, but cannot manage other tokens. This is useful for CI pipelines, n8n workflows, and other external integrations.
+
+### Create Post — Sample JSON
+
+```json
+{
+  "title": "My Blog Post",
+  "content": [{ "type": "paragraph", "content": [{ "type": "text", "text": "Hello world!" }] }],
+  "contentHTML": "<p>Hello world!</p>",
+  "excerpt": "A short summary of the post",
+  "status": "published",
+  "categories": ["tech"],
+  "tags": ["nextjs", "blog"],
+  "author": {
+    "name": "John Doe",
+    "bio": "Software engineer",
+    "avatar": "https://example.com/avatar.jpg"
+  },
+  "seo": {
+    "metaTitle": "My Blog Post | MySite",
+    "metaDescription": "A short summary for search engines",
+    "focusKeyword": "blog post"
+  }
+}
 ```
 
+| Field | Type | Required | Description |
+|-------|------|----------|-------------|
+| `title` | string | Yes | Post title |
+| `content` | BlockContent[] | No | TipTap JSON content blocks |
+| `contentHTML` | string | No | HTML version of the content |
+| `excerpt` | string | No | Short summary (auto-generated if omitted) |
+| `slug` | string | No | URL slug (auto-generated from title if omitted) |
+| `status` | `"draft"` \| `"published"` \| `"scheduled"` | No | Defaults to `"draft"` |
+| `categories` | string[] | No | Category slugs |
+| `tags` | string[] | No | Tag strings |
+| `author` | `{ name, bio?, avatar?, url? }` | No | Post author info |
+| `seo` | `{ metaTitle?, metaDescription?, focusKeyword?, ... }` | No | SEO metadata |
+| `coverImage` | `{ _id, url, alt?, caption? }` | No | Cover image reference |
+| `publishedAt` | ISO date string | No | Publish date (auto-set when status is `"published"`) |
+| `scheduledAt` | ISO date string | No | Schedule date for future publishing |
+
 ---
 
 ## Editor Slash Commands
@@ -852,6 +913,7 @@ app/
     ├── media/route.ts              # Media upload/list/delete
     ├── categories/route.ts         # Categories CRUD
     ├── settings/route.ts           # Settings read/update
+    ├── tokens/route.ts             # API token management
     ├── sitemap.xml/route.ts        # Dynamic sitemap
     └── rss.xml/route.ts            # RSS feed
 ```
@@ -862,7 +924,7 @@ Because these are thin wrappers, you can customize any page by editing the gener
 
 ## Local Development (without R2)
 
-If you want to try NextBlogKit locally without Cloudflare R2, images will fall back to `URL.createObjectURL` (browser-only, non-persistent). For a fully working local setup:
+NextBlogKit works with just **MongoDB + API key**. Cloudflare R2 is optional — without it, the editor uses temporary blob URLs for images (they won't persist across reloads), and the upload API returns a clear 503 error. This lets you develop locally and add R2 when you're ready.
 
 1. **MongoDB** — Use a free [MongoDB Atlas](https://www.mongodb.com/atlas) cluster, or run locally:
    ```bash
@@ -871,13 +933,13 @@ If you want to try NextBlogKit locally without Cloudflare R2, images will fall b
    # Then use: NEXTBLOGKIT_MONGODB_URI=mongodb://localhost:27017/nextblogkit
    ```
 
-2. **R2** — Create a free Cloudflare R2 bucket at [dash.cloudflare.com](https://dash.cloudflare.com). The free tier includes 10 GB storage and 10 million reads/month.
-
-3. **API Key** — Generate a secure key:
+2. **API Key** — Generate a secure key:
    ```bash
    openssl rand -hex 32
    ```
 
+3. **R2 (optional)** — Create a free Cloudflare R2 bucket at [dash.cloudflare.com](https://dash.cloudflare.com) for persistent image storage. The free tier includes 10 GB storage and 10 million reads/month.
+
 ---
 
 ## Project Structure (package internals)

package/dist/admin/index.cjs

@@ -39,9 +39,16 @@ var CodeBlockLowlight__default = /*#__PURE__*/_interopDefault(CodeBlockLowlight)
 
 // src/admin/AdminLayout.tsx
 var _apiBase = "/api/blog";
+var _basePath = "/blog";
 function setApiBase(path) {
   _apiBase = path;
 }
+function setBasePath(path) {
+  _basePath = path;
+}
+function getBasePath() {
+  return _basePath;
+}
 function getApiKey() {
   if (typeof window === "undefined") return "";
   return sessionStorage.getItem("nbk_api_key") || "";
@@ -102,7 +109,7 @@ function buildNavItems(adminPath) {
     { label: "Settings", href: `${adminPath}/settings`, icon: "\u2699\uFE0F" }
   ];
 }
-function AdminLayout({ children, apiKey, apiPath, adminPath = "/admin/blog" }) {
+function AdminLayout({ children, apiKey, apiPath, adminPath = "/admin/blog", basePath = "/blog" }) {
   const [isAuthenticated, setIsAuthenticated] = react.useState(false);
   const [inputKey, setInputKey] = react.useState("");
   const [sidebarOpen, setSidebarOpen] = react.useState(true);
@@ -111,7 +118,10 @@ function AdminLayout({ children, apiKey, apiPath, adminPath = "/admin/blog" }) {
     if (apiPath) {
       setApiBase(apiPath);
     }
-  }, [apiPath]);
+    if (basePath) {
+      setBasePath(basePath);
+    }
+  }, [apiPath, basePath]);
   react.useEffect(() => {
     if (typeof window !== "undefined") {
       setCurrentPath(window.location.pathname);
@@ -449,7 +459,7 @@ function PostList() {
           /* @__PURE__ */ jsxRuntime.jsx(
             "a",
             {
-              href: `/blog/${post.slug}`,
+              href: `${getBasePath()}/${post.slug}`,
               target: "_blank",
               rel: "noopener noreferrer",
               className: "nbk-btn nbk-btn-sm",
@@ -997,6 +1007,7 @@ function BlogEditor({
   const lastSavedRef = react.useRef("");
   const defaultUpload = react.useCallback(async (file) => {
     if (!uploadImage) {
+      console.warn("[NextBlogKit] No uploadImage handler provided. Using blob URL \u2014 image will not persist across page reloads. Configure Cloudflare R2 for persistent image storage.");
       return { url: URL.createObjectURL(file), alt: file.name };
     }
     return uploadImage(file);
@@ -1450,7 +1461,7 @@ function stripTags(html) {
 function slugify(text) {
   return text.toLowerCase().trim().replace(/[^\w\s-]/g, "").replace(/[\s_]+/g, "-").replace(/-+/g, "-");
 }
-function SEOPanel({ seo, onChange, title, slug, excerpt }) {
+function SEOPanel({ seo, onChange, title, slug, excerpt, basePath = "/blog" }) {
   const metaTitle = seo.metaTitle || "";
   const metaDescription = seo.metaDescription || "";
   const focusKeyword = seo.focusKeyword || "";
@@ -1459,7 +1470,7 @@ function SEOPanel({ seo, onChange, title, slug, excerpt }) {
   const noIndex = seo.noIndex || false;
   const displayTitle = metaTitle || title || "Post Title";
   const displayDesc = metaDescription || excerpt || "Post description will appear here...";
-  const displayUrl = `/blog/${slug || "post-url"}`;
+  const displayUrl = `${basePath}/${slug || "post-url"}`;
   const titleLength = displayTitle.length;
   const descLength = displayDesc.length;
   const titleColor = titleLength >= 50 && titleLength <= 60 ? "nbk-count-good" : titleLength > 70 ? "nbk-count-bad" : "nbk-count-warn";
@@ -1671,10 +1682,20 @@ function PostEditor({ postId }) {
     [postId]
   );
   const uploadImage = async (file) => {
-    const formData = new FormData();
-    formData.append("file", file);
-    const res = await api.post("/media", formData);
-    return { url: res.data.url, alt: res.data.alt || file.name };
+    try {
+      const formData = new FormData();
+      formData.append("file", file);
+      const res = await api.post("/media", formData);
+      return { url: res.data.url, alt: res.data.alt || file.name };
+    } catch (err) {
+      const msg = err.message || "Upload failed";
+      if (msg.includes("R2") || msg.includes("STORAGE_NOT_CONFIGURED")) {
+        setError("Image upload requires Cloudflare R2 configuration. Set R2 environment variables or use an external image URL instead.");
+      } else {
+        setError(msg);
+      }
+      throw err;
+    }
   };
   if (loading) {
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "nbk-post-editor", children: [
@@ -1896,7 +1917,8 @@ function PostEditor({ postId }) {
               onChange: setSeo,
               title,
               slug,
-              excerpt
+              excerpt,
+              basePath: getBasePath()
             }
           )
         ] })
@@ -2255,6 +2277,333 @@ function CategoryManager() {
     ] })
   ] });
 }
+function ApiTokensSection() {
+  const api = useAdminApi();
+  const [tokens, setTokens] = react.useState([]);
+  const [loading, setLoading] = react.useState(true);
+  const [tokenName, setTokenName] = react.useState("");
+  const [generating, setGenerating] = react.useState(false);
+  const [newToken, setNewToken] = react.useState("");
+  const [copied, setCopied] = react.useState(false);
+  const [error, setError] = react.useState("");
+  const [showDialog, setShowDialog] = react.useState(false);
+  const [revoking, setRevoking] = react.useState(null);
+  const fetchTokens = react.useCallback(async () => {
+    try {
+      const res = await api.get("/tokens");
+      setTokens(res.data || []);
+    } catch (err) {
+      setError(err.message || "Failed to load tokens");
+    } finally {
+      setLoading(false);
+    }
+  }, []);
+  react.useEffect(() => {
+    fetchTokens();
+  }, [fetchTokens]);
+  const handleGenerate = async () => {
+    if (!tokenName.trim()) return;
+    setGenerating(true);
+    setError("");
+    try {
+      const res = await api.post("/tokens", { name: tokenName.trim() });
+      setNewToken(res.data.plainToken);
+      setTokenName("");
+      fetchTokens();
+    } catch (err) {
+      setError(err.message || "Failed to generate token");
+    } finally {
+      setGenerating(false);
+    }
+  };
+  const handleRevoke = async (id) => {
+    if (!confirm("Are you sure you want to revoke this token? Any integrations using it will stop working.")) return;
+    setRevoking(id);
+    setError("");
+    try {
+      await api.del(`/tokens?id=${id}`);
+      setTokens((prev) => prev.filter((t) => t._id !== id));
+    } catch (err) {
+      setError(err.message || "Failed to revoke token");
+    } finally {
+      setRevoking(null);
+    }
+  };
+  const copyToken = () => {
+    navigator.clipboard.writeText(newToken);
+    setCopied(true);
+    setTimeout(() => setCopied(false), 2e3);
+  };
+  const formatDate = (d) => {
+    if (!d) return "Never";
+    return new Date(d).toLocaleDateString("en-US", {
+      month: "short",
+      day: "numeric",
+      year: "numeric",
+      hour: "2-digit",
+      minute: "2-digit"
+    });
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "nbk-settings-section", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "nbk-section-title", children: "API Tokens" }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { style: { color: "var(--nbk-text-muted)", fontSize: "0.875rem", marginBottom: "1rem" }, children: "Generate tokens for external services (CI pipelines, automation tools, CMS integrations). Tokens can access the API like the master key but cannot manage other tokens." }),
+    error && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "nbk-error", style: { marginBottom: "1rem" }, children: error }),
+    newToken && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: {
+      background: "var(--nbk-bg-secondary)",
+      border: "1px solid var(--nbk-warning, #f59e0b)",
+      borderRadius: "var(--nbk-radius)",
+      padding: "1rem",
+      marginBottom: "1rem"
+    }, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontWeight: 600, marginBottom: "0.5rem", color: "var(--nbk-warning, #f59e0b)" }, children: "Save this token \u2014 it will only be shown once" }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", gap: "0.5rem", alignItems: "center" }, children: [
+        /* @__PURE__ */ jsxRuntime.jsx("code", { style: {
+          flex: 1,
+          background: "var(--nbk-bg)",
+          padding: "0.5rem 0.75rem",
+          borderRadius: "var(--nbk-radius)",
+          border: "1px solid var(--nbk-border)",
+          fontSize: "0.813rem",
+          fontFamily: "var(--nbk-font-code)",
+          wordBreak: "break-all"
+        }, children: newToken }),
+        /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: copyToken, className: "nbk-btn nbk-btn-primary", style: { whiteSpace: "nowrap" }, children: copied ? "Copied!" : "Copy" })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          onClick: () => setNewToken(""),
+          style: {
+            marginTop: "0.5rem",
+            background: "none",
+            border: "none",
+            color: "var(--nbk-text-muted)",
+            cursor: "pointer",
+            fontSize: "0.813rem",
+            padding: 0
+          },
+          children: "Dismiss"
+        }
+      )
+    ] }),
+    !showDialog ? /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => setShowDialog(true), className: "nbk-btn nbk-btn-primary", style: { marginBottom: "1rem" }, children: "Generate New Token" }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { style: {
+      display: "flex",
+      gap: "0.5rem",
+      marginBottom: "1rem",
+      alignItems: "flex-end"
+    }, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { flex: 1 }, children: [
+        /* @__PURE__ */ jsxRuntime.jsx("label", { className: "nbk-label", children: "Token Name" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "input",
+          {
+            type: "text",
+            value: tokenName,
+            onChange: (e) => setTokenName(e.target.value),
+            className: "nbk-input",
+            placeholder: "e.g. CI Pipeline, n8n Automation",
+            onKeyDown: (e) => e.key === "Enter" && handleGenerate(),
+            autoFocus: true
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: handleGenerate, className: "nbk-btn nbk-btn-primary", disabled: generating || !tokenName.trim(), children: generating ? "Generating..." : "Generate" }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          onClick: () => {
+            setShowDialog(false);
+            setTokenName("");
+          },
+          className: "nbk-btn",
+          style: { background: "var(--nbk-bg-secondary)", border: "1px solid var(--nbk-border)" },
+          children: "Cancel"
+        }
+      )
+    ] }),
+    loading ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { color: "var(--nbk-text-muted)" }, children: "Loading tokens..." }) : tokens.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { color: "var(--nbk-text-muted)", fontSize: "0.875rem" }, children: "No API tokens generated yet." }) : /* @__PURE__ */ jsxRuntime.jsx("div", { style: { overflowX: "auto" }, children: /* @__PURE__ */ jsxRuntime.jsxs("table", { style: {
+      width: "100%",
+      borderCollapse: "collapse",
+      fontSize: "0.875rem"
+    }, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsxs("tr", { style: { borderBottom: "2px solid var(--nbk-border)" }, children: [
+        /* @__PURE__ */ jsxRuntime.jsx("th", { style: { textAlign: "left", padding: "0.5rem 0.75rem", fontWeight: 600 }, children: "Name" }),
+        /* @__PURE__ */ jsxRuntime.jsx("th", { style: { textAlign: "left", padding: "0.5rem 0.75rem", fontWeight: 600 }, children: "Key Prefix" }),
+        /* @__PURE__ */ jsxRuntime.jsx("th", { style: { textAlign: "left", padding: "0.5rem 0.75rem", fontWeight: 600 }, children: "Last Used" }),
+        /* @__PURE__ */ jsxRuntime.jsx("th", { style: { textAlign: "left", padding: "0.5rem 0.75rem", fontWeight: 600 }, children: "Created" }),
+        /* @__PURE__ */ jsxRuntime.jsx("th", { style: { textAlign: "right", padding: "0.5rem 0.75rem", fontWeight: 600 } })
+      ] }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: tokens.map((t) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { style: { borderBottom: "1px solid var(--nbk-border)" }, children: [
+        /* @__PURE__ */ jsxRuntime.jsx("td", { style: { padding: "0.5rem 0.75rem" }, children: t.name }),
+        /* @__PURE__ */ jsxRuntime.jsx("td", { style: { padding: "0.5rem 0.75rem" }, children: /* @__PURE__ */ jsxRuntime.jsxs("code", { style: { fontFamily: "var(--nbk-font-code)", fontSize: "0.813rem" }, children: [
+          t.prefix,
+          "..."
+        ] }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("td", { style: { padding: "0.5rem 0.75rem", color: "var(--nbk-text-muted)" }, children: formatDate(t.lastUsedAt) }),
+        /* @__PURE__ */ jsxRuntime.jsx("td", { style: { padding: "0.5rem 0.75rem", color: "var(--nbk-text-muted)" }, children: formatDate(t.createdAt) }),
+        /* @__PURE__ */ jsxRuntime.jsx("td", { style: { padding: "0.5rem 0.75rem", textAlign: "right" }, children: /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            onClick: () => handleRevoke(t._id),
+            disabled: revoking === t._id,
+            style: {
+              background: "none",
+              border: "1px solid var(--nbk-danger, #ef4444)",
+              color: "var(--nbk-danger, #ef4444)",
+              padding: "0.25rem 0.75rem",
+              borderRadius: "var(--nbk-radius)",
+              cursor: "pointer",
+              fontSize: "0.813rem"
+            },
+            children: revoking === t._id ? "Revoking..." : "Revoke"
+          }
+        ) })
+      ] }, t._id)) })
+    ] }) })
+  ] });
+}
+function ApiReferenceSection() {
+  const [open, setOpen] = react.useState(false);
+  const [copiedCurl, setCopiedCurl] = react.useState(false);
+  const [copiedJson, setCopiedJson] = react.useState(false);
+  const sampleJson = `{
+  "title": "My Blog Post",
+  "content": [{ "type": "paragraph", "content": [{ "type": "text", "text": "Hello world!" }] }],
+  "contentHTML": "<p>Hello world!</p>",
+  "excerpt": "A short summary of the post",
+  "status": "published",
+  "categories": ["tech"],
+  "tags": ["nextjs", "blog"],
+  "author": {
+    "name": "John Doe",
+    "bio": "Software engineer",
+    "avatar": "https://example.com/avatar.jpg"
+  },
+  "seo": {
+    "metaTitle": "My Blog Post | MySite",
+    "metaDescription": "A short summary for search engines",
+    "focusKeyword": "blog post"
+  }
+}`;
+  const sampleCurl = `curl -X POST https://yoursite.com/api/blog/posts \\
+  -H "Authorization: Bearer nbk_your-token-here" \\
+  -H "Content-Type: application/json" \\
+  -d '{ "title": "My Post", "content": [{"type":"paragraph","content":[{"type":"text","text":"Hello!"}]}], "contentHTML": "<p>Hello!</p>", "status": "published" }'`;
+  const copyText = (text, setCopied) => {
+    navigator.clipboard.writeText(text);
+    setCopied(true);
+    setTimeout(() => setCopied(false), 2e3);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "nbk-settings-section", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "h2",
+      {
+        className: "nbk-section-title",
+        onClick: () => setOpen(!open),
+        style: { cursor: "pointer", userSelect: "none", display: "flex", alignItems: "center", gap: "0.5rem" },
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { style: { transform: open ? "rotate(90deg)" : "rotate(0deg)", transition: "transform 0.2s", display: "inline-block" }, children: "\u25B6" }),
+          "API Reference"
+        ]
+      }
+    ),
+    open && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginTop: "1rem" }, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h3", { style: { fontSize: "0.938rem", fontWeight: 600, marginBottom: "0.75rem" }, children: "Create Post \u2014 POST /api/blog/posts" }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: "1rem" }, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: "0.25rem" }, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "0.813rem", fontWeight: 600, color: "var(--nbk-text-muted)" }, children: "Sample JSON Body" }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              onClick: () => copyText(sampleJson, setCopiedJson),
+              style: {
+                background: "none",
+                border: "1px solid var(--nbk-border)",
+                borderRadius: "var(--nbk-radius)",
+                padding: "0.125rem 0.5rem",
+                cursor: "pointer",
+                fontSize: "0.75rem",
+                color: "var(--nbk-text-muted)"
+              },
+              children: copiedJson ? "Copied!" : "Copy"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("pre", { style: {
+          background: "var(--nbk-bg-secondary)",
+          border: "1px solid var(--nbk-border)",
+          borderRadius: "var(--nbk-radius)",
+          padding: "0.75rem",
+          overflow: "auto",
+          fontSize: "0.813rem",
+          fontFamily: "var(--nbk-font-code)",
+          lineHeight: 1.5,
+          maxHeight: "400px"
+        }, children: sampleJson })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: "1rem" }, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: "0.25rem" }, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "0.813rem", fontWeight: 600, color: "var(--nbk-text-muted)" }, children: "Sample curl Command" }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              onClick: () => copyText(sampleCurl, setCopiedCurl),
+              style: {
+                background: "none",
+                border: "1px solid var(--nbk-border)",
+                borderRadius: "var(--nbk-radius)",
+                padding: "0.125rem 0.5rem",
+                cursor: "pointer",
+                fontSize: "0.75rem",
+                color: "var(--nbk-text-muted)"
+              },
+              children: copiedCurl ? "Copied!" : "Copy"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("pre", { style: {
+          background: "var(--nbk-bg-secondary)",
+          border: "1px solid var(--nbk-border)",
+          borderRadius: "var(--nbk-radius)",
+          padding: "0.75rem",
+          overflow: "auto",
+          fontSize: "0.813rem",
+          fontFamily: "var(--nbk-font-code)",
+          lineHeight: 1.5
+        }, children: sampleCurl })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("h3", { style: { fontSize: "0.938rem", fontWeight: 600, marginBottom: "0.75rem" }, children: "Field Reference" }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { style: { overflowX: "auto" }, children: /* @__PURE__ */ jsxRuntime.jsxs("table", { style: { width: "100%", borderCollapse: "collapse", fontSize: "0.813rem" }, children: [
+        /* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsxs("tr", { style: { borderBottom: "2px solid var(--nbk-border)" }, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("th", { style: { textAlign: "left", padding: "0.5rem 0.75rem", fontWeight: 600 }, children: "Field" }),
+          /* @__PURE__ */ jsxRuntime.jsx("th", { style: { textAlign: "left", padding: "0.5rem 0.75rem", fontWeight: 600 }, children: "Type" }),
+          /* @__PURE__ */ jsxRuntime.jsx("th", { style: { textAlign: "left", padding: "0.5rem 0.75rem", fontWeight: 600 }, children: "Required" }),
+          /* @__PURE__ */ jsxRuntime.jsx("th", { style: { textAlign: "left", padding: "0.5rem 0.75rem", fontWeight: 600 }, children: "Description" })
+        ] }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: [
+          ["title", "string", "Yes", "Post title"],
+          ["content", "BlockContent[]", "No", "TipTap JSON content blocks"],
+          ["contentHTML", "string", "No", "HTML version of the content"],
+          ["excerpt", "string", "No", "Short summary (auto-generated if omitted)"],
+          ["slug", "string", "No", "URL slug (auto-generated from title if omitted)"],
+          ["status", '"draft" | "published" | "scheduled"', "No", 'Defaults to "draft"'],
+          ["categories", "string[]", "No", "Category slugs"],
+          ["tags", "string[]", "No", "Tag strings"],
+          ["author", "{ name, bio?, avatar?, url? }", "No", "Post author info"],
+          ["seo", "{ metaTitle?, metaDescription?, focusKeyword?, ... }", "No", "SEO metadata"],
+          ["coverImage", "{ _id, url, alt?, caption? }", "No", "Cover image reference"],
+          ["publishedAt", "ISO date string", "No", 'Publish date (auto-set when status is "published")'],
+          ["scheduledAt", "ISO date string", "No", "Schedule date for future publishing"]
+        ].map(([field, type, required, desc]) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { style: { borderBottom: "1px solid var(--nbk-border)" }, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("td", { style: { padding: "0.5rem 0.75rem" }, children: /* @__PURE__ */ jsxRuntime.jsx("code", { style: { fontFamily: "var(--nbk-font-code)", fontSize: "0.813rem" }, children: field }) }),
+          /* @__PURE__ */ jsxRuntime.jsx("td", { style: { padding: "0.5rem 0.75rem", color: "var(--nbk-text-muted)" }, children: type }),
+          /* @__PURE__ */ jsxRuntime.jsx("td", { style: { padding: "0.5rem 0.75rem" }, children: required }),
+          /* @__PURE__ */ jsxRuntime.jsx("td", { style: { padding: "0.5rem 0.75rem", color: "var(--nbk-text-muted)" }, children: desc })
+        ] }, field)) })
+      ] }) })
+    ] })
+  ] });
+}
 function SettingsPage() {
   const api = useAdminApi();
   const [settings, setSettings] = react.useState({});
@@ -2447,6 +2796,11 @@ function SettingsPage() {
           placeholder: "/* Custom CSS styles */"
         }
       ) })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginTop: "2rem" }, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "nbk-page-title", style: { fontSize: "1.25rem", marginBottom: "1rem" }, children: "API Access" }),
+      /* @__PURE__ */ jsxRuntime.jsx(ApiTokensSection, {}),
+      /* @__PURE__ */ jsxRuntime.jsx(ApiReferenceSection, {})
     ] })
   ] });
 }
@@ -2459,7 +2813,9 @@ exports.PostEditor = PostEditor;
 exports.PostList = PostList;
 exports.SEOPanel = SEOPanel;
 exports.SettingsPage = SettingsPage;
+exports.getBasePath = getBasePath;
 exports.setApiBase = setApiBase;
+exports.setBasePath = setBasePath;
 exports.useAdminApi = useAdminApi;
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map