@kyro-cms/admin 0.12.5 → 0.12.7

package/src/integration.ts

@@ -70,7 +70,7 @@ export function kyroAdmin(options: KyroAdminOptions = {}): AstroIntegration {
             sourcemap: false,
             loader: { '.ts': 'ts', '.tsx': 'tsx' },
             resolveExtensions: ['.ts', '.tsx', '.js', '.jsx', '.mjs', '.cjs', '.json'],
-            external: ['@kyro-cms/*'],
+            external: ['@kyro-cms/*', '@ai-sdk/*'],
           });
           tmpFile = resolvedConfig.replace(/\.ts$/, ".admin.mjs");
           fs.writeFileSync(tmpFile, result.outputFiles[0].text, "utf8");
@@ -101,6 +101,10 @@ export function kyroAdmin(options: KyroAdminOptions = {}): AstroIntegration {
                 collections: serialize(cfg?.collections) || [],
                 globals: serialize(cfg?.globals) || [],
                 collectionOverrides: serialize(cfg?.admin?.collectionOverrides) || {},
+                plugins: (cfg?.plugins || []).map((p: any) => ({
+                  name: p.name,
+                  adminEntry: p.adminEntry
+                }))
               });
             }).catch(err => {
               parentPort.postMessage({ error: err.message });
@@ -128,17 +132,21 @@ export function kyroAdmin(options: KyroAdminOptions = {}): AstroIntegration {
             { name: "metaDescription", type: "textarea", label: "Meta Description", admin: { description: "A brief summary for search engines (recommended < 160 chars).", autoGenerate: "content" } },
             { name: "keywords", type: "text", label: "Keywords", admin: { description: "Comma-separated list of keywords for this page." } },
             { name: "ogImage", type: "upload", label: "OpenGraph Image", relationTo: "media", admin: { description: "The image shown when shared on social media." } },
-            { name: "twitter", type: "group", label: "Twitter Card", fields: [
-              { name: "title", type: "text", label: "Twitter Title" },
-              { name: "description", type: "textarea", label: "Twitter Description" },
-              { name: "image", type: "upload", label: "Twitter Image", relationTo: "media" },
-            ]},
-            { name: "advanced", type: "group", label: "Advanced Search Settings", fields: [
-              { name: "noindex", type: "checkbox", label: "Hide from search engines (noindex)", defaultValue: false },
-              { name: "nofollow", type: "checkbox", label: "Do not follow links (nofollow)", defaultValue: false },
-              { name: "canonicalUrl", type: "text", label: "Canonical URL Override", admin: { description: "Leave empty to use the default canonical URL." } },
-              { name: "structuredData", type: "code", label: "JSON-LD Structured Data", admin: { description: "Custom JSON-LD schema for this specific page." } },
-            ]},
+            {
+              name: "twitter", type: "group", label: "Twitter Card", fields: [
+                { name: "title", type: "text", label: "Twitter Title" },
+                { name: "description", type: "textarea", label: "Twitter Description" },
+                { name: "image", type: "upload", label: "Twitter Image", relationTo: "media" },
+              ]
+            },
+            {
+              name: "advanced", type: "group", label: "Advanced Search Settings", fields: [
+                { name: "noindex", type: "checkbox", label: "Hide from search engines (noindex)", defaultValue: false },
+                { name: "nofollow", type: "checkbox", label: "Do not follow links (nofollow)", defaultValue: false },
+                { name: "canonicalUrl", type: "text", label: "Canonical URL Override", admin: { description: "Leave empty to use the default canonical URL." } },
+                { name: "structuredData", type: "code", label: "JSON-LD Structured Data", admin: { description: "Custom JSON-LD schema for this specific page." } },
+              ]
+            },
           ];
           for (const col of (configResult.collections || [])) {
             if (col.seo) {
@@ -165,6 +173,36 @@ export function kyroAdmin(options: KyroAdminOptions = {}): AstroIntegration {
           vite: {
             plugins: [
               useSyncExternalStoreShimPlugin(),
+              {
+                name: "kyro-plugins-virtual",
+                resolveId(id: string) {
+                  if (id === "virtual:kyro-plugins") {
+                    return "\0virtual:kyro-plugins";
+                  }
+                },
+                load(id: string) {
+                  if (id === "\0virtual:kyro-plugins") {
+                    try {
+                      const configData = JSON.parse(fs.readFileSync(configFile, "utf8"));
+                      const pluginsWithAdmin = (configData.plugins || []).filter((p: any) => p.adminEntry);
+
+                      let imports = `import { lazy } from 'react';\n`;
+                      let views = `export const pluginViews = {\n`;
+
+                      for (const p of pluginsWithAdmin) {
+                        // Vite requires absolute paths for local files or bare specifiers for packages
+                        views += `  '${p.name}': lazy(() => import('${p.adminEntry}')),\n`;
+                      }
+
+                      views += `};\n`;
+                      const configExport = `export const projectConfig = ${JSON.stringify(configData)};\n`;
+                      return imports + views + configExport;
+                    } catch (e) {
+                      return `export const pluginViews = {};\nexport const projectConfig = null;\n`;
+                    }
+                  }
+                }
+              },
               {
                 name: "kyro-admin-tsx-loader",
                 enforce: "pre" as const,
@@ -235,22 +273,22 @@ export default debug;
             optimizeDeps: {
               include: [
                 '@kyro-cms/admin',
-                'recharts',
-                'recharts > recharts-scale',
-                'recharts > recharts-scale > decimal.js-light',
-                'recharts > react-smooth',
-                'recharts > react-smooth > react-transition-group',
-                'use-sync-external-store',
-                'use-sync-external-store/with-selector.js',
-                'react-i18next > html-parse-stringify > void-elements',
-                'react-i18next > html-parse-stringify',
+                '@kyro-cms/admin > recharts',
+                '@kyro-cms/admin > recharts > recharts-scale',
+                '@kyro-cms/admin > recharts > recharts-scale > decimal.js-light',
+                '@kyro-cms/admin > recharts > react-smooth',
+                '@kyro-cms/admin > recharts > react-smooth > react-transition-group',
+                '@kyro-cms/admin > react-i18next',
+                '@kyro-cms/admin > react-i18next > html-parse-stringify',
+                '@kyro-cms/admin > react-i18next > html-parse-stringify > void-elements',
+                '@kyro-cms/admin > use-sync-external-store',
+                '@kyro-cms/admin > use-sync-external-store/with-selector.js',
               ],
               needsInterop: [
-                'decimal.js-light',
-                'use-sync-external-store',
-                'use-sync-external-store/with-selector.js',
-                'react-i18next > html-parse-stringify > void-elements',
-                'react-i18next > html-parse-stringify',
+                '@kyro-cms/admin > recharts > recharts-scale > decimal.js-light',
+                '@kyro-cms/admin > react-i18next > html-parse-stringify > void-elements',
+                '@kyro-cms/admin > use-sync-external-store',
+                '@kyro-cms/admin > use-sync-external-store/with-selector.js',
               ],
               exclude: ['debug', 'react/compiler-runtime'],
             },

package/src/lib/api.ts

@@ -35,6 +35,7 @@ export async function fetchWithAuth(
   if (!(options.body instanceof FormData)) {
     headers["Content-Type"] = "application/json";
   }
+  headers["x-kyro-admin"] = "true";
   Object.assign(headers, options.headers as Record<string, string> | undefined);
 
   const response = await fetch(resolveApi(url), {

package/src/lib/config.ts

@@ -1,4 +1,5 @@
-import type { AdminConfig, CollectionConfig, GlobalConfig } from "@kyro-cms/core/client";
+import type { CollectionConfig, GlobalConfig } from "@kyro-cms/core/client";
+import type { AdminConfig } from "./core-types";
 import {
   blogCollections,
   ecommerceCollections,
@@ -10,11 +11,7 @@ import {
   allSettingsGlobals,
   coreSettingsGlobals,
 } from "@kyro-cms/core/templates";
-import fs from "fs";
-
-// Injected by Vite's define config — exact path to the serialized config JSON.
-declare const __KYRO_ADMIN_CONFIG_FILE__: string;
-
+import { projectConfig } from "virtual:kyro-plugins";
 type ConfigCollectionInput =
   | CollectionConfig[]
   | Record<string, CollectionConfig>
@@ -255,26 +252,16 @@ function createProjectAdminConfig(config: {
   };
 }
 
-// Read config from the JSON file whose path is injected by Vite's define.
-let cachedConfig: { collections: any[]; globals: any[]; collectionOverrides?: Record<string, any> } | null = null;
-
+// Read config from the virtual module injected by our Vite plugin
 function loadProjectConfig() {
-  if (cachedConfig) return cachedConfig;
-  try {
-    if (typeof __KYRO_ADMIN_CONFIG_FILE__ === "string" && fs.existsSync(__KYRO_ADMIN_CONFIG_FILE__)) {
-      cachedConfig = JSON.parse(fs.readFileSync(__KYRO_ADMIN_CONFIG_FILE__, "utf8"));
-      return cachedConfig;
-    }
-  } catch {
-    // fall through to kitchen-sink default
-  }
+  if (projectConfig) return projectConfig;
   return null;
 }
 
 const projectCfg = loadProjectConfig() || { collections: [], globals: [] };
 
 const rawConfig = createProjectAdminConfig(projectCfg);
-applyCollectionAdminOverrides(rawConfig.collections, projectCfg.collectionOverrides);
+applyCollectionAdminOverrides(rawConfig.collections, (projectCfg.collectionOverrides as Record<string, any>) || {});
 
 export const adminConfig = rawConfig;
 export const collections = adminConfig.collections;

package/src/lib/core-types.ts

@@ -0,0 +1,78 @@
+/**
+ * Local type declarations for core types that TSC cannot resolve
+ * from the barrel `@kyro-cms/core/client` due to tsup's chunked
+ * .d.ts re-export format.
+ *
+ * These types mirror the definitions in the core source and are
+ * used only for compile-time type checking in the admin package.
+ * At runtime, Vite resolves the actual types correctly.
+ */
+
+/** Minimal BaseField shape needed for IconField/SecretField */
+interface BaseField {
+  type: string;
+  name: string;
+  label?: string;
+  required?: boolean;
+  admin?: Record<string, any>;
+  [key: string]: unknown;
+}
+
+// --- Field Types ---
+
+export interface IconField extends BaseField {
+  type: "icon";
+}
+
+export interface SecretField extends BaseField {
+  type: "secret";
+}
+
+export type DeclarativeCondition =
+  | {
+      field: string;
+      equals?: string | number | boolean;
+      notEquals?: string | number | boolean;
+      in?: (string | number | boolean)[];
+      greaterThan?: number;
+    }
+  | { and: DeclarativeCondition[] }
+  | { or: DeclarativeCondition[] };
+
+// --- Config Types ---
+
+export interface AdminConfig {
+  /** Admin panel title */
+  title?: string;
+  /** Sidebar label override */
+  label?: string;
+  /** Description shown in the admin */
+  description?: string;
+  /** Admin panel icon (lucide icon name) */
+  icon?: string;
+  /** Hide from navigation */
+  hidden?: boolean;
+  /** Default columns shown in the list view */
+  listColumns?: string[];
+  /** Default sort field */
+  defaultSort?: string;
+  /** Enable/disable search */
+  enableSearch?: boolean;
+  /** Custom admin group */
+  group?: string;
+  /** Pagination settings */
+  pagination?: {
+    defaultLimit?: number;
+    limits?: number[];
+  };
+  /** Preview URL function */
+  preview?: (doc: Record<string, any>) => string | null;
+  /** Live preview configuration */
+  livePreview?: {
+    url?: string | ((doc: Record<string, any>) => string);
+  };
+  /** Custom CSS class for the admin view */
+  className?: string;
+  /** Disable create button */
+  disableCreate?: boolean;
+}

package/src/plugins/seo-admin.tsx

@@ -0,0 +1,155 @@
+import React, { useState, useEffect } from 'react';
+import { useToast } from '../index';
+
+export default function SeoSettings() {
+  const [loading, setLoading] = useState(true);
+  const [saving, setSaving] = useState(false);
+  const [docId, setDocId] = useState<string | null>(null);
+
+  const [sitemap, setSitemap] = useState(true);
+  const [robotsTxt, setRobotsTxt] = useState('');
+  const [canonicalUrl, setCanonicalUrl] = useState('');
+  const [ogImage, setOgImage] = useState('');
+
+  const { addToast } = useToast();
+
+  useEffect(() => {
+    const apiPath = (window as any).__KYRO_API_PATH__ || '/api';
+    fetch(`${apiPath}/seo-settings?limit=1`, { credentials: 'include' })
+      .then(res => res.json())
+      .then(resData => {
+        if (resData && resData.docs && resData.docs.length > 0) {
+          const doc = resData.docs[0];
+          setDocId(doc.id);
+          if (doc.sitemap !== undefined) setSitemap(doc.sitemap);
+          if (doc.robotsTxt !== undefined) setRobotsTxt(doc.robotsTxt);
+          if (doc.canonicalUrl !== undefined) setCanonicalUrl(doc.canonicalUrl);
+          if (doc.ogImage !== undefined) setOgImage(doc.ogImage);
+        }
+        setLoading(false);
+      })
+      .catch(err => {
+        console.error('Failed to load SEO settings:', err);
+        setLoading(false);
+      });
+  }, []);
+
+  const handleSave = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setSaving(true);
+
+    const apiPath = (window as any).__KYRO_API_PATH__ || '/api';
+    
+    try {
+      const payload = {
+        sitemap,
+        robotsTxt,
+        canonicalUrl,
+        ogImage
+      };
+
+      let url = `${apiPath}/seo-settings`;
+      let method = 'POST';
+
+      if (docId) {
+        url = `${url}/${docId}`;
+        method = 'PATCH';
+      }
+
+      const res = await fetch(url, {
+        method,
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify(payload),
+        credentials: 'include'
+      });
+
+      if (!res.ok) {
+        throw new Error('Failed to save settings');
+      }
+
+      const data = await res.json();
+      if (data.doc && !docId) {
+        setDocId(data.doc.id);
+      }
+      addToast('success', 'SEO Settings saved successfully!');
+    } catch (err) {
+      console.error(err);
+      addToast('error', 'Error saving settings.');
+    } finally {
+      setSaving(false);
+    }
+  };
+
+  if (loading) {
+    return (
+      <div className="p-8 flex items-center justify-center animate-pulse">
+        <div className="w-8 h-8 rounded-full border-2 border-t-[var(--kyro-primary)] border-[var(--kyro-primary)]/20 animate-spin" />
+      </div>
+    );
+  }
+
+  return (
+    <div className="p-4">
+      <h2 className="text-lg font-bold mb-4">SEO Configuration</h2>
+      <form onSubmit={handleSave} className="space-y-4">
+        
+        {/* Sitemap Checkbox */}
+        <div className="flex items-center gap-3">
+          <input
+            type="checkbox"
+            id="sitemap"
+            checked={sitemap}
+            onChange={(e) => setSitemap(e.target.checked)}
+            className="w-4 h-4 rounded border-[var(--kyro-border)] text-[var(--kyro-primary)] focus:ring-[var(--kyro-primary)]"
+          />
+          <label htmlFor="sitemap" className="text-sm font-medium text-[var(--kyro-text)]">
+            Enable Sitemap Generation
+          </label>
+        </div>
+
+        {/* Canonical URL */}
+        <div className="space-y-1.5">
+          <label className="text-xs font-medium text-[var(--kyro-text)]">Canonical URL</label>
+          <input
+            type="url"
+            value={canonicalUrl}
+            onChange={(e) => setCanonicalUrl(e.target.value)}
+            className="w-full px-3 py-1.5 bg-[var(--kyro-bg-secondary)] border border-[var(--kyro-border)] rounded-lg text-sm focus:border-[var(--kyro-primary)] focus:ring-1 focus:ring-[var(--kyro-primary)] outline-none transition-all"
+            placeholder="https://example.com"
+          />
+        </div>
+
+        {/* Default OG Image */}
+        <div className="space-y-1.5">
+          <label className="text-xs font-medium text-[var(--kyro-text)]">Default OG Image URL</label>
+          <input
+            type="text"
+            value={ogImage}
+            onChange={(e) => setOgImage(e.target.value)}
+            className="w-full px-3 py-1.5 bg-[var(--kyro-bg-secondary)] border border-[var(--kyro-border)] rounded-lg text-sm focus:border-[var(--kyro-primary)] focus:ring-1 focus:ring-[var(--kyro-primary)] outline-none transition-all"
+            placeholder="/images/og-default.jpg"
+          />
+        </div>
+
+        {/* robots.txt Content */}
+        <div className="space-y-1.5">
+          <label className="text-xs font-medium text-[var(--kyro-text)]">robots.txt Content</label>
+          <textarea
+            value={robotsTxt}
+            onChange={(e) => setRobotsTxt(e.target.value)}
+            className="w-full h-24 px-3 py-2 bg-[var(--kyro-bg-secondary)] border border-[var(--kyro-border)] rounded-lg text-sm focus:border-[var(--kyro-primary)] focus:ring-1 focus:ring-[var(--kyro-primary)] outline-none transition-all font-mono"
+            placeholder="User-agent: *&#10;Allow: /"
+          />
+        </div>
+
+        <button
+          type="submit"
+          disabled={saving}
+          className="w-full py-2 mt-2 bg-[var(--kyro-primary)] text-white font-bold rounded-lg shadow-md shadow-[var(--kyro-primary)]/20 hover:opacity-90 transition-opacity disabled:opacity-50 text-sm"
+        >
+          {saving ? 'Saving...' : 'Save Settings'}
+        </button>
+      </form>
+    </div>
+  );
+}

package/src/styles/main.css

@@ -39,6 +39,7 @@
 
   /* Semantic UI */
   --kyro-border: #f3f4f6;
+  --kyro-border-strong: #d1d5db;
   --kyro-input-bg: #ffffff;
   --kyro-input-border: #e5e7eb;
 
@@ -91,6 +92,7 @@
   --kyro-text-muted: #71717a;
 
   --kyro-border: rgba(255, 255, 255, 0.08);
+  --kyro-border-strong: rgba(255, 255, 255, 0.18);
   --kyro-input-bg: #1c1c1c;
   --kyro-input-border: rgba(255, 255, 255, 0.1);
 

package/src/vite-env.d.ts

@@ -9,6 +9,15 @@ declare module "graphiql/graphiql.css" {
 }
 
 declare module "react-image-crop/dist/ReactCrop.css" {
-  const content: string;
+  const content: Record<string, string>;
   export default content;
 }
+
+declare module "virtual:kyro-plugins" {
+  import type { LazyExoticComponent, ComponentType } from "react";
+  export const pluginViews: Record<
+    string,
+    LazyExoticComponent<ComponentType<any>>
+  >;
+  export const projectConfig: any;
+}